@eifi1/ui-kit 0.7.1 → 0.8.1

package/dist/lib/dates.d.ts

@@ -80,5 +80,41 @@ interface DateRangePreset {
  * `table.preset_*` labels.
  */
 declare function dateRangePresets(): DateRangePreset[];
+/** The last `n` WHOLE calendar months before the current one, as an inclusive
+ *  `{ from, to }` — on 15 May, `n = 3` is 1 February … 30 April. Local-calendar, like
+ *  everything here; `now` is for tests and for a host with its own clock. */
+declare function lastFullMonthsRange(n: number, now?: Date): {
+    from: string;
+    to: string;
+};
+/** The last `n` WHOLE calendar years before the current one — in 2026, `n = 2` is
+ *  1 January 2024 … 31 December 2025. */
+declare function lastFullYearsRange(n: number, now?: Date): {
+    from: string;
+    to: string;
+};
+interface CalendarMonthPresetOptions {
+    /** How many whole months each month preset spans. Default `[3, 6]`. */
+    months?: readonly number[];
+    /** How many whole years each year preset spans. Default `[2]`. */
+    years?: readonly number[];
+    /** The day to count back from. Default: now, on the local calendar. */
+    now?: Date;
+}
+/**
+ * Month-ALIGNED presets, beside the rolling-day ones of {@link dateRangePresets}.
+ *
+ * kastlan's accounting reports are closed by the month: "the last three months" there
+ * means February, March and April, never "the 90 days up to this morning", which
+ * starts mid-month and ends with a day that is still being booked. `last_3_months`
+ * above is the rolling kind and stays that way for the data table's filter, so these
+ * are separate keys rather than a changed meaning under an old one.
+ *
+ * Keys are `last_<n>_full_months` and `last_<n>_full_years`; the host labels them (the
+ * same arrangement as `dateRangePresets`' keys and its `table.preset_*` strings). With
+ * `DateRangePicker`, pass the key as the preset's `id` so the choice keeps its
+ * identity while the dates are recomputed on every render.
+ */
+declare function calendarMonthPresets(options?: CalendarMonthPresetOptions): DateRangePreset[];
 
-export { type DateRangePreset, addDaysIso, dateRangePresets, endOfMonthIso, endOfYearIso, formatIsoDate, monthKey, pad, parseIsoDate, sameYmd, shiftIso, startOfMonthIso, startOfWeekIso, startOfYearIso, toLocalIso, todayIso };
+export { type CalendarMonthPresetOptions, type DateRangePreset, addDaysIso, calendarMonthPresets, dateRangePresets, endOfMonthIso, endOfYearIso, formatIsoDate, lastFullMonthsRange, lastFullYearsRange, monthKey, pad, parseIsoDate, sameYmd, shiftIso, startOfMonthIso, startOfWeekIso, startOfYearIso, toLocalIso, todayIso };

package/dist/lib/dates.js

@@ -89,12 +89,31 @@ function dateRangePresets() {
     { key: "last_year", from: startOfYearIso(-1), to: endOfYearIso(-1) }
   ];
 }
