@eifi1/ui-kit 0.30.0 → 0.31.1

package/dist/settings/use-account-language.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/settings/use-account-language.ts"],"sourcesContent":["import { useCallback, useMemo } from \"react\";\n\n/**\n * Where the language on screen came from (docs/settings-harmonization.md §6.2), in the\n * order they are asked.\n */\nexport type AccountLanguageSource = \"device\" | \"account\" | \"browser\" | \"default\";\n\n/** `de_ch`, `DE-ch` → `de-CH`: the case and separator a BCP 47 tag is written in. */\nfunction canonicalTag(tag: string): string {\n  const parts = tag.trim().replace(/_/g, \"-\").split(\"-\").filter(Boolean);\n  return parts\n    .map((part, i) => {\n      if (i === 0) return part.toLowerCase();\n      if (part.length === 2) return part.toUpperCase();\n      if (part.length === 4) return part[0].toUpperCase() + part.slice(1).toLowerCase();\n      return part.toLowerCase();\n    })\n    .join(\"-\");\n}\n\n/**\n * The offered language a tag means, or `null` — the client's half of server-kit's\n * `canonical_locale(tag, offered)` (§6.2): case and `_` normalised; an offered tag matches\n * exactly; otherwise the first offered tag of the same language (`de`, `de-DE` → `de-CH`\n * where `de-CH` is what the app offers); anything else is no match.\n */\nexport function matchOfferedLanguage(tag: string | null | undefined, offered: readonly string[]): string | null {\n  if (!tag || !tag.trim()) return null;\n  const wanted = canonicalTag(tag);\n  const exact = offered.find((code) => canonicalTag(code) === wanted);\n  if (exact !== undefined) return exact;\n  const language = wanted.split(\"-\")[0];\n  return offered.find((code) => canonicalTag(code).split(\"-\")[0] === language) ?? null;\n}\n\nexport interface ResolveAccountLanguageInput {\n  /** This device's own choice — made on this device, stored only when the user picks. */\n  device: string | null | undefined;\n  /** The signed-in account's `locale`; `undefined` while signed out. */\n  account: string | null | undefined;\n  /** The browser's languages, most wanted first (`navigator.languages`). */\n  browser?: readonly string[];\n  /** The languages the app offers. */\n  offered: readonly string[];\n  /** The app's default, when nothing else matches. */\n  fallback: string;\n}\n\nexport interface ResolvedAccountLanguage {\n  language: string;\n  source: AccountLanguageSource;\n}\n\n/**\n * The language on a device (§6.2): **its own choice → the account's locale → the\n * browser's language → the app's default**, each taken only when it names a language the\n * app offers. Pure: the order, without the storage.\n *\n * \"At sign-in the account applies unless the device has its own choice\" is this order and\n * nothing more: once the account's locale arrives it outranks the browser, never the\n * device's pick.\n */\nexport function resolveAccountLanguage(input: ResolveAccountLanguageInput): ResolvedAccountLanguage {\n  const { device, account, browser = [], offered, fallback } = input;\n  const fromDevice = matchOfferedLanguage(device, offered);\n  if (fromDevice) return { language: fromDevice, source: \"device\" };\n  const fromAccount = matchOfferedLanguage(account, offered);\n  if (fromAccount) return { language: fromAccount, source: \"account\" };\n  for (const tag of browser) {\n    const fromBrowser = matchOfferedLanguage(tag, offered);\n    if (fromBrowser) return { language: fromBrowser, source: \"browser\" };\n  }\n  return { language: fallback, source: \"default\" };\n}\n\nexport interface UseAccountLanguageOptions {\n  /** The signed-in account's `locale` (`/auth/me`). `undefined` while signed out or not\n   *  loaded yet; `null` for an account with no language set. */\n  account: string | null | undefined;\n  /** This device's own choice — `<app>-lang` — or `null` when it was never picked here.\n   *  Detection must not fill it (i18next's detector with `caches: []`, §6.2). */\n  device: string | null | undefined;\n  /** Store the device's own choice (`<app>-lang`). */\n  setDevice: (code: string) => void;\n  /** Write the account's locale: `PATCH /auth/me {locale}`. Return its promise. */\n  save: (code: string) => unknown;\n  /** A demo session: a pick stays on the device, the account is never written (§6.2). */\n  isDemo?: boolean;\n  /** The languages the app offers, as it writes them. */\n  offered: readonly string[];\n  /** The app's default language. */\n  fallback: string;\n  /** The browser's languages. Default: `navigator.languages`. */\n  browser?: readonly string[];\n}\n\nexport interface AccountLanguage extends ResolvedAccountLanguage {\n  /**\n   * The user picked `code` (the language card, the top bar's quick switch): it becomes the\n   * device's own choice and — signed in, and not a demo — the account's locale. The\n   * promise is `save`'s; the device keeps the pick if it fails, and the app says so.\n   */\n  pick: (code: string) => Promise<unknown>;\n}\n\nfunction navigatorLanguages(): readonly string[] {\n  if (typeof navigator === \"undefined\") return [];\n  return navigator.languages?.length ? navigator.languages : navigator.language ? [navigator.language] : [];\n}\n\n/**\n * The account's language on this device (§6.2, §10.8): the order of\n * {@link resolveAccountLanguage}, and the writes — so the three apps' copies go.\n *\n * - **Nothing writes the account on its own.** Rendering, signing in and adopting the\n *   account's locale call neither `save` nor `setDevice`; keksdose's\n *   `useSyncLanguageToAccount` (a PATCH on every session start) overwrote the account\n *   from a new device before that device could adopt it.\n * - **A pick** writes the device's choice, then `save` — except in a demo session, whose\n *   throwaway account needs no language (and model R refuses the write).\n *\n * The hook only answers; the app applies `language` (`i18n.changeLanguage`) where it\n * applies languages today.\n */\nexport function useAccountLanguage(options: UseAccountLanguageOptions): AccountLanguage {\n  const { account, device, setDevice, save, isDemo = false, offered, fallback, browser } = options;\n  const resolved = useMemo(\n    () => resolveAccountLanguage({ device, account, browser: browser ?? navigatorLanguages(), offered, fallback }),\n    [device, account, browser, offered, fallback],\n  );\n  const signedIn = account !== undefined;\n  const pick = useCallback(\n    (code: string) => {\n      setDevice(code);\n      if (isDemo || !signedIn) return Promise.resolve();\n      try {\n        return Promise.resolve(save(code));\n      } catch (error) {\n        return Promise.reject(error);\n      }\n    },\n    [setDevice, save, isDemo, signedIn],\n  );\n  return { ...resolved, pick };\n}\n"],"mappings":";AAAA,SAAS,aAAa,eAAe;AASrC,SAAS,aAAa,KAAqB;AACzC,QAAM,QAAQ,IAAI,KAAK,EAAE,QAAQ,MAAM,GAAG,EAAE,MAAM,GAAG,EAAE,OAAO,OAAO;AACrE,SAAO,MACJ,IAAI,CAAC,MAAM,MAAM;AAChB,QAAI,MAAM,EAAG,QAAO,KAAK,YAAY;AACrC,QAAI,KAAK,WAAW,EAAG,QAAO,KAAK,YAAY;AAC/C,QAAI,KAAK,WAAW,EAAG,QAAO,KAAK,CAAC,EAAE,YAAY,IAAI,KAAK,MAAM,CAAC,EAAE,YAAY;AAChF,WAAO,KAAK,YAAY;AAAA,EAC1B,CAAC,EACA,KAAK,GAAG;AACb;AAQO,SAAS,qBAAqB,KAAgC,SAA2C;AAC9G,MAAI,CAAC,OAAO,CAAC,IAAI,KAAK,EAAG,QAAO;AAChC,QAAM,SAAS,aAAa,GAAG;AAC/B,QAAM,QAAQ,QAAQ,KAAK,CAAC,SAAS,aAAa,IAAI,MAAM,MAAM;AAClE,MAAI,UAAU,OAAW,QAAO;AAChC,QAAM,WAAW,OAAO,MAAM,GAAG,EAAE,CAAC;AACpC,SAAO,QAAQ,KAAK,CAAC,SAAS,aAAa,IAAI,EAAE,MAAM,GAAG,EAAE,CAAC,MAAM,QAAQ,KAAK;AAClF;AA6BO,SAAS,uBAAuB,OAA6D;AAClG,QAAM,EAAE,QAAQ,SAAS,UAAU,CAAC,GAAG,SAAS,SAAS,IAAI;AAC7D,QAAM,aAAa,qBAAqB,QAAQ,OAAO;AACvD,MAAI,WAAY,QAAO,EAAE,UAAU,YAAY,QAAQ,SAAS;AAChE,QAAM,cAAc,qBAAqB,SAAS,OAAO;AACzD,MAAI,YAAa,QAAO,EAAE,UAAU,aAAa,QAAQ,UAAU;AACnE,aAAW,OAAO,SAAS;AACzB,UAAM,cAAc,qBAAqB,KAAK,OAAO;AACrD,QAAI,YAAa,QAAO,EAAE,UAAU,aAAa,QAAQ,UAAU;AAAA,EACrE;AACA,SAAO,EAAE,UAAU,UAAU,QAAQ,UAAU;AACjD;AAgCA,SAAS,qBAAwC;AAC/C,MAAI,OAAO,cAAc,YAAa,QAAO,CAAC;AAC9C,SAAO,UAAU,WAAW,SAAS,UAAU,YAAY,UAAU,WAAW,CAAC,UAAU,QAAQ,IAAI,CAAC;AAC1G;AAgBO,SAAS,mBAAmB,SAAqD;AACtF,QAAM,EAAE,SAAS,QAAQ,WAAW,MAAM,SAAS,OAAO,SAAS,UAAU,QAAQ,IAAI;AACzF,QAAM,WAAW;AAAA,IACf,MAAM,uBAAuB,EAAE,QAAQ,SAAS,SAAS,WAAW,mBAAmB,GAAG,SAAS,SAAS,CAAC;AAAA,IAC7G,CAAC,QAAQ,SAAS,SAAS,SAAS,QAAQ;AAAA,EAC9C;AACA,QAAM,WAAW,YAAY;AAC7B,QAAM,OAAO;AAAA,IACX,CAAC,SAAiB;AAChB,gBAAU,IAAI;AACd,UAAI,UAAU,CAAC,SAAU,QAAO,QAAQ,QAAQ;AAChD,UAAI;AACF,eAAO,QAAQ,QAAQ,KAAK,IAAI,CAAC;AAAA,MACnC,SAAS,OAAO;AACd,eAAO,QAAQ,OAAO,KAAK;AAAA,MAC7B;AAAA,IACF;AAAA,IACA,CAAC,WAAW,MAAM,QAAQ,QAAQ;AAAA,EACpC;AACA,SAAO,EAAE,GAAG,UAAU,KAAK;AAC7B;","names":[]}

