@eifi1/ui-kit 0.53.0 → 0.55.0

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/** The operator as the texts read it: its country named in `locale` (English without one —\n *  `countryName`'s rule, so an app that set no locale reads English). Public since 0.28.1,\n *  for an app's own footer label in the kit's words; it carried an `@internal` tag the\n *  barrel contradicted until 0.52 (API-8, refactor audit 2026-10-30). */\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":";AA6VQ,cAgLF,YAhLE;AA7VR,SAAS,eAAe,kBAAkB;AAG1C,SAAS,oBAAoB;AAE7B,SAAS,UAAU;AACnB,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAC5B,SAAS,gBAAgB;AACzB,SAAS,4BAA4B;AA+B9B,MAAM,cAAsD,OAAO,OAAO;AAAA,EAC/E,WAAW;AAAA,EACX,SAAS;AAAA,EACT,OAAO;AACT,CAAC;AAmDM,SAAS,aAAa,MAAsB;AACjD,SAAO,KAAK,MAAM,MAAM,EAAE,CAAC,EAAG,YAAY;AAC5C;AAEA,MAAM,iBAAiB,oBAAI,IAAsC;AAKjE,SAAS,aAAa,MAAc,QAAwB;AAC1D,MAAI,QAAQ,eAAe,IAAI,MAAM;AACrC,MAAI,UAAU,QAAW;AACvB,QAAI;AACF,cAAQ,IAAI,KAAK,aAAa,CAAC,MAAM,GAAG,EAAE,MAAM,WAAW,CAAC;AAAA,IAC9D,QAAQ;AACN,cAAQ;AAAA,IACV;AACA,mBAAe,IAAI,QAAQ,KAAK;AAAA,EAClC;AACA,QAAM,OAAO,aAAa,IAAI;AAC9B,MAAI;AACF,WAAO,OAAO,GAAG,IAAI,KAAK;AAAA,EAC5B,QAAQ;AACN,WAAO;AAAA,EACT;AACF;AAMO,SAAS,kBAAkB,UAAyB,SAAiB,MAAyB;AACnG,SAAO;AAAA,IACL,GAAG;AAAA,IACH,SAAS,YAAY,SAAS,SAAS,MAAM;AAAA,IAC7C,iBAAiB,SAAS,kBAAkB,aAAa,SAAS,iBAAiB,MAAM,IAAI;AAAA,EAC/F;AACF;AA4IO,SAAS,eAAe,QAAkD;AAC/E,SAAO,aAAa,SAAS,sBAAsB,MAAM;AAC3D;AAuBO,MAAM,mBAAmB,cAA4C,IAAI;AAUzE,MAAM,mBAAmB,cAAuC,IAAI;AAG3E,MAAM,YAAY;AAOlB,SAAS,cAAuB;AAC9B,SAAO,QAAQ,YAAY,KAAK,GAAG,KAAK,CAAC,YAAY,KAAK;AAC5D;AACA,MAAM,SAAS,oBAAI,IAAY;AAExB,SAAS,cAAc,SAAuB;AACnD,MAAI,CAAC,YAAY,KAAK,OAAO,IAAI,OAAO,EAAG;AAC3C,SAAO,IAAI,OAAO;AAClB,UAAQ,KAAK,YAAY,OAAO,EAAE;AACpC;AAYO,SAAS,iBAAiB,MAAc,MAA+C;AAC5F,MAAI,CAAC,QAAQ,CAAC,KAAK,SAAS,OAAO,EAAG,QAAO;AAC7C,QAAM,MAAmB,CAAC;AAC1B,MAAI,OAAO;AACX,aAAW,SAAS,KAAK,SAAS,SAAS,GAAG;AAC5C,UAAM,KAAK,MAAM,SAAS;AAC1B,QAAI,KAAK,KAAM,KAAI,KAAK,KAAK,MAAM,MAAM,EAAE,CAAC;AAC5C,UAAM,MAAM,MAAM,CAAC;AACnB,UAAM,SAAS,KAAK,QAAQ,IAAI,GAAG;AACnC,QAAI,QAAQ;AACV,UAAI;AAAA,QACF,oBAAC,YAA8B,MAAM,IAAI,GAAG,IACzC,iBAAO,UAAU,OAAO,WADZ,GAAG,GAAG,IAAI,EAAE,EAE3B;AAAA,MACF;AAAA,IACF,OAAO;AACL,oBAAc,QAAQ,GAAG,YAAY,KAAK,IAAI,mCAAmC;AACjF,UAAI,KAAK,MAAM,CAAC,CAAC;AAAA,IACnB;AACA,WAAO,KAAK,MAAM,CAAC,EAAE;AAAA,EACvB;AACA,MAAI,OAAO,KAAK,OAAQ,KAAI,KAAK,KAAK,MAAM,IAAI,CAAC;AACjD,SAAO;AACT;AAIO,SAAS,UAAU,EAAE,MAAM,UAAU,GAAyC;AACnF,QAAM,OAAO,WAAW,gBAAgB;AAGxC,SAAO,oBAAC,OAAE,WAAW,GAAG,mCAAmC,SAAS,GAAI,2BAAiB,MAAM,IAAI,GAAE;AACvG;AAwCA,SAAS,aAAa,QAAkC;AACtD,SAAQ,CAAC,aAAa,WAAW,OAAO,EAAY,IAAI,CAAC,UAAU;AAAA,IACjE,MAAM,YAAY,IAAI;AAAA,IACtB,OAAO,OAAO,MAAM,IAAI;AAAA,EAC1B,EAAE;AACJ;AAGA,SAAS,UAAU,QAAqB,OAA+D;AACrG,SAAQ,CAAC,YAAY,eAAe,EAAY,QAAQ,CAAC,SAAS;AAChE,UAAM,OAAO,MAAM,IAAI;AACvB,WAAO,OAAO,CAAC,EAAE,MAAM,OAAO,OAAO,MAAM,IAAI,KAAK,qBAAqB,MAAM,IAAI,EAAE,CAAC,IAAI,CAAC;AAAA,EAC7F,CAAC;AACH;AAWO,SAAS,WAAW;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,MAAM;AAAA,EACN;AAAA,EACA,QAAQ;AAAA,EACR;AACF,GAAoB;AAClB,QAAM,SAAS,eAAe,UAAU;AACxC,QAAM,QAAQ;AAAA,IACZ,GAAI,SAAS,aAAa,MAAM;AAAA,IAChC,GAAG,UAAU,QAAQ,EAAE,UAAU,cAAc,eAAe,kBAAkB,CAAC;AAAA,EACnF;AACA,QAAM,QAAQ,MAAM,QAAQ,CAAC,MAAM,MAAM;AAAA,IACvC,GAAI,IAAI,IACJ;AAAA,MACE,oBAAC,UAA8B,eAAY,QAAO,oBAAvC,OAAO,KAAK,IAAI,EAE3B;AAAA,IACF,IACA,CAAC;AAAA,IACL,oBAAC,YAAyB,MAAM,KAAK,MAAM,MAAK,SAAQ,SAAS,KAAK,SAAS,aAAa,SAAS,aAClG,eAAK,SADO,KAAK,IAEpB;AAAA,EACF,CAAC;AACD,QAAM,WAAW,GAAG,uDAAuD,SAAS;AACpF,MAAI,CAAC,IAAK,QAAO,oBAAC,SAAI,WAAW,UAAW,iBAAM;AAClD,SACE,oBAAC,SAAI,cAAY,OAAO,UAAU,WAAW,UAC1C,iBACH;AAEJ;AA4CO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AACF,GAAqB;AACnB,QAAM,OAAO,WAAW,WAAW;AACnC,SACE,oBAAC,QAAK,WAAW,GAAG,qCAAqC,SAAS,GAChE,+BAAC,SAAI,WAAU,kDACb;AAAA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAU;AAAA;AAAA,IACZ;AAAA,IACC,aAAa,UAAa,aAAa,QAAQ,oBAAC,OAAE,WAAU,oBAAoB,UAAS;AAAA,KAC5F,GACF;AAEJ;AAgCO,SAAS,aAAa,EAAE,SAAS,MAAM,UAAU,IAAI,QAAQ,UAAU,GAAsB;AAClG,QAAM,OAAO,WAAW,gBAAgB;AACxC,QAAM,OAAO,WAAW,gBAAgB;AACxC,QAAM,KAAK,UAAU,MAAM;AAC3B,QAAM,SAAS,MAAM;AACrB,QAAM,UAAU,aAAa,MAAM,kBAAkB;AACrD,SACE,qBAAC,aAAQ,IAAQ,WAAU,gBACzB;AAAA,yBAAC,WAAQ,WAAU,kDAChB;AAAA,iBAAW,UAAa,GAAG,MAAM;AAAA,MACjC;AAAA,OACH;AAAA,IACA,qBAAC,iBAAiB,UAAjB,EAA0B,OAAO,MAC/B;AAAA,eAAS,UAAa,oBAAC,aAAU,MAAM,MAAM,WAAU,+CAA8C;AAAA,MACrG,aAAa,UACZ,oBAAC,SAAI,WAAU,2DACZ,iBAAO,aAAa,WAAW,iBAAiB,UAAU,IAAI,IAAI,UACrE;AAAA,OAEJ;AAAA,KACF;AAEJ;AAoCO,SAAS,YAAY;AAAA,EAC1B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW,UAAU;AAAA,EACrB;AAAA,EACA;AACF,GAAqB;AACnB,SACE,qBAAC,aAAQ,WAAW,GAAG,uCAAuC,SAAS,GACpE;AAAA,aAAS,UAAa,oBAAC,SAAI,WAAU,gBAAgB,gBAAK;AAAA,IAC3D,oBAAC,WAAQ,WAAU,8DAA8D,iBAAM;AAAA,IACtF,YAAY,UAAa,YAAY,QAAQ,oBAAC,OAAE,WAAU,2BAA2B,mBAAQ;AAAA,IAC7F,oBAAoB,UAAa,oBAAoB,QAAQ,oBAAC,SAAI,WAAU,QAAQ,2BAAgB;AAAA,IACpG,WAAW,UAAa,WAAW,QAClC,oBAAC,eAAY,MAAK,WAAU,MAAK,QAAO,WAAU,QAC/C,kBACH;AAAA,IAEF,qBAAC,SAAI,WAAU,kBACZ;AAAA;AAAA,MACA;AAAA,OACH;AAAA,IACC,UAAU,UAAa,MAAM,SAAS,KACrC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAU;AAAA;AAAA,IACZ;AAAA,KAEJ;AAEJ;","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\";\nimport { DEFAULT_LANDING_LABELS, useLandingLabels } from \"../landing/landing-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/** The operator as the texts read it: its country named in `locale` (English without one —\n *  `countryName`'s rule, so an app that set no locale reads English). Public since 0.28.1,\n *  for an app's own footer label in the kit's words; it carried an `@internal` tag the\n *  barrel contradicted until 0.52 (API-8, refactor audit 2026-10-30). */\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   * 0.55: the app's other public pages — the changelog, a status page, the docs — as a row\n   * of their own above the legal links. The legal row's look (quiet links, `·` between\n   * them, the current one marked), in a `<nav>` of its own named `landing.siteNavLabel`\n   * (\"More pages\"): a screen reader hears the footer's links announced as the legal ones,\n   * so a link that is not one goes in a row that says so (docs/landing-demo-harmonization.md\n   * §4.4). The name is a `landing` word, not a `legal` one — it is no legal wording — so\n   * the provider sets it, not {@link labels}. Left out or empty, no row.\n   */\n  siteLinks?: readonly LegalLink[];\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 *\n * 0.55: `siteLinks`, the app's other public pages, in a row above them that is named apart.\n */\nexport function LegalFooter({\n  children,\n  links,\n  securityHref,\n  accessibilityHref,\n  currentHref,\n  siteLinks,\n  landmark = true,\n  className,\n  labels,\n}: LegalFooterProps) {\n  const Root = landmark ? \"footer\" : \"div\";\n  const siteNavLabel = useLandingLabels().siteNavLabel ?? DEFAULT_LANDING_LABELS.siteNavLabel ?? \"\";\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        {/* The legal row's own component, renamed: the same look, a `<nav>` of its own. */}\n        {!!siteLinks?.length && (\n          <LegalLinks\n            links={siteLinks}\n            currentHref={currentHref}\n            labels={{ navLabel: siteNavLabel }}\n            className=\"mb-3 justify-center gap-y-2 text-sm\"\n          />\n        )}\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/legended-series-chart.d.ts

