@eifi1/ui-kit 0.53.0 → 0.55.0

package/src/components/confirm-context.ts

@@ -1,7 +0,0 @@
-import { createContext } from "react";
-import type { ConfirmFn } from "./confirm-dialog";
-
-/** The nearest `ConfirmProvider`'s `confirm`, or `null`. Internal: its own module so a
- *  part that may sit outside a provider (`RowActions`, 0.49 KIT-12) can ask without
- *  `useConfirm()`'s throw, and without adding a name to the barrel. */
-export const ConfirmContext = createContext<ConfirmFn | null>(null);

package/src/components/confirm-dialog-labels.ts

@@ -1,13 +0,0 @@
-// The English words of ./confirm-dialog, 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). ./confirm-dialog re-exports them.
-
-import type { ConfirmDialogLabels } from "./confirm-dialog";
-
-/** `satisfies` rather than a type annotation, so `.typed` stays known-callable for a
- *  caller composing its own label from it. */
-export const DEFAULT_CONFIRM_DIALOG_LABELS = {
-  confirm: "Confirm",
-  cancel: "Cancel",
-  typed: (text: string) => `Type “${text}” to confirm`,
-} satisfies ConfirmDialogLabels;

package/src/components/confirm-dialog.tsx

@@ -1,341 +0,0 @@
-import { useCallback, useContext, useEffect, useRef, useState } from "react";
-import type { ReactNode } from "react";
-
-import { useKitLabels } from "../i18n/kit-labels";
-import { TypedConfirmField, typedMatches } from "./danger-confirm";
-import type { TypedMatch } from "./danger-confirm";
-import { DialogFrame } from "./dialog-frame";
-import { Button } from "./button";
-import { useWriteLock, writeLockFor, type CommitScope } from "./write-lock";
-import { DEFAULT_CONFIRM_DIALOG_LABELS } from "./confirm-dialog-labels";
-import { ConfirmContext } from "./confirm-context";
-
-/**
- * The `confirmDialog` namespace of `<UiKitProvider labels>`: the two buttons' fallback
- * text. A call that knows what it is confirming says so per call (`confirmLabel:
- * "Delete budget"`), which is what the dialog is for — these are for the rest.
- */
-export interface ConfirmDialogLabels {
-  confirm: string;
-  cancel: string;
-  /**
-   * 0.18: label of the field a `requireTyped` confirm shows. A FUNCTION of the text to
-   * type by default — where the address sits in the sentence moves with the language —
-   * or a finished STRING. A call's own `typedLabel` wins over it.
-   *
-   * Required, like every key of a namespace: the shipped catalogues
-   * (`@eifi1/ui-kit/i18n/<code>`) translate it, and an app's own full catalogue should
-   * hear about the new string from the compiler rather than show it in English.
-   */
-  typed: string | ((text: string) => string);
-}
-
-// Defined in ./confirm-dialog-labels, which holds no component code (0.34, KS U8).
-export { DEFAULT_CONFIRM_DIALOG_LABELS };
-
-export type ConfirmTone = "danger" | "warning" | "neutral";
-
-export interface ConfirmOptions {
-  /** The question, and the dialog's accessible name. */
-  title: ReactNode;
-  /** The smaller line under it — the consequence. Wired to `aria-describedby`. */
-  body?: ReactNode;
-  /** Default: `confirmDialog.confirm` from the provider, else "Confirm". */
-  confirmLabel?: ReactNode;
-  /** Default: `confirmDialog.cancel` from the provider, else "Cancel". */
-  cancelLabel?: ReactNode;
-  /**
-   * `"danger"` for what cannot be undone (a delete): the confirm is the destructive
-   * button and focus starts on CANCEL. `"warning"` and `"neutral"` (default) start on
-   * the confirm. See {@link ConfirmProvider} for why the two differ.
-   */
-  tone?: ConfirmTone;
-  /**
-   * 0.18: make the user TYPE this before confirm is enabled — the target account's
-   * e-mail address, a budget's name. For the action whose risk is not "did you mean
-   * it" but "is this the right row": an admin who deactivates somebody has already
-   * proven who THEY are (they passed the admin gate); typing the address is what
-   * proves they read which account they are on. Both keksdose (`TYPE_EMAIL`) and
-   * Kurvenschmiede (`TypedConfirm`) built this beside `useConfirm` because it had no
-   * field.
-   *
-   * The dialog then shows one text field under the body and focuses it (whatever the
-   * tone: a reflexive Enter cannot confirm a field that does not match yet). Confirm
-   * stays disabled until the text matches; Enter in the field confirms once it does.
-   * The answer is still `true` / `false` — the text matched what you passed, so send
-   * that to the server if it asks for the address too, not the user's spelling.
-   */
-  requireTyped?: string;
-  /** Label of that field. Default: `confirmDialog.typed` — `Type “a@b.c” to confirm`. */
-  typedLabel?: string;
-  /**
-   * How the typed text is compared. Default `"caseless"`: surrounding spaces and case
-   * ignored, the rule both apps applied to an address. `"trim"` keeps case, `"exact"`
-   * keeps spaces too — for a phrase like "DELETE" whose contract is "exactly this".
-   */
-  typedMatch?: TypedMatch;
-  /**
-   * 0.31.1: the confirm button COMMITS, as `Button`'s `commit` does. Under a locked
-   * `WriteLockProvider` — read where `useConfirm` was called, not where the one dialog
-   * host sits — it is `aria-disabled` with the lock's reason, so a read-only page (a
-   * demo, a viewer's budget) can't confirm a delete through a dialog. One prop for the
-   * many confirm sites an app has (kastlan's 0.31 adoption counted ~23).
-   *
-   * 0.33: a {@link CommitScope} — `confirm({ commit: COMMIT_EXCEPT_BILLING })` for a
-   * confirm a lapsed plan still allows (removing access, the account's own settings;
-   * docs/billing-harmonization.md §12.36).
-   */
-  commit?: CommitScope;
-}
-
-export type ConfirmFn = (options: ConfirmOptions) => Promise<boolean>;
-
-/**
- * `const confirm = useConfirm()` → `if (!(await confirm({ title }))) return`.
- *
- * The returned function is STABLE for the life of the provider, so it can sit in an
- * effect's or a `useCallback`'s dependency list without re-running it.
- *
- * Throws outside a {@link ConfirmProvider}, rather than falling back to
- * `window.confirm`: a silent fallback is exactly the native dialog the three apps are
- * migrating away from, and it would look like the migration had worked.
- */
-export function useConfirm(): ConfirmFn {
-  const confirm = useContext(ConfirmContext);
-  if (!confirm) {
-    throw new Error("useConfirm() must be called below a <ConfirmProvider>.");
-  }
-  // The lock of the CALLER's place: the dialog host usually sits above the app's
-  // `WriteLockProvider`, so it could not read the lock itself. Each call's own `commit`
-  // scope is applied to it when the call runs (`writeLockFor`, §12.36).
-  const lock = useWriteLock();
-  return useCallback(
-    (options: ConfirmOptions) => {
-      const scoped = writeLockFor(lock, options.commit);
-      return confirm(scoped.locked ? ({ ...options, lockReason: scoped.reason } as ConfirmOptions) : options);
-    },
-    [confirm, lock],
-  );
-}
-
-interface Request extends ConfirmOptions {
-  id: number;
-  resolve: (answer: boolean) => void;
-  /** Set by {@link useConfirm} for a `commit` confirm under a locked provider. */
-  lockReason?: ReactNode;
-}
-
-export interface ConfirmProviderProps {
-  children: ReactNode;
-}
-
-/**
- * The host for {@link useConfirm}: ONE confirm dialog for the whole app, rendered on
- * {@link DialogFrame}, answering a promise.
- *
- * Asked for by all three apps at once — keksdose has 20+ `window.confirm` calls,
- * kastlan 7, lenkbank 1. The native dialog cannot be translated past its OK/Cancel
- * (those are the BROWSER's language, not the app's), cannot say which button is the
- * destructive one, and on an installed PWA it prints the origin over the question.
- * A promise is what lets each of those call sites change by one `await`:
- *
- *     if (!window.confirm(t("budget.delete_confirm"))) return;
- *     // becomes
- *     if (!(await confirm({ title: t("budget.delete_confirm"), tone: "danger" }))) return;
- *
- * ## Its own provider, not part of `UiKitProvider`
- *
- * `UiKitProvider` renders nothing: it is strings and a locale, it is optional, and it
- * NESTS (an inner one re-labels one table). A dialog host inside it would mount a host
- * per nested provider, and a component under the inner one would open a second dialog
- * layer of its own. So the host is its own component, mounted once — inside the
- * `UiKitProvider` whose strings it should speak, which is also the order the labels
- * need.
- *
- * ## Focus
- *
- * On CANCEL for `tone: "danger"`, on CONFIRM otherwise. A confirm is often answered by
- * a reflexive Enter — the key that pressed the Delete button in the first place may
- * still be down — and for an action that cannot be undone that reflex must land on the
- * harmless answer; `DangerConfirm` makes the same call ("never to the destructive
- * button itself"). For everything else the confirm is the expected answer and Enter
- * accepting it is what `window.confirm` taught users, which the migrating call sites'
- * users already rely on. Focus returns to whatever opened it, through `Modal`'s trap.
- *
- * ## Escape, the backdrop, Back and Cancel all answer `false`
- *
- * Only the confirm button answers `true`. Anything that merely dismisses is a no.
- *
- * ## A second `confirm` while one is open QUEUES
- *
- * It is shown when the first is answered, and each call gets its own answer. The
- * alternative — answering the open one `false` to make room — would answer a question
- * the user never answered: a background prompt ("your session is about to expire")
- * would cancel the delete they were reading. `false` has to mean "the user said no".
- * A double-click cannot queue two of the same: the first click opens the modal
- * synchronously (a discrete event's update is flushed before the next one), so the
- * second lands on the open dialog rather than on the button — at worst on its
- * backdrop, which answers `false`, the safe way to be wrong.
- *
- * Unmounting the provider answers everything still pending `false`, so no caller's
- * `await` hangs forever.
- *
- * ## keksdose's synchronous call (transaction-swipe-plan.ts)
- *
- * `buildTxSwipeActions` is synchronous, but its `window.confirm` sits inside the
- * action THUNK (`confirmed(key, run)` returns `() => { if (confirm(…)) run() }`), and a
- * thunk may be async without its caller knowing. So the plan builder stays
- * synchronous; it takes the confirm as an argument and the thunk awaits it:
- *
- *     // mobile-transaction-list.tsx
- *     const confirm = useConfirm();
- *     buildTxSwipeActions({ tx, …, confirm });
- *
- *     // transaction-swipe-plan.ts
- *     const confirmed = (messageKey: string, run: () => void) => () => {
- *       void confirm({ title: t(messageKey), tone: "danger" }).then((ok) => ok && run());
- *     };
- *
- * Its test then passes `confirm: vi.fn(async () => false)` instead of stubbing the
- * global, and asserts after an `await` (the mutation now runs a microtask later). The
- * row snaps back when the swipe commits, before the answer — which is right: the
- * dialog, not the half-swiped row, is where the question now is.
- */
-export function ConfirmProvider({ children }: ConfirmProviderProps) {
-  const [queue, setQueue] = useState<Request[]>([]);
-  const nextId = useRef(0);
-  // Every unanswered request, including the ones not yet in state — the unmount
-  // cleanup below must reach a request made in the same tick it unmounts.
-  const pending = useRef(new Set<Request>());
-
-  const confirm = useCallback<ConfirmFn>(
-    (options) =>
-      new Promise<boolean>((resolve) => {
-        const request: Request = { ...options, id: ++nextId.current, resolve };
-        pending.current.add(request);
-        setQueue((q) => [...q, request]);
-      }),
-    [],
-  );
-
-  useEffect(() => {
-    const open = pending.current;
-    return () => {
-      for (const r of open) r.resolve(false);
-      open.clear();
-    };
-  }, []);
-
-  const answer = useCallback((request: Request, value: boolean) => {
-    if (!pending.current.delete(request)) return;
-    request.resolve(value);
-    setQueue((q) => q.filter((r) => r !== request));
-  }, []);
-
-  const current = queue[0];
-  return (
-    <ConfirmContext.Provider value={confirm}>
-      {children}
-      {current && (
-        // Keyed per request, so a queued one gets a fresh Modal: the first one's trap
-        // hands focus back to the page, and the next one's captures that as its own
-        // restore target instead of a button that has just been unmounted.
-        <ConfirmDialogView key={current.id} request={current} onAnswer={answer} />
-      )}
-    </ConfirmContext.Provider>
-  );
-}
-
-function ConfirmDialogView({
-  request,
-  onAnswer,
-}: {
-  request: Request;
-  onAnswer: (request: Request, value: boolean) => void;
-}) {
-  const labels = useKitLabels("confirmDialog", DEFAULT_CONFIRM_DIALOG_LABELS);
-  const tone = request.tone ?? "neutral";
-  const confirmRef = useRef<HTMLButtonElement>(null);
-  const cancelRef = useRef<HTMLButtonElement>(null);
-  // Set by the confirm button, read once the panel has finished lowering. Everything
-  // else that ends in `onClose` — Escape, the backdrop, Back, Cancel — leaves it false.
-  const accepted = useRef(false);
-  const typedRef = useRef<HTMLInputElement>(null);
-  const [typed, setTyped] = useState("");
-  const target = request.requireTyped;
-  const matches = target === undefined || typedMatches(typed, target, request.typedMatch ?? "caseless");
-
-  // In THIS component's effect, which runs after `Modal`'s own (a parent's effects run
-  // after its children's). `Modal` engages its focus trap on the panel first — and
-  // records the page's focused element as the restore target — and only then does
-  // focus move to the button. Focusing it from inside the panel would run first and
-  // make the button the restore target. A typed confirm starts in its field: typing is
-  // the one thing the dialog is waiting for.
-  useEffect(() => {
-    (target !== undefined ? typedRef : tone === "danger" ? cancelRef : confirmRef).current?.focus();
-  }, [tone, target]);
-
-  const typedLabel =
-    target === undefined
-      ? ""
-      : (request.typedLabel ?? (typeof labels.typed === "string" ? labels.typed : labels.typed(target)));
-
-  return (
-    <DialogFrame
-      title={request.title}
-      description={request.body}
-      onClose={() => onAnswer(request, accepted.current)}
-      // A confirmation interrupts to ask a question that must be answered.
-      role="alertdialog"
-      data-confirm-tone={tone}
-      actions={(close) => (
-        <>
-          <Button ref={cancelRef} type="button" variant="ghost" onClick={close}>
-            {request.cancelLabel ?? labels.cancel}
-          </Button>
-          <Button
-            ref={confirmRef}
-            type="button"
-            variant={tone === "danger" ? "danger" : "default"}
-            disabled={!matches}
-            disabledReason={request.lockReason}
-            onClick={() => {
-              accepted.current = true;
-              close();
-            }}
-          >
-            {request.confirmLabel ?? labels.confirm}
-          </Button>
-        </>
-      )}
-    >
-      {/* The field, when there is one, is the body; a plain confirm keeps having none. */}
-      {target !== undefined && (
-        <form
-          noValidate
-          onSubmit={(e) => {
-            e.preventDefault();
-            // Through the button, so Enter and a click are one path — and a disabled
-            // (not yet matching) confirm ignores the click.
-            confirmRef.current?.click();
-          }}
-        >
-          {/* The kit's one typed-confirmation field (0.23), DangerConfirm's too: the
-              keyboard told to leave the text alone, `data-matched` on the input. The
-              label is this namespace's (`confirmDialog.typed`), and `placeholder=""`
-              keeps out the `dangerConfirm.phrasePlaceholder` a provider may set for
-              the tile — this field never had one. */}
-          <TypedConfirmField
-            ref={typedRef}
-            target={target}
-            match={request.typedMatch ?? "caseless"}
-            label={typedLabel}
-            placeholder=""
-            value={typed}
-            onValueChange={setTyped}
-          />
-        </form>
-      )}
-    </DialogFrame>
-  );
-}