package/dist/settings/use-settings-focus.d.ts

@@ -0,0 +1,34 @@
+/**
+ * The ring a `?focus=` target wears for {@link SETTINGS_FOCUS_MS} — keksdose's
+ * `HIGHLIGHT`, in tokens: `--brand` for the ring and the page's own surface for the gap,
+ * where keksdose named a slate for the dark theme. A ring rather than a background
+ * flash: the destructive cards already own a background tint, and a ring reads the same
+ * on every card.
+ */
+declare const SETTINGS_FOCUS_RING: string[];
+/** How long the ring stays (§3.5). */
+declare const SETTINGS_FOCUS_MS = 1800;
+/**
+ * `?focus=<anchor>` (docs/settings-harmonization.md §3.5): scroll the card into view, ring
+ * it for 1.8 s, move focus to its heading for a screen reader, then remove `focus` — and
+ * ONLY `focus` — with a replace, so a reload does not ring it again. Every other
+ * parameter stays: a tour's `tour` / `tourStep`, the admin roster's filters (dropping URL
+ * parts broke keksdose's tours once, dev#495). The hash and `location.state` stay too.
+ *
+ * A search hit, ⌘K, a tour and a mail link all arrive this way. `SettingsLayout` calls it
+ * for its own page; an app's own page can call it with no argument to act on its URL.
+ *
+ * `anchor`:
+ *  - left out: the URL's `focus` parameter;
+ *  - a string: that anchor (the layout passes the URL's, once its route is canonical);
+ *  - `null`: nothing to do yet — the layout passes it while the address is about to be
+ *    replaced, so a removal here cannot undo a redirect there.
+ *
+ * "Once its group has rendered": the effect runs after the commit that mounted the
+ * group's cards, so the card is there; a card that mounts later (lazy, or behind its
+ * data) is waited for, for a few seconds, before the hook gives up and leaves the URL
+ * as it is.
+ */
+declare function useSettingsFocus(anchor?: string | null): void;
+
+export { SETTINGS_FOCUS_MS, SETTINGS_FOCUS_RING, useSettingsFocus };

package/dist/settings/use-settings-focus.js

