@eifi1/ui-kit 0.33.0 → 0.34.0

package/src/admin/admin-action-log.tsx

@@ -2,13 +2,16 @@ import type { ReactNode } from "react";
 import { cn } from "../lib/cn";
 import type { DateInput } from "../lib/format";
 import { useKitLabels } from "../i18n/kit-labels";
+import type { LabelOverride } from "../i18n/kit-labels";
 import { DateMark } from "../components/account-chips";
 import { Chip } from "../components/chip";
 import { Pagination } from "../components/data-table-pagination";
 import { Caption } from "../components/text";
-import { Button, Spinner } from "../components/ui";
+import { Button } from "../components/button";
+import { Spinner } from "../components/spinner";
 import { usePersonLabel } from "./admin-parts";
 import type { AdminPerson } from "./admin-parts";
+import { DEFAULT_ADMIN_ACTION_LOG_LABELS } from "./admin-action-log-labels";
 
 /**
  * The admin actions, as the audit table records them (docs/user-admin-harmonization.md
@@ -27,6 +30,18 @@ import type { AdminPerson } from "./admin-parts";
  * "automatically". After an erasure the target's name and address are scrubbed and the
  * row stays: it reads "an erased account".
  *
+ * GROUPS (round 0.34, §11): Kurvenschmiede's teams, kastlan's companies and keksdose's
+ * budgets are groups of accounts, and the vocabulary has words for what is done to one
+ * (`group_create`, `group_rename`, `group_delete`) and to who is in it (`membership_add`,
+ * `membership_role`, `membership_remove`). A row about the group itself has the group as
+ * its `target`; a row about a person in it has the person as its target and the group as
+ * its `group`, drawn after the person by its name alone, muted — no preposition, so no
+ * language has to inflect the name. The kinds and codes say "group"; the labels say the
+ * app's own noun, picked with `groupNoun` — whole phrases per noun, since a noun dropped
+ * into one phrase breaks the participle's agreement in fr and it and the suffix in hu
+ * (decision 4). A group with no name left reads as the noun's "a deleted team"; only a
+ * missing PERSON is "an erased account".
+ *
  * It never fetches: the page of rows and the paging are the app's.
  */
 
@@ -50,7 +65,14 @@ export type AdminActionKind =
   | "erase"
   // 0.32.1 (keksdose's 0.32 report): server-kit 0.6's `AdminAction.PLAN`, an operator's
   // plan change or grant (docs/billing-harmonization.md §6).
