@eifi1/ui-kit 0.29.0 → 0.31.0

package/dist/admin/transfer-ownership-dialog.js

@@ -0,0 +1,83 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { useKitLabels } from "../i18n/kit-labels.js";
+import { Select } from "../components/ui.js";
+import { Caption } from "../components/text.js";
+import { AdminActionConfirm } from "./admin-action-confirm.js";
+import { usePersonLabel } from "./admin-parts.js";
+const DEFAULT_TRANSFER_OWNERSHIP_LABELS = {
+  title: (name) => `Hand on ${name}\u2019s work`,
+  body: "Everything this account owns moves to the account you choose, in one step.",
+  recipient: "Hand it to",
+  choose: "Choose an account\u2026",
+  chooseFirst: "Choose who receives the work",
+  confirm: "Hand it on",
+  customer: "a customer",
+  deactivated: "deactivated",
+  self: "the same account",
+  unavailable: (account, reason) => `${account} (${reason})`,
+  noCandidates: "No other account can receive it."
+};
+function TransferOwnershipDialog({
+  from,
+  candidates,
+  summary,
+  onTransfer,
+  onClose,
+  level = "type_email",
+  describeError,
+  open,
+  labels: labelsProp
+}) {
+  const labels = useKitLabels("transferOwnership", DEFAULT_TRANSFER_OWNERSHIP_LABELS, labelsProp);
+  const nameOf = usePersonLabel();
+  const [chosen, setChosen] = useState("");
+  const reasonOf = (candidate) => {
+    const own = candidate.unavailable;
+    const isSource = from.id !== void 0 && from.id !== null && candidate.id === from.id || candidate.email.trim().toLowerCase() === from.email.trim().toLowerCase();
+    const code = isSource ? "self" : own;
+    if (!code) return void 0;
+    if (code === "customer") return labels.customer;
+    if (code === "deactivated") return labels.deactivated;
+    if (code === "self") return labels.self;
+    return code;
+  };
+  const rows = candidates.map((candidate) => {
+    const name = nameOf(candidate);
+    const shown = name && name !== candidate.email ? `${name} \u2014 ${candidate.email}` : candidate.email;
+    const reason = reasonOf(candidate);
+    return { candidate, value: String(candidate.id), text: reason ? labels.unavailable(shown, reason) : shown, reason };
+  });
+  const available = rows.filter((row) => !row.reason);
+  const recipient = available.find((row) => row.value === chosen)?.candidate;
+  return /* @__PURE__ */ jsxs(
+    AdminActionConfirm,
+    {
+      open,
+      level: level === "none" ? "acknowledge" : level,
+      target: from,
+      title: labels.title(nameOf(from)),
+      consequence: labels.body,
+      confirmLabel: labels.confirm,
+      tone: "danger",
+      confirmDisabledReason: available.length === 0 ? labels.noCandidates : recipient === void 0 ? labels.chooseFirst : void 0,
+      onConfirm: (values) => recipient === void 0 ? void 0 : onTransfer({ toUserId: recipient.id, confirmEmail: values.confirmEmail }),
+      onClose,
+      describeError,
+      children: [
+        summary && /* @__PURE__ */ jsx("div", { className: "text-sm text-[var(--text-secondary)]", children: summary }),
+        /* @__PURE__ */ jsxs(Select, { label: labels.recipient, value: chosen, onChange: (event) => setChosen(event.target.value), children: [
+          /* @__PURE__ */ jsx("option", { value: "", children: labels.choose }),
+          rows.map((row) => /* @__PURE__ */ jsx("option", { value: row.value, disabled: Boolean(row.reason), children: row.text }, row.value))
+        ] }),
+        available.length === 0 && /* @__PURE__ */ jsx(Caption, { children: labels.noCandidates })
+      ]
+    }
+  );
+}
+export {
+  DEFAULT_TRANSFER_OWNERSHIP_LABELS,
+  TransferOwnershipDialog
+};
+//# sourceMappingURL=transfer-ownership-dialog.js.map