@@ -0,0 +1,77 @@
+"use client";
+import { useEffect, useRef } from "react";
+import { useLocation, useNavigate } from "react-router";
+const SETTINGS_FOCUS_RING = ["ring-2", "ring-[var(--brand)]", "ring-offset-2", "ring-offset-[var(--bg-page)]"];
+const SETTINGS_FOCUS_MS = 1800;
+const WAIT_MS = 5e3;
+const HEADING = "[data-settings-heading], h1, h2, h3, h4, h5, h6";
+function prefersReducedMotion() {
+  return typeof window.matchMedia === "function" && window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+}
+function useSettingsFocus(anchor) {
+  const location = useLocation();
+  const navigate = useNavigate();
+  const target = anchor === void 0 ? new URLSearchParams(location.search).get("focus") : anchor;
+  const ring = useRef(null);
+  useEffect(() => {
+    if (!target) return;
+    const { pathname, search, hash, state } = location;
+    const land = (el) => {
+      el.scrollIntoView?.({ behavior: prefersReducedMotion() ? "auto" : "smooth", block: "center" });
+      if (ring.current) {
+        window.clearTimeout(ring.current.timer);
+        ring.current.el.classList.remove(...SETTINGS_FOCUS_RING);
+      }
+      el.classList.add(...SETTINGS_FOCUS_RING);
+      el.setAttribute("data-settings-focus", "");
+      const timer = window.setTimeout(() => {
+        el.classList.remove(...SETTINGS_FOCUS_RING);
+        el.removeAttribute("data-settings-focus");
+        if (ring.current?.el === el) ring.current = null;
+      }, SETTINGS_FOCUS_MS);
+      ring.current = { el, timer };
+      const heading = el.querySelector(HEADING) ?? el;
+      if (!heading.hasAttribute("tabindex")) heading.setAttribute("tabindex", "-1");
+      heading.focus({ preventScroll: true });
+      const params = new URLSearchParams(search);
+      if (params.get("focus") !== target) return;
+      params.delete("focus");
+      const rest = params.toString();
+      navigate({ pathname, search: rest ? `?${rest}` : "", hash }, { replace: true, state });
+    };
+    const found = document.getElementById(target);
+    if (found) {
+      land(found);
+      return;
+    }
+    const observer = new MutationObserver(() => {
+      const el = document.getElementById(target);
+      if (!el) return;
+      observer.disconnect();
+      window.clearTimeout(giveUp);
+      land(el);
+    });
+    observer.observe(document.body, { childList: true, subtree: true });
+    const giveUp = window.setTimeout(() => observer.disconnect(), WAIT_MS);
+    return () => {
+      observer.disconnect();
+      window.clearTimeout(giveUp);
+    };
+  }, [target, location, navigate]);
+  useEffect(
+    () => () => {
+      const current = ring.current;
+      if (!current) return;
+      window.clearTimeout(current.timer);
+      current.el.classList.remove(...SETTINGS_FOCUS_RING);
+      current.el.removeAttribute("data-settings-focus");
+    },
+    []
+  );
+}
+export {
+  SETTINGS_FOCUS_MS,
+  SETTINGS_FOCUS_RING,
+  useSettingsFocus
+};
+//# sourceMappingURL=use-settings-focus.js.map

