@eifi1/ui-kit 0.51.4 → 0.51.6

package/dist/components/legal.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/legal.tsx"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { MouseEvent, ReactNode } from \"react\";\n\nimport { useKitLabels } from \"../i18n/kit-labels\";\nimport type { LabelOverride } from \"../i18n/kit-labels\";\nimport { cn } from \"../lib/cn\";\nimport { countryName } from \"../lib/countries\";\nimport { AlertBanner } from \"./alert-banner\";\nimport { TextLink } from \"./text-link\";\nimport { DEFAULT_LEGAL_LABELS } from \"./legal-labels\";\n\n/**\n * The legal pages — Imprint, Privacy Policy, Terms — for every app.\n *\n * 0.19 (docs/i18n-harmonization.md H10): keksdose and kastlan each carried the same\n * shell, written twice: a back link, the title, a \"closed beta, not yet reviewed by a\n * lawyer\" notice, sections of heading + running text, and kastlan's row of links to the\n * three pages with the current one marked. That shape moved here; the words stayed in\n * each app.\n *\n * 0.28 (docs/legal-harmonization.md) reverses the second half: the wording that is the\n * same in all three apps is the kit's too, in all seven languages, so there is ONE text\n * to change after the lawyer's review instead of three apps drifting apart sentence by\n * sentence. This module holds the labels (every kit-owned legal word, §4.3/§4.4), the\n * column (`LegalLayout`), the section (`LegalSection`, now numbered and cross-referenced\n * inside a `LegalPage`), the links row and the public footer. The page frame, the\n * kit-owned sections and the terms checkbox are in `./legal-page`.\n *\n * `LegalLayout` stays a CONTENT COLUMN, not a page: before 0.28 keksdose showed it inside\n * its public landing header and footer and kastlan inside `AuthLayout`. `LegalPage` is\n * the frame around it that the contract (§3.2) settled on — keksdose's.\n */\n\n// ── The operator ──────────────────────────────────────────────────────────────\n\n/** The three pages, by the key every app uses for them (§4.1). Kurvenschmiede's\n *  `imprint` became `impressum`. */\nexport type LegalPageKey = \"impressum\" | \"privacy\" | \"terms\";\n\n/** The three routes (§3.1): one per page, the language from i18n, no per-language URLs. */\nexport const LEGAL_HREFS: Readonly<Record<LegalPageKey, string>> = Object.freeze({\n  impressum: \"/impressum\",\n  privacy: \"/privacy\",\n  terms: \"/terms\",\n});\n\n/** 0.51.4: the two public pages an app MAY have beside the legal ones, linked after\n *  them in the footer (§3.3) — keksdose's /security and /accessibility. Not legal pages:\n *  an app draws them with `PublicPage`, in its own words, at routes of its choosing. */\nexport type LegalInfoPageKey = \"security\" | \"accessibility\";\n\n/**\n * Who runs the app — the values the kit's legal sections are filled in with (§5).\n *\n * The kit holds NO personal data: every app passes the same values once, to\n * {@link LegalPage}'s `operator`. Plain strings, so the app's config or env can hold them.\n */\nexport interface LegalOperator {\n  /** The operator's name, as the imprint prints it. */\n  name: string;\n  /** \"9470\"-shaped; printed before the city. */\n  postalCode: string;\n  /** The place — the imprint's address line and the terms' place of jurisdiction. */\n  city: string;\n  /** The canton or state, abbreviated as the place of jurisdiction writes it: \"SG\". */\n  region: string;\n  /**\n   * ISO 3166-1 alpha-2: \"CH\". A CODE, not a name — the kit names it in the page's\n   * language (`Intl.DisplayNames`, see `countryName`), so \"Switzerland\", \"Schweiz\",\n   * \"Suisse\" and \"瑞士\" all come from one value.\n   */\n  country: string;\n  /** The contact address the imprint and the privacy policy print. */\n  email: string;\n  /**\n   * The language whose version of the legal texts is BINDING (\"de-CH\"), a BCP 47 code\n   * (0.28.1, Marcel 2026-10-05). The lawyer reviews that one; the others are translations\n   * for convenience. With it, {@link LegalPage} shows a note on every page read in\n   * another language, and the terms' `language` section says which version prevails.\n   * Only the language subtag counts: \"de-CH\" and \"de\" are the same language here.\n   */\n  bindingLanguage?: string;\n}\n\n/**\n * The operator as the kit's texts read it: {@link LegalOperator} with `country` already\n * NAMED in the page's language (\"Schweiz\", not \"CH\").\n *\n * The label functions take this rather than the code so they stay pure string functions\n * of plain values, like every other function label in the kit: a catalogue never calls\n * `Intl`, and a review row can be rendered from placeholders (`{{country}}`).\n */\nexport type LegalOperatorText = Readonly<Record<keyof LegalOperator, string>>;\n\n/** The language subtag of a BCP 47 code, lower-cased: \"de-CH\" → \"de\". */\nexport function baseLanguage(code: string): string {\n  return code.split(/[-_]/)[0]!.toLowerCase();\n}\n\nconst languageNamers = new Map<string, Intl.DisplayNames | null>();\n\n/** The name of a language in `locale` — \"Deutsch\", \"German\", \"allemand\", \"德语\" — from its\n *  language subtag, so \"de-CH\" is plain \"German\", not \"Swiss High German\". The code itself\n *  when the runtime cannot name it. */\nfunction languageName(code: string, locale: string): string {\n  let namer = languageNamers.get(locale);\n  if (namer === undefined) {\n    try {\n      namer = new Intl.DisplayNames([locale], { type: \"language\" });\n    } catch {\n      namer = null;\n    }\n    languageNamers.set(locale, namer);\n  }\n  const base = baseLanguage(code);\n  try {\n    return namer?.of(base) ?? base;\n  } catch {\n    return base;\n  }\n}\n\n/** @internal The operator as the texts read it: its country named in `locale` (English\n *  without one — `countryName`'s rule, so an app that set no locale reads English). */\nexport function legalOperatorText(operator: LegalOperator, locale: string = \"en\"): LegalOperatorText {\n  return {\n    ...operator,\n    country: countryName(operator.country, locale),\n    bindingLanguage: operator.bindingLanguage ? languageName(operator.bindingLanguage, locale) : \"\",\n  };\n}\n\n// ── Labels ────────────────────────────────────────────────────────────────────\n\n/** A kit section whose text is fixed: a heading and one body. */\nexport interface LegalTextSectionLabels {\n  title: string;\n  body: string;\n}\n\n/**\n * 0.32.0: the imprint's disclaimer, with the body of its COMMERCIAL variant\n * (docs/billing-harmonization.md §8; legal decision 7). The title is the same in both:\n * liability for content and links is the subject either way.\n */\nexport interface LegalDisclaimerSectionLabels extends LegalTextSectionLabels {\n  /**\n   * The body for `<LegalKitSection section=\"disclaimer\" variant=\"commercial\">`: a paid\n   * service sold through a Merchant of Record, which sells in its own name (§2.2), so the\n   * \"private, non-commercial … closed beta\" of `body` would be untrue. OPTIONAL, as every\n   * key added to a namespace an app may annotate: left out, the provider's, then English.\n   */\n  commercial?: string;\n}\n\n/** A kit section whose text names the operator (§4.3 `{name}`, `{email}`, …). */\nexport interface LegalOperatorSectionLabels {\n  title: string;\n  /** Called with the operator, its country already named in the page's language. Line\n   *  breaks are kept (`white-space: pre-line`): an address is plain lines. */\n  body: (operator: LegalOperatorText) => string;\n}\n\n/** A kit section with an app slot (or a list) between its two parts. */\nexport interface LegalFramedSectionLabels {\n  title: string;\n  /** Before the app's part. */\n  lead: string;\n  /** After it. */\n  tail: string;\n}\n\n/**\n * Every word of the legal pages that is the kit's — docs/legal-harmonization.md §4.3 and\n * §4.4, verbatim. English, British spelling; the other six languages are in the\n * catalogues (`@eifi1/ui-kit/i18n/<code>`).\n *\n * Keys follow the contract: `sections.<page>.<section key>`, the section keys being\n * keksdose's (`legal_basis`, not `legalBasis`), because the same key is the section's\n * `id` (`/privacy#legal_basis`) and the app's own sections sit beside these under the\n * same names in its catalogue. Titles carry NO number: {@link LegalPage} numbers the\n * privacy and terms sections in render order (§4.1).\n */\nexport interface LegalLabels {\n  /** The accessible name of {@link LegalLinks}' and {@link LegalFooter}'s `<nav>`. */\n  navLabel: string;\n  /** The short labels of the three links, everywhere the links appear (§3.3), and since\n   *  0.51.4 of the two optional public pages after them (`securityHref`,\n   *  `accessibilityHref` on {@link LegalLinks}) — optional keys, as every key added to a\n   *  namespace an app may annotate: left out, the provider's, then English. */\n  links: Record<LegalPageKey, string> & Partial<Record<LegalInfoPageKey, string>>;\n  /** The pages' titles — the `<h1>`, and the links of the terms checkbox. */\n  titles: Record<LegalPageKey, string>;\n  /** The back link above the title: \"← Back to home\". */\n  backHome: string;\n  /**\n   * The terms checkbox (§3.4) — ONE template with `{terms}` and `{privacy}`, which\n   * become the links (named with `titles`). Not a prefix plus a joiner: a language puts\n   * the links where its grammar wants them, articles included, and nothing is added\n   * around a placeholder — Italian elides, \"e l’{privacy}\", with no space.\n   */\n  accept: string;\n  /** The notice under the title (§3.2): `beta` on the imprint and the terms, `privacy`\n   *  on the privacy policy. */\n  notice: {\n    beta: string;\n    privacy: string;\n  };\n  /**\n   * 0.28.1: on a page read in another language than the operator's `bindingLanguage` —\n   * `note` under the title, `show` on the button that switches to the binding version\n   * (when the app passes `onShowBindingLanguage`). `o.bindingLanguage` is the binding\n   * language's NAME in the reader's language (\"German\", \"allemand\").\n   */\n  translation: {\n    note: (o: LegalOperatorText) => string;\n    show: (o: LegalOperatorText) => string;\n  };\n  /**\n   * 0.51.3: the as-of line under the title (§3.2), \"Last updated: 29 October 2026\" —\n   * {@link LegalPage}'s `updated`, called with the date already written out in the page's\n   * locale. OPTIONAL, as every key added to a namespace an app may annotate: left out,\n   * the provider's, then English.\n   */\n  updated?: (date: string) => string;\n  /**\n   * 0.51.4: the plain-language summary at the top of a page ({@link LegalPage}'s\n   * `summary`, §3.2) — its heading, and the line under the points saying that only the\n   * full text binds. Optional, as `updated`.\n   */\n  summary?: {\n    title: string;\n    note: string;\n  };\n  /** The kit's sections (§4.3), by page and section key. */\n  sections: {\n    impressum: {\n      operator: LegalOperatorSectionLabels;\n      contact: LegalOperatorSectionLabels;\n      /** `body` is the default, non-commercial text; `commercial` the 0.32 variant. */\n      disclaimer: LegalDisclaimerSectionLabels;\n    };\n    privacy: {\n      controller: LegalOperatorSectionLabels;\n      /** The app's paragraph follows the body (§4.2): consent, where an app relies on it. */\n      legal_basis: LegalTextSectionLabels;\n      /** `lead`, then the app's entries as a list, then `tail`, then the app's paragraph. */\n      browser: LegalFramedSectionLabels;\n      /** `lead` (the rights), then the app's paragraph (export, deletion), then `tail`\n       *  (the supervisory authorities). */\n      rights: LegalFramedSectionLabels;\n      contact: LegalOperatorSectionLabels;\n    };\n    terms: {\n      warranty: LegalTextSectionLabels;\n      liability: LegalTextSectionLabels;\n      changes: LegalTextSectionLabels;\n      /** 0.28.1: which language's version prevails — `o.bindingLanguage`, named. */\n      language: LegalOperatorSectionLabels;\n      /** The place of jurisdiction is the operator's `{city} ({region}), {country}`. */\n      law: LegalOperatorSectionLabels;\n    };\n  };\n}\n\n// Defined in ./legal-labels, which holds no component code (0.34, KS U8).\nexport { DEFAULT_LEGAL_LABELS };\n\n/** The `legal` namespace, resolved: defaults < provider < `labels` prop. The prop may be\n *  partial at every depth (`{ titles: { terms: \"…\" } }`), as the provider's is. */\nexport function useLegalLabels(labels?: LabelOverride<LegalLabels>): LegalLabels {\n  return useKitLabels(\"legal\", DEFAULT_LEGAL_LABELS, labels);\n}\n\n// ── What a LegalPage tells the sections inside it ─────────────────────────────\n\n/** Where a `{ref:key}` points: the section's number on a numbered page, else its heading. */\nexport interface LegalRefTarget {\n  number?: number;\n  heading: ReactNode;\n}\n\n/** @internal Set by `LegalPage` around its column; `null` outside one. */\nexport interface LegalPageContextValue {\n  page: LegalPageKey;\n  /** The operator with its country named — what the kit sections are filled in with. */\n  operator: LegalOperatorText;\n  /** The heading level of a section that does not choose one: one below the title. */\n  sectionHeading: \"h2\" | \"h3\";\n  /** Every section's key, in render order — known BEFORE any section renders, so a\n   *  reference can point forward (keksdose's section 2 refers to section 10). */\n  targets: ReadonlyMap<string, LegalRefTarget>;\n}\n\n/** @internal */\nexport const LegalPageContext = createContext<LegalPageContextValue | null>(null);\n\n/** @internal The place `LegalPage` gave one section: its key and its number. Reset to\n *  `null` inside a section, so a section nested in another's children takes neither. */\nexport interface LegalSectionSlot {\n  id?: string;\n  number?: number;\n}\n\n/** @internal */\nexport const LegalSlotContext = createContext<LegalSectionSlot | null>(null);\n\n/** @internal `{ref:retention}`. A key is a section key: letters, digits, `_` and `-`. */\nconst REF_TOKEN = /\\{ref:([A-Za-z0-9_-]+)\\}/g;\n\n/**\n * A development build's console note — never in production (the consumer's bundler\n * makes `import.meta.env.DEV` false) and never under vitest. Optional-chained:\n * `import.meta.env` is a Vite injection, absent under plain Node.\n */\nfunction devWarnings(): boolean {\n  return Boolean(import.meta.env?.DEV) && !import.meta.env?.VITEST;\n}\nconst warned = new Set<string>();\n/** @internal Once per message. */\nexport function warnLegalOnce(message: string): void {\n  if (!devWarnings() || warned.has(message)) return;\n  warned.add(message);\n  console.warn(`[ui-kit] ${message}`);\n}\n\n/**\n * `text` with every `{ref:key}` replaced by a link to `#key` that reads the section's\n * number — the words around it stay the app's (\"see section {ref:retention}\", \"siehe\n * Abschnitt {ref:retention}\"), so each language keeps its grammar (§4.1). On the imprint,\n * which is not numbered, the link reads the section's heading instead.\n *\n * Outside a {@link LegalPage} the text is returned as it is: there is no order to count.\n * A key the page has no section for stays visible as the raw token — a broken reference\n * an app test can find (`not.toHaveTextContent(\"{ref:\")`), not a silently wrong number.\n */\nexport function resolveLegalRefs(text: string, page: LegalPageContextValue | null): ReactNode {\n  if (!page || !text.includes(\"{ref:\")) return text;\n  const out: ReactNode[] = [];\n  let last = 0;\n  for (const match of text.matchAll(REF_TOKEN)) {\n    const at = match.index ?? 0;\n    if (at > last) out.push(text.slice(last, at));\n    const key = match[1];\n    const target = page.targets.get(key);\n    if (target) {\n      out.push(\n        <TextLink key={`${key}@${at}`} href={`#${key}`}>\n          {target.number ?? target.heading}\n        </TextLink>,\n      );\n    } else {\n      warnLegalOnce(`{ref:${key}} on the ${page.page} page points at no section of it.`);\n      out.push(match[0]);\n    }\n    last = at + match[0].length;\n  }\n  if (last < text.length) out.push(text.slice(last));\n  return out;\n}\n\n/** @internal Running text — one translation string — with its line breaks kept and its\n *  `{ref:key}` tokens resolved. */\nexport function LegalText({ text, className }: { text: string; className?: string }) {\n  const page = useContext(LegalPageContext);\n  // `break-words`: an address, an email or a URL in a translation is one long word, and\n  // on a 390px phone it would push the column wider than the screen.\n  return <p className={cn(\"whitespace-pre-line break-words\", className)}>{resolveLegalRefs(text, page)}</p>;\n}\n\n// ── Links ─────────────────────────────────────────────────────────────────────\n\nexport interface LegalLink {\n  href: string;\n  /** \"Imprint\", \"Privacy Policy\", \"Terms\". */\n  label: ReactNode;\n}\n\nexport interface LegalLinksProps {\n  /** Default (0.28): the three routes, `/impressum`, `/privacy` and `/terms`, with the\n   *  kit's short link labels (`legal.links`), in the contract's order. */\n  links?: readonly LegalLink[];\n  /**\n   * 0.51.4: the app's security page — a \"Security\" link after the others, with the kit's\n   * label (`legal.links.security`). Left out, no link: only an app that has the page\n   * names its route.\n   */\n  securityHref?: string;\n  /** 0.51.4: the app's accessibility statement — \"Accessibility\", last. As\n   *  `securityHref`. */\n  accessibilityHref?: string;\n  /** The page being shown; its link is marked `aria-current=\"page\"`. Usually the\n   *  router's pathname. */\n  currentHref?: string;\n  /** `false` renders the links without the `<nav>` landmark — inside `AuthLayout`'s\n   *  `footer` or `TopBarActionMenu`'s `footer`, which are named `<nav>`s already. The row\n   *  keeps its spacing and `className` either way (0.27.1: it used to return the bare\n   *  links, so in a plain container — Kurvenschmiede's account-menu `<li>` — they ran\n   *  together as \"ImpressumDatenschutzerklärungNutz…\" and overflowed). Default true. */\n  nav?: boolean;\n  /** Called on a click on any of the links, before it navigates — an account menu closes\n   *  itself here (0.28.1, keksdose: it had to catch the click on a wrapping `<div>`). */\n  onLinkClick?: (event: MouseEvent<HTMLAnchorElement>) => void;\n  labels?: LabelOverride<LegalLabels>;\n  className?: string;\n}\n\n/** The default links: the three routes under the kit's short labels. */\nfunction defaultLinks(labels: LegalLabels): LegalLink[] {\n  return ([\"impressum\", \"privacy\", \"terms\"] as const).map((page) => ({\n    href: LEGAL_HREFS[page],\n    label: labels.links[page],\n  }));\n}\n\n/** The optional pages after them, each only where the app named its route. */\nfunction infoLinks(labels: LegalLabels, hrefs: Partial<Record<LegalInfoPageKey, string>>): LegalLink[] {\n  return ([\"security\", \"accessibility\"] as const).flatMap((page) => {\n    const href = hrefs[page];\n    return href ? [{ href, label: labels.links[page] ?? DEFAULT_LEGAL_LABELS.links[page] }] : [];\n  });\n}\n\n/**\n * The legal pages as a row of quiet links, the one you are on marked (kastlan's\n * `LegalLinks`). Wraps on a phone.\n *\n * 0.28: `·` separators between the links, keksdose's footer style, wherever the links\n * appear — the account menu included (§3.3). The dots are `aria-hidden`: a screen reader\n * already hears three links, and \"middle dot\" between them is noise. They are flex items\n * of the row like the links, so the row's gap spaces them evenly.\n */\nexport function LegalLinks({\n  links,\n  securityHref,\n  accessibilityHref,\n  currentHref,\n  nav = true,\n  onLinkClick,\n  labels: labelsProp,\n  className,\n}: LegalLinksProps) {\n  const labels = useLegalLabels(labelsProp);\n  const shown = [\n    ...(links ?? defaultLinks(labels)),\n    ...infoLinks(labels, { security: securityHref, accessibility: accessibilityHref }),\n  ];\n  const items = shown.flatMap((link, i) => [\n    ...(i > 0 ? [<span key={`sep-${link.href}`} aria-hidden=\"true\">·</span>] : []),\n    <TextLink key={link.href} href={link.href} tone=\"muted\" current={link.href === currentHref} onClick={onLinkClick}>\n      {link.label}\n    </TextLink>,\n  ]);\n  const rowClass = cn(\"flex flex-wrap items-center gap-x-4 gap-y-1 text-xs\", className);\n  if (!nav) return <div className={rowClass}>{items}</div>;\n  return (\n    <nav aria-label={labels.navLabel} className={rowClass}>\n      {items}\n    </nav>\n  );\n}\n\n// ── Footer ────────────────────────────────────────────────────────────────────\n\nexport interface LegalFooterProps {\n  /** Under the links, centred — the app's tagline (keksdose: \"Self-hosted household\n   *  budgeting & bookkeeping.\"). */\n  children?: ReactNode;\n  /** Default: the three routes with the kit's link labels — see {@link LegalLinks}. */\n  links?: readonly LegalLink[];\n  /** 0.51.4: \"Security\" after the others — see {@link LegalLinksProps.securityHref}. */\n  securityHref?: string;\n  /** 0.51.4: \"Accessibility\", last — see {@link LegalLinksProps.accessibilityHref}. */\n  accessibilityHref?: string;\n  /** Marks that link `aria-current=\"page\"`. {@link LegalPage}'s default footer passes\n   *  its own page. */\n  currentHref?: string;\n  /**\n   * Default true: the footer is a `<footer>`. `false` draws a `<div>` — for a host that is\n   * a footer already: `AuthLayout`'s `footer` slot is one, and HTML forbids a footer inside\n   * a footer (0.28.1, kastlan). On an `AuthLayout` page the usual choice is simpler still:\n   * `footer={<LegalLinks nav={false} />}` with `footerLabel` set to the kit's `navLabel`\n   * ({@link useLegalLabels}).\n   */\n  landmark?: boolean;\n  className?: string;\n  labels?: LabelOverride<LegalLabels>;\n}\n\n/**\n * The public footer (§3.3): the three links, centred, with their separators, in a\n * `<nav aria-label=\"Legal\">` — on the landing or home page, every signed-out page the app\n * has, the legal pages and the 404. The rule behind it: from every page a signed-out\n * visitor can reach, the three links are one click away.\n *\n * keksdose's `SiteFooter` (features/landing/site-footer.tsx), which carried them on its\n * landing, auth, legal and 404 pages; kastlan and Kurvenschmiede had them on some pages\n * only. Its palette classes (`border-slate-200 bg-white dark:…`) became the surface and\n * border tokens, so it follows the theme like the rest of the kit.\n *\n * 0.51.4: an app with a security page or an accessibility statement passes their routes\n * (`securityHref`, `accessibilityHref`) and the row goes on with \"Security · Accessibility\"\n * in the kit's words, so the footer reads the same in every app that has them.\n */\nexport function LegalFooter({\n  children,\n  links,\n  securityHref,\n  accessibilityHref,\n  currentHref,\n  landmark = true,\n  className,\n  labels,\n}: LegalFooterProps) {\n  const Root = landmark ? \"footer\" : \"div\";\n  return (\n    <Root className={cn(\"border-t border-subtle bg-surface\", className)}>\n      <div className=\"mx-auto max-w-5xl px-4 py-8 text-sm text-muted\">\n        <LegalLinks\n          links={links}\n          securityHref={securityHref}\n          accessibilityHref={accessibilityHref}\n          currentHref={currentHref}\n          labels={labels}\n          className=\"justify-center gap-y-2 text-sm\"\n        />\n        {children !== undefined && children !== null && <p className=\"mt-4 text-center\">{children}</p>}\n      </div>\n    </Root>\n  );\n}\n\n// ── Section ───────────────────────────────────────────────────────────────────\n\nexport interface LegalSectionProps {\n  heading: ReactNode;\n  /** Running text. Line breaks in it are kept (`white-space: pre-line`), so a\n   *  translation can hold an address or a list as plain lines. Inside a\n   *  {@link LegalPage}, `{ref:key}` becomes the number of section `key`, linked. */\n  body?: string;\n  /** Anything richer than plain text — links, a list — after `body`. A plain string\n   *  here has its `{ref:key}` tokens resolved too. */\n  children?: ReactNode;\n  /**\n   * The section's `id`, for a link to it from elsewhere. Inside a {@link LegalPage} it\n   * defaults to the element's React `key` — keksdose's\n   * `SECTIONS.map((s) => <LegalSection key={s} … />)` gets `id=\"retention\"` with\n   * nothing added — and it is the key a `{ref:…}` names.\n   */\n  id?: string;\n  /** The heading's element. Default `h2` under the layout's `h1` (inside a\n   *  `LegalPage`, one level below its title). */\n  headingAs?: \"h2\" | \"h3\";\n}\n\n/**\n * One section: heading and running text.\n *\n * 0.28, inside a {@link LegalPage}: its `id` (the `key` unless given), its number on the\n * privacy policy and the terms (\"3. Legal basis\" — titles carry no number, §4.1), and\n * `{ref:key}` resolution in `body`. Outside one it is exactly the 0.19 section.\n */\nexport function LegalSection({ heading, body, children, id: idProp, headingAs }: LegalSectionProps) {\n  const page = useContext(LegalPageContext);\n  const slot = useContext(LegalSlotContext);\n  const id = idProp ?? slot?.id;\n  const number = slot?.number;\n  const Heading = headingAs ?? page?.sectionHeading ?? \"h2\";\n  return (\n    <section id={id} className=\"scroll-mt-20\">\n      <Heading className=\"text-lg font-semibold break-words text-primary\">\n        {number !== undefined && `${number}. `}\n        {heading}\n      </Heading>\n      <LegalSlotContext.Provider value={null}>\n        {body !== undefined && (\n          <LegalText text={body} className=\"mt-2 text-sm leading-relaxed text-secondary\" />\n        )}\n        {children !== undefined && (\n          <div className=\"mt-2 text-sm leading-relaxed break-words text-secondary\">\n            {typeof children === \"string\" ? resolveLegalRefs(children, page) : children}\n          </div>\n        )}\n      </LegalSlotContext.Provider>\n    </section>\n  );\n}\n\n// ── Layout ────────────────────────────────────────────────────────────────────\n\nexport interface LegalLayoutProps {\n  /** \"Imprint\", \"Privacy Policy\", \"Terms\". */\n  title: ReactNode;\n  /** Above the title — the app's \"← Back\" link (`<TextLink icon={ArrowLeft}>`). Inside\n   *  a {@link LegalPage}, \"← Back to home\". */\n  back?: ReactNode;\n  /**\n   * A notice under the title, as a warning banner with `role=\"note\"` — page furniture,\n   * not an alert. Per page, not per layout: the privacy page says something more precise\n   * than the others (its technical sections describe running code).\n   */\n  notice?: ReactNode;\n  /** 0.51.3: right under the title — {@link LegalPage}'s \"Last updated: …\" line. */\n  updated?: ReactNode;\n  /** 0.28.1: under the title, before the notice — {@link LegalPage}'s note that this\n   *  page is a translation and which language is binding. */\n  translationNote?: ReactNode;\n  /** 0.51.4: before the sections — {@link LegalPage}'s plain-language summary. */\n  summary?: ReactNode;\n  /** The sections — {@link LegalSection}s. */\n  children: ReactNode;\n  /** The three pages, linked at the end of the column with the current one marked.\n   *  Leave out when the page's chrome already shows them (a {@link LegalFooter}). */\n  links?: readonly LegalLink[];\n  currentHref?: string;\n  /** Default `h1`: the page's heading. */\n  headingAs?: \"h1\" | \"h2\";\n  /** Extra classes on the column — `px-0 py-0` inside a chrome that pads already. */\n  className?: string;\n  labels?: LabelOverride<LegalLabels>;\n}\n\nexport function LegalLayout({\n  title,\n  back,\n  notice,\n  updated,\n  translationNote,\n  summary,\n  children,\n  links,\n  currentHref,\n  headingAs: Heading = \"h1\",\n  className,\n  labels,\n}: LegalLayoutProps) {\n  return (\n    <article className={cn(\"mx-auto w-full max-w-3xl px-4 py-12\", className)}>\n      {back !== undefined && <div className=\"mb-4 text-sm\">{back}</div>}\n      <Heading className=\"text-3xl font-bold tracking-tight break-words text-primary\">{title}</Heading>\n      {updated !== undefined && updated !== null && <p className=\"mt-2 text-sm text-muted\">{updated}</p>}\n      {translationNote !== undefined && translationNote !== null && <div className=\"mt-3\">{translationNote}</div>}\n      {notice !== undefined && notice !== null && (\n        <AlertBanner tone=\"warning\" role=\"note\" className=\"mt-4\">\n          {notice}\n        </AlertBanner>\n      )}\n      <div className=\"mt-8 space-y-8\">\n        {summary}\n        {children}\n      </div>\n      {links !== undefined && links.length > 0 && (\n        <LegalLinks links={links} currentHref={currentHref} labels={labels} className=\"mt-12 border-t border-subtle pt-4\" />\n      )}\n    </article>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/legal.tsx"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { MouseEvent, ReactNode } from \"react\";\n\nimport { useKitLabels } from \"../i18n/kit-labels\";\nimport type { LabelOverride } from \"../i18n/kit-labels\";\nimport { cn } from \"../lib/cn\";\nimport { countryName } from \"../lib/countries\";\nimport { AlertBanner } from \"./alert-banner\";\nimport { TextLink } from \"./text-link\";\nimport { DEFAULT_LEGAL_LABELS } from \"./legal-labels\";\n\n/**\n * The legal pages — Imprint, Privacy Policy, Terms — for every app.\n *\n * 0.19 (docs/i18n-harmonization.md H10): keksdose and kastlan each carried the same\n * shell, written twice: a back link, the title, a \"closed beta, not yet reviewed by a\n * lawyer\" notice, sections of heading + running text, and kastlan's row of links to the\n * three pages with the current one marked. That shape moved here; the words stayed in\n * each app.\n *\n * 0.28 (docs/legal-harmonization.md) reverses the second half: the wording that is the\n * same in all three apps is the kit's too, in all seven languages, so there is ONE text\n * to change after the lawyer's review instead of three apps drifting apart sentence by\n * sentence. This module holds the labels (every kit-owned legal word, §4.3/§4.4), the\n * column (`LegalLayout`), the section (`LegalSection`, now numbered and cross-referenced\n * inside a `LegalPage`), the links row and the public footer. The page frame, the\n * kit-owned sections and the terms checkbox are in `./legal-page`.\n *\n * `LegalLayout` stays a CONTENT COLUMN, not a page: before 0.28 keksdose showed it inside\n * its public landing header and footer and kastlan inside `AuthLayout`. `LegalPage` is\n * the frame around it that the contract (§3.2) settled on — keksdose's.\n */\n\n// ── The operator ──────────────────────────────────────────────────────────────\n\n/** The three pages, by the key every app uses for them (§4.1). Kurvenschmiede's\n *  `imprint` became `impressum`. */\nexport type LegalPageKey = \"impressum\" | \"privacy\" | \"terms\";\n\n/** The three routes (§3.1): one per page, the language from i18n, no per-language URLs. */\nexport const LEGAL_HREFS: Readonly<Record<LegalPageKey, string>> = Object.freeze({\n  impressum: \"/impressum\",\n  privacy: \"/privacy\",\n  terms: \"/terms\",\n});\n\n/** 0.51.4: the two public pages an app MAY have beside the legal ones, linked after\n *  them in the footer (§3.3) — keksdose's /security and /accessibility. Not legal pages:\n *  an app draws them with `PublicPage`, in its own words, at routes of its choosing. */\nexport type LegalInfoPageKey = \"security\" | \"accessibility\";\n\n/**\n * Who runs the app — the values the kit's legal sections are filled in with (§5).\n *\n * The kit holds NO personal data: every app passes the same values once, to\n * {@link LegalPage}'s `operator`. Plain strings, so the app's config or env can hold them.\n */\nexport interface LegalOperator {\n  /** The operator's name, as the imprint prints it. */\n  name: string;\n  /** \"9470\"-shaped; printed before the city. */\n  postalCode: string;\n  /** The place — the imprint's address line and the terms' place of jurisdiction. */\n  city: string;\n  /** The canton or state, abbreviated as the place of jurisdiction writes it: \"SG\". */\n  region: string;\n  /**\n   * ISO 3166-1 alpha-2: \"CH\". A CODE, not a name — the kit names it in the page's\n   * language (`Intl.DisplayNames`, see `countryName`), so \"Switzerland\", \"Schweiz\",\n   * \"Suisse\" and \"瑞士\" all come from one value.\n   */\n  country: string;\n  /** The contact address the imprint and the privacy policy print. */\n  email: string;\n  /**\n   * The language whose version of the legal texts is BINDING (\"de-CH\"), a BCP 47 code\n   * (0.28.1, Marcel 2026-10-05). The lawyer reviews that one; the others are translations\n   * for convenience. With it, {@link LegalPage} shows a note on every page read in\n   * another language, and the terms' `language` section says which version prevails.\n   * Only the language subtag counts: \"de-CH\" and \"de\" are the same language here.\n   */\n  bindingLanguage?: string;\n}\n\n/**\n * The operator as the kit's texts read it: {@link LegalOperator} with `country` already\n * NAMED in the page's language (\"Schweiz\", not \"CH\").\n *\n * The label functions take this rather than the code so they stay pure string functions\n * of plain values, like every other function label in the kit: a catalogue never calls\n * `Intl`, and a review row can be rendered from placeholders (`{{country}}`).\n */\nexport type LegalOperatorText = Readonly<Record<keyof LegalOperator, string>>;\n\n/** The language subtag of a BCP 47 code, lower-cased: \"de-CH\" → \"de\". */\nexport function baseLanguage(code: string): string {\n  return code.split(/[-_]/)[0]!.toLowerCase();\n}\n\nconst languageNamers = new Map<string, Intl.DisplayNames | null>();\n\n/** The name of a language in `locale` — \"Deutsch\", \"German\", \"allemand\", \"德语\" — from its\n *  language subtag, so \"de-CH\" is plain \"German\", not \"Swiss High German\". The code itself\n *  when the runtime cannot name it. */\nfunction languageName(code: string, locale: string): string {\n  let namer = languageNamers.get(locale);\n  if (namer === undefined) {\n    try {\n      namer = new Intl.DisplayNames([locale], { type: \"language\" });\n    } catch {\n      namer = null;\n    }\n    languageNamers.set(locale, namer);\n  }\n  const base = baseLanguage(code);\n  try {\n    return namer?.of(base) ?? base;\n  } catch {\n    return base;\n  }\n}\n\n/** @internal The operator as the texts read it: its country named in `locale` (English\n *  without one — `countryName`'s rule, so an app that set no locale reads English). */\nexport function legalOperatorText(operator: LegalOperator, locale: string = \"en\"): LegalOperatorText {\n  return {\n    ...operator,\n    country: countryName(operator.country, locale),\n    bindingLanguage: operator.bindingLanguage ? languageName(operator.bindingLanguage, locale) : \"\",\n  };\n}\n\n// ── Labels ────────────────────────────────────────────────────────────────────\n\n/** A kit section whose text is fixed: a heading and one body. */\nexport interface LegalTextSectionLabels {\n  title: string;\n  body: string;\n}\n\n/**\n * 0.32.0: the imprint's disclaimer, with the body of its COMMERCIAL variant\n * (docs/billing-harmonization.md §8; legal decision 7). The title is the same in both:\n * liability for content and links is the subject either way.\n */\nexport interface LegalDisclaimerSectionLabels extends LegalTextSectionLabels {\n  /**\n   * The body for `<LegalKitSection section=\"disclaimer\" variant=\"commercial\">`: a paid\n   * service sold through a Merchant of Record, which sells in its own name (§2.2), so the\n   * \"private, non-commercial … closed beta\" of `body` would be untrue. OPTIONAL, as every\n   * key added to a namespace an app may annotate: left out, the provider's, then English.\n   */\n  commercial?: string;\n}\n\n/** A kit section whose text names the operator (§4.3 `{name}`, `{email}`, …). */\nexport interface LegalOperatorSectionLabels {\n  title: string;\n  /** Called with the operator, its country already named in the page's language. Line\n   *  breaks are kept (`white-space: pre-line`): an address is plain lines. */\n  body: (operator: LegalOperatorText) => string;\n}\n\n/** A kit section with an app slot (or a list) between its two parts. */\nexport interface LegalFramedSectionLabels {\n  title: string;\n  /** Before the app's part. */\n  lead: string;\n  /** After it. */\n  tail: string;\n}\n\n/**\n * Every word of the legal pages that is the kit's — docs/legal-harmonization.md §4.3 and\n * §4.4, verbatim. English, British spelling; the other six languages are in the\n * catalogues (`@eifi1/ui-kit/i18n/<code>`).\n *\n * Keys follow the contract: `sections.<page>.<section key>`, the section keys being\n * keksdose's (`legal_basis`, not `legalBasis`), because the same key is the section's\n * `id` (`/privacy#legal_basis`) and the app's own sections sit beside these under the\n * same names in its catalogue. Titles carry NO number: {@link LegalPage} numbers the\n * privacy and terms sections in render order (§4.1).\n */\nexport interface LegalLabels {\n  /** The accessible name of {@link LegalLinks}' and {@link LegalFooter}'s `<nav>`. */\n  navLabel: string;\n  /** The short labels of the three links, everywhere the links appear (§3.3), and since\n   *  0.51.4 of the two optional public pages after them (`securityHref`,\n   *  `accessibilityHref` on {@link LegalLinks}) — optional keys, as every key added to a\n   *  namespace an app may annotate: left out, the provider's, then English. */\n  links: Record<LegalPageKey, string> & Partial<Record<LegalInfoPageKey, string>>;\n  /** The pages' titles — the `<h1>`, and the links of the terms checkbox. */\n  titles: Record<LegalPageKey, string>;\n  /** The back link above the title: \"← Back to home\". */\n  backHome: string;\n  /**\n   * The terms checkbox (§3.4) — ONE template with `{terms}` and `{privacy}`, which\n   * become the links (named with `titles`). Not a prefix plus a joiner: a language puts\n   * the links where its grammar wants them, articles included, and nothing is added\n   * around a placeholder — Italian elides, \"e l’{privacy}\", with no space.\n   */\n  accept: string;\n  /** The notice under the title (§3.2): `beta` on the imprint and the terms, `privacy`\n   *  on the privacy policy. */\n  notice: {\n    beta: string;\n    privacy: string;\n  };\n  /**\n   * 0.28.1: on a page read in another language than the operator's `bindingLanguage` —\n   * `note` under the title, `show` on the button that switches to the binding version\n   * (when the app passes `onShowBindingLanguage`). `o.bindingLanguage` is the binding\n   * language's NAME in the reader's language (\"German\", \"allemand\").\n   */\n  translation: {\n    note: (o: LegalOperatorText) => string;\n    show: (o: LegalOperatorText) => string;\n  };\n  /**\n   * 0.51.3: the as-of line under the title (§3.2), \"Last updated: 29 October 2026\" —\n   * {@link LegalPage}'s `updated`, called with the date already written out in the page's\n   * locale. OPTIONAL, as every key added to a namespace an app may annotate: left out,\n   * the provider's, then English.\n   */\n  updated?: (date: string) => string;\n  /**\n   * 0.51.4: the plain-language summary at the top of a page ({@link LegalPage}'s\n   * `summary`, §3.2) — its heading, and the line under the points saying that only the\n   * full text binds. Optional, as `updated`.\n   */\n  summary?: {\n    title: string;\n    note: string;\n  };\n  /** The kit's sections (§4.3), by page and section key. */\n  sections: {\n    impressum: {\n      operator: LegalOperatorSectionLabels;\n      contact: LegalOperatorSectionLabels;\n      /** `body` is the default, non-commercial text; `commercial` the 0.32 variant. */\n      disclaimer: LegalDisclaimerSectionLabels;\n    };\n    privacy: {\n      controller: LegalOperatorSectionLabels;\n      /** The app's paragraph follows the body (§4.2): consent, where an app relies on it. */\n      legal_basis: LegalTextSectionLabels;\n      /** `lead`, then the app's entries as a list, then `tail`, then the app's paragraph. */\n      browser: LegalFramedSectionLabels;\n      /** `lead` (the rights), then the app's paragraph (export, deletion), then `tail`\n       *  (the supervisory authorities). */\n      rights: LegalFramedSectionLabels;\n      contact: LegalOperatorSectionLabels;\n    };\n    terms: {\n      warranty: LegalTextSectionLabels;\n      liability: LegalTextSectionLabels;\n      changes: LegalTextSectionLabels;\n      /** 0.28.1: which language's version prevails — `o.bindingLanguage`, named. */\n      language: LegalOperatorSectionLabels;\n      /** The place of jurisdiction is the operator's `{city} ({region}), {country}`. */\n      law: LegalOperatorSectionLabels;\n    };\n  };\n}\n\n// Defined in ./legal-labels, which holds no component code (0.34, KS U8).\nexport { DEFAULT_LEGAL_LABELS };\n\n/** The `legal` namespace, resolved: defaults < provider < `labels` prop. The prop may be\n *  partial at every depth (`{ titles: { terms: \"…\" } }`), as the provider's is. */\nexport function useLegalLabels(labels?: LabelOverride<LegalLabels>): LegalLabels {\n  return useKitLabels(\"legal\", DEFAULT_LEGAL_LABELS, labels);\n}\n\n// ── What a LegalPage tells the sections inside it ─────────────────────────────\n\n/** Where a `{ref:key}` points: the section's number on a numbered page, else its heading. */\nexport interface LegalRefTarget {\n  number?: number;\n  heading: ReactNode;\n}\n\n/** @internal Set by `LegalPage` around its column; `null` outside one. */\nexport interface LegalPageContextValue {\n  page: LegalPageKey;\n  /** The operator with its country named — what the kit sections are filled in with. */\n  operator: LegalOperatorText;\n  /** The heading level of a section that does not choose one: one below the title. */\n  sectionHeading: \"h2\" | \"h3\";\n  /** Every section's key, in render order — known BEFORE any section renders, so a\n   *  reference can point forward (keksdose's section 2 refers to section 10). */\n  targets: ReadonlyMap<string, LegalRefTarget>;\n}\n\n/** @internal */\nexport const LegalPageContext = createContext<LegalPageContextValue | null>(null);\n\n/** @internal The place `LegalPage` gave one section: its key and its number. Reset to\n *  `null` inside a section, so a section nested in another's children takes neither. */\nexport interface LegalSectionSlot {\n  id?: string;\n  number?: number;\n}\n\n/** @internal */\nexport const LegalSlotContext = createContext<LegalSectionSlot | null>(null);\n\n/** @internal `{ref:retention}`. A key is a section key: letters, digits, `_` and `-`. */\nconst REF_TOKEN = /\\{ref:([A-Za-z0-9_-]+)\\}/g;\n\n/**\n * A development build's console note — never in production (the consumer's bundler\n * makes `import.meta.env.DEV` false) and never under vitest. Optional-chained:\n * `import.meta.env` is a Vite injection, absent under plain Node.\n */\nfunction devWarnings(): boolean {\n  return Boolean(import.meta.env?.DEV) && !import.meta.env?.VITEST;\n}\nconst warned = new Set<string>();\n/** @internal Once per message. */\nexport function warnLegalOnce(message: string): void {\n  if (!devWarnings() || warned.has(message)) return;\n  warned.add(message);\n  console.warn(`[ui-kit] ${message}`);\n}\n\n/**\n * `text` with every `{ref:key}` replaced by a link to `#key` that reads the section's\n * number — the words around it stay the app's (\"see section {ref:retention}\", \"siehe\n * Abschnitt {ref:retention}\"), so each language keeps its grammar (§4.1). On the imprint,\n * which is not numbered, the link reads the section's heading instead.\n *\n * Outside a {@link LegalPage} the text is returned as it is: there is no order to count.\n * A key the page has no section for stays visible as the raw token — a broken reference\n * an app test can find (`not.toHaveTextContent(\"{ref:\")`), not a silently wrong number.\n */\nexport function resolveLegalRefs(text: string, page: LegalPageContextValue | null): ReactNode {\n  if (!page || !text.includes(\"{ref:\")) return text;\n  const out: ReactNode[] = [];\n  let last = 0;\n  for (const match of text.matchAll(REF_TOKEN)) {\n    const at = match.index ?? 0;\n    if (at > last) out.push(text.slice(last, at));\n    const key = match[1];\n    const target = page.targets.get(key);\n    if (target) {\n      out.push(\n        <TextLink key={`${key}@${at}`} href={`#${key}`}>\n          {target.number ?? target.heading}\n        </TextLink>,\n      );\n    } else {\n      warnLegalOnce(`{ref:${key}} on the ${page.page} page points at no section of it.`);\n      out.push(match[0]);\n    }\n    last = at + match[0].length;\n  }\n  if (last < text.length) out.push(text.slice(last));\n  return out;\n}\n\n/** @internal Running text — one translation string — with its line breaks kept and its\n *  `{ref:key}` tokens resolved. */\nexport function LegalText({ text, className }: { text: string; className?: string }) {\n  const page = useContext(LegalPageContext);\n  // `break-words`: an address, an email or a URL in a translation is one long word, and\n  // on a 390px phone it would push the column wider than the screen.\n  return <p className={cn(\"whitespace-pre-line break-words\", className)}>{resolveLegalRefs(text, page)}</p>;\n}\n\n// ── Links ─────────────────────────────────────────────────────────────────────\n\nexport interface LegalLink {\n  href: string;\n  /** \"Imprint\", \"Privacy Policy\", \"Terms\". */\n  label: ReactNode;\n}\n\nexport interface LegalLinksProps {\n  /** Default (0.28): the three routes, `/impressum`, `/privacy` and `/terms`, with the\n   *  kit's short link labels (`legal.links`), in the contract's order. */\n  links?: readonly LegalLink[];\n  /**\n   * 0.51.4: the app's security page — a \"Security\" link after the others, with the kit's\n   * label (`legal.links.security`). Left out, no link: only an app that has the page\n   * names its route.\n   */\n  securityHref?: string;\n  /** 0.51.4: the app's accessibility statement — \"Accessibility\", last. As\n   *  `securityHref`. */\n  accessibilityHref?: string;\n  /** The page being shown; its link is marked `aria-current=\"page\"`. Usually the\n   *  router's pathname. */\n  currentHref?: string;\n  /** `false` renders the links without the `<nav>` landmark — inside `AuthLayout`'s\n   *  `footer` or `TopBarActionMenu`'s `footer`, which are named `<nav>`s already. The row\n   *  keeps its spacing and `className` either way (0.27.1: it used to return the bare\n   *  links, so in a plain container — Kurvenschmiede's account-menu `<li>` — they ran\n   *  together as \"ImpressumDatenschutzerklärungNutz…\" and overflowed). Default true. */\n  nav?: boolean;\n  /** Called on a click on any of the links, before it navigates — an account menu closes\n   *  itself here (0.28.1, keksdose: it had to catch the click on a wrapping `<div>`). */\n  onLinkClick?: (event: MouseEvent<HTMLAnchorElement>) => void;\n  labels?: LabelOverride<LegalLabels>;\n  className?: string;\n}\n\n/** The default links: the three routes under the kit's short labels. */\nfunction defaultLinks(labels: LegalLabels): LegalLink[] {\n  return ([\"impressum\", \"privacy\", \"terms\"] as const).map((page) => ({\n    href: LEGAL_HREFS[page],\n    label: labels.links[page],\n  }));\n}\n\n/** The optional pages after them, each only where the app named its route. */\nfunction infoLinks(labels: LegalLabels, hrefs: Partial<Record<LegalInfoPageKey, string>>): LegalLink[] {\n  return ([\"security\", \"accessibility\"] as const).flatMap((page) => {\n    const href = hrefs[page];\n    return href ? [{ href, label: labels.links[page] ?? DEFAULT_LEGAL_LABELS.links[page] }] : [];\n  });\n}\n\n/**\n * The legal pages as a row of quiet links, the one you are on marked (kastlan's\n * `LegalLinks`). Wraps on a phone.\n *\n * 0.28: `·` separators between the links, keksdose's footer style, wherever the links\n * appear — the account menu included (§3.3). The dots are `aria-hidden`: a screen reader\n * already hears three links, and \"middle dot\" between them is noise. They are flex items\n * of the row like the links, so the row's gap spaces them evenly.\n */\nexport function LegalLinks({\n  links,\n  securityHref,\n  accessibilityHref,\n  currentHref,\n  nav = true,\n  onLinkClick,\n  labels: labelsProp,\n  className,\n}: LegalLinksProps) {\n  const labels = useLegalLabels(labelsProp);\n  const shown = [\n    ...(links ?? defaultLinks(labels)),\n    ...infoLinks(labels, { security: securityHref, accessibility: accessibilityHref }),\n  ];\n  const items = shown.flatMap((link, i) => [\n    ...(i > 0\n      ? [\n          <span key={`sep-${link.href}`} aria-hidden=\"true\">\n            ·\n          </span>,\n        ]\n      : []),\n    <TextLink key={link.href} href={link.href} tone=\"muted\" current={link.href === currentHref} onClick={onLinkClick}>\n      {link.label}\n    </TextLink>,\n  ]);\n  const rowClass = cn(\"flex flex-wrap items-center gap-x-4 gap-y-1 text-xs\", className);\n  if (!nav) return <div className={rowClass}>{items}</div>;\n  return (\n    <nav aria-label={labels.navLabel} className={rowClass}>\n      {items}\n    </nav>\n  );\n}\n\n// ── Footer ────────────────────────────────────────────────────────────────────\n\nexport interface LegalFooterProps {\n  /** Under the links, centred — the app's tagline (keksdose: \"Self-hosted household\n   *  budgeting & bookkeeping.\"). */\n  children?: ReactNode;\n  /** Default: the three routes with the kit's link labels — see {@link LegalLinks}. */\n  links?: readonly LegalLink[];\n  /** 0.51.4: \"Security\" after the others — see {@link LegalLinksProps.securityHref}. */\n  securityHref?: string;\n  /** 0.51.4: \"Accessibility\", last — see {@link LegalLinksProps.accessibilityHref}. */\n  accessibilityHref?: string;\n  /** Marks that link `aria-current=\"page\"`. {@link LegalPage}'s default footer passes\n   *  its own page. */\n  currentHref?: string;\n  /**\n   * Default true: the footer is a `<footer>`. `false` draws a `<div>` — for a host that is\n   * a footer already: `AuthLayout`'s `footer` slot is one, and HTML forbids a footer inside\n   * a footer (0.28.1, kastlan). On an `AuthLayout` page the usual choice is simpler still:\n   * `footer={<LegalLinks nav={false} />}` with `footerLabel` set to the kit's `navLabel`\n   * ({@link useLegalLabels}).\n   */\n  landmark?: boolean;\n  className?: string;\n  labels?: LabelOverride<LegalLabels>;\n}\n\n/**\n * The public footer (§3.3): the three links, centred, with their separators, in a\n * `<nav aria-label=\"Legal\">` — on the landing or home page, every signed-out page the app\n * has, the legal pages and the 404. The rule behind it: from every page a signed-out\n * visitor can reach, the three links are one click away.\n *\n * keksdose's `SiteFooter` (features/landing/site-footer.tsx), which carried them on its\n * landing, auth, legal and 404 pages; kastlan and Kurvenschmiede had them on some pages\n * only. Its palette classes (`border-slate-200 bg-white dark:…`) became the surface and\n * border tokens, so it follows the theme like the rest of the kit.\n *\n * 0.51.4: an app with a security page or an accessibility statement passes their routes\n * (`securityHref`, `accessibilityHref`) and the row goes on with \"Security · Accessibility\"\n * in the kit's words, so the footer reads the same in every app that has them.\n */\nexport function LegalFooter({\n  children,\n  links,\n  securityHref,\n  accessibilityHref,\n  currentHref,\n  landmark = true,\n  className,\n  labels,\n}: LegalFooterProps) {\n  const Root = landmark ? \"footer\" : \"div\";\n  return (\n    <Root className={cn(\"border-t border-subtle bg-surface\", className)}>\n      <div className=\"mx-auto max-w-5xl px-4 py-8 text-sm text-muted\">\n        <LegalLinks\n          links={links}\n          securityHref={securityHref}\n          accessibilityHref={accessibilityHref}\n          currentHref={currentHref}\n          labels={labels}\n          className=\"justify-center gap-y-2 text-sm\"\n        />\n        {children !== undefined && children !== null && <p className=\"mt-4 text-center\">{children}</p>}\n      </div>\n    </Root>\n  );\n}\n\n// ── Section ───────────────────────────────────────────────────────────────────\n\nexport interface LegalSectionProps {\n  heading: ReactNode;\n  /** Running text. Line breaks in it are kept (`white-space: pre-line`), so a\n   *  translation can hold an address or a list as plain lines. Inside a\n   *  {@link LegalPage}, `{ref:key}` becomes the number of section `key`, linked. */\n  body?: string;\n  /** Anything richer than plain text — links, a list — after `body`. A plain string\n   *  here has its `{ref:key}` tokens resolved too. */\n  children?: ReactNode;\n  /**\n   * The section's `id`, for a link to it from elsewhere. Inside a {@link LegalPage} it\n   * defaults to the element's React `key` — keksdose's\n   * `SECTIONS.map((s) => <LegalSection key={s} … />)` gets `id=\"retention\"` with\n   * nothing added — and it is the key a `{ref:…}` names.\n   */\n  id?: string;\n  /** The heading's element. Default `h2` under the layout's `h1` (inside a\n   *  `LegalPage`, one level below its title). */\n  headingAs?: \"h2\" | \"h3\";\n}\n\n/**\n * One section: heading and running text.\n *\n * 0.28, inside a {@link LegalPage}: its `id` (the `key` unless given), its number on the\n * privacy policy and the terms (\"3. Legal basis\" — titles carry no number, §4.1), and\n * `{ref:key}` resolution in `body`. Outside one it is exactly the 0.19 section.\n */\nexport function LegalSection({ heading, body, children, id: idProp, headingAs }: LegalSectionProps) {\n  const page = useContext(LegalPageContext);\n  const slot = useContext(LegalSlotContext);\n  const id = idProp ?? slot?.id;\n  const number = slot?.number;\n  const Heading = headingAs ?? page?.sectionHeading ?? \"h2\";\n  return (\n    <section id={id} className=\"scroll-mt-20\">\n      <Heading className=\"text-lg font-semibold break-words text-primary\">\n        {number !== undefined && `${number}. `}\n        {heading}\n      </Heading>\n      <LegalSlotContext.Provider value={null}>\n        {body !== undefined && <LegalText text={body} className=\"mt-2 text-sm leading-relaxed text-secondary\" />}\n        {children !== undefined && (\n          <div className=\"mt-2 text-sm leading-relaxed break-words text-secondary\">\n            {typeof children === \"string\" ? resolveLegalRefs(children, page) : children}\n          </div>\n        )}\n      </LegalSlotContext.Provider>\n    </section>\n  );\n}\n\n// ── Layout ────────────────────────────────────────────────────────────────────\n\nexport interface LegalLayoutProps {\n  /** \"Imprint\", \"Privacy Policy\", \"Terms\". */\n  title: ReactNode;\n  /** Above the title — the app's \"← Back\" link (`<TextLink icon={ArrowLeft}>`). Inside\n   *  a {@link LegalPage}, \"← Back to home\". */\n  back?: ReactNode;\n  /**\n   * A notice under the title, as a warning banner with `role=\"note\"` — page furniture,\n   * not an alert. Per page, not per layout: the privacy page says something more precise\n   * than the others (its technical sections describe running code).\n   */\n  notice?: ReactNode;\n  /** 0.51.3: right under the title — {@link LegalPage}'s \"Last updated: …\" line. */\n  updated?: ReactNode;\n  /** 0.28.1: under the title, before the notice — {@link LegalPage}'s note that this\n   *  page is a translation and which language is binding. */\n  translationNote?: ReactNode;\n  /** 0.51.4: before the sections — {@link LegalPage}'s plain-language summary. */\n  summary?: ReactNode;\n  /** The sections — {@link LegalSection}s. */\n  children: ReactNode;\n  /** The three pages, linked at the end of the column with the current one marked.\n   *  Leave out when the page's chrome already shows them (a {@link LegalFooter}). */\n  links?: readonly LegalLink[];\n  currentHref?: string;\n  /** Default `h1`: the page's heading. */\n  headingAs?: \"h1\" | \"h2\";\n  /** Extra classes on the column — `px-0 py-0` inside a chrome that pads already. */\n  className?: string;\n  labels?: LabelOverride<LegalLabels>;\n}\n\nexport function LegalLayout({\n  title,\n  back,\n  notice,\n  updated,\n  translationNote,\n  summary,\n  children,\n  links,\n  currentHref,\n  headingAs: Heading = \"h1\",\n  className,\n  labels,\n}: LegalLayoutProps) {\n  return (\n    <article className={cn(\"mx-auto w-full max-w-3xl px-4 py-12\", className)}>\n      {back !== undefined && <div className=\"mb-4 text-sm\">{back}</div>}\n      <Heading className=\"text-3xl font-bold tracking-tight break-words text-primary\">{title}</Heading>\n      {updated !== undefined && updated !== null && <p className=\"mt-2 text-sm text-muted\">{updated}</p>}\n      {translationNote !== undefined && translationNote !== null && <div className=\"mt-3\">{translationNote}</div>}\n      {notice !== undefined && notice !== null && (\n        <AlertBanner tone=\"warning\" role=\"note\" className=\"mt-4\">\n          {notice}\n        </AlertBanner>\n      )}\n      <div className=\"mt-8 space-y-8\">\n        {summary}\n        {children}\n      </div>\n      {links !== undefined && links.length > 0 && (\n        <LegalLinks\n          links={links}\n          currentHref={currentHref}\n          labels={labels}\n          className=\"mt-12 border-t border-subtle pt-4\"\n        />\n      )}\n    </article>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/lightbox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/lightbox.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport type { KeyboardEvent, ReactNode, TouchEvent } from \"react\";\nimport { ChevronLeft, ChevronRight, Download, ExternalLink, FileText, ZoomIn } from \"lucide-react\";\n\nimport { cn } from \"../lib/cn\";\nimport { horizontalStep } from \"../lib/direction\";\nimport { useKitLabels, type LabelOverride } from \"../i18n/kit-labels\";\nimport { useAuthedSrc } from \"../hooks/use-authed-src\";\nimport { useBreakpoint } from \"../hooks/use-breakpoint\";\nimport type { AuthedFetcher } from \"../hooks/use-authed-src\";\nimport { FullBleedDialog } from \"./full-bleed-dialog\";\nimport { IconButton } from \"./icon-button\";\nimport { buttonClasses } from \"./button-look\";\nimport { ImageStates, DEFAULT_AUTHED_IMAGE_LABELS } from \"./authed-image\";\nimport { useAnchorDir } from \"./use-anchor-dir\";\nimport { DEFAULT_LIGHTBOX_LABELS } from \"./lightbox-labels\";\n\n/* ── The item both the grid and the lightbox show ────────────────────────── */\n\n/** `image`: shown as a picture. `file`: anything a browser cannot put in an `<img>` —\n *  a floor plan uploaded as a PDF — shown as a file card with open and download. */\nexport type ImageItemKind = \"image\" | \"file\";\n\nexport interface ImageItem {\n  /** React key. Defaults to `src`. */\n  key?: string | number;\n  /** The full-size file — what the lightbox shows and downloads. An API path when the\n   *  component is given a `fetcher`. */\n  src: string;\n  /** A smaller rendition for the grid, when the server has one. Default: `src`. */\n  thumbnailSrc?: string;\n  /** Required: the picture's text alternative, and the open button's name. */\n  alt: string;\n  /** Shown under the thumbnail and at the foot of the lightbox. */\n  caption?: ReactNode;\n  /** The file's MIME type, when known (`\"application/pdf\"`). Decides {@link kind}. */\n  mimeType?: string;\n  /** Say it outright. Default: from {@link mimeType}, else from the file extension in\n   *  `src`, else — for a fetched file — from the type the server sent back. */\n  kind?: ImageItemKind;\n  /** The name a download is saved under, and a file card's heading. */\n  fileName?: string;\n}\n\nconst FILE_EXTENSION = /\\.(pdf|docx?|xlsx?|pptx?|odt|ods|zip|txt|csv|rtf)(?:[?#]|$)/i;\n\n/** What an item is, from what is known about it WITHOUT fetching it — see\n *  {@link ImageItem.kind}. `fetchedType` is the blob's type once it is in. */\nexport function imageItemKind(item: ImageItem, fetchedType?: string): ImageItemKind {\n  if (item.kind) return item.kind;\n  if (item.mimeType) return item.mimeType.startsWith(\"image/\") ? \"image\" : \"file\";\n  if (FILE_EXTENSION.test(item.src)) return \"file\";\n  if (fetchedType && !fetchedType.startsWith(\"image/\")) return \"file\";\n  return \"image\";\n}\n\n/* ── Labels ──────────────────────────────────────────────────────────────── */\n\nexport interface LightboxLabels {\n  /** The dialog's accessible name. */\n  dialog: string;\n  close: string;\n  previous: string;\n  next: string;\n  /** The visible counter: \"3 / 7\". */\n  counter: (index: number, count: number) => string;\n  /** What a screen reader hears on each page turn: \"Image 3 of 7\". The alt follows. */\n  position: (index: number, count: number) => string;\n  download: string;\n  /** The zoom toggle (a pressed/not-pressed button — its name does not change). */\n  zoom: string;\n  /** A file card's note: the file has no picture to show. */\n  noPreview: string;\n  /** A file card's link to the browser's own viewer (a PDF opens in its viewer). */\n  openInNewTab: string;\n}\n\n// Defined in ./lightbox-labels, which holds no component code (0.34, KS U8).\nexport { DEFAULT_LIGHTBOX_LABELS };\n\n/* ── The component ───────────────────────────────────────────────────────── */\n\nexport interface LightboxProps {\n  open: boolean;\n  /** The X, Escape and the Back gesture all call this. */\n  onClose: () => void;\n  items: readonly ImageItem[];\n  /** The item on screen (0-based). Controlled, so the grid — or a URL — can own it. */\n  index: number;\n  onIndexChange: (index: number) => void;\n  /** The app's authenticated GET (see {@link useAuthedSrc}); left out, `src` is\n   *  loaded by the browser as usual. */\n  fetcher?: AuthedFetcher | null;\n  /** Previous from the first goes to the last, and next from the last to the first.\n   *  Default `false`: the buttons at the ends are disabled, which says where the set\n   *  ends. */\n  loop?: boolean;\n  /** Double-click (or double-tap) the picture, or the zoom button, to see it at full\n   *  size and pan by scrolling. Default `true`. Pinch zoom is the browser's own. */\n  zoom?: boolean;\n  /** A download link in the header. Default `true`. */\n  download?: boolean;\n  /**\n   * Download through the app instead — kastlan's floor plans have `openDocument(id)`,\n   * which knows the stored file name. Replaces the link with a button that calls this.\n   */\n  onDownload?: (item: ImageItem, index: number) => void;\n  /** Push a history entry so Back closes the viewer. Default `true`; see\n   *  `FullBleedDialog`'s `backCloses` for when to turn it off. */\n  backCloses?: boolean;\n  labels?: LabelOverride<LightboxLabels>;\n}\n\n/** Swipes shorter than this are taps, and a drag that is mostly vertical is a scroll. */\nconst SWIPE_MIN_PX = 50;\n\n/**\n * A full-screen viewer for a set of images (and files that are not images).\n *\n * Built on {@link FullBleedDialog} rather than beside it, so the viewer has the kit's\n * one implementation of everything an overlay owes the page: the focus trap, Escape,\n * the Back gesture closing it instead of leaving the page (`useOverlayHistory`), the\n * body-scroll lock and the enter/exit motion.\n *\n * Paging: the previous/next buttons, ←/→ (which swap in a right-to-left page — the\n * direction is read at the point the viewer is rendered, since the dialog itself is\n * portalled out of it), Home/End, and a horizontal swipe on a touch screen.\n *\n * Zoom is a TOGGLE, not a gesture: double-click (or the zoom button) shows the picture\n * at its natural size and the body scrolls to pan. Pinch-to-zoom is not implemented —\n * the browser's own page pinch still works — because a pinch handler would have to own\n * every touch on the picture, and with it the swipe.\n *\n * A non-image (a PDF floor plan) is shown as a file card: its name, \"no preview\", a\n * link that opens it in the browser's own viewer, and the download. An `<iframe>`\n * preview was the alternative; phone browsers render a PDF in one inconsistently or\n * not at all, and a card works everywhere.\n */\nexport function Lightbox({\n  open,\n  onClose,\n  items,\n  index: indexProp,\n  onIndexChange,\n  fetcher,\n  loop = false,\n  zoom: zoomEnabled = true,\n  download = true,\n  onDownload,\n  backCloses,\n  labels: labelsProp,\n}: LightboxProps) {\n  const labels = useKitLabels(\"lightbox\", DEFAULT_LIGHTBOX_LABELS, labelsProp);\n  const imageLabels = useKitLabels(\"authedImage\", DEFAULT_AUTHED_IMAGE_LABELS);\n  const count = items.length;\n  // Clamped: the set can shrink under an open viewer (the photo on screen was deleted).\n  const index = count === 0 ? 0 : Math.min(Math.max(indexProp, 0), count - 1);\n  const item = items[index] as ImageItem | undefined;\n\n  // The dialog is portalled to <body>, out of the subtree whose `dir` it would have\n  // inherited; this marker stays where the viewer was rendered and reads it there.\n  const anchorRef = useRef<HTMLSpanElement>(null);\n  const dir = useAnchorDir(anchorRef, open);\n\n  // The toolbar's words (docs/text-size-harmonization.md §4, §10.8). At Large an\n  // IconButton shows its label beside the glyph; on a narrow screen the viewer's header —\n  // the counter, Zoom, Download and the dialog's close — has no room for two words at\n  // 150 % (a 390 px phone is 260 px of Normal type), so below `sm` the toolbar keeps its\n  // icons, as the plain download link hides its word there (`max-sm:sr-only`). From `sm`\n  // up, at the same breakpoint the CSS uses, the words show. Each name stays the\n  // accessible name and the tooltip either way.\n  const narrow = useBreakpoint(\"max-sm\");\n  const toolbarLabelVisible = narrow ? false : undefined;\n\n  const fetched = useAuthedSrc(item?.src, { fetcher, enabled: open });\n  const kind = item ? imageItemKind(item, fetched.type) : \"image\";\n\n  const [zoomedKey, setZoomedKey] = useState<string | null>(null);\n  const itemKey = item ? String(item.key ?? item.src) : null;\n  // Zoom belongs to the picture it was turned on for: paging on resets it.\n  const zoomed = zoomEnabled && kind === \"image\" && zoomedKey !== null && zoomedKey === itemKey;\n  const toggleZoom = () => setZoomedKey(zoomed ? null : itemKey);\n\n  const canPrev = loop ? count > 1 : index > 0;\n  const canNext = loop ? count > 1 : index < count - 1;\n  const go = (step: number) => {\n    if (count === 0) return;\n    let next = index + step;\n    if (loop) next = (next + count) % count;\n    if (next < 0 || next >= count || next === index) return;\n    onIndexChange(next);\n  };\n\n  const onKeyDown = (e: KeyboardEvent<HTMLDivElement>) => {\n    // A key meant for a control stays with it: Space/Enter on a button, typing in any\n    // field a caller's caption might hold.\n    const target = e.target as HTMLElement;\n    if (target.closest(\"input, textarea, select, [contenteditable='true']\")) return;\n    const step = horizontalStep(e.key, e.currentTarget);\n    if (step !== 0) {\n      e.preventDefault();\n      go(step);\n    } else if (e.key === \"Home\") {\n      e.preventDefault();\n      if (index !== 0) onIndexChange(0);\n    } else if (e.key === \"End\") {\n      e.preventDefault();\n      if (index !== count - 1) onIndexChange(count - 1);\n    }\n  };\n\n  const touchStart = useRef<{ x: number; y: number } | null>(null);\n  const onTouchStart = (e: TouchEvent) => {\n    const t = e.touches[0];\n    touchStart.current = e.touches.length === 1 && t ? { x: t.clientX, y: t.clientY } : null;\n  };\n  const onTouchEnd = (e: TouchEvent) => {\n    const start = touchStart.current;\n    touchStart.current = null;\n    const t = e.changedTouches[0];\n    // Zoomed, a drag is a PAN of the picture, not a page turn.\n    if (!start || !t || zoomed) return;\n    const dx = t.clientX - start.x;\n    const dy = t.clientY - start.y;\n    if (Math.abs(dx) < SWIPE_MIN_PX || Math.abs(dx) < Math.abs(dy)) return;\n    // Swiping toward the START edge brings in the next picture from the end edge.\n    const towardStart = dir === \"rtl\" ? dx > 0 : dx < 0;\n    go(towardStart ? 1 : -1);\n  };\n\n  // Paging the viewer while zoomed would leave the new picture scrolled to where the\n  // last one was panned; start each at its top-left.\n  const bodyRef = useRef<HTMLDivElement>(null);\n  useEffect(() => {\n    bodyRef.current?.scrollTo?.({ top: 0, left: 0 });\n  }, [index]);\n\n  const downloadHref = fetched.src;\n  const downloadControl =\n    download && item ? (\n      onDownload ? (\n        <IconButton\n          size=\"sm\"\n          label={labels.download}\n          labelVisible={toolbarLabelVisible}\n          onClick={() => onDownload(item, index)}\n        >\n          <Download />\n        </IconButton>\n      ) : downloadHref ? (\n        <a\n          href={downloadHref}\n          // `download` names the saved file; a blob: URL has no name of its own.\n          download={item.fileName ?? \"\"}\n          className={buttonClasses(\"ghost\", { size: \"sm\" })}\n        >\n          <Download aria-hidden className=\"size-4\" />\n          <span className=\"max-sm:sr-only\">{labels.download}</span>\n        </a>\n      ) : null\n    ) : null;\n\n  const header = item ? (\n    <div className=\"flex min-w-0 items-center gap-2\">\n      <span aria-hidden className=\"shrink-0 text-sm tabular-nums text-secondary\">\n        {labels.counter(index + 1, count)}\n      </span>\n      {/* The page turn, said — focus does not move when the picture changes, so\n          without this a reader pressing → hears nothing at all. */}\n      <span role=\"status\" aria-live=\"polite\" className=\"sr-only\">\n        {`${labels.position(index + 1, count)}${item.alt ? `: ${item.alt}` : \"\"}`}\n      </span>\n      <span className=\"min-w-0 flex-1\" />\n      {zoomEnabled && kind === \"image\" && (\n        <IconButton\n          size=\"sm\"\n          label={labels.zoom}\n          labelVisible={toolbarLabelVisible}\n          pressed={zoomed}\n          onClick={toggleZoom}\n        >\n          <ZoomIn />\n        </IconButton>\n      )}\n      {downloadControl}\n    </div>\n  ) : null;\n\n  const slide = !item ? null : kind === \"file\" ? (\n    <div className=\"flex max-w-sm flex-col items-center gap-3 rounded-lg border border-subtle p-6 text-center\">\n      <FileText aria-hidden className=\"size-10 text-muted\" />\n      <p className=\"break-all font-medium text-primary\">{item.fileName ?? item.alt}</p>\n      <p className=\"text-sm text-muted\">{labels.noPreview}</p>\n      {fetched.src && (\n        <a\n          href={fetched.src}\n          target=\"_blank\"\n          rel=\"noreferrer noopener\"\n          className={buttonClasses(\"secondary\", { size: \"sm\" })}\n        >\n          <ExternalLink aria-hidden className=\"size-4\" />\n          {labels.openInNewTab}\n        </a>\n      )}\n    </div>\n  ) : (\n    <ImageStates\n      // Keyed by item: a new picture is a new decode, never the old one's \"loaded\".\n      key={itemKey ?? undefined}\n      fetched={fetched}\n      alt={item.alt}\n      labels={imageLabels}\n      wrapperClassName={\n        zoomed ? \"max-w-none shrink-0\" : \"flex h-full w-full items-center justify-center\"\n      }\n      className={cn(\n        zoomed ? \"max-w-none cursor-zoom-out\" : \"max-h-full max-w-full object-contain\",\n        !zoomed && zoomEnabled && \"cursor-zoom-in\",\n      )}\n      imgProps={{\n        draggable: false,\n        onDoubleClick: zoomEnabled ? toggleZoom : undefined,\n      }}\n    />\n  );\n\n  return (\n    <>\n      <span ref={anchorRef} hidden />\n      <FullBleedDialog\n        open={open && !!item}\n        onClose={onClose}\n        closeLabel={labels.close}\n        aria-label={labels.dialog}\n        dir={dir}\n        header={header}\n        backCloses={backCloses}\n        onKeyDown={onKeyDown}\n        data-lightbox=\"\"\n        footer={\n          item?.caption !== undefined && item.caption !== null && item.caption !== false ? (\n            <p className=\"me-auto min-w-0 text-sm text-secondary\">{item.caption}</p>\n          ) : undefined\n        }\n      >\n        <div\n          ref={bodyRef}\n          data-lightbox-stage=\"\"\n          data-zoomed={zoomed ? \"\" : undefined}\n          onTouchStart={onTouchStart}\n          onTouchEnd={onTouchEnd}\n          className={cn(\n            \"relative h-full min-h-48 w-full\",\n            zoomed ? \"overflow-auto\" : \"flex items-center justify-center overflow-hidden\",\n          )}\n        >\n          {slide}\n        </div>\n        {count > 1 && (\n          <>\n            <IconButton\n              variant=\"overlay\"\n              size=\"lg\"\n              label={labels.previous}\n              disabled={!canPrev}\n              onClick={() => go(-1)}\n              className=\"absolute start-3 top-1/2 -translate-y-1/2\"\n              tooltip={false}\n            >\n              <ChevronLeft className=\"rtl:-scale-x-100\" />\n            </IconButton>\n            <IconButton\n              variant=\"overlay\"\n              size=\"lg\"\n              label={labels.next}\n              disabled={!canNext}\n              onClick={() => go(1)}\n              className=\"absolute end-3 top-1/2 -translate-y-1/2\"\n              tooltip={false}\n            >\n              <ChevronRight className=\"rtl:-scale-x-100\" />\n            </IconButton>\n          </>\n        )}\n      </FullBleedDialog>\n    </>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/lightbox.tsx"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\nimport type { KeyboardEvent, ReactNode, TouchEvent } from \"react\";\nimport { ChevronLeft, ChevronRight, Download, ExternalLink, FileText, ZoomIn } from \"lucide-react\";\n\nimport { cn } from \"../lib/cn\";\nimport { horizontalStep } from \"../lib/direction\";\nimport { useKitLabels, type LabelOverride } from \"../i18n/kit-labels\";\nimport { useAuthedSrc } from \"../hooks/use-authed-src\";\nimport { useBreakpoint } from \"../hooks/use-breakpoint\";\nimport type { AuthedFetcher } from \"../hooks/use-authed-src\";\nimport { FullBleedDialog } from \"./full-bleed-dialog\";\nimport { IconButton } from \"./icon-button\";\nimport { buttonClasses } from \"./button-look\";\nimport { ImageStates, DEFAULT_AUTHED_IMAGE_LABELS } from \"./authed-image\";\nimport { useAnchorDir } from \"./use-anchor-dir\";\nimport { DEFAULT_LIGHTBOX_LABELS } from \"./lightbox-labels\";\n\n/* ── The item both the grid and the lightbox show ────────────────────────── */\n\n/** `image`: shown as a picture. `file`: anything a browser cannot put in an `<img>` —\n *  a floor plan uploaded as a PDF — shown as a file card with open and download. */\nexport type ImageItemKind = \"image\" | \"file\";\n\nexport interface ImageItem {\n  /** React key. Defaults to `src`. */\n  key?: string | number;\n  /** The full-size file — what the lightbox shows and downloads. An API path when the\n   *  component is given a `fetcher`. */\n  src: string;\n  /** A smaller rendition for the grid, when the server has one. Default: `src`. */\n  thumbnailSrc?: string;\n  /** Required: the picture's text alternative, and the open button's name. */\n  alt: string;\n  /** Shown under the thumbnail and at the foot of the lightbox. */\n  caption?: ReactNode;\n  /** The file's MIME type, when known (`\"application/pdf\"`). Decides {@link kind}. */\n  mimeType?: string;\n  /** Say it outright. Default: from {@link mimeType}, else from the file extension in\n   *  `src`, else — for a fetched file — from the type the server sent back. */\n  kind?: ImageItemKind;\n  /** The name a download is saved under, and a file card's heading. */\n  fileName?: string;\n}\n\nconst FILE_EXTENSION = /\\.(pdf|docx?|xlsx?|pptx?|odt|ods|zip|txt|csv|rtf)(?:[?#]|$)/i;\n\n/** What an item is, from what is known about it WITHOUT fetching it — see\n *  {@link ImageItem.kind}. `fetchedType` is the blob's type once it is in. */\nexport function imageItemKind(item: ImageItem, fetchedType?: string): ImageItemKind {\n  if (item.kind) return item.kind;\n  if (item.mimeType) return item.mimeType.startsWith(\"image/\") ? \"image\" : \"file\";\n  if (FILE_EXTENSION.test(item.src)) return \"file\";\n  if (fetchedType && !fetchedType.startsWith(\"image/\")) return \"file\";\n  return \"image\";\n}\n\n/* ── Labels ──────────────────────────────────────────────────────────────── */\n\nexport interface LightboxLabels {\n  /** The dialog's accessible name. */\n  dialog: string;\n  close: string;\n  previous: string;\n  next: string;\n  /** The visible counter: \"3 / 7\". */\n  counter: (index: number, count: number) => string;\n  /** What a screen reader hears on each page turn: \"Image 3 of 7\". The alt follows. */\n  position: (index: number, count: number) => string;\n  download: string;\n  /** The zoom toggle (a pressed/not-pressed button — its name does not change). */\n  zoom: string;\n  /** A file card's note: the file has no picture to show. */\n  noPreview: string;\n  /** A file card's link to the browser's own viewer (a PDF opens in its viewer). */\n  openInNewTab: string;\n}\n\n// Defined in ./lightbox-labels, which holds no component code (0.34, KS U8).\nexport { DEFAULT_LIGHTBOX_LABELS };\n\n/* ── The component ───────────────────────────────────────────────────────── */\n\nexport interface LightboxProps {\n  open: boolean;\n  /** The X, Escape and the Back gesture all call this. */\n  onClose: () => void;\n  items: readonly ImageItem[];\n  /** The item on screen (0-based). Controlled, so the grid — or a URL — can own it. */\n  index: number;\n  onIndexChange: (index: number) => void;\n  /** The app's authenticated GET (see {@link useAuthedSrc}); left out, `src` is\n   *  loaded by the browser as usual. */\n  fetcher?: AuthedFetcher | null;\n  /** Previous from the first goes to the last, and next from the last to the first.\n   *  Default `false`: the buttons at the ends are disabled, which says where the set\n   *  ends. */\n  loop?: boolean;\n  /** Double-click (or double-tap) the picture, or the zoom button, to see it at full\n   *  size and pan by scrolling. Default `true`. Pinch zoom is the browser's own. */\n  zoom?: boolean;\n  /** A download link in the header. Default `true`. */\n  download?: boolean;\n  /**\n   * Download through the app instead — kastlan's floor plans have `openDocument(id)`,\n   * which knows the stored file name. Replaces the link with a button that calls this.\n   */\n  onDownload?: (item: ImageItem, index: number) => void;\n  /** Push a history entry so Back closes the viewer. Default `true`; see\n   *  `FullBleedDialog`'s `backCloses` for when to turn it off. */\n  backCloses?: boolean;\n  labels?: LabelOverride<LightboxLabels>;\n}\n\n/** Swipes shorter than this are taps, and a drag that is mostly vertical is a scroll. */\nconst SWIPE_MIN_PX = 50;\n\n/**\n * A full-screen viewer for a set of images (and files that are not images).\n *\n * Built on {@link FullBleedDialog} rather than beside it, so the viewer has the kit's\n * one implementation of everything an overlay owes the page: the focus trap, Escape,\n * the Back gesture closing it instead of leaving the page (`useOverlayHistory`), the\n * body-scroll lock and the enter/exit motion.\n *\n * Paging: the previous/next buttons, ←/→ (which swap in a right-to-left page — the\n * direction is read at the point the viewer is rendered, since the dialog itself is\n * portalled out of it), Home/End, and a horizontal swipe on a touch screen.\n *\n * Zoom is a TOGGLE, not a gesture: double-click (or the zoom button) shows the picture\n * at its natural size and the body scrolls to pan. Pinch-to-zoom is not implemented —\n * the browser's own page pinch still works — because a pinch handler would have to own\n * every touch on the picture, and with it the swipe.\n *\n * A non-image (a PDF floor plan) is shown as a file card: its name, \"no preview\", a\n * link that opens it in the browser's own viewer, and the download. An `<iframe>`\n * preview was the alternative; phone browsers render a PDF in one inconsistently or\n * not at all, and a card works everywhere.\n */\nexport function Lightbox({\n  open,\n  onClose,\n  items,\n  index: indexProp,\n  onIndexChange,\n  fetcher,\n  loop = false,\n  zoom: zoomEnabled = true,\n  download = true,\n  onDownload,\n  backCloses,\n  labels: labelsProp,\n}: LightboxProps) {\n  const labels = useKitLabels(\"lightbox\", DEFAULT_LIGHTBOX_LABELS, labelsProp);\n  const imageLabels = useKitLabels(\"authedImage\", DEFAULT_AUTHED_IMAGE_LABELS);\n  const count = items.length;\n  // Clamped: the set can shrink under an open viewer (the photo on screen was deleted).\n  const index = count === 0 ? 0 : Math.min(Math.max(indexProp, 0), count - 1);\n  const item = items[index] as ImageItem | undefined;\n\n  // The dialog is portalled to <body>, out of the subtree whose `dir` it would have\n  // inherited; this marker stays where the viewer was rendered and reads it there.\n  const anchorRef = useRef<HTMLSpanElement>(null);\n  const dir = useAnchorDir(anchorRef, open);\n\n  // The toolbar's words (docs/text-size-harmonization.md §4, §10.8). At Large an\n  // IconButton shows its label beside the glyph; on a narrow screen the viewer's header —\n  // the counter, Zoom, Download and the dialog's close — has no room for two words at\n  // 150 % (a 390 px phone is 260 px of Normal type), so below `sm` the toolbar keeps its\n  // icons, as the plain download link hides its word there (`max-sm:sr-only`). From `sm`\n  // up, at the same breakpoint the CSS uses, the words show. Each name stays the\n  // accessible name and the tooltip either way.\n  const narrow = useBreakpoint(\"max-sm\");\n  const toolbarLabelVisible = narrow ? false : undefined;\n\n  const fetched = useAuthedSrc(item?.src, { fetcher, enabled: open });\n  const kind = item ? imageItemKind(item, fetched.type) : \"image\";\n\n  const [zoomedKey, setZoomedKey] = useState<string | null>(null);\n  const itemKey = item ? String(item.key ?? item.src) : null;\n  // Zoom belongs to the picture it was turned on for: paging on resets it.\n  const zoomed = zoomEnabled && kind === \"image\" && zoomedKey !== null && zoomedKey === itemKey;\n  const toggleZoom = () => setZoomedKey(zoomed ? null : itemKey);\n\n  const canPrev = loop ? count > 1 : index > 0;\n  const canNext = loop ? count > 1 : index < count - 1;\n  const go = (step: number) => {\n    if (count === 0) return;\n    let next = index + step;\n    if (loop) next = (next + count) % count;\n    if (next < 0 || next >= count || next === index) return;\n    onIndexChange(next);\n  };\n\n  const onKeyDown = (e: KeyboardEvent<HTMLDivElement>) => {\n    // A key meant for a control stays with it: Space/Enter on a button, typing in any\n    // field a caller's caption might hold.\n    const target = e.target as HTMLElement;\n    if (target.closest(\"input, textarea, select, [contenteditable='true']\")) return;\n    const step = horizontalStep(e.key, e.currentTarget);\n    if (step !== 0) {\n      e.preventDefault();\n      go(step);\n    } else if (e.key === \"Home\") {\n      e.preventDefault();\n      if (index !== 0) onIndexChange(0);\n    } else if (e.key === \"End\") {\n      e.preventDefault();\n      if (index !== count - 1) onIndexChange(count - 1);\n    }\n  };\n\n  const touchStart = useRef<{ x: number; y: number } | null>(null);\n  const onTouchStart = (e: TouchEvent) => {\n    const t = e.touches[0];\n    touchStart.current = e.touches.length === 1 && t ? { x: t.clientX, y: t.clientY } : null;\n  };\n  const onTouchEnd = (e: TouchEvent) => {\n    const start = touchStart.current;\n    touchStart.current = null;\n    const t = e.changedTouches[0];\n    // Zoomed, a drag is a PAN of the picture, not a page turn.\n    if (!start || !t || zoomed) return;\n    const dx = t.clientX - start.x;\n    const dy = t.clientY - start.y;\n    if (Math.abs(dx) < SWIPE_MIN_PX || Math.abs(dx) < Math.abs(dy)) return;\n    // Swiping toward the START edge brings in the next picture from the end edge.\n    const towardStart = dir === \"rtl\" ? dx > 0 : dx < 0;\n    go(towardStart ? 1 : -1);\n  };\n\n  // Paging the viewer while zoomed would leave the new picture scrolled to where the\n  // last one was panned; start each at its top-left.\n  const bodyRef = useRef<HTMLDivElement>(null);\n  useEffect(() => {\n    bodyRef.current?.scrollTo?.({ top: 0, left: 0 });\n  }, [index]);\n\n  const downloadHref = fetched.src;\n  const downloadControl =\n    download && item ? (\n      onDownload ? (\n        <IconButton\n          size=\"sm\"\n          label={labels.download}\n          labelVisible={toolbarLabelVisible}\n          onClick={() => onDownload(item, index)}\n        >\n          <Download />\n        </IconButton>\n      ) : downloadHref ? (\n        <a\n          href={downloadHref}\n          // `download` names the saved file; a blob: URL has no name of its own.\n          download={item.fileName ?? \"\"}\n          className={buttonClasses(\"ghost\", { size: \"sm\" })}\n        >\n          <Download aria-hidden className=\"size-4\" />\n          <span className=\"max-sm:sr-only\">{labels.download}</span>\n        </a>\n      ) : null\n    ) : null;\n\n  const header = item ? (\n    <div className=\"flex min-w-0 items-center gap-2\">\n      <span aria-hidden className=\"shrink-0 text-sm tabular-nums text-secondary\">\n        {labels.counter(index + 1, count)}\n      </span>\n      {/* The page turn, said — focus does not move when the picture changes, so\n          without this a reader pressing → hears nothing at all. */}\n      <span role=\"status\" aria-live=\"polite\" className=\"sr-only\">\n        {`${labels.position(index + 1, count)}${item.alt ? `: ${item.alt}` : \"\"}`}\n      </span>\n      <span className=\"min-w-0 flex-1\" />\n      {zoomEnabled && kind === \"image\" && (\n        <IconButton\n          size=\"sm\"\n          label={labels.zoom}\n          labelVisible={toolbarLabelVisible}\n          pressed={zoomed}\n          onClick={toggleZoom}\n        >\n          <ZoomIn />\n        </IconButton>\n      )}\n      {downloadControl}\n    </div>\n  ) : null;\n\n  const slide = !item ? null : kind === \"file\" ? (\n    <div className=\"flex max-w-sm flex-col items-center gap-3 rounded-lg border border-subtle p-6 text-center\">\n      <FileText aria-hidden className=\"size-10 text-muted\" />\n      <p className=\"break-all font-medium text-primary\">{item.fileName ?? item.alt}</p>\n      <p className=\"text-sm text-muted\">{labels.noPreview}</p>\n      {fetched.src && (\n        <a\n          href={fetched.src}\n          target=\"_blank\"\n          rel=\"noreferrer noopener\"\n          className={buttonClasses(\"secondary\", { size: \"sm\" })}\n        >\n          <ExternalLink aria-hidden className=\"size-4\" />\n          {labels.openInNewTab}\n        </a>\n      )}\n    </div>\n  ) : (\n    <ImageStates\n      // Keyed by item: a new picture is a new decode, never the old one's \"loaded\".\n      key={itemKey ?? undefined}\n      fetched={fetched}\n      alt={item.alt}\n      labels={imageLabels}\n      wrapperClassName={zoomed ? \"max-w-none shrink-0\" : \"flex h-full w-full items-center justify-center\"}\n      className={cn(\n        zoomed ? \"max-w-none cursor-zoom-out\" : \"max-h-full max-w-full object-contain\",\n        !zoomed && zoomEnabled && \"cursor-zoom-in\",\n      )}\n      imgProps={{\n        draggable: false,\n        onDoubleClick: zoomEnabled ? toggleZoom : undefined,\n      }}\n    />\n  );\n\n  return (\n    <>\n      <span ref={anchorRef} hidden />\n      <FullBleedDialog\n        open={open && !!item}\n        onClose={onClose}\n        closeLabel={labels.close}\n        aria-label={labels.dialog}\n        dir={dir}\n        header={header}\n        backCloses={backCloses}\n        onKeyDown={onKeyDown}\n        data-lightbox=\"\"\n        footer={\n          item?.caption !== undefined && item.caption !== null && item.caption !== false ? (\n            <p className=\"me-auto min-w-0 text-sm text-secondary\">{item.caption}</p>\n          ) : undefined\n        }\n      >\n        <div\n          ref={bodyRef}\n          data-lightbox-stage=\"\"\n          data-zoomed={zoomed ? \"\" : undefined}\n          onTouchStart={onTouchStart}\n          onTouchEnd={onTouchEnd}\n          className={cn(\n            \"relative h-full min-h-48 w-full\",\n            zoomed ? \"overflow-auto\" : \"flex items-center justify-center overflow-hidden\",\n          )}\n        >\n          {slide}\n        </div>\n        {count > 1 && (\n          <>\n            <IconButton\n              variant=\"overlay\"\n              size=\"lg\"\n              label={labels.previous}\n              disabled={!canPrev}\n              onClick={() => go(-1)}\n              className=\"absolute start-3 top-1/2 -translate-y-1/2\"\n              tooltip={false}\n            >\n              <ChevronLeft className=\"rtl:-scale-x-100\" />\n            </IconButton>\n            <IconButton\n              variant=\"overlay\"\n              size=\"lg\"\n              label={labels.next}\n              disabled={!canNext}\n              onClick={() => go(1)}\n              className=\"absolute end-3 top-1/2 -translate-y-1/2\"\n              tooltip={false}\n            >\n              <ChevronRight className=\"rtl:-scale-x-100\" />\n            </IconButton>\n          </>\n        )}\n      </FullBleedDialog>\n    </>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/line-items.js