@@ -0,0 +1,80 @@
+import type { ReactNode } from "react";
+import { type SeriesChartAxis, type SeriesChartProps, type SeriesChartSeries } from "./series-chart.js";
+import { type LegendEntry } from "./toggle-legend.js";
+/**
+ * What the legend is, and who keeps the series it has switched off.
+ *
+ * - `legend: "toggle"` (the default): every entry a switch that takes its series off the
+ *   chart and brings it back (`ToggleLegend`). The chart keeps what is off — or the caller
+ *   does, with `hidden` and `onToggle` together: for a choice that has to outlive the chart
+ *   (a tab that shows its skeleton while the next month loads), or one kept by something
+ *   steadier than the series key (keksdose's shop names, whose keys re-slot when the markets
+ *   narrow).
+ * - `legend: "key"`: a key, not a control (`StaticLegend`) — a list to a screen reader, no
+ *   tab stops, every series drawn. For a legend that says what a mark means without
+ *   letting it be switched: keksdose's cash buffer, whose dashed projection and amber
+ *   marker are named, not toggled.
+ */
+export type LegendedSeriesChartLegend = {
+    legend?: "toggle";
+    hidden?: undefined;
+    onToggle?: undefined;
+} | {
+    legend?: "toggle";
+    /** The keys switched off, kept by the caller. */
+    hidden: ReadonlySet<string>;
+    /** An entry was switched: its series' key. */
+    onToggle: (key: string) => void;
+} | {
+    legend: "key";
+    hidden?: undefined;
+    onToggle?: undefined;
+};
+/**
+ * The props of {@link LegendedSeriesChart}: a {@link SeriesChartProps} for rows of type
+ * `TRow`, whose `series` is the FULL list and whose `axes` may follow what is switched off.
+ */
+export type LegendedSeriesChartProps<TRow extends object = object> = Omit<SeriesChartProps<TRow>, "series" | "axes"> & LegendedSeriesChartLegend & {
+    /** EVERY series, the switched-off ones included: the legend lists them all, and the
+     *  chart draws the rest through `visibleSeries`, which settles each colour on this full
+     *  list first, so a switch never repaints a neighbour. */
+    series: readonly SeriesChartSeries<TRow>[];
+    /** The axes, or a function of the switched-off keys, for an axis drawn only while its
+     *  series is: keksdose's running sum, whose axis hands the bars its room back when the
+     *  line is switched off. */
+    axes?: readonly SeriesChartAxis[] | ((hidden: ReadonlySet<string>) => readonly SeriesChartAxis[]);
+    /**
+     * The legend's entries, when not the kit's own for `series` (`seriesLegendEntries`,
+     * handed the axes drawn and those the axis budget hid, so a series on an undrawn axis
+     * says its unit): a stroke for every line, or a key's marks that are not series (a
+     * marker, a reference line). A switch reports its entry's `key`.
+     */
+    legendEntries?: readonly LegendEntry[];
+    /** Onto the legend: its row is centred under the chart, wrapping. */
+    legendClassName?: string;
+    /** Wraps the chart and the chart alone — a horizontal scroller the legend has to stay
+     *  out of, so it is in view however far the chart is scrolled (keksdose's budget
+     *  performance, with `tooltip.boundary` on the scroller). */
+    frame?: (chart: ReactNode) => ReactNode;
+};
+/**
+ * A {@link SeriesChart} and its legend, the legend centred under it: the kit's layout of the
+ * two, which keksdose, kastlan and the kit's own showcase each assembled from the parts.
+ *
+ * With the default `legend: "toggle"` each entry is a switch: the chart is drawn with
+ * `visibleSeries(series, hidden)`, the legend lists every series (`seriesLegendEntries`),
+ * and a series that is off keeps its place and its colour in the legend. A legend of one
+ * series is drawn only while that series is off — the one way to bring it back. With
+ * `legend: "key"` it is a {@link StaticLegend} of the same entries, and every series is
+ * drawn.
+ *
+ * Everything else is the chart's: rows, axes, zoom, tooltip, `onPointClick`, `aria-label`,
+ * all as {@link SeriesChartProps} take them. Generic in its rows as SeriesChart is (0.53):
+ * `hit.row` and a `dot`'s `point.row` are typed as `rows` is. A plain function, so the
+ * generic survives.
+ *
+ * The chart is handed the same `series` and `axes` objects while neither the caller's nor
+ * the hidden set changes, so a render of the page costs it nothing (see SeriesChart's
+ * memoised plot) — as long as the caller keeps its own the same.
+ */
+export declare function LegendedSeriesChart<TRow extends object = object>({ series, axes, legend, legendEntries, legendClassName, frame, hidden: hiddenProp, onToggle, onAxisBudget, ...chartProps }: LegendedSeriesChartProps<TRow>): import("react").JSX.Element;