package/dist/settings/use-settings-focus.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/settings/use-settings-focus.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\nimport { useLocation, useNavigate } from \"react-router\";\n\n/**\n * The ring a `?focus=` target wears for {@link SETTINGS_FOCUS_MS} — keksdose's\n * `HIGHLIGHT`, in tokens: `--brand` for the ring and the page's own surface for the gap,\n * where keksdose named a slate for the dark theme. A ring rather than a background\n * flash: the destructive cards already own a background tint, and a ring reads the same\n * on every card.\n */\nexport const SETTINGS_FOCUS_RING = [\"ring-2\", \"ring-[var(--brand)]\", \"ring-offset-2\", \"ring-offset-[var(--bg-page)]\"];\n\n/** How long the ring stays (§3.5). */\nexport const SETTINGS_FOCUS_MS = 1800;\n\n/** How long a target that is not on the page yet (a lazy card, a card waiting for its\n *  data) is waited for before the hook gives up on it. */\nconst WAIT_MS = 5000;\n\nconst HEADING = \"[data-settings-heading], h1, h2, h3, h4, h5, h6\";\n\nfunction prefersReducedMotion(): boolean {\n  return typeof window.matchMedia === \"function\" && window.matchMedia(\"(prefers-reduced-motion: reduce)\").matches;\n}\n\n/**\n * `?focus=<anchor>` (docs/settings-harmonization.md §3.5): scroll the card into view, ring\n * it for 1.8 s, move focus to its heading for a screen reader, then remove `focus` — and\n * ONLY `focus` — with a replace, so a reload does not ring it again. Every other\n * parameter stays: a tour's `tour` / `tourStep`, the admin roster's filters (dropping URL\n * parts broke keksdose's tours once, dev#495). The hash and `location.state` stay too.\n *\n * A search hit, ⌘K, a tour and a mail link all arrive this way. `SettingsLayout` calls it\n * for its own page; an app's own page can call it with no argument to act on its URL.\n *\n * `anchor`:\n *  - left out: the URL's `focus` parameter;\n *  - a string: that anchor (the layout passes the URL's, once its route is canonical);\n *  - `null`: nothing to do yet — the layout passes it while the address is about to be\n *    replaced, so a removal here cannot undo a redirect there.\n *\n * \"Once its group has rendered\": the effect runs after the commit that mounted the\n * group's cards, so the card is there; a card that mounts later (lazy, or behind its\n * data) is waited for, for a few seconds, before the hook gives up and leaves the URL\n * as it is.\n */\nexport function useSettingsFocus(anchor?: string | null): void {\n  const location = useLocation();\n  const navigate = useNavigate();\n  const target = anchor === undefined ? new URLSearchParams(location.search).get(\"focus\") : anchor;\n  // The ring outlives the effect that drew it: removing `focus` from the URL re-runs the\n  // effect (and cleans it up) at once, and the ring must still stay its 1.8 s.\n  const ring = useRef<{ el: HTMLElement; timer: number } | null>(null);\n\n  useEffect(() => {\n    if (!target) return;\n    const { pathname, search, hash, state } = location;\n\n    const land = (el: HTMLElement) => {\n      el.scrollIntoView?.({ behavior: prefersReducedMotion() ? \"auto\" : \"smooth\", block: \"center\" });\n\n      if (ring.current) {\n        window.clearTimeout(ring.current.timer);\n        ring.current.el.classList.remove(...SETTINGS_FOCUS_RING);\n      }\n      el.classList.add(...SETTINGS_FOCUS_RING);\n      el.setAttribute(\"data-settings-focus\", \"\");\n      const timer = window.setTimeout(() => {\n        el.classList.remove(...SETTINGS_FOCUS_RING);\n        el.removeAttribute(\"data-settings-focus\");\n        if (ring.current?.el === el) ring.current = null;\n      }, SETTINGS_FOCUS_MS);\n      ring.current = { el, timer };\n\n      // The heading, so a screen reader starts at the card's name; the card itself when\n      // it has none. `preventScroll`: the smooth scroll above is already on its way.\n      const heading = el.querySelector<HTMLElement>(HEADING) ?? el;\n      if (!heading.hasAttribute(\"tabindex\")) heading.setAttribute(\"tabindex\", \"-1\");\n      heading.focus({ preventScroll: true });\n\n      const params = new URLSearchParams(search);\n      if (params.get(\"focus\") !== target) return;\n      params.delete(\"focus\");\n      const rest = params.toString();\n      navigate({ pathname, search: rest ? `?${rest}` : \"\", hash }, { replace: true, state });\n    };\n\n    const found = document.getElementById(target);\n    if (found) {\n      land(found);\n      return;\n    }\n    const observer = new MutationObserver(() => {\n      const el = document.getElementById(target);\n      if (!el) return;\n      observer.disconnect();\n      window.clearTimeout(giveUp);\n      land(el);\n    });\n    observer.observe(document.body, { childList: true, subtree: true });\n    const giveUp = window.setTimeout(() => observer.disconnect(), WAIT_MS);\n    return () => {\n      observer.disconnect();\n      window.clearTimeout(giveUp);\n    };\n    // `location`, a new object per navigation: the same hit picked twice is two\n    // navigations, and rings twice.\n  }, [target, location, navigate]);\n\n  useEffect(\n    () => () => {\n      const current = ring.current;\n      if (!current) return;\n      window.clearTimeout(current.timer);\n      current.el.classList.remove(...SETTINGS_FOCUS_RING);\n      current.el.removeAttribute(\"data-settings-focus\");\n    },\n    [],\n  );\n}\n"],"mappings":";AAAA,SAAS,WAAW,cAAc;AAClC,SAAS,aAAa,mBAAmB;AASlC,MAAM,sBAAsB,CAAC,UAAU,uBAAuB,iBAAiB,8BAA8B;AAG7G,MAAM,oBAAoB;AAIjC,MAAM,UAAU;AAEhB,MAAM,UAAU;AAEhB,SAAS,uBAAgC;AACvC,SAAO,OAAO,OAAO,eAAe,cAAc,OAAO,WAAW,kCAAkC,EAAE;AAC1G;AAuBO,SAAS,iBAAiB,QAA8B;AAC7D,QAAM,WAAW,YAAY;AAC7B,QAAM,WAAW,YAAY;AAC7B,QAAM,SAAS,WAAW,SAAY,IAAI,gBAAgB,SAAS,MAAM,EAAE,IAAI,OAAO,IAAI;AAG1F,QAAM,OAAO,OAAkD,IAAI;AAEnE,YAAU,MAAM;AACd,QAAI,CAAC,OAAQ;AACb,UAAM,EAAE,UAAU,QAAQ,MAAM,MAAM,IAAI;AAE1C,UAAM,OAAO,CAAC,OAAoB;AAChC,SAAG,iBAAiB,EAAE,UAAU,qBAAqB,IAAI,SAAS,UAAU,OAAO,SAAS,CAAC;AAE7F,UAAI,KAAK,SAAS;AAChB,eAAO,aAAa,KAAK,QAAQ,KAAK;AACtC,aAAK,QAAQ,GAAG,UAAU,OAAO,GAAG,mBAAmB;AAAA,MACzD;AACA,SAAG,UAAU,IAAI,GAAG,mBAAmB;AACvC,SAAG,aAAa,uBAAuB,EAAE;AACzC,YAAM,QAAQ,OAAO,WAAW,MAAM;AACpC,WAAG,UAAU,OAAO,GAAG,mBAAmB;AAC1C,WAAG,gBAAgB,qBAAqB;AACxC,YAAI,KAAK,SAAS,OAAO,GAAI,MAAK,UAAU;AAAA,MAC9C,GAAG,iBAAiB;AACpB,WAAK,UAAU,EAAE,IAAI,MAAM;AAI3B,YAAM,UAAU,GAAG,cAA2B,OAAO,KAAK;AAC1D,UAAI,CAAC,QAAQ,aAAa,UAAU,EAAG,SAAQ,aAAa,YAAY,IAAI;AAC5E,cAAQ,MAAM,EAAE,eAAe,KAAK,CAAC;AAErC,YAAM,SAAS,IAAI,gBAAgB,MAAM;AACzC,UAAI,OAAO,IAAI,OAAO,MAAM,OAAQ;AACpC,aAAO,OAAO,OAAO;AACrB,YAAM,OAAO,OAAO,SAAS;AAC7B,eAAS,EAAE,UAAU,QAAQ,OAAO,IAAI,IAAI,KAAK,IAAI,KAAK,GAAG,EAAE,SAAS,MAAM,MAAM,CAAC;AAAA,IACvF;AAEA,UAAM,QAAQ,SAAS,eAAe,MAAM;AAC5C,QAAI,OAAO;AACT,WAAK,KAAK;AACV;AAAA,IACF;AACA,UAAM,WAAW,IAAI,iBAAiB,MAAM;AAC1C,YAAM,KAAK,SAAS,eAAe,MAAM;AACzC,UAAI,CAAC,GAAI;AACT,eAAS,WAAW;AACpB,aAAO,aAAa,MAAM;AAC1B,WAAK,EAAE;AAAA,IACT,CAAC;AACD,aAAS,QAAQ,SAAS,MAAM,EAAE,WAAW,MAAM,SAAS,KAAK,CAAC;AAClE,UAAM,SAAS,OAAO,WAAW,MAAM,SAAS,WAAW,GAAG,OAAO;AACrE,WAAO,MAAM;AACX,eAAS,WAAW;AACpB,aAAO,aAAa,MAAM;AAAA,IAC5B;AAAA,EAGF,GAAG,CAAC,QAAQ,UAAU,QAAQ,CAAC;AAE/B;AAAA,IACE,MAAM,MAAM;AACV,YAAM,UAAU,KAAK;AACrB,UAAI,CAAC,QAAS;AACd,aAAO,aAAa,QAAQ,KAAK;AACjC,cAAQ,GAAG,UAAU,OAAO,GAAG,mBAAmB;AAClD,cAAQ,GAAG,gBAAgB,qBAAqB;AAAA,IAClD;AAAA,IACA,CAAC;AAAA,EACH;AACF;","names":[]}

package/dist/settings/use-settings-route.d.ts

