@50arms/ui 0.0.0-stage → 35.1.0

package/dist/components/rbac/AccountMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccountMenu.js","sources":["../../../src/components/rbac/AccountMenu.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Avatar } from \"../Avatar\";\nimport { Badge } from \"../Badge\";\nimport { Icon, type IconName } from \"../Icon\";\nimport { Popover, PopoverClose } from \"../Popover\";\nimport { cn } from \"../../lib/cn\";\nimport { emphasis, useUiStrings } from \"../../lib/i18n\";\nimport { useRBAC } from \"./RBACProvider\";\n\n/* ============================================================================\n   ACCOUNT MENU\n\n   Button trigger + Popover content, the exact shape `ThemeMenu` uses — read\n   that file first if this one looks unfamiliar. The header avatar is the\n   trigger; the popup is content, not a list of commands, which is why this is\n   built on `Popover` rather than `Menu` (see the block comment atop\n   `Popover.tsx` for that distinction). A couple of these rows genuinely need a\n   focused, keyboard-reachable control (a team picker) rather than a single-select action list.\n\n   NO ROUTER. This library has no opinion on how a consumer navigates, so\n   \"Profile\" and \"Roles & Permissions\" are optional callbacks rather than\n   links — supply the one that makes sense for your router (or none, and the\n   row simply does not render). `PopoverClose` wraps every row that FIRES a\n   callback so choosing an action also dismisses the menu; it is deliberately\n   NOT wrapped around the plain-text role line when no callback is supplied.\n   ========================================================================= */\n\nconst ITEM = [\n  \"dx-tap flex w-full items-center gap-2.5 rounded-md px-2.5 py-2\",\n  \"text-left text-sm text-secondary outline-none\",\n  \"transition-[var(--tx-colors)] duration-(--dur-instant)\",\n  \"hover:bg-surface-hover hover:text-primary\",\n  \"focus-visible:bg-surface-hover focus-visible:text-primary\",\n];\n\nconst SECTION_LABEL = \"text-2xs font-semibold tracking-widest text-tertiary uppercase\";\n\n/** DX-4067 — one titled block inside the menu, drawn exactly like the built-in \"Your access\" block so a consumer's extra section cannot look foreign. */\nexport function AccountMenuSection({ title, children }: { title: string; children: ReactNode }) {\n  return (\n    <div className=\"flex flex-col gap-1.5 border-t border-border-subtle px-1 py-3\">\n      <span className={SECTION_LABEL}>{title}</span>\n      {children}\n    </div>\n  );\n}\n\n/** DX-5319 - one header control that no longer fits the header and lives in the account menu instead. */\nexport interface AccountMenuAction {\n  id: string;\n  label: string;\n  icon: IconName;\n  /** Runs when the row is chosen; the menu closes with it (`PopoverClose`), so what it opens (a dialog, a page) is not left under the popover. */\n  onSelect: () => void;\n  /**\n   * DX-5319 - a count the control's header button carried (unread replies), kept on its row so folding it does not hide the number.\n   * `label` is required: the chip is a number with no words, so the row's assistive name needs them (the same reason `BadgeDismiss.label` is).\n   * Omitted, or `value` of 0 -> no chip.\n   */\n  badge?: { value: number; label: string };\n}\n\nexport interface AccountMenuProps {\n  /**\n   * DX-5319 - header controls folded into the menu because the header ran out of room (`useHeaderFold`), as the first group of\n   * rows, in the order given. The consumer passes only the controls that are folded right now, so a control is in the header\n   * or in this list, never both and never neither. Omitted or empty -> no group.\n   */\n  actions?: AccountMenuAction[];\n  /** DX-4067 — a mark beside the person's name in the header (a \"Beta\" badge). Presentational: the menu only places it. */\n  nameBadge?: ReactNode;\n  /** DX-4067 — extra blocks, drawn after \"Your access\". Wrap each in `AccountMenuSection`. */\n  sections?: ReactNode;\n  /** DX-4067 — a muted line at the very bottom (the running version). Omitted → no footer. */\n  footer?: ReactNode;\n  onNavigateProfile?: () => void;\n  onNavigateRoles?: () => void;\n  /** Where the role line leads — the page listing every granted permission. Omitted → the line is plain text. */\n  onNavigateAccess?: () => void;\n  onSwitchTeam?: (teamId: string) => void;\n  onSignOut?: () => void;\n  className?: string;\n}\n\nexport function AccountMenu({\n  actions,\n  nameBadge,\n  sections,\n  footer,\n  onNavigateProfile,\n  onNavigateRoles,\n  onNavigateAccess,\n  onSwitchTeam,\n  onSignOut,\n  className,\n}: AccountMenuProps) {\n  const strings = useUiStrings().accountMenu;\n  const { actualUser, effectiveRole, teams } = useRBAC();\n\n  /* The trigger always shows `actualUser` — never `effectiveRole`'s owner,\n     because impersonation swaps ROLE, not IDENTITY. There is no \"become a\n     different person\" concept anywhere in the type contract (`types.ts`);\n     the avatar in the header is always, unambiguously, whoever is really\n     signed in. */\n\n  return (\n    <Popover\n      align=\"end\"\n      width=\"calc(20rem*var(--ui-scale))\"\n      className={className}\n      trigger={\n        <button\n          type=\"button\"\n          aria-label={strings.triggerLabel(actualUser.name)}\n          className=\"dx-tap shrink-0 rounded-full transition-[var(--tx-colors),box-shadow] duration-(--dur-fast) ease-hover focus-visible:shadow-[0_0_0_3px_var(--focus-halo)]\"\n        >\n          <Avatar name={actualUser.name} src={actualUser.avatarUrl} size=\"sm\" />\n        </button>\n      }\n    >\n      {/* DX-4086 — the design width lives on the popup (`width` below), which renders at\n          exactly that width capped by the clamp (Popover.tsx), so the panel just fills it. */}\n      <div data-account-menu-panel=\"\" className=\"flex w-full min-w-0 flex-col gap-1\">\n        <div className=\"flex items-center gap-3 px-1 pb-3\">\n          <Avatar name={actualUser.name} src={actualUser.avatarUrl} size=\"md\" />\n          <div className=\"flex min-w-0 flex-col\">\n            <span className=\"flex min-w-0 items-center gap-1.5\">\n              <span className=\"truncate text-sm font-semibold text-primary\">{actualUser.name}</span>\n              {nameBadge}\n            </span>\n            <span className=\"truncate text-xs text-tertiary\">{actualUser.email}</span>\n          </div>\n        </div>\n\n        {actions && actions.length > 0 && (\n          <div data-account-menu-actions=\"\" className=\"flex flex-col gap-0.5 border-t border-border-subtle pt-2 pb-2\">\n            {actions.map((action) => (\n              <PopoverClose key={action.id}>\n                <button type=\"button\" data-action-id={action.id} className={cn(ITEM)} onClick={action.onSelect}>\n                  <Icon name={action.icon} size=\"sm\" />\n                  {action.label}\n                  {action.badge && action.badge.value > 0 && (\n                    <Badge size=\"sm\" tone=\"info\" className=\"ml-auto\" aria-label={action.badge.label} data-action-badge=\"\">\n                      {action.badge.value}\n                    </Badge>\n                  )}\n                </button>\n              </PopoverClose>\n            ))}\n          </div>\n        )}\n\n        {(onNavigateProfile || onNavigateRoles) && (\n          <div className=\"flex flex-col gap-0.5 border-t border-border-subtle pt-2\">\n            {/* An item without its handler simply is not rendered — there is\n                nowhere for it to send the click, and a dead menu row is worse\n                than a shorter menu. */}\n            {onNavigateProfile && (\n              <PopoverClose>\n                <button type=\"button\" className={cn(ITEM)} onClick={onNavigateProfile}>\n                  <Icon name=\"user\" size=\"sm\" />\n                  {strings.profile}\n                </button>\n              </PopoverClose>\n            )}\n            {onNavigateRoles && (\n              <PopoverClose>\n                <button type=\"button\" className={cn(ITEM)} onClick={onNavigateRoles}>\n                  <Icon name=\"shield-check\" size=\"sm\" />\n                  {strings.roles}\n                </button>\n              </PopoverClose>\n            )}\n          </div>\n        )}\n\n        {/* DX-4009: the role is named here and the full permission list lives\n            only on the account page (`ProfilePage`'s \"Your roles &\n            permissions\"), reached through `onNavigateAccess` when supplied.\n            Listing every grant in a header popover scrolled past 30 rows.\n            The line always renders so a person has an answer to \"which role\n            am I acting as\" without leaving the header. */}\n        <div className=\"flex flex-col gap-1.5 border-t border-border-subtle px-1 py-3\">\n          <span className={SECTION_LABEL}>{strings.yourAccess}</span>\n          {effectiveRole ? (\n            onNavigateAccess ? (\n              <PopoverClose>\n                <button\n                  type=\"button\"\n                  className=\"text-left text-xs text-secondary underline-offset-2 outline-none hover:underline focus-visible:underline\"\n                  onClick={onNavigateAccess}\n                >\n                  {strings.hasRole(effectiveRole.label, emphasis)}\n                </button>\n              </PopoverClose>\n            ) : (\n              <p className=\"text-xs text-secondary\">\n                {strings.hasRole(effectiveRole.label, emphasis)}\n              </p>\n            )\n          ) : (\n            <p className=\"text-xs text-tertiary\">{strings.noRole}</p>\n          )}\n        </div>\n\n        {sections}\n\n        {teams.length > 1 && onSwitchTeam && (\n          <div className=\"flex flex-col gap-0.5 border-t border-border-subtle pt-2\">\n            <span className={cn(SECTION_LABEL, \"px-1 pb-1\")}>{strings.switchTeam}</span>\n            {teams.map((team) => (\n              <PopoverClose key={team.id}>\n                <button type=\"button\" className={cn(ITEM)} onClick={() => onSwitchTeam(team.id)}>\n                  <Icon name=\"users\" size=\"sm\" />\n                  {team.name}\n                </button>\n              </PopoverClose>\n            ))}\n          </div>\n        )}\n\n        {onSignOut && (\n          <div className=\"flex flex-col gap-0.5 border-t border-border-subtle pt-2\">\n            <PopoverClose>\n              <button\n                type=\"button\"\n                className={cn(ITEM, \"text-danger-text hover:bg-danger-subtle hover:text-danger-text focus-visible:bg-danger-subtle focus-visible:text-danger-text\")}\n                onClick={onSignOut}\n              >\n                <Icon name=\"log-out\" size=\"sm\" />\n                {strings.signOut}\n              </button>\n            </PopoverClose>\n          </div>\n        )}\n\n        {footer && <div className=\"border-t border-border-subtle px-1 pt-2 text-2xs text-tertiary\">{footer}</div>}\n      </div>\n    </Popover>\n  );\n}\n"],"names":["ITEM","SECTION_LABEL","AccountMenuSection","title","children","jsxs","jsx","AccountMenu","actions","nameBadge","sections","footer","onNavigateProfile","onNavigateRoles","onNavigateAccess","onSwitchTeam","onSignOut","className","strings","useUiStrings","actualUser","effectiveRole","teams","useRBAC","Popover","Avatar","action","PopoverClose","cn","Icon","Badge","emphasis","team"],"mappings":"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"}