@@ -118,10 +118,7 @@ function LineItems({
   const headerCell = (column) => /* @__PURE__ */ jsx(
     "span",
     {
-      className: cn(
-        "min-w-0 truncate text-xs font-medium text-muted",
-        column.align === "end" && "text-end"
-      ),
+      className: cn("min-w-0 truncate text-xs font-medium text-muted", column.align === "end" && "text-end"),
       children: floats(column) ? null : column.header
     },
     column.key
@@ -291,38 +288,31 @@ function LineItems({
             ]
           }
         ),
-        summary && /* @__PURE__ */ jsxs(
-          "div",
-          {
-            "data-line-items-summary": "",
-            className: "flex flex-wrap items-center gap-x-3 gap-y-1 text-sm text-primary",
-            children: [
-              /* @__PURE__ */ jsx(
-                "span",
-                {
-                  "data-tone": summaryHasValue ? void 0 : summaryTone,
-                  className: cn("min-w-0", !summaryHasValue && SUMMARY_TONE[summaryTone]),
-                  children: summary.label
-                }
-              ),
-              summaryHasValue && /* @__PURE__ */ jsx("span", { "data-tone": summaryTone, className: cn("font-semibold tabular-nums", SUMMARY_TONE[summaryTone]), children: summary.value }),
-              hasContent(summary.status) && /* @__PURE__ */ jsx("span", { "data-line-items-summary-status": "", className: "inline-flex", children: summary.status }),
-              summary.action && /* @__PURE__ */ jsx(
-                Button,
-                {
-                  type: "button",
-                  variant: summary.action.variant === "link" ? "link" : "secondary",
-                  tone: summary.action.variant === "link" ? "muted" : void 0,
-                  size: "sm",
-                  className: "ms-auto",
-                  disabled: disabled || summary.action.disabled,
-                  onClick: summary.action.onClick,
-                  children: summary.action.label
-                }
-              )
-            ]
-          }
-        ),
+        summary && /* @__PURE__ */ jsxs("div", { "data-line-items-summary": "", className: "flex flex-wrap items-center gap-x-3 gap-y-1 text-sm text-primary", children: [
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              "data-tone": summaryHasValue ? void 0 : summaryTone,
+              className: cn("min-w-0", !summaryHasValue && SUMMARY_TONE[summaryTone]),
+              children: summary.label
+            }
+          ),
+          summaryHasValue && /* @__PURE__ */ jsx("span", { "data-tone": summaryTone, className: cn("font-semibold tabular-nums", SUMMARY_TONE[summaryTone]), children: summary.value }),
+          hasContent(summary.status) && /* @__PURE__ */ jsx("span", { "data-line-items-summary-status": "", className: "inline-flex", children: summary.status }),
+          summary.action && /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              variant: summary.action.variant === "link" ? "link" : "secondary",
+              tone: summary.action.variant === "link" ? "muted" : void 0,
+              size: "sm",
+              className: "ms-auto",
+              disabled: disabled || summary.action.disabled,
+              onClick: summary.action.onClick,
+              children: summary.action.label
+            }
+          )
+        ] }),
         hasError && /* @__PURE__ */ jsx("p", { className: "text-caption leading-tight text-danger", children: error }),
         onAdd && /* @__PURE__ */ jsxs(
           Button,

package/dist/components/line-items.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/line-items.tsx"],"sourcesContent":["import { useCallback, useLayoutEffect, useRef, useState } from \"react\";\nimport type { ComponentPropsWithRef, CSSProperties, HTMLAttributes, KeyboardEvent, Key, ReactNode } from \"react\";\nimport { Plus, Trash2 } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { hasContent } from \"../lib/presence\";\nimport { useKitLabels, type LabelOverride } from \"../i18n/kit-labels\";\nimport { Button } from \"./button\";\nimport { IconButton } from \"./icon-button\";\nimport { DEFAULT_LINE_ITEMS_LABELS } from \"./line-items-labels\";\n\n/** The words {@link LineItems} renders on its own behalf. Row numbers are 1-based. */\nexport interface LineItemsLabels {\n  /** The dashed add button. */\n  add: string;\n  /** The remove button's name for one row. */\n  remove: (row: number) => string;\n  /** Its name while it waits for the second press (`confirmRemove`). */\n  confirmRemove: (row: number) => string;\n  /** A row's group name, when the caller gives no `rowLabel`. */\n  row: (row: number) => string;\n  /** The name a cell's field should carry: the column, and which row. */\n  cell: (column: string, row: number) => string;\n  /** The totals row's label, and its group name. */\n  totals: string;\n}\n\n// Defined in ./line-items-labels, which holds no component code (0.34, KS U8).\nexport { DEFAULT_LINE_ITEMS_LABELS };\n\n/** What a column's `render` receives for one row. */\nexport interface LineItemCellContext<T> {\n  item: T;\n  /** 0-based. */\n  index: number;\n  /** The accessible name for the cell's field — \"Debit, row 2\". The header is\n   *  hidden from assistive tech (each row repeats it), so the field has to carry it:\n   *  `<Input aria-label={label} … />`. */\n  label: string;\n  /** The column's own name (\"Debit\") for the field's VISIBLE label — set only when the\n   *  cell's labels are `\"floating\"` (see {@link LineItemsProps.fieldLabels}), so one\n   *  render serves both modes: `<Input label={fieldLabel} aria-label={label} … />`.\n   *  Undefined there, the Input stays a bare compact control; set, it floats \"Debit\"\n   *  while `aria-label` still says which row. */\n  fieldLabel?: string;\n}\n\n/** How a cell's field is labelled. `aria`: the field is a bare control named by\n *  `aria-label`, under a header row (stacked: a small copy of the header over it).\n *  `floating`: the field shows its own floating label ({@link LineItemCellContext.fieldLabel}),\n *  so the list draws no header for it. */\nexport type LineItemsFieldLabels = \"aria\" | \"floating\";\n\n/** The colour of a {@link LineItemsSummary}'s value — a verdict (`success` /\n *  `danger`), quiet (`muted`), or the money pair (`income` / `expense`, the colours\n *  `SignedAmount` draws a figure in) for a remainder that reads as the row it settles. */\nexport type LineItemsSummaryTone = \"neutral\" | \"success\" | \"danger\" | \"muted\" | \"income\" | \"expense\";\n\n/**\n * A line under the lines that says where they stand — a split's remainder (\"Left to\n * assign  CHF 0.00\", green at zero, red otherwise, muted while the total is not known\n * yet), with an optional action that settles it (\"Set amount to total\").\n */\nexport interface LineItemsSummary {\n  label: ReactNode;\n  value?: ReactNode;\n  /** The value's colour. Default `neutral`. The label stays neutral: the colour is a\n   *  second signal, never the only one — the value and label carry the meaning.\n   *  With no `value` the line is a state on its own (\"Waiting for the total\"), and\n   *  the tone colours the label instead — `muted` quiets the whole line. */\n  tone?: LineItemsSummaryTone;\n  /** Beside the value: a chip or badge that names the state (\"Balanced\" next to a\n   *  journal entry's zero difference). */\n  status?: ReactNode;\n  /** A small button at the end of the line. Disabled along with the list's\n   *  `disabled`. `variant`: `secondary` (default) is a boxed button; `link` a muted\n   *  text link, for an action that is an aside rather than the way to settle it. */\n  action?: { label: ReactNode; onClick: () => void; disabled?: boolean; variant?: \"secondary\" | \"link\" };\n}\n\n/** Where a row's remove button sits. `row` (default): stacked, a row of the card to\n *  itself (paired, the whole width); wide, its own track. `inline`: stacked, beside\n *  the row's last field (\"category + amount\" over \"memo + delete\"); wide, unchanged. */\nexport type LineItemsRemovePlacement = \"row\" | \"inline\";\n\n/** How the remove button sits in the height of a wide row: at its top, centred, or at\n *  its foot. */\nexport type LineItemsRemoveAlign = \"start\" | \"center\" | \"end\";\n\nexport interface LineItemsColumn<T> {\n  /** Stable id: the React key, and the key into `totals`. */\n  key: string;\n  /** The column header (and the small label over the cell once the rows stack). */\n  header: ReactNode;\n  /** The column's name for {@link LineItemCellContext.label}, when `header` is not a\n   *  string. */\n  label?: string;\n  /** The grid track once the rows are wide enough to be a table. Default\n   *  `minmax(0,1fr)`; `\"7rem\"` for an amount. */\n  width?: string;\n  /** `end` for figures: the header and the totals cell end-align with the field. */\n  align?: \"start\" | \"end\";\n  /** This column's labelling, over the list's {@link LineItemsProps.fieldLabels} — a\n   *  read-only \"Sum\" cell in a floating list keeps its header with `\"aria\"`. */\n  fieldLabels?: LineItemsFieldLabels;\n  /** With {@link LineItemsProps.narrowColumns} `2`: `2` gives the cell a whole row of\n   *  the stacked card (a description), where short fields pair up two to a row.\n   *  Default `1`. No effect on the wide grid. */\n  narrowSpan?: 1 | 2;\n  render: (ctx: LineItemCellContext<T>) => ReactNode;\n}\n\n/**\n * What {@link LineItemsProps.rowProps} returns for one row: `data-*` hooks, an `id`, a\n * class, handlers. A `data-*` attribute is typed so `{ \"data-tour\": \"rule-condition\" }`\n * needs no cast.\n */\nexport type LineItemsRowProps = Omit<HTMLAttributes<HTMLDivElement>, \"children\" | \"dangerouslySetInnerHTML\" | \"role\"> & {\n  [key: `data-${string}`]: string | number | boolean | undefined;\n};\n\nexport interface LineItemsProps<T> extends Omit<ComponentPropsWithRef<\"div\">, \"children\"> {\n  items: readonly T[];\n  columns: readonly LineItemsColumn<T>[];\n  /** The row's React key. Default: the item's `id` (react-hook-form's `useFieldArray`\n   *  `fields` carry one), else its index. */\n  getKey?: (item: T, index: number) => Key;\n  /** Append a row. Omitted: no add button. The first field of the new row is focused. */\n  onAdd?: () => void;\n  /** Remove the row at `index`. Omitted: no remove buttons. */\n  onRemove?: (index: number) => void;\n  /** Remove is disabled at or below this many rows (a journal entry needs two).\n   *  Default 0. */\n  minItems?: number;\n  /** Add is disabled at this many rows. */\n  maxItems?: number;\n  /**\n   * Ask before a row goes:\n   *  - `true`: the remove button asks for a second press — it fills red and its name\n   *    becomes `lineItems.confirmRemove`; Escape, or leaving it, calls it off.\n   *  - a function: called with the row, and the row goes only if it answers `true`\n   *    (`(item, i) => confirm({ title: … , tone: \"danger\" })` with `useConfirm`).\n   */\n  confirmRemove?: boolean | ((item: T, index: number) => boolean | Promise<boolean>);\n  /** The add button's text. Default `lineItems.add`. */\n  addLabel?: ReactNode;\n  /** A row's group name (\"Line 2\"). Default `lineItems.row`. */\n  rowLabel?: (index: number, item: T) => string;\n  /** A totals row under the lines, one entry per column `key`. The first column\n   *  without an entry carries {@link totalsLabel}. Omitted: no totals row. */\n  totals?: Partial<Record<string, ReactNode>>;\n  /** Default `lineItems.totals`, \"Total\". */\n  totalsLabel?: ReactNode;\n  /** Shown in place of the rows when there are none. */\n  empty?: ReactNode;\n  /** A message about the list as a whole (\"The entry does not balance\"). */\n  error?: ReactNode;\n  /** A line under the lines and totals — the remainder of a split, say. See\n   *  {@link LineItemsSummary}. */\n  summary?: LineItemsSummary;\n  /** How the cells' fields are labelled. Default `aria` (compact bare controls under a\n   *  header row); `floating` hands each cell its column's name as\n   *  {@link LineItemCellContext.fieldLabel} for a visible floating label, and drops the\n   *  header for those columns. A column's own `fieldLabels` wins. */\n  fieldLabels?: LineItemsFieldLabels;\n  /** Stacked (a narrow pane), how many fields share a row of a line's card: `2` pairs\n   *  them up (a column's `narrowSpan={2}` takes a whole row), once the pane is wide\n   *  enough for two fields (18rem); narrower still, one. Default `1`. */\n  narrowColumns?: 1 | 2;\n  /** Stacked, where the remove button goes: a row of its own (`row`, default) or\n   *  beside the last field (`inline`). See {@link LineItemsRemovePlacement}. */\n  removePlacement?: LineItemsRemovePlacement;\n  /** On the wide grid, the remove button's place in the row's height. Default `start`\n   *  — or `center` when a column floats its label (`fieldLabels=\"floating\"`): a\n   *  floating field is taller than the button, and centred is level with its control.\n   *  A field that shows a message under itself grows the row; pin `start` then. */\n  removeAlign?: LineItemsRemoveAlign;\n  /** Disables add and remove (the fields are the caller's to disable). */\n  disabled?: boolean;\n  /**\n   * Extra attributes for one row's element (the `role=\"group\"` that holds its fields) —\n   * keksdose K20: its rule editor's tour points at the first condition row with\n   * `[data-tour=\"rule-condition\"]` (dev#495), and with nowhere to put the anchor on the\n   * row it wrapped a cell's field in a `span` instead, which the spotlight then drew\n   * around one field rather than the row. Test ids the same way.\n   *\n   * MERGED under the list's own, which win: `role`, the group's `aria-label` (that is\n   * {@link rowLabel}'s) and `data-line-items-row` stay the list's — the row's name and\n   * the hook its focus handling finds rows by. `className` is added after the row's\n   * own classes, `style` is passed through, and an `onKeyDown` runs BEFORE the row's\n   * Ctrl/⌘+Enter \"add a row\" (call `preventDefault()` to keep that from happening).\n   */\n  rowProps?: (item: T, index: number) => LineItemsRowProps | undefined;\n  labels?: LabelOverride<LineItemsLabels>;\n}\n\nconst REMOVE_TRACK = \"2.25rem\";\nconst SUMMARY_TONE: Record<LineItemsSummaryTone, string> = {\n  neutral: \"text-primary\",\n  success: \"text-success\",\n  danger: \"text-danger\",\n  muted: \"text-muted\",\n  // SignedAmount's money palette (toneTextClass \"income\" / \"expense\").\n  income: \"text-money-income\",\n  expense: \"text-money-expense\",\n};\nconst REMOVE_ALIGN: Record<LineItemsRemoveAlign, string> = {\n  start: \"@lg:self-start\",\n  center: \"@lg:self-center\",\n  end: \"@lg:self-end\",\n};\nconst FOCUSABLE =\n  \"input:not([disabled]):not([type=hidden]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), [tabindex]:not([tabindex='-1'])\";\n\nfunction defaultKey(item: unknown, index: number): Key {\n  if (typeof item === \"object\" && item !== null && \"id\" in item) {\n    const id = (item as { id: unknown }).id;\n    if (typeof id === \"string\" || typeof id === \"number\") return id;\n  }\n  return index;\n}\n\ntype PendingFocus = { kind: \"added\" } | { kind: \"removed\"; index: number };\n\n/**\n * An editable list of lines — journal entry lines, lease components, invoice\n * positions, budget rows: column headers, a row of fields per item, a remove button\n * per row, a dashed \"add\" button under them, and an optional totals row.\n *\n * Presentation only: the rows are the caller's `items` and the fields are the\n * caller's, rendered per column. So it works over plain state —\n *\n * ```tsx\n * <LineItems items={lines} columns={cols} onAdd={() => setLines([...lines, blank()])}\n *   onRemove={(i) => setLines(lines.filter((_, j) => j !== i))} minItems={2} />\n * ```\n *\n * — and over react-hook-form's `useFieldArray` alike (`items={fields}`, `onAdd={() =>\n * append(blank())}`, `onRemove={remove}`), for which `@eifi1/ui-kit/rhf` has\n * `RhfLineItems`.\n *\n * On a wide pane the rows are a grid under the headers; on a narrow one (a container\n * query, so a dialog stacks where it is cramped) each row stacks its fields, each\n * under a small copy of its header. The headers are `aria-hidden`: every row is a\n * named group and every field is named by `render`'s `label` (\"Debit, row 2\"), which\n * is what a screen reader needs — a header row it would read once, out of context.\n *\n * Keyboard: after Add, focus lands in the new row's first field; after a remove, on\n * the row that took its place (else the add button). Ctrl/⌘+Enter in any row adds a\n * row.\n */\nexport function LineItems<T>({\n  items,\n  columns,\n  getKey = defaultKey,\n  onAdd,\n  onRemove,\n  minItems = 0,\n  maxItems,\n  confirmRemove,\n  addLabel,\n  rowLabel,\n  totals,\n  totalsLabel,\n  empty,\n  error,\n  summary,\n  fieldLabels = \"aria\",\n  narrowColumns = 1,\n  removePlacement = \"row\",\n  removeAlign: removeAlignProp,\n  disabled = false,\n  rowProps,\n  labels: labelsProp,\n  className,\n  style,\n  ...rest\n}: LineItemsProps<T>) {\n  const labels = useKitLabels(\"lineItems\", DEFAULT_LINE_ITEMS_LABELS, labelsProp);\n  const rowRefs = useRef<Array<HTMLDivElement | null>>([]);\n  const addRef = useRef<HTMLButtonElement>(null);\n  const pendingFocus = useRef<PendingFocus | null>(null);\n  const [confirmingAt, setConfirming] = useState<number | null>(null);\n  // A confirm waiting on a row that has since gone is void.\n  const confirming = confirmingAt !== null && confirmingAt < items.length ? confirmingAt : null;\n\n  const tracks = [...columns.map((c) => c.width ?? \"minmax(0,1fr)\"), ...(onRemove ? [REMOVE_TRACK] : [])];\n  const gridStyle = { \"--line-items-cols\": tracks.join(\" \") } as CSSProperties;\n  const canAdd = Boolean(onAdd) && !disabled && (maxItems === undefined || items.length < maxItems);\n  const canRemove = Boolean(onRemove) && !disabled && items.length > minItems;\n  const hasError = hasContent(error);\n\n\n  // Focus after the list has re-rendered with the new rows — a layout effect, so the\n  // caret is where it belongs before paint.\n  useLayoutEffect(() => {\n    const pending = pendingFocus.current;\n    if (!pending) return;\n    pendingFocus.current = null;\n    if (pending.kind === \"added\") {\n      const row = rowRefs.current[items.length - 1];\n      row?.querySelector<HTMLElement>(FOCUSABLE)?.focus();\n      return;\n    }\n    const row = rowRefs.current[Math.min(pending.index, items.length - 1)];\n    const target =\n      row?.querySelector<HTMLElement>(\"[data-line-items-remove]:not([disabled])\") ??\n      row?.querySelector<HTMLElement>(FOCUSABLE) ??\n      addRef.current;\n    target?.focus();\n  }, [items.length]);\n\n  const add = useCallback(() => {\n    if (!canAdd || !onAdd) return;\n    pendingFocus.current = { kind: \"added\" };\n    onAdd();\n  }, [canAdd, onAdd]);\n\n  const removeAt = async (index: number) => {\n    if (!canRemove || !onRemove) return;\n    if (confirmRemove === true && confirming !== index) {\n      setConfirming(index);\n      return;\n    }\n    if (typeof confirmRemove === \"function\") {\n      const ok = await confirmRemove(items[index], index);\n      if (!ok) return;\n    }\n    setConfirming(null);\n    pendingFocus.current = { kind: \"removed\", index };\n    onRemove(index);\n  };\n\n  const onRowKeyDown = (e: KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === \"Enter\" && (e.ctrlKey || e.metaKey) && canAdd) {\n      e.preventDefault();\n      add();\n    }\n  };\n\n  const columnName = (column: LineItemsColumn<T>) =>\n    column.label ?? (typeof column.header === \"string\" ? column.header : column.key);\n  const floats = (column: LineItemsColumn<T>) => (column.fieldLabels ?? fieldLabels) === \"floating\";\n  // A header row only for the columns that still need one: with every field floating\n  // its own label, a row of headers would say each name twice.\n  const showHeader = columns.some((c) => !floats(c));\n  const pairs = narrowColumns === 2;\n  const removeAlign = removeAlignProp ?? (columns.some(floats) ? \"center\" : \"start\");\n  const inline = removePlacement === \"inline\" && Boolean(onRemove) && columns.length > 0;\n  const lastColumn = columns[columns.length - 1];\n\n  const headerCell = (column: LineItemsColumn<T>) => (\n    <span\n      key={column.key}\n      className={cn(\n        \"min-w-0 truncate text-xs font-medium text-muted\",\n        column.align === \"end\" && \"text-end\",\n      )}\n    >\n      {floats(column) ? null : column.header}\n    </span>\n  );\n\n  const removeCell = (index: number, row: number, isConfirming: boolean) => (\n    <div\n      data-line-items-remove-cell=\"\"\n      className={cn(\n        \"flex justify-end @lg:justify-center\",\n        REMOVE_ALIGN[removeAlign],\n        // Paired, the remove button keeps a row of its own at the card's end rather\n        // than squeezing in beside the last field — unless asked to go `inline`.\n        inline ? \"shrink-0\" : pairs && \"@2xs:col-span-2 @lg:col-span-1\",\n      )}\n    >\n      <IconButton\n        type=\"button\"\n        data-line-items-remove=\"\"\n        variant={isConfirming ? \"danger\" : \"ghost\"}\n        tone={isConfirming ? undefined : \"danger\"}\n        label={isConfirming ? labels.confirmRemove(row) : labels.remove(row)}\n        // The icon alone at every text size (docs/text-size-harmonization.md §10.8): the\n        // row's one control, in a grid column sized for an icon, whose name becomes a\n        // sentence while it waits (\"Remove row 3? Press again to confirm\") — as text at\n        // Large it would push the row's fields aside and change width between the two\n        // presses. The name stays the accessible name; the red fill says \"confirm\".\n        labelVisible={false}\n        disabled={!canRemove}\n        onClick={() => void removeAt(index)}\n        onBlur={() => {\n          if (isConfirming) setConfirming(null);\n        }}\n        onKeyDown={(e) => {\n          if (e.key === \"Escape\" && isConfirming) {\n            e.stopPropagation();\n            setConfirming(null);\n          }\n        }}\n      >\n        <Trash2 />\n      </IconButton>\n    </div>\n  );\n\n  const showTotals = totals !== undefined;\n  const summaryTone = summary?.tone ?? \"neutral\";\n  const summaryHasValue = hasContent(summary?.value);\n  const labelColumn = showTotals ? columns.find((c) => !hasContent(totals[c.key]))?.key : undefined;\n\n  return (\n    <div\n      data-slot=\"line-items\"\n      {...rest}\n      style={{ ...gridStyle, ...style }}\n      className={cn(\"@container space-y-2\", className)}\n    >\n      {showHeader && (\n        <div aria-hidden className=\"hidden gap-2 @lg:grid @lg:grid-cols-[var(--line-items-cols)]\">\n          {columns.map(headerCell)}\n          {onRemove && <span />}\n        </div>\n      )}\n\n      {items.length === 0 && hasContent(empty) && (\n        <div className=\"rounded-md border border-dashed border-subtle px-3 py-4 text-center text-sm text-muted\">\n          {empty}\n        </div>\n      )}\n\n      {items.map((item, index) => {\n        const row = index + 1;\n        const isConfirming = confirming === index;\n        const extra = rowProps?.(item, index);\n        return (\n          // The row's Ctrl/⌘+Enter is a shortcut for the add button, which is itself\n          // reachable by Tab; the group only listens for it bubbling from its fields.\n          // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n          <div\n            {...extra}\n            key={getKey(item, index)}\n            ref={(el) => {\n              rowRefs.current[index] = el;\n            }}\n            role=\"group\"\n            aria-label={rowLabel ? rowLabel(index, item) : labels.row(row)}\n            data-line-items-row=\"\"\n            onKeyDown={(e) => {\n              if (extra?.onKeyDown) {\n                extra.onKeyDown(e);\n                if (e.defaultPrevented) return;\n              }\n              onRowKeyDown(e);\n            }}\n            className={cn(\n              \"grid grid-cols-1 gap-2 @lg:grid-cols-[var(--line-items-cols)] @lg:items-start\",\n              // Two short fields to a row of the card — from 18rem, where two fields\n              // still fit a figure each; on anything narrower they stack after all.\n              pairs && \"@2xs:grid-cols-2\",\n              // Stacked, each row is a card of its own so the rows stay apart.\n              \"@max-lg:rounded-md @max-lg:border @max-lg:border-subtle @max-lg:p-3\",\n              extra?.className,\n            )}\n          >\n            {columns.map((column) => {\n              const floating = floats(column);\n              const isLast = inline && column === lastColumn;\n              const span = pairs && column.narrowSpan === 2 && \"@2xs:col-span-2 @lg:col-span-1\";\n              const cell = (\n                <div\n                  key={column.key}\n                  className={cn(\n                    \"min-w-0 space-y-1 @lg:space-y-0\",\n                    // The wide grid places every cell in its own track again.\n                    isLast ? \"flex-1\" : span,\n                  )}\n                >\n                  {!floating && (\n                    <span aria-hidden className=\"block text-xs font-medium text-muted @lg:hidden\">\n                      {column.header}\n                    </span>\n                  )}\n                  {column.render({\n                    item,\n                    index,\n                    label: labels.cell(columnName(column), row),\n                    fieldLabel: floating ? columnName(column) : undefined,\n                  })}\n                </div>\n              );\n              if (!isLast) return cell;\n              // Inline, the last field and the remove button share one cell of the\n              // card; on the wide grid the wrapper dissolves (`contents`) and each is a\n              // track of its own again. Level with the field's control: its foot under\n              // a header copy, its middle when it floats its own label.\n              return (\n                <div\n                  key={column.key}\n                  data-line-items-inline=\"\"\n                  className={cn(\"flex min-w-0 gap-2 @lg:contents\", floating ? \"items-center\" : \"items-end\", span)}\n                >\n                  {cell}\n                  {removeCell(index, row, isConfirming)}\n                </div>\n              );\n            })}\n            {onRemove && !inline && removeCell(index, row, isConfirming)}\n          </div>\n        );\n      })}\n\n      {showTotals && (\n        <div\n          role=\"group\"\n          aria-label={typeof totalsLabel === \"string\" ? totalsLabel : labels.totals}\n          data-line-items-totals=\"\"\n          className=\"grid grid-cols-1 gap-2 border-t border-subtle pt-2 text-sm font-semibold tabular-nums text-primary @lg:grid-cols-[var(--line-items-cols)]\"\n        >\n          {columns.map((column) => {\n            const value = totals[column.key];\n            if (column.key === labelColumn) {\n              return (\n                <span key={column.key} className=\"min-w-0\">\n                  {totalsLabel ?? labels.totals}\n                </span>\n              );\n            }\n            return (\n              <span\n                key={column.key}\n                className={cn(\n                  \"min-w-0\",\n                  column.align === \"end\" && \"@lg:text-end\",\n                  // Stacked, a column with no total takes no line.\n                  !hasContent(value) && \"@max-lg:hidden\",\n                )}\n              >\n                {hasContent(value) && (\n                  <span className=\"flex justify-between gap-2 @lg:block\">\n                    <span aria-hidden className=\"font-normal text-muted @lg:hidden\">\n                      {column.header}\n                    </span>\n                    {value}\n                  </span>\n                )}\n              </span>\n            );\n          })}\n          {onRemove && <span className=\"@max-lg:hidden\" />}\n        </div>\n      )}\n\n      {summary && (\n        <div\n          data-line-items-summary=\"\"\n          className=\"flex flex-wrap items-center gap-x-3 gap-y-1 text-sm text-primary\"\n        >\n          {/* With no value the line is a state of its own, and the label takes the\n              tone — the only place left to carry it. */}\n          <span\n            data-tone={summaryHasValue ? undefined : summaryTone}\n            className={cn(\"min-w-0\", !summaryHasValue && SUMMARY_TONE[summaryTone])}\n          >\n            {summary.label}\n          </span>\n          {summaryHasValue && (\n            <span data-tone={summaryTone} className={cn(\"font-semibold tabular-nums\", SUMMARY_TONE[summaryTone])}>\n              {summary.value}\n            </span>\n          )}\n          {hasContent(summary.status) && (\n            <span data-line-items-summary-status=\"\" className=\"inline-flex\">\n              {summary.status}\n            </span>\n          )}\n          {summary.action && (\n            <Button\n              type=\"button\"\n              variant={summary.action.variant === \"link\" ? \"link\" : \"secondary\"}\n              tone={summary.action.variant === \"link\" ? \"muted\" : undefined}\n              size=\"sm\"\n              className=\"ms-auto\"\n              disabled={disabled || summary.action.disabled}\n              onClick={summary.action.onClick}\n            >\n              {summary.action.label}\n            </Button>\n          )}\n        </div>\n      )}\n\n      {hasError && (\n        <p className=\"text-caption leading-tight text-danger\">\n          {error}\n        </p>\n      )}\n\n      {onAdd && (\n        <Button\n          ref={addRef}\n          type=\"button\"\n          variant=\"secondary\"\n          className=\"w-full border-dashed\"\n          disabled={!canAdd}\n          onClick={add}\n        >\n          <Plus aria-hidden className=\"size-4\" />\n          {addLabel ?? labels.add}\n        </Button>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":["row"]}
+{"version":3,"sources":["../../src/components/line-items.tsx"],"sourcesContent":["import { useCallback, useLayoutEffect, useRef, useState } from \"react\";\nimport type { ComponentPropsWithRef, CSSProperties, HTMLAttributes, KeyboardEvent, Key, ReactNode } from \"react\";\nimport { Plus, Trash2 } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { hasContent } from \"../lib/presence\";\nimport { useKitLabels, type LabelOverride } from \"../i18n/kit-labels\";\nimport { Button } from \"./button\";\nimport { IconButton } from \"./icon-button\";\nimport { DEFAULT_LINE_ITEMS_LABELS } from \"./line-items-labels\";\n\n/** The words {@link LineItems} renders on its own behalf. Row numbers are 1-based. */\nexport interface LineItemsLabels {\n  /** The dashed add button. */\n  add: string;\n  /** The remove button's name for one row. */\n  remove: (row: number) => string;\n  /** Its name while it waits for the second press (`confirmRemove`). */\n  confirmRemove: (row: number) => string;\n  /** A row's group name, when the caller gives no `rowLabel`. */\n  row: (row: number) => string;\n  /** The name a cell's field should carry: the column, and which row. */\n  cell: (column: string, row: number) => string;\n  /** The totals row's label, and its group name. */\n  totals: string;\n}\n\n// Defined in ./line-items-labels, which holds no component code (0.34, KS U8).\nexport { DEFAULT_LINE_ITEMS_LABELS };\n\n/** What a column's `render` receives for one row. */\nexport interface LineItemCellContext<T> {\n  item: T;\n  /** 0-based. */\n  index: number;\n  /** The accessible name for the cell's field — \"Debit, row 2\". The header is\n   *  hidden from assistive tech (each row repeats it), so the field has to carry it:\n   *  `<Input aria-label={label} … />`. */\n  label: string;\n  /** The column's own name (\"Debit\") for the field's VISIBLE label — set only when the\n   *  cell's labels are `\"floating\"` (see {@link LineItemsProps.fieldLabels}), so one\n   *  render serves both modes: `<Input label={fieldLabel} aria-label={label} … />`.\n   *  Undefined there, the Input stays a bare compact control; set, it floats \"Debit\"\n   *  while `aria-label` still says which row. */\n  fieldLabel?: string;\n}\n\n/** How a cell's field is labelled. `aria`: the field is a bare control named by\n *  `aria-label`, under a header row (stacked: a small copy of the header over it).\n *  `floating`: the field shows its own floating label ({@link LineItemCellContext.fieldLabel}),\n *  so the list draws no header for it. */\nexport type LineItemsFieldLabels = \"aria\" | \"floating\";\n\n/** The colour of a {@link LineItemsSummary}'s value — a verdict (`success` /\n *  `danger`), quiet (`muted`), or the money pair (`income` / `expense`, the colours\n *  `SignedAmount` draws a figure in) for a remainder that reads as the row it settles. */\nexport type LineItemsSummaryTone = \"neutral\" | \"success\" | \"danger\" | \"muted\" | \"income\" | \"expense\";\n\n/**\n * A line under the lines that says where they stand — a split's remainder (\"Left to\n * assign  CHF 0.00\", green at zero, red otherwise, muted while the total is not known\n * yet), with an optional action that settles it (\"Set amount to total\").\n */\nexport interface LineItemsSummary {\n  label: ReactNode;\n  value?: ReactNode;\n  /** The value's colour. Default `neutral`. The label stays neutral: the colour is a\n   *  second signal, never the only one — the value and label carry the meaning.\n   *  With no `value` the line is a state on its own (\"Waiting for the total\"), and\n   *  the tone colours the label instead — `muted` quiets the whole line. */\n  tone?: LineItemsSummaryTone;\n  /** Beside the value: a chip or badge that names the state (\"Balanced\" next to a\n   *  journal entry's zero difference). */\n  status?: ReactNode;\n  /** A small button at the end of the line. Disabled along with the list's\n   *  `disabled`. `variant`: `secondary` (default) is a boxed button; `link` a muted\n   *  text link, for an action that is an aside rather than the way to settle it. */\n  action?: { label: ReactNode; onClick: () => void; disabled?: boolean; variant?: \"secondary\" | \"link\" };\n}\n\n/** Where a row's remove button sits. `row` (default): stacked, a row of the card to\n *  itself (paired, the whole width); wide, its own track. `inline`: stacked, beside\n *  the row's last field (\"category + amount\" over \"memo + delete\"); wide, unchanged. */\nexport type LineItemsRemovePlacement = \"row\" | \"inline\";\n\n/** How the remove button sits in the height of a wide row: at its top, centred, or at\n *  its foot. */\nexport type LineItemsRemoveAlign = \"start\" | \"center\" | \"end\";\n\nexport interface LineItemsColumn<T> {\n  /** Stable id: the React key, and the key into `totals`. */\n  key: string;\n  /** The column header (and the small label over the cell once the rows stack). */\n  header: ReactNode;\n  /** The column's name for {@link LineItemCellContext.label}, when `header` is not a\n   *  string. */\n  label?: string;\n  /** The grid track once the rows are wide enough to be a table. Default\n   *  `minmax(0,1fr)`; `\"7rem\"` for an amount. */\n  width?: string;\n  /** `end` for figures: the header and the totals cell end-align with the field. */\n  align?: \"start\" | \"end\";\n  /** This column's labelling, over the list's {@link LineItemsProps.fieldLabels} — a\n   *  read-only \"Sum\" cell in a floating list keeps its header with `\"aria\"`. */\n  fieldLabels?: LineItemsFieldLabels;\n  /** With {@link LineItemsProps.narrowColumns} `2`: `2` gives the cell a whole row of\n   *  the stacked card (a description), where short fields pair up two to a row.\n   *  Default `1`. No effect on the wide grid. */\n  narrowSpan?: 1 | 2;\n  render: (ctx: LineItemCellContext<T>) => ReactNode;\n}\n\n/**\n * What {@link LineItemsProps.rowProps} returns for one row: `data-*` hooks, an `id`, a\n * class, handlers. A `data-*` attribute is typed so `{ \"data-tour\": \"rule-condition\" }`\n * needs no cast.\n */\nexport type LineItemsRowProps = Omit<\n  HTMLAttributes<HTMLDivElement>,\n  \"children\" | \"dangerouslySetInnerHTML\" | \"role\"\n> & {\n  [key: `data-${string}`]: string | number | boolean | undefined;\n};\n\nexport interface LineItemsProps<T> extends Omit<ComponentPropsWithRef<\"div\">, \"children\"> {\n  items: readonly T[];\n  columns: readonly LineItemsColumn<T>[];\n  /** The row's React key. Default: the item's `id` (react-hook-form's `useFieldArray`\n   *  `fields` carry one), else its index. */\n  getKey?: (item: T, index: number) => Key;\n  /** Append a row. Omitted: no add button. The first field of the new row is focused. */\n  onAdd?: () => void;\n  /** Remove the row at `index`. Omitted: no remove buttons. */\n  onRemove?: (index: number) => void;\n  /** Remove is disabled at or below this many rows (a journal entry needs two).\n   *  Default 0. */\n  minItems?: number;\n  /** Add is disabled at this many rows. */\n  maxItems?: number;\n  /**\n   * Ask before a row goes:\n   *  - `true`: the remove button asks for a second press — it fills red and its name\n   *    becomes `lineItems.confirmRemove`; Escape, or leaving it, calls it off.\n   *  - a function: called with the row, and the row goes only if it answers `true`\n   *    (`(item, i) => confirm({ title: … , tone: \"danger\" })` with `useConfirm`).\n   */\n  confirmRemove?: boolean | ((item: T, index: number) => boolean | Promise<boolean>);\n  /** The add button's text. Default `lineItems.add`. */\n  addLabel?: ReactNode;\n  /** A row's group name (\"Line 2\"). Default `lineItems.row`. */\n  rowLabel?: (index: number, item: T) => string;\n  /** A totals row under the lines, one entry per column `key`. The first column\n   *  without an entry carries {@link totalsLabel}. Omitted: no totals row. */\n  totals?: Partial<Record<string, ReactNode>>;\n  /** Default `lineItems.totals`, \"Total\". */\n  totalsLabel?: ReactNode;\n  /** Shown in place of the rows when there are none. */\n  empty?: ReactNode;\n  /** A message about the list as a whole (\"The entry does not balance\"). */\n  error?: ReactNode;\n  /** A line under the lines and totals — the remainder of a split, say. See\n   *  {@link LineItemsSummary}. */\n  summary?: LineItemsSummary;\n  /** How the cells' fields are labelled. Default `aria` (compact bare controls under a\n   *  header row); `floating` hands each cell its column's name as\n   *  {@link LineItemCellContext.fieldLabel} for a visible floating label, and drops the\n   *  header for those columns. A column's own `fieldLabels` wins. */\n  fieldLabels?: LineItemsFieldLabels;\n  /** Stacked (a narrow pane), how many fields share a row of a line's card: `2` pairs\n   *  them up (a column's `narrowSpan={2}` takes a whole row), once the pane is wide\n   *  enough for two fields (18rem); narrower still, one. Default `1`. */\n  narrowColumns?: 1 | 2;\n  /** Stacked, where the remove button goes: a row of its own (`row`, default) or\n   *  beside the last field (`inline`). See {@link LineItemsRemovePlacement}. */\n  removePlacement?: LineItemsRemovePlacement;\n  /** On the wide grid, the remove button's place in the row's height. Default `start`\n   *  — or `center` when a column floats its label (`fieldLabels=\"floating\"`): a\n   *  floating field is taller than the button, and centred is level with its control.\n   *  A field that shows a message under itself grows the row; pin `start` then. */\n  removeAlign?: LineItemsRemoveAlign;\n  /** Disables add and remove (the fields are the caller's to disable). */\n  disabled?: boolean;\n  /**\n   * Extra attributes for one row's element (the `role=\"group\"` that holds its fields) —\n   * keksdose K20: its rule editor's tour points at the first condition row with\n   * `[data-tour=\"rule-condition\"]` (dev#495), and with nowhere to put the anchor on the\n   * row it wrapped a cell's field in a `span` instead, which the spotlight then drew\n   * around one field rather than the row. Test ids the same way.\n   *\n   * MERGED under the list's own, which win: `role`, the group's `aria-label` (that is\n   * {@link rowLabel}'s) and `data-line-items-row` stay the list's — the row's name and\n   * the hook its focus handling finds rows by. `className` is added after the row's\n   * own classes, `style` is passed through, and an `onKeyDown` runs BEFORE the row's\n   * Ctrl/⌘+Enter \"add a row\" (call `preventDefault()` to keep that from happening).\n   */\n  rowProps?: (item: T, index: number) => LineItemsRowProps | undefined;\n  labels?: LabelOverride<LineItemsLabels>;\n}\n\nconst REMOVE_TRACK = \"2.25rem\";\nconst SUMMARY_TONE: Record<LineItemsSummaryTone, string> = {\n  neutral: \"text-primary\",\n  success: \"text-success\",\n  danger: \"text-danger\",\n  muted: \"text-muted\",\n  // SignedAmount's money palette (toneTextClass \"income\" / \"expense\").\n  income: \"text-money-income\",\n  expense: \"text-money-expense\",\n};\nconst REMOVE_ALIGN: Record<LineItemsRemoveAlign, string> = {\n  start: \"@lg:self-start\",\n  center: \"@lg:self-center\",\n  end: \"@lg:self-end\",\n};\nconst FOCUSABLE =\n  \"input:not([disabled]):not([type=hidden]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), [tabindex]:not([tabindex='-1'])\";\n\nfunction defaultKey(item: unknown, index: number): Key {\n  if (typeof item === \"object\" && item !== null && \"id\" in item) {\n    const id = (item as { id: unknown }).id;\n    if (typeof id === \"string\" || typeof id === \"number\") return id;\n  }\n  return index;\n}\n\ntype PendingFocus = { kind: \"added\" } | { kind: \"removed\"; index: number };\n\n/**\n * An editable list of lines — journal entry lines, lease components, invoice\n * positions, budget rows: column headers, a row of fields per item, a remove button\n * per row, a dashed \"add\" button under them, and an optional totals row.\n *\n * Presentation only: the rows are the caller's `items` and the fields are the\n * caller's, rendered per column. So it works over plain state —\n *\n * ```tsx\n * <LineItems items={lines} columns={cols} onAdd={() => setLines([...lines, blank()])}\n *   onRemove={(i) => setLines(lines.filter((_, j) => j !== i))} minItems={2} />\n * ```\n *\n * — and over react-hook-form's `useFieldArray` alike (`items={fields}`, `onAdd={() =>\n * append(blank())}`, `onRemove={remove}`), for which `@eifi1/ui-kit/rhf` has\n * `RhfLineItems`.\n *\n * On a wide pane the rows are a grid under the headers; on a narrow one (a container\n * query, so a dialog stacks where it is cramped) each row stacks its fields, each\n * under a small copy of its header. The headers are `aria-hidden`: every row is a\n * named group and every field is named by `render`'s `label` (\"Debit, row 2\"), which\n * is what a screen reader needs — a header row it would read once, out of context.\n *\n * Keyboard: after Add, focus lands in the new row's first field; after a remove, on\n * the row that took its place (else the add button). Ctrl/⌘+Enter in any row adds a\n * row.\n */\nexport function LineItems<T>({\n  items,\n  columns,\n  getKey = defaultKey,\n  onAdd,\n  onRemove,\n  minItems = 0,\n  maxItems,\n  confirmRemove,\n  addLabel,\n  rowLabel,\n  totals,\n  totalsLabel,\n  empty,\n  error,\n  summary,\n  fieldLabels = \"aria\",\n  narrowColumns = 1,\n  removePlacement = \"row\",\n  removeAlign: removeAlignProp,\n  disabled = false,\n  rowProps,\n  labels: labelsProp,\n  className,\n  style,\n  ...rest\n}: LineItemsProps<T>) {\n  const labels = useKitLabels(\"lineItems\", DEFAULT_LINE_ITEMS_LABELS, labelsProp);\n  const rowRefs = useRef<Array<HTMLDivElement | null>>([]);\n  const addRef = useRef<HTMLButtonElement>(null);\n  const pendingFocus = useRef<PendingFocus | null>(null);\n  const [confirmingAt, setConfirming] = useState<number | null>(null);\n  // A confirm waiting on a row that has since gone is void.\n  const confirming = confirmingAt !== null && confirmingAt < items.length ? confirmingAt : null;\n\n  const tracks = [...columns.map((c) => c.width ?? \"minmax(0,1fr)\"), ...(onRemove ? [REMOVE_TRACK] : [])];\n  const gridStyle = { \"--line-items-cols\": tracks.join(\" \") } as CSSProperties;\n  const canAdd = Boolean(onAdd) && !disabled && (maxItems === undefined || items.length < maxItems);\n  const canRemove = Boolean(onRemove) && !disabled && items.length > minItems;\n  const hasError = hasContent(error);\n\n  // Focus after the list has re-rendered with the new rows — a layout effect, so the\n  // caret is where it belongs before paint.\n  useLayoutEffect(() => {\n    const pending = pendingFocus.current;\n    if (!pending) return;\n    pendingFocus.current = null;\n    if (pending.kind === \"added\") {\n      const row = rowRefs.current[items.length - 1];\n      row?.querySelector<HTMLElement>(FOCUSABLE)?.focus();\n      return;\n    }\n    const row = rowRefs.current[Math.min(pending.index, items.length - 1)];\n    const target =\n      row?.querySelector<HTMLElement>(\"[data-line-items-remove]:not([disabled])\") ??\n      row?.querySelector<HTMLElement>(FOCUSABLE) ??\n      addRef.current;\n    target?.focus();\n  }, [items.length]);\n\n  const add = useCallback(() => {\n    if (!canAdd || !onAdd) return;\n    pendingFocus.current = { kind: \"added\" };\n    onAdd();\n  }, [canAdd, onAdd]);\n\n  const removeAt = async (index: number) => {\n    if (!canRemove || !onRemove) return;\n    if (confirmRemove === true && confirming !== index) {\n      setConfirming(index);\n      return;\n    }\n    if (typeof confirmRemove === \"function\") {\n      const ok = await confirmRemove(items[index], index);\n      if (!ok) return;\n    }\n    setConfirming(null);\n    pendingFocus.current = { kind: \"removed\", index };\n    onRemove(index);\n  };\n\n  const onRowKeyDown = (e: KeyboardEvent<HTMLDivElement>) => {\n    if (e.key === \"Enter\" && (e.ctrlKey || e.metaKey) && canAdd) {\n      e.preventDefault();\n      add();\n    }\n  };\n\n  const columnName = (column: LineItemsColumn<T>) =>\n    column.label ?? (typeof column.header === \"string\" ? column.header : column.key);\n  const floats = (column: LineItemsColumn<T>) => (column.fieldLabels ?? fieldLabels) === \"floating\";\n  // A header row only for the columns that still need one: with every field floating\n  // its own label, a row of headers would say each name twice.\n  const showHeader = columns.some((c) => !floats(c));\n  const pairs = narrowColumns === 2;\n  const removeAlign = removeAlignProp ?? (columns.some(floats) ? \"center\" : \"start\");\n  const inline = removePlacement === \"inline\" && Boolean(onRemove) && columns.length > 0;\n  const lastColumn = columns[columns.length - 1];\n\n  const headerCell = (column: LineItemsColumn<T>) => (\n    <span\n      key={column.key}\n      className={cn(\"min-w-0 truncate text-xs font-medium text-muted\", column.align === \"end\" && \"text-end\")}\n    >\n      {floats(column) ? null : column.header}\n    </span>\n  );\n\n  const removeCell = (index: number, row: number, isConfirming: boolean) => (\n    <div\n      data-line-items-remove-cell=\"\"\n      className={cn(\n        \"flex justify-end @lg:justify-center\",\n        REMOVE_ALIGN[removeAlign],\n        // Paired, the remove button keeps a row of its own at the card's end rather\n        // than squeezing in beside the last field — unless asked to go `inline`.\n        inline ? \"shrink-0\" : pairs && \"@2xs:col-span-2 @lg:col-span-1\",\n      )}\n    >\n      <IconButton\n        type=\"button\"\n        data-line-items-remove=\"\"\n        variant={isConfirming ? \"danger\" : \"ghost\"}\n        tone={isConfirming ? undefined : \"danger\"}\n        label={isConfirming ? labels.confirmRemove(row) : labels.remove(row)}\n        // The icon alone at every text size (docs/text-size-harmonization.md §10.8): the\n        // row's one control, in a grid column sized for an icon, whose name becomes a\n        // sentence while it waits (\"Remove row 3? Press again to confirm\") — as text at\n        // Large it would push the row's fields aside and change width between the two\n        // presses. The name stays the accessible name; the red fill says \"confirm\".\n        labelVisible={false}\n        disabled={!canRemove}\n        onClick={() => void removeAt(index)}\n        onBlur={() => {\n          if (isConfirming) setConfirming(null);\n        }}\n        onKeyDown={(e) => {\n          if (e.key === \"Escape\" && isConfirming) {\n            e.stopPropagation();\n            setConfirming(null);\n          }\n        }}\n      >\n        <Trash2 />\n      </IconButton>\n    </div>\n  );\n\n  const showTotals = totals !== undefined;\n  const summaryTone = summary?.tone ?? \"neutral\";\n  const summaryHasValue = hasContent(summary?.value);\n  const labelColumn = showTotals ? columns.find((c) => !hasContent(totals[c.key]))?.key : undefined;\n\n  return (\n    <div\n      data-slot=\"line-items\"\n      {...rest}\n      style={{ ...gridStyle, ...style }}\n      className={cn(\"@container space-y-2\", className)}\n    >\n      {showHeader && (\n        <div aria-hidden className=\"hidden gap-2 @lg:grid @lg:grid-cols-[var(--line-items-cols)]\">\n          {columns.map(headerCell)}\n          {onRemove && <span />}\n        </div>\n      )}\n\n      {items.length === 0 && hasContent(empty) && (\n        <div className=\"rounded-md border border-dashed border-subtle px-3 py-4 text-center text-sm text-muted\">\n          {empty}\n        </div>\n      )}\n\n      {items.map((item, index) => {\n        const row = index + 1;\n        const isConfirming = confirming === index;\n        const extra = rowProps?.(item, index);\n        return (\n          // The row's Ctrl/⌘+Enter is a shortcut for the add button, which is itself\n          // reachable by Tab; the group only listens for it bubbling from its fields.\n          // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions\n          <div\n            {...extra}\n            key={getKey(item, index)}\n            ref={(el) => {\n              rowRefs.current[index] = el;\n            }}\n            role=\"group\"\n            aria-label={rowLabel ? rowLabel(index, item) : labels.row(row)}\n            data-line-items-row=\"\"\n            onKeyDown={(e) => {\n              if (extra?.onKeyDown) {\n                extra.onKeyDown(e);\n                if (e.defaultPrevented) return;\n              }\n              onRowKeyDown(e);\n            }}\n            className={cn(\n              \"grid grid-cols-1 gap-2 @lg:grid-cols-[var(--line-items-cols)] @lg:items-start\",\n              // Two short fields to a row of the card — from 18rem, where two fields\n              // still fit a figure each; on anything narrower they stack after all.\n              pairs && \"@2xs:grid-cols-2\",\n              // Stacked, each row is a card of its own so the rows stay apart.\n              \"@max-lg:rounded-md @max-lg:border @max-lg:border-subtle @max-lg:p-3\",\n              extra?.className,\n            )}\n          >\n            {columns.map((column) => {\n              const floating = floats(column);\n              const isLast = inline && column === lastColumn;\n              const span = pairs && column.narrowSpan === 2 && \"@2xs:col-span-2 @lg:col-span-1\";\n              const cell = (\n                <div\n                  key={column.key}\n                  className={cn(\n                    \"min-w-0 space-y-1 @lg:space-y-0\",\n                    // The wide grid places every cell in its own track again.\n                    isLast ? \"flex-1\" : span,\n                  )}\n                >\n                  {!floating && (\n                    <span aria-hidden className=\"block text-xs font-medium text-muted @lg:hidden\">\n                      {column.header}\n                    </span>\n                  )}\n                  {column.render({\n                    item,\n                    index,\n                    label: labels.cell(columnName(column), row),\n                    fieldLabel: floating ? columnName(column) : undefined,\n                  })}\n                </div>\n              );\n              if (!isLast) return cell;\n              // Inline, the last field and the remove button share one cell of the\n              // card; on the wide grid the wrapper dissolves (`contents`) and each is a\n              // track of its own again. Level with the field's control: its foot under\n              // a header copy, its middle when it floats its own label.\n              return (\n                <div\n                  key={column.key}\n                  data-line-items-inline=\"\"\n                  className={cn(\"flex min-w-0 gap-2 @lg:contents\", floating ? \"items-center\" : \"items-end\", span)}\n                >\n                  {cell}\n                  {removeCell(index, row, isConfirming)}\n                </div>\n              );\n            })}\n            {onRemove && !inline && removeCell(index, row, isConfirming)}\n          </div>\n        );\n      })}\n\n      {showTotals && (\n        <div\n          role=\"group\"\n          aria-label={typeof totalsLabel === \"string\" ? totalsLabel : labels.totals}\n          data-line-items-totals=\"\"\n          className=\"grid grid-cols-1 gap-2 border-t border-subtle pt-2 text-sm font-semibold tabular-nums text-primary @lg:grid-cols-[var(--line-items-cols)]\"\n        >\n          {columns.map((column) => {\n            const value = totals[column.key];\n            if (column.key === labelColumn) {\n              return (\n                <span key={column.key} className=\"min-w-0\">\n                  {totalsLabel ?? labels.totals}\n                </span>\n              );\n            }\n            return (\n              <span\n                key={column.key}\n                className={cn(\n                  \"min-w-0\",\n                  column.align === \"end\" && \"@lg:text-end\",\n                  // Stacked, a column with no total takes no line.\n                  !hasContent(value) && \"@max-lg:hidden\",\n                )}\n              >\n                {hasContent(value) && (\n                  <span className=\"flex justify-between gap-2 @lg:block\">\n                    <span aria-hidden className=\"font-normal text-muted @lg:hidden\">\n                      {column.header}\n                    </span>\n                    {value}\n                  </span>\n                )}\n              </span>\n            );\n          })}\n          {onRemove && <span className=\"@max-lg:hidden\" />}\n        </div>\n      )}\n\n      {summary && (\n        <div data-line-items-summary=\"\" className=\"flex flex-wrap items-center gap-x-3 gap-y-1 text-sm text-primary\">\n          {/* With no value the line is a state of its own, and the label takes the\n              tone — the only place left to carry it. */}\n          <span\n            data-tone={summaryHasValue ? undefined : summaryTone}\n            className={cn(\"min-w-0\", !summaryHasValue && SUMMARY_TONE[summaryTone])}\n          >\n            {summary.label}\n          </span>\n          {summaryHasValue && (\n            <span data-tone={summaryTone} className={cn(\"font-semibold tabular-nums\", SUMMARY_TONE[summaryTone])}>\n              {summary.value}\n            </span>\n          )}\n          {hasContent(summary.status) && (\n            <span data-line-items-summary-status=\"\" className=\"inline-flex\">\n              {summary.status}\n            </span>\n          )}\n          {summary.action && (\n            <Button\n              type=\"button\"\n              variant={summary.action.variant === \"link\" ? \"link\" : \"secondary\"}\n              tone={summary.action.variant === \"link\" ? \"muted\" : undefined}\n              size=\"sm\"\n              className=\"ms-auto\"\n              disabled={disabled || summary.action.disabled}\n              onClick={summary.action.onClick}\n            >\n              {summary.action.label}\n            </Button>\n          )}\n        </div>\n      )}\n\n      {hasError && <p className=\"text-caption leading-tight text-danger\">{error}</p>}\n\n      {onAdd && (\n        <Button\n          ref={addRef}\n          type=\"button\"\n          variant=\"secondary\"\n          className=\"w-full border-dashed\"\n          disabled={!canAdd}\n          onClick={add}\n        >\n          <Plus aria-hidden className=\"size-4\" />\n          {addLabel ?? labels.add}\n        </Button>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":["row"]}

package/dist/components/list.js

@@ -71,9 +71,27 @@ function List({
   ) });
 }
 const PAD = {
-  compact: { target: "gap-2 px-2 py-1.5", actions: "pe-1.5", leadingActions: "ps-1.5", gap: "gap-0.5", body: "px-2 pb-1.5" },
-  default: { target: "gap-3 px-3 py-2.5", actions: "pe-2", leadingActions: "ps-2", gap: "gap-1", body: "px-3 pb-2.5" },
-  comfortable: { target: "gap-3 px-4 py-3", actions: "pe-3", leadingActions: "ps-3", gap: "gap-1", body: "px-4 pb-3" }
+  compact: {
+    target: "gap-2 px-2 py-1.5",
+    actions: "pe-1.5",
+    leadingActions: "ps-1.5",
+    gap: "gap-0.5",
+    body: "px-2 pb-1.5"
+  },
+  default: {
+    target: "gap-3 px-3 py-2.5",
+    actions: "pe-2",
+    leadingActions: "ps-2",
+    gap: "gap-1",
+    body: "px-3 pb-2.5"
+  },
+  comfortable: {
+    target: "gap-3 px-4 py-3",
+    actions: "pe-3",
+    leadingActions: "ps-3",
+    gap: "gap-1",
+    body: "px-4 pb-3"
+  }
 };
 const TARGET_RING = cn(FOCUS_RING, "focus-visible:ring-inset");
 const UNCLAMP_AT_LARGE = "large:line-clamp-none";
@@ -147,13 +165,7 @@ function ListItem({
   };
   const mark = status ?? (unread ? /* @__PURE__ */ jsx(StatusDot, { tone: "brand", size: "sm", className: align === "start" ? "mt-1.5" : void 0 }) : null);
   const body = /* @__PURE__ */ jsxs(Fragment, { children: [
-    Icon && /* @__PURE__ */ jsx(
-      Icon,
-      {
-        className: cn("size-4 shrink-0 text-muted", align === "start" && "mt-0.5"),
-        "aria-hidden": true
-      }
-    ),
+    Icon && /* @__PURE__ */ jsx(Icon, { className: cn("size-4 shrink-0 text-muted", align === "start" && "mt-0.5"), "aria-hidden": true }),
     leading,
     /* @__PURE__ */ jsxs("span", { className: cn("flex min-w-0 flex-1 flex-col", trailing != null && "large:basis-40"), children: [
       overline != null && /* @__PURE__ */ jsx("span", { className: "block truncate-until-large text-caption font-medium leading-snug text-muted", children: overline }),