@@ -0,0 +1,118 @@
+import { SettingsGroup, SettingsEntry } from './settings-catalogue.js';
+import 'react';
+import '../search/search-index.js';
+
+/**
+ * Which layout the settings page is in. `"auto"` follows the screen ({@link PHONE_QUERY},
+ * as `Tabs` does); `"desktop"` / `"phone"` pin one — for a preview of both side by side,
+ * where the window is one width.
+ */
+type SettingsLayoutMode = "auto" | "desktop" | "phone";
+interface UseSettingsRouteOptions<G extends string> {
+    groups: readonly SettingsGroup<G>[];
+    /** The catalogue's entries. Given, a group with no visible entry is hidden (§4.1), and
+     *  `/settings?focus=<anchor>` finds the anchor's group. */
+    entries?: readonly SettingsEntry<G>[];
+    /** `/settings` or `/admin`. */
+    basePath: string;
+    /** The group `/settings` opens on a desktop. Default: the first visible group (§4.1). */
+    defaultGroup?: G;
+    /** Retired group ids and their successors — `{ overview: "metrics" }` — applied with a
+     *  replace (§3.1, keksdose's admin). */
+    aliases?: Readonly<Partial<Record<string, G>>>;
+    /** See {@link SettingsLayoutMode}. Default `"auto"`. */
+    layout?: SettingsLayoutMode;
+}
+interface SettingsRoute<G extends string> {
+    /** The group on screen. `null` on a phone's list (and while there is no visible group). */
+    group: G | null;
+    /** The segment after the group, owned by a card; `null` without one. */
+    sub: string | null;
+    /** `?focus=<anchor>`, or `null`. */
+    focus: string | null;
+    /** Open a group: a PUSH on a phone, so the system back gesture returns to the list; a
+     *  REPLACE on a desktop, so back leaves settings instead of walking every group looked
+     *  at (§3.1, keksdose's rule). */
+    select: (group: G) => void;
+    /** See {@link SettingsLayoutContextValue.selectSub}. */
+    selectSub: (sub: string | null) => void;
+    /** To the list: `navigate(-1)` when the list is the previous entry, else a replace to
+     *  the base path — so a deep link from a mail never sends "back" out of the app. */
+    back: () => void;
+    /** The visible groups, in order. */
+    groups: SettingsGroup<G>[];
+    /** Whether the phone layout is in force. */
+    phone: boolean;
+    /** Whether this location is about to be replaced (a legacy hash, an alias, an unknown
+     *  group): what renders meanwhile is already the destination's, but nothing should
+     *  act on the URL until it is. */
+    redirecting: boolean;
+    /** Whether the list is the entry before this one (the marker {@link select} and the
+     *  list's links leave in `location.state`). */
+    fromList: boolean;
+}
+/**
+ * The `location.state` key that says "the list is the entry before this one". Written by
+ * the phone list's links and {@link SettingsRoute.select}; carried over by every replace
+ * the page makes, since a replace does not change what came before.
+ */
+declare const SETTINGS_FROM_LIST_STATE = "eifi1.settings.fromList";
+/** `location.state` with the marker set — for an app's own link to a group page that is
+ *  opened FROM the list it renders. */
+declare function settingsFromListState(): Record<string, true>;
+interface SettingsLocation {
+    pathname: string;
+    search: string;
+    hash: string;
+}
+interface SettingsLocationRules<G extends string> {
+    basePath: string;
+    /** The visible group ids. */
+    groups: readonly G[];
+    /** The resolved default group, `null` with no visible group. */
+    defaultGroup: G | null;
+    aliases?: Readonly<Partial<Record<string, G>>>;
+    /** Anchor → group, for `/settings?focus=<anchor>` with no group named. */
+    anchorGroup?: ReadonlyMap<string, G>;
+    phone: boolean;
+}
+interface SettingsLocationResult<G extends string> {
+    group: G | null;
+    sub: string | null;
+    /** The path (with query) to replace the location with, or `null` when it is already
+     *  canonical. */
+    redirect: string | null;
+}
+/**
+ * Where a location lands on the settings page — pure, so the rules of §3.1 are testable
+ * without a router:
+ *
+ *  - `/settings` → the default group on a desktop (a replace), the list on a phone;
+ *  - `/settings/<group>[/<sub>]` → that group, the rest of the path as `sub`;
+ *  - an alias → its successor, with a replace, `sub`, query and hash kept;
+ *  - an unknown or hidden group → the default group (desktop) or the list (phone), with
+ *    a replace and the query kept — never a 404, so an old bookmark still lands;
+ *  - keksdose's legacy `/settings?<query>#<group>[/<sub>]` →
+ *    `/settings/<group>[/<sub>]?<query>`, the WHOLE query carried (a tour's
+ *    `tour`/`tourStep` as well as `focus`), then resolved by the rules above;
+ *  - `/settings?focus=<anchor>` with no group → the anchor's group, where it can ring.
+ */
+declare function resolveSettingsLocation<G extends string>(location: SettingsLocation, rules: SettingsLocationRules<G>): SettingsLocationResult<G>;
+/**
+ * The settings page's route (docs/settings-harmonization.md §3.1): which group the URL
+ * names, and the history rules for moving between groups.
+ *
+ * The URL IS the selection, as it was in keksdose (where it was the hash): there is no
+ * state to keep in step with it, so a deep link, a reload, back and forward all land
+ * where the address says. Everything that is not canonical — `/settings` on a desktop, a
+ * legacy hash, an alias, an unknown or hidden group — is replaced by its canonical path.
+ *
+ * **The replace runs on every navigation**, keyed on `location.key`, not once on mount:
+ * the router keeps the page mounted across links followed inside the app — keksdose's
+ * inbox renders admin-typed URLs, and a push click routes an open window without a
+ * reload — so a legacy `/settings#security` arriving while the page is open converts too
+ * (§10.1).
+ */
+declare function useSettingsRoute<G extends string>(options: UseSettingsRouteOptions<G>): SettingsRoute<G>;
+
+export { SETTINGS_FROM_LIST_STATE, type SettingsLayoutMode, type SettingsLocation, type SettingsLocationResult, type SettingsLocationRules, type SettingsRoute, type UseSettingsRouteOptions, resolveSettingsLocation, settingsFromListState, useSettingsRoute };

package/dist/settings/use-settings-route.js