-  | "plan";
+  | "plan"
+  // 0.34 (§11.3): what is done to a group of accounts, and to who is in it — beside
+  // `membership_remove`. server-kit 0.8's `AdminAction` has the same five.
+  | "group_create"
+  | "group_rename"
+  | "group_delete"
+  | "membership_add"
+  | "membership_role";
 
 /** Every {@link AdminActionKind}, in the contract's order. */
 export const ADMIN_ACTION_KINDS: readonly AdminActionKind[] = [
@@ -71,8 +93,71 @@ export const ADMIN_ACTION_KINDS: readonly AdminActionKind[] = [
   "deletion_cancel",
   "erase",
   "plan",
+  "group_create",
+  "group_rename",
+  "group_delete",
+  "membership_add",
+  "membership_role",
 ];
 
+/** The app's word for its groups (§11.5): Kurvenschmiede's teams, kastlan's companies,
+ *  keksdose's budgets; `group` is the neutral word. Picks the set of phrases the group
+ *  actions are said in. */
+export type AdminGroupNoun = "group" | "team" | "company" | "budget";
+
+/** The kinds said in the noun's words: the five of 0.34, and `membership_remove`. */
+type AdminGroupActionKind =
+  | "group_create"
+  | "group_rename"
+  | "group_delete"
+  | "membership_add"
+  | "membership_role"
+  | "membership_remove";
+
+const GROUP_ACTION_KINDS: ReadonlySet<string> = new Set<AdminGroupActionKind>([
+  "group_create",
+  "group_rename",
+  "group_delete",
+  "membership_add",
+  "membership_role",
+  "membership_remove",
+]);
+
+/**
+ * A group as a log target (§11.4): a row about the group itself (`group_*`, kastlan's
+ * `plan`), or the `group` a person was added to, moved in or taken out of. The app joins
+ * its `name` when the log is read — from the live group, else from its `group_delete`
+ * row's stamp (`target_group_name`, decision 6) — as it joins a person's. With no name
+ * left it reads as the noun's "a deleted team".
+ */
+export interface AdminGroupTarget {
+  kind: "group";
+  id?: string | number | null;
+  name?: string | null;
+}
+
+/** A target that is neither a person nor a group (§11.4): an app's own action on a demo
+ *  dataset or a setting, said by its `label`. */
+export interface AdminOtherTarget {
+  kind: "other";
+  /** What it was done to, in the app's words, as it is drawn. */
+  label: string;
+  /** The app's id for it, when it has one. Beyond §11.4's shape so that code reading
+   *  `entry.target.id` on any target — keksdose's filter, the showcase's — still
+   *  type-checks against the wider union. */
+  id?: string | number | null;
+}
+
+/** Whether a target is a group. A person has no `kind`; an object whose `kind` is
+ *  anything else is read as a person too. */
+export function isGroupTarget(target: unknown): target is AdminGroupTarget {
+  return typeof target === "object" && target !== null && (target as { kind?: unknown }).kind === "group";
+}
+
+function isOtherTarget(target: unknown): target is AdminOtherTarget {
+  return typeof target === "object" && target !== null && (target as { kind?: unknown }).kind === "other";
+}
+
 /** One logged action — the app's `admin_actions` row with the people joined in. */
 export interface AdminActionLogEntry {
   id: string | number;
@@ -86,9 +171,17 @@ export interface AdminActionLogEntry {
   actor: AdminPerson | "self" | null;
   /** A {@link AdminActionKind}, or one of the app's own (named in `labels.actions`). */
   action: AdminActionKind | (string & {});
-  /** Whom it was done to. `null`, or a person with nothing left in it: an erased
-   *  account. An invitation's target is its address (`target_email`). */
-  target?: AdminPerson | null;
+  /**
+   * What it was done to (§11.4): a person (no `kind`) — `null`, or a person with nothing
+   * left in it, is "an erased account", and an invitation's person is its address
+   * (`target_email`); a group (`kind: "group"`), for a row about the group itself; or
+   * something else (`kind: "other"`), said by its label. Left out: nothing is drawn
+   * (until 0.34 it read as erased).
+   */
+  target?: AdminPerson | AdminGroupTarget | AdminOtherTarget | null;
+  /** The group a `membership_*` or invitation row happened in, drawn after the person
+   *  by its name (§11.4). */
+  group?: AdminGroupTarget | null;
   /** The `detail` in the app's words — "Member → Admin", "12 items to Ben Example". */
   detail?: ReactNode;
 }
@@ -114,41 +207,36 @@ export interface AdminActionLogLabels {
   /** A target name as a filter button — "Show only the actions on Ada Example". */
   filterBy: (target: string) => string;
   /** What each action is called, past tense, keyed by the vocabulary. An app adds its
-   *  own here (`labels={{ actions: { plan: "Plan changed" } }}`). */
+   *  own here (`labels={{ actions: { plan: "Plan changed" } }}`). A word given here
+   *  outranks the noun's in `groupActions` — so no catalogue holds the group kinds
+   *  here, `membership_remove` included (0.34). */
   actions: { [K in AdminActionKind]?: string } & { [action: string]: string | undefined };
+  /** The group actions in each noun's words (§11.5), picked with `groupNoun`. */
+  groupActions: Record<AdminGroupNoun, AdminGroupActionLabels>;
 }
 
-export const DEFAULT_ADMIN_ACTION_LOG_LABELS: AdminActionLogLabels = {
-  title: "Admin actions",
-  empty: "No admin actions yet.",
-  loading: "Loading…",
-  by: (actor) => `by ${actor}`,
-  bySelf: "by the user themselves",
-  automatic: "automatically",
-  erased: "an erased account",
-  filteredTo: (target) => `Only ${target}`,
-  showAll: "Show all actions",
-  filterBy: (target) => `Show only the actions on ${target}`,
-  actions: {
-    deactivate: "Deactivated",
-    reactivate: "Reactivated",
-    role: "Role changed",
-    membership_remove: "Removed from the company",
-    password_change_require: "New password required",
-    password_change_withdraw: "Password requirement withdrawn",
-    mail_verification: "Verification mail sent",
-    mail_reset: "Password reset mail sent",
-    reviewer: "Reviewer scope changed",
-    invite: "Invited",
-    invite_resend: "Invitation resent",
-    invite_revoke: "Invitation revoked",
-    transfer: "Work transferred",
-    deletion_request: "Deletion requested",
-    deletion_cancel: "Deletion cancelled",
-    erase: "Account erased",
-    plan: "Plan changed",
-  },
-};
+/** One noun's phrases (§11.5): whole phrases, never a noun dropped into one. */
+interface AdminGroupActionLabels {
+  /** "Team created". */
+  group_create: string;
+  /** "Team renamed". */
+  group_rename: string;
+  /** "Team deleted". */
+  group_delete: string;
+  /** "Added to the team" — said of the person, so it agrees with the account where a
+   *  language agrees (es "Añadida", fr "Ajouté"). */
+  membership_add: string;
+  /** "Role in the team changed" — the role in the group, not the account's (`role`). */
+  membership_role: string;
+  /** "Removed from the team". The `company` set's is the string `actions` held until
+   *  0.34, in every language. */
+  membership_remove: string;
+  /** A group target with no name left: "a deleted team". */
+  deleted: string;
+}
+
+// Defined in ./admin-action-log-labels, which holds no component code (0.34, KS U8).
+export { DEFAULT_ADMIN_ACTION_LOG_LABELS };
 
 /** The paging of `GET /admin/actions` — DataTable's `ServerPagination`, which the
  *  footer is. */
@@ -171,11 +259,16 @@ export interface AdminActionLogProps {
   /** The filter in force: only this account's actions are shown (`?target=`). With
    *  `onTargetFilter`, a chip says so and its × clears it. */
   target?: AdminPerson | null;
-  /** Filter by an account — or clear it with `null`. Given, every target's name is a
-   *  button that narrows the list to it. Left out, the list is not filterable here. */
+  /** Filter by an account — or clear it with `null`. Given, every person target's name
+   *  is a button that narrows the list to it; a group or other target never is (0.34:
+   *  `?target=` stays a person's). Left out, the list is not filterable here. */
   onTargetFilter?: (target: AdminPerson | null) => void;
+  /** The app's word for its groups (§11.5): picks the phrases the group actions and "a
+   *  deleted …" are said in. Default `group`; `labels.actions[kind]` still wins. */
+  groupNoun?: AdminGroupNoun;
   className?: string;
-  labels?: Partial<AdminActionLogLabels>;
+  /** Any part, at any depth: `{ groupActions: { team: { group_create: "…" } } }`. */
+  labels?: LabelOverride<AdminActionLogLabels>;
 }
 
 /** Whether a person has nothing left that names them — an erased target. */
@@ -183,8 +276,10 @@ function scrubbed(person: AdminPerson | null | undefined): boolean {
   return !person || ![person.first, person.last, person.name, person.email].some((part) => (part ?? "").trim());
 }
 
-function samePerson(a: AdminPerson, b: AdminPerson | null | undefined): boolean {
-  if (!b) return false;
+/** Whether two people are the same account. A group or other target is never a person
+ *  (§11.4), so it never reads "by the user themselves". */
+function samePerson(a: AdminPerson, b: AdminActionLogEntry["target"]): boolean {
+  if (!b || isGroupTarget(b) || isOtherTarget(b)) return false;
   if (a.id !== undefined && a.id !== null && b.id !== undefined && b.id !== null) return a.id === b.id;
   const ea = (a.email ?? "").trim().toLowerCase();
   return ea !== "" && ea === (b.email ?? "").trim().toLowerCase();
@@ -196,12 +291,35 @@ export function AdminActionLog({
   loading = false,
   target,
   onTargetFilter,
+  groupNoun = "group",
   className,
   labels: labelsProp,
 }: AdminActionLogProps) {
+  // Merged key by key at every depth, so a deep override is what `useKitLabels` takes.
   const labels = useKitLabels("adminActionLog", DEFAULT_ADMIN_ACTION_LOG_LABELS, labelsProp);
   const nameOf = usePersonLabel();
   const filtered = target !== undefined && target !== null && !scrubbed(target);
+  // A noun the type doesn't know (an app in plain JS) says the neutral word.
+  const groupWords = labels.groupActions[groupNoun] ?? labels.groupActions.group;
+
+  /** An app's own word first, then the noun's phrase for a group kind, else the key. */
+  const actionText = (action: string): string =>
+    labels.actions[action] ??
+    (GROUP_ACTION_KINDS.has(action) ? groupWords[action as AdminGroupActionKind] : undefined) ??
+    action;
+
+  /** A group by its name, or — muted, as an erased person is — the noun's "a deleted
+   *  team" when none is left. */
+  const groupText = (group: AdminGroupTarget, className?: string): ReactNode => {
+    const name = (group.name ?? "").trim();
+    return name ? (
+      <span data-private className={className}>
+        {name}
+      </span>
+    ) : (
+      <span className="italic text-muted">{groupWords.deleted}</span>
+    );
+  };
 
   const actorText = (entry: AdminActionLogEntry): string => {
     const { actor } = entry;
@@ -211,17 +329,22 @@ export function AdminActionLog({
   };
 
   const targetNode = (entry: AdminActionLogEntry): ReactNode => {
-    if (scrubbed(entry.target)) return <span className="italic text-[var(--text-muted)]">{labels.erased}</span>;
-    const person = entry.target!;
+    const subject = entry.target;
+    // Left out: nothing (§11.4). `null` is a person the erasure took.
+    if (subject === undefined) return null;
+    if (isGroupTarget(subject)) return groupText(subject, "font-medium text-primary");
+    if (isOtherTarget(subject)) return <span className="font-medium text-primary">{subject.label}</span>;
+    if (scrubbed(subject)) return <span className="italic text-muted">{labels.erased}</span>;
+    const person = subject!;
     const name = nameOf(person);
     const address = (person.email ?? "").trim();
     const text = (
       <>
-        <span data-private className="font-medium text-[var(--text-primary)]">
+        <span data-private className="font-medium text-primary">
           {name}
         </span>
         {address && address !== name && (
-          <span data-private className="ms-1 text-xs text-[var(--text-muted)]">
+          <span data-private className="ms-1 text-xs text-muted">
             {address}
           </span>
         )}
@@ -259,27 +382,30 @@ export function AdminActionLog({
         <ol
           aria-label={labels.title}
           aria-busy={loading || undefined}
-          className={cn("divide-y divide-[var(--border)]", loading && "opacity-60")}
+          className={cn("divide-y divide-subtle", loading && "opacity-60")}
         >
           {entries.map((entry) => (
             <li key={entry.id} data-action={entry.action} className="space-y-0.5 py-2 first:pt-0 last:pb-0">
               <div className="flex flex-wrap items-baseline justify-between gap-x-3 gap-y-0.5">
                 <div className="flex min-w-0 flex-wrap items-baseline gap-x-2 gap-y-0.5 text-sm">
-                  <span className="font-medium text-[var(--text-primary)]">
-                    {labels.actions[entry.action] ?? entry.action}
-                  </span>
-                  <span className="min-w-0 break-words">{targetNode(entry)}</span>
+                  <span className="font-medium text-primary">{actionText(entry.action)}</span>
+                  {entry.target !== undefined && <span className="min-w-0 break-words">{targetNode(entry)}</span>}
+                  {entry.group && (
+                    <span data-group className="min-w-0 break-words text-xs text-muted">
+                      {groupText(entry.group)}
+                    </span>
+                  )}
                 </div>
-                <DateMark value={entry.at} display="relative" className="text-xs text-[var(--text-muted)]" />
+                <DateMark value={entry.at} display="relative" className="text-xs text-muted" />
               </div>
-              <div className="text-xs text-[var(--text-muted)]">
+              <div className="text-xs text-muted">
                 <span data-private={entry.actor !== null && entry.actor !== "self" ? true : undefined}>
                   {actorText(entry)}
                 </span>
                 {entry.detail !== undefined && entry.detail !== null && entry.detail !== "" && (
                   <>
                     {" · "}
-                    <span className="text-[var(--text-secondary)]">{entry.detail}</span>
+                    <span className="text-secondary">{entry.detail}</span>
                   </>
                 )}
               </div>

package/src/admin/admin-parts.ts

@@ -1,5 +1,4 @@
 import { useCallback } from "react";
-import type { ReactNode } from "react";
 import { useKitDateFormatter, useKitLocale } from "../i18n/kit-labels";
 import { formatDate, toDate } from "../lib/format";
 import type { DateInput } from "../lib/format";
@@ -33,12 +32,6 @@ export interface AdminPerson {
   email?: string | null;
 }
 
-/** A label that is really there — `null`, `false` and `""` are what `cond && text`
- *  evaluates to on the path where there is none. */
-export function hasMessage(node: ReactNode): boolean {
-  return node !== undefined && node !== null && node !== false && node !== "";
-}
-
 /**
  * The name to say for a person, in the READER's order (auth §3.2,
  * {@link formatPersonName}), else the whole `name`, else the address, else `""`.

package/src/admin/invitations-panel-labels.ts

@@ -0,0 +1,31 @@
+// The English words of ./invitations-panel, in a module with no component code: the English
+// catalogue (src/i18n/defaults.ts) imports them without the component, so `en` loads as one
+// chunk like the other languages (0.34, KS U8). ./invitations-panel re-exports them.
+
+import type { InvitationsLabels } from "./invitations-panel";
+
+export const DEFAULT_INVITATIONS_LABELS: InvitationsLabels = {
+  email: "Email address",
+  invalidEmail: "Enter a complete email address.",
+  role: "Role",
+  scope: "Scope",
+  scopeNone: "None",
+  language: "Language of the invitation",
+  note: "Note",
+  invite: "Invite",
+  listTitle: "Invitations",
+  empty: "Nobody has been invited yet.",
+  loading: "Loading…",
+  status: { open: "Open", accepted: "Accepted", expired: "Expired", revoked: "Revoked" },
+  sent: (date) => `Sent ${date}`,
+  expires: (date) => `Expires ${date}`,
+  invitedBy: (name) => `by ${name}`,
+  resend: (email) => `Send ${email} a new link`,
+  copyLink: "Copy invitation link",
+  revoke: (email) => `Revoke the invitation for ${email}`,
+  consoleHint:
+    "Mail isn’t sent on this server — it is written to the server log. Copy each invitation link from here and pass it on yourself: it is shown only once.",
+  linkReady: (email) => `The invitation link for ${email}, shown only this once:`,
+  notSent: (email) => `${email} is invited, but the mail couldn’t be sent. Resend it.`,
+  failed: "That didn’t work. Please try again.",
+};

package/src/admin/invitations-panel.tsx

@@ -3,7 +3,7 @@ import type { FormEvent, ReactNode } from "react";
 import { RefreshCw, Trash2, UserPlus } from "lucide-react";
 import { cn } from "../lib/cn";
 import type { DateInput } from "../lib/format";
-import { useKitLabels, useKitLocale } from "../i18n/kit-labels";
+import { useKitLabels, useKitLocale, type LabelOverride } from "../i18n/kit-labels";
 import { KIT_LANGUAGES, resolveLanguage } from "../i18n/languages";
 import type { KitLanguageCode } from "../i18n/languages";
 import { RoleChip } from "../components/account-chips";
@@ -15,11 +15,16 @@ import { CopyButton } from "../components/copy-button";
 import { LanguageSelect } from "../components/language-select";
 import { SectionLabel, Caption } from "../components/text";
 import { RowActions } from "../components/row-actions";
-import { Button, Input, Select, Spinner } from "../components/ui";
+import { Button } from "../components/button";
+import { Input } from "../components/input";
+import { Select } from "../components/select";
+import { Spinner } from "../components/spinner";
 import { COMMIT_EXCEPT_BILLING, useWriteLock } from "../components/write-lock";
-import { hasMessage, settle, useDayText, usePersonLabel } from "./admin-parts";
+import { settle, useDayText, usePersonLabel } from "./admin-parts";
+import { hasContent } from "../lib/presence";
 import type { AdminPerson, MaybePromise } from "./admin-parts";
 import { RoleSelect } from "./role-select";
+import { DEFAULT_INVITATIONS_LABELS } from "./invitations-panel-labels";
 
 /**
  * Who is invited, and the form that invites (docs/user-admin-harmonization.md §5; auth
@@ -144,31 +149,8 @@ export interface InvitationsLabels {
   failed: string;
 }
 
-export const DEFAULT_INVITATIONS_LABELS: InvitationsLabels = {
-  email: "Email address",
-  invalidEmail: "Enter a complete email address.",
-  role: "Role",
-  scope: "Scope",
-  scopeNone: "None",
-  language: "Language of the invitation",
-  note: "Note",
-  invite: "Invite",
-  listTitle: "Invitations",
-  empty: "Nobody has been invited yet.",
-  loading: "Loading…",
-  status: { open: "Open", accepted: "Accepted", expired: "Expired", revoked: "Revoked" },
-  sent: (date) => `Sent ${date}`,
-  expires: (date) => `Expires ${date}`,
-  invitedBy: (name) => `by ${name}`,
-  resend: (email) => `Send ${email} a new link`,
-  copyLink: "Copy invitation link",
-  revoke: (email) => `Revoke the invitation for ${email}`,
-  consoleHint:
-    "Mail isn’t sent on this server — it is written to the server log. Copy each invitation link from here and pass it on yourself: it is shown only once.",
-  linkReady: (email) => `The invitation link for ${email}, shown only this once:`,
-  notSent: (email) => `${email} is invited, but the mail couldn’t be sent. Resend it.`,
-  failed: "That didn’t work. Please try again.",
-};
+// Defined in ./invitations-panel-labels, which holds no component code (0.34, KS U8).
+export { DEFAULT_INVITATIONS_LABELS };
 
 /** The tone of each status. */
 const STATUS_TONES: Readonly<Record<InvitationStatus, ChipTone>> = {
@@ -218,7 +200,7 @@ export interface InvitationsPanelProps<R extends string = string> {
    *  adoption); the list keeps the label as its accessible name either way. */
   listTitle?: ReactNode | null;
   className?: string;
-  labels?: Partial<InvitationsLabels>;
+  labels?: LabelOverride<InvitationsLabels>;
 }
 
 // Shape only — whether the address may be invited is the server's question.
@@ -280,7 +262,7 @@ export function InvitationsPanel<R extends string = string>({
       return await settle(call);
     } catch (error) {
       const own = describeError?.(error);
-      setFailure(hasMessage(own) ? own : labels.failed);
+      setFailure(hasContent(own) ? own : labels.failed);
       return FAILED;
     } finally {
       setBusy(null);
@@ -332,7 +314,7 @@ export function InvitationsPanel<R extends string = string>({
 
   return (
     <div className={cn("space-y-3", className)}>
-      {intro && <div className="text-sm text-[var(--text-secondary)]">{intro}</div>}
+      {intro && <div className="text-sm text-secondary">{intro}</div>}
       {mailBackend === "console" && (
         <AlertBanner tone="info" size="sm">
           {labels.consoleHint}
@@ -439,7 +421,7 @@ export function InvitationsPanel<R extends string = string>({
         ) : invitations.length === 0 ? (
           <Caption>{labels.empty}</Caption>
         ) : (
-          <ul aria-label={labels.listTitle} className="divide-y divide-[var(--border)]">
+          <ul aria-label={labels.listTitle} className="divide-y divide-subtle">
             {invitations.map((invitation) => {
               const key = String(invitation.id);
               const link = invitation.link ?? links[key];
@@ -458,7 +440,7 @@ export function InvitationsPanel<R extends string = string>({
                 <li key={key} data-status={invitation.status} className="py-2 first:pt-0 last:pb-0">
                   <div className="flex flex-wrap items-center justify-between gap-x-3 gap-y-1.5">
                     <div className="min-w-0 flex-1 basis-48 space-y-1">
-                      <div data-private className="truncate-until-large text-sm font-medium text-[var(--text-primary)]">
+                      <div data-private className="truncate-until-large text-sm font-medium text-primary">
                         {invitation.email}
                       </div>
                       <div className="flex flex-wrap items-center gap-1">
@@ -473,7 +455,7 @@ export function InvitationsPanel<R extends string = string>({
                         )}
                       </div>
                       {(facts.length > 0 || invitation.note) && (
-                        <div className="text-xs text-[var(--text-muted)]">
+                        <div className="text-xs text-muted">
                           {facts.join(" · ")}
                           {invitation.note && (
                             <>

package/src/admin/plan-change-labels.ts

@@ -0,0 +1,23 @@
+// The English words of ./plan-change, in a module with no component code: the English
+// catalogue (src/i18n/defaults.ts) imports them without the component, so `en` loads as one
+// chunk like the other languages (0.34, KS U8). ./plan-change re-exports them.
+
+import type { PlanChangeLabels } from "./plan-change";
+
+export const DEFAULT_PLAN_CHANGE_LABELS: PlanChangeLabels = {
+  column: "Plan",
+  title: "Change plan",
+  confirm: "Change plan",
+  plan: "Plan",
+  current: (plan) => `Current plan: ${plan}`,
+  keepsItems: "A smaller plan only blocks creating more; nothing is deleted.",
+  until: "Free until",
+  untilHint: "Leave empty for no end. A running beta keeps its own end.",
+  needsChange: "Pick another plan or an end date.",
+  changed: (from, to) => `Plan changed from ${from} to ${to}.`,
+  set: (to) => `Plan set to ${to}.`,
+  keptBeta: "The beta keeps its end; only the plan changed.",
+  untilDone: (date) => `Free until ${date}.`,
+  overLimit: "Above the new plan’s limit: nothing is removed, new items are blocked.",
+  usageOf: (used, limit, dimension) => `${used} of ${limit} ${dimension}`,
+};