package/dist/components/rbac/AgentKeysList.js

@@ -0,0 +1,20 @@
+import { jsx as t } from "react/jsx-runtime";
+import { Icon as f } from "../Icon.js";
+import { TableEmptyState as l } from "../Table.js";
+import { ApiKeysTable as g } from "./ApiKeysTable.js";
+import { useUiStrings as y } from "../../lib/i18n/provider.js";
+function A({ keys: e, onRevoke: r, busyId: o, roleEditor: m, onRevokeGrant: n, renderName: s, renderStatus: p, emptyState: a, className: c }) {
+  const i = y().agentKeysList;
+  return e.length === 0 ? a ?? /* @__PURE__ */ t(
+    l,
+    {
+      icon: /* @__PURE__ */ t(f, { name: "bot", size: "lg", className: "text-tertiary" }),
+      title: i.emptyTitle,
+      description: i.emptyDescription
+    }
+  ) : /* @__PURE__ */ t(g, { keys: e, onRevoke: r, busyId: o, roleEditor: m, onRevokeGrant: n, renderName: s, renderStatus: p, className: c });
+}
+export {
+  A as AgentKeysList
+};
+//# sourceMappingURL=AgentKeysList.js.map

package/dist/components/rbac/AgentKeysList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AgentKeysList.js","sources":["../../../src/components/rbac/AgentKeysList.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Icon } from \"../Icon\";\nimport { TableEmptyState } from \"../Table\";\nimport { useUiStrings } from \"../../lib/i18n\";\nimport { ApiKeysTable, type ApiKey, type KeyRoleEditor } from \"./ApiKeysTable\";\n\n/* ----------------------------------------------------------------------------\n   AGENT KEYS LIST (DX-4425)\n\n   THE KEYS A WORKER OR AN AGENT SESSION MINTED ON A PERSON'S BEHALF, ALONE. They\n   were a second group inside `ApiKeysPanel`, which made a page that wanted only\n   the agent list render a \"Create key\" button and a personal-keys heading it did\n   not own. A person never creates one of these here (an approved access request\n   or a dispatch mints it), so this list has no create flow: rows, a confirmed\n   revoke, and an empty state. It shares its table with `ApiKeysPanel`\n   (`ApiKeysTable`), so the two never disagree about a column.\n\n   `roleEditor` (DX-4427) turns each role badge into an in-place picker, so an\n   agent's permissions can be raised or lowered without revoking it: a revoke is\n   terminal (the agent is told to stop), a role change is not.\n\n   A KEY SHOWS THE PERMISSIONS ADDED TO IT (DX-4433). A key's `grants` are what\n   approved permission requests (`PermissionRequestPanel`) added on top of its\n   role. `onRevokeGrant` makes each removable behind its own confirm, without\n   touching the key or its role.\n\n   A ROW CAN LINK AND SHOW A LIVE STATUS (DX-4487): `renderName` replaces the\n   name text (a router link to what the key belongs to) and `renderStatus` adds\n   a line under it (a worker's readiness), both given the row.\n\n   PRESENTATIONAL ONLY: `onRevoke` and `onRevokeGrant` (each after its confirm\n   dialog) and `roleEditor.onChange` are the side effects.\n   ---------------------------------------------------------------------------- */\n\nexport interface AgentKeysListProps {\n  /** The keys agents hold, already scoped to the person. */\n  keys: ApiKey[];\n  onRevoke: (id: number) => Promise<void>;\n  /** The id of a key currently mid-revoke, mid-role-change or mid-grant-removal. Disables just that row's controls. */\n  busyId?: number | null;\n  /** Makes each key's role editable in place. Omit for a read-only role badge. */\n  roleEditor?: KeyRoleEditor;\n  /** Makes each key's grant chips removable (DX-4433). Omit and keys that carry grants show them read-only. */\n  onRevokeGrant?: (keyId: number, grantId: number) => Promise<void>;\n  /** Replaces a key's name text, e.g. with a link to the worker the key belongs to (DX-4487). Return `null` to keep the plain name. */\n  renderName?: (apiKey: ApiKey) => ReactNode;\n  /** One line under a key's name, e.g. the worker's readiness badge (DX-4487). Return `null` for a key with none. */\n  renderStatus?: (apiKey: ApiKey) => ReactNode;\n  emptyState?: ReactNode;\n  className?: string;\n}\n\nexport function AgentKeysList({ keys, onRevoke, busyId, roleEditor, onRevokeGrant, renderName, renderStatus, emptyState, className }: AgentKeysListProps) {\n  const strings = useUiStrings().agentKeysList;\n  if (keys.length === 0) {\n    return (\n      emptyState ?? (\n        <TableEmptyState\n          icon={<Icon name=\"bot\" size=\"lg\" className=\"text-tertiary\" />}\n          title={strings.emptyTitle}\n          description={strings.emptyDescription}\n        />\n      )\n    );\n  }\n  return <ApiKeysTable keys={keys} onRevoke={onRevoke} busyId={busyId} roleEditor={roleEditor} onRevokeGrant={onRevokeGrant} renderName={renderName} renderStatus={renderStatus} className={className} />;\n}\n"],"names":["AgentKeysList","keys","onRevoke","busyId","roleEditor","onRevokeGrant","renderName","renderStatus","emptyState","className","strings","useUiStrings","jsx","TableEmptyState","Icon","ApiKeysTable"],"mappings":";;;;;AAoDO,SAASA,EAAc,EAAE,MAAAC,GAAM,UAAAC,GAAU,QAAAC,GAAQ,YAAAC,GAAY,eAAAC,GAAe,YAAAC,GAAY,cAAAC,GAAc,YAAAC,GAAY,WAAAC,EAAA,GAAiC;AACxJ,QAAMC,IAAUC,IAAe;AAC/B,SAAIV,EAAK,WAAW,IAEhBO,KACE,gBAAAI;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,wBAAOC,GAAA,EAAK,MAAK,OAAM,MAAK,MAAK,WAAU,iBAAgB;AAAA,MAC3D,OAAOJ,EAAQ;AAAA,MACf,aAAaA,EAAQ;AAAA,IAAA;AAAA,EAAA,IAKtB,gBAAAE,EAACG,KAAa,MAAAd,GAAY,UAAAC,GAAoB,QAAAC,GAAgB,YAAAC,GAAwB,eAAAC,GAA8B,YAAAC,GAAwB,cAAAC,GAA4B,WAAAE,EAAA,CAAsB;AACvM;"}

