gridsmith-ui 0.29.0 → 0.30.0

package/dist/chunk-TYNDXMBV.js

@@ -0,0 +1,105 @@
+"use client";
+import { formatLocale } from './chunk-7QLXYRPD.js';
+import { warnOnce } from './chunk-L6HWACK7.js';
+import { createContext, useMemo, useContext } from 'react';
+
+// ../../showcase/src/lib/relative-time.ts
+var MINUTE = 6e4;
+var HOUR = 60 * MINUTE;
+var DAY = 24 * HOUR;
+var HOUSE_RELATIVE_THRESHOLD_HOURS = 24;
+function toMillis(time) {
+  if (time instanceof Date) return time.getTime();
+  if (typeof time === "number") return time;
+  if (typeof time !== "string") return NaN;
+  const day = /^(\d{4})-(\d{2})-(\d{2})$/.exec(time.trim());
+  if (day) return new Date(Number(day[1]), Number(day[2]) - 1, Number(day[3])).getTime();
+  return Date.parse(time);
+}
+var ISO_8601 = /^(\d{4})-(\d{2})-(\d{2})(?:T\d{2}:\d{2}(?::\d{2}(?:\.\d+)?)?(?:Z|[+-]\d{2}:\d{2})?)?$/;
+function datedMillis(time) {
+  if (typeof time !== "string") return toMillis(time);
+  const iso = ISO_8601.exec(time);
+  if (!iso) return NaN;
+  const [year, month, day] = [Number(iso[1]), Number(iso[2]) - 1, Number(iso[3])];
+  const check = /* @__PURE__ */ new Date(0);
+  check.setUTCFullYear(year, month, day);
+  if (check.getUTCFullYear() !== year || check.getUTCMonth() !== month || check.getUTCDate() !== day) return NaN;
+  return toMillis(time);
+}
+function thresholdOf(hours, from) {
+  if (typeof hours === "number" && Number.isFinite(hours) && hours >= 0) return hours;
+  const house = HOUSE_RELATIVE_THRESHOLD_HOURS;
+  warnOnce(from, `a threshold of ${String(hours)} isn't a number of hours, so the house's ${house} is used.`);
+  return house;
+}
+function midnight(t) {
+  const d = new Date(t);
+  d.setHours(0, 0, 0, 0);
+  return d.getTime();
+}
+function formatRelativeTime(time, options) {
+  const at = toMillis(time);
+  if (!Number.isFinite(at)) return "";
+  const now = options.now ?? Date.now();
+  const locale = options.locale ?? formatLocale();
+  const diff = at - now;
+  const age = Math.abs(diff);
+  if (age > thresholdOf(options.thresholdHours, "formatRelativeTime") * HOUR) return new Intl.DateTimeFormat(locale, { dateStyle: "medium", timeStyle: "short" }).format(at);
+  const rtf = new Intl.RelativeTimeFormat(locale, { numeric: "auto" });
+  if (age < MINUTE) return rtf.format(0, "second");
+  if (age < HOUR) return rtf.format(Math.trunc(diff / MINUTE), "minute");
+  if (age < DAY) return rtf.format(Math.trunc(diff / HOUR), "hour");
+  return rtf.format(Math.round((midnight(at) - midnight(now)) / DAY), "day");
+}
+function formatFullTime(time, locale) {
+  const at = toMillis(time);
+  return Number.isFinite(at) ? new Intl.DateTimeFormat(locale ?? formatLocale(), { year: "numeric", month: "long", day: "numeric", hour: "numeric", minute: "2-digit", timeZoneName: "short" }).format(at) : "";
+}
+var PreferencesContext = createContext(null);
+var HOUSE_DEFAULTS = {
+  validationTiming: "onBlur",
+  formActions: { align: "end", placement: "auto" },
+  itemsPerPage: 25,
+  paginationStyle: "pagination",
+  tableToCardsBreakpoint: "md",
+  emptyStyle: "illustration-cta",
+  loadingStyle: "skeleton",
+  destructiveMode: "dialog",
+  highSeverityActions: ["delete_account", "remove_team_member"],
+  typeToConfirmActions: ["delete_account"],
+  undoWindowSeconds: 5,
+  relativeThresholdHours: HOUSE_RELATIVE_THRESHOLD_HOURS,
+  canNavigateBack: true
+};
+var PREFERENCE_HOUSE_DEFAULTS = Object.freeze(HOUSE_DEFAULTS);
+function usePreferences() {
+  const raw = useShellPreferences();
+  return useMemo(() => resolvePreferences(raw), [raw]);
+}
+function resolvePreferences(raw) {
+  const d = PREFERENCE_HOUSE_DEFAULTS;
+  const out = { ...d, formActions: { ...d.formActions }, highSeverityActions: [...d.highSeverityActions], typeToConfirmActions: [...d.typeToConfirmActions] };
+  for (const [key, value] of Object.entries(raw)) {
+    if (value === void 0) continue;
+    if (key === "formActions") {
+      const actions = value;
+      if (actions?.align !== void 0) out.formActions.align = actions.align;
+      if (actions?.placement !== void 0) out.formActions.placement = actions.placement;
+      continue;
+    }
+    out[key] = value;
+  }
+  return out;
+}
+function useShellPreferences() {
+  return useContext(PreferencesContext) ?? EMPTY;
+}
+var EMPTY = Object.freeze({});
+function preferenceActionKey(label) {
+  return label.trim().toLowerCase().replace(/[^a-z0-9]+/g, "_").replace(/^_|_$/g, "");
+}
+
+export { DAY, HOUR, MINUTE, PREFERENCE_HOUSE_DEFAULTS, PreferencesContext, datedMillis, formatFullTime, formatRelativeTime, preferenceActionKey, thresholdOf, toMillis, usePreferences, useShellPreferences };
+//# sourceMappingURL=chunk-TYNDXMBV.js.map
+//# sourceMappingURL=chunk-TYNDXMBV.js.map