package/dist/admin/transfer-ownership-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/admin/transfer-ownership-dialog.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { useKitLabels } from \"../i18n/kit-labels\";\nimport { Select } from \"../components/ui\";\nimport { Caption } from \"../components/text\";\nimport { AdminActionConfirm } from \"./admin-action-confirm\";\nimport type { AdminActionTarget, AdminConfirmLevel } from \"./admin-action-confirm\";\nimport { usePersonLabel } from \"./admin-parts\";\nimport type { AdminPerson, MaybePromise } from \"./admin-parts\";\n\n/**\n * Hand an account's owned work to another account — Kurvenschmiede's `TypedConfirm`\n * with its recipient select (features/admin/typed-confirm.tsx, users-panel.tsx;\n * docs/user-admin-harmonization.md §4.1 `POST /admin/users/{id}/transfer {to,\n * confirm_email}`, §4.2: `type_email`).\n *\n * It is {@link AdminActionConfirm} with the recipient as the action's own field: the\n * typed address is the SOURCE account's — the one whose work moves, which is the row the\n * admin must prove they are on — and the confirm waits for a recipient too.\n *\n * WHO MAY RECEIVE IT (§9.6): never a customer, never a deactivated account, never the\n * account itself. The APP decides — it knows its roles and states — and marks each\n * candidate with why it cannot (`unavailable`); the kit shows those accounts, unavailable,\n * with the reason, rather than leaving the admin to wonder where somebody went. The\n * source account is marked `self` here whether or not the app did.\n */\n\n/** Why a candidate cannot receive the work: the kit's three, or the app's own words. */\nexport type TransferUnavailable = \"customer\" | \"deactivated\" | \"self\";\n\n/** An account that might receive the work. */\nexport interface TransferCandidate extends AdminPerson {\n  id: string | number;\n  email: string;\n  /** Why it cannot: `\"customer\"`, `\"deactivated\"`, `\"self\"`, or the app's own words. */\n  unavailable?: TransferUnavailable | (string & {});\n}\n\n/** What {@link TransferOwnershipDialogProps.onTransfer} receives — the request body. */\nexport interface TransferValues {\n  toUserId: string | number;\n  /** The source account's address as typed (at `type_email`). */\n  confirmEmail?: string;\n}\n\n/** The `transferOwnership` namespace. The guard and the refusals are `adminAction`'s\n *  and `dangerConfirm`'s. */\nexport interface TransferOwnershipLabels {\n  /** The heading — \"Hand on Ada Example’s work\". */\n  title: (name: string) => string;\n  /** What happens. */\n  body: string;\n  /** The recipient select's label. */\n  recipient: string;\n  /** Its empty first option. */\n  choose: string;\n  /** Why the confirm is held while nobody is chosen. */\n  chooseFirst: string;\n  /** The confirm button. */\n  confirm: string;\n  /** Reasons, said after the account's name inside its option. */\n  customer: string;\n  deactivated: string;\n  self: string;\n  /** An unavailable option's text: the account and why. */\n  unavailable: (account: string, reason: string) => string;\n  /** No account can receive it. */\n  noCandidates: string;\n}\n\nexport const DEFAULT_TRANSFER_OWNERSHIP_LABELS: TransferOwnershipLabels = {\n  title: (name) => `Hand on ${name}’s work`,\n  body: \"Everything this account owns moves to the account you choose, in one step.\",\n  recipient: \"Hand it to\",\n  choose: \"Choose an account…\",\n  chooseFirst: \"Choose who receives the work\",\n  confirm: \"Hand it on\",\n  customer: \"a customer\",\n  deactivated: \"deactivated\",\n  self: \"the same account\",\n  unavailable: (account, reason) => `${account} (${reason})`,\n  noCandidates: \"No other account can receive it.\",\n};\n\nexport interface TransferOwnershipDialogProps {\n  /** The account whose work moves — its address is what the admin types. */\n  from: AdminActionTarget;\n  /** Who might receive it, each marked with why not where it cannot. */\n  candidates: readonly TransferCandidate[];\n  /** What moves, in the app's words — \"3 sessions · 1 gear · 2 projects\" (counts, never\n   *  content). Under the sentence. */\n  summary?: ReactNode;\n  /** Sends it. Promise handling as {@link AdminActionConfirm}'s `onConfirm`. */\n  onTransfer: (values: TransferValues) => MaybePromise;\n  onClose: (done: boolean) => void;\n  /** The server's level for `transfer` — `type_email` (§4.2), the default. A transfer\n   *  always has a recipient to choose, so `none` asks as `acknowledge` does. */\n  level?: AdminConfirmLevel;\n  describeError?: (error: unknown) => ReactNode | undefined;\n  /** Kept-mounted mode. */\n  open?: boolean;\n  labels?: Partial<TransferOwnershipLabels>;\n}\n\nexport function TransferOwnershipDialog({\n  from,\n  candidates,\n  summary,\n  onTransfer,\n  onClose,\n  level = \"type_email\",\n  describeError,\n  open,\n  labels: labelsProp,\n}: TransferOwnershipDialogProps) {\n  const labels = useKitLabels(\"transferOwnership\", DEFAULT_TRANSFER_OWNERSHIP_LABELS, labelsProp);\n  const nameOf = usePersonLabel();\n  const [chosen, setChosen] = useState(\"\");\n\n  const reasonOf = (candidate: TransferCandidate): string | undefined => {\n    const own = candidate.unavailable;\n    const isSource =\n      (from.id !== undefined && from.id !== null && candidate.id === from.id) ||\n      candidate.email.trim().toLowerCase() === from.email.trim().toLowerCase();\n    const code = isSource ? \"self\" : own;\n    if (!code) return undefined;\n    if (code === \"customer\") return labels.customer;\n    if (code === \"deactivated\") return labels.deactivated;\n    if (code === \"self\") return labels.self;\n    return code;\n  };\n\n  const rows = candidates.map((candidate) => {\n    const name = nameOf(candidate);\n    const shown = name && name !== candidate.email ? `${name} — ${candidate.email}` : candidate.email;\n    const reason = reasonOf(candidate);\n    return { candidate, value: String(candidate.id), text: reason ? labels.unavailable(shown, reason) : shown, reason };\n  });\n  const available = rows.filter((row) => !row.reason);\n  const recipient = available.find((row) => row.value === chosen)?.candidate;\n\n  return (\n    <AdminActionConfirm\n      open={open}\n      level={level === \"none\" ? \"acknowledge\" : level}\n      target={from}\n      title={labels.title(nameOf(from))}\n      consequence={labels.body}\n      confirmLabel={labels.confirm}\n      tone=\"danger\"\n      confirmDisabledReason={\n        available.length === 0 ? labels.noCandidates : recipient === undefined ? labels.chooseFirst : undefined\n      }\n      onConfirm={(values) =>\n        recipient === undefined ? undefined : onTransfer({ toUserId: recipient.id, confirmEmail: values.confirmEmail })\n      }\n      onClose={onClose}\n      describeError={describeError}\n    >\n      {summary && <div className=\"text-sm text-[var(--text-secondary)]\">{summary}</div>}\n      <Select label={labels.recipient} value={chosen} onChange={(event) => setChosen(event.target.value)}>\n        <option value=\"\">{labels.choose}</option>\n        {rows.map((row) => (\n          <option key={row.value} value={row.value} disabled={Boolean(row.reason)}>\n            {row.text}\n          </option>\n        ))}\n      </Select>\n      {available.length === 0 && <Caption>{labels.noCandidates}</Caption>}\n    </AdminActionConfirm>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/admin/user-roster.d.ts