@@ -0,0 +1,120 @@
+"use client";
+import { useCallback, useEffect, useMemo } from "react";
+import { useLocation, useNavigate } from "react-router";
+import { useMediaQuery } from "../hooks/use-media-query.js";
+import { PHONE_QUERY } from "../components/ui.js";
+import { normalizeSettingsBase, visibleSettingsGroups } from "./settings-catalogue.js";
+const SETTINGS_FROM_LIST_STATE = "eifi1.settings.fromList";
+function settingsFromListState() {
+  return { [SETTINGS_FROM_LIST_STATE]: true };
+}
+function isFromList(state) {
+  return typeof state === "object" && state !== null && state[SETTINGS_FROM_LIST_STATE] === true;
+}
+function resolveSettingsLocation(location, rules) {
+  const base = normalizeSettingsBase(rules.basePath);
+  const { pathname, search, hash } = location;
+  const known = new Set(rules.groups);
+  const atBase = pathname === base || pathname === `${base}/` || base === "" && pathname === "/";
+  if (atBase) {
+    const legacy = hash.replace(/^#/, "").replace(/^\/+/, "");
+    if (legacy) {
+      const converted = `${base}/${legacy}`;
+      const next = resolveSettingsLocation({ pathname: converted, search, hash: "" }, rules);
+      return { ...next, redirect: next.redirect ?? `${converted}${search}` };
+    }
+    const anchor = new URLSearchParams(search).get("focus");
+    const anchorGroup = anchor ? rules.anchorGroup?.get(anchor) : void 0;
+    if (anchorGroup && known.has(anchorGroup)) {
+      return { group: anchorGroup, sub: null, redirect: `${base}/${anchorGroup}${search}` };
+    }
+    if (rules.phone || rules.defaultGroup === null) return { group: null, sub: null, redirect: null };
+    return { group: rules.defaultGroup, sub: null, redirect: `${base}/${rules.defaultGroup}${search}` };
+  }
+  if (!pathname.startsWith(`${base}/`)) {
+    return { group: rules.phone ? null : rules.defaultGroup, sub: null, redirect: null };
+  }
+  const rest = pathname.slice(base.length + 1);
+  const [segment = "", ...subParts] = rest.split("/");
+  const sub = subParts.filter(Boolean).join("/") || null;
+  if (known.has(segment)) return { group: segment, sub, redirect: null };
+  const successor = rules.aliases?.[segment];
+  if (successor !== void 0 && known.has(successor)) {
+    return {
+      group: successor,
+      sub,
+      redirect: `${base}/${successor}${sub ? `/${sub}` : ""}${search}${hash}`
+    };
+  }
+  if (rules.phone || rules.defaultGroup === null) {
+    return { group: null, sub: null, redirect: `${base || "/"}${search}` };
+  }
+  return { group: rules.defaultGroup, sub: null, redirect: `${base}/${rules.defaultGroup}${search}` };
+}
+function useSettingsRoute(options) {
+  const { groups, entries, basePath, defaultGroup, aliases, layout = "auto" } = options;
+  const location = useLocation();
+  const navigate = useNavigate();
+  const narrow = useMediaQuery(PHONE_QUERY, false);
+  const phone = layout === "phone" || layout === "auto" && narrow;
+  const base = normalizeSettingsBase(basePath);
+  const visible = useMemo(() => visibleSettingsGroups(groups, entries), [groups, entries]);
+  const anchorGroup = useMemo(() => {
+    const map = /* @__PURE__ */ new Map();
+    for (const e of entries ?? []) if (e.visible !== false && !map.has(e.anchor)) map.set(e.anchor, e.group);
+    return map;
+  }, [entries]);
+  const ids = visible.map((g) => g.id);
+  const fallback = defaultGroup !== void 0 && ids.includes(defaultGroup) ? defaultGroup : ids[0] ?? null;
+  const { group, sub, redirect } = resolveSettingsLocation(location, {
+    basePath: base,
+    groups: ids,
+    defaultGroup: fallback,
+    aliases,
+    anchorGroup,
+    phone
+  });
+  const { key, state, search } = location;
+  useEffect(() => {
+    if (redirect) navigate(redirect, { replace: true, state });
+  }, [key, redirect, state, navigate]);
+  const select = useCallback(
+    (next) => {
+      const to = `${base}/${next}`;
+      if (phone) navigate(to, group === null ? { state: settingsFromListState() } : void 0);
+      else navigate(to, { replace: true, state });
+    },
+    [base, phone, group, state, navigate]
+  );
+  const selectSub = useCallback(
+    (next) => {
+      if (group === null) return;
+      navigate(`${base}/${group}${next ? `/${next}` : ""}${search}`, { replace: true, state });
+    },
+    [base, group, search, state, navigate]
+  );
+  const fromList = isFromList(state);
+  const back = useCallback(() => {
+    if (fromList) navigate(-1);
+    else navigate(base || "/", { replace: true });
+  }, [fromList, base, navigate]);
+  return {
+    group,
+    sub,
+    focus: new URLSearchParams(search).get("focus"),
+    select,
+    selectSub,
+    back,
+    groups: visible,
+    phone,
+    redirecting: redirect !== null,
+    fromList
+  };
+}
+export {
+  SETTINGS_FROM_LIST_STATE,
+  resolveSettingsLocation,
+  settingsFromListState,
+  useSettingsRoute
+};
+//# sourceMappingURL=use-settings-route.js.map

package/dist/settings/use-settings-route.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/settings/use-settings-route.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo } from \"react\";\nimport { useLocation, useNavigate } from \"react-router\";\nimport { useMediaQuery } from \"../hooks/use-media-query\";\nimport { PHONE_QUERY } from \"../components/ui\";\nimport { normalizeSettingsBase, visibleSettingsGroups } from \"./settings-catalogue\";\nimport type { SettingsEntry, SettingsGroup } from \"./settings-catalogue\";\n\n/**\n * Which layout the settings page is in. `\"auto\"` follows the screen ({@link PHONE_QUERY},\n * as `Tabs` does); `\"desktop\"` / `\"phone\"` pin one — for a preview of both side by side,\n * where the window is one width.\n */\nexport type SettingsLayoutMode = \"auto\" | \"desktop\" | \"phone\";\n\nexport interface UseSettingsRouteOptions<G extends string> {\n  groups: readonly SettingsGroup<G>[];\n  /** The catalogue's entries. Given, a group with no visible entry is hidden (§4.1), and\n   *  `/settings?focus=<anchor>` finds the anchor's group. */\n  entries?: readonly SettingsEntry<G>[];\n  /** `/settings` or `/admin`. */\n  basePath: string;\n  /** The group `/settings` opens on a desktop. Default: the first visible group (§4.1). */\n  defaultGroup?: G;\n  /** Retired group ids and their successors — `{ overview: \"metrics\" }` — applied with a\n   *  replace (§3.1, keksdose's admin). */\n  aliases?: Readonly<Partial<Record<string, G>>>;\n  /** See {@link SettingsLayoutMode}. Default `\"auto\"`. */\n  layout?: SettingsLayoutMode;\n}\n\nexport interface SettingsRoute<G extends string> {\n  /** The group on screen. `null` on a phone's list (and while there is no visible group). */\n  group: G | null;\n  /** The segment after the group, owned by a card; `null` without one. */\n  sub: string | null;\n  /** `?focus=<anchor>`, or `null`. */\n  focus: string | null;\n  /** Open a group: a PUSH on a phone, so the system back gesture returns to the list; a\n   *  REPLACE on a desktop, so back leaves settings instead of walking every group looked\n   *  at (§3.1, keksdose's rule). */\n  select: (group: G) => void;\n  /** See {@link SettingsLayoutContextValue.selectSub}. */\n  selectSub: (sub: string | null) => void;\n  /** To the list: `navigate(-1)` when the list is the previous entry, else a replace to\n   *  the base path — so a deep link from a mail never sends \"back\" out of the app. */\n  back: () => void;\n  /** The visible groups, in order. */\n  groups: SettingsGroup<G>[];\n  /** Whether the phone layout is in force. */\n  phone: boolean;\n  /** Whether this location is about to be replaced (a legacy hash, an alias, an unknown\n   *  group): what renders meanwhile is already the destination's, but nothing should\n   *  act on the URL until it is. */\n  redirecting: boolean;\n  /** Whether the list is the entry before this one (the marker {@link select} and the\n   *  list's links leave in `location.state`). */\n  fromList: boolean;\n}\n\n/**\n * The `location.state` key that says \"the list is the entry before this one\". Written by\n * the phone list's links and {@link SettingsRoute.select}; carried over by every replace\n * the page makes, since a replace does not change what came before.\n */\nexport const SETTINGS_FROM_LIST_STATE = \"eifi1.settings.fromList\";\n\n/** `location.state` with the marker set — for an app's own link to a group page that is\n *  opened FROM the list it renders. */\nexport function settingsFromListState(): Record<string, true> {\n  return { [SETTINGS_FROM_LIST_STATE]: true };\n}\n\nfunction isFromList(state: unknown): boolean {\n  return typeof state === \"object\" && state !== null && (state as Record<string, unknown>)[SETTINGS_FROM_LIST_STATE] === true;\n}\n\nexport interface SettingsLocation {\n  pathname: string;\n  search: string;\n  hash: string;\n}\n\nexport interface SettingsLocationRules<G extends string> {\n  basePath: string;\n  /** The visible group ids. */\n  groups: readonly G[];\n  /** The resolved default group, `null` with no visible group. */\n  defaultGroup: G | null;\n  aliases?: Readonly<Partial<Record<string, G>>>;\n  /** Anchor → group, for `/settings?focus=<anchor>` with no group named. */\n  anchorGroup?: ReadonlyMap<string, G>;\n  phone: boolean;\n}\n\nexport interface SettingsLocationResult<G extends string> {\n  group: G | null;\n  sub: string | null;\n  /** The path (with query) to replace the location with, or `null` when it is already\n   *  canonical. */\n  redirect: string | null;\n}\n\n/**\n * Where a location lands on the settings page — pure, so the rules of §3.1 are testable\n * without a router:\n *\n *  - `/settings` → the default group on a desktop (a replace), the list on a phone;\n *  - `/settings/<group>[/<sub>]` → that group, the rest of the path as `sub`;\n *  - an alias → its successor, with a replace, `sub`, query and hash kept;\n *  - an unknown or hidden group → the default group (desktop) or the list (phone), with\n *    a replace and the query kept — never a 404, so an old bookmark still lands;\n *  - keksdose's legacy `/settings?<query>#<group>[/<sub>]` →\n *    `/settings/<group>[/<sub>]?<query>`, the WHOLE query carried (a tour's\n *    `tour`/`tourStep` as well as `focus`), then resolved by the rules above;\n *  - `/settings?focus=<anchor>` with no group → the anchor's group, where it can ring.\n */\nexport function resolveSettingsLocation<G extends string>(\n  location: SettingsLocation,\n  rules: SettingsLocationRules<G>,\n): SettingsLocationResult<G> {\n  const base = normalizeSettingsBase(rules.basePath);\n  const { pathname, search, hash } = location;\n  const known = new Set<string>(rules.groups);\n  const atBase = pathname === base || pathname === `${base}/` || (base === \"\" && pathname === \"/\");\n\n  if (atBase) {\n    const legacy = hash.replace(/^#/, \"\").replace(/^\\/+/, \"\");\n    if (legacy) {\n      // The hash becomes the path; whatever the path then says (an alias, an unknown\n      // group) is resolved in the same step, so the history sees one replace.\n      const converted = `${base}/${legacy}`;\n      const next = resolveSettingsLocation({ pathname: converted, search, hash: \"\" }, rules);\n      return { ...next, redirect: next.redirect ?? `${converted}${search}` };\n    }\n    const anchor = new URLSearchParams(search).get(\"focus\");\n    const anchorGroup = anchor ? rules.anchorGroup?.get(anchor) : undefined;\n    if (anchorGroup && known.has(anchorGroup)) {\n      return { group: anchorGroup, sub: null, redirect: `${base}/${anchorGroup}${search}` };\n    }\n    if (rules.phone || rules.defaultGroup === null) return { group: null, sub: null, redirect: null };\n    return { group: rules.defaultGroup, sub: null, redirect: `${base}/${rules.defaultGroup}${search}` };\n  }\n\n  if (!pathname.startsWith(`${base}/`)) {\n    // Mounted somewhere `basePath` does not name: a misconfiguration, not a link to\n    // correct. Show what the base path would, and leave the address alone.\n    return { group: rules.phone ? null : rules.defaultGroup, sub: null, redirect: null };\n  }\n  const rest = pathname.slice(base.length + 1);\n  const [segment = \"\", ...subParts] = rest.split(\"/\");\n  const sub = subParts.filter(Boolean).join(\"/\") || null;\n  if (known.has(segment)) return { group: segment as G, sub, redirect: null };\n\n  const successor = rules.aliases?.[segment];\n  if (successor !== undefined && known.has(successor)) {\n    return {\n      group: successor,\n      sub,\n      redirect: `${base}/${successor}${sub ? `/${sub}` : \"\"}${search}${hash}`,\n    };\n  }\n\n  // Unknown or hidden. The hash is dropped: on the list it would read as a legacy group\n  // and send the page round again.\n  if (rules.phone || rules.defaultGroup === null) {\n    return { group: null, sub: null, redirect: `${base || \"/\"}${search}` };\n  }\n  return { group: rules.defaultGroup, sub: null, redirect: `${base}/${rules.defaultGroup}${search}` };\n}\n\n/**\n * The settings page's route (docs/settings-harmonization.md §3.1): which group the URL\n * names, and the history rules for moving between groups.\n *\n * The URL IS the selection, as it was in keksdose (where it was the hash): there is no\n * state to keep in step with it, so a deep link, a reload, back and forward all land\n * where the address says. Everything that is not canonical — `/settings` on a desktop, a\n * legacy hash, an alias, an unknown or hidden group — is replaced by its canonical path.\n *\n * **The replace runs on every navigation**, keyed on `location.key`, not once on mount:\n * the router keeps the page mounted across links followed inside the app — keksdose's\n * inbox renders admin-typed URLs, and a push click routes an open window without a\n * reload — so a legacy `/settings#security` arriving while the page is open converts too\n * (§10.1).\n */\nexport function useSettingsRoute<G extends string>(options: UseSettingsRouteOptions<G>): SettingsRoute<G> {\n  const { groups, entries, basePath, defaultGroup, aliases, layout = \"auto\" } = options;\n  const location = useLocation();\n  const navigate = useNavigate();\n  const narrow = useMediaQuery(PHONE_QUERY, false);\n  const phone = layout === \"phone\" || (layout === \"auto\" && narrow);\n  const base = normalizeSettingsBase(basePath);\n\n  const visible = useMemo(() => visibleSettingsGroups(groups, entries), [groups, entries]);\n  const anchorGroup = useMemo(() => {\n    const map = new Map<string, G>();\n    for (const e of entries ?? []) if (e.visible !== false && !map.has(e.anchor)) map.set(e.anchor, e.group);\n    return map;\n  }, [entries]);\n  const ids = visible.map((g) => g.id);\n  const fallback =\n    defaultGroup !== undefined && ids.includes(defaultGroup) ? defaultGroup : (ids[0] ?? null);\n\n  const { group, sub, redirect } = resolveSettingsLocation(location, {\n    basePath: base,\n    groups: ids,\n    defaultGroup: fallback,\n    aliases,\n    anchorGroup,\n    phone,\n  });\n\n  const { key, state, search } = location;\n  useEffect(() => {\n    // `state` rides along: the marker describes the entry BEFORE this one, which a\n    // replace does not change.\n    if (redirect) navigate(redirect, { replace: true, state });\n  }, [key, redirect, state, navigate]);\n\n  const select = useCallback(\n    (next: G) => {\n      const to = `${base}/${next}`;\n      // From the list, the push marks it, so the group page's back is a real back.\n      if (phone) navigate(to, group === null ? { state: settingsFromListState() } : undefined);\n      // A new group is a new page: the old one's query (a focus, a roster filter) stays\n      // behind, as keksdose's `selectGroup` left it.\n      else navigate(to, { replace: true, state });\n    },\n    [base, phone, group, state, navigate],\n  );\n\n  const selectSub = useCallback(\n    (next: string | null) => {\n      if (group === null) return;\n      navigate(`${base}/${group}${next ? `/${next}` : \"\"}${search}`, { replace: true, state });\n    },\n    [base, group, search, state, navigate],\n  );\n\n  const fromList = isFromList(state);\n  const back = useCallback(() => {\n    if (fromList) navigate(-1);\n    else navigate(base || \"/\", { replace: true });\n  }, [fromList, base, navigate]);\n\n  return {\n    group,\n    sub,\n    focus: new URLSearchParams(search).get(\"focus\"),\n    select,\n    selectSub,\n    back,\n    groups: visible,\n    phone,\n    redirecting: redirect !== null,\n    fromList,\n  };\n}\n"],"mappings":"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","names":[]}

package/dist/shell/app-shell.d.ts

@@ -1,7 +1,7 @@
 import * as react from 'react';
 import { ComponentPropsWithoutRef, ReactNode } from 'react';
 import { LucideIcon } from 'lucide-react';
-import { dR as KitLinkComponent } from '../delete-account-setting-CGVMckMw.js';
+import { dR as KitLinkComponent } from '../delete-account-setting-CpIhzxxZ.js';
 import '../components/tooltip.js';
 import '../hooks/use-anchored-rect.js';
 import '../lib/clipping.js';
@@ -55,6 +55,8 @@ import '../components/image-grid.js';
 import '../components/lightbox.js';
 import '../components/write-lock.js';
 import '../auth/sign-in-form.js';
+import '../landing/access.js';
+import '../landing/landing-labels.js';
 import './topbar-controls.js';
 import '../theme/palette-presets.js';
 import '../theme/chart-palette.js';
@@ -76,6 +78,8 @@ import '../account/data-export-setting.js';
 import '../components/account-chips.js';
 import '../admin/admin-parts.js';
 import '../admin/admin-action-log.js';
+import '../settings/settings-labels.js';
+import '../demo/demo-labels.js';
 import '../components/reauth-dialog.js';
 import '../components/server-wake.js';
 import '../lib/server-wake.js';
@@ -111,6 +115,12 @@ interface AppShellNavItem {
      *  shortening the real label, which the sidebar has ample room for and which is the
      *  name the rest of the product uses. */
     shortLabel?: string;
+    /** 0.31.0: leave this entry out of the MOBILE BOTTOM BAR; the sidebar keeps it.
+     *  For an entry a phone reaches another way — the brand link to the start page —
+     *  when one cell fewer is what keeps the others' labels whole (the bar divides its
+     *  width evenly, see `shortLabel`). Its group's sub-row still shows while one of its
+     *  pages is open. Named like `DataTable`'s column `mobileHidden`. */
+    mobileHidden?: boolean;
     icon: LucideIcon;
     /** Passed to NavLink's `end` (exact match). Defaults to true. */
     end?: boolean;

package/dist/shell/app-shell.js

@@ -57,6 +57,7 @@ function AppShell({
   ...rest
 }) {
   const embedded = useContext(AppShellNesting) || !!embeddedProp;
+  const barNav = nav.filter((item) => !item.mobileHidden);
   const collapseStorageKey = collapseStorageKeyProp ?? (embedded ? null : "appLayout.sidebarCollapsed");
   const labels = useKitLabels("appShell", DEFAULT_APP_SHELL_LABELS, {
     collapse: collapseLabel,
@@ -174,8 +175,8 @@ function AppShell({
                   {
                     "data-tour": "nav",
                     className: "grid",
-                    style: { gridTemplateColumns: `repeat(${nav.length}, minmax(0, 1fr))` },
-                    children: nav.map((item) => /* @__PURE__ */ jsx(MobileNavItem, { item }, item.to))
+                    style: { gridTemplateColumns: `repeat(${barNav.length}, minmax(0, 1fr))` },
+                    children: barNav.map((item) => /* @__PURE__ */ jsx(MobileNavItem, { item }, item.to))
                   }
                 )
               ]