+function lastFullMonthsRange(n, now = /* @__PURE__ */ new Date()) {
+  const from = new Date(now.getFullYear(), now.getMonth() - n, 1);
+  const to = new Date(now.getFullYear(), now.getMonth(), 0);
+  return { from: toLocalIso(from), to: toLocalIso(to) };
+}
+function lastFullYearsRange(n, now = /* @__PURE__ */ new Date()) {
+  const year = now.getFullYear();
+  return { from: `${year - n}-01-01`, to: `${year - 1}-12-31` };
+}
+function calendarMonthPresets(options = {}) {
+  const { months = [3, 6], years = [2], now = /* @__PURE__ */ new Date() } = options;
+  return [
+    ...months.map((n) => ({ key: `last_${n}_full_months`, ...lastFullMonthsRange(n, now) })),
+    ...years.map((n) => ({ key: `last_${n}_full_years`, ...lastFullYearsRange(n, now) }))
+  ];
+}
 export {
   addDaysIso,
+  calendarMonthPresets,
   dateRangePresets,
   endOfMonthIso,
   endOfYearIso,
   formatIsoDate,
+  lastFullMonthsRange,
+  lastFullYearsRange,
   monthKey,
   pad,
   parseIsoDate,

package/dist/lib/dates.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/lib/dates.ts"],"sourcesContent":["/**\n * ISO date helpers, collected from copies that were scattered across the pages.\n *\n * **Every \"what day is it\" helper here reads the LOCAL calendar** — one family, not\n * two. It used to be two: these all built a local Date and then read it back through\n * `toISOString()`, which is UTC, so east of Greenwich they all returned YESTERDAY\n * between local midnight and the UTC rollover. The old module note called that\n * deliberate and warned against changing it. It was not defensible, and dev#471 is\n * what it cost:\n *\n * > *\"Just entered a tx now from scheduled. But it still shows as upcoming. Is there\n * > a problem with timezones? It is currently 1 o clock middle european summer time.\"*\n *\n * There was: at 01:00 CEST `todayIso()` answered with the 14th, the row the scheduler\n * had just booked was dated the 15th, and `isUpcoming` compares the two strings — so a\n * transaction entered a second ago read as one still to come. The same slip moved\n * `startOfMonthIso()` onto the last day of the PREVIOUS month for an hour every first\n * of the month, which is a report range nobody would have questioned.\n *\n * A calendar day only means anything to the human reading it, and every caller here —\n * the register's today, the date-range presets, the budget cursor, a new\n * transaction's default date — is asking that question. There is no caller for whom\n * \"the UTC day\" is the right answer; the server compares plain dates with no zone at\n * all, so sending it the user's local day is also what it wants.\n */\n\n/** Zero-pad a number to two digits (\"3\" -> \"03\"). */\nexport function pad(n: number): string {\n  return String(n).padStart(2, \"0\");\n}\n\n/** Today as \"YYYY-MM-DD\" on the LOCAL calendar (see the module note). */\nexport function todayIso(): string {\n  return toLocalIso(new Date());\n}\n\n/** A Date as a local-time \"YYYY-MM-DD\" string. */\nexport function toLocalIso(d: Date): string {\n  return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`;\n}\n\n/** A Date as a local-time \"YYYY-MM\" month key. */\nexport function monthKey(d: Date): string {\n  return `${d.getFullYear()}-${pad(d.getMonth() + 1)}`;\n}\n\n// ---------- Date-range presets + calendar helpers ----------\n// Local-calendar like todayIso (see the module note); used by the data-table date\n// filter and its MiniCalendar. Each one mutates a local Date and must therefore READ\n// it back locally — going out through toISOString() is what shifted every one of\n// these by a day near midnight (dev#471).\n\n/** Today shifted by `days`, as \"YYYY-MM-DD\". */\nexport function shiftIso(days: number): string {\n  const d = new Date();\n  d.setDate(d.getDate() + days);\n  return toLocalIso(d);\n}\n\n/** First day (Monday) of the current week, as \"YYYY-MM-DD\". */\nexport function startOfWeekIso(): string {\n  const d = new Date();\n  const day = d.getDay();\n  const diff = (day + 6) % 7; // monday = 0\n  d.setDate(d.getDate() - diff);\n  return toLocalIso(d);\n}\n\n/** First day of the month `offsetMonths` from now, as \"YYYY-MM-DD\". */\nexport function startOfMonthIso(offsetMonths = 0): string {\n  const d = new Date();\n  d.setDate(1);\n  d.setMonth(d.getMonth() + offsetMonths);\n  return toLocalIso(d);\n}\n\n/** Last day of the month `offsetMonths` from now, as \"YYYY-MM-DD\". */\nexport function endOfMonthIso(offsetMonths = 0): string {\n  const d = new Date();\n  d.setDate(1);\n  d.setMonth(d.getMonth() + offsetMonths + 1);\n  d.setDate(0);\n  return toLocalIso(d);\n}\n\n/** First day of the year `offsetYears` from now, as \"YYYY-MM-DD\". */\nexport function startOfYearIso(offsetYears = 0): string {\n  const d = new Date();\n  d.setMonth(0);\n  d.setDate(1);\n  d.setFullYear(d.getFullYear() + offsetYears);\n  return toLocalIso(d);\n}\n\n/** Last day of the year `offsetYears` from now, as \"YYYY-MM-DD\". */\nexport function endOfYearIso(offsetYears = 0): string {\n  const d = new Date();\n  d.setMonth(11);\n  d.setDate(31);\n  d.setFullYear(d.getFullYear() + offsetYears);\n  return toLocalIso(d);\n}\n\n/** Parse a \"YYYY-MM-DD\" string to a local-midnight Date, or null if malformed —\n *  where \"malformed\" includes a date that does not exist.\n *\n *  The falsy check alone was not enough. `new Date(y, m - 1, d)` ROLLS OVER out-of-range\n *  components rather than refusing them, so \"2026-13-45\" came back as 2027-02-14 and\n *  \"2026-02-30\" as 2026-03-02: a valid-looking Date for a day that never happened. No\n *  caller could tell — {@link formatIsoDate} blanks only on `null`, so the invented\n *  date formatted and displayed exactly like a real one.\n *\n *  The round-trip is the check: build the Date, then read the components back off it.\n *  A value that rolled over cannot answer with the numbers it was given. That is the\n *  same shape {@link sameYmd} already expresses, applied to a Date and its source. */\nexport function parseIsoDate(s: string): Date | null {\n  if (!s) return null;\n  const [y, m, d] = s.split(\"-\").map(Number);\n  if (!y || !m || !d) return null;\n  if (!Number.isInteger(y) || !Number.isInteger(m) || !Number.isInteger(d)) return null;\n  const dt = new Date(y, m - 1, d);\n  if (Number.isNaN(dt.getTime())) return null;\n  if (dt.getFullYear() !== y || dt.getMonth() !== m - 1 || dt.getDate() !== d) return null;\n  return dt;\n}\n\n/** Format a \"YYYY-MM-DD\" string for display in `locale` (empty string when\n *  unparseable). Defaults to the locale's short numeric date; pass `options` to\n *  override (e.g. `{ dateStyle: \"medium\" }`). */\nexport function formatIsoDate(\n  iso: string,\n  locale: string,\n  options?: Intl.DateTimeFormatOptions,\n): string {\n  const d = parseIsoDate(iso);\n  return d ? d.toLocaleDateString(locale, options) : \"\";\n}\n\n/** A \"YYYY-MM-DD\" string shifted by `days` (negative shifts back), or the input\n *  unchanged when it isn't a parseable date.\n *\n *  Local-time throughout — {@link parseIsoDate} builds a local-midnight Date and\n *  {@link toLocalIso} reads local components back, so this never slides a day the way\n *  a `toISOString()` round-trip does west of UTC. */\nexport function addDaysIso(iso: string, days: number): string {\n  const d = parseIsoDate(iso);\n  if (!d) return iso;\n  d.setDate(d.getDate() + days);\n  return toLocalIso(d);\n}\n\n/** Whether two Dates fall on the same local calendar day. */\nexport function sameYmd(a: Date, b: Date): boolean {\n  return (\n    a.getFullYear() === b.getFullYear() &&\n    a.getMonth() === b.getMonth() &&\n    a.getDate() === b.getDate()\n  );\n}\n\nexport interface DateRangePreset {\n  key: string;\n  from: string;\n  to: string;\n}\n\n/**\n * The named ranges offered by the data-table date filter (local-calendar, like\n * {@link todayIso} — see the module note). `key` maps to the consumer's\n * `table.preset_*` labels.\n */\nexport function dateRangePresets(): DateRangePreset[] {\n  const mondayOffset = (new Date().getDay() + 6) % 7; // monday = 0\n  return [\n    { key: \"today\", from: todayIso(), to: todayIso() },\n    { key: \"yesterday\", from: shiftIso(-1), to: shiftIso(-1) },\n    { key: \"this_week\", from: startOfWeekIso(), to: todayIso() },\n    { key: \"last_week\", from: shiftIso(-7 - mondayOffset), to: shiftIso(-1 - mondayOffset) },\n    { key: \"last_7_days\", from: shiftIso(-6), to: todayIso() },\n    { key: \"last_30_days\", from: shiftIso(-29), to: todayIso() },\n    { key: \"this_month\", from: startOfMonthIso(0), to: todayIso() },\n    { key: \"last_month\", from: startOfMonthIso(-1), to: endOfMonthIso(-1) },\n    { key: \"last_3_months\", from: shiftIso(-90), to: todayIso() },\n    { key: \"ytd\", from: startOfYearIso(0), to: todayIso() },\n    { key: \"last_year\", from: startOfYearIso(-1), to: endOfYearIso(-1) },\n  ];\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/lib/dates.ts"],"sourcesContent":["/**\n * ISO date helpers, collected from copies that were scattered across the pages.\n *\n * **Every \"what day is it\" helper here reads the LOCAL calendar** — one family, not\n * two. It used to be two: these all built a local Date and then read it back through\n * `toISOString()`, which is UTC, so east of Greenwich they all returned YESTERDAY\n * between local midnight and the UTC rollover. The old module note called that\n * deliberate and warned against changing it. It was not defensible, and dev#471 is\n * what it cost:\n *\n * > *\"Just entered a tx now from scheduled. But it still shows as upcoming. Is there\n * > a problem with timezones? It is currently 1 o clock middle european summer time.\"*\n *\n * There was: at 01:00 CEST `todayIso()` answered with the 14th, the row the scheduler\n * had just booked was dated the 15th, and `isUpcoming` compares the two strings — so a\n * transaction entered a second ago read as one still to come. The same slip moved\n * `startOfMonthIso()` onto the last day of the PREVIOUS month for an hour every first\n * of the month, which is a report range nobody would have questioned.\n *\n * A calendar day only means anything to the human reading it, and every caller here —\n * the register's today, the date-range presets, the budget cursor, a new\n * transaction's default date — is asking that question. There is no caller for whom\n * \"the UTC day\" is the right answer; the server compares plain dates with no zone at\n * all, so sending it the user's local day is also what it wants.\n */\n\n/** Zero-pad a number to two digits (\"3\" -> \"03\"). */\nexport function pad(n: number): string {\n  return String(n).padStart(2, \"0\");\n}\n\n/** Today as \"YYYY-MM-DD\" on the LOCAL calendar (see the module note). */\nexport function todayIso(): string {\n  return toLocalIso(new Date());\n}\n\n/** A Date as a local-time \"YYYY-MM-DD\" string. */\nexport function toLocalIso(d: Date): string {\n  return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`;\n}\n\n/** A Date as a local-time \"YYYY-MM\" month key. */\nexport function monthKey(d: Date): string {\n  return `${d.getFullYear()}-${pad(d.getMonth() + 1)}`;\n}\n\n// ---------- Date-range presets + calendar helpers ----------\n// Local-calendar like todayIso (see the module note); used by the data-table date\n// filter and its MiniCalendar. Each one mutates a local Date and must therefore READ\n// it back locally — going out through toISOString() is what shifted every one of\n// these by a day near midnight (dev#471).\n\n/** Today shifted by `days`, as \"YYYY-MM-DD\". */\nexport function shiftIso(days: number): string {\n  const d = new Date();\n  d.setDate(d.getDate() + days);\n  return toLocalIso(d);\n}\n\n/** First day (Monday) of the current week, as \"YYYY-MM-DD\". */\nexport function startOfWeekIso(): string {\n  const d = new Date();\n  const day = d.getDay();\n  const diff = (day + 6) % 7; // monday = 0\n  d.setDate(d.getDate() - diff);\n  return toLocalIso(d);\n}\n\n/** First day of the month `offsetMonths` from now, as \"YYYY-MM-DD\". */\nexport function startOfMonthIso(offsetMonths = 0): string {\n  const d = new Date();\n  d.setDate(1);\n  d.setMonth(d.getMonth() + offsetMonths);\n  return toLocalIso(d);\n}\n\n/** Last day of the month `offsetMonths` from now, as \"YYYY-MM-DD\". */\nexport function endOfMonthIso(offsetMonths = 0): string {\n  const d = new Date();\n  d.setDate(1);\n  d.setMonth(d.getMonth() + offsetMonths + 1);\n  d.setDate(0);\n  return toLocalIso(d);\n}\n\n/** First day of the year `offsetYears` from now, as \"YYYY-MM-DD\". */\nexport function startOfYearIso(offsetYears = 0): string {\n  const d = new Date();\n  d.setMonth(0);\n  d.setDate(1);\n  d.setFullYear(d.getFullYear() + offsetYears);\n  return toLocalIso(d);\n}\n\n/** Last day of the year `offsetYears` from now, as \"YYYY-MM-DD\". */\nexport function endOfYearIso(offsetYears = 0): string {\n  const d = new Date();\n  d.setMonth(11);\n  d.setDate(31);\n  d.setFullYear(d.getFullYear() + offsetYears);\n  return toLocalIso(d);\n}\n\n/** Parse a \"YYYY-MM-DD\" string to a local-midnight Date, or null if malformed —\n *  where \"malformed\" includes a date that does not exist.\n *\n *  The falsy check alone was not enough. `new Date(y, m - 1, d)` ROLLS OVER out-of-range\n *  components rather than refusing them, so \"2026-13-45\" came back as 2027-02-14 and\n *  \"2026-02-30\" as 2026-03-02: a valid-looking Date for a day that never happened. No\n *  caller could tell — {@link formatIsoDate} blanks only on `null`, so the invented\n *  date formatted and displayed exactly like a real one.\n *\n *  The round-trip is the check: build the Date, then read the components back off it.\n *  A value that rolled over cannot answer with the numbers it was given. That is the\n *  same shape {@link sameYmd} already expresses, applied to a Date and its source. */\nexport function parseIsoDate(s: string): Date | null {\n  if (!s) return null;\n  const [y, m, d] = s.split(\"-\").map(Number);\n  if (!y || !m || !d) return null;\n  if (!Number.isInteger(y) || !Number.isInteger(m) || !Number.isInteger(d)) return null;\n  const dt = new Date(y, m - 1, d);\n  if (Number.isNaN(dt.getTime())) return null;\n  if (dt.getFullYear() !== y || dt.getMonth() !== m - 1 || dt.getDate() !== d) return null;\n  return dt;\n}\n\n/** Format a \"YYYY-MM-DD\" string for display in `locale` (empty string when\n *  unparseable). Defaults to the locale's short numeric date; pass `options` to\n *  override (e.g. `{ dateStyle: \"medium\" }`). */\nexport function formatIsoDate(\n  iso: string,\n  locale: string,\n  options?: Intl.DateTimeFormatOptions,\n): string {\n  const d = parseIsoDate(iso);\n  return d ? d.toLocaleDateString(locale, options) : \"\";\n}\n\n/** A \"YYYY-MM-DD\" string shifted by `days` (negative shifts back), or the input\n *  unchanged when it isn't a parseable date.\n *\n *  Local-time throughout — {@link parseIsoDate} builds a local-midnight Date and\n *  {@link toLocalIso} reads local components back, so this never slides a day the way\n *  a `toISOString()` round-trip does west of UTC. */\nexport function addDaysIso(iso: string, days: number): string {\n  const d = parseIsoDate(iso);\n  if (!d) return iso;\n  d.setDate(d.getDate() + days);\n  return toLocalIso(d);\n}\n\n/** Whether two Dates fall on the same local calendar day. */\nexport function sameYmd(a: Date, b: Date): boolean {\n  return (\n    a.getFullYear() === b.getFullYear() &&\n    a.getMonth() === b.getMonth() &&\n    a.getDate() === b.getDate()\n  );\n}\n\nexport interface DateRangePreset {\n  key: string;\n  from: string;\n  to: string;\n}\n\n/**\n * The named ranges offered by the data-table date filter (local-calendar, like\n * {@link todayIso} — see the module note). `key` maps to the consumer's\n * `table.preset_*` labels.\n */\nexport function dateRangePresets(): DateRangePreset[] {\n  const mondayOffset = (new Date().getDay() + 6) % 7; // monday = 0\n  return [\n    { key: \"today\", from: todayIso(), to: todayIso() },\n    { key: \"yesterday\", from: shiftIso(-1), to: shiftIso(-1) },\n    { key: \"this_week\", from: startOfWeekIso(), to: todayIso() },\n    { key: \"last_week\", from: shiftIso(-7 - mondayOffset), to: shiftIso(-1 - mondayOffset) },\n    { key: \"last_7_days\", from: shiftIso(-6), to: todayIso() },\n    { key: \"last_30_days\", from: shiftIso(-29), to: todayIso() },\n    { key: \"this_month\", from: startOfMonthIso(0), to: todayIso() },\n    { key: \"last_month\", from: startOfMonthIso(-1), to: endOfMonthIso(-1) },\n    { key: \"last_3_months\", from: shiftIso(-90), to: todayIso() },\n    { key: \"ytd\", from: startOfYearIso(0), to: todayIso() },\n    { key: \"last_year\", from: startOfYearIso(-1), to: endOfYearIso(-1) },\n  ];\n}\n\n/** The last `n` WHOLE calendar months before the current one, as an inclusive\n *  `{ from, to }` — on 15 May, `n = 3` is 1 February … 30 April. Local-calendar, like\n *  everything here; `now` is for tests and for a host with its own clock. */\nexport function lastFullMonthsRange(n: number, now: Date = new Date()): { from: string; to: string } {\n  const from = new Date(now.getFullYear(), now.getMonth() - n, 1);\n  // Day 0 of the current month is the last day of the previous one.\n  const to = new Date(now.getFullYear(), now.getMonth(), 0);\n  return { from: toLocalIso(from), to: toLocalIso(to) };\n}\n\n/** The last `n` WHOLE calendar years before the current one — in 2026, `n = 2` is\n *  1 January 2024 … 31 December 2025. */\nexport function lastFullYearsRange(n: number, now: Date = new Date()): { from: string; to: string } {\n  const year = now.getFullYear();\n  return { from: `${year - n}-01-01`, to: `${year - 1}-12-31` };\n}\n\nexport interface CalendarMonthPresetOptions {\n  /** How many whole months each month preset spans. Default `[3, 6]`. */\n  months?: readonly number[];\n  /** How many whole years each year preset spans. Default `[2]`. */\n  years?: readonly number[];\n  /** The day to count back from. Default: now, on the local calendar. */\n  now?: Date;\n}\n\n/**\n * Month-ALIGNED presets, beside the rolling-day ones of {@link dateRangePresets}.\n *\n * kastlan's accounting reports are closed by the month: \"the last three months\" there\n * means February, March and April, never \"the 90 days up to this morning\", which\n * starts mid-month and ends with a day that is still being booked. `last_3_months`\n * above is the rolling kind and stays that way for the data table's filter, so these\n * are separate keys rather than a changed meaning under an old one.\n *\n * Keys are `last_<n>_full_months` and `last_<n>_full_years`; the host labels them (the\n * same arrangement as `dateRangePresets`' keys and its `table.preset_*` strings). With\n * `DateRangePicker`, pass the key as the preset's `id` so the choice keeps its\n * identity while the dates are recomputed on every render.\n */\nexport function calendarMonthPresets(options: CalendarMonthPresetOptions = {}): DateRangePreset[] {\n  const { months = [3, 6], years = [2], now = new Date() } = options;\n  return [\n    ...months.map((n) => ({ key: `last_${n}_full_months`, ...lastFullMonthsRange(n, now) })),\n    ...years.map((n) => ({ key: `last_${n}_full_years`, ...lastFullYearsRange(n, now) })),\n  ];\n}\n"],"mappings":"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","names":[]}

package/dist/search/command-palette.d.ts

@@ -71,6 +71,20 @@ interface CommandPaletteProps {
      * another keystroke. That is the ordinary first open on a cold cache.
      */
     revision?: unknown;
+    /**
+     * The search text, CONTROLLED. Keksdose binds it to the URL's `q`, so a search
+     * survives a reload, can be shared as a link, and Back walks through it — none of
+     * which state inside the palette can do.
+     *
+     * Leave it out and the palette keeps its own, as before, starting empty on every
+     * open. Given, it is never reset on open: the owner decides what an open shows, and
+     * a palette that blanked the URL's `q` each time would fight its own address bar.
+     * `onQueryChange` is then how a keystroke gets anywhere, since it is the only writer.
+     */
+    query?: string;
+    /** Every edit of the field's text. Fires in both modes — uncontrolled, it only
+     *  observes. */
+    onQueryChange?: (query: string) => void;
     labels?: Partial<CommandPaletteLabels>;
 }
 /** Registers a global ⌘K / Ctrl-K shortcut that calls `onOpen`. */
@@ -81,6 +95,6 @@ declare function useCommandKey(onOpen: () => void): void;
  * results via the `search` provider (pages, actions, records, …); each result
  * carries its own `onSelect`.
  */
-declare function CommandPalette({ open, onClose, search, revision, labels, }: CommandPaletteProps): react.ReactPortal | null;
+declare function CommandPalette({ open, onClose, search, revision, query: queryProp, onQueryChange, labels, }: CommandPaletteProps): react.ReactPortal | null;
 
 export { type CommandItem, CommandPalette, type CommandPaletteLabels, DEFAULT_COMMAND_PALETTE_LABELS, useCommandKey };

package/dist/search/command-palette.js

@@ -33,11 +33,19 @@ function CommandPalette({
   onClose,
   search,
   revision,
+  query: queryProp,
+  onQueryChange,
   labels
 }) {
   const l = useKitLabels("commandPalette", DEFAULTS_WITHOUT_DIALOG, labels);
   const dialogName = l.dialog ?? (l.placeholder !== DEFAULT_COMMAND_PALETTE_LABELS.placeholder ? l.placeholder : DEFAULT_DIALOG_NAME);
-  const [query, setQuery] = useState("");
+  const [ownQuery, setOwnQuery] = useState("");
+  const controlled = queryProp !== void 0;
+  const query = controlled ? queryProp : ownQuery;
+  const setQuery = (next) => {
+    if (!controlled) setOwnQuery(next);
+    onQueryChange?.(next);
+  };
   const [results, setResults] = useState([]);
   const [loading, setLoading] = useState(false);
   const [failed, setFailed] = useState(false);
@@ -57,7 +65,7 @@ function CommandPalette({
   useBodyScrollLock(open);
   useEffect(() => {
     if (!open) return;
-    setQuery("");
+    if (!controlled) setOwnQuery("");
     setActive(0);
   }, [open]);
   useEffect(() => {

package/dist/search/command-palette.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/search/command-palette.tsx"],"sourcesContent":["import { useEffect, useId, useMemo, useRef, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { Search } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { useOverlayHistory } from \"../hooks/use-overlay-history\";\nimport { useFocusTrap } from \"../hooks/use-focus-trap\";\nimport { useBodyScrollLock } from \"../hooks/use-body-scroll-lock\";\nimport { useKitLabels } from \"../i18n/kit-labels\";\n\nexport interface CommandItem {\n  id: string;\n  /** Primary text. */\n  label: string;\n  /** Secondary text on the right (e.g. an amount, a date, a group hint). */\n  hint?: string;\n  /** Heading this item is grouped under. */\n  group: string;\n  /** Leading icon / element. */\n  icon?: ReactNode;\n  /** Invoked when the item is chosen (navigate, run an action, …). */\n  onSelect: () => void;\n  /** Where this item leads, when it is a navigation rather than an action. Renders\n   *  the row as a real anchor so it can be middle-/⌘-clicked into a new tab\n   *  (Keksdose feedback #451); `onSelect` still runs for a plain click and for ↵, so\n   *  in-app navigation stays client-side. `href` only adds what the browser can do\n   *  with a link and JavaScript cannot fake — the rejected alternative, an\n   *  `onAuxClick` calling `window.open`, gets the middle click and nothing else. */\n  href?: string;\n}\n\nexport interface CommandPaletteLabels {\n  placeholder: string;\n  empty: string;\n  loading: string;\n  /** Hint shown in the footer, e.g. \"↑↓ to navigate · ↵ to select · esc to close\". */\n  hint?: string;\n  /**\n   * Accessible name of the dialog itself. It used to borrow `placeholder`, which is\n   * written to sit greyed-out in an empty box (\"Search…\", \"Type a command\"), not to\n   * name a window — and a reader heard the ellipsis read out as part of the name.\n   *\n   * Optional, unlike `placeholder`, so a translation annotated as\n   * `CommandPaletteLabels` keeps compiling; the default always carries it.\n   */\n  dialog?: string;\n  /**\n   * Shown in place of the results when the `search` provider throws or its promise\n   * rejects. Optional for the same reason as `dialog`; the default always carries it.\n   */\n  error?: string;\n}\n\nexport const DEFAULT_COMMAND_PALETTE_LABELS: CommandPaletteLabels = {\n  placeholder: \"Search…\",\n  empty: \"No results\",\n  loading: \"Searching…\",\n  dialog: \"Search\",\n  error: \"Search failed. Try again.\",\n};\n\n/** The defaults minus `dialog`, so a resolved `dialog` means someone SUPPLIED one —\n *  see the dialog's `aria-label` for why that distinction matters. */\nconst { dialog: DEFAULT_DIALOG_NAME, ...DEFAULTS_WITHOUT_DIALOG } = DEFAULT_COMMAND_PALETTE_LABELS;\n\ninterface CommandPaletteProps {\n  open: boolean;\n  onClose: () => void;\n  /**\n   * Returns results for a query (called debounced as the user types; an empty\n   * query is allowed — return defaults like pages/recent). Sync or async; stale\n   * async responses are ignored.\n   *\n   * Its IDENTITY is not a re-run signal — it is read through a ref, so the palette\n   * never re-searches merely because the caller rebuilt the callback. That is\n   * deliberate: a provider closing over a list rendered from a query allocates a new\n   * function on most renders, and re-running the search on each would make typing\n   * stutter. Use {@link CommandPaletteProps.revision} when the DATA behind the\n   * provider changes.\n   */\n  search: (query: string) => CommandItem[] | Promise<CommandItem[]>;\n  /**\n   * Anything whose change means the current results are out of date — typically the\n   * arrays the provider searches over. Compared by identity (as an effect dependency\n   * would be), so pass stable references: a `data = []` default allocates a fresh\n   * array on every render while a query is pending and would re-search forever.\n   *\n   * Without it, a provider whose data arrives AFTER the palette opened never gets\n   * asked again: the user's last keystroke settles the debounce, the queries resolve a\n   * moment later, and the groups they would have contributed are simply absent until\n   * another keystroke. That is the ordinary first open on a cold cache.\n   */\n  revision?: unknown;\n  labels?: Partial<CommandPaletteLabels>;\n}\n\n/** Registers a global ⌘K / Ctrl-K shortcut that calls `onOpen`. */\nexport function useCommandKey(onOpen: () => void): void {\n  useEffect(() => {\n    const handler = (e: KeyboardEvent) => {\n      if ((e.metaKey || e.ctrlKey) && (e.key === \"k\" || e.key === \"K\")) {\n        e.preventDefault();\n        onOpen();\n      }\n    };\n    document.addEventListener(\"keydown\", handler);\n    return () => document.removeEventListener(\"keydown\", handler);\n  }, [onOpen]);\n}\n\n/**\n * A ⌘K-style command palette: a top-centred modal with a search field and a\n * grouped, keyboard-navigable result list. Domain-free — the app supplies\n * results via the `search` provider (pages, actions, records, …); each result\n * carries its own `onSelect`.\n */\nexport function CommandPalette({\n  open,\n  onClose,\n  search,\n  revision,\n  labels,\n}: CommandPaletteProps) {\n  const l = useKitLabels(\"commandPalette\", DEFAULTS_WITHOUT_DIALOG, labels);\n  // `dialog` is new, and until it existed the dialog was named by `placeholder`. An\n  // app that translated `placeholder` and has not heard of `dialog` would otherwise\n  // go from a German name to an English \"Search\" on update — so a translated\n  // placeholder keeps doing the job until a `dialog` is supplied.\n  const dialogName =\n    l.dialog ??\n    (l.placeholder !== DEFAULT_COMMAND_PALETTE_LABELS.placeholder ? l.placeholder : DEFAULT_DIALOG_NAME);\n  const [query, setQuery] = useState(\"\");\n  const [results, setResults] = useState<CommandItem[]>([]);\n  const [loading, setLoading] = useState(false);\n  const [failed, setFailed] = useState(false);\n  const [active, setActive] = useState(0);\n  // Per instance: these were the literal \"command-palette-list\" / \"command-item-<id>\",\n  // so two palettes on one page (an app-wide one and a scoped one) pointed each\n  // other's `aria-controls` and `aria-activedescendant` at the wrong list.\n  const uid = useId();\n  const listId = `${uid}-list`;\n  const itemId = (id: string) => `${uid}-item-${id}`;\n  const groupId = (index: number) => `${uid}-group-${index}`;\n  const dialogRef = useRef<HTMLDivElement>(null);\n  const inputRef = useRef<HTMLInputElement>(null);\n  const listRef = useRef<HTMLUListElement>(null);\n  const searchRef = useRef(search);\n  searchRef.current = search;\n  const reqId = useRef(0);\n\n  // Back dismisses the palette (Keksdose feedback #172). Declared with the other\n  // hooks, above the `if (!open) return null` below — a hook past a conditional\n  // return changes the hook order between renders. Passing `open` rather than\n  // mounting-while-open is what lets it sit here.\n  useOverlayHistory(open, onClose);\n\n  // A modal like any other: Tab stays inside, the page behind does not scroll, and\n  // focus goes back to whatever opened it — the palette used to drop it on <body>.\n  // Initial focus is the field, not the container: typing is the only reason to open it.\n  useFocusTrap(dialogRef, { active: open, initialFocus: () => inputRef.current });\n  useBodyScrollLock(open);\n\n  // Reset when opened.\n  useEffect(() => {\n    if (!open) return;\n    setQuery(\"\");\n    setActive(0);\n  }, [open]);\n\n  // Debounced, race-safe search.\n  useEffect(() => {\n    if (!open) return;\n    const id = ++reqId.current;\n    setLoading(true);\n    const run = async () => {\n      try {\n        const r = await Promise.resolve(searchRef.current(query));\n        if (reqId.current === id) {\n          setResults(r);\n          setFailed(false);\n          setActive(0);\n        }\n      } catch (err) {\n        // There was no catch: the previous query's results stayed on screen as if they\n        // answered this one, and the rejection went unhandled. Clear them and say so.\n        if (reqId.current === id) {\n          setResults([]);\n          setFailed(true);\n          setActive(0);\n        }\n        console.error(\"CommandPalette: search failed\", err);\n      } finally {\n        if (reqId.current === id) setLoading(false);\n      }\n    };\n    const t = setTimeout(run, query ? 150 : 0);\n    return () => clearTimeout(t);\n    // `revision`, not `search`: see the prop's docstring. The debounce is re-armed on a\n    // revision change, which is right — data arriving is not a keystroke and there is\n    // nothing to feel laggy about.\n  }, [query, open, revision]);\n\n  // Group results, preserving first-seen group order; keep a flat list for nav.\n  const { groups, flat } = useMemo(() => {\n    const order: string[] = [];\n    const byGroup = new Map<string, CommandItem[]>();\n    for (const item of results) {\n      if (!byGroup.has(item.group)) {\n        byGroup.set(item.group, []);\n        order.push(item.group);\n      }\n      byGroup.get(item.group)!.push(item);\n    }\n    return {\n      groups: order.map((g) => ({ group: g, items: byGroup.get(g)! })),\n      flat: order.flatMap((g) => byGroup.get(g)!),\n    };\n  }, [results]);\n\n  const choose = (item: CommandItem | undefined) => {\n    if (!item) return;\n    onClose();\n    item.onSelect();\n  };\n\n  const onKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === \"ArrowDown\") {\n      e.preventDefault();\n      setActive((i) => Math.min(i + 1, flat.length - 1));\n    } else if (e.key === \"ArrowUp\") {\n      e.preventDefault();\n      setActive((i) => Math.max(i - 1, 0));\n    } else if (e.key === \"Enter\") {\n      e.preventDefault();\n      choose(flat[active]);\n    }\n  };\n\n  // Escape on the whole dialog, not only the field: once Tab has moved focus to a row\n  // (or a footer control), Escape used to do nothing at all.\n  const onDialogKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === \"Escape\") {\n      e.preventDefault();\n      onClose();\n    }\n  };\n\n  // Keep the active row scrolled into view.\n  useEffect(() => {\n    const el = listRef.current?.querySelector<HTMLElement>(`[data-index=\"${active}\"]`);\n    el?.scrollIntoView({ block: \"nearest\" });\n  }, [active]);\n\n  if (!open) return null;\n\n  let flatIndex = -1;\n  return createPortal(\n    <div\n      className=\"fixed inset-0 z-[70] flex items-start justify-center bg-black/40 p-4 pt-[10vh]\"\n      onMouseDown={(e) => {\n        if (e.target === e.currentTarget) onClose();\n      }}\n    >\n      {/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- Escape from anywhere in the dialog */}\n      <div\n        ref={dialogRef}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-label={dialogName}\n        // The trap's fallback target when the field is not there to take focus.\n        tabIndex={-1}\n        // Escape bubbling up from anything inside — a dialog is where it belongs.\n        onKeyDown={onDialogKeyDown}\n        className=\"flex max-h-[70vh] w-full max-w-xl flex-col overflow-hidden rounded-xl border border-[var(--border)] bg-[var(--bg-surface)] shadow-2xl outline-none\"\n      >\n        <div className=\"flex items-center gap-2 border-b border-[var(--border)] px-3\">\n          <Search className=\"size-4 shrink-0 text-[var(--text-placeholder)]\" />\n          <input\n            ref={inputRef}\n            role=\"combobox\"\n            aria-expanded\n            aria-controls={listId}\n            aria-activedescendant={flat[active] ? itemId(flat[active].id) : undefined}\n            value={query}\n            onChange={(e) => setQuery(e.target.value)}\n            onKeyDown={onKeyDown}\n            placeholder={l.placeholder}\n            className=\"w-full bg-transparent py-3 text-sm outline-none placeholder:text-[var(--text-placeholder)] text-[var(--text-primary)]\"\n          />\n          {loading && <span className=\"shrink-0 text-[11px] text-[var(--text-placeholder)]\">{l.loading}</span>}\n        </div>\n\n        {/* The status lines sit outside the listbox: a listbox owns options and groups,\n            and \"No results\" is neither. */}\n        {failed && !loading && (\n          <div role=\"alert\" className=\"px-3 py-6 text-center text-sm text-[var(--text-muted)]\">\n            {l.error ?? DEFAULT_COMMAND_PALETTE_LABELS.error}\n          </div>\n        )}\n        {!failed && flat.length === 0 && !loading && (\n          <div className=\"px-3 py-6 text-center text-sm text-[var(--text-muted)]\">{l.empty}</div>\n        )}\n        {/* Listbox grouping: each group is a `role=\"group\"` named by its heading, and\n            the list markup in between is presentational so the listbox's children are\n            groups and options only — as a plain <li>/<ul> tree a reader announced\n            \"list, 2 items\" between options and never tied the heading to its rows. */}\n        <ul id={listId} ref={listRef} role=\"listbox\" aria-label={dialogName} className=\"min-h-0 flex-1 overflow-y-auto py-1\">\n          {groups.map(({ group, items }, groupIndex) => (\n            <li key={group} role=\"presentation\">\n              <div\n                id={groupId(groupIndex)}\n                role=\"presentation\"\n                className=\"px-3 pb-0.5 pt-2 text-[10px] font-semibold uppercase tracking-wide text-[var(--text-placeholder)]\"\n              >\n                {group}\n              </div>\n              <ul role=\"group\" aria-labelledby={groupId(groupIndex)}>\n                {items.map((item) => {\n                  flatIndex += 1;\n                  const idx = flatIndex;\n                  const isActive = idx === active;\n                  // Written once and worn by either tag below, so the anchor and the\n                  // button can never drift apart in looks or in listbox semantics.\n                  // `role=\"option\"` on an <a href> is fine: the browser's middle-click\n                  // behaviour keys off the element, not the ARIA role.\n                  const shared = {\n                    id: itemId(item.id),\n                    role: \"option\" as const,\n                    \"aria-selected\": isActive,\n                    \"data-index\": idx,\n                    onMouseMove: () => setActive(idx),\n                    className: cn(\n                      \"flex w-full items-center gap-2.5 px-3 py-2 text-start text-sm\",\n                      isActive\n                        ? \"bg-[var(--bg-active)] text-[var(--text-primary)]\"\n                        : \"text-[var(--text-secondary)]\",\n                    ),\n                  };\n                  const inner = (\n                    <>\n                      {item.icon && (\n                        <span className=\"flex size-4 shrink-0 items-center justify-center text-[var(--text-placeholder)]\">\n                          {item.icon}\n                        </span>\n                      )}\n                      <span className=\"min-w-0 flex-1 truncate\">{item.label}</span>\n                      {item.hint && (\n                        <span className=\"shrink-0 text-xs text-[var(--text-placeholder)]\">{item.hint}</span>\n                      )}\n                    </>\n                  );\n                  return (\n                    <li key={item.id} role=\"presentation\">\n                      {item.href ? (\n                        <a\n                          {...shared}\n                          href={item.href}\n                          draggable={false}\n                          onClick={(e) => {\n                            // A modified click belongs to the browser (feedback\n                            // #451) — and the palette deliberately stays OPEN for\n                            // it: ⌘-clicking three results in a row is the reason to\n                            // want this, and closing after the first would undo it.\n                            if (\n                              e.button !== 0 ||\n                              e.metaKey ||\n                              e.ctrlKey ||\n                              e.shiftKey ||\n                              e.altKey\n                            )\n                              return;\n                            e.preventDefault();\n                            choose(item);\n                          }}\n                        >\n                          {inner}\n                        </a>\n                      ) : (\n                        <button type=\"button\" {...shared} onClick={() => choose(item)}>\n                          {inner}\n                        </button>\n                      )}\n                    </li>\n                  );\n                })}\n              </ul>\n            </li>\n          ))}\n        </ul>\n\n        {l.hint && (\n          <div className=\"border-t border-[var(--border)] px-3 py-1.5 text-[11px] text-[var(--text-placeholder)]\">\n            {l.hint}\n          </div>\n        )}\n      </div>\n    </div>,\n    document.body,\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/search/command-palette.tsx"],"sourcesContent":["import { useEffect, useId, useMemo, useRef, useState } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { Search } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { useOverlayHistory } from \"../hooks/use-overlay-history\";\nimport { useFocusTrap } from \"../hooks/use-focus-trap\";\nimport { useBodyScrollLock } from \"../hooks/use-body-scroll-lock\";\nimport { useKitLabels } from \"../i18n/kit-labels\";\n\nexport interface CommandItem {\n  id: string;\n  /** Primary text. */\n  label: string;\n  /** Secondary text on the right (e.g. an amount, a date, a group hint). */\n  hint?: string;\n  /** Heading this item is grouped under. */\n  group: string;\n  /** Leading icon / element. */\n  icon?: ReactNode;\n  /** Invoked when the item is chosen (navigate, run an action, …). */\n  onSelect: () => void;\n  /** Where this item leads, when it is a navigation rather than an action. Renders\n   *  the row as a real anchor so it can be middle-/⌘-clicked into a new tab\n   *  (Keksdose feedback #451); `onSelect` still runs for a plain click and for ↵, so\n   *  in-app navigation stays client-side. `href` only adds what the browser can do\n   *  with a link and JavaScript cannot fake — the rejected alternative, an\n   *  `onAuxClick` calling `window.open`, gets the middle click and nothing else. */\n  href?: string;\n}\n\nexport interface CommandPaletteLabels {\n  placeholder: string;\n  empty: string;\n  loading: string;\n  /** Hint shown in the footer, e.g. \"↑↓ to navigate · ↵ to select · esc to close\". */\n  hint?: string;\n  /**\n   * Accessible name of the dialog itself. It used to borrow `placeholder`, which is\n   * written to sit greyed-out in an empty box (\"Search…\", \"Type a command\"), not to\n   * name a window — and a reader heard the ellipsis read out as part of the name.\n   *\n   * Optional, unlike `placeholder`, so a translation annotated as\n   * `CommandPaletteLabels` keeps compiling; the default always carries it.\n   */\n  dialog?: string;\n  /**\n   * Shown in place of the results when the `search` provider throws or its promise\n   * rejects. Optional for the same reason as `dialog`; the default always carries it.\n   */\n  error?: string;\n}\n\nexport const DEFAULT_COMMAND_PALETTE_LABELS: CommandPaletteLabels = {\n  placeholder: \"Search…\",\n  empty: \"No results\",\n  loading: \"Searching…\",\n  dialog: \"Search\",\n  error: \"Search failed. Try again.\",\n};\n\n/** The defaults minus `dialog`, so a resolved `dialog` means someone SUPPLIED one —\n *  see the dialog's `aria-label` for why that distinction matters. */\nconst { dialog: DEFAULT_DIALOG_NAME, ...DEFAULTS_WITHOUT_DIALOG } = DEFAULT_COMMAND_PALETTE_LABELS;\n\ninterface CommandPaletteProps {\n  open: boolean;\n  onClose: () => void;\n  /**\n   * Returns results for a query (called debounced as the user types; an empty\n   * query is allowed — return defaults like pages/recent). Sync or async; stale\n   * async responses are ignored.\n   *\n   * Its IDENTITY is not a re-run signal — it is read through a ref, so the palette\n   * never re-searches merely because the caller rebuilt the callback. That is\n   * deliberate: a provider closing over a list rendered from a query allocates a new\n   * function on most renders, and re-running the search on each would make typing\n   * stutter. Use {@link CommandPaletteProps.revision} when the DATA behind the\n   * provider changes.\n   */\n  search: (query: string) => CommandItem[] | Promise<CommandItem[]>;\n  /**\n   * Anything whose change means the current results are out of date — typically the\n   * arrays the provider searches over. Compared by identity (as an effect dependency\n   * would be), so pass stable references: a `data = []` default allocates a fresh\n   * array on every render while a query is pending and would re-search forever.\n   *\n   * Without it, a provider whose data arrives AFTER the palette opened never gets\n   * asked again: the user's last keystroke settles the debounce, the queries resolve a\n   * moment later, and the groups they would have contributed are simply absent until\n   * another keystroke. That is the ordinary first open on a cold cache.\n   */\n  revision?: unknown;\n  /**\n   * The search text, CONTROLLED. Keksdose binds it to the URL's `q`, so a search\n   * survives a reload, can be shared as a link, and Back walks through it — none of\n   * which state inside the palette can do.\n   *\n   * Leave it out and the palette keeps its own, as before, starting empty on every\n   * open. Given, it is never reset on open: the owner decides what an open shows, and\n   * a palette that blanked the URL's `q` each time would fight its own address bar.\n   * `onQueryChange` is then how a keystroke gets anywhere, since it is the only writer.\n   */\n  query?: string;\n  /** Every edit of the field's text. Fires in both modes — uncontrolled, it only\n   *  observes. */\n  onQueryChange?: (query: string) => void;\n  labels?: Partial<CommandPaletteLabels>;\n}\n\n/** Registers a global ⌘K / Ctrl-K shortcut that calls `onOpen`. */\nexport function useCommandKey(onOpen: () => void): void {\n  useEffect(() => {\n    const handler = (e: KeyboardEvent) => {\n      if ((e.metaKey || e.ctrlKey) && (e.key === \"k\" || e.key === \"K\")) {\n        e.preventDefault();\n        onOpen();\n      }\n    };\n    document.addEventListener(\"keydown\", handler);\n    return () => document.removeEventListener(\"keydown\", handler);\n  }, [onOpen]);\n}\n\n/**\n * A ⌘K-style command palette: a top-centred modal with a search field and a\n * grouped, keyboard-navigable result list. Domain-free — the app supplies\n * results via the `search` provider (pages, actions, records, …); each result\n * carries its own `onSelect`.\n */\nexport function CommandPalette({\n  open,\n  onClose,\n  search,\n  revision,\n  query: queryProp,\n  onQueryChange,\n  labels,\n}: CommandPaletteProps) {\n  const l = useKitLabels(\"commandPalette\", DEFAULTS_WITHOUT_DIALOG, labels);\n  // `dialog` is new, and until it existed the dialog was named by `placeholder`. An\n  // app that translated `placeholder` and has not heard of `dialog` would otherwise\n  // go from a German name to an English \"Search\" on update — so a translated\n  // placeholder keeps doing the job until a `dialog` is supplied.\n  const dialogName =\n    l.dialog ??\n    (l.placeholder !== DEFAULT_COMMAND_PALETTE_LABELS.placeholder ? l.placeholder : DEFAULT_DIALOG_NAME);\n  const [ownQuery, setOwnQuery] = useState(\"\");\n  const controlled = queryProp !== undefined;\n  const query = controlled ? queryProp : ownQuery;\n  const setQuery = (next: string) => {\n    if (!controlled) setOwnQuery(next);\n    onQueryChange?.(next);\n  };\n  const [results, setResults] = useState<CommandItem[]>([]);\n  const [loading, setLoading] = useState(false);\n  const [failed, setFailed] = useState(false);\n  const [active, setActive] = useState(0);\n  // Per instance: these were the literal \"command-palette-list\" / \"command-item-<id>\",\n  // so two palettes on one page (an app-wide one and a scoped one) pointed each\n  // other's `aria-controls` and `aria-activedescendant` at the wrong list.\n  const uid = useId();\n  const listId = `${uid}-list`;\n  const itemId = (id: string) => `${uid}-item-${id}`;\n  const groupId = (index: number) => `${uid}-group-${index}`;\n  const dialogRef = useRef<HTMLDivElement>(null);\n  const inputRef = useRef<HTMLInputElement>(null);\n  const listRef = useRef<HTMLUListElement>(null);\n  const searchRef = useRef(search);\n  searchRef.current = search;\n  const reqId = useRef(0);\n\n  // Back dismisses the palette (Keksdose feedback #172). Declared with the other\n  // hooks, above the `if (!open) return null` below — a hook past a conditional\n  // return changes the hook order between renders. Passing `open` rather than\n  // mounting-while-open is what lets it sit here.\n  useOverlayHistory(open, onClose);\n\n  // A modal like any other: Tab stays inside, the page behind does not scroll, and\n  // focus goes back to whatever opened it — the palette used to drop it on <body>.\n  // Initial focus is the field, not the container: typing is the only reason to open it.\n  useFocusTrap(dialogRef, { active: open, initialFocus: () => inputRef.current });\n  useBodyScrollLock(open);\n\n  // Reset when opened — the palette's OWN text only; a controlled query belongs to\n  // its owner (see the prop).\n  useEffect(() => {\n    if (!open) return;\n    if (!controlled) setOwnQuery(\"\");\n    setActive(0);\n    // `controlled` is read at the open, not watched: a caller switching modes while\n    // the palette is open is not a reason to wipe what is typed.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [open]);\n\n  // Debounced, race-safe search.\n  useEffect(() => {\n    if (!open) return;\n    const id = ++reqId.current;\n    setLoading(true);\n    const run = async () => {\n      try {\n        const r = await Promise.resolve(searchRef.current(query));\n        if (reqId.current === id) {\n          setResults(r);\n          setFailed(false);\n          setActive(0);\n        }\n      } catch (err) {\n        // There was no catch: the previous query's results stayed on screen as if they\n        // answered this one, and the rejection went unhandled. Clear them and say so.\n        if (reqId.current === id) {\n          setResults([]);\n          setFailed(true);\n          setActive(0);\n        }\n        console.error(\"CommandPalette: search failed\", err);\n      } finally {\n        if (reqId.current === id) setLoading(false);\n      }\n    };\n    const t = setTimeout(run, query ? 150 : 0);\n    return () => clearTimeout(t);\n    // `revision`, not `search`: see the prop's docstring. The debounce is re-armed on a\n    // revision change, which is right — data arriving is not a keystroke and there is\n    // nothing to feel laggy about.\n  }, [query, open, revision]);\n\n  // Group results, preserving first-seen group order; keep a flat list for nav.\n  const { groups, flat } = useMemo(() => {\n    const order: string[] = [];\n    const byGroup = new Map<string, CommandItem[]>();\n    for (const item of results) {\n      if (!byGroup.has(item.group)) {\n        byGroup.set(item.group, []);\n        order.push(item.group);\n      }\n      byGroup.get(item.group)!.push(item);\n    }\n    return {\n      groups: order.map((g) => ({ group: g, items: byGroup.get(g)! })),\n      flat: order.flatMap((g) => byGroup.get(g)!),\n    };\n  }, [results]);\n\n  const choose = (item: CommandItem | undefined) => {\n    if (!item) return;\n    onClose();\n    item.onSelect();\n  };\n\n  const onKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === \"ArrowDown\") {\n      e.preventDefault();\n      setActive((i) => Math.min(i + 1, flat.length - 1));\n    } else if (e.key === \"ArrowUp\") {\n      e.preventDefault();\n      setActive((i) => Math.max(i - 1, 0));\n    } else if (e.key === \"Enter\") {\n      e.preventDefault();\n      choose(flat[active]);\n    }\n  };\n\n  // Escape on the whole dialog, not only the field: once Tab has moved focus to a row\n  // (or a footer control), Escape used to do nothing at all.\n  const onDialogKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === \"Escape\") {\n      e.preventDefault();\n      onClose();\n    }\n  };\n\n  // Keep the active row scrolled into view.\n  useEffect(() => {\n    const el = listRef.current?.querySelector<HTMLElement>(`[data-index=\"${active}\"]`);\n    el?.scrollIntoView({ block: \"nearest\" });\n  }, [active]);\n\n  if (!open) return null;\n\n  let flatIndex = -1;\n  return createPortal(\n    <div\n      className=\"fixed inset-0 z-[70] flex items-start justify-center bg-black/40 p-4 pt-[10vh]\"\n      onMouseDown={(e) => {\n        if (e.target === e.currentTarget) onClose();\n      }}\n    >\n      {/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- Escape from anywhere in the dialog */}\n      <div\n        ref={dialogRef}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-label={dialogName}\n        // The trap's fallback target when the field is not there to take focus.\n        tabIndex={-1}\n        // Escape bubbling up from anything inside — a dialog is where it belongs.\n        onKeyDown={onDialogKeyDown}\n        className=\"flex max-h-[70vh] w-full max-w-xl flex-col overflow-hidden rounded-xl border border-[var(--border)] bg-[var(--bg-surface)] shadow-2xl outline-none\"\n      >\n        <div className=\"flex items-center gap-2 border-b border-[var(--border)] px-3\">\n          <Search className=\"size-4 shrink-0 text-[var(--text-placeholder)]\" />\n          <input\n            ref={inputRef}\n            role=\"combobox\"\n            aria-expanded\n            aria-controls={listId}\n            aria-activedescendant={flat[active] ? itemId(flat[active].id) : undefined}\n            value={query}\n            onChange={(e) => setQuery(e.target.value)}\n            onKeyDown={onKeyDown}\n            placeholder={l.placeholder}\n            className=\"w-full bg-transparent py-3 text-sm outline-none placeholder:text-[var(--text-placeholder)] text-[var(--text-primary)]\"\n          />\n          {loading && <span className=\"shrink-0 text-[11px] text-[var(--text-placeholder)]\">{l.loading}</span>}\n        </div>\n\n        {/* The status lines sit outside the listbox: a listbox owns options and groups,\n            and \"No results\" is neither. */}\n        {failed && !loading && (\n          <div role=\"alert\" className=\"px-3 py-6 text-center text-sm text-[var(--text-muted)]\">\n            {l.error ?? DEFAULT_COMMAND_PALETTE_LABELS.error}\n          </div>\n        )}\n        {!failed && flat.length === 0 && !loading && (\n          <div className=\"px-3 py-6 text-center text-sm text-[var(--text-muted)]\">{l.empty}</div>\n        )}\n        {/* Listbox grouping: each group is a `role=\"group\"` named by its heading, and\n            the list markup in between is presentational so the listbox's children are\n            groups and options only — as a plain <li>/<ul> tree a reader announced\n            \"list, 2 items\" between options and never tied the heading to its rows. */}\n        <ul id={listId} ref={listRef} role=\"listbox\" aria-label={dialogName} className=\"min-h-0 flex-1 overflow-y-auto py-1\">\n          {groups.map(({ group, items }, groupIndex) => (\n            <li key={group} role=\"presentation\">\n              <div\n                id={groupId(groupIndex)}\n                role=\"presentation\"\n                className=\"px-3 pb-0.5 pt-2 text-[10px] font-semibold uppercase tracking-wide text-[var(--text-placeholder)]\"\n              >\n                {group}\n              </div>\n              <ul role=\"group\" aria-labelledby={groupId(groupIndex)}>\n                {items.map((item) => {\n                  flatIndex += 1;\n                  const idx = flatIndex;\n                  const isActive = idx === active;\n                  // Written once and worn by either tag below, so the anchor and the\n                  // button can never drift apart in looks or in listbox semantics.\n                  // `role=\"option\"` on an <a href> is fine: the browser's middle-click\n                  // behaviour keys off the element, not the ARIA role.\n                  const shared = {\n                    id: itemId(item.id),\n                    role: \"option\" as const,\n                    \"aria-selected\": isActive,\n                    \"data-index\": idx,\n                    onMouseMove: () => setActive(idx),\n                    className: cn(\n                      \"flex w-full items-center gap-2.5 px-3 py-2 text-start text-sm\",\n                      isActive\n                        ? \"bg-[var(--bg-active)] text-[var(--text-primary)]\"\n                        : \"text-[var(--text-secondary)]\",\n                    ),\n                  };\n                  const inner = (\n                    <>\n                      {item.icon && (\n                        <span className=\"flex size-4 shrink-0 items-center justify-center text-[var(--text-placeholder)]\">\n                          {item.icon}\n                        </span>\n                      )}\n                      <span className=\"min-w-0 flex-1 truncate\">{item.label}</span>\n                      {item.hint && (\n                        <span className=\"shrink-0 text-xs text-[var(--text-placeholder)]\">{item.hint}</span>\n                      )}\n                    </>\n                  );\n                  return (\n                    <li key={item.id} role=\"presentation\">\n                      {item.href ? (\n                        <a\n                          {...shared}\n                          href={item.href}\n                          draggable={false}\n                          onClick={(e) => {\n                            // A modified click belongs to the browser (feedback\n                            // #451) — and the palette deliberately stays OPEN for\n                            // it: ⌘-clicking three results in a row is the reason to\n                            // want this, and closing after the first would undo it.\n                            if (\n                              e.button !== 0 ||\n                              e.metaKey ||\n                              e.ctrlKey ||\n                              e.shiftKey ||\n                              e.altKey\n                            )\n                              return;\n                            e.preventDefault();\n                            choose(item);\n                          }}\n                        >\n                          {inner}\n                        </a>\n                      ) : (\n                        <button type=\"button\" {...shared} onClick={() => choose(item)}>\n                          {inner}\n                        </button>\n                      )}\n                    </li>\n                  );\n                })}\n              </ul>\n            </li>\n          ))}\n        </ul>\n\n        {l.hint && (\n          <div className=\"border-t border-[var(--border)] px-3 py-1.5 text-[11px] text-[var(--text-placeholder)]\">\n            {l.hint}\n          </div>\n        )}\n      </div>\n    </div>,\n    document.body,\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/wizard/stepper-nav.d.ts

@@ -1,6 +1,9 @@
 import * as react from 'react';
-import { ReactNode } from 'react';
+import { ReactNode, ReactElement } from 'react';
+import { ButtonVariant } from '../components/ui.js';
 import { UseWizardReturn, WizardLabels } from './types.js';
+import '../components/tooltip.js';
+import '../hooks/use-anchored-rect.js';
 
 /**
  * The chrome around a wizard: the step indicator, the step content, and the
@@ -17,14 +20,44 @@ import { UseWizardReturn, WizardLabels } from './types.js';
  * The `<StepperNav>` is also what publishes {@link WizardContextProvider}, which
  * is how a mounted step registers its own validator. A step's
  * `useRhfWizardStep` / `useWizardStepValidate` therefore only works inside one.
+ *
+ * Which buttons show is read off `wizard` (`canCancel`, `canGoBack`, `canDone`,
+ * `isCommitStep`), so the policy options — `cancellable`, `onExit`, `commits`,
+ * `onDone` — are all set on `useWizard`. What is set HERE is how the Finish button
+ * looks and what wraps it, because that is presentation and usually depends on
+ * state the app holds (a "replace everything" toggle, a write lock).
  */
-declare function StepperNav<TData extends Record<string, unknown>>({ wizard, children, title, description, className, labels, }: {
+declare function StepperNav<TData extends Record<string, unknown>>({ wizard, children, title, description, className, labels, finishVariant, finishDisabled, renderFinish, }: {
     wizard: UseWizardReturn<TData>;
     children: ReactNode;
     title?: ReactNode;
     description?: ReactNode;
     className?: string;
     labels?: Partial<WizardLabels>;
+    /** The Finish button's variant — `"danger"` for a destructive commit (an import
+     *  that replaces what is there). Default `"brand"`. Next keeps `"brand"`. */
+    finishVariant?: ButtonVariant;
+    /** Disable Finish for a reason of the app's own, on top of the kit's gates
+     *  (`canFinish`, submitting, validating). */
+    finishDisabled?: boolean;
+    /**
+     * Wrap the Finish button: receives the kit's button element — already labelled,
+     * gated and wired to `wizard.finish` — and returns what to render in its place.
+     *
+     * ```tsx
+     * renderFinish={(button) => <SaveGuard lock={lock}>{button}</SaveGuard>}
+     * ```
+     *
+     * A wrapper and not a replacement (`finishButton: (props) => …`) or a hook
+     * (`onBeforeFinish`): the app's need is to put something AROUND the commit — a
+     * write-lock tooltip, which has to sit on a wrapping element because a disabled
+     * button receives no pointer events — while the kit keeps owning what the button
+     * says and when it is enabled. A replacement would hand every app the gating to
+     * re-derive (the problem this component exists to end); `onBeforeFinish` can veto
+     * a click but cannot explain a disabled button. The element is a plain `<Button>`,
+     * so a wrapper that clones it with `disabled` works as expected.
+     */
+    renderFinish?: (button: ReactElement) => ReactNode;
 }): react.JSX.Element;
 
 export { StepperNav };

package/dist/wizard/stepper-nav.js

@@ -3,7 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useId, useMemo } from "react";
 import { Check } from "lucide-react";
 import { cn } from "../lib/cn.js";
-import { Button } from "../components/ui.js";
+import { Button, Spinner } from "../components/ui.js";
 import { Modal } from "../components/modal.js";
 import { alertFrameClass } from "../components/alert-banner.js";
 import { WizardContextProvider } from "./wizard-context.js";
@@ -15,7 +15,10 @@ function StepperNav({
   title,
   description,
   className,
-  labels
+  labels,
+  finishVariant = "brand",
+  finishDisabled = false,
+  renderFinish
 }) {
   const l = useKitLabels("wizard", DEFAULT_WIZARD_LABELS, labels);
   const cancelTitleId = useId();
@@ -27,6 +30,43 @@ function StepperNav({
     [wizard.registerStepValidate, wizard.setNextBlocked]
   );
   const canFinish = wizard.canFinish;
+  const pending = wizard.isValidating;
+  const stepNextLabel = wizard.currentStep.nextLabel;
+  let forwardButton = null;
+  if (wizard.isCommitStep) {
+    const finishButton = /* @__PURE__ */ jsxs(
+      Button,
+      {
+        variant: finishVariant,
+        "data-tour": "wizard-finish",
+        onClick: wizard.finish,
+        disabled: wizard.isSubmitting || pending || !canFinish || finishDisabled,
+        "aria-busy": wizard.isSubmitting || pending || void 0,
+        children: [
+          pending && /* @__PURE__ */ jsx(Spinner, { label: null, className: "size-4" }),
+          wizard.isSubmitting ? l.submitting : stepNextLabel ?? l.finish
+        ]
+      }
+    );
+    forwardButton = renderFinish ? renderFinish(finishButton) : finishButton;
+  } else if (wizard.isLastStep) {
+    forwardButton = wizard.canDone ? /* @__PURE__ */ jsx(Button, { variant: "brand", "data-tour": "wizard-done", onClick: wizard.done, children: stepNextLabel ?? l.done ?? DEFAULT_WIZARD_LABELS.done }) : null;
+  } else {
+    forwardButton = /* @__PURE__ */ jsxs(
+      Button,
+      {
+        variant: "brand",
+        "data-tour": "wizard-next",
+        onClick: wizard.goNext,
+        disabled: wizard.nextBlocked || pending,
+        "aria-busy": pending || void 0,
+        children: [
+          pending && /* @__PURE__ */ jsx(Spinner, { label: null, className: "size-4" }),
+          stepNextLabel ?? l.next
+        ]
+      }
+    );
+  }
   return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-6", className), children: [
     (title || description) && /* @__PURE__ */ jsxs("div", { children: [
       title && /* @__PURE__ */ jsx("h1", { className: "text-2xl font-bold tracking-tight text-[var(--text-primary)]", children: title }),
@@ -42,7 +82,7 @@ function StepperNav({
             {
               type: "button",
               onClick: () => wizard.goToStep(index),
-              disabled: status === "upcoming",
+              disabled: status === "upcoming" || !wizard.canGoToStep(index),
               "aria-current": status === "active" ? "step" : void 0,
               className: cn(
                 "group flex flex-col items-center gap-1.5",
@@ -105,29 +145,21 @@ function StepperNav({
       }
     ),
     /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between border-t border-[var(--border)] pt-4", children: [
-      /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: wizard.cancel, children: l.cancel }),
+      wizard.canCancel ? /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: wizard.cancel, children: l.cancel }) : /* @__PURE__ */ jsx("span", {}),
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-        !wizard.isFirstStep && /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: wizard.goBack, children: l.back }),
-        wizard.currentStep.optional && !wizard.isLastStep && /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: wizard.skip, disabled: wizard.nextBlocked, children: l.skip }),
-        wizard.isLastStep ? /* @__PURE__ */ jsx(
+        wizard.canGoBack && // Disabled, not hidden, while the commit runs: it comes back if the commit
+        // fails, and a button that vanishes mid-click is its own kind of surprise.
+        /* @__PURE__ */ jsx(Button, { variant: "secondary", onClick: wizard.goBack, disabled: wizard.isSubmitting, children: l.back }),
+        wizard.currentStep.optional && !wizard.isLastStep && !wizard.isCommitStep && /* @__PURE__ */ jsx(
           Button,
           {
-            variant: "brand",
-            "data-tour": "wizard-finish",
-            onClick: wizard.finish,
-            disabled: wizard.isSubmitting || !canFinish,
-            children: wizard.isSubmitting ? l.submitting : l.finish
+            variant: "ghost",
+            onClick: wizard.skip,
+            disabled: wizard.nextBlocked || wizard.isValidating,
+            children: l.skip
           }
-        ) : /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "brand",
-            "data-tour": "wizard-next",
-            onClick: wizard.goNext,
-            disabled: wizard.nextBlocked,
-            children: l.next
-          }
-        )
+        ),
+        forwardButton
       ] })
     ] }),
     wizard.showCancelDialog && /* @__PURE__ */ jsxs(Modal, { onClose: wizard.dismissCancel, labelledBy: cancelTitleId, className: "space-y-4", children: [

package/dist/wizard/stepper-nav.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/wizard/stepper-nav.tsx"],"sourcesContent":["import { useId, useMemo } from \"react\";\nimport type { ReactNode } from \"react\";\nimport { Check } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { Button } from \"../components/ui\";\nimport { Modal } from \"../components/modal\";\nimport { alertFrameClass } from \"../components/alert-banner\";\nimport { WizardContextProvider } from \"./wizard-context\";\nimport { DEFAULT_WIZARD_LABELS } from \"./types\";\nimport { useKitLabels } from \"../i18n/kit-labels\";\nimport type { UseWizardReturn, WizardLabels } from \"./types\";\n\n/**\n * The chrome around a wizard: the step indicator, the step content, and the\n * Cancel / Back / Skip / Next / Finish bar — plus the cancel-confirmation\n * dialog, because \"are you sure you want to lose this\" is part of the wizard's\n * contract rather than something each app should re-decide.\n *\n * It is a component and not a set of parts for one reason: which button shows,\n * and whether it is enabled, is a function of `wizard` state that was getting\n * re-derived (and re-derived slightly differently) at every call site. Finish is\n * gated on `canFinish`, Next and Skip on `nextBlocked`, and Skip only appears on\n * an `optional` step that is not the last — that policy lives here now.\n *\n * The `<StepperNav>` is also what publishes {@link WizardContextProvider}, which\n * is how a mounted step registers its own validator. A step's\n * `useRhfWizardStep` / `useWizardStepValidate` therefore only works inside one.\n */\nexport function StepperNav<TData extends Record<string, unknown>>({\n  wizard,\n  children,\n  title,\n  description,\n  className,\n  labels,\n}: {\n  wizard: UseWizardReturn<TData>;\n  children: ReactNode;\n  title?: ReactNode;\n  description?: ReactNode;\n  className?: string;\n  labels?: Partial<WizardLabels>;\n}) {\n  const l = useKitLabels(\"wizard\", DEFAULT_WIZARD_LABELS, labels);\n  const cancelTitleId = useId();\n\n  const contextValue = useMemo(\n    () => ({\n      registerStepValidate: wizard.registerStepValidate,\n      setNextBlocked: wizard.setNextBlocked,\n    }),\n    [wizard.registerStepValidate, wizard.setNextBlocked],\n  );\n\n  // Finish is only valid once every step before the last has been completed or\n  // skipped (derived once in useWizard). Prevents a restored last-step index\n  // (empty data after a reload) from firing an empty submit.\n  const canFinish = wizard.canFinish;\n\n  return (\n    <div className={cn(\"flex flex-col gap-6\", className)}>\n      {(title || description) && (\n        <div>\n          {title && (\n            <h1 className=\"text-2xl font-bold tracking-tight text-[var(--text-primary)]\">\n              {title}\n            </h1>\n          )}\n          {description && (\n            <p className=\"mt-1 text-sm text-[var(--text-muted)]\">{description}</p>\n          )}\n        </div>\n      )}\n\n      {/* Step indicator */}\n      <nav aria-label={l.steps}>\n        <ol className=\"flex w-full items-center\">\n          {wizard.steps.map((step, index) => {\n            const status = wizard.stepStatus(index);\n            const isLast = index === wizard.steps.length - 1;\n\n            return (\n              <li key={step.id} className={cn(\"flex items-center\", !isLast && \"flex-1\")}>\n                <button\n                  type=\"button\"\n                  onClick={() => wizard.goToStep(index)}\n                  disabled={status === \"upcoming\"}\n                  aria-current={status === \"active\" ? \"step\" : undefined}\n                  className={cn(\n                    \"group flex flex-col items-center gap-1.5\",\n                    status === \"upcoming\" ? \"cursor-default\" : \"cursor-pointer\",\n                  )}\n                >\n                  {/* Circle */}\n                  <span\n                    className={cn(\n                      \"flex size-8 shrink-0 items-center justify-center rounded-full border-2 text-xs font-semibold transition-colors\",\n                      status === \"completed\" &&\n                        \"border-[var(--brand)] bg-[var(--brand)] text-[var(--brand-contrast)]\",\n                      status === \"active\" &&\n                        \"border-[var(--brand)] bg-[var(--bg-surface)] text-[var(--brand)]\",\n                      status === \"upcoming\" &&\n                        \"border-[var(--border)] bg-[var(--bg-surface)] text-[var(--text-placeholder)]\",\n                      status === \"skipped\" &&\n                        \"border-[var(--border)] bg-[var(--bg-surface-2)] text-[var(--text-muted)]\",\n                    )}\n                  >\n                    {status === \"completed\" ? <Check className=\"size-4\" /> : index + 1}\n                  </span>\n                  {/* Label — hidden on mobile, where the line below carries it */}\n                  <span\n                    className={cn(\n                      \"hidden text-xs font-medium md:block\",\n                      status === \"active\" || status === \"completed\"\n                        ? \"text-[var(--text-primary)]\"\n                        : \"text-[var(--text-muted)]\",\n                    )}\n                  >\n                    {step.label}\n                  </span>\n                </button>\n\n                {/* Connector line */}\n                {!isLast && (\n                  <div\n                    className={cn(\n                      \"mx-2 h-0.5 flex-1\",\n                      status === \"completed\" ? \"bg-[var(--brand)]\" : \"bg-[var(--border)]\",\n                    )}\n                  />\n                )}\n              </li>\n            );\n          })}\n        </ol>\n        {/* Mobile: the labels above are hidden, so name the current step here */}\n        <p className=\"mt-2 text-center text-sm font-medium text-[var(--text-primary)] md:hidden\">\n          {l.step(wizard.currentStepIndex + 1, wizard.steps.length)}\n          {\" — \"}\n          {wizard.currentStep.label}\n        </p>\n      </nav>\n\n      {/* Step content */}\n      <WizardContextProvider value={contextValue}>\n        <div className=\"min-h-[300px]\">{children}</div>\n      </WizardContextProvider>\n\n      {/* Submit error */}\n      {wizard.error && (\n        <div\n          role=\"alert\"\n          className={cn(\n            \"text-sm text-[var(--danger)]\",\n            alertFrameClass(\"danger\"),\n          )}\n        >\n          {wizard.error}\n        </div>\n      )}\n\n      {/* Navigation bar */}\n      <div className=\"flex items-center justify-between border-t border-[var(--border)] pt-4\">\n        <Button variant=\"secondary\" onClick={wizard.cancel}>\n          {l.cancel}\n        </Button>\n        <div className=\"flex items-center gap-2\">\n          {!wizard.isFirstStep && (\n            <Button variant=\"secondary\" onClick={wizard.goBack}>\n              {l.back}\n            </Button>\n          )}\n          {wizard.currentStep.optional && !wizard.isLastStep && (\n            <Button variant=\"ghost\" onClick={wizard.skip} disabled={wizard.nextBlocked}>\n              {l.skip}\n            </Button>\n          )}\n          {wizard.isLastStep ? (\n            <Button\n              variant=\"brand\"\n              data-tour=\"wizard-finish\"\n              onClick={wizard.finish}\n              disabled={wizard.isSubmitting || !canFinish}\n            >\n              {wizard.isSubmitting ? l.submitting : l.finish}\n            </Button>\n          ) : (\n            <Button\n              variant=\"brand\"\n              data-tour=\"wizard-next\"\n              onClick={wizard.goNext}\n              disabled={wizard.nextBlocked}\n            >\n              {l.next}\n            </Button>\n          )}\n        </div>\n      </div>\n\n      {/* Cancel confirmation */}\n      {wizard.showCancelDialog && (\n        <Modal onClose={wizard.dismissCancel} labelledBy={cancelTitleId} className=\"space-y-4\">\n          <div className=\"space-y-1.5\">\n            <h2 id={cancelTitleId} className=\"text-lg font-semibold text-[var(--text-primary)]\">\n              {l.cancelTitle}\n            </h2>\n            <p className=\"text-sm text-[var(--text-muted)]\">{l.confirmCancel}</p>\n          </div>\n          <div className=\"flex flex-col-reverse gap-2 sm:flex-row sm:justify-end\">\n            <Button variant=\"secondary\" onClick={wizard.dismissCancel}>\n              {l.cancelDismissLabel}\n            </Button>\n            <Button variant=\"danger\" onClick={wizard.confirmCancel}>\n              {l.cancelConfirmLabel}\n            </Button>\n          </div>\n        </Modal>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/wizard/stepper-nav.tsx"],"sourcesContent":["import { useId, useMemo } from \"react\";\nimport type { ReactElement, ReactNode } from \"react\";\nimport { Check } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { Button, Spinner } from \"../components/ui\";\nimport type { ButtonVariant } from \"../components/ui\";\nimport { Modal } from \"../components/modal\";\nimport { alertFrameClass } from \"../components/alert-banner\";\nimport { WizardContextProvider } from \"./wizard-context\";\nimport { DEFAULT_WIZARD_LABELS } from \"./types\";\nimport { useKitLabels } from \"../i18n/kit-labels\";\nimport type { UseWizardReturn, WizardLabels } from \"./types\";\n\n/**\n * The chrome around a wizard: the step indicator, the step content, and the\n * Cancel / Back / Skip / Next / Finish bar — plus the cancel-confirmation\n * dialog, because \"are you sure you want to lose this\" is part of the wizard's\n * contract rather than something each app should re-decide.\n *\n * It is a component and not a set of parts for one reason: which button shows,\n * and whether it is enabled, is a function of `wizard` state that was getting\n * re-derived (and re-derived slightly differently) at every call site. Finish is\n * gated on `canFinish`, Next and Skip on `nextBlocked`, and Skip only appears on\n * an `optional` step that is not the last — that policy lives here now.\n *\n * The `<StepperNav>` is also what publishes {@link WizardContextProvider}, which\n * is how a mounted step registers its own validator. A step's\n * `useRhfWizardStep` / `useWizardStepValidate` therefore only works inside one.\n *\n * Which buttons show is read off `wizard` (`canCancel`, `canGoBack`, `canDone`,\n * `isCommitStep`), so the policy options — `cancellable`, `onExit`, `commits`,\n * `onDone` — are all set on `useWizard`. What is set HERE is how the Finish button\n * looks and what wraps it, because that is presentation and usually depends on\n * state the app holds (a \"replace everything\" toggle, a write lock).\n */\nexport function StepperNav<TData extends Record<string, unknown>>({\n  wizard,\n  children,\n  title,\n  description,\n  className,\n  labels,\n  finishVariant = \"brand\",\n  finishDisabled = false,\n  renderFinish,\n}: {\n  wizard: UseWizardReturn<TData>;\n  children: ReactNode;\n  title?: ReactNode;\n  description?: ReactNode;\n  className?: string;\n  labels?: Partial<WizardLabels>;\n  /** The Finish button's variant — `\"danger\"` for a destructive commit (an import\n   *  that replaces what is there). Default `\"brand\"`. Next keeps `\"brand\"`. */\n  finishVariant?: ButtonVariant;\n  /** Disable Finish for a reason of the app's own, on top of the kit's gates\n   *  (`canFinish`, submitting, validating). */\n  finishDisabled?: boolean;\n  /**\n   * Wrap the Finish button: receives the kit's button element — already labelled,\n   * gated and wired to `wizard.finish` — and returns what to render in its place.\n   *\n   * ```tsx\n   * renderFinish={(button) => <SaveGuard lock={lock}>{button}</SaveGuard>}\n   * ```\n   *\n   * A wrapper and not a replacement (`finishButton: (props) => …`) or a hook\n   * (`onBeforeFinish`): the app's need is to put something AROUND the commit — a\n   * write-lock tooltip, which has to sit on a wrapping element because a disabled\n   * button receives no pointer events — while the kit keeps owning what the button\n   * says and when it is enabled. A replacement would hand every app the gating to\n   * re-derive (the problem this component exists to end); `onBeforeFinish` can veto\n   * a click but cannot explain a disabled button. The element is a plain `<Button>`,\n   * so a wrapper that clones it with `disabled` works as expected.\n   */\n  renderFinish?: (button: ReactElement) => ReactNode;\n}) {\n  const l = useKitLabels(\"wizard\", DEFAULT_WIZARD_LABELS, labels);\n  const cancelTitleId = useId();\n\n  const contextValue = useMemo(\n    () => ({\n      registerStepValidate: wizard.registerStepValidate,\n      setNextBlocked: wizard.setNextBlocked,\n    }),\n    [wizard.registerStepValidate, wizard.setNextBlocked],\n  );\n\n  // Finish is only valid once every step before the last has been completed or\n  // skipped (derived once in useWizard). Prevents a restored last-step index\n  // (empty data after a reload) from firing an empty submit.\n  const canFinish = wizard.canFinish;\n\n  // Pending while the step's validators run (an async server check): a spinner and\n  // `aria-busy`, and disabled — the hook's own re-entry guard still refuses a second\n  // press, this just stops it looking like the first one did nothing.\n  const pending = wizard.isValidating;\n  const stepNextLabel = wizard.currentStep.nextLabel;\n\n  let forwardButton: ReactNode = null;\n  if (wizard.isCommitStep) {\n    const finishButton = (\n      <Button\n        variant={finishVariant}\n        data-tour=\"wizard-finish\"\n        onClick={wizard.finish}\n        disabled={wizard.isSubmitting || pending || !canFinish || finishDisabled}\n        aria-busy={wizard.isSubmitting || pending || undefined}\n      >\n        {/* Decorative: the button's text is what a reader hears. */}\n        {pending && <Spinner label={null} className=\"size-4\" />}\n        {wizard.isSubmitting ? l.submitting : (stepNextLabel ?? l.finish)}\n      </Button>\n    );\n    forwardButton = renderFinish ? renderFinish(finishButton) : finishButton;\n  } else if (wizard.isLastStep) {\n    // The last step after a commit. Nothing to finish; Done only when the app gave\n    // an `onDone` — otherwise the step carries its own way out.\n    forwardButton = wizard.canDone ? (\n      <Button variant=\"brand\" data-tour=\"wizard-done\" onClick={wizard.done}>\n        {stepNextLabel ?? l.done ?? DEFAULT_WIZARD_LABELS.done}\n      </Button>\n    ) : null;\n  } else {\n    forwardButton = (\n      <Button\n        variant=\"brand\"\n        data-tour=\"wizard-next\"\n        onClick={wizard.goNext}\n        disabled={wizard.nextBlocked || pending}\n        aria-busy={pending || undefined}\n      >\n        {pending && <Spinner label={null} className=\"size-4\" />}\n        {stepNextLabel ?? l.next}\n      </Button>\n    );\n  }\n\n  return (\n    <div className={cn(\"flex flex-col gap-6\", className)}>\n      {(title || description) && (\n        <div>\n          {title && (\n            <h1 className=\"text-2xl font-bold tracking-tight text-[var(--text-primary)]\">\n              {title}\n            </h1>\n          )}\n          {description && (\n            <p className=\"mt-1 text-sm text-[var(--text-muted)]\">{description}</p>\n          )}\n        </div>\n      )}\n\n      {/* Step indicator */}\n      <nav aria-label={l.steps}>\n        <ol className=\"flex w-full items-center\">\n          {wizard.steps.map((step, index) => {\n            const status = wizard.stepStatus(index);\n            const isLast = index === wizard.steps.length - 1;\n\n            return (\n              <li key={step.id} className={cn(\"flex items-center\", !isLast && \"flex-1\")}>\n                <button\n                  type=\"button\"\n                  onClick={() => wizard.goToStep(index)}\n                  // `canGoToStep` adds the commit lock: once past a committing step,\n                  // the steps up to it are done with and cannot be reopened.\n                  disabled={status === \"upcoming\" || !wizard.canGoToStep(index)}\n                  aria-current={status === \"active\" ? \"step\" : undefined}\n                  className={cn(\n                    \"group flex flex-col items-center gap-1.5\",\n                    status === \"upcoming\" ? \"cursor-default\" : \"cursor-pointer\",\n                  )}\n                >\n                  {/* Circle */}\n                  <span\n                    className={cn(\n                      \"flex size-8 shrink-0 items-center justify-center rounded-full border-2 text-xs font-semibold transition-colors\",\n                      status === \"completed\" &&\n                        \"border-[var(--brand)] bg-[var(--brand)] text-[var(--brand-contrast)]\",\n                      status === \"active\" &&\n                        \"border-[var(--brand)] bg-[var(--bg-surface)] text-[var(--brand)]\",\n                      status === \"upcoming\" &&\n                        \"border-[var(--border)] bg-[var(--bg-surface)] text-[var(--text-placeholder)]\",\n                      status === \"skipped\" &&\n                        \"border-[var(--border)] bg-[var(--bg-surface-2)] text-[var(--text-muted)]\",\n                    )}\n                  >\n                    {status === \"completed\" ? <Check className=\"size-4\" /> : index + 1}\n                  </span>\n                  {/* Label — hidden on mobile, where the line below carries it */}\n                  <span\n                    className={cn(\n                      \"hidden text-xs font-medium md:block\",\n                      status === \"active\" || status === \"completed\"\n                        ? \"text-[var(--text-primary)]\"\n                        : \"text-[var(--text-muted)]\",\n                    )}\n                  >\n                    {step.label}\n                  </span>\n                </button>\n\n                {/* Connector line */}\n                {!isLast && (\n                  <div\n                    className={cn(\n                      \"mx-2 h-0.5 flex-1\",\n                      status === \"completed\" ? \"bg-[var(--brand)]\" : \"bg-[var(--border)]\",\n                    )}\n                  />\n                )}\n              </li>\n            );\n          })}\n        </ol>\n        {/* Mobile: the labels above are hidden, so name the current step here */}\n        <p className=\"mt-2 text-center text-sm font-medium text-[var(--text-primary)] md:hidden\">\n          {l.step(wizard.currentStepIndex + 1, wizard.steps.length)}\n          {\" — \"}\n          {wizard.currentStep.label}\n        </p>\n      </nav>\n\n      {/* Step content */}\n      <WizardContextProvider value={contextValue}>\n        <div className=\"min-h-[300px]\">{children}</div>\n      </WizardContextProvider>\n\n      {/* Submit error */}\n      {wizard.error && (\n        <div\n          role=\"alert\"\n          className={cn(\n            \"text-sm text-[var(--danger)]\",\n            alertFrameClass(\"danger\"),\n          )}\n        >\n          {wizard.error}\n        </div>\n      )}\n\n      {/* Navigation bar */}\n      <div className=\"flex items-center justify-between border-t border-[var(--border)] pt-4\">\n        {/* The empty span keeps the right-hand group on the right when Cancel is off. */}\n        {wizard.canCancel ? (\n          <Button variant=\"secondary\" onClick={wizard.cancel}>\n            {l.cancel}\n          </Button>\n        ) : (\n          <span />\n        )}\n        <div className=\"flex items-center gap-2\">\n          {wizard.canGoBack && (\n            // Disabled, not hidden, while the commit runs: it comes back if the commit\n            // fails, and a button that vanishes mid-click is its own kind of surprise.\n            <Button variant=\"secondary\" onClick={wizard.goBack} disabled={wizard.isSubmitting}>\n              {l.back}\n            </Button>\n          )}\n          {wizard.currentStep.optional && !wizard.isLastStep && !wizard.isCommitStep && (\n            <Button\n              variant=\"ghost\"\n              onClick={wizard.skip}\n              disabled={wizard.nextBlocked || wizard.isValidating}\n            >\n              {l.skip}\n            </Button>\n          )}\n          {forwardButton}\n        </div>\n      </div>\n\n      {/* Cancel confirmation */}\n      {wizard.showCancelDialog && (\n        <Modal onClose={wizard.dismissCancel} labelledBy={cancelTitleId} className=\"space-y-4\">\n          <div className=\"space-y-1.5\">\n            <h2 id={cancelTitleId} className=\"text-lg font-semibold text-[var(--text-primary)]\">\n              {l.cancelTitle}\n            </h2>\n            <p className=\"text-sm text-[var(--text-muted)]\">{l.confirmCancel}</p>\n          </div>\n          <div className=\"flex flex-col-reverse gap-2 sm:flex-row sm:justify-end\">\n            <Button variant=\"secondary\" onClick={wizard.dismissCancel}>\n              {l.cancelDismissLabel}\n            </Button>\n            <Button variant=\"danger\" onClick={wizard.confirmCancel}>\n              {l.cancelConfirmLabel}\n            </Button>\n          </div>\n        </Modal>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}