package/dist/components/rbac/ApiKeysPanel.js

@@ -0,0 +1,172 @@
+import { jsxs as a, jsx as n, Fragment as j } from "react/jsx-runtime";
+import { useState as i } from "react";
+import { Dialog as k } from "../Dialog.js";
+import { Button as d } from "../Button.js";
+import { Callout as L } from "../Callout.js";
+import { TableEmptyState as A } from "../Table.js";
+import { Field as I } from "../Field.js";
+import { Icon as f } from "../Icon.js";
+import { IconButton as B } from "../IconButton.js";
+import { Input as M } from "../Input.js";
+import { NumberInput as U } from "../NumberInput.js";
+import { SecretField as q } from "../SecretField.js";
+import { copyText as G } from "../../lib/clipboard.js";
+import { ApiKeysTable as H } from "./ApiKeysTable.js";
+import { RoleKeyPicker as J } from "./RoleKeyPicker.js";
+import { useUiStrings as Q } from "../../lib/i18n/provider.js";
+function de({
+  keys: h,
+  roles: N,
+  permissions: T,
+  ownPermissionKeys: D,
+  onCreate: K,
+  onRevoke: E,
+  busyId: P,
+  emptyState: w,
+  className: z
+}) {
+  const e = Q().apiKeysPanel, [F, r] = i(!1), [o, g] = i(""), [s, v] = i(""), [y, x] = i(null), [t, b] = i(!1), [C, m] = i(null), [p, u] = i(null), [O, c] = i({ kind: "unchanged" });
+  function R() {
+    g(""), v(""), x(null), m(null), r(!0);
+  }
+  async function S() {
+    if (!(!o.trim() || s === "")) {
+      b(!0), m(null);
+      try {
+        const l = await K({ name: o.trim(), roleId: s, expiresInDays: y });
+        r(!1), u(l.token), c({ kind: "set", value: l.token });
+      } catch (l) {
+        m(l instanceof Error ? l.message : e.failedMessage);
+      } finally {
+        b(!1);
+      }
+    }
+  }
+  async function V() {
+    if (p)
+      try {
+        await G(p);
+      } catch {
+      }
+  }
+  return /* @__PURE__ */ a("div", { className: z, children: [
+    /* @__PURE__ */ a("div", { className: "flex flex-col gap-3", children: [
+      /* @__PURE__ */ a("div", { className: "flex items-center justify-between gap-3", children: [
+        /* @__PURE__ */ n("h2", { className: "text-xs font-semibold tracking-widest text-tertiary uppercase", children: e.title }),
+        /* @__PURE__ */ n(d, { size: "sm", leadingIcon: /* @__PURE__ */ n(f, { name: "plus", size: "sm" }), onClick: R, children: e.createKey })
+      ] }),
+      h.length === 0 ? w ?? /* @__PURE__ */ n(
+        A,
+        {
+          icon: /* @__PURE__ */ n(f, { name: "lock", size: "lg", className: "text-tertiary" }),
+          title: e.emptyTitle,
+          description: e.emptyDescription
+        }
+      ) : /* @__PURE__ */ n(H, { keys: h, onRevoke: E, busyId: P })
+    ] }),
+    /* @__PURE__ */ n(
+      k,
+      {
+        open: F,
+        onOpenChange: r,
+        title: e.dialogTitle,
+        description: e.dialogDescription,
+        actions: /* @__PURE__ */ a(j, { children: [
+          /* @__PURE__ */ n(d, { variant: "outline", onClick: () => r(!1), disabled: t, children: e.cancel }),
+          /* @__PURE__ */ n(
+            d,
+            {
+              onClick: () => {
+                S();
+              },
+              disabled: !o.trim() || s === "" || t,
+              loading: t,
+              children: e.create
+            }
+          )
+        ] }),
+        children: /* @__PURE__ */ a("div", { className: "flex flex-col gap-4", children: [
+          C && /* @__PURE__ */ n(L, { tone: "danger", title: e.failedTitle, children: C }),
+          /* @__PURE__ */ n(I, { label: e.nameLabel, description: e.nameDescription, children: /* @__PURE__ */ n(
+            M,
+            {
+              value: o,
+              onChange: (l) => g(l.target.value),
+              placeholder: e.namePlaceholder,
+              disabled: t,
+              autoFocus: !0
+            }
+          ) }),
+          /* @__PURE__ */ n(
+            J,
+            {
+              roles: N,
+              permissions: T,
+              ownPermissionKeys: D,
+              value: s,
+              onValueChange: v,
+              disabled: t
+            }
+          ),
+          /* @__PURE__ */ n(I, { label: e.expiresLabel, description: e.expiresDescription, children: /* @__PURE__ */ n(
+            U,
+            {
+              value: y ?? void 0,
+              onValueChange: (l) => x(l ?? null),
+              min: 1,
+              placeholder: e.expiresPlaceholder,
+              disabled: t
+            }
+          ) })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ n(
+      k,
+      {
+        open: p !== null,
+        onOpenChange: (l) => {
+          l || (u(null), c({ kind: "unchanged" }));
+        },
+        title: e.revealedTitle,
+        description: e.revealedDescription,
+        actions: /* @__PURE__ */ n(
+          d,
+          {
+            onClick: () => {
+              u(null), c({ kind: "unchanged" });
+            },
+            children: e.done
+          }
+        ),
+        children: /* @__PURE__ */ a("div", { className: "flex items-end gap-2", children: [
+          /* @__PURE__ */ n(
+            q,
+            {
+              className: "flex-1",
+              label: e.revealedLabel,
+              value: O,
+              onChange: c,
+              configured: !1,
+              revealable: !0
+            }
+          ),
+          /* @__PURE__ */ n(
+            B,
+            {
+              icon: /* @__PURE__ */ n(f, { name: "copy", size: "sm" }),
+              label: e.copyKey,
+              onClick: () => {
+                V();
+              }
+            }
+          )
+        ] })
+      }
+    )
+  ] });
+}
+export {
+  de as ApiKeysPanel
+};
+//# sourceMappingURL=ApiKeysPanel.js.map

package/dist/components/rbac/ApiKeysPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApiKeysPanel.js","sources":["../../../src/components/rbac/ApiKeysPanel.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { useState } from \"react\";\nimport { Dialog } from \"../Dialog\";\nimport { Button } from \"../Button\";\nimport { Callout } from \"../Callout\";\nimport { TableEmptyState } from \"../Table\";\nimport { Field } from \"../Field\";\nimport { Icon } from \"../Icon\";\nimport { IconButton } from \"../IconButton\";\nimport { Input } from \"../Input\";\nimport { NumberInput } from \"../NumberInput\";\nimport { SecretField, type SecretValue } from \"../SecretField\";\nimport { copyText } from \"../../lib/clipboard\";\nimport { useUiStrings } from \"../../lib/i18n\";\nimport { ApiKeysTable, type ApiKey } from \"./ApiKeysTable\";\nimport { RoleKeyPicker } from \"./RoleKeyPicker\";\nimport type { Permission, Role } from \"./types\";\n\n/* ----------------------------------------------------------------------------\n   API KEYS PANEL\n\n   THE SAME `DataTable` SHAPE AS `SessionsList`, MINUS THE FIELDS A KEY\n   DOESN'T HAVE. An API key has no `current`/`userAgent`/`ip` — it isn't a\n   signed-in session, it's a bearer credential a script or an agent holds — so\n   this is a sibling component with its own row type, not `SessionsList` with\n   optional columns. See `types.ts`'s own header for why this library prefers\n   a second small type over one type trying to serve two shapes. The table\n   itself is `ApiKeysTable`, shared with `AgentKeysList`.\n\n   A KEY ACTS AS ITS OWNER, WITH A ROLE CHOSEN AT CREATION. The create dialog\n   makes the role a required choice (no preselected default: a scoped\n   credential should never be broad by omission) and DISABLES every role that\n   holds a permission its owner lacks, saying which one — the server refuses\n   such a role anyway, so the disabled card is the same rule shown before the\n   round trip rather than a second rule. The panel never knows what a role or\n   permission IS: it compares `Role.permissionKeys` against the\n   `ownPermissionKeys` the consumer hands it, and names the missing ones\n   through `permissions[].label`.\n\n   ONLY THE PERSON'S OWN KEYS. Credentials a worker or an agent session minted on\n   their behalf are `AgentKeysList`'s (DX-4425): a page that shows both puts each\n   in its own place instead of this panel carrying a second group.\n\n   THE CREATED KEY IS SHOWN EXACTLY ONCE, AND THIS COMPONENT NEVER HOLDS ON TO\n   IT LONGER THAN THAT. `onCreate` resolves with `{ token }` — the only moment\n   the raw secret exists anywhere in this UI — and it lives in local state only\n   until the operator dismisses the reveal, via `SecretField` (see that\n   component's own header for the three-state model it exists to enforce.)\n   There is no way to see a previously-created key again through this panel,\n   on purpose: neither this library nor a well-behaved backend stores the\n   plaintext past creation.\n   ---------------------------------------------------------------------------- */\n\nexport interface ApiKeysPanelProps {\n  /** The keys the person made for themselves. */\n  keys: ApiKey[];\n  /** The roles the create dialog offers. */\n  roles: Role[];\n  /** The permission catalog, used to name the permissions that make a role unavailable. */\n  permissions: Permission[];\n  /** What the key's owner holds. A role holding anything outside this set cannot be chosen. */\n  ownPermissionKeys: string[];\n  onCreate: (input: { name: string; roleId: string; expiresInDays?: number | null }) => Promise<{ token: string }>;\n  onRevoke: (id: number) => Promise<void>;\n  /** The id of a key currently mid-revoke. Disables just that row. */\n  busyId?: number | null;\n  emptyState?: ReactNode;\n  className?: string;\n}\n\nexport function ApiKeysPanel({\n  keys,\n  roles,\n  permissions,\n  ownPermissionKeys,\n  onCreate,\n  onRevoke,\n  busyId,\n  emptyState,\n  className,\n}: ApiKeysPanelProps) {\n  const strings = useUiStrings().apiKeysPanel;\n  const [createOpen, setCreateOpen] = useState(false);\n  const [name, setName] = useState(\"\");\n  const [roleId, setRoleId] = useState(\"\");\n  const [expiresInDays, setExpiresInDays] = useState<number | null>(null);\n  const [creating, setCreating] = useState(false);\n  const [createError, setCreateError] = useState<string | null>(null);\n  const [revealedToken, setRevealedToken] = useState<string | null>(null);\n  const [revealedValue, setRevealedValue] = useState<SecretValue>({ kind: \"unchanged\" });\n\n  function openCreate() {\n    setName(\"\");\n    setRoleId(\"\");\n    setExpiresInDays(null);\n    setCreateError(null);\n    setCreateOpen(true);\n  }\n\n  async function handleCreate() {\n    if (!name.trim() || roleId === \"\") return;\n    setCreating(true);\n    setCreateError(null);\n    try {\n      const result = await onCreate({ name: name.trim(), roleId, expiresInDays });\n      setCreateOpen(false);\n      setRevealedToken(result.token);\n      setRevealedValue({ kind: \"set\", value: result.token });\n    } catch (cause) {\n      setCreateError(cause instanceof Error ? cause.message : strings.failedMessage);\n    } finally {\n      setCreating(false);\n    }\n  }\n\n  async function handleCopy() {\n    if (!revealedToken) return;\n    try {\n      await copyText(revealedToken);\n    } catch {\n      // Both the async Clipboard API and the execCommand fallback failed\n      // (DX-3661) — the key stays selectable/visible either way, so there\n      // is nothing further to surface here.\n    }\n  }\n\n  return (\n    <div className={className}>\n      <div className=\"flex flex-col gap-3\">\n        <div className=\"flex items-center justify-between gap-3\">\n          <h2 className=\"text-xs font-semibold tracking-widest text-tertiary uppercase\">{strings.title}</h2>\n          <Button size=\"sm\" leadingIcon={<Icon name=\"plus\" size=\"sm\" />} onClick={openCreate}>\n            {strings.createKey}\n          </Button>\n        </div>\n\n        {keys.length === 0 ? (\n          emptyState ?? (\n            <TableEmptyState\n              icon={<Icon name=\"lock\" size=\"lg\" className=\"text-tertiary\" />}\n              title={strings.emptyTitle}\n              description={strings.emptyDescription}\n            />\n          )\n        ) : (\n          <ApiKeysTable keys={keys} onRevoke={onRevoke} busyId={busyId} />\n        )}\n      </div>\n\n      <Dialog\n        open={createOpen}\n        onOpenChange={setCreateOpen}\n        title={strings.dialogTitle}\n        description={strings.dialogDescription}\n        actions={\n          <>\n            <Button variant=\"outline\" onClick={() => setCreateOpen(false)} disabled={creating}>\n              {strings.cancel}\n            </Button>\n            {/* Named \"Create\" rather than repeating \"Create key\" — the\n                panel's own trigger button already carries that label, and\n                `getByRole(\"button\", { name: \"Create key\" })` needs exactly\n                one match once this dialog is open. */}\n            <Button\n              onClick={() => void handleCreate()}\n              disabled={!name.trim() || roleId === \"\" || creating}\n              loading={creating}\n            >\n              {strings.create}\n            </Button>\n          </>\n        }\n      >\n        <div className=\"flex flex-col gap-4\">\n          {createError && <Callout tone=\"danger\" title={strings.failedTitle}>{createError}</Callout>}\n          <Field label={strings.nameLabel} description={strings.nameDescription}>\n            <Input\n              value={name}\n              onChange={(event) => setName(event.target.value)}\n              placeholder={strings.namePlaceholder}\n              disabled={creating}\n              autoFocus\n            />\n          </Field>\n          <RoleKeyPicker\n            roles={roles}\n            permissions={permissions}\n            ownPermissionKeys={ownPermissionKeys}\n            value={roleId}\n            onValueChange={setRoleId}\n            disabled={creating}\n          />\n          <Field label={strings.expiresLabel} description={strings.expiresDescription}>\n            <NumberInput\n              value={expiresInDays ?? undefined}\n              onValueChange={(value) => setExpiresInDays(value ?? null)}\n              min={1}\n              placeholder={strings.expiresPlaceholder}\n              disabled={creating}\n            />\n          </Field>\n        </div>\n      </Dialog>\n\n      <Dialog\n        open={revealedToken !== null}\n        onOpenChange={(next) => {\n          if (!next) {\n            setRevealedToken(null);\n            setRevealedValue({ kind: \"unchanged\" });\n          }\n        }}\n        title={strings.revealedTitle}\n        description={strings.revealedDescription}\n        actions={\n          <Button\n            onClick={() => {\n              setRevealedToken(null);\n              setRevealedValue({ kind: \"unchanged\" });\n            }}\n          >\n            {strings.done}\n          </Button>\n        }\n      >\n        <div className=\"flex items-end gap-2\">\n          <SecretField\n            className=\"flex-1\"\n            label={strings.revealedLabel}\n            value={revealedValue}\n            onChange={setRevealedValue}\n            configured={false}\n            revealable\n          />\n          <IconButton\n            icon={<Icon name=\"copy\" size=\"sm\" />}\n            label={strings.copyKey}\n            onClick={() => void handleCopy()}\n          />\n        </div>\n      </Dialog>\n    </div>\n  );\n}\n"],"names":["ApiKeysPanel","keys","roles","permissions","ownPermissionKeys","onCreate","onRevoke","busyId","emptyState","className","strings","useUiStrings","createOpen","setCreateOpen","useState","name","setName","roleId","setRoleId","expiresInDays","setExpiresInDays","creating","setCreating","createError","setCreateError","revealedToken","setRevealedToken","revealedValue","setRevealedValue","openCreate","handleCreate","result","cause","handleCopy","copyText","jsxs","jsx","Button","Icon","TableEmptyState","ApiKeysTable","Dialog","Fragment","Callout","Field","Input","event","RoleKeyPicker","NumberInput","value","next","SecretField","IconButton"],"mappings":"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"}

package/dist/components/rbac/ApiKeysTable.js

@@ -0,0 +1,167 @@
+import { jsx as l, jsxs as f } from "react/jsx-runtime";
+import { useState as u } from "react";
+import { AlertDialog as g } from "../Dialog.js";
+import { Badge as v } from "../Badge.js";
+import { DataTable as h, CellStack as C } from "../Table.js";
+import { Icon as p } from "../Icon.js";
+import { IconButton as b } from "../IconButton.js";
+import { StatusSelect as A } from "../StatusSelect.js";
+import { roleUnavailableReason as T } from "./RoleKeyPicker.js";
+import { DateTimeText as k } from "../DateTimeText.js";
+import { RelativeTime as N, useRelativeText as x } from "../RelativeTime.js";
+import { EndedLine as R, IdleLine as L } from "./EndedLine.js";
+import { useUiStrings as m } from "../../lib/i18n/provider.js";
+function O({
+  apiKey: e,
+  busy: o,
+  editor: r
+}) {
+  const { apiKeysTable: i, roleKeyPicker: a } = m();
+  if (r === void 0 || e.roleId === void 0 || e.ended !== void 0)
+    return /* @__PURE__ */ l(v, { tone: "neutral", children: e.roleLabel });
+  const t = new Set(r.ownPermissionKeys), n = (typeof r.roles == "function" ? r.roles(e) : r.roles).map((s) => {
+    const c = T(s, t, r.permissions, a.unavailable);
+    return { value: s.id, label: s.label, tone: "neutral", ...c === null ? {} : { refusal: c } };
+  });
+  return n.some((s) => s.value === e.roleId) || n.unshift({ value: e.roleId, label: e.roleLabel, tone: "neutral", refusal: i.roleNotAssignable }), /* @__PURE__ */ l(
+    A,
+    {
+      value: e.roleId,
+      options: n,
+      "aria-label": i.roleOf(e.name),
+      disabled: o,
+      onValueChange: (s) => {
+        s !== e.roleId && r.onChange(e.id, s);
+      }
+    }
+  );
+}
+function S({
+  apiKey: e,
+  busy: o,
+  onRevoke: r
+}) {
+  const i = m().apiKeysTable, [a, t] = u(!1);
+  return /* @__PURE__ */ l(
+    g,
+    {
+      open: a,
+      onOpenChange: t,
+      trigger: /* @__PURE__ */ l(
+        b,
+        {
+          icon: /* @__PURE__ */ l(p, { name: "trash-2", size: "sm" }),
+          label: i.revoke(e.name),
+          tone: "danger",
+          size: "sm",
+          disabledReason: o ? i.revoking : void 0
+        }
+      ),
+      title: i.revokeTitle(e.name),
+      description: i.revokeDescription,
+      confirmLabel: i.revokeConfirm,
+      destructive: !0,
+      loading: o,
+      onConfirm: () => {
+        r(e.id), t(!1);
+      }
+    }
+  );
+}
+function U({
+  apiKey: e,
+  grant: o,
+  busy: r,
+  onRevokeGrant: i
+}) {
+  const a = m().apiKeysTable, t = x(o.grantedAt), [d, n] = u(!1);
+  return /* @__PURE__ */ f("li", { className: "flex min-w-0 flex-col gap-0.5", children: [
+    /* @__PURE__ */ f("div", { className: "flex min-w-0 items-center gap-1", children: [
+      /* @__PURE__ */ l(v, { tone: "accent", size: "sm", children: `+ ${o.label}` }),
+      i && /* @__PURE__ */ l(
+        g,
+        {
+          open: d,
+          onOpenChange: n,
+          trigger: /* @__PURE__ */ l(
+            b,
+            {
+              icon: /* @__PURE__ */ l(p, { name: "x", size: "xs" }),
+              label: a.removeGrant(o.label, e.name),
+              tone: "danger",
+              size: "sm",
+              disabledReason: r ? a.updating : void 0
+            }
+          ),
+          title: a.removeGrantTitle(o.label),
+          description: a.removeGrantDescription,
+          confirmLabel: a.removeGrantConfirm,
+          destructive: !0,
+          loading: r,
+          onConfirm: () => {
+            i(e.id, o.id), n(!1);
+          }
+        }
+      )
+    ] }),
+    /* @__PURE__ */ l("span", { className: "text-xs break-words text-tertiary", children: a.granted(t, o.reason || void 0) })
+  ] });
+}
+function I({
+  apiKey: e,
+  busy: o,
+  onRevokeGrant: r,
+  renderName: i,
+  renderStatus: a
+}) {
+  const t = m().apiKeysTable, d = x(e.createdAt), n = e.grants ?? [], s = a?.(e);
+  return /* @__PURE__ */ f("div", { className: "flex min-w-0 flex-col gap-2", children: [
+    /* @__PURE__ */ l(C, { primary: i?.(e) ?? e.name, secondary: t.created(d) }),
+    e.ended && /* @__PURE__ */ l(R, { ended: e.ended }),
+    e.idle && /* @__PURE__ */ l(L, { idle: e.idle }),
+    s,
+    n.length > 0 && /* @__PURE__ */ l("ul", { "aria-label": t.grantsOf(e.name), className: "flex min-w-0 flex-col gap-1.5", children: n.map((c) => /* @__PURE__ */ l(U, { apiKey: e, grant: c, busy: o, onRevokeGrant: e.ended === void 0 ? r : void 0 }, c.id)) })
+  ] });
+}
+function z(e, o, r, i, a, t, d) {
+  return [
+    {
+      id: "key",
+      header: e.columnKey,
+      accessorFn: (n) => n.name,
+      cell: ({ row: n }) => /* @__PURE__ */ l(I, { apiKey: n.original, busy: o === n.original.id, onRevokeGrant: a, renderName: t, renderStatus: d })
+    },
+    {
+      id: "role",
+      header: e.columnRole,
+      accessorFn: (n) => n.roleLabel,
+      cell: ({ row: n }) => /* @__PURE__ */ l(O, { apiKey: n.original, busy: o === n.original.id, editor: i })
+    },
+    {
+      id: "lastUsed",
+      header: e.columnLastUsed,
+      accessorFn: (n) => n.lastUsedAt ?? "",
+      cell: ({ row: n }) => /* @__PURE__ */ l("span", { className: "text-secondary", children: n.original.lastUsedAt ? /* @__PURE__ */ l(N, { at: n.original.lastUsedAt }) : e.never })
+    },
+    {
+      id: "expires",
+      header: e.columnExpires,
+      accessorFn: (n) => n.expiresAt ?? "",
+      cell: ({ row: n }) => /* @__PURE__ */ l("span", { className: "text-secondary", children: n.original.expiresAt ? /* @__PURE__ */ l(k, { at: n.original.expiresAt }) : e.never })
+    },
+    {
+      id: "actions",
+      header: "",
+      enableSorting: !1,
+      cell: ({ row: n }) => /* @__PURE__ */ l("div", { className: "flex justify-end", children: n.original.ended === void 0 && /* @__PURE__ */ l(S, { apiKey: n.original, busy: o === n.original.id, onRevoke: r }) })
+    }
+  ];
+}
+function M({ keys: e, onRevoke: o, busyId: r, roleEditor: i, onRevokeGrant: a, renderName: t, renderStatus: d, className: n }) {
+  const s = m().apiKeysTable;
+  return /* @__PURE__ */ l(h, { columns: z(s, r, o, i, a, t, d), data: e, getRowId: (c) => String(c.id), className: n });
+}
+export {
+  M as ApiKeysTable
+};
+//# sourceMappingURL=ApiKeysTable.js.map

package/dist/components/rbac/ApiKeysTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ApiKeysTable.js","sources":["../../../src/components/rbac/ApiKeysTable.tsx"],"sourcesContent":["import { useState, type ReactNode } from \"react\";\nimport type { ColumnDef } from \"@tanstack/react-table\";\nimport { AlertDialog } from \"../Dialog\";\nimport { Badge } from \"../Badge\";\nimport { CellStack, DataTable } from \"../Table\";\nimport { Icon } from \"../Icon\";\nimport { IconButton } from \"../IconButton\";\nimport { StatusSelect, type StatusOption } from \"../StatusSelect\";\nimport { roleUnavailableReason } from \"./RoleKeyPicker\";\nimport type { Permission, Role } from \"./types\";\nimport { DateTimeText } from \"../DateTimeText\";\nimport { RelativeTime, useRelativeText } from \"../RelativeTime\";\nimport { useUiStrings } from \"../../lib/i18n\";\nimport type { UiStrings } from \"../../lib/i18n\";\nimport { EndedLine, IdleLine, type EndedState, type IdleState } from \"./EndedLine\";\n\n/* ----------------------------------------------------------------------------\n   API KEYS TABLE (DX-4425)\n\n   THE ONE ROW SHAPE EVERY KEY LIST SHARES. `ApiKeysPanel` (the keys a person\n   made for themselves) and `AgentKeysList` (the keys a worker or an agent\n   session minted on their behalf) list the same credential: a name, the role it\n   acts with, when it was last used, when it expires, and a confirmed revoke.\n   Both render this table so a column change lands once. It is not exported from\n   the package: a consumer reaches it through the two components that frame it.\n\n   PRESENTATIONAL ONLY, like `SessionsList`: `onRevoke` fires only after the\n   `AlertDialog` confirms.\n\n   THE ROLE CELL EDITS IN PLACE (DX-4427) when the consumer passes `roleEditor`:\n   the role badge IS the control (`StatusSelect`), so raising or lowering a live\n   key's permissions needs no dialog and no revoke. A role the owner may not\n   grant is listed with the reason (`roleUnavailableReason`, the same rule\n   `RoleKeyPicker` applies when a key is issued). A key with no `roleId`, or no\n   `roleEditor`, keeps the read-only badge.\n\n   A KEY'S GRANTS SIT UNDER ITS NAME (DX-4433). An agent can ask its owner for a\n   permission its role lacks (`PermissionRequestPanel`); an approval adds it to\n   that one key on top of its role. Each grant shows as a \"+ Label\" chip with\n   when it was granted and why, as text rather than a tooltip so a phone reads it\n   too. With `onRevokeGrant` each chip carries its own remove control behind a\n   confirm: dropping a grant is not revoking the key, and the role is untouched.\n   Without the handler the chips are read-only, and a key with no grants renders\n   exactly as before.\n\n   A ROW CAN LINK AND CARRY A LIVE STATUS (DX-4487). `renderName` replaces the\n   name text (a consumer renders its router's link, so the library stays\n   router-agnostic) and `renderStatus` adds one line under the name (a readiness\n   badge for a worker's key). Both are given the row; either may return `null`\n   for a key that has neither, and omitting them renders exactly as before.\n   ---------------------------------------------------------------------------- */\n\nexport interface ApiKey {\n  id: number;\n  name: string;\n  /** The label of the role this key acts with. A label, not an id: a key can carry a role of a team other than the one whose\n   *  `roles` the create dialog offers, and only the consumer's server can name that one. */\n  roleLabel: string;\n  /** The id of that role, matching a `Role.id` in `roleEditor.roles`. Needed only for a key whose role is editable. */\n  roleId?: string;\n  /** ISO instant. */\n  createdAt: string;\n  /** ISO instant, or `null`/omitted if it has never been used. */\n  lastUsedAt?: string | null;\n  /** ISO instant, or `null`/omitted for a key with no expiry. */\n  expiresAt?: string | null;\n  /** Permissions added to this key on top of its role (DX-4433). Omit, or leave empty, for a key that holds only its role. */\n  grants?: KeyGrant[];\n  /** DX-5246: set on a key that has ended (revoked, expired or retired): the consumer's own words for how it ended (`label`) and the ISO instant it did (`at`). An ended row shows them under its name and offers no revoke, role change or grant removal. */\n  ended?: EndedState;\n  /** DX-5246: set on a key that still works but nobody is using (its session gone quiet, a script that stopped): the consumer's own words (`label`) and the ISO instant it was last in use (`at`). An idle row shows them under its name and keeps its revoke, role change and grant removal. */\n  idle?: IdleState;\n}\n\n/** One permission an approved request added to a key, on top of its role. */\nexport interface KeyGrant {\n  id: number;\n  /** The permission key granted. Compared for equality only. */\n  permissionKey: string;\n  /** The permission's label, as shown on the chip and in the confirm. */\n  label: string;\n  /** ISO instant. */\n  grantedAt: string;\n  /** The reason the agent gave when it asked. Plain text. */\n  reason?: string;\n}\n\n/** Makes a key's role editable in place. `roles` are the roles the owner may pick from: one list for every key, or a function\n *  of the key when the keys do not share one (DX-4431: an agent session takes agent roles, a worker a human role that can manage workers). */\nexport interface KeyRoleEditor {\n  roles: Role[] | ((apiKey: ApiKey) => Role[]);\n  /** The permission catalog, used to name the permissions that make a role unavailable. */\n  permissions: Permission[];\n  /** What the owner holds. A role holding anything outside this set is listed but cannot be chosen. */\n  ownPermissionKeys: string[];\n  /** Fired when a different role is picked. The consumer saves it and refreshes `keys`. */\n  onChange: (id: number, roleId: string) => Promise<void>;\n}\n\nfunction RoleCell({\n  apiKey,\n  busy,\n  editor,\n}: {\n  apiKey: ApiKey;\n  busy: boolean;\n  editor: KeyRoleEditor | undefined;\n}) {\n  const { apiKeysTable: strings, roleKeyPicker } = useUiStrings();\n  if (editor === undefined || apiKey.roleId === undefined || apiKey.ended !== undefined) {\n    return <Badge tone=\"neutral\">{apiKey.roleLabel}</Badge>;\n  }\n  const own = new Set(editor.ownPermissionKeys);\n  const roles = typeof editor.roles === \"function\" ? editor.roles(apiKey) : editor.roles;\n  const options: StatusOption[] = roles.map((role) => {\n    const refusal = roleUnavailableReason(role, own, editor.permissions, roleKeyPicker.unavailable);\n    return { value: role.id, label: role.label, tone: \"neutral\", ...(refusal === null ? {} : { refusal }) };\n  });\n  // A key can carry a role outside the offered set (another team's); it is shown, never silently swapped for a listed one.\n  if (!options.some((o) => o.value === apiKey.roleId)) {\n    options.unshift({ value: apiKey.roleId, label: apiKey.roleLabel, tone: \"neutral\", refusal: strings.roleNotAssignable });\n  }\n  return (\n    <StatusSelect\n      value={apiKey.roleId}\n      options={options}\n      aria-label={strings.roleOf(apiKey.name)}\n      disabled={busy}\n      onValueChange={(roleId) => {\n        if (roleId !== apiKey.roleId) void editor.onChange(apiKey.id, roleId);\n      }}\n    />\n  );\n}\n\nfunction RevokeCell({\n  apiKey,\n  busy,\n  onRevoke,\n}: {\n  apiKey: ApiKey;\n  busy: boolean;\n  onRevoke: (id: number) => Promise<void>;\n}) {\n  const strings = useUiStrings().apiKeysTable;\n  const [confirmOpen, setConfirmOpen] = useState(false);\n\n  return (\n    <AlertDialog\n      open={confirmOpen}\n      onOpenChange={setConfirmOpen}\n      trigger={\n        <IconButton\n          icon={<Icon name=\"trash-2\" size=\"sm\" />}\n          label={strings.revoke(apiKey.name)}\n          tone=\"danger\"\n          size=\"sm\"\n          disabledReason={busy ? strings.revoking : undefined}\n        />\n      }\n      title={strings.revokeTitle(apiKey.name)}\n      description={strings.revokeDescription}\n      confirmLabel={strings.revokeConfirm}\n      destructive\n      loading={busy}\n      onConfirm={() => {\n        void onRevoke(apiKey.id);\n        setConfirmOpen(false);\n      }}\n    />\n  );\n}\n\nfunction GrantChip({\n  apiKey,\n  grant,\n  busy,\n  onRevokeGrant,\n}: {\n  apiKey: ApiKey;\n  grant: KeyGrant;\n  busy: boolean;\n  onRevokeGrant: ((keyId: number, grantId: number) => Promise<void>) | undefined;\n}) {\n  const strings = useUiStrings().apiKeysTable;\n  const grantedAge = useRelativeText(grant.grantedAt);\n  const [confirmOpen, setConfirmOpen] = useState(false);\n  return (\n    <li className=\"flex min-w-0 flex-col gap-0.5\">\n      <div className=\"flex min-w-0 items-center gap-1\">\n        <Badge tone=\"accent\" size=\"sm\">{`+ ${grant.label}`}</Badge>\n        {onRevokeGrant && (\n          <AlertDialog\n            open={confirmOpen}\n            onOpenChange={setConfirmOpen}\n            trigger={\n              <IconButton\n                icon={<Icon name=\"x\" size=\"xs\" />}\n                label={strings.removeGrant(grant.label, apiKey.name)}\n                tone=\"danger\"\n                size=\"sm\"\n                disabledReason={busy ? strings.updating : undefined}\n              />\n            }\n            title={strings.removeGrantTitle(grant.label)}\n            description={strings.removeGrantDescription}\n            confirmLabel={strings.removeGrantConfirm}\n            destructive\n            loading={busy}\n            onConfirm={() => {\n              void onRevokeGrant(apiKey.id, grant.id);\n              setConfirmOpen(false);\n            }}\n          />\n        )}\n      </div>\n      <span className=\"text-xs break-words text-tertiary\">\n        {strings.granted(grantedAge, grant.reason || undefined)}\n      </span>\n    </li>\n  );\n}\n\nfunction KeyCell({\n  apiKey,\n  busy,\n  onRevokeGrant,\n  renderName,\n  renderStatus,\n}: {\n  apiKey: ApiKey;\n  busy: boolean;\n  onRevokeGrant: ((keyId: number, grantId: number) => Promise<void>) | undefined;\n  renderName: ((apiKey: ApiKey) => ReactNode) | undefined;\n  renderStatus: ((apiKey: ApiKey) => ReactNode) | undefined;\n}) {\n  const strings = useUiStrings().apiKeysTable;\n  const createdAge = useRelativeText(apiKey.createdAt);\n  const grants = apiKey.grants ?? [];\n  const status = renderStatus?.(apiKey);\n  return (\n    <div className=\"flex min-w-0 flex-col gap-2\">\n      <CellStack primary={renderName?.(apiKey) ?? apiKey.name} secondary={strings.created(createdAge)} />\n      {apiKey.ended && <EndedLine ended={apiKey.ended} />}\n      {apiKey.idle && <IdleLine idle={apiKey.idle} />}\n      {status}\n      {grants.length > 0 && (\n        <ul aria-label={strings.grantsOf(apiKey.name)} className=\"flex min-w-0 flex-col gap-1.5\">\n          {grants.map((grant) => (\n            <GrantChip key={grant.id} apiKey={apiKey} grant={grant} busy={busy} onRevokeGrant={apiKey.ended === undefined ? onRevokeGrant : undefined} />\n          ))}\n        </ul>\n      )}\n    </div>\n  );\n}\n\nfunction buildColumns(\n  strings: UiStrings[\"apiKeysTable\"],\n  busyId: number | null | undefined,\n  onRevoke: (id: number) => Promise<void>,\n  roleEditor: KeyRoleEditor | undefined,\n  onRevokeGrant: ((keyId: number, grantId: number) => Promise<void>) | undefined,\n  renderName: ((apiKey: ApiKey) => ReactNode) | undefined,\n  renderStatus: ((apiKey: ApiKey) => ReactNode) | undefined,\n): ColumnDef<ApiKey, unknown>[] {\n  return [\n    {\n      id: \"key\",\n      header: strings.columnKey,\n      accessorFn: (k) => k.name,\n      cell: ({ row }) => <KeyCell apiKey={row.original} busy={busyId === row.original.id} onRevokeGrant={onRevokeGrant} renderName={renderName} renderStatus={renderStatus} />,\n    },\n    {\n      id: \"role\",\n      header: strings.columnRole,\n      accessorFn: (k) => k.roleLabel,\n      cell: ({ row }) => <RoleCell apiKey={row.original} busy={busyId === row.original.id} editor={roleEditor} />,\n    },\n    {\n      id: \"lastUsed\",\n      header: strings.columnLastUsed,\n      accessorFn: (k) => k.lastUsedAt ?? \"\",\n      cell: ({ row }) => (\n        <span className=\"text-secondary\">\n          {row.original.lastUsedAt ? <RelativeTime at={row.original.lastUsedAt} /> : strings.never}\n        </span>\n      ),\n    },\n    {\n      id: \"expires\",\n      header: strings.columnExpires,\n      accessorFn: (k) => k.expiresAt ?? \"\",\n      cell: ({ row }) => (\n        <span className=\"text-secondary\">\n          {row.original.expiresAt ? <DateTimeText at={row.original.expiresAt} /> : strings.never}\n        </span>\n      ),\n    },\n    {\n      id: \"actions\",\n      header: \"\",\n      enableSorting: false,\n      cell: ({ row }) => (\n        <div className=\"flex justify-end\">\n          {row.original.ended === undefined && <RevokeCell apiKey={row.original} busy={busyId === row.original.id} onRevoke={onRevoke} />}\n        </div>\n      ),\n    },\n  ];\n}\n\nexport interface ApiKeysTableProps {\n  keys: ApiKey[];\n  onRevoke: (id: number) => Promise<void>;\n  /** The id of a key currently mid-revoke, mid-role-change or mid-grant-removal. Disables just that row's controls. */\n  busyId?: number | null;\n  /** Makes each key's role editable in place (DX-4427). Omit for a read-only role badge. */\n  roleEditor?: KeyRoleEditor;\n  /** Makes each grant's chip removable (DX-4433). Fired only after the confirm dialog. Omit for read-only grant chips. */\n  onRevokeGrant?: (keyId: number, grantId: number) => Promise<void>;\n  /** Replaces a key's name text, e.g. with a link to what the key belongs to (DX-4487). Return `null` to keep the plain name. */\n  renderName?: (apiKey: ApiKey) => ReactNode;\n  /** One line under a key's name, e.g. a live status badge (DX-4487). Return `null` for a key with none. */\n  renderStatus?: (apiKey: ApiKey) => ReactNode;\n  className?: string;\n}\n\nexport function ApiKeysTable({ keys, onRevoke, busyId, roleEditor, onRevokeGrant, renderName, renderStatus, className }: ApiKeysTableProps) {\n  const strings = useUiStrings().apiKeysTable;\n  return <DataTable columns={buildColumns(strings, busyId, onRevoke, roleEditor, onRevokeGrant, renderName, renderStatus)} data={keys} getRowId={(k) => String(k.id)} className={className} />;\n}\n"],"names":["RoleCell","apiKey","busy","editor","strings","roleKeyPicker","useUiStrings","jsx","Badge","own","options","role","refusal","roleUnavailableReason","o","StatusSelect","roleId","RevokeCell","onRevoke","confirmOpen","setConfirmOpen","useState","AlertDialog","IconButton","Icon","GrantChip","grant","onRevokeGrant","grantedAge","useRelativeText","jsxs","KeyCell","renderName","renderStatus","createdAge","grants","status","CellStack","EndedLine","IdleLine","buildColumns","busyId","roleEditor","k","row","RelativeTime","DateTimeText","ApiKeysTable","keys","className","DataTable"],"mappings":"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"}

package/dist/components/rbac/Brand.js

@@ -0,0 +1,13 @@
+import { jsxs as m, jsx as e } from "react/jsx-runtime";
+import { Avatar as n } from "../Avatar.js";
+import { cn as i } from "../../lib/cn.js";
+function d({ name: r, logoUrl: s, compact: t = !1, className: a }) {
+  return /* @__PURE__ */ m("span", { className: i("flex min-w-0 items-center gap-2.5", a), children: [
+    /* @__PURE__ */ e(n, { name: r, src: s ?? void 0, size: "sm", shape: "rounded" }),
+    !t && /* @__PURE__ */ e("span", { className: "truncate text-sm font-semibold text-primary", children: r })
+  ] });
+}
+export {
+  d as Brand
+};
+//# sourceMappingURL=Brand.js.map

package/dist/components/rbac/Brand.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Brand.js","sources":["../../../src/components/rbac/Brand.tsx"],"sourcesContent":["import { Avatar } from \"../Avatar\";\nimport { cn } from \"../../lib/cn\";\n\n/* ============================================================================\n   BRAND\n\n   A team's own brand mark — logo + name — for the ONE place every consuming\n   app needs it rendered generically: the shell's sidebar brand slot\n   (`AppShell`'s `brand`/`brandCollapsed` props) and the mobile top bar.\n   `TeamSwitcher` already renders an equivalent brand inline as its trigger\n   (see that file's own `brand` const) but is a heavier component — a\n   popover, team-switching logic, membership data — that a consumer with\n   only ONE team, or a plain \"show the current brand\" spot with no switching\n   affordance (a collapsed rail, the mobile top bar), should not have to pull\n   in. `Brand` is the split of that same visual out into its own reusable,\n   presentational piece: data + a `compact` flag in, nothing else.\n\n   `compact` IS THE LOGO-ONLY MODE `AppShell`'s `brandCollapsed` slot needs\n   (DX-3412) — the team name is dropped entirely rather than truncated,\n   since the collapsed rail has no room for text at all.\n   ========================================================================= */\n\nexport interface BrandProps {\n  name: string;\n  logoUrl?: string | null;\n  /** Logo only, no team name — the collapsed-rail / icon-only rendering. */\n  compact?: boolean;\n  className?: string;\n}\n\nexport function Brand({ name, logoUrl, compact = false, className }: BrandProps) {\n  return (\n    <span className={cn(\"flex min-w-0 items-center gap-2.5\", className)}>\n      <Avatar name={name} src={logoUrl ?? undefined} size=\"sm\" shape=\"rounded\" />\n      {!compact && <span className=\"truncate text-sm font-semibold text-primary\">{name}</span>}\n    </span>\n  );\n}\n"],"names":["Brand","name","logoUrl","compact","className","cn","jsx","Avatar"],"mappings":";;;AA8BO,SAASA,EAAM,EAAE,MAAAC,GAAM,SAAAC,GAAS,SAAAC,IAAU,IAAO,WAAAC,KAAyB;AAC/E,2BACG,QAAA,EAAK,WAAWC,EAAG,qCAAqCD,CAAS,GAChE,UAAA;AAAA,IAAA,gBAAAE,EAACC,GAAA,EAAO,MAAAN,GAAY,KAAKC,KAAW,QAAW,MAAK,MAAK,OAAM,UAAA,CAAU;AAAA,IACxE,CAACC,KAAW,gBAAAG,EAAC,QAAA,EAAK,WAAU,+CAA+C,UAAAL,EAAA,CAAK;AAAA,EAAA,GACnF;AAEJ;"}

