@eifi1/ui-kit 0.54.0 → 0.55.0

package/src/lib/download.ts

@@ -1,172 +0,0 @@
-/**
- * Saving a file the page fetched itself, and reading the name the server gave it
- * (round 0.34 C6, KS U5).
- *
- * Every app behind a token downloads this way: an `<a href>` to an API route carries no
- * `Authorization` header, so the app fetches the bytes and hands them to the browser
- * through an object URL and a link with a `download` name. The kit had written that
- * three times (the translation corrections export, a feedback attachment, the account
- * data export) in three spellings, and Kurvenschmiede had a fourth beside them, each
- * with its own answer to the two questions that matter — whether the link is in the
- * document when it is clicked, and when the URL is revoked. One answer, here:
- *
- * - **The link is attached** (hidden, `rel="noopener"`), clicked once and taken out
- *   again. A detached link downloads in today's Chromium, but Firefox long ignored a
- *   click on a link outside the document, and attaching it costs nothing.
- * - **The URL is revoked a minute later**, not at once. The click only STARTS the
- *   download; the browser reads the URL after this function has returned, and a URL
- *   revoked before that is a download that fails without a word. A minute holds one
- *   reference to a blob the page already had; Kastlan's `openAuthenticatedFile` waits
- *   the same minute for the tab it opens.
- *
- * And the name: server-kit's `content_disposition` writes the ORIGINAL name only in the
- * RFC 6266 / RFC 8187 `filename*=UTF-8''…`, and an ASCII stand-in in the plain
- * `filename=` (accents folded from 0.8). A reader that takes `filename=` alone saves
- * "Grun.pdf" for "Grün.pdf" and "____.pdf" for a name in Chinese, so
- * {@link filenameFromDisposition} reads `filename*` first.
- */
-
-/** How long an object URL handed to a download stays valid. See the module note. */
-export const SAVE_BLOB_REVOKE_MS = 60_000;
-
-/**
- * Hand `href` to the browser as a download named `filename`: a hidden link with a
- * `download` name, attached, clicked once and taken out again. The one way a page saves
- * a file without opening a tab that shows it instead.
- *
- * For a URL the caller keeps alive itself — `DataExportSetting` keeps its object URL for
- * the "Didn't start? Save the file" link under the button. Everything else wants
- * {@link saveBlob}.
- */
-export function clickDownload(href: string, filename: string): void {
-  const link = document.createElement("a");
-  link.href = href;
-  link.download = filename;
-  link.rel = "noopener";
-  link.hidden = true;
-  document.body.appendChild(link);
-  link.click();
-  link.remove();
-}
-
-/**
- * Save `blob` as a file named `filename` — the browser's own download, as if the person
- * had clicked a link to it.
- *
- * Call it from the handler of the click that asked for the file. After an `await` (the
- * fetch) most browsers still count the click as the person's; a browser that does not
- * holds the download back, and a page that must not lose it keeps a link of its own
- * under the button, as `DataExportSetting` does.
- *
- * ```ts
- * const res = await api.get(path, { responseType: "blob" });
- * saveBlob(res.data, filenameFromDisposition(res.headers["content-disposition"], "report.pdf"));
- * ```
- */
-export function saveBlob(blob: Blob, filename: string): void {
-  const href = URL.createObjectURL(blob);
-  clickDownload(href, filename);
-  setTimeout(() => URL.revokeObjectURL(href), SAVE_BLOB_REVOKE_MS);
-}
-
-/* ── Content-Disposition ─────────────────────────────────────────────────── */
-
-/**
- * The parameters of a `Content-Disposition` value, names lower-cased. `;` separates
- * them except inside a quoted string, whose backslash escapes are undone; a bare token
- * (the disposition type, `attachment`) is skipped. The first of a repeated name wins.
- */
-function dispositionParams(header: string): Map<string, string> {
-  const params = new Map<string, string>();
-  const n = header.length;
-  let i = 0;
-  while (i < n) {
-    let j = i;
-    while (j < n && header[j] !== "=" && header[j] !== ";") j++;
-    const name = header.slice(i, j).trim().toLowerCase();
-    if (j >= n || header[j] === ";") {
-      i = j + 1;
-      continue;
-    }
-    j++; // past "="
-    while (j < n && (header[j] === " " || header[j] === "\t")) j++;
-    let value = "";
-    if (header[j] === '"') {
-      j++;
-      while (j < n && header[j] !== '"') {
-        if (header[j] === "\\" && j + 1 < n) j++;
-        value += header[j];
-        j++;
-      }
-      // Past the closing quote and whatever stray text follows it up to the next ";".
-      while (j < n && header[j] !== ";") j++;
-    } else {
-      const end = header.indexOf(";", j);
-      value = header.slice(j, end === -1 ? n : end).trim();
-      j = end === -1 ? n : end;
-    }
-    if (name && !params.has(name)) params.set(name, value);
-    i = j + 1;
-  }
-  return params;
-}
-
-/** An RFC 8187 ext-value — `charset'language'percent-encoded` — decoded, or undefined
- *  for a charset it cannot read or an encoding that is broken. */
-function decodeExtValue(value: string): string | undefined {
-  const match = /^([^']*)'[^']*'(.*)$/.exec(value);
-  if (!match) return undefined;
-  const charset = match[1].trim().toLowerCase();
-  const encoded = match[2];
-  if (charset === "utf-8" || charset === "utf8") {
-    try {
-      return decodeURIComponent(encoded);
-    } catch {
-      return undefined; // a stray "%" or a cut-off sequence
-    }
-  }
-  if (charset === "iso-8859-1") {
-    return encoded.replace(/%([0-9a-f]{2})/gi, (_, hex: string) => String.fromCharCode(parseInt(hex, 16)));
-  }
-  return undefined;
-}
-
-/** A name safe to put in a `download` attribute or on screen: the last path segment
- *  (RFC 6266 §4.3 — a recipient strips directory information), without control
- *  characters, trimmed; undefined when nothing is left. */
-function cleanFilename(name: string | undefined): string | undefined {
-  if (name === undefined) return undefined;
-  const base = name.slice(Math.max(name.lastIndexOf("/"), name.lastIndexOf("\\")) + 1);
-  const clean = Array.from(base)
-    .filter((c) => {
-      const code = c.charCodeAt(0);
-      return code >= 0x20 && code !== 0x7f;
-    })
-    .join("")
-    .trim();
-  return clean && !/^\.+$/.test(clean) ? clean : undefined;
-}
-
-/**
- * The file name a `Content-Disposition` header asks for: the RFC 8187 `filename*`
- * (`UTF-8''Gr%C3%BCn.pdf`, the one that carries a name in any script) first, then the
- * plain `filename=`, quoted or not. Directory parts are dropped. Never throws: a missing
- * header, a header with no name, a broken encoding all come back as `fallback` —
- * `undefined` when none is given.
- *
- * Reads exactly what server-kit's `content_disposition` writes. With axios the header is
- * `res.headers["content-disposition"]`, with `fetch` `res.headers.get("Content-Disposition")`
- * — and across origins only when the server lists it in `Access-Control-Expose-Headers`.
- */
-export function filenameFromDisposition(header: string | null | undefined): string | undefined;
-export function filenameFromDisposition(header: string | null | undefined, fallback: string): string;
-export function filenameFromDisposition(header: string | null | undefined, fallback?: string): string | undefined {
-  if (typeof header !== "string" || header === "") return fallback;
-  const params = dispositionParams(header);
-  const extended = params.get("filename*");
-  return (
-    cleanFilename(extended === undefined ? undefined : decodeExtValue(extended)) ??
-    cleanFilename(params.get("filename")) ??
-    fallback
-  );
-}

package/src/lib/float-clearance.ts

@@ -1,70 +0,0 @@
-import { useEffect } from "react";
-
-/**
- * The room the floating launchers take above the bottom nav, published as
- * `--app-float-clearance` on `<html>` so `AppShell` can pad `<main>` past them, and with
- * the nav included as `--kit-floating-inset` (0.49 KIT-11, below).
- *
- * keksdose dev#612 (UX-1.3, "the help button covers content"): the shell padded `<main>`
- * for the nav plus 1.5rem, so on a phone the last row of every page ended under the help
- * launcher — and on /transactions under the action group below it, exactly where the
- * row's amount is. keksdose patched it with its own `--help-launcher-clearance` and an
- * unlayered app.css rule. Here every kit launcher (`FloatingActionButton`, so
- * `FloatingPanel`'s too, and `FloatingActionGroup`) declares its own room while it is
- * mounted and shown, and the shell takes the largest.
- *
- * Declared, not measured: a launcher knows its `offset` and its 3rem height exactly, as
- * CSS lengths, and the variable then follows the nav and the text size by itself. A
- * `hidden` launcher keeps its claim: the room is its own while it is mounted, so the page
- * does not change length as it hides and shows (keksdose's launcher steps aside while an
- * editor covers its corner). Unmount it to give the room back.
- *
- * Internal: not exported from the barrel.
- */
-
-const claims = new Map<symbol, string>();
-
-/**
- * 0.49 KIT-11: `--kit-floating-inset` is the same room measured from the screen's bottom
- * edge — the phone's bottom nav (`--app-nav-h`, 0px from `md` up) or the home indicator,
- * whichever is taller, plus `--app-float-clearance` — so a page's own fixed or sticky
- * footer, or its last row, can clear the launchers with one length at every width.
- * Unset while no launcher is mounted, like `--app-float-clearance`: write
- * `var(--kit-floating-inset, var(--app-nav-h, 0px))`.
- */
-const NAV_OR_HOME_INDICATOR = "max(var(--app-nav-h, 0px), env(safe-area-inset-bottom, 0px))";
-
-function publish() {
-  if (typeof document === "undefined") return;
-  const root = document.documentElement;
-  const values = [...claims.values()];
-  if (values.length === 0) {
-    root.style.removeProperty("--app-float-clearance");
-    root.style.removeProperty("--kit-floating-inset");
-    return;
-  }
-  root.style.setProperty("--app-float-clearance", values.length === 1 ? values[0] : `max(${values.join(", ")})`);
-  root.style.setProperty("--kit-floating-inset", `calc(${NAV_OR_HOME_INDICATOR} + var(--app-float-clearance))`);
-}
-
-/** Claim `value` (a CSS length: the launcher's top edge above the nav, plus a gap) until
- *  the returned function is called. */
-export function claimFloatClearance(value: string): () => void {
-  const key = Symbol("float-clearance");
-  claims.set(key, value);
-  publish();
-  return () => {
-    claims.delete(key);
-    publish();
-  };
-}
-
-/**
- * A launcher at `offset` above the nav claims its 3rem height plus a 0.5rem gap while
- * mounted (`extra`: what its frame adds, the group's 1px borders).
- */
-export function useFloatClearance(offset: string, extra?: string): void {
-  useEffect(() => {
-    return claimFloatClearance(`calc(${offset} + 3.5rem${extra ? ` + ${extra}` : ""})`);
-  }, [offset, extra]);
-}

package/src/lib/floating-stack.ts

@@ -1,70 +0,0 @@
-/**
- * What floats over the bottom of the screen right now, so a notice that comes and goes
- * can sit above it instead of on it.
- *
- * kastlan 0.18: its offline pill is a `bottom-start` FloatingActionButton, and
- * `ServerWakeNotice` sat in the same corner — right after a break both show at once
- * (the photo outbox syncs while the first reads wake the server), one over the other.
- * The FAB's `offset` cannot help: the notice comes and goes, and on a phone it is
- * nearly as wide as the screen, so a FAB in EITHER corner can be under it.
- *
- * Measured, not declared: a FloatingActionButton registers its fixed element while it
- * is mounted, and a notice asks {@link clearanceAbove} for the height it has to clear —
- * whatever offset, `extended` label or `hidden` state the controls are in. A control
- * that is `hidden` measures 0 × 0 and is skipped, so kastlan's pill, which stays
- * mounted and hidden while there is nothing to report, costs the notice nothing.
- *
- * NO READER since 0.34: `ServerWakeNotice` moved to the top of the screen (keksdose
- * live #399), out of every FAB's corner. FloatingActionButton still registers; the
- * next notice that has to sit above the bottom's floating controls reads this.
- *
- * Internal: not exported from the barrel.
- */
-
-const occupants = new Set<HTMLElement>();
-const listeners = new Set<() => void>();
-let observer: ResizeObserver | null = null;
-
-function notify() {
-  for (const listener of listeners) listener();
-}
-
-/** Track `element` until the returned function is called. Size changes — a label that
- *  grows, `hidden` toggling — notify the subscribers too. */
-export function registerFloating(element: HTMLElement): () => void {
-  occupants.add(element);
-  if (observer === null && typeof ResizeObserver !== "undefined") observer = new ResizeObserver(notify);
-  observer?.observe(element);
-  notify();
-  return () => {
-    occupants.delete(element);
-    observer?.unobserve(element);
-    notify();
-  };
-}
-
-/** Hear every registration, removal and size change. */
-export function subscribeFloating(listener: () => void): () => void {
-  listeners.add(listener);
-  return () => {
-    listeners.delete(listener);
-  };
-}
-
-/**
- * The distance from the viewport's bottom edge to the top of the highest visible
- * floating control that shares a column with `element` — what `element` has to clear —
- * or `null` when nothing is under it.
- */
-export function clearanceAbove(element: HTMLElement | null): number | null {
-  if (!element) return null;
-  const own = element.getBoundingClientRect();
-  let top = Infinity;
-  for (const other of occupants) {
-    const box = other.getBoundingClientRect();
-    if (box.width === 0 || box.height === 0) continue;
-    if (box.right <= own.left || box.left >= own.right) continue;
-    top = Math.min(top, box.top);
-  }
-  return top === Infinity ? null : Math.max(0, window.innerHeight - top);
-}

package/src/lib/focus-left.ts

@@ -1,156 +0,0 @@
-// "The focused node left" (refactor audit 2026-10-30, Wave 1: DSP-4, DSP-15). When the
-// element holding the keyboard's focus is removed — a table row deleted, filtered out or
-// approved; a bulk bar gone with its Clear; a banner its × took away — the browser puts
-// focus on <body> and says nothing: no blur in Chromium, none in jsdom. A keyboard or
-// screen-reader user then starts again from the top of the page. The overlays give focus
-// back to their opener (use-focus-trap); these helpers are for the controls that leave
-// the page while the focus is IN them, and decide where it goes instead.
-
-/**
- * Candidate tab stops, in DOM order — narrowed by {@link isTabStop} to the ones a Tab
- * really reaches. The kit's one copy of the rule (0.52 code review, lib/focus-left.ts):
- * this file and use-focus-trap each had it, with an exported `firstTabStop` apiece that
- * disagreed about the element itself, and a combobox panel's toolbar had a third
- * selector. The trap, the focus a removed node drops (below), the tour's field ring and
- * the toolbar all read it here, so "the next stop" is the same stop everywhere.
- *
- * The selector is the one `Modal` used. On its own it was not enough (round 0.34
- * BUG-4): only the bare `[tabindex]` clause excluded `-1`, so a `button`, an `input` or
- * a link taken out of the tab order still counted. A panel that ends in a roving grid —
- * the calendar's days, the month grid, the picker sheet's rows, every one of them `-1`
- * but the active cell — then had a "last" stop no Tab ever reaches: Tab from the real
- * last stop was not wrapped and walked out of the open panel, and Shift+Tab from the
- * first landed on a cell that is not a stop at all.
- */
-// `input[type=hidden]` is no stop: a Tab never lands on it and focus() on it does nothing,
-// but its tabIndex reads 0, so a trap could take a form's hidden field for its first or last
-// stop and Shift+Tab left the dialog (0.52 code review).
-const TAB_STOP =
-  'a[href],button:not([disabled]),textarea:not([disabled]),input:not([disabled]):not([type="hidden"]),select:not([disabled]),[tabindex]:not([tabindex="-1"])';
-
-/**
- * A stop the browser's own Tab would land on: in the tab order (`tabIndex` ≥ 0) and not
- * inside something `hidden` or `inert`. Removes only elements a native Tab never
- * reaches, so no correct order changes. `visibility: hidden` and closed `<details>` are
- * still not walked — they need layout, which this rule has never read.
- */
-function isTabStop(el: HTMLElement): boolean {
-  return el.tabIndex >= 0 && !el.closest("[hidden],[inert]");
-}
-
-export interface TabStopOptions {
-  /** Whether `el` itself counts, first, when it is a stop. Default true: the tour's
-   *  target may BE the field (refactor audit 2026-10-30, DUP-9). False for "a control
-   *  inside it" — a row, a drawer, a trap's container, a toolbar. */
-  includeSelf?: boolean;
-}
-
-/** The tab stops in `el`, in DOM order — `el` itself first when it is one, unless
- *  `includeSelf: false`. */
-export function tabStops(el: Element, { includeSelf = true }: TabStopOptions = {}): HTMLElement[] {
-  const inside = Array.from(el.querySelectorAll<HTMLElement>(TAB_STOP)).filter(isTabStop);
-  const own = includeSelf && el instanceof HTMLElement && el.matches(TAB_STOP) && isTabStop(el);
-  return own ? [el, ...inside] : inside;
-}
-
-/** The first of {@link tabStops} — the control a person types into or presses — or null. */
-export function firstTabStop(el: Element, options?: TabStopOptions): HTMLElement | null {
-  return tabStops(el, options)[0] ?? null;
-}
-
-/**
- * Whether the focus has fallen out of the page: onto `<body>`, onto nothing, or onto a
- * node no longer in the document. False on the server, where nothing has focus to lose.
- * A recovery asks this first: focus that went somewhere real (a dialog, the next field,
- * an app's own `focus()`) is the user's or the app's, and is left where it is.
- */
-export function focusIsLost(): boolean {
-  if (typeof document === "undefined") return false;
-  const el = document.activeElement;
-  return !el || el === document.body || !el.isConnected;
-}
-
-/**
- * Calls `then` when a `blur`/`focusout` was the user's own move to nothing — a click on
- * the page's background, or a click Safari answers by focusing nothing (it focuses no
- * button or link on a click, and blurs what had the focus) — after which a note of where
- * the focus was is stale (0.52 code review: DataTable's row, BulkActionBar's and
- * AlertBanner's notes outlived it, and a removal much later pulled the focus, and the
- * scroll, back to them).
- *
- * No element took the focus, the document holds none, and the node that lost it could
- * still hold it. Not when it was removed, hidden, made inert or disabled: that is the page
- * taking the focus away — the very case those notes are kept for. Not a window losing the
- * focus either, which leaves the node the document's active element. Decided a microtask
- * later, once the event's own work is done: a browser that blurs a node it is removing
- * (or hiding) may do it while the node is still in place, and only after it is gone is
- * that told apart from a click.
- */
-export function whenFocusLeftForNothing(
-  e: { target: EventTarget | null; relatedTarget: EventTarget | null },
-  then: () => void,
-): void {
-  const el = e.target;
-  if (e.relatedTarget !== null || !(el instanceof Element)) return;
-  queueMicrotask(() => {
-    if (!el.isConnected || el.matches(":disabled") || el.closest("[hidden],[inert]")) return;
-    // `display: none`, where the browser can say (jsdom cannot).
-    if (typeof el.checkVisibility === "function" && !el.checkVisibility()) return;
-    if (focusIsLost()) then();
-  });
-}
-
-/**
- * The tab stops around `frame`, outside it, nearest first on each side — where focus
- * goes once `frame` is gone. Read BEFORE it goes: a removed node has no place in the
- * document to measure from. `limit` per side keeps a long page's stops out of memory.
- *
- * Walked outwards from the frame, `limit` stops each way (0.52 code review,
- * lib/focus-left.ts): read from every stop in the page, a banner under a 2000-row table
- * read all 2000 to keep the nearest five before it.
- */
-export function tabStopsAround(frame: Element, limit = 5): { after: HTMLElement[]; before: HTMLElement[] } {
-  const doc = frame.ownerDocument;
-  const walker = doc.createTreeWalker(doc.documentElement, NodeFilter.SHOW_ELEMENT);
-  const isStop = (node: Node): node is HTMLElement =>
-    node instanceof HTMLElement && node.matches(TAB_STOP) && isTabStop(node);
-  // After: from the first element past the frame's own subtree, in document order.
-  const after: HTMLElement[] = [];
-  walker.currentNode = frame;
-  let node: Node | null = walker.nextSibling();
-  while (!node && walker.parentNode()) node = walker.nextSibling();
-  for (; node && after.length < limit; node = walker.nextNode()) if (isStop(node)) after.push(node);
-  // Before: back from the frame, nearest first (its ancestors among them, as before).
-  const before: HTMLElement[] = [];
-  walker.currentNode = frame;
-  for (node = walker.previousNode(); node && before.length < limit; node = walker.previousNode())
-    if (isStop(node)) before.push(node);
-  return { after, before };
-}
-
-/**
- * Focus the first of `candidates` that is still in the page and takes the focus; true
- * when one did. Each is tried and checked, since `focus()` on a node that cannot hold it
- * (detached, `display: none`, disabled since) fails without a word.
- */
-export function focusFirst(candidates: Iterable<Element | null | undefined>): boolean {
-  for (const el of candidates) {
-    if (!(el instanceof HTMLElement) || !el.isConnected) continue;
-    el.focus();
-    if (document.activeElement === el) return true;
-  }
-  return false;
-}
-
-/**
- * Focus a container that is not a tab stop of its own — a table, a list — as the place
- * the user is in, without making it one: `tabindex="-1"` for as long as it holds the
- * focus, unless it already carries a `tabindex` of its own.
- */
-export function focusContainer(el: HTMLElement): void {
-  if (!el.hasAttribute("tabindex")) {
-    el.setAttribute("tabindex", "-1");
-    el.addEventListener("blur", () => el.removeAttribute("tabindex"), { once: true });
-  }
-  el.focus();
-}