@@ -0,0 +1,95 @@
+import 'react';
+import 'lucide-react';
+import '../lib/format.js';
+import '../lib/person-name.js';
+import '../components/account-chips.js';
+import '../components/chip.js';
+import '../data-table-labels-DUELeXpa.js';
+import '../components/data-table-sort.js';
+export { bz as AdminUserStateFields, cJ as DEFAULT_USER_ROSTER_LABELS, et as RoleEditing, eB as RosterState, f8 as USER_ROSTER_SORT_KEYS, ff as UserIdentityCell, fg as UserIdentityCellProps, fh as UserRosterColumnsOptions, fi as UserRosterLabels, fj as UserRosterRow, fk as UserRosterSortKey, fl as UserRowAction, fm as UserRowActionList, fn as UserRowActions, fo as UserRowActionsProps, fp as adminUserStates, fO as useUserRosterColumns, fP as userRosterColumns, fQ as userRosterSort } from '../delete-account-setting-DCFS5Vof.js';
+import '../components/swipeable-row.js';
+import '../components/tooltip.js';
+import '../hooks/use-anchored-rect.js';
+import '../lib/clipping.js';
+import '../components/mini-calendar.js';
+import '../components/calendar-heatmap.js';
+import '../components/popover.js';
+import '../components/field-sync.js';
+import '../wizard/types.js';
+import '../tour/tour.js';
+import '../search/command-palette.js';
+import '../search/global-search.js';
+import '../search/search-index.js';
+import '../components/month-picker.js';
+import '../components/page-contents.js';
+import '../components/series-chart-labels.js';
+import '../components/pie-chart-labels.js';
+import '../components/sparkline.js';
+import '../components/stat-tile.js';
+import '../components/signature-pad.js';
+import '../components/password-strength.js';
+import '../components/swatch-picker.js';
+import '../components/tile-radio.js';
+import '../components/icon-picker.js';
+import '../components/dialog-frame.js';
+import '../components/modal.js';
+import '../hooks/use-search-param-state.js';
+import '../components/measured-grid.js';
+import '../components/user-avatar.js';
+import '../components/status-dot.js';
+import '../components/progress-bar.js';
+import '../components/signed-amount.js';
+import '../shell/topbar-action-menu.js';
+import '../components/menu-item.js';
+import '../components/floating-panel.js';
+import '../hooks/use-authed-src.js';
+import '../components/account-settings-labels.js';
+import '../components/bulk-action-bar.js';
+import '../components/list.js';
+import '../components/breadcrumbs.js';
+import '../components/toast.js';
+import '../components/description-list.js';
+import '../components/line-items.js';
+import '../components/error-boundary.js';
+import '../components/authed-image.js';
+import '../components/image-grid.js';
+import '../components/lightbox.js';
+import '../components/write-lock.js';
+import '../auth/sign-in-form.js';
+import '../landing/access.js';
+import '../landing/landing-labels.js';
+import '../shell/topbar-controls.js';
+import '../theme/palette-presets.js';
+import '../theme/chart-palette.js';
+import '../theme/theme-store.js';
+import 'zustand/middleware';
+import 'zustand';
+import '../auth/complete-name-dialog.js';
+import '../auth/forgot-password-form.js';
+import '../auth/status-parts.js';
+import '../auth/reset-password-form.js';
+import '../auth/verify-email.js';
+import '../auth/not-found-page.js';
+import '../auth/accept-invitation.js';
+import '../shell/company-switcher.js';
+import '../account/email-change-setting.js';
+import '../account/sessions-setting.js';
+import '../account/data-export-setting.js';
+import './admin-parts.js';
+import './admin-action-log.js';
+import '../settings/settings-labels.js';
+import '../demo/demo-labels.js';
+import '../components/reauth-dialog.js';
+import '../components/server-wake.js';
+import '../lib/server-wake.js';
+import '../components/translation-review-labels.js';
+import '../lib/translation-review.js';
+import '../components/country-select.js';
+import '../components/inline-edit-field.js';
+import '../lib/iban.js';
+import '../lib/phone.js';
+import '../components/sign-chip.js';
+import '../components/column-mapper.js';
+import '../lib/column-mapping.js';
+import '../lib/table-text.js';
+import '../components/field-parts.js';

package/dist/admin/user-roster.js