package/dist/components/rbac/Can.js

@@ -0,0 +1,18 @@
+import { useRBAC as n } from "./RBACProvider.js";
+function d(o) {
+  const { hasPermission: r } = n();
+  return r(o);
+}
+function l({ permission: o, anyOf: r, fallback: i = null, children: t }) {
+  const { hasPermission: e } = n();
+  if (o !== void 0 && r !== void 0)
+    throw new Error("<Can> takes exactly one of `permission` or `anyOf`, not both.");
+  if (o === void 0 && r === void 0)
+    throw new Error("<Can> requires either `permission` or `anyOf`.");
+  return (o !== void 0 ? e(o) : r.some((s) => e(s))) ? t : i;
+}
+export {
+  l as Can,
+  d as useHasPermission
+};
+//# sourceMappingURL=Can.js.map

package/dist/components/rbac/Can.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Can.js","sources":["../../../src/components/rbac/Can.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { useRBAC } from \"./RBACProvider\";\n\n/* ============================================================================\n   CAN — the one place a consumer answers \"should this control even be on\n   screen right now.\"\n\n   READS effectivePermissionKeys THROUGH `hasPermission`, NEVER A ROLE NAME.\n   Same arm's-length relationship the rest of this folder keeps with a\n   consumer's data (see the block comment atop `types.ts`): this component has\n   no idea what permission key `\"cards.delete\"` means, only whether the\n   CURRENT effective role (impersonation-aware, via `RBACProvider`) carries it.\n   A gate keyed on a role's `id`/`label` instead of a permission key is exactly\n   the coupling this component exists to avoid — it would silently drift the\n   moment a consumer renamed or re-scoped a role without also touching every\n   gate.\n\n   EXACTLY ONE OF `permission` / `anyOf`, ON PURPOSE. A component that silently\n   accepted both, or neither, would leave a caller guessing which one won. Both\n   throw, the same \"fail loud at the call site\" convention `useRBAC` itself\n   uses for a missing provider — a gate that silently defaults to \"show\" or\n   \"hide\" on a malformed call is worse than one that refuses to render at all,\n   since the malformed call is exactly the case where the person reading the\n   screen most needs the mistake to be visible.\n\n   HIDE IS THE ONLY BUILT-IN OUTCOME. This deliberately does not grow a\n   `mode=\"disable\"` — disabling a `Button` and disabling a `ToggleGroup` are\n   different props on different components, so there is no one generic way to\n   \"disable the children\" that would not eventually special-case every\n   component in the library. A consumer that wants a disabled-with-tooltip\n   affordance instead of hiding reads `useHasPermission` directly and passes\n   the result to whichever control's own `disabled`/tooltip props fit that\n   control — `Can` stays the right tool for \"don't render this at all,\" which\n   is what most of a permission-gated app actually needs.\n   ========================================================================= */\n\nexport interface CanProps {\n  /** A single permission key the effective role must carry. */\n  permission?: string;\n  /** Rendered when the effective role carries ANY of these keys. */\n  anyOf?: string[];\n  /** Shown when the permission check fails. Defaults to nothing at all. */\n  fallback?: ReactNode;\n  children: ReactNode;\n}\n\n/**\n * Reads `hasPermission` off `useRBAC()` directly — the same derived function\n * `Can` itself calls — so a consumer that needs the boolean without wanting\n * `Can`'s all-or-nothing render (to feed a `disabled` prop, a tooltip, a\n * conditional menu section) never has to reach past this component's own\n * public surface to get it.\n */\nexport function useHasPermission(key: string): boolean {\n  const { hasPermission } = useRBAC();\n  return hasPermission(key);\n}\n\nexport function Can({ permission, anyOf, fallback = null, children }: CanProps): ReactNode {\n  const { hasPermission } = useRBAC();\n\n  if (permission !== undefined && anyOf !== undefined) {\n    throw new Error(\"<Can> takes exactly one of `permission` or `anyOf`, not both.\");\n  }\n  if (permission === undefined && anyOf === undefined) {\n    throw new Error(\"<Can> requires either `permission` or `anyOf`.\");\n  }\n\n  const allowed =\n    permission !== undefined ? hasPermission(permission) : anyOf!.some((key) => hasPermission(key));\n\n  return allowed ? children : fallback;\n}\n"],"names":["useHasPermission","key","hasPermission","useRBAC","Can","permission","anyOf","fallback","children"],"mappings":";AAqDO,SAASA,EAAiBC,GAAsB;AACrD,QAAM,EAAE,eAAAC,EAAA,IAAkBC,EAAA;AAC1B,SAAOD,EAAcD,CAAG;AAC1B;AAEO,SAASG,EAAI,EAAE,YAAAC,GAAY,OAAAC,GAAO,UAAAC,IAAW,MAAM,UAAAC,KAAiC;AACzF,QAAM,EAAE,eAAAN,EAAA,IAAkBC,EAAA;AAE1B,MAAIE,MAAe,UAAaC,MAAU;AACxC,UAAM,IAAI,MAAM,+DAA+D;AAEjF,MAAID,MAAe,UAAaC,MAAU;AACxC,UAAM,IAAI,MAAM,gDAAgD;AAMlE,UAFED,MAAe,SAAYH,EAAcG,CAAU,IAAIC,EAAO,KAAK,CAACL,MAAQC,EAAcD,CAAG,CAAC,KAE/EO,IAAWD;AAC9B;"}