package/dist/chunk-TYNDXMBV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../showcase/src/lib/relative-time.ts","../../../showcase/src/lib/preferences.ts"],"names":[],"mappings":"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","file":"chunk-TYNDXMBV.js","sourcesContent":["import { warnOnce } from \"./dev-warn\";\nimport { formatLocale } from \"./format-locale\";\n\n/**\n * Times as people read them, relative or in full (Sprint 25.17 A29), apart from the RelativeTime component since Sprint\n * 25.22 (nothing here needs React). Not on `gridsmith-ui/utils` (that sprint's review): a relative time and a full one\n * depend on the visitor's clock and time zone, which a server doesn't know, so a server page hands RelativeTime the time.\n */\n\n/** A time: an ISO string, a Date, or milliseconds since the epoch. */\nexport type TimeValue = string | Date | number;\n\nexport const MINUTE = 60_000;\nexport const HOUR = 60 * MINUTE;\nexport const DAY = 24 * HOUR;\n\n/** The house's threshold, dateTime.relativeThresholdHours: within this many hours a time reads relative. The shell's preferences default to it. */\nexport const HOUSE_RELATIVE_THRESHOLD_HOURS = 24;\n\nexport function toMillis(time: TimeValue): number {\n  if (time instanceof Date) return time.getTime();\n  if (typeof time === \"number\") return time;\n  if (typeof time !== \"string\") return NaN;\n  // a date alone (\"2026-09-01\") is that day on the calendar here, as people read it: Date.parse reads it as midnight in\n  // UTC, which New York showed as the evening before (the 25.17 second review)\n  const day = /^(\\d{4})-(\\d{2})-(\\d{2})$/.exec(time.trim());\n  if (day) return new Date(Number(day[1]), Number(day[2]) - 1, Number(day[3])).getTime();\n  return Date.parse(time);\n}\n\n/**\n * ISO 8601's extended form, as ECMAScript's date-time format writes it: a calendar date, then perhaps a time (hours and\n * minutes, perhaps seconds and a fraction) and perhaps its zone, Z or ±hh:mm (±hhmm is ISO 8601 too, but outside the\n * format every browser must read, so it stays text).\n */\nconst ISO_8601 = /^(\\d{4})-(\\d{2})-(\\d{2})(?:T\\d{2}:\\d{2}(?::\\d{2}(?:\\.\\d+)?)?(?:Z|[+-]\\d{2}:\\d{2})?)?$/;\n\n/**\n * A time's milliseconds when it can be dated, else NaN (Sprint 25.8.7 item 10): a Date or a number as it is, a string\n * only in ISO 8601's form and on a day the calendar has. Date.parse guesses at other text (\"March 3\" is 3 March 2001,\n * \"12\" December 2001) and carries a day past its month's end into the next (\"2026-02-30\" is 2 March), so text that\n * only reads like a time (\"2 days ago\", \"Yesterday\") is never given a date.\n */\nexport function datedMillis(time: TimeValue): number {\n  if (typeof time !== \"string\") return toMillis(time);\n  const iso = ISO_8601.exec(time);\n  if (!iso) return NaN;\n  const [year, month, day] = [Number(iso[1]), Number(iso[2]) - 1, Number(iso[3])];\n  // in UTC, so no zone moves the day; setUTCFullYear, since Date.UTC reads the years 0–99 as 1900–1999\n  const check = new Date(0);\n  check.setUTCFullYear(year, month, day);\n  if (check.getUTCFullYear() !== year || check.getUTCMonth() !== month || check.getUTCDate() !== day) return NaN;\n  return toMillis(time);\n}\n\n/**\n * A threshold as given, or the house's when it isn't a number of hours (a missing setting read as `Number(undefined)`\n * re-rendered every time in a loop: the 25.17 second review), which development builds are told about.\n */\nexport function thresholdOf(hours: unknown, from: string): number {\n  if (typeof hours === \"number\" && Number.isFinite(hours) && hours >= 0) return hours;\n  const house = HOUSE_RELATIVE_THRESHOLD_HOURS;\n  warnOnce(from, `a threshold of ${String(hours)} isn't a number of hours, so the house's ${house} is used.`);\n  return house;\n}\n\n/** Local midnight before a moment: days are counted on the calendar, so Monday 23:30 is two days before Wednesday 00:30. */\nfunction midnight(t: number): number {\n  const d = new Date(t);\n  d.setHours(0, 0, 0, 0);\n  return d.getTime();\n}\n\n/**\n * A time as people read it (Sprint 25.17 A29, R28-48; date_time#1, #11 and #13): within `thresholdHours` of now,\n * relative (\"now\", \"5 minutes ago\", \"in 2 hours\", \"yesterday\", counting days on the calendar), in the page's language;\n * beyond it, the date and the time. The threshold is given: the project's is the shell's\n * (dateTime.relativeThresholdHours), which RelativeTime and useRelativeTimeFormat read for you.\n */\nexport function formatRelativeTime(time: TimeValue, options: { thresholdHours: number; now?: number; locale?: string }): string {\n  const at = toMillis(time);\n  if (!Number.isFinite(at)) return \"\";\n  const now = options.now ?? Date.now();\n  // the locale given (a component's useFormatLocale(), Sprint 25.20), else the browser's reading\n  const locale = options.locale ?? formatLocale();\n  const diff = at - now;\n  const age = Math.abs(diff);\n  // past the threshold the moment itself: a log or a table keeps its time of day (the review: a log read \"1 Oct 2026\"\n  // on every row)\n  if (age > thresholdOf(options.thresholdHours, \"formatRelativeTime\") * HOUR) return new Intl.DateTimeFormat(locale, { dateStyle: \"medium\", timeStyle: \"short\" }).format(at);\n  // whole units, counted as they pass (\"5 minutes ago\" until the sixth minute), so the text changes when the shown time\n  // refreshes, on the minute or the hour\n  const rtf = new Intl.RelativeTimeFormat(locale, { numeric: \"auto\" });\n  if (age < MINUTE) return rtf.format(0, \"second\");\n  if (age < HOUR) return rtf.format(Math.trunc(diff / MINUTE), \"minute\");\n  if (age < DAY) return rtf.format(Math.trunc(diff / HOUR), \"hour\");\n  return rtf.format(Math.round((midnight(at) - midnight(now)) / DAY), \"day\");\n}\n\n/**\n * The full timestamp, as the tooltip and a screen reader give it: the date, the time and its zone, in the locale given\n * (a component's useFormatLocale()), else the browser's reading.\n */\nexport function formatFullTime(time: TimeValue, locale?: string): string {\n  const at = toMillis(time);\n  return Number.isFinite(at)\n    ? new Intl.DateTimeFormat(locale ?? formatLocale(), { year: \"numeric\", month: \"long\", day: \"numeric\", hour: \"numeric\", minute: \"2-digit\", timeZoneName: \"short\" }).format(at)\n    : \"\";\n}\n","/**\n * The customer's UX preferences, carried once by AppShell the way the theme is (Sprint 25.6 B9).\n *\n * The generated shell passes the object the template emits from the profile's rules; the builder preview passes the\n * same values from the theme state. Components default from it when no prop is passed — FormWrapper's validation mode\n * and actions alignment, Table and DataGrid's mobile breakpoint, Pagination's page size, EmptyState's style, the\n * destructive-action helper's mode, lists and undo window, and RelativeTime's threshold (Sprint 25.17 A29) and a flow's going back (useFlowSteps, Sprint 25.19 S3) — so a page\n * gets the customer's value by doing nothing. A\n * prop always wins; a component outside any shell keeps the default it always had (components read\n * `useShellPreferences`). App code reads `usePreferences`, which fills every field (round 21); a paged list reads its\n * page size through `usePagination`.\n */\nimport { createContext, useContext, useMemo } from \"react\";\nimport { HOUSE_RELATIVE_THRESHOLD_HOURS } from \"./relative-time\";\n\nexport type PreferenceValidationTiming = \"onBlur\" | \"onSubmit\" | \"onChange\";\nexport type PreferenceBreakpoint = \"sm\" | \"md\" | \"lg\";\nexport type PreferenceEmptyStyle = \"illustration-cta\" | \"text-cta\" | \"redirect\";\nexport type PreferenceLoadingStyle = \"skeleton\" | \"spinner\" | \"progress-bar\";\nexport type PreferenceDestructiveMode = \"dialog\" | \"undo\";\n/** dataDisplay.paginationStyle — how a long list shows more: page numbers, a Load more button, or loading as the user scrolls. */\nexport type PreferencePaginationStyle = \"pagination\" | \"load-more\" | \"infinite-scroll\";\n\nexport interface AppShellPreferences {\n  /** forms.validationTiming — when a field first shows its error. */\n  validationTiming?: PreferenceValidationTiming;\n  /** forms.actions — where a form's buttons sit and how they align. */\n  formActions?: { align?: \"start\" | \"end\"; placement?: \"auto\" | \"inline\" };\n  /** dataDisplay.itemsPerPage — the page size of a paged or load-more list. */\n  itemsPerPage?: number;\n  /** dataDisplay.paginationStyle — page numbers, a Load more button, or loading on scroll; usePagination and Pagination follow it (round 22). */\n  paginationStyle?: PreferencePaginationStyle;\n  /** responsive.tableToCardsBreakpoint — below this width a Table becomes stacked cards. */\n  tableToCardsBreakpoint?: PreferenceBreakpoint;\n  /** emptyStates.emptyStyle — illustration with an action, text with an action, or redirect to creation. */\n  emptyStyle?: PreferenceEmptyStyle;\n  /** emptyStates.loadingStyle — what a page shows while data loads. */\n  loadingStyle?: PreferenceLoadingStyle;\n  /** destructiveActions.mode — confirm in a dialog, or act now with an Undo toast. */\n  destructiveMode?: PreferenceDestructiveMode;\n  /** destructiveActions.highSeverityActions — always confirm in a dialog, even in undo mode. */\n  highSeverityActions?: string[];\n  /** destructiveActions.typeToConfirmActions — the user types the name before the confirm enables. */\n  typeToConfirmActions?: string[];\n  /** destructiveActions.undoWindowSeconds — how long the Undo toast stays. */\n  undoWindowSeconds?: number;\n  /** dateTime.relativeThresholdHours — within this many hours a time reads relative (\"2 hours ago\"), older the date (RelativeTime). */\n  relativeThresholdHours?: number;\n  /**\n   * forms.canNavigateBack — a flow with steps lets the user go back (Sprint 25.19 S3). On, its step list opens any step\n   * already reached and it has a Back; off, the list only shows progress and there is no Back. useFlowSteps reads it.\n   */\n  canNavigateBack?: boolean;\n}\n\nexport const PreferencesContext = createContext<AppShellPreferences | null>(null);\n\n/** Every preference in force, the shell's value or the house default — what app code reads. */\nexport interface ResolvedPreferences {\n  validationTiming: PreferenceValidationTiming;\n  formActions: { align: \"start\" | \"end\"; placement: \"auto\" | \"inline\" };\n  itemsPerPage: number;\n  paginationStyle: PreferencePaginationStyle;\n  tableToCardsBreakpoint: PreferenceBreakpoint;\n  emptyStyle: PreferenceEmptyStyle;\n  loadingStyle: PreferenceLoadingStyle;\n  destructiveMode: PreferenceDestructiveMode;\n  highSeverityActions: string[];\n  typeToConfirmActions: string[];\n  undoWindowSeconds: number;\n  relativeThresholdHours: number;\n  canNavigateBack: boolean;\n}\n\n/**\n * The house defaults for the fields the shell carries: the platform's preference-defaults.ts, mirrored in\n * decisions-schema.ts (DEFAULT_PATTERN_DECISIONS); a test keeps the three equal.\n */\nconst HOUSE_DEFAULTS: ResolvedPreferences = {\n  validationTiming: \"onBlur\",\n  formActions: { align: \"end\", placement: \"auto\" },\n  itemsPerPage: 25,\n  paginationStyle: \"pagination\",\n  tableToCardsBreakpoint: \"md\",\n  emptyStyle: \"illustration-cta\",\n  loadingStyle: \"skeleton\",\n  destructiveMode: \"dialog\",\n  highSeverityActions: [\"delete_account\", \"remove_team_member\"],\n  typeToConfirmActions: [\"delete_account\"],\n  undoWindowSeconds: 5,\n  relativeThresholdHours: HOUSE_RELATIVE_THRESHOLD_HOURS,\n  canNavigateBack: true,\n};\nexport const PREFERENCE_HOUSE_DEFAULTS: Readonly<ResolvedPreferences> = Object.freeze(HOUSE_DEFAULTS);\n\n/**\n * For app code: every preference in force — the shell's value, else the house default — so a page never writes a\n * fallback of its own. Round 21 (run 58): with every field optional, TypeScript made the builder write\n * `const { itemsPerPage = 20 } = usePreferences()`, a second copy of the preference it then edited by hand when the\n * rule changed. Paged lists use `usePagination`, which reads the page size itself.\n */\nexport function usePreferences(): ResolvedPreferences {\n  const raw = useShellPreferences();\n  return useMemo(() => resolvePreferences(raw), [raw]);\n}\n\n/** The shell's values over the house defaults; a field the shell leaves undefined keeps its default. */\nexport function resolvePreferences(raw: AppShellPreferences): ResolvedPreferences {\n  const d = PREFERENCE_HOUSE_DEFAULTS;\n  const out: ResolvedPreferences = { ...d, formActions: { ...d.formActions }, highSeverityActions: [...d.highSeverityActions], typeToConfirmActions: [...d.typeToConfirmActions] };\n  for (const [key, value] of Object.entries(raw) as Array<[keyof AppShellPreferences, unknown]>) {\n    if (value === undefined) continue;\n    if (key === \"formActions\") {\n      const actions = value as AppShellPreferences[\"formActions\"];\n      if (actions?.align !== undefined) out.formActions.align = actions.align;\n      if (actions?.placement !== undefined) out.formActions.placement = actions.placement;\n      continue;\n    }\n    (out as unknown as Record<string, unknown>)[key] = value;\n  }\n  return out;\n}\n\n/**\n * For components: only what the shell passed, or an empty object outside any shell — a component with no prop takes\n * the shell's value, and a bare component keeps the default it always had.\n */\nexport function useShellPreferences(): AppShellPreferences {\n  return useContext(PreferencesContext) ?? EMPTY;\n}\n\nconst EMPTY: AppShellPreferences = Object.freeze({});\n\n/**\n * \"Remove range\" → \"remove_range\": the key the high-severity and type-to-confirm lists use. The engine's `actionKey`\n * (platform/src/lib/destructive-mode.ts) is the same rule for compliance; a platform test keeps the two identical.\n */\nexport function preferenceActionKey(label: string): string {\n  return label.trim().toLowerCase().replace(/[^a-z0-9]+/g, \"_\").replace(/^_|_$/g, \"\");\n}\n"]}