@@ -0,0 +1,285 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { MoreHorizontal } from "lucide-react";
+import { cn } from "../lib/cn.js";
+import { useKitLabels, useKitLocale } from "../i18n/kit-labels.js";
+import { AccountStateChip, RoleChip, dateColumn } from "../components/account-chips.js";
+import { encodeSorts } from "../components/data-table-sort.js";
+import { Popover } from "../components/popover.js";
+import { Button, IconButton } from "../components/ui.js";
+import { UserAvatar } from "../components/user-avatar.js";
+import { personLabel } from "./admin-parts.js";
+import { RoleSelect } from "./role-select.js";
+function adminUserStates(row) {
+  const out = [];
+  if (row.deletion_scheduled_at || row.deletion_requested_at) {
+    out.push({ state: "deletion", date: row.deletion_scheduled_at ?? null });
+  } else if (row.is_active !== void 0) {
+    out.push(row.is_active ? "active" : "inactive");
+  }
+  if (row.email_verified === false) out.push("unverified");
+  if (row.password_change_required_at) out.push("passwordChange");
+  return out;
+}
+const USER_ROSTER_SORT_KEYS = ["name", "email", "role", "created", "last_login"];
+function userRosterSort(sorts) {
+  const first = sorts.find((s) => USER_ROSTER_SORT_KEYS.includes(s.key));
+  return first ? encodeSorts([first]) ?? void 0 : void 0;
+}
+const DEFAULT_USER_ROSTER_LABELS = {
+  name: "Name",
+  email: "Email",
+  role: "Role",
+  state: "State",
+  created: "Created",
+  lastLogin: "Last login",
+  never: "Never",
+  actions: "Actions",
+  actionsFor: (name) => `Actions for ${name}`
+};
+function UserIdentityCell({
+  person,
+  name,
+  email,
+  avatar = true,
+  badge,
+  locale: localeProp,
+  className
+}) {
+  const locale = useKitLocale(localeProp);
+  const named = personLabel({ first: person?.first, last: person?.last, name }, locale);
+  const address = (email ?? "").trim();
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex min-w-0 items-center gap-2.5", className), children: [
+    avatar && /* @__PURE__ */ jsx(UserAvatar, { person, name, email, size: "sm" }),
+    /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-1.5", children: [
+        /* @__PURE__ */ jsx("span", { "data-private": true, className: "truncate font-medium text-[var(--text-primary)]", children: named || address }),
+        badge
+      ] }),
+      named && address && /* @__PURE__ */ jsx("div", { "data-private": true, className: "truncate text-xs text-[var(--text-muted)]", children: address })
+    ] })
+  ] });
+}
+function UserRowActions({ actions, name, labels: labelsProp }) {
+  const labels = useKitLabels("userRoster", DEFAULT_USER_ROSTER_LABELS, labelsProp);
+  const entries = actions.filter((a) => Boolean(a) && !a.hidden);
+  if (entries.length === 0) return null;
+  const title = labels.actionsFor(name);
+  return /* @__PURE__ */ jsx(
+    Popover,
+    {
+      width: 240,
+      "aria-label": title,
+      className: "p-1",
+      trigger: ({ open, toggle, ref }) => /* @__PURE__ */ jsx(
+        IconButton,
+        {
+          ref,
+          size: "xs",
+          label: title,
+          "aria-haspopup": "dialog",
+          "aria-expanded": open,
+          stopPropagation: true,
+          onClick: toggle,
+          children: /* @__PURE__ */ jsx(MoreHorizontal, {})
+        }
+      ),
+      children: (close) => /* @__PURE__ */ jsx("ul", { className: "space-y-0.5", children: entries.map((action) => {
+        const Icon = action.icon;
+        return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(
+          Button,
+          {
+            type: "button",
+            variant: "ghost",
+            size: "sm",
+            stretch: true,
+            tone: action.tone === "danger" ? "danger" : void 0,
+            disabledReason: action.disabledReason,
+            className: "justify-start",
+            onClick: () => {
+              close();
+              action.onSelect();
+            },
+            children: [
+              Icon && /* @__PURE__ */ jsx(Icon, { className: "size-4 shrink-0", "aria-hidden": true }),
+              action.label
+            ]
+          }
+        ) }, action.key ?? action.label);
+      }) })
+    }
+  );
+}
+function rolesOf(row, roleOf) {
+  const raw = roleOf ? roleOf(row) : row.roles ?? row.role;
+  if (raw === null || raw === void 0 || raw === "") return [];
+  return typeof raw === "string" ? [raw] : [...raw];
+}
+function RowName({ row, children }) {
+  const locale = useKitLocale();
+  const name = personLabel(
+    { first: row.first_name, last: row.last_name, name: row.display_name, email: row.email },
+    locale
+  );
+  return /* @__PURE__ */ jsx(Fragment, { children: children(name) });
+}
+function StateChips({ states }) {
+  if (states.length === 0) return null;
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1", children: states.map((entry) => {
+    const spec = typeof entry === "string" ? { state: entry } : entry;
+    return /* @__PURE__ */ jsx(AccountStateChip, { state: spec.state, date: spec.date, tone: spec.tone, size: "xs", children: spec.label }, spec.state);
+  }) });
+}
+function userRosterColumns({
+  roles,
+  stateOf = adminUserStates,
+  extra = [],
+  actions,
+  editableRole,
+  onRoleChange,
+  roleOf,
+  emailColumn = false,
+  labels: labelsProp
+}) {
+  const labels = { ...DEFAULT_USER_ROSTER_LABELS, ...labelsProp };
+  const roleWords = (row) => rolesOf(row, roleOf).map((role) => roles[role]?.label ?? role).join(", ");
+  const columns = [
+    {
+      key: "name",
+      header: labels.name,
+      cell: (row) => /* @__PURE__ */ jsx(
+        UserIdentityCell,
+        {
+          person: { first: row.first_name, last: row.last_name },
+          name: row.display_name,
+          email: row.email
+        }
+      ),
+      // By last name, then first (auth §3.2), as the server sorts `name`.
+      sortBy: (row) => `${row.last_name ?? ""} ${row.first_name ?? ""}`.trim().toLocaleLowerCase() || row.email,
+      // Either part, in either order, or the address (auth §10.6).
+      filterBy: (row) => [row.first_name, row.last_name, row.last_name, row.first_name, row.display_name, row.email].filter(Boolean).join(" "),
+      mobilePrimary: true
+    }
+  ];
+  if (emailColumn) {
+    columns.push({
+      key: "email",
+      header: labels.email,
+      className: "whitespace-nowrap",
+      cell: (row) => /* @__PURE__ */ jsx("span", { "data-private": true, className: "text-[var(--text-secondary)]", children: row.email }),
+      sortBy: (row) => row.email.toLowerCase(),
+      filterBy: (row) => row.email,
+      mobileHidden: true
+    });
+  }
+  columns.push(
+    {
+      key: "role",
+      header: labels.role,
+      cell: (row) => {
+        const held = rolesOf(row, roleOf);
+        const editing = held.length <= 1 ? editableRole?.(row) : false;
+        if (editing && onRoleChange) {
+          const rules = editing === true ? {} : editing;
+          return /* @__PURE__ */ jsx(RowName, { row, children: (name) => /* @__PURE__ */ jsx(
+            RoleSelect,
+            {
+              size: "sm",
+              name,
+              value: held[0] ?? null,
+              roles,
+              offered: rules.offered,
+              disabledReason: rules.disabledReason,
+              optionDisabledReason: rules.optionDisabledReason,
+              onChange: (role) => onRoleChange(row, role)
+            }
+          ) });
+        }
+        if (held.length === 0) return null;
+        return /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1", children: held.map((role) => /* @__PURE__ */ jsx(RoleChip, { value: role, roles, size: "xs" }, role)) });
+      },
+      sortBy: roleWords,
+      filter: {
+        type: "select",
+        getValue: (row) => rolesOf(row, roleOf)[0] ?? "",
+        options: Object.keys(roles).map((value) => ({ value, label: roles[value].label }))
+      }
+    },
+    {
+      key: "state",
+      header: labels.state,
+      cell: (row) => /* @__PURE__ */ jsx(StateChips, { states: stateOf(row) })
+    },
+    dateColumn({
+      key: "created",
+      header: labels.created,
+      value: (row) => row.created_at ?? null,
+      column: { mobileHidden: true }
+    }),
+    // How long ago rather than a date — the question is "recently?" — with the exact
+    // time in a tooltip (keksdose's last-seen column, Kurvenschmiede's).
+    dateColumn({
+      key: "last_login",
+      header: labels.lastLogin,
+      value: (row) => row.last_login_at ?? null,
+      display: "relative",
+      empty: labels.never
+    }),
+    ...extra
+  );
+  if (actions) {
+    columns.push({
+      key: "actions",
+      header: /* @__PURE__ */ jsx("span", { className: "sr-only", children: labels.actions }),
+      headerText: labels.actions,
+      // The caller's own words only: the menu reads the provider's itself, and the
+      // English defaults merged in above must not shadow them.
+      cell: (row) => /* @__PURE__ */ jsx(RowName, { row, children: (name) => /* @__PURE__ */ jsx(UserRowActions, { actions: actions(row), name, labels: labelsProp }) }),
+      className: "w-px whitespace-nowrap text-end",
+      headClassName: "w-px",
+      // The menu button keeps its own click: a row link must not wrap it.
+      noRowLink: true
+    });
+  }
+  return columns;
+}
+function useUserRosterColumns({
+  roles,
+  stateOf,
+  extra,
+  actions,
+  editableRole,
+  onRoleChange,
+  roleOf,
+  emailColumn,
+  labels: labelsProp
+}) {
+  const labels = useKitLabels("userRoster", DEFAULT_USER_ROSTER_LABELS, labelsProp);
+  return useMemo(
+    () => userRosterColumns({
+      roles,
+      stateOf,
+      extra,
+      actions,
+      editableRole,
+      onRoleChange,
+      roleOf,
+      emailColumn,
+      labels
+    }),
+    [roles, stateOf, extra, actions, editableRole, onRoleChange, roleOf, emailColumn, labels]
+  );
+}
+export {
+  DEFAULT_USER_ROSTER_LABELS,
+  USER_ROSTER_SORT_KEYS,
+  UserIdentityCell,
+  UserRowActions,
+  adminUserStates,
+  useUserRosterColumns,
+  userRosterColumns,
+  userRosterSort
+};
+//# sourceMappingURL=user-roster.js.map