package/dist/components/legended-series-chart.js

@@ -0,0 +1,70 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useMemo, useState } from "react";
+import {
+  SeriesChart,
+  seriesLegendEntries,
+  visibleSeries
+} from "./series-chart.js";
+import { StaticLegend, ToggleLegend, toggleHidden } from "./toggle-legend.js";
+import { cn } from "../lib/cn.js";
+const NONE = /* @__PURE__ */ new Set();
+function LegendedSeriesChart({
+  series,
+  axes,
+  legend = "toggle",
+  legendEntries,
+  legendClassName,
+  frame,
+  hidden: hiddenProp,
+  onToggle,
+  onAxisBudget,
+  ...chartProps
+}) {
+  const [ownHidden, setOwnHidden] = useState(NONE);
+  const hidden = legend === "key" ? NONE : hiddenProp ?? ownHidden;
+  const toggle = useCallback(
+    (key) => onToggle ? onToggle(key) : setOwnHidden((was) => toggleHidden(was, key)),
+    [onToggle]
+  );
+  const [budgeted, setBudgeted] = useState([]);
+  const reportBudget = useCallback(
+    (ids) => {
+      setBudgeted(ids);
+      onAxisBudget?.(ids);
+    },
+    [onAxisBudget]
+  );
+  const drawn = useMemo(() => visibleSeries(series, hidden), [series, hidden]);
+  const drawnAxes = useMemo(() => typeof axes === "function" ? axes(hidden) : axes, [axes, hidden]);
+  const entries = useMemo(
+    () => legendEntries ?? seriesLegendEntries(series, { axes: drawnAxes, budgeted }),
+    [legendEntries, series, drawnAxes, budgeted]
+  );
+  const chart = /* @__PURE__ */ jsx(
+    SeriesChart,
+    {
+      ...chartProps,
+      series: drawn,
+      axes: drawnAxes,
+      onAxisBudget: reportBudget
+    }
+  );
+  return /* @__PURE__ */ jsxs("div", { children: [
+    frame ? frame(chart) : chart,
+    legend === "key" ? /* @__PURE__ */ jsx(StaticLegend, { entries, className: cn("justify-center", legendClassName) }) : /* @__PURE__ */ jsx(
+      ToggleLegend,
+      {
+        entries,
+        hidden,
+        onToggle: toggle,
+        showSingle: entries.some((entry) => hidden.has(entry.key)),
+        className: cn("justify-center", legendClassName)
+      }
+    )
+  ] });
+}
+export {
+  LegendedSeriesChart
+};
+//# sourceMappingURL=legended-series-chart.js.map