package/dist/components/rbac/ChangePasswordForm.js

@@ -0,0 +1,73 @@
+import { jsx as s, jsxs as M } from "react/jsx-runtime";
+import { useState as l } from "react";
+import { Button as N } from "../Button.js";
+import { Callout as R } from "../Callout.js";
+import { Field as c } from "../Field.js";
+import { PasswordInput as f } from "../PasswordInput.js";
+import { PasswordRequirements as j } from "../PasswordRequirements.js";
+import { useUiStrings as E } from "../../lib/i18n/provider.js";
+function G(a) {
+  const { passwordRules: P, submitLabel: y, className: F } = a, t = E().changePasswordForm, [o, g] = l(""), [r, h] = l(""), [n, b] = l(""), [i, w] = l(!1), [p, C] = l(null), u = a.hasCurrentPassword !== !1, m = u ? { failedTitle: t.failedTitle, failedMessage: t.failedMessage, submit: t.submit } : { failedTitle: t.setFailedTitle, failedMessage: t.setFailedMessage, submit: t.setSubmit }, d = P(r), T = d.length === 0 || d.every((e) => e.met), v = n.length > 0 && n !== r, S = (!u || o.length > 0) && r.length > 0 && n.length > 0 && T && !v && !i;
+  async function q(e) {
+    if (e.preventDefault(), !!S) {
+      w(!0), C(null);
+      try {
+        a.hasCurrentPassword === !1 ? await a.onSubmit(r) : await a.onSubmit(o, r), g(""), h(""), b("");
+      } catch (x) {
+        C(x instanceof Error ? x.message : m.failedMessage);
+      } finally {
+        w(!1);
+      }
+    }
+  }
+  return /* @__PURE__ */ s("form", { className: F, onSubmit: (e) => {
+    q(e);
+  }, children: /* @__PURE__ */ M("div", { className: "flex flex-col gap-4", children: [
+    p && /* @__PURE__ */ s(R, { tone: "danger", title: m.failedTitle, children: p }),
+    u && /* @__PURE__ */ s(c, { label: t.current, children: /* @__PURE__ */ s(
+      f,
+      {
+        value: o,
+        onChange: (e) => g(e.target.value),
+        autoComplete: "current-password",
+        disabled: i,
+        required: !0
+      }
+    ) }),
+    /* @__PURE__ */ M(c, { label: t.next, children: [
+      /* @__PURE__ */ s(
+        f,
+        {
+          value: r,
+          onChange: (e) => h(e.target.value),
+          autoComplete: "new-password",
+          disabled: i,
+          required: !0
+        }
+      ),
+      /* @__PURE__ */ s(j, { rules: d, className: "mt-2" })
+    ] }),
+    /* @__PURE__ */ s(
+      c,
+      {
+        label: t.confirmPassword,
+        error: v ? t.mismatch : void 0,
+        children: /* @__PURE__ */ s(
+          f,
+          {
+            value: n,
+            onChange: (e) => b(e.target.value),
+            autoComplete: "new-password",
+            disabled: i,
+            required: !0
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ s("div", { children: /* @__PURE__ */ s(N, { type: "submit", disabled: !S, loading: i, children: y ?? m.submit }) })
+  ] }) });
+}
+export {
+  G as ChangePasswordForm
+};
+//# sourceMappingURL=ChangePasswordForm.js.map