package/dist/{chunk-OPFJEL3Z.js → chunk-UNS4TGGK.js}

@@ -1,16 +1,16 @@
 "use client";
-import { PreferencesContext, Button } from './chunk-R4GXKH4U.js';
-import { useBreakpoint, readBreakpointPx } from './chunk-CRQ6KCRD.js';
-import { FormChangeCtx } from './chunk-XVB55M3N.js';
-import { SurfaceBoundary } from './chunk-QM4SJKWV.js';
+import { PreferencesContext } from './chunk-TYNDXMBV.js';
+import { FormChangeCtx } from './chunk-72SDAX54.js';
+import { SurfaceBoundary, Button } from './chunk-Q36JVJX4.js';
+import { useBreakpoint, readBreakpointPx } from './chunk-ZHUVLBCC.js';
 import { useRevealFocus } from './chunk-HTXP5BMM.js';
-import { usePopupFocus, useOverlayLayer, useReturnFocus, useFocusTrap, focusInitial, useNonModalDialog, OVERLAY_CLOSE_ATTR } from './chunk-ZI3OQDET.js';
-import { useTextOverflow, Tooltip } from './chunk-GXMTS3YD.js';
-import { Icon } from './chunk-TJEV7YAY.js';
+import { usePopupFocus, useOverlayLayer, useReturnFocus, useFocusTrap, focusInitial, useNonModalDialog, OVERLAY_CLOSE_ATTR } from './chunk-OIOII5L6.js';
+import { useTextOverflow, AutoTooltip } from './chunk-GQVBZ4GW.js';
+import { Icon } from './chunk-L6HWACK7.js';
 import { usePosition } from './chunk-HP7WUZPK.js';
 import { useLatest } from './chunk-WH2FUFAC.js';