package/dist/components/legended-series-chart.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/legended-series-chart.tsx"],"sourcesContent":["// A series chart with its legend under it, as one part (0.55). Lifted out of keksdose's\n// reports, where `LegendedSeriesChart` (features/reports/charts/legended-series-chart.tsx)\n// wired six report charts — net worth, investments, income and expense, the grouped and\n// stacked payees, budget performance, the price history — and out of kastlan's reporting\n// and dashboard charts and keksdose's metrics panel, which wrote the same pairing by hand:\n// a hidden set, `visibleSeries` for the chart, the FULL list for the legend through\n// `seriesLegendEntries`, and a `ToggleLegend` centred under the plot. The kit exported the\n// parts and left the pairing to every app; this is the pairing.\nimport { useCallback, useMemo, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport {\n  SeriesChart,\n  seriesLegendEntries,\n  visibleSeries,\n  type SeriesChartAxis,\n  type SeriesChartProps,\n  type SeriesChartSeries,\n} from \"./series-chart\";\nimport { StaticLegend, ToggleLegend, toggleHidden, type LegendEntry } from \"./toggle-legend\";\nimport { cn } from \"../lib/cn\";\n\n/**\n * What the legend is, and who keeps the series it has switched off.\n *\n * - `legend: \"toggle\"` (the default): every entry a switch that takes its series off the\n *   chart and brings it back (`ToggleLegend`). The chart keeps what is off — or the caller\n *   does, with `hidden` and `onToggle` together: for a choice that has to outlive the chart\n *   (a tab that shows its skeleton while the next month loads), or one kept by something\n *   steadier than the series key (keksdose's shop names, whose keys re-slot when the markets\n *   narrow).\n * - `legend: \"key\"`: a key, not a control (`StaticLegend`) — a list to a screen reader, no\n *   tab stops, every series drawn. For a legend that says what a mark means without\n *   letting it be switched: keksdose's cash buffer, whose dashed projection and amber\n *   marker are named, not toggled.\n */\nexport type LegendedSeriesChartLegend =\n  | {\n      legend?: \"toggle\";\n      hidden?: undefined;\n      onToggle?: undefined;\n    }\n  | {\n      legend?: \"toggle\";\n      /** The keys switched off, kept by the caller. */\n      hidden: ReadonlySet<string>;\n      /** An entry was switched: its series' key. */\n      onToggle: (key: string) => void;\n    }\n  | { legend: \"key\"; hidden?: undefined; onToggle?: undefined };\n\n/**\n * The props of {@link LegendedSeriesChart}: a {@link SeriesChartProps} for rows of type\n * `TRow`, whose `series` is the FULL list and whose `axes` may follow what is switched off.\n */\nexport type LegendedSeriesChartProps<TRow extends object = object> = Omit<SeriesChartProps<TRow>, \"series\" | \"axes\"> &\n  LegendedSeriesChartLegend & {\n    /** EVERY series, the switched-off ones included: the legend lists them all, and the\n     *  chart draws the rest through `visibleSeries`, which settles each colour on this full\n     *  list first, so a switch never repaints a neighbour. */\n    series: readonly SeriesChartSeries<TRow>[];\n    /** The axes, or a function of the switched-off keys, for an axis drawn only while its\n     *  series is: keksdose's running sum, whose axis hands the bars its room back when the\n     *  line is switched off. */\n    axes?: readonly SeriesChartAxis[] | ((hidden: ReadonlySet<string>) => readonly SeriesChartAxis[]);\n    /**\n     * The legend's entries, when not the kit's own for `series` (`seriesLegendEntries`,\n     * handed the axes drawn and those the axis budget hid, so a series on an undrawn axis\n     * says its unit): a stroke for every line, or a key's marks that are not series (a\n     * marker, a reference line). A switch reports its entry's `key`.\n     */\n    legendEntries?: readonly LegendEntry[];\n    /** Onto the legend: its row is centred under the chart, wrapping. */\n    legendClassName?: string;\n    /** Wraps the chart and the chart alone — a horizontal scroller the legend has to stay\n     *  out of, so it is in view however far the chart is scrolled (keksdose's budget\n     *  performance, with `tooltip.boundary` on the scroller). */\n    frame?: (chart: ReactNode) => ReactNode;\n  };\n\n/** Nothing switched off, one set for every chart that keeps its own. */\nconst NONE: ReadonlySet<string> = new Set();\n\n/**\n * A {@link SeriesChart} and its legend, the legend centred under it: the kit's layout of the\n * two, which keksdose, kastlan and the kit's own showcase each assembled from the parts.\n *\n * With the default `legend: \"toggle\"` each entry is a switch: the chart is drawn with\n * `visibleSeries(series, hidden)`, the legend lists every series (`seriesLegendEntries`),\n * and a series that is off keeps its place and its colour in the legend. A legend of one\n * series is drawn only while that series is off — the one way to bring it back. With\n * `legend: \"key\"` it is a {@link StaticLegend} of the same entries, and every series is\n * drawn.\n *\n * Everything else is the chart's: rows, axes, zoom, tooltip, `onPointClick`, `aria-label`,\n * all as {@link SeriesChartProps} take them. Generic in its rows as SeriesChart is (0.53):\n * `hit.row` and a `dot`'s `point.row` are typed as `rows` is. A plain function, so the\n * generic survives.\n *\n * The chart is handed the same `series` and `axes` objects while neither the caller's nor\n * the hidden set changes, so a render of the page costs it nothing (see SeriesChart's\n * memoised plot) — as long as the caller keeps its own the same.\n */\nexport function LegendedSeriesChart<TRow extends object = object>({\n  series,\n  axes,\n  legend = \"toggle\",\n  legendEntries,\n  legendClassName,\n  frame,\n  hidden: hiddenProp,\n  onToggle,\n  onAxisBudget,\n  ...chartProps\n}: LegendedSeriesChartProps<TRow>) {\n  const [ownHidden, setOwnHidden] = useState<ReadonlySet<string>>(NONE);\n  // A key switches nothing: every series is drawn.\n  const hidden = legend === \"key\" ? NONE : (hiddenProp ?? ownHidden);\n  const toggle = useCallback(\n    (key: string) => (onToggle ? onToggle(key) : setOwnHidden((was) => toggleHidden(was, key))),\n    [onToggle],\n  );\n  // What the axis budget hid, for the legend to say those axes' units (SeriesChart's\n  // `onAxisBudget`); the caller's own callback is still told.\n  const [budgeted, setBudgeted] = useState<readonly string[]>([]);\n  const reportBudget = useCallback(\n    (ids: readonly string[]) => {\n      setBudgeted(ids);\n      onAxisBudget?.(ids);\n    },\n    [onAxisBudget],\n  );\n  const drawn = useMemo(() => visibleSeries(series, hidden), [series, hidden]);\n  const drawnAxes = useMemo(() => (typeof axes === \"function\" ? axes(hidden) : axes), [axes, hidden]);\n  const entries = useMemo(\n    () => legendEntries ?? seriesLegendEntries(series, { axes: drawnAxes, budgeted }),\n    [legendEntries, series, drawnAxes, budgeted],\n  );\n  // SeriesChart's own props, with `TRow` as the caller's: the rest is passed through as is.\n  const chart = (\n    <SeriesChart<TRow>\n      {...(chartProps as Omit<SeriesChartProps<TRow>, \"series\" | \"axes\" | \"onAxisBudget\">)}\n      series={drawn}\n      axes={drawnAxes}\n      onAxisBudget={reportBudget}\n    />\n  );\n  return (\n    <div>\n      {frame ? frame(chart) : chart}\n      {legend === \"key\" ? (\n        <StaticLegend entries={entries} className={cn(\"justify-center\", legendClassName)} />\n      ) : (\n        <ToggleLegend\n          entries={entries}\n          hidden={hidden}\n          onToggle={toggle}\n          // One series' legend is noise — until that series is off, and its entry is the\n          // only way back.\n          showSingle={entries.some((entry) => hidden.has(entry.key))}\n          className={cn(\"justify-center\", legendClassName)}\n        />\n      )}\n    </div>\n  );\n}\n"],"mappings":";AA2II,cAQA,YARA;AAnIJ,SAAS,aAAa,SAAS,gBAAgB;AAE/C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OAIK;AACP,SAAS,cAAc,cAAc,oBAAsC;AAC3E,SAAS,UAAU;AA6DnB,MAAM,OAA4B,oBAAI,IAAI;AAsBnC,SAAS,oBAAkD;AAAA,EAChE;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAmC;AACjC,QAAM,CAAC,WAAW,YAAY,IAAI,SAA8B,IAAI;AAEpE,QAAM,SAAS,WAAW,QAAQ,OAAQ,cAAc;AACxD,QAAM,SAAS;AAAA,IACb,CAAC,QAAiB,WAAW,SAAS,GAAG,IAAI,aAAa,CAAC,QAAQ,aAAa,KAAK,GAAG,CAAC;AAAA,IACzF,CAAC,QAAQ;AAAA,EACX;AAGA,QAAM,CAAC,UAAU,WAAW,IAAI,SAA4B,CAAC,CAAC;AAC9D,QAAM,eAAe;AAAA,IACnB,CAAC,QAA2B;AAC1B,kBAAY,GAAG;AACf,qBAAe,GAAG;AAAA,IACpB;AAAA,IACA,CAAC,YAAY;AAAA,EACf;AACA,QAAM,QAAQ,QAAQ,MAAM,cAAc,QAAQ,MAAM,GAAG,CAAC,QAAQ,MAAM,CAAC;AAC3E,QAAM,YAAY,QAAQ,MAAO,OAAO,SAAS,aAAa,KAAK,MAAM,IAAI,MAAO,CAAC,MAAM,MAAM,CAAC;AAClG,QAAM,UAAU;AAAA,IACd,MAAM,iBAAiB,oBAAoB,QAAQ,EAAE,MAAM,WAAW,SAAS,CAAC;AAAA,IAChF,CAAC,eAAe,QAAQ,WAAW,QAAQ;AAAA,EAC7C;AAEA,QAAM,QACJ;AAAA,IAAC;AAAA;AAAA,MACE,GAAI;AAAA,MACL,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,cAAc;AAAA;AAAA,EAChB;AAEF,SACE,qBAAC,SACE;AAAA,YAAQ,MAAM,KAAK,IAAI;AAAA,IACvB,WAAW,QACV,oBAAC,gBAAa,SAAkB,WAAW,GAAG,kBAAkB,eAAe,GAAG,IAElF;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,UAAU;AAAA,QAGV,YAAY,QAAQ,KAAK,CAAC,UAAU,OAAO,IAAI,MAAM,GAAG,CAAC;AAAA,QACzD,WAAW,GAAG,kBAAkB,eAAe;AAAA;AAAA,IACjD;AAAA,KAEJ;AAEJ;","names":[]}