package/dist/admin/user-roster.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/admin/user-roster.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { MoreHorizontal } from \"lucide-react\";\nimport type { LucideIcon } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport type { DateInput } from \"../lib/format\";\nimport type { PersonName } from \"../lib/person-name\";\nimport { useKitLabels, useKitLocale } from \"../i18n/kit-labels\";\nimport { AccountStateChip, RoleChip, dateColumn } from \"../components/account-chips\";\nimport type { AccountState, RoleVocabulary } from \"../components/account-chips\";\nimport type { ChipTone } from \"../components/chip\";\nimport type { DataTableColumn } from \"../components/data-table\";\nimport { encodeSorts } from \"../components/data-table-sort\";\nimport type { SortState } from \"../components/data-table-sort\";\nimport { Popover } from \"../components/popover\";\nimport { Button, IconButton } from \"../components/ui\";\nimport { UserAvatar } from \"../components/user-avatar\";\nimport { personLabel } from \"./admin-parts\";\nimport { RoleSelect } from \"./role-select\";\nimport type { RoleLock } from \"./role-select\";\n\n/**\n * The admin's user list (docs/user-admin-harmonization.md §3): a column preset for the\n * kit's `DataTable`, not a table of its own.\n *\n * keksdose built its roster by hand (1150 lines, its own Badge), Kurvenschmiede on the\n * kit `DataTable` with the 0.18 chips, kastlan as a settings page. What the three share\n * is the row — name over address, a role, the account's states, created, last login, the\n * app's own columns, and a handful of actions — so that is what the kit draws, and the\n * table, its paging, its sort and its filters stay the app's `DataTable` wiring:\n *\n * ```tsx\n * const columns = useUserRosterColumns<AdminUserRow, Role>({ roles: ROLES, actions, extra });\n * <DataTable rows={page.users} columns={columns} rowKey={(r) => r.id}\n *   serverPagination={{ page, pageSize, total: page.total, onPageChange }}\n *   sorts={sorts} onSortsChange={setSorts} />\n * // GET /admin/users?sort=${userRosterSort(sorts)}&…\n * ```\n *\n * The column keys ARE the server's sort keys (§3.1): `name`, `email`, `role`, `created`,\n * `last_login` — so {@link userRosterSort} turns the table's sort state into the query\n * as it is. Phone cards come from the same columns: the identity is the card's headline,\n * the role, states, last login and the actions are its fields, created is left off.\n */\n\n/* ── Rows and states ────────────────────────────────────────────────────────── */\n\n/**\n * The fields of the contract's `AdminUserRow` the preset reads (§3.2, the auth\n * contract's `UserResponse` core). An app's row has more — its `extra` — and the\n * preset passes the whole row to every callback.\n */\nexport interface UserRosterRow extends AdminUserStateFields {\n  id: string | number;\n  email: string;\n  first_name?: string | null;\n  last_name?: string | null;\n  /** The derived whole name — only the fallback when both parts are blank. */\n  display_name?: string | null;\n  /** keksdose, Kurvenschmiede: one role. */\n  role?: string | null;\n  /** kastlan: the account's roles in the current company. Wins over `role`. */\n  roles?: readonly string[] | null;\n  created_at?: DateInput;\n  /** Account-wide; kastlan's comes from its session rows (§3.2). */\n  last_login_at?: DateInput;\n}\n\n/** The state fields of the contract's row that {@link adminUserStates} maps (§3.2). */\nexport interface AdminUserStateFields {\n  is_active?: boolean;\n  email_verified?: boolean;\n  password_change_required_at?: string | null;\n  /** `after_days` mode: the day the account is erased (§6.4). */\n  deletion_scheduled_at?: string | null;\n  /** When the user asked. The only deletion field in kastlan's `operator` mode, where\n   *  nothing is scheduled. */\n  deletion_requested_at?: string | null;\n}\n\n/** One state chip of a row: an {@link AccountState}, or one with its `date` (the\n *  `deletion` day), a `tone` or the app's own words. */\nexport type RosterState =\n  | AccountState\n  | { state: AccountState; date?: DateInput; tone?: ChipTone; label?: ReactNode };\n\n/**\n * The contract's row as state chips (§3.2: \"map 1:1 to the kit's AccountStateChip\"):\n *\n * - marked for deletion → `deletion` with the scheduled day (none in `operator` mode),\n *   IN PLACE of `inactive` — such an account is always deactivated (§2.1);\n * - else `active` / `inactive` from `is_active`;\n * - `unverified` when `email_verified` is `false` (not when it is missing);\n * - `passwordChange` while `password_change_required_at` is set.\n */\nexport function adminUserStates(row: AdminUserStateFields): RosterState[] {\n  const out: RosterState[] = [];\n  if (row.deletion_scheduled_at || row.deletion_requested_at) {\n    out.push({ state: \"deletion\", date: row.deletion_scheduled_at ?? null });\n  } else if (row.is_active !== undefined) {\n    out.push(row.is_active ? \"active\" : \"inactive\");\n  }\n  if (row.email_verified === false) out.push(\"unverified\");\n  if (row.password_change_required_at) out.push(\"passwordChange\");\n  return out;\n}\n\n/** The server's sort keys, which are the preset's column keys (§3.1). */\nexport const USER_ROSTER_SORT_KEYS = [\"name\", \"email\", \"role\", \"created\", \"last_login\"] as const;\nexport type UserRosterSortKey = (typeof USER_ROSTER_SORT_KEYS)[number];\n\n/**\n * The table's sort state as the `sort` query parameter of `GET /admin/users` (§3.1), in\n * the DataTable's own encoding ({@link encodeSorts}: `\"last_login.desc\"`), which\n * server-kit 0.4 reads beside the `-key` form. Only the first criterion on one of the\n * server's keys: an app's own column (`owned`) is the client's to sort, and the query\n * takes one key — a shift-clicked second criterion is not sent. `undefined` when nothing\n * the server knows is sorted, so its default order applies.\n */\nexport function userRosterSort(sorts: readonly SortState[]): string | undefined {\n  const first = sorts.find((s) => (USER_ROSTER_SORT_KEYS as readonly string[]).includes(s.key));\n  return first ? (encodeSorts([first]) ?? undefined) : undefined;\n}\n\n/* ── Labels ─────────────────────────────────────────────────────────────────── */\n\n/** The `userRoster` namespace: the preset's headers and the action menu's words. */\nexport interface UserRosterLabels {\n  /** The identity column — the name with the address under it. */\n  name: string;\n  /** The separate address column (`emailColumn`). */\n  email: string;\n  role: string;\n  state: string;\n  created: string;\n  lastLogin: string;\n  /** A last login that never happened. */\n  never: string;\n  /** The actions column's (hidden) header. */\n  actions: string;\n  /** The action menu's button and panel — \"Actions for Ada Example\". */\n  actionsFor: (name: string) => string;\n}\n\nexport const DEFAULT_USER_ROSTER_LABELS: UserRosterLabels = {\n  name: \"Name\",\n  email: \"Email\",\n  role: \"Role\",\n  state: \"State\",\n  created: \"Created\",\n  lastLogin: \"Last login\",\n  never: \"Never\",\n  actions: \"Actions\",\n  actionsFor: (name) => `Actions for ${name}`,\n};\n\n/* ── UserIdentityCell ───────────────────────────────────────────────────────── */\n\nexport interface UserIdentityCellProps {\n  /** First and last name (auth §3.2), shown in the READER's order. */\n  person?: PersonName | null;\n  /** A whole name, for an API that still sends `display_name` only. */\n  name?: string | null;\n  email?: string | null;\n  /** The initials avatar before the name. Default true. */\n  avatar?: boolean;\n  /** After the name, on its line — a \"You\" chip, a demo mark. */\n  badge?: ReactNode;\n  /** Over the provider's locale. */\n  locale?: string;\n  className?: string;\n}\n\n/**\n * Who an account is, in one cell (§3.3): the initials avatar, the name in the reader's\n * order ({@link formatPersonName} — \"Example Ada\" in Hungarian) and the address under it\n * — the cell both rosters drew by hand. An account with no name yet (a migrated row\n * before `CompleteNameDialog`, an invitee) shows its address once, as the name.\n *\n * Both lines carry `data-private`, so keksdose's demo blur reaches them.\n */\nexport function UserIdentityCell({\n  person,\n  name,\n  email,\n  avatar = true,\n  badge,\n  locale: localeProp,\n  className,\n}: UserIdentityCellProps) {\n  const locale = useKitLocale(localeProp);\n  const named = personLabel({ first: person?.first, last: person?.last, name }, locale);\n  const address = (email ?? \"\").trim();\n  return (\n    <div className={cn(\"flex min-w-0 items-center gap-2.5\", className)}>\n      {avatar && <UserAvatar person={person} name={name} email={email} size=\"sm\" />}\n      <div className=\"min-w-0\">\n        <div className=\"flex min-w-0 items-center gap-1.5\">\n          <span data-private className=\"truncate font-medium text-[var(--text-primary)]\">\n            {named || address}\n          </span>\n          {badge}\n        </div>\n        {named && address && (\n          <div data-private className=\"truncate text-xs text-[var(--text-muted)]\">\n            {address}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n}\n\n/* ── The row's actions ──────────────────────────────────────────────────────── */\n\n/** One entry of a row's action menu (§4). */\nexport interface UserRowAction {\n  /** React key. Default: the label. */\n  key?: string;\n  label: string;\n  /** Runs it — usually opens `AdminActionConfirm` with the level the server states. */\n  onSelect: () => void;\n  icon?: LucideIcon;\n  /** `danger` for deactivate, transfer, erase. */\n  tone?: \"default\" | \"danger\";\n  /** Why it is not available for this row (\"You can’t deactivate yourself\"). The entry\n   *  stays in the menu, focusable, and says so — an action that silently vanished\n   *  would leave the admin looking for it. */\n  disabledReason?: ReactNode;\n  /** Leave it out for this row. */\n  hidden?: boolean;\n}\n\n/** What `actions(row)` may return: entries, and `false` / `null` for the ones a\n *  condition left out (`row.is_active && {…}`). */\nexport type UserRowActionList = readonly (UserRowAction | false | null | undefined)[];\n\nexport interface UserRowActionsProps {\n  actions: UserRowActionList;\n  /** The account's name, for the menu's name — \"Actions for Ada Example\". */\n  name: string;\n  labels?: Partial<UserRosterLabels>;\n}\n\n/**\n * A row's actions as one \"…\" button and a menu of them: keksdose had a strip of icon\n * buttons in the expanded row, Kurvenschmiede five text buttons in a cell — neither fits\n * a phone card, and both grow with every action §2.4 adds. The menu is portalled, so a\n * table's scroller cannot clip it; Escape and an outside press close it, and focus goes\n * back to the button, which is where a confirmation dialog then returns it.\n */\nexport function UserRowActions({ actions, name, labels: labelsProp }: UserRowActionsProps) {\n  const labels = useKitLabels(\"userRoster\", DEFAULT_USER_ROSTER_LABELS, labelsProp);\n  const entries = actions.filter((a): a is UserRowAction => Boolean(a) && !(a as UserRowAction).hidden);\n  if (entries.length === 0) return null;\n  const title = labels.actionsFor(name);\n  return (\n    <Popover\n      width={240}\n      aria-label={title}\n      className=\"p-1\"\n      trigger={({ open, toggle, ref }) => (\n        <IconButton\n          ref={ref}\n          size=\"xs\"\n          label={title}\n          aria-haspopup=\"dialog\"\n          aria-expanded={open}\n          stopPropagation\n          onClick={toggle}\n        >\n          <MoreHorizontal />\n        </IconButton>\n      )}\n    >\n      {(close) => (\n        <ul className=\"space-y-0.5\">\n          {entries.map((action) => {\n            const Icon = action.icon;\n            return (\n              <li key={action.key ?? action.label}>\n                <Button\n                  type=\"button\"\n                  variant=\"ghost\"\n                  size=\"sm\"\n                  stretch\n                  tone={action.tone === \"danger\" ? \"danger\" : undefined}\n                  disabledReason={action.disabledReason}\n                  className=\"justify-start\"\n                  onClick={() => {\n                    close();\n                    action.onSelect();\n                  }}\n                >\n                  {Icon && <Icon className=\"size-4 shrink-0\" aria-hidden />}\n                  {action.label}\n                </Button>\n              </li>\n            );\n          })}\n        </ul>\n      )}\n    </Popover>\n  );\n}\n\n/* ── The preset ─────────────────────────────────────────────────────────────── */\n\n/** How a row's role may be changed inline: `true`, or with reasons. */\nexport interface RoleEditing<R extends string> {\n  /** Why the whole select is locked for this row — `\"self\"`, `\"last_admin\"`, or words. */\n  disabledReason?: RoleLock;\n  /** Why one role cannot be chosen for this row (a string: it goes inside an option). */\n  optionDisabledReason?: (role: R) => string | undefined;\n  /** The roles that may be chosen. Default: the whole vocabulary. */\n  offered?: readonly R[];\n}\n\nexport interface UserRosterColumnsOptions<T extends UserRosterRow, R extends string = string> {\n  /** The app's roles, as `RoleChip` reads them. */\n  roles: RoleVocabulary<R>;\n  /** The row's state chips. Default {@link adminUserStates}, which reads the contract's\n   *  fields (`is_active`, `email_verified`, `password_change_required_at`,\n   *  `deletion_scheduled_at`, `deletion_requested_at`). */\n  stateOf?: (row: T) => readonly RosterState[];\n  /** The app's own columns — keksdose's plan and key custody, Kurvenschmiede's owned\n   *  counts — after the dates, before the actions. */\n  extra?: readonly DataTableColumn<T>[];\n  /** The row's action menu (§4). Left out: no actions column. */\n  actions?: (row: T) => UserRowActionList;\n  /**\n   * Whether this row's role is a select rather than a chip, and with which reasons.\n   * Left out, or `false`: a chip. kastlan's several roles are never a select here — they\n   * are a \"Manage roles\" action that opens `RolesEditor`.\n   */\n  editableRole?: (row: T) => boolean | RoleEditing<R>;\n  /** A role was picked in a row's select. The app confirms (`acknowledge`) and sends it. */\n  onRoleChange?: (row: T, role: R) => void;\n  /** The row's role(s). Default `row.roles ?? row.role`. */\n  roleOf?: (row: T) => R | readonly R[] | null | undefined;\n  /** A separate, sortable \"Email\" column (the server's `email` sort key) beside the\n   *  identity. Default false: the address is under the name already. */\n  emailColumn?: boolean;\n  /** The words, already resolved. Default English; {@link useUserRosterColumns} reads\n   *  the provider's `userRoster` namespace. */\n  labels?: Partial<UserRosterLabels>;\n}\n\nfunction rolesOf<T extends UserRosterRow, R extends string>(\n  row: T,\n  roleOf: UserRosterColumnsOptions<T, R>[\"roleOf\"],\n): R[] {\n  const raw = roleOf ? roleOf(row) : ((row.roles ?? row.role) as R | readonly R[] | null | undefined);\n  if (raw === null || raw === undefined || raw === \"\") return [];\n  return typeof raw === \"string\" ? [raw as R] : [...(raw as readonly R[])];\n}\n\n/** The row's name in the reader's order — a component, because the order is the\n *  READER's and the locale comes from the provider. */\nfunction RowName<T extends UserRosterRow>({ row, children }: { row: T; children: (name: string) => ReactNode }) {\n  const locale = useKitLocale();\n  const name = personLabel(\n    { first: row.first_name, last: row.last_name, name: row.display_name, email: row.email },\n    locale,\n  );\n  return <>{children(name)}</>;\n}\n\nfunction StateChips({ states }: { states: readonly RosterState[] }) {\n  if (states.length === 0) return null;\n  return (\n    <div className=\"flex flex-wrap gap-1\">\n      {states.map((entry) => {\n        const spec = typeof entry === \"string\" ? { state: entry } : entry;\n        return (\n          <AccountStateChip key={spec.state} state={spec.state} date={spec.date} tone={spec.tone} size=\"xs\">\n            {spec.label}\n          </AccountStateChip>\n        );\n      })}\n    </div>\n  );\n}\n\n/**\n * The roster's columns, in the contract's order (§3.3):\n *\n * | key | cell | sort | phone |\n * |---|---|---|---|\n * | `name` | {@link UserIdentityCell} | last, first | the card's headline |\n * | `email` | the address (`emailColumn` only) | address | hidden |\n * | `role` | `RoleChip`(s), or {@link RoleSelect} where `editableRole` | role | field |\n * | `state` | `AccountStateChip`s from `stateOf` | — | field |\n * | `created` | `dateColumn` | instant | hidden |\n * | `last_login` | `dateColumn`, relative, \"Never\" | instant | field |\n * | …`extra` | the app's | the app's | the app's |\n * | `actions` | {@link UserRowActions} | — | field |\n *\n * Pure: hand it resolved words, or use {@link useUserRosterColumns}. The keys are stable,\n * so an app may drop or move a column (`columns.filter((c) => c.key !== \"created\")`).\n * Under `serverPagination` the `sortBy`s only make the headers clickable; the app sends\n * the sort ({@link userRosterSort}).\n */\nexport function userRosterColumns<T extends UserRosterRow, R extends string = string>({\n  roles,\n  stateOf = adminUserStates,\n  extra = [],\n  actions,\n  editableRole,\n  onRoleChange,\n  roleOf,\n  emailColumn = false,\n  labels: labelsProp,\n}: UserRosterColumnsOptions<T, R>): DataTableColumn<T>[] {\n  const labels: UserRosterLabels = { ...DEFAULT_USER_ROSTER_LABELS, ...labelsProp };\n  const roleWords = (row: T) =>\n    rolesOf(row, roleOf)\n      .map((role) => roles[role]?.label ?? role)\n      .join(\", \");\n  const columns: DataTableColumn<T>[] = [\n    {\n      key: \"name\",\n      header: labels.name,\n      cell: (row) => (\n        <UserIdentityCell\n          person={{ first: row.first_name, last: row.last_name }}\n          name={row.display_name}\n          email={row.email}\n        />\n      ),\n      // By last name, then first (auth §3.2), as the server sorts `name`.\n      sortBy: (row) => `${row.last_name ?? \"\"} ${row.first_name ?? \"\"}`.trim().toLocaleLowerCase() || row.email,\n      // Either part, in either order, or the address (auth §10.6).\n      filterBy: (row) =>\n        [row.first_name, row.last_name, row.last_name, row.first_name, row.display_name, row.email]\n          .filter(Boolean)\n          .join(\" \"),\n      mobilePrimary: true,\n    },\n  ];\n  if (emailColumn) {\n    columns.push({\n      key: \"email\",\n      header: labels.email,\n      className: \"whitespace-nowrap\",\n      cell: (row) => (\n        <span data-private className=\"text-[var(--text-secondary)]\">\n          {row.email}\n        </span>\n      ),\n      sortBy: (row) => row.email.toLowerCase(),\n      filterBy: (row) => row.email,\n      mobileHidden: true,\n    });\n  }\n  columns.push(\n    {\n      key: \"role\",\n      header: labels.role,\n      cell: (row) => {\n        const held = rolesOf(row, roleOf);\n        const editing = held.length <= 1 ? editableRole?.(row) : false;\n        if (editing && onRoleChange) {\n          const rules: RoleEditing<R> = editing === true ? {} : editing;\n          return (\n            <RowName row={row}>\n              {(name) => (\n                <RoleSelect<R>\n                  size=\"sm\"\n                  name={name}\n                  value={held[0] ?? null}\n                  roles={roles}\n                  offered={rules.offered}\n                  disabledReason={rules.disabledReason}\n                  optionDisabledReason={rules.optionDisabledReason}\n                  onChange={(role) => onRoleChange(row, role)}\n                />\n              )}\n            </RowName>\n          );\n        }\n        if (held.length === 0) return null;\n        return (\n          <div className=\"flex flex-wrap gap-1\">\n            {held.map((role) => (\n              <RoleChip<R> key={role} value={role} roles={roles} size=\"xs\" />\n            ))}\n          </div>\n        );\n      },\n      sortBy: roleWords,\n      filter: {\n        type: \"select\",\n        getValue: (row) => rolesOf(row, roleOf)[0] ?? \"\",\n        options: (Object.keys(roles) as R[]).map((value) => ({ value, label: roles[value].label })),\n      },\n    },\n    {\n      key: \"state\",\n      header: labels.state,\n      cell: (row) => <StateChips states={stateOf(row)} />,\n    },\n    dateColumn<T>({\n      key: \"created\",\n      header: labels.created,\n      value: (row) => row.created_at ?? null,\n      column: { mobileHidden: true },\n    }),\n    // How long ago rather than a date — the question is \"recently?\" — with the exact\n    // time in a tooltip (keksdose's last-seen column, Kurvenschmiede's).\n    dateColumn<T>({\n      key: \"last_login\",\n      header: labels.lastLogin,\n      value: (row) => row.last_login_at ?? null,\n      display: \"relative\",\n      empty: labels.never,\n    }),\n    ...extra,\n  );\n  if (actions) {\n    columns.push({\n      key: \"actions\",\n      header: <span className=\"sr-only\">{labels.actions}</span>,\n      headerText: labels.actions,\n      // The caller's own words only: the menu reads the provider's itself, and the\n      // English defaults merged in above must not shadow them.\n      cell: (row) => (\n        <RowName row={row}>\n          {(name) => <UserRowActions actions={actions(row)} name={name} labels={labelsProp} />}\n        </RowName>\n      ),\n      className: \"w-px whitespace-nowrap text-end\",\n      headClassName: \"w-px\",\n      // The menu button keeps its own click: a row link must not wrap it.\n      noRowLink: true,\n    });\n  }\n  return columns;\n}\n\n/**\n * {@link userRosterColumns} with the `userRoster` words from the provider, memoised on\n * the options — pass stable callbacks (`useCallback`) and a module-level vocabulary, or\n * the columns are rebuilt on every render.\n */\nexport function useUserRosterColumns<T extends UserRosterRow, R extends string = string>({\n  roles,\n  stateOf,\n  extra,\n  actions,\n  editableRole,\n  onRoleChange,\n  roleOf,\n  emailColumn,\n  labels: labelsProp,\n}: UserRosterColumnsOptions<T, R>): DataTableColumn<T>[] {\n  const labels = useKitLabels(\"userRoster\", DEFAULT_USER_ROSTER_LABELS, labelsProp);\n  return useMemo(\n    () =>\n      userRosterColumns<T, R>({\n        roles,\n        stateOf,\n        extra,\n        actions,\n        editableRole,\n        onRoleChange,\n        roleOf,\n        emailColumn,\n        labels,\n      }),\n    [roles, stateOf, extra, actions, editableRole, onRoleChange, roleOf, emailColumn, labels],\n  );\n}\n"],"mappings":"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","names":[]}