package/src/components/copy-button-labels.ts

@@ -1,13 +0,0 @@
-// The English words of ./copy-button, 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). ./copy-button re-exports them.
-
-import type { CopyButtonLabels } from "./copy-button";
-
-export const DEFAULT_COPY_BUTTON_LABELS: CopyButtonLabels = {
-  copy: "Copy",
-  copied: "Copied",
-  failed: "Couldn’t copy",
-  copiedAnnouncement: "Copied to clipboard",
-  failedAnnouncement: "Couldn’t copy to the clipboard",
-};

package/src/components/copy-button.tsx

@@ -1,192 +0,0 @@
-import type { ButtonHTMLAttributes, Ref } from "react";
-import { Check, Copy, X } from "lucide-react";
-import { cn } from "../lib/cn";
-import { useKitLabels, type LabelOverride } from "../i18n/kit-labels";
-import { useAnnounce } from "../hooks/use-announce";
-import { useCopyToClipboard } from "../hooks/use-copy-to-clipboard";
-import type { CopyState } from "../hooks/use-copy-to-clipboard";
-import { Button } from "./button";
-import { IconButton } from "./icon-button";
-import type { ButtonSize, ButtonTone, ButtonVariant } from "./button-look";
-import type { IconButtonSize, IconButtonTone } from "./icon-button";
-import type { TooltipSide } from "./tooltip";
-import { DEFAULT_COPY_BUTTON_LABELS } from "./copy-button-labels";
-
-/** The words a copy button says. The visible three are short on purpose (they
- *  replace the button's own text in the `label` variant); the two announcements
- *  are the sentences a screen reader hears, since the button's focus never moves. */
-export interface CopyButtonLabels {
-  copy: string;
-  copied: string;
-  failed: string;
-  copiedAnnouncement: string;
-  failedAnnouncement: string;
-}
-
-// Defined in ./copy-button-labels, which holds no component code (0.34, KS U8).
-export { DEFAULT_COPY_BUTTON_LABELS };
-
-export interface CopyButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children" | "onClick"> {
-  /** What to copy. A function is read at click time — for a value that is expensive
-   *  to build (a CSV of the table) or that changes under the button. */
-  text: string | (() => string);
-  /** `icon` (default): a square icon button whose glyph and colour show the result — its
-   *  words in a bubble, and from Large up beside the glyph, as every labelled IconButton
-   *  shows them. `label`: a text button whose words change to the result. */
-  variant?: "icon" | "label";
-  /** The idle accessible name — and, in the `label` variant, the visible text:
-   *  "Copy IBAN" says WHAT is copied, which a row of three copy icons needs. Default
-   *  `copyButton.copy`. */
-  label?: string;
-  /** The button's own look. Default: `ghost` for the icon, `secondary` for the label. */
-  buttonVariant?: ButtonVariant;
-  /** The icon variant's IconButton size (default `sm`). The `label` variant takes a
-   *  Button size, `sm` or `md` — passed only when given, so an existing label button
-   *  keeps its look (keksdose budget-share-card and jobs-panel wanted the compact one). */
-  size?: IconButtonSize | ButtonSize;
-  /** The icon variant's IconButton tone (e.g. `muted`, so a row of copy icons is no
-   *  heavier than the row's other actions); in the `label` variant a Button tone,
-   *  which applies to `link` / `ghost`. The copied / failed colour still wins. */
-  tone?: IconButtonTone | ButtonTone;
-  /** Keep the click and Enter/Space from reaching a clickable row around the button,
-   *  as IconButton's own `stopPropagation` does (keksdose feedback-page, users-panel). */
-  stopPropagation?: boolean;
-  /** Icon variant only: where the result tooltip opens. */
-  tooltipSide?: TooltipSide;
-  /** Pass through to the tooltip. Left unset, the Tooltip decides on its own — it
-   *  portals inside a clipping container (a DataTable's `data-clips` scroller). */
-  tooltipPortal?: boolean;
-  /** ms until the button returns to idle. Default 2000. */
-  resetAfter?: number;
-  /** Called with the real outcome once the copy settles. */
-  onCopied?: (ok: boolean) => void;
-  labels?: LabelOverride<CopyButtonLabels>;
-  /** The `<button>` in either variant — the {@link IconButton}'s or the {@link Button}'s,
-   *  never the tooltip's wrapper round it (0.35, round 0.35 R4, the follow-up to API-2).
-   *  It rides the rest of the props on to that kit button, whose own ref it is. */
-  ref?: Ref<HTMLButtonElement>;
-}
-
-const ICONS: Record<CopyState, typeof Copy> = { idle: Copy, copied: Check, failed: X };
-
-/**
- * A button that copies a value and tells the truth about whether it did.
- *
- * keksdose asked for it after two of its own copy buttons said "Copied" on a build
- * where the copy had failed (no Clipboard API over plain http). This one takes its
- * state from {@link useCopyToClipboard}, which reads the result, and has a `failed`
- * state that looks and sounds different from success.
- *
- * The result is spoken through {@link useAnnounce}: activating the button moves no
- * focus, so without a live region a screen-reader user hears nothing at all. A
- * failure goes through an ASSERTIVE region and a success through a polite one — the
- * failure is the news that changes what they do next.
- *
- * The icon variant keeps the SAME accessible name in every state, and the same words on
- * screen. A button renaming itself under the focus is announced inconsistently across
- * readers; the live region is the channel that is actually heard.
- */
-export function CopyButton({
-  text,
-  variant = "icon",
-  label,
-  buttonVariant,
-  size,
-  tone,
-  stopPropagation,
-  tooltipSide = "top",
-  tooltipPortal,
-  resetAfter = 2000,
-  onCopied,
-  labels,
-  className,
-  disabled,
-  ...rest
-}: CopyButtonProps) {
-  const words = useKitLabels("copyButton", DEFAULT_COPY_BUTTON_LABELS, labels);
-  const { state, copy } = useCopyToClipboard({ resetAfter });
-  const polite = useAnnounce();
-  const assertive = useAnnounce({ politeness: "assertive" });
-
-  const idleText = label ?? words.copy;
-  const stateText = state === "copied" ? words.copied : state === "failed" ? words.failed : idleText;
-  const Icon = ICONS[state];
-  const iconTone = state === "copied" ? "text-success" : state === "failed" ? "text-danger" : undefined;
-
-  const onClick = async () => {
-    const ok = await copy(typeof text === "function" ? text() : text);
-    if (ok) polite.announce(words.copiedAnnouncement);
-    else assertive.announce(words.failedAnnouncement);
-    onCopied?.(ok);
-  };
-
-  const regions = (
-    <>
-      <span {...polite.regionProps} />
-      <span {...assertive.regionProps} />
-    </>
-  );
-
-  if (variant === "label") {
-    return (
-      <>
-        <Button
-          type="button"
-          {...rest}
-          disabled={disabled}
-          variant={buttonVariant ?? "secondary"}
-          size={size === "sm" || size === "md" ? size : undefined}
-          tone={tone === "default" || tone === "muted" || tone === "danger" ? tone : undefined}
-          data-state={state}
-          onClick={(e) => {
-            if (stopPropagation) e.stopPropagation();
-            void onClick();
-          }}
-          onKeyDown={(e) => {
-            if (stopPropagation && (e.key === "Enter" || e.key === " ")) e.stopPropagation();
-            rest.onKeyDown?.(e);
-          }}
-          className={className}
-        >
-          <Icon aria-hidden className={cn("size-4 shrink-0", iconTone)} />
-          {stateText}
-        </Button>
-        {regions}
-      </>
-    );
-  }
-
-  // IconButton names itself (0.52, refactor audit 2026-10-30, DSP-21): `label` is the
-  // bubble — and the text beside the glyph at Large, as on every labelled IconButton —
-  // and `aria-label` keeps the name steady. A Tooltip of our own round it cloned
-  // `aria-describedby` onto the button, which then read "Copy, button, Copy".
-  //
-  // The idle words, in every state (0.52 code review, deep, charts, finding 8). As the
-  // state, "Copied" stood at Large beside the glyph of a button named "Copy IBAN": the pill
-  // changed width on every copy, and the words on screen were not in the name a voice
-  // user says to press it (WCAG 2.5.3, label in name). The glyph and its colour show the
-  // result, and the live regions say it.
-  return (
-    <>
-      <IconButton
-        type="button"
-        {...rest}
-        disabled={disabled}
-        label={idleText}
-        aria-label={idleText}
-        tooltipSide={tooltipSide}
-        tooltipPortal={tooltipPortal}
-        variant={buttonVariant ?? "ghost"}
-        size={(size ?? "sm") as IconButtonSize}
-        tone={tone as IconButtonTone | undefined}
-        stopPropagation={stopPropagation}
-        data-state={state}
-        onClick={() => void onClick()}
-        className={cn(iconTone, className)}
-      >
-        <Icon aria-hidden />
-      </IconButton>
-      {regions}
-    </>
-  );
-}

package/src/components/country-select-labels.ts

@@ -1,11 +0,0 @@
-// The English words of ./country-select, 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). ./country-select re-exports them.
-
-import type { CountrySelectLabels } from "./country-select";
-
-export const DEFAULT_COUNTRY_SELECT_LABELS: CountrySelectLabels = {
-  country: "Country",
-  search: "Search country",
-  others: "Other countries",
-};