package/dist/components/lightbox.js

@@ -4,6 +4,7 @@ import { useEffect, useRef, useState } from "react";
 import { ChevronLeft, ChevronRight, Download, ExternalLink, FileText, ZoomIn } from "lucide-react";
 import { cn } from "../lib/cn.js";
 import { horizontalStep } from "../lib/direction.js";
+import { isEditableContent } from "../lib/editable-content.js";
 import { hasContent } from "../lib/presence.js";
 import { useKitLabels } from "../i18n/kit-labels.js";
 import { useAuthedSrc } from "../hooks/use-authed-src.js";
@@ -64,7 +65,7 @@ function Lightbox({
   };
   const onKeyDown = (e) => {
     const target = e.target;
-    if (target.closest("input, textarea, select, [contenteditable='true']")) return;
+    if (target.closest("input, textarea, select") || isEditableContent(target)) return;
     const step = horizontalStep(e.key, e.currentTarget);
     if (step !== 0) {
       e.preventDefault();

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 { hasContent } from \"../lib/presence\";\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 refuse (`aria-disabled`, focus kept — 0.52),\n   *  which says where the set 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/** An end arrow's look: a disabled `overlay` IconButton's (its 50% and its resting disc\n *  under hover), for the focusable kind — `disabled:` cannot match `aria-disabled`. */\nconst ARROW_AT_END =\n  \"aria-disabled:cursor-not-allowed aria-disabled:opacity-50 aria-disabled:hover:bg-[color-mix(in_srgb,var(--bg-inverse)_60%,transparent)]\";\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          // `hasContent` (refactor audit 2026-10-30, DUP-14): a `\"\"` caption drew an empty\n          // footer bar.\n          hasContent(item?.caption) ? (\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          // At an end the arrow refuses rather than turns `disabled` (refactor audit\n          // 2026-10-30, INP-4, JumpCalendar's rule): the press that reaches the last\n          // picture is made with the focus on ›, and a focused button that turns\n          // `disabled` drops the focus out of the viewer's trap to <body>. kastlan's\n          // ImageGrid and keksdose's invoice review open it without `loop`.\n          <>\n            <IconButton\n              variant=\"overlay\"\n              size=\"lg\"\n              label={labels.previous}\n              aria-disabled={!canPrev || undefined}\n              onClick={() => go(-1)}\n              className={cn(\"absolute start-3 top-1/2 -translate-y-1/2\", ARROW_AT_END)}\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              aria-disabled={!canNext || undefined}\n              onClick={() => go(1)}\n              className={cn(\"absolute end-3 top-1/2 -translate-y-1/2\", ARROW_AT_END)}\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 { isEditableContent } from \"../lib/editable-content\";\nimport { hasContent } from \"../lib/presence\";\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 refuse (`aria-disabled`, focus kept — 0.52),\n   *  which says where the set 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/** An end arrow's look: a disabled `overlay` IconButton's (its 50% and its resting disc\n *  under hover), for the focusable kind — `disabled:` cannot match `aria-disabled`. */\nconst ARROW_AT_END =\n  \"aria-disabled:cursor-not-allowed aria-disabled:opacity-50 aria-disabled:hover:bg-[color-mix(in_srgb,var(--bg-inverse)_60%,transparent)]\";\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. Editable content by the kit's one rule\n    // (lib/editable-content; 0.52 code review 2026-10-31, held to 0.55): the selector it\n    // replaced matched `[contenteditable='true']` alone, so in an editor written\n    // `contenteditable=\"\"` or `\"plaintext-only\"` the arrows, Home and End paged the viewer\n    // instead of moving the caret.\n    const target = e.target as Element;\n    if (target.closest(\"input, textarea, select\") || isEditableContent(target)) 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          // `hasContent` (refactor audit 2026-10-30, DUP-14): a `\"\"` caption drew an empty\n          // footer bar.\n          hasContent(item?.caption) ? (\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          // At an end the arrow refuses rather than turns `disabled` (refactor audit\n          // 2026-10-30, INP-4, JumpCalendar's rule): the press that reaches the last\n          // picture is made with the focus on ›, and a focused button that turns\n          // `disabled` drops the focus out of the viewer's trap to <body>. kastlan's\n          // ImageGrid and keksdose's invoice review open it without `loop`.\n          <>\n            <IconButton\n              variant=\"overlay\"\n              size=\"lg\"\n              label={labels.previous}\n              aria-disabled={!canPrev || undefined}\n              onClick={() => go(-1)}\n              className={cn(\"absolute start-3 top-1/2 -translate-y-1/2\", ARROW_AT_END)}\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              aria-disabled={!canNext || undefined}\n              onClick={() => go(1)}\n              className={cn(\"absolute end-3 top-1/2 -translate-y-1/2\", ARROW_AT_END)}\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/mini-calendar.js

@@ -8,7 +8,16 @@ import { upperFirst } from "../lib/text-case.js";
 import { FOCUS_RING, FOCUS_RING_WIDTH } from "./focus-ring.js";
 import { horizontalStep } from "../lib/direction.js";
 import { useAnnounce } from "../hooks/use-announce.js";
-import { addMonthsClamped, localeWeekStart, monthKey, parseIsoDate, sameYmd, toLocalIso } from "../lib/dates.js";
+import {
+  addMonthsClamped,
+  currentDate,
+  localeWeekStart,
+  monthKey,
+  parseIsoDate,
+  sameYmd,
+  toLocalIso
+} from "../lib/dates.js";
+import { dateFormatter } from "../lib/intl-cache.js";
 import { useKitLabels, useKitLocale, useKitWeekStart } from "../i18n/kit-labels.js";
 import { DEFAULT_MINI_CALENDAR_LABELS } from "./mini-calendar-labels.js";
 const DAY_NAME_FORMAT = {
@@ -65,7 +74,7 @@ function MiniCalendar({
   const hintId = `${id}-hint`;
   const { announce, regionProps } = useAnnounce();
   const [activeIso, setActiveIso] = useState(() => {
-    let start = fromDate ?? toDate ?? /* @__PURE__ */ new Date();
+    let start = fromDate ?? toDate ?? currentDate();
     const first = monthStart(month);
     if (first && monthKey(start) !== month) start = first;
     if (minDate && start < minDate) return toLocalIso(minDate);
@@ -83,12 +92,12 @@ function MiniCalendar({
   if (lastMonth !== month) {
     setLastMonth(month);
     const first = monthStart(month);
-    const current = parseIsoDate(activeIso) ?? /* @__PURE__ */ new Date();
+    const current = parseIsoDate(activeIso) ?? currentDate();
     if (first && monthKey(current) !== month) {
       setActiveIso(toLocalIso(sameDayIn(first, current)));
     }
   }
-  const activeDate = parseIsoDate(activeIso) ?? /* @__PURE__ */ new Date();
+  const activeDate = parseIsoDate(activeIso) ?? currentDate();
   const view = { year: activeDate.getFullYear(), month: activeDate.getMonth() };
   const firstOfMonth = new Date(view.year, view.month, 1);
   const lastOfMonth = new Date(view.year, view.month + 1, 0);
@@ -103,8 +112,8 @@ function MiniCalendar({
   }
   const weeks = [];
   for (let i = 0; i < cells.length; i += 7) weeks.push(cells.slice(i, i + 7));
-  const monthLabel = upperFirst(firstOfMonth.toLocaleDateString(locale, { month: "long", year: "numeric" }), locale);
-  const formatDay = (d) => d.toLocaleDateString(locale, DAY_NAME_FORMAT);
+  const monthLabel = upperFirst(dateFormatter(locale, { month: "long", year: "numeric" }).format(firstOfMonth), locale);
+  const formatDay = (d) => dateFormatter(locale, DAY_NAME_FORMAT).format(d);
   const weekdayLabels = useMemo(() => {
     const ref = new Date(2024, 0, 7 + weekStart);
     return Array.from({ length: 7 }, (_, i) => {
@@ -195,7 +204,7 @@ function MiniCalendar({
       announce(labels.rangeSelected(formatDay(f), formatDay(d)));
     }
   };
-  const today = /* @__PURE__ */ new Date();
+  const today = currentDate();
   const hasBand = Boolean(fromDate && toDate && !sameYmd(fromDate, toDate));
   const daysInMonth = (d) => new Date(d.getFullYear(), d.getMonth() + 1, 0).getDate();
   const inRange = (d) => {