-import { cn, FOCUS_RING, FOCUS_INSET, lockBodyScroll, unlockBodyScroll, OVERLAY_SURFACE, GLASS_OVERLAY, GROUP_FOCUS_RING } from './chunk-66JJCQU3.js';
-import { createContext, version, forwardRef, useState, useCallback, useRef, useEffect, isValidElement, useContext, useMemo, useId, useLayoutEffect } from 'react';
+import { cn, FOCUS_RING, FOCUS_INSET, lockBodyScroll, unlockBodyScroll, OVERLAY_SURFACE, GLASS_OVERLAY, GROUP_FOCUS_RING } from './chunk-JTU7OBYJ.js';
+import { createContext, version, forwardRef, useState, useCallback, useRef, useEffect, useContext, useMemo, useId, useLayoutEffect } from 'react';
 import { createPortal } from 'react-dom';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
@@ -59,6 +59,62 @@ function useCloseSettle(open, elRef, onSettled) {
     };
   }, [open, elRef, cb]);
 }
+var TOAST_INSET_VARS = {
+  "bottom-right": "--ds-toast-inset-bottom-right",
+  "bottom-left": "--ds-toast-inset-bottom-left",
+  "bottom-center": "--ds-toast-inset-bottom-center",
+  right: "--ds-toast-inset-right",
+  left: "--ds-toast-inset-left",
+  top: "--ds-toast-inset-top"
+};
+function besideRoom(room) {
+  return `min(${room}, calc(100% - 280px - var(--ds-space-4)))`;
+}
+var LAUNCHER_INSET_PRIORITY = 1;
+var PANEL_INSET_PRIORITY = 2;
+var NAVBAR_INSET_PRIORITY = 1;
+var registry = /* @__PURE__ */ new WeakMap();
+var seq = 0;
+function claimsFor(target) {
+  let entry = registry.get(target);
+  if (!entry) {
+    entry = { "bottom-right": [], "bottom-left": [], "bottom-center": [], right: [], left: [], top: [] };
+    registry.set(target, entry);
+  }
+  return entry;
+}
+function winner(claims) {
+  let best = null;
+  for (const c of claims) {
+    if (!best || c.priority > best.priority || c.priority === best.priority && c.seq > best.seq) best = c;
+  }
+  return best;
+}
+function apply(target, corner) {
+  const style = target.style;
+  if (!style) return;
+  const best = winner(claimsFor(target)[corner]);
+  if (best) style.setProperty(TOAST_INSET_VARS[corner], best.inset);
+  else style.removeProperty(TOAST_INSET_VARS[corner]);
+}
+function claimCornerInset(corner, inset, priority, target) {
+  const claim = { inset, priority, seq: ++seq };
+  const list = claimsFor(target)[corner];
+  list.push(claim);
+  apply(target, corner);
+  return () => {
+    const i = list.indexOf(claim);
+    if (i >= 0) list.splice(i, 1);
+    apply(target, corner);
+  };
+}
+function useCornerInset(corner, inset, priority, target) {
+  useEffect(() => {
+    if (!corner || !inset) return;
+    const el = target ?? document.documentElement;
+    return claimCornerInset(corner, inset, priority, el);
+  }, [corner, inset, priority, target]);
+}
 var STEP = 16;
 var BIG_STEP = 64;
 function clamp(v, min, max) {
@@ -409,7 +465,7 @@ function Drawer(props) {
   const { position = "right", mobile, open, onClose, footer, dirty, onDiscard } = props;
   const shellWidth = useContext(DrawerWidthCtx) ?? void 0;
   const isPhone = useBreakpoint("sm");
-  const mobileMode = mobile ?? (position === "left" ? "panel" : "sheet");
+  const mobileMode = mobile ?? (position === "left" && props.modal !== false ? "panel" : "sheet");
   const { marked, mark } = useOverlayMark(open);
   const guard = useDirtyGuard(dirty ?? marked, onClose, onDiscard);
   const confirm = /* @__PURE__ */ jsx(DiscardConfirm, { open: guard.confirming, onKeep: guard.keep, onDiscard: guard.discard });
@@ -489,6 +545,26 @@ function DrawerPanel({ form, open, onClose, position = "right", width = "400px",
     return () => cancelAnimationFrame(raf);
   }, [open, mounted, nonModal]);
   useNonModalDialog(panelRef, open && mounted && nonModal, onClose, isTopLayer);
+  const holdsRoom = open && mounted && nonModal && !sheet;
+  const horizontal = position === "left" || position === "right";
+  const [panelHeight, setPanelHeight] = useState(null);
+  useEffect(() => {
+    const el = panelRef.current;
+    if (!holdsRoom || horizontal || !el || typeof ResizeObserver === "undefined") return;
+    const ro = new ResizeObserver(([entry]) => {
+      const height = (entry?.target ?? el).offsetHeight;
+      setPanelHeight(height > 0 ? height : null);
+    });
+    ro.observe(el);
+    return () => ro.disconnect();
+  }, [holdsRoom, horizontal]);
+  const claimTarget = container instanceof Element ? container : null;
+  const sideRoom = holdsRoom && horizontal ? besideRoom(`calc(${effectiveWidth} + var(--ds-space-4))`) : null;
+  const bottomRoom = holdsRoom && !horizontal && panelHeight ? `calc(${panelHeight}px + var(--ds-space-3))` : null;
+  useCornerInset(sideRoom ? position : null, sideRoom, PANEL_INSET_PRIORITY, claimTarget);
+  useCornerInset(bottomRoom ? "bottom-right" : null, bottomRoom, PANEL_INSET_PRIORITY, claimTarget);
+  useCornerInset(bottomRoom ? "bottom-left" : null, bottomRoom, PANEL_INSET_PRIORITY, claimTarget);
+  useCornerInset(bottomRoom ? "bottom-center" : null, bottomRoom, PANEL_INSET_PRIORITY, claimTarget);
   const wasBlocking = useRef(blocking);
   useEffect(() => {
     const was = wasBlocking.current;
@@ -654,7 +730,7 @@ function DrawerPanel({ form, open, onClose, position = "right", width = "400px",
                       minHeight: "calc(var(--ds-space-unit) * 6 + 1.75rem + 2px + var(--ds-border-width))"
                     },
                     children: [
-                      !sheet && titleTruncated ? /* @__PURE__ */ jsx(Tooltip, { content: title, children: /* @__PURE__ */ jsx("h2", { ref: titleOverflowRef, id: titleId, className: heading, children: title }) }) : /* @__PURE__ */ jsx("h2", { ref: titleOverflowRef, id: titleId, className: heading, children: title }),
+                      !sheet && titleTruncated ? /* @__PURE__ */ jsx(AutoTooltip, { content: title, children: /* @__PURE__ */ jsx("h2", { ref: titleOverflowRef, id: titleId, className: heading, children: title }) }) : /* @__PURE__ */ jsx("h2", { ref: titleOverflowRef, id: titleId, className: heading, children: title }),
                       /* @__PURE__ */ jsx(
                         "button",
                         {
@@ -820,12 +896,17 @@ var AppShell = forwardRef(function AppShell2({
     };
   }, [hasFooter, shellEl]);
   const hasLauncher = !!launcher && !isSmallMobile;
-  const launcherProps = isValidElement(launcher) ? launcher.props : null;
-  const launcherCorner = !hasLauncher ? null : launcherProps?.variant === "ribbon" ? null : launcherProps?.edge === "bottom-left" ? "bottom-left" : launcherProps?.edge === "right" || launcherProps?.edge === "left" || launcherProps?.edge === "bottom" ? null : "bottom-right";
+  const [launcherClaim, setLauncherClaim] = useState(null);
+  const registerLauncher = useCallback((corner) => {
+    const claim = { corner };
+    setLauncherClaim(claim);
+    return () => setLauncherClaim((c) => c === claim ? null : c);
+  }, []);
+  const launcherCorner = hasLauncher ? launcherClaim?.corner ?? null : null;
   return /* @__PURE__ */ jsx(PreferencesContext, { value: preferences ?? null, children: /* @__PURE__ */ jsx(DrawerWidthCtx, { value: drawerWidth, children: /* @__PURE__ */ jsx(
     AppShellContext,
     {
-      value: { hasSidebar, hasMobileMenu, hasMobileNav, sidebarOpen, setSidebarOpen, isMobile, isTablet, sidebarCollapsed, setSidebarCollapsed: setUserCollapsed, asideOpen, setAsideOpen, asideSide, asideFloating, setAsideFloating, container: shellEl, theme: theme ?? null, isHome, navbarFloating, sidebarFloating, registerChrome, hasLauncher, launcherCorner, hasFooter, focus: focus ?? null, hasUnsavedChanges: unsavedCount > 0, addUnsavedChanges, drawerWidth, navigate: navigate ?? null, flowLeft: leftCount > 0, markFlowLeft },
+      value: { hasSidebar, hasMobileMenu, hasMobileNav, sidebarOpen, setSidebarOpen, isMobile, isTablet, sidebarCollapsed, setSidebarCollapsed: setUserCollapsed, asideOpen, setAsideOpen, asideSide, asideFloating, setAsideFloating, container: shellEl, theme: theme ?? null, isHome, navbarFloating, sidebarFloating, registerChrome, hasLauncher, launcherCorner, registerLauncher, hasFooter, focus: focus ?? null, hasUnsavedChanges: unsavedCount > 0, addUnsavedChanges, drawerWidth, navigate: navigate ?? null, flowLeft: leftCount > 0, markFlowLeft },
       children: /* @__PURE__ */ jsxs("div", { ref: (el) => {
         setShellEl(el);
         if (typeof ref === "function") ref(el);
@@ -835,7 +916,12 @@ var AppShell = forwardRef(function AppShell2({
         // with the toolbar hidden). Sprint 25.21 S1: h-dvh alone, which an app's own height class replaces through cn();
         // the supports-[…] variant that stood beside it survived that merge and beat the app's class (the builder's
         // preview ran under its footer). Every browser that draws the themes' oklch() colours has dvh.
-        "relative h-dvh flex flex-col bg-[var(--ds-bg-canvas)] overflow-hidden",
+        // Sprint 25.8.7 item 31: clipped, not hidden. A box that hides its overflow is still a scroll container, which
+        // the browser scrolls to show a focused element past its edge: on run 73's roles page at 390 px it had moved
+        // 424 px after 15 Tab stops, and the next 50 stops sat in a blank band below <main>. Nothing can scroll a
+        // clipped box. The page scrolls in <main>, never here, and holds what it positions (below), so in a browser
+        // without overflow: clip (Safari 15) nothing of the library's runs past this box to need clipping.
+        "relative h-dvh flex flex-col bg-[var(--ds-bg-canvas)] overflow-clip",
         className
       ), children: [
         skipLink && /* @__PURE__ */ jsx(SkipLink, { href: `#${mainId}` }),
@@ -855,8 +941,12 @@ var AppShell = forwardRef(function AppShell2({
                 "data-shell-main": "",
                 tabIndex: -1,
                 className: cn(
-                  "flex-1 min-h-0 focus:outline-none",
-                  scrollable ? "overflow-y-auto" : "relative",
+                  // Sprint 25.8.7 item 31: <main> is the page's containing block, so what the page positions with no
+                  // positioned box of its own (a Checkbox's visually hidden input) scrolls with the page, and Tab scrolls
+                  // <main> to it. Placed against the shell instead, it stayed where the unscrolled page had put it, out of
+                  // <main>'s reach, and focus scrolled the shell's outer box to show it
+                  "relative flex-1 min-h-0 focus:outline-none",
+                  scrollable && "overflow-y-auto",
                   layout === "multi-column" && "flex"
                 ),
                 style: { containerType: "inline-size" },
@@ -1215,6 +1305,6 @@ function useElementWidth(ref) {
   return width;
 }
 
-export { AppShell, Breadcrumbs, DiscardConfirm, Drawer, DrawerFooterCtx, DrawerPanel, OVERLAY_ROOT_ATTR, OverlayCloseCtx, OverlayMarkCtx, OverlayMarkScope, REACT_VERSION_PROBLEM, ResizeEdge, SkipLink, crumbGoes, defaultMaxWidth, insetLessScrollbar, pxOf, useAppShell, useBelow, useCloseSettle, useCompact, useCrumbFollow, useDirtyGuard, useElementWidth, useOverlayMark, useRememberedWidth, useScrollbarInset, useUnsavedChanges };
-//# sourceMappingURL=chunk-OPFJEL3Z.js.map
-//# sourceMappingURL=chunk-OPFJEL3Z.js.map
+export { AppShell, Breadcrumbs, DiscardConfirm, Drawer, DrawerFooterCtx, DrawerPanel, LAUNCHER_INSET_PRIORITY, NAVBAR_INSET_PRIORITY, OVERLAY_ROOT_ATTR, OverlayCloseCtx, OverlayMarkCtx, OverlayMarkScope, PANEL_INSET_PRIORITY, REACT_VERSION_PROBLEM, ResizeEdge, SkipLink, besideRoom, crumbGoes, defaultMaxWidth, insetLessScrollbar, pxOf, useAppShell, useBelow, useCloseSettle, useCompact, useCornerInset, useCrumbFollow, useDirtyGuard, useElementWidth, useOverlayMark, useRememberedWidth, useScrollbarInset, useUnsavedChanges };
+//# sourceMappingURL=chunk-UNS4TGGK.js.map
+//# sourceMappingURL=chunk-UNS4TGGK.js.map