@eifi1/ui-kit 0.10.0 → 0.11.0

package/dist/lib/dates.js

@@ -70,6 +70,23 @@ function addDaysIso(iso, days) {
   d.setDate(d.getDate() + days);
   return toLocalIso(d);
 }
+function addMonthsClamped(d, months) {
+  const day = d.getDate();
+  const out = new Date(d.getFullYear(), d.getMonth() + months, 1);
+  const lastOfTarget = new Date(out.getFullYear(), out.getMonth() + 1, 0).getDate();
+  out.setDate(Math.min(day, lastOfTarget));
+  return out;
+}
+function localeWeekStart(locale) {
+  try {
+    const tag = locale ?? new Intl.DateTimeFormat().resolvedOptions().locale;
+    const loc = new Intl.Locale(tag);
+    const firstDay = (loc.getWeekInfo?.() ?? loc.weekInfo)?.firstDay;
+    if (typeof firstDay === "number") return firstDay % 7;
+  } catch {
+  }
+  return 1;
+}
 function sameYmd(a, b) {
   return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
 }
@@ -107,6 +124,7 @@ function calendarMonthPresets(options = {}) {
 }
 export {
   addDaysIso,
+  addMonthsClamped,
   calendarMonthPresets,
   dateRangePresets,
   endOfMonthIso,
@@ -114,6 +132,7 @@ export {
   formatIsoDate,
   lastFullMonthsRange,
   lastFullYearsRange,
+  localeWeekStart,
   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\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":[]}
+{"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/**\n * `d` moved by whole months, keeping the day of the month where the target has one.\n * `setMonth` alone ROLLS OVER — 31 January + 1 month is 3 March — which would skip\n * February entirely for anyone paging through the year with PageDown. Returns a new\n * Date; `d` is not touched.\n */\nexport function addMonthsClamped(d: Date, months: number): Date {\n  const day = d.getDate();\n  const out = new Date(d.getFullYear(), d.getMonth() + months, 1);\n  const lastOfTarget = new Date(out.getFullYear(), out.getMonth() + 1, 0).getDate();\n  out.setDate(Math.min(day, lastOfTarget));\n  return out;\n}\n\n/**\n * The first day of the week in `locale`, as a `Date#getDay` index (0 = Sunday).\n *\n * `Intl.Locale#getWeekInfo()` is the standard spelling; V8 shipped it first as the\n * `weekInfo` accessor, and Firefox has neither yet — hence both reads and a Monday\n * fallback, which is ISO 8601. Its `firstDay` counts 1 = Monday … 7 = Sunday, so `% 7`\n * maps it onto `getDay`. `undefined` asks for the runtime's default locale.\n */\nexport function localeWeekStart(locale: string | undefined): 0 | 1 | 2 | 3 | 4 | 5 | 6 {\n  try {\n    const tag = locale ?? new Intl.DateTimeFormat().resolvedOptions().locale;\n    const loc = new Intl.Locale(tag) as Intl.Locale & {\n      getWeekInfo?: () => { firstDay: number };\n      weekInfo?: { firstDay: number };\n    };\n    const firstDay = (loc.getWeekInfo?.() ?? loc.weekInfo)?.firstDay;\n    if (typeof firstDay === \"number\") return (firstDay % 7) as 0 | 1 | 2 | 3 | 4 | 5 | 6;\n  } catch {\n    // A malformed tag throws from `Intl.Locale`; a calendar still has to render.\n  }\n  return 1;\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/rhf/form.d.ts

@@ -5,6 +5,7 @@ import { FieldValues, FieldPath, ControllerProps } from 'react-hook-form';
 import { LabelProps } from '../components/ui.js';
 import '../components/tooltip.js';
 import '../hooks/use-anchored-rect.js';
+import '../lib/clipping.js';
 
 /** The form's `useForm()` return, spread in: `<Form {...form}>`. react-hook-form's own
  *  `FormProvider`, under the name the shadcn file gave it. */

package/dist/rhf/use-rhf-wizard-step.d.ts

@@ -0,0 +1,22 @@
+import { FieldValues, FieldPath, UseFormReturn } from 'react-hook-form';
+
+type RhfWizardStepOptions<TFieldValues extends FieldValues, TTransformed = TFieldValues> = {
+    /** Validate only these fields — the step's share of a form that spans steps. */
+    fields: readonly FieldPath<TFieldValues>[];
+    /** Called with `form.getValues()` when the fields pass, before the wizard
+     *  advances. */
+    onValid?: (values: TFieldValues) => void;
+} | {
+    /** Omitted: validate the whole form through `handleSubmit`. */
+    fields?: undefined;
+    /** Called with the form's (transformed) values when it passes, before the
+     *  wizard advances. */
+    onValid?: (values: TTransformed) => void;
+};
+/**
+ * Connects `form` to the wizard's step validation and returns the step's validator.
+ * See the module note for the two modes.
+ */
+declare function useRhfWizardStep<TFieldValues extends FieldValues, TContext = unknown, TTransformed = TFieldValues>(form: UseFormReturn<TFieldValues, TContext, TTransformed>, options?: RhfWizardStepOptions<TFieldValues, TTransformed> | ((values: TTransformed) => void)): () => Promise<boolean>;
+
+export { type RhfWizardStepOptions, useRhfWizardStep };

package/dist/rhf/use-rhf-wizard-step.js

@@ -0,0 +1,38 @@
+"use client";
+import { useCallback, useEffect, useRef } from "react";
+import { useOptionalWizardContext } from "../wizard/wizard-context.js";
+function useRhfWizardStep(form, options) {
+  const opts = typeof options === "function" ? { onValid: options } : options ?? {};
+  const optsRef = useRef(opts);
+  useEffect(() => {
+    optsRef.current = opts;
+  });
+  const validate = useCallback(async () => {
+    const current = optsRef.current;
+    if (current.fields) {
+      const ok2 = await form.trigger([...current.fields], { shouldFocus: true });
+      if (ok2) current.onValid?.(form.getValues());
+      return ok2;
+    }
+    const onValid = current.onValid;
+    let ok = false;
+    await form.handleSubmit(
+      (values) => {
+        ok = true;
+        onValid?.(values);
+      },
+      () => {
+        ok = false;
+      }
+    )();
+    return ok;
+  }, [form]);
+  const wizard = useOptionalWizardContext();
+  const register = wizard?.registerStepValidate;
+  useEffect(() => register?.(validate), [register, validate]);
+  return validate;
+}
+export {
+  useRhfWizardStep
+};
+//# sourceMappingURL=use-rhf-wizard-step.js.map

package/dist/rhf/use-rhf-wizard-step.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/rhf/use-rhf-wizard-step.ts"],"sourcesContent":["/**\n * The bridge between a react-hook-form step and the wizard's Next gate.\n * `@eifi1/ui-kit/rhf`.\n *\n * ```tsx\n * function AddressStep({ onUpdate }: { onUpdate: (v: Address) => void }) {\n *   const form = useForm<Address>({ defaultValues });\n *   useRhfWizardStep(form, { onValid: onUpdate });\n *   return <Form {...form}>…</Form>;\n * }\n * ```\n *\n * Inside a `<StepperNav>` the hook registers the step's validator with the wizard, so\n * Next (and Finish on a form-bearing last step) runs it: on success the values go to\n * `onValid` and the wizard advances; on failure react-hook-form shows its own inline\n * `<FormMessage>`s, focuses the first field in error, and the wizard stays put — and,\n * since the result carries no per-field errors, says its \"fill in the required\n * fields\" line so the button did not seem to do nothing. It also RETURNS the\n * validator, for a nav of your own outside `<StepperNav>` (where there is no wizard\n * context to register with, so nothing is registered).\n *\n * Two modes:\n *\n *  - **The whole form** (no `fields`): `form.handleSubmit`, exactly as kastlan's\n *    `use-rhf-wizard-step.ts` — every rule and the resolver run, `onValid` receives\n *    the TRANSFORMED values (a zod `.transform()` included), and focus follows the\n *    form's own `shouldFocusError` (on by default).\n *  - **Some fields** (`fields: [\"iban\", \"bic\"]`): `form.trigger(fields)`, for a wizard\n *    that keeps one form across several steps, each of which validates only what it\n *    shows. The first of those fields in error is focused (`shouldFocus`; the control\n *    has to take `field.ref`), errors on fields of later steps are not raised, and\n *    `onValid` receives `form.getValues()` — the untransformed values, because a\n *    resolver's output is only produced for the whole form.\n *\n * Both callbacks are read through refs, so the validator is registered once per form\n * however the caller writes them (an inline `(v) => onUpdate(v)` is the usual case).\n *\n * The positional `useRhfWizardStep(form, onValid)` of the hook kastlan kept is the\n * whole-form mode, and still accepted.\n *\n * Why it lives here and not in `@eifi1/ui-kit/wizard`: it imports react-hook-form,\n * which only this entry may (see packaging-contract).\n */\nimport { useCallback, useEffect, useRef } from \"react\";\nimport type { FieldPath, FieldValues, UseFormReturn } from \"react-hook-form\";\nimport { useOptionalWizardContext } from \"../wizard/wizard-context\";\n\nexport type RhfWizardStepOptions<\n  TFieldValues extends FieldValues,\n  TTransformed = TFieldValues,\n> =\n  | {\n      /** Validate only these fields — the step's share of a form that spans steps. */\n      fields: readonly FieldPath<TFieldValues>[];\n      /** Called with `form.getValues()` when the fields pass, before the wizard\n       *  advances. */\n      onValid?: (values: TFieldValues) => void;\n    }\n  | {\n      /** Omitted: validate the whole form through `handleSubmit`. */\n      fields?: undefined;\n      /** Called with the form's (transformed) values when it passes, before the\n       *  wizard advances. */\n      onValid?: (values: TTransformed) => void;\n    };\n\n/**\n * Connects `form` to the wizard's step validation and returns the step's validator.\n * See the module note for the two modes.\n */\nexport function useRhfWizardStep<\n  TFieldValues extends FieldValues,\n  TContext = unknown,\n  TTransformed = TFieldValues,\n>(\n  form: UseFormReturn<TFieldValues, TContext, TTransformed>,\n  options?:\n    | RhfWizardStepOptions<TFieldValues, TTransformed>\n    | ((values: TTransformed) => void),\n): () => Promise<boolean> {\n  const opts = typeof options === \"function\" ? { onValid: options } : (options ?? {});\n  const optsRef = useRef(opts);\n  useEffect(() => {\n    optsRef.current = opts;\n  });\n\n  const validate = useCallback(async (): Promise<boolean> => {\n    const current = optsRef.current;\n    if (current.fields) {\n      const ok = await form.trigger([...current.fields], { shouldFocus: true });\n      if (ok) current.onValid?.(form.getValues());\n      return ok;\n    }\n    const onValid = current.onValid as ((values: TTransformed) => void) | undefined;\n    let ok = false;\n    await form.handleSubmit(\n      (values) => {\n        ok = true;\n        onValid?.(values);\n      },\n      () => {\n        ok = false;\n      },\n    )();\n    return ok;\n  }, [form]);\n\n  const wizard = useOptionalWizardContext();\n  const register = wizard?.registerStepValidate;\n  useEffect(() => register?.(validate), [register, validate]);\n\n  return validate;\n}\n"],"mappings":";AA2CA,SAAS,aAAa,WAAW,cAAc;AAE/C,SAAS,gCAAgC;AAyBlC,SAAS,iBAKd,MACA,SAGwB;AACxB,QAAM,OAAO,OAAO,YAAY,aAAa,EAAE,SAAS,QAAQ,IAAK,WAAW,CAAC;AACjF,QAAM,UAAU,OAAO,IAAI;AAC3B,YAAU,MAAM;AACd,YAAQ,UAAU;AAAA,EACpB,CAAC;AAED,QAAM,WAAW,YAAY,YAA8B;AACzD,UAAM,UAAU,QAAQ;AACxB,QAAI,QAAQ,QAAQ;AAClB,YAAMA,MAAK,MAAM,KAAK,QAAQ,CAAC,GAAG,QAAQ,MAAM,GAAG,EAAE,aAAa,KAAK,CAAC;AACxE,UAAIA,IAAI,SAAQ,UAAU,KAAK,UAAU,CAAC;AAC1C,aAAOA;AAAA,IACT;AACA,UAAM,UAAU,QAAQ;AACxB,QAAI,KAAK;AACT,UAAM,KAAK;AAAA,MACT,CAAC,WAAW;AACV,aAAK;AACL,kBAAU,MAAM;AAAA,MAClB;AAAA,MACA,MAAM;AACJ,aAAK;AAAA,MACP;AAAA,IACF,EAAE;AACF,WAAO;AAAA,EACT,GAAG,CAAC,IAAI,CAAC;AAET,QAAM,SAAS,yBAAyB;AACxC,QAAM,WAAW,QAAQ;AACzB,YAAU,MAAM,WAAW,QAAQ,GAAG,CAAC,UAAU,QAAQ,CAAC;AAE1D,SAAO;AACT;","names":["ok"]}

package/dist/rhf.d.ts

@@ -1,6 +1,8 @@
 export { Form, FormControl, FormControlProps, FormDescription, FormDescriptionProps, FormField, FormItem, FormItemProps, FormLabel, FormLabelProps, FormMessage, FormMessageProps, useFormField } from './rhf/form.js';
+export { RhfWizardStepOptions, useRhfWizardStep } from './rhf/use-rhf-wizard-step.js';
 import 'react';
 import 'react-hook-form';
 import './components/ui.js';
 import './components/tooltip.js';
 import './hooks/use-anchored-rect.js';
+import './lib/clipping.js';

package/dist/rhf.js

@@ -1,3 +1,4 @@
 "use client";
 export * from "./rhf/form.js";
+export * from "./rhf/use-rhf-wizard-step.js";
 //# sourceMappingURL=rhf.js.map

package/dist/rhf.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/rhf.ts"],"sourcesContent":["// `@eifi1/ui-kit/rhf` — the react-hook-form adapter: Form, FormField, FormItem,\n// FormLabel, FormControl, FormDescription, FormMessage and useFormField.\n//\n// The only entry point in the package that requires `react-hook-form`, and an optional\n// peer for that reason: an app without a form library installs nothing for it. NOT\n// re-exported from the main barrel, which would make the peer everyone's — the reason\n// the barrel dropped its last react-hook-form import (see the wizard section of\n// src/index.ts). The packaging contract test holds that line.\nexport * from \"./rhf/form\";\n"],"mappings":";AAQA,cAAc;","names":[]}
+{"version":3,"sources":["../src/rhf.ts"],"sourcesContent":["// `@eifi1/ui-kit/rhf` — the react-hook-form adapter: Form, FormField, FormItem,\n// FormLabel, FormControl, FormDescription, FormMessage and useFormField.\n//\n// The only entry point in the package that requires `react-hook-form`, and an optional\n// peer for that reason: an app without a form library installs nothing for it. NOT\n// re-exported from the main barrel, which would make the peer everyone's — the reason\n// the barrel dropped its last react-hook-form import (see the wizard section of\n// src/index.ts). The packaging contract test holds that line.\nexport * from \"./rhf/form\";\n// The react-hook-form bridge to the wizard's Next gate (useWizard lives in /wizard).\nexport * from \"./rhf/use-rhf-wizard-step\";\n"],"mappings":";AAQA,cAAc;AAEd,cAAc;","names":[]}

package/dist/shell/topbar-action-menu.d.ts

@@ -1,11 +1,17 @@
 import * as react from 'react';
 import { ReactNode } from 'react';
+import { MenuItemTone } from '../components/menu-item.js';
+import 'lucide-react';
 
 /**
  * One row of a {@link TopBarActionMenu}. An `action` (default) runs `onSelect`, a
  * `link` navigates via react-router, and a `divider` draws a rule. Non-divider
  * rows close the menu automatically when chosen. `kind` may be omitted for
  * actions, keeping the common case terse.
+ *
+ * The rows are {@link MenuItem}s, so they take its options: `tone: "danger"` for the
+ * log-out row, `checked` (+ `checkable`) for a choice, `current` for the link to the
+ * page already open, `disabled`.
  */
 type TopBarMenuEntry = {
     kind?: "action";
@@ -14,6 +20,12 @@ type TopBarMenuEntry = {
     label: ReactNode;
     trailing?: ReactNode;
     onSelect: () => void;
+    tone?: MenuItemTone;
+    /** Makes the row a choice (`menuitemradio`, or `menuitemcheckbox` with
+     *  `checkable: "checkbox"`) and says whether it is chosen. */
+    checked?: boolean;
+    checkable?: "radio" | "checkbox";
+    disabled?: boolean;
 } | {
     kind: "link";
     key: string;
@@ -21,10 +33,28 @@ type TopBarMenuEntry = {
     label: ReactNode;
     trailing?: ReactNode;
     to: string;
+    tone?: MenuItemTone;
+    /** The link to the page already open: `aria-current="page"` and a check mark. */
+    current?: boolean;
+    disabled?: boolean;
 } | {
     kind: "divider";
     key: string;
 };
+/**
+ * The non-interactive identity block at the top of an account menu — kastlan's name +
+ * role, keksdose's display name + email + role chip. It is text, not a `menuitem`: the
+ * arrow keys pass over it.
+ */
+interface TopBarMenuHeader {
+    /** The first line — the user's name. */
+    title: ReactNode;
+    /** The muted second line — an email, a role. */
+    subtitle?: ReactNode;
+    /** Anything below — a role chip. A link or button here stays out of the arrow keys
+     *  and in the Tab order, like the footer's. */
+    extra?: ReactNode;
+}
 /**
  * A top-bar icon button that opens a {@link HoverMenu} of actions and/or links,
  * with an optional uppercase heading and divider rules. Generic glue over the
@@ -32,13 +62,53 @@ type TopBarMenuEntry = {
  * so those call sites describe their rows as data instead of rebuilding the
  * trigger + list markup. For a checkmarked value-switcher use
  * {@link OptionSwitcherMenu} instead.
+ *
+ * It is also the ACCOUNT menu kastlan and keksdose each hand-build on `HoverMenu`: a
+ * custom `trigger` (the avatar), a `header` (name + role / email), the rows, and a
+ * free-content `footer` (the legal links).
  */
-declare function TopBarActionMenu({ icon, ariaLabel, heading, entries, panelClassName, }: {
-    icon: ReactNode;
+declare function TopBarActionMenu({ icon, trigger, triggerClassName, ariaLabel, heading, header, entries, children, footer, footerLabel, align, panelClassName, }: {
+    /** The trigger's face for the usual icon button. Ignored when `trigger` is given. */
+    icon?: ReactNode;
+    /**
+     * A face of your own for the trigger — the account menu's `UserAvatar`. It is drawn
+     * INSIDE the kit's button, which keeps the wiring: `aria-haspopup`, `aria-expanded`,
+     * the toggle, the keyboard. `open` is there for a chevron that turns.
+     *
+     * The button is named by `ariaLabel` followed by any readable text in the face — a
+     * `UserAvatar` `badge` label reaches a screen reader that way ("Account menu 3
+     * unread"), where an `aria-label` on the button would have hidden it. A
+     * `UserAvatar`'s initials are `aria-hidden`, so the person's name is only in the
+     * name if `ariaLabel` carries it ("Marcel Eifert, account menu").
+     */
+    trigger?: (state: {
+        open: boolean;
+    }) => ReactNode;
+    /** Extra classes for the trigger button — `rounded-full` round an avatar. */
+    triggerClassName?: string;
+    /** Names the trigger and the menu. */
     ariaLabel: string;
     heading?: string;
+    /** A non-interactive identity block above the rows. */
+    header?: TopBarMenuHeader;
     entries: TopBarMenuEntry[];
+    /**
+     * Rows the entry data cannot describe (a `Disclosure` sub-list, an app's own
+     * section), after `entries`. Render `<li>`s holding `MenuItem`s or plain controls;
+     * `close` shuts the menu.
+     */
+    children?: (close: () => void) => ReactNode;
+    /**
+     * Free content below the rows, behind a rule — the legal links. Its links and
+     * buttons are NOT menu rows: the arrow keys skip them and Tab reaches them. Pass a
+     * function to get `close` for the links' `onClick`.
+     */
+    footer?: ReactNode | ((close: () => void) => ReactNode);
+    /** Wraps the footer in a `<nav>` with this name ("Legal"). Without it, a plain block. */
+    footerLabel?: string;
+    /** Which edge of the trigger the panel lines up with (see `HoverMenu`). Default `end`. */
+    align?: "start" | "end" | "left" | "right";
     panelClassName?: string;
 }): react.JSX.Element;
 
-export { TopBarActionMenu, type TopBarMenuEntry };
+export { TopBarActionMenu, type TopBarMenuEntry, type TopBarMenuHeader };

package/dist/shell/topbar-action-menu.js

@@ -1,46 +1,119 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { useLayoutEffect, useRef } from "react";
 import { Link } from "react-router";
 import { cn } from "../lib/cn.js";
 import { HoverMenu } from "../components/hover-menu.js";
-import { TOPBAR_MENU_ITEM_CLASS, TOPBAR_TRIGGER_CLASS } from "./topbar-controls.js";
+import { MenuItem } from "../components/menu-item.js";
+import { TOPBAR_TRIGGER_CLASS } from "./topbar-controls.js";
+const SECTION_CONTROLS = "a[href]:not([role]),button:not([role])";
+const TABBABLE = "a[href],button:not([disabled]),input:not([disabled]),select:not([disabled]),textarea:not([disabled]),[tabindex]";
+function MenuSection({ className, children }) {
+  const ref = useRef(null);
+  useLayoutEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    for (const c of el.querySelectorAll(SECTION_CONTROLS)) {
+      c.setAttribute("role", c.tagName === "A" ? "link" : "button");
+    }
+    for (const l of el.querySelectorAll("ul:not([role]),ol:not([role])")) l.setAttribute("role", "list");
+    for (const l of el.querySelectorAll("li:not([role])")) l.setAttribute("role", "listitem");
+  });
+  return /* @__PURE__ */ jsx("li", { ref, role: "none", className, children });
+}
+function keepTabInsidePanel(e) {
+  if (e.key !== "Tab") return;
+  const from = e.target;
+  const stops = Array.from(e.currentTarget.querySelectorAll(TABBABLE)).filter(
+    (el) => el.getAttribute("tabindex") !== "-1"
+  );
+  const way = e.shiftKey ? Node.DOCUMENT_POSITION_PRECEDING : Node.DOCUMENT_POSITION_FOLLOWING;
+  if (stops.some((el) => el !== from && from.compareDocumentPosition(el) & way)) e.stopPropagation();
+}
 function TopBarActionMenu({
   icon,
+  trigger,
+  triggerClassName,
   ariaLabel,
   heading,
+  header,
   entries,
+  children,
+  footer,
+  footerLabel,
+  align,
   panelClassName
 }) {
   return /* @__PURE__ */ jsx(
     HoverMenu,
     {
       ariaLabel,
-      trigger: ({ toggle }) => /* @__PURE__ */ jsx("button", { type: "button", onClick: toggle, "aria-label": ariaLabel, className: TOPBAR_TRIGGER_CLASS, children: icon }),
-      children: (close) => /* @__PURE__ */ jsxs("ul", { className: cn("py-1", panelClassName), children: [
-        heading && /* @__PURE__ */ jsx("li", { className: "px-3 py-1 text-[10px] font-semibold uppercase tracking-wide text-[var(--text-placeholder)]", children: heading }),
-        entries.map((entry) => {
-          if (entry.kind === "divider") {
-            return /* @__PURE__ */ jsx("li", { className: "my-1 border-t border-[var(--border)]" }, entry.key);
-          }
-          const content = /* @__PURE__ */ jsxs("span", { className: "flex w-full items-center gap-2", children: [
-            entry.icon,
-            entry.label,
-            entry.trailing && /* @__PURE__ */ jsx("span", { className: "ms-auto ps-2", children: entry.trailing })
-          ] });
-          return /* @__PURE__ */ jsx("li", { children: entry.kind === "link" ? /* @__PURE__ */ jsx(Link, { to: entry.to, onClick: close, className: TOPBAR_MENU_ITEM_CLASS, children: content }) : /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              onClick: () => {
-                entry.onSelect();
-                close();
-              },
-              className: TOPBAR_MENU_ITEM_CLASS,
-              children: content
-            }
-          ) }, entry.key);
-        })
-      ] })
+      align,
+      trigger: ({ open, toggle }) => trigger ? /* @__PURE__ */ jsxs("button", { type: "button", onClick: toggle, className: cn(TOPBAR_TRIGGER_CLASS, "relative", triggerClassName), children: [
+        /* @__PURE__ */ jsx("span", { className: "sr-only", children: ariaLabel }),
+        " ",
+        trigger({ open })
+      ] }) : /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: toggle,
+          "aria-label": ariaLabel,
+          className: cn(TOPBAR_TRIGGER_CLASS, triggerClassName),
+          children: icon
+        }
+      ),
+      children: (close) => {
+        const footerBody = typeof footer === "function" ? footer(close) : footer;
+        const footerClass = "flex flex-wrap gap-x-3 gap-y-1 text-xs text-[var(--text-muted)] [&_a:hover]:text-[var(--text-primary)] [&_a]:rounded-sm [&_a:focus-visible]:outline-none [&_a:focus-visible]:ring-2 [&_a:focus-visible]:ring-[var(--brand)]";
+        return (
+          // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- a Tab bubbling up from a row or footer link, see keepTabInsidePanel
+          /* @__PURE__ */ jsxs("ul", { className: cn("py-1", panelClassName), onKeyDown: keepTabInsidePanel, children: [
+            header && /* @__PURE__ */ jsxs(MenuSection, { className: "mb-1 border-b border-[var(--border)] px-3 py-2", children: [
+              /* @__PURE__ */ jsx("div", { className: "truncate text-sm font-medium text-[var(--text-primary)]", children: header.title }),
+              header.subtitle != null && /* @__PURE__ */ jsx("div", { className: "truncate text-xs text-[var(--text-muted)]", children: header.subtitle }),
+              header.extra != null && /* @__PURE__ */ jsx("div", { className: "mt-1", children: header.extra })
+            ] }),
+            heading && /* @__PURE__ */ jsx("li", { className: "px-3 py-1 text-[10px] font-semibold uppercase tracking-wide text-[var(--text-placeholder)]", children: heading }),
+            entries.map((entry) => {
+              if (entry.kind === "divider") {
+                return /* @__PURE__ */ jsx("li", { className: "my-1 border-t border-[var(--border)]" }, entry.key);
+              }
+              return /* @__PURE__ */ jsx("li", { children: entry.kind === "link" ? /* @__PURE__ */ jsx(
+                MenuItem,
+                {
+                  href: entry.to,
+                  renderLink: ({ href, ...p }) => /* @__PURE__ */ jsx(Link, { to: href, ...p }),
+                  onClick: close,
+                  leading: entry.icon,
+                  trailing: entry.trailing,
+                  tone: entry.tone,
+                  current: entry.current,
+                  disabled: entry.disabled,
+                  children: entry.label
+                }
+              ) : /* @__PURE__ */ jsx(
+                MenuItem,
+                {
+                  onClick: () => {
+                    entry.onSelect();
+                    close();
+                  },
+                  leading: entry.icon,
+                  trailing: entry.trailing,
+                  tone: entry.tone,
+                  checked: entry.checked,
+                  checkable: entry.checkable,
+                  disabled: entry.disabled,
+                  children: entry.label
+                }
+              ) }, entry.key);
+            }),
+            children?.(close),
+            footerBody != null && footerBody !== false && /* @__PURE__ */ jsx(MenuSection, { className: "mt-1 border-t border-[var(--border)] px-3 py-2", children: footerLabel ? /* @__PURE__ */ jsx("nav", { "aria-label": footerLabel, className: footerClass, children: footerBody }) : /* @__PURE__ */ jsx("div", { className: footerClass, children: footerBody }) })
+          ] })
+        );
+      }
     }
   );
 }

package/dist/shell/topbar-action-menu.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/shell/topbar-action-menu.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Link } from \"react-router\";\nimport { cn } from \"../lib/cn\";\nimport { HoverMenu } from \"../components/hover-menu\";\nimport { TOPBAR_MENU_ITEM_CLASS, TOPBAR_TRIGGER_CLASS } from \"./topbar-controls\";\n\n/**\n * One row of a {@link TopBarActionMenu}. An `action` (default) runs `onSelect`, a\n * `link` navigates via react-router, and a `divider` draws a rule. Non-divider\n * rows close the menu automatically when chosen. `kind` may be omitted for\n * actions, keeping the common case terse.\n */\nexport type TopBarMenuEntry =\n  | { kind?: \"action\"; key: string; icon?: ReactNode; label: ReactNode; trailing?: ReactNode; onSelect: () => void }\n  | { kind: \"link\"; key: string; icon?: ReactNode; label: ReactNode; trailing?: ReactNode; to: string }\n  | { kind: \"divider\"; key: string };\n\n/**\n * A top-bar icon button that opens a {@link HoverMenu} of actions and/or links,\n * with an optional uppercase heading and divider rules. Generic glue over the\n * shared top-bar chrome — e.g. the feedback launcher or the guided-tours menu —\n * so those call sites describe their rows as data instead of rebuilding the\n * trigger + list markup. For a checkmarked value-switcher use\n * {@link OptionSwitcherMenu} instead.\n */\nexport function TopBarActionMenu({\n  icon,\n  ariaLabel,\n  heading,\n  entries,\n  panelClassName,\n}: {\n  icon: ReactNode;\n  ariaLabel: string;\n  heading?: string;\n  entries: TopBarMenuEntry[];\n  panelClassName?: string;\n}) {\n  return (\n    <HoverMenu\n      ariaLabel={ariaLabel}\n      trigger={({ toggle }) => (\n        <button type=\"button\" onClick={toggle} aria-label={ariaLabel} className={TOPBAR_TRIGGER_CLASS}>\n          {icon}\n        </button>\n      )}\n    >\n      {(close) => (\n        <ul className={cn(\"py-1\", panelClassName)}>\n          {heading && (\n            <li className=\"px-3 py-1 text-[10px] font-semibold uppercase tracking-wide text-[var(--text-placeholder)]\">\n              {heading}\n            </li>\n          )}\n          {entries.map((entry) => {\n            if (entry.kind === \"divider\") {\n              return <li key={entry.key} className=\"my-1 border-t border-[var(--border)]\" />;\n            }\n            const content = (\n              <span className=\"flex w-full items-center gap-2\">\n                {entry.icon}\n                {entry.label}\n                {entry.trailing && <span className=\"ms-auto ps-2\">{entry.trailing}</span>}\n              </span>\n            );\n            return (\n              <li key={entry.key}>\n                {entry.kind === \"link\" ? (\n                  <Link to={entry.to} onClick={close} className={TOPBAR_MENU_ITEM_CLASS}>\n                    {content}\n                  </Link>\n                ) : (\n                  <button\n                    type=\"button\"\n                    onClick={() => {\n                      entry.onSelect();\n                      close();\n                    }}\n                    className={TOPBAR_MENU_ITEM_CLASS}\n                  >\n                    {content}\n                  </button>\n                )}\n              </li>\n            );\n          })}\n        </ul>\n      )}\n    </HoverMenu>\n  );\n}\n"],"mappings":";AA0CQ,cAiBM,YAjBN;AAzCR,SAAS,YAAY;AACrB,SAAS,UAAU;AACnB,SAAS,iBAAiB;AAC1B,SAAS,wBAAwB,4BAA4B;AAqBtD,SAAS,iBAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMG;AACD,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,SAAS,CAAC,EAAE,OAAO,MACjB,oBAAC,YAAO,MAAK,UAAS,SAAS,QAAQ,cAAY,WAAW,WAAW,sBACtE,gBACH;AAAA,MAGD,WAAC,UACA,qBAAC,QAAG,WAAW,GAAG,QAAQ,cAAc,GACrC;AAAA,mBACC,oBAAC,QAAG,WAAU,8FACX,mBACH;AAAA,QAED,QAAQ,IAAI,CAAC,UAAU;AACtB,cAAI,MAAM,SAAS,WAAW;AAC5B,mBAAO,oBAAC,QAAmB,WAAU,0CAArB,MAAM,GAAsD;AAAA,UAC9E;AACA,gBAAM,UACJ,qBAAC,UAAK,WAAU,kCACb;AAAA,kBAAM;AAAA,YACN,MAAM;AAAA,YACN,MAAM,YAAY,oBAAC,UAAK,WAAU,gBAAgB,gBAAM,UAAS;AAAA,aACpE;AAEF,iBACE,oBAAC,QACE,gBAAM,SAAS,SACd,oBAAC,QAAK,IAAI,MAAM,IAAI,SAAS,OAAO,WAAW,wBAC5C,mBACH,IAEA;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,SAAS,MAAM;AACb,sBAAM,SAAS;AACf,sBAAM;AAAA,cACR;AAAA,cACA,WAAW;AAAA,cAEV;AAAA;AAAA,UACH,KAfK,MAAM,GAiBf;AAAA,QAEJ,CAAC;AAAA,SACH;AAAA;AAAA,EAEJ;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/shell/topbar-action-menu.tsx"],"sourcesContent":["import { useLayoutEffect, useRef } from \"react\";\nimport type { KeyboardEvent as ReactKeyboardEvent, ReactNode } from \"react\";\nimport { Link } from \"react-router\";\nimport { cn } from \"../lib/cn\";\nimport { HoverMenu } from \"../components/hover-menu\";\nimport { MenuItem } from \"../components/menu-item\";\nimport type { MenuItemTone } from \"../components/menu-item\";\nimport { TOPBAR_TRIGGER_CLASS } from \"./topbar-controls\";\n\n/**\n * One row of a {@link TopBarActionMenu}. An `action` (default) runs `onSelect`, a\n * `link` navigates via react-router, and a `divider` draws a rule. Non-divider\n * rows close the menu automatically when chosen. `kind` may be omitted for\n * actions, keeping the common case terse.\n *\n * The rows are {@link MenuItem}s, so they take its options: `tone: \"danger\"` for the\n * log-out row, `checked` (+ `checkable`) for a choice, `current` for the link to the\n * page already open, `disabled`.\n */\nexport type TopBarMenuEntry =\n  | {\n      kind?: \"action\";\n      key: string;\n      icon?: ReactNode;\n      label: ReactNode;\n      trailing?: ReactNode;\n      onSelect: () => void;\n      tone?: MenuItemTone;\n      /** Makes the row a choice (`menuitemradio`, or `menuitemcheckbox` with\n       *  `checkable: \"checkbox\"`) and says whether it is chosen. */\n      checked?: boolean;\n      checkable?: \"radio\" | \"checkbox\";\n      disabled?: boolean;\n    }\n  | {\n      kind: \"link\";\n      key: string;\n      icon?: ReactNode;\n      label: ReactNode;\n      trailing?: ReactNode;\n      to: string;\n      tone?: MenuItemTone;\n      /** The link to the page already open: `aria-current=\"page\"` and a check mark. */\n      current?: boolean;\n      disabled?: boolean;\n    }\n  | { kind: \"divider\"; key: string };\n\n/**\n * The non-interactive identity block at the top of an account menu — kastlan's name +\n * role, keksdose's display name + email + role chip. It is text, not a `menuitem`: the\n * arrow keys pass over it.\n */\nexport interface TopBarMenuHeader {\n  /** The first line — the user's name. */\n  title: ReactNode;\n  /** The muted second line — an email, a role. */\n  subtitle?: ReactNode;\n  /** Anything below — a role chip. A link or button here stays out of the arrow keys\n   *  and in the Tab order, like the footer's. */\n  extra?: ReactNode;\n}\n\n/** What a control is, as far as `HoverMenu` is concerned, when it lives in the header\n *  or the footer: not a menu row. */\nconst SECTION_CONTROLS = \"a[href]:not([role]),button:not([role])\";\nconst TABBABLE = 'a[href],button:not([disabled]),input:not([disabled]),select:not([disabled]),textarea:not([disabled]),[tabindex]';\n\n/**\n * A header or footer inside the menu panel.\n *\n * `HoverMenu` promotes EVERY role-less button and link in its panel to a `menuitem` out\n * of the Tab order, and turns every list into `role=\"none\"` — right for the rows, wrong\n * for a footer of legal links, which would join the arrow-key cycle and drop out of Tab.\n * So before it looks (a child's layout effect runs before its parent's), the controls\n * in here get their own role spelled out, which `HoverMenu` leaves alone, and any list\n * keeps its list semantics.\n */\nfunction MenuSection({ className, children }: { className: string; children: ReactNode }) {\n  const ref = useRef<HTMLLIElement>(null);\n  useLayoutEffect(() => {\n    const el = ref.current;\n    if (!el) return;\n    for (const c of el.querySelectorAll<HTMLElement>(SECTION_CONTROLS)) {\n      c.setAttribute(\"role\", c.tagName === \"A\" ? \"link\" : \"button\");\n    }\n    for (const l of el.querySelectorAll<HTMLElement>(\"ul:not([role]),ol:not([role])\")) l.setAttribute(\"role\", \"list\");\n    for (const l of el.querySelectorAll<HTMLElement>(\"li:not([role])\")) l.setAttribute(\"role\", \"listitem\");\n  });\n  return (\n    <li ref={ref} role=\"none\" className={className}>\n      {children}\n    </li>\n  );\n}\n\n/**\n * `HoverMenu` closes on any Tab inside the panel — right when Tab leaves it, wrong when\n * Tab is on its way from a row to a footer link, or from one footer link to the next:\n * the panel would unmount under the focus. So a Tab whose next stop is still inside the\n * panel stops here and the browser moves focus; one that leaves reaches `HoverMenu`,\n * which closes.\n */\nfunction keepTabInsidePanel(e: ReactKeyboardEvent<HTMLUListElement>) {\n  if (e.key !== \"Tab\") return;\n  const from = e.target as HTMLElement;\n  const stops = Array.from(e.currentTarget.querySelectorAll<HTMLElement>(TABBABLE)).filter(\n    (el) => el.getAttribute(\"tabindex\") !== \"-1\",\n  );\n  const way = e.shiftKey ? Node.DOCUMENT_POSITION_PRECEDING : Node.DOCUMENT_POSITION_FOLLOWING;\n  if (stops.some((el) => el !== from && from.compareDocumentPosition(el) & way)) e.stopPropagation();\n}\n\n/**\n * A top-bar icon button that opens a {@link HoverMenu} of actions and/or links,\n * with an optional uppercase heading and divider rules. Generic glue over the\n * shared top-bar chrome — e.g. the feedback launcher or the guided-tours menu —\n * so those call sites describe their rows as data instead of rebuilding the\n * trigger + list markup. For a checkmarked value-switcher use\n * {@link OptionSwitcherMenu} instead.\n *\n * It is also the ACCOUNT menu kastlan and keksdose each hand-build on `HoverMenu`: a\n * custom `trigger` (the avatar), a `header` (name + role / email), the rows, and a\n * free-content `footer` (the legal links).\n */\nexport function TopBarActionMenu({\n  icon,\n  trigger,\n  triggerClassName,\n  ariaLabel,\n  heading,\n  header,\n  entries,\n  children,\n  footer,\n  footerLabel,\n  align,\n  panelClassName,\n}: {\n  /** The trigger's face for the usual icon button. Ignored when `trigger` is given. */\n  icon?: ReactNode;\n  /**\n   * A face of your own for the trigger — the account menu's `UserAvatar`. It is drawn\n   * INSIDE the kit's button, which keeps the wiring: `aria-haspopup`, `aria-expanded`,\n   * the toggle, the keyboard. `open` is there for a chevron that turns.\n   *\n   * The button is named by `ariaLabel` followed by any readable text in the face — a\n   * `UserAvatar` `badge` label reaches a screen reader that way (\"Account menu 3\n   * unread\"), where an `aria-label` on the button would have hidden it. A\n   * `UserAvatar`'s initials are `aria-hidden`, so the person's name is only in the\n   * name if `ariaLabel` carries it (\"Marcel Eifert, account menu\").\n   */\n  trigger?: (state: { open: boolean }) => ReactNode;\n  /** Extra classes for the trigger button — `rounded-full` round an avatar. */\n  triggerClassName?: string;\n  /** Names the trigger and the menu. */\n  ariaLabel: string;\n  heading?: string;\n  /** A non-interactive identity block above the rows. */\n  header?: TopBarMenuHeader;\n  entries: TopBarMenuEntry[];\n  /**\n   * Rows the entry data cannot describe (a `Disclosure` sub-list, an app's own\n   * section), after `entries`. Render `<li>`s holding `MenuItem`s or plain controls;\n   * `close` shuts the menu.\n   */\n  children?: (close: () => void) => ReactNode;\n  /**\n   * Free content below the rows, behind a rule — the legal links. Its links and\n   * buttons are NOT menu rows: the arrow keys skip them and Tab reaches them. Pass a\n   * function to get `close` for the links' `onClick`.\n   */\n  footer?: ReactNode | ((close: () => void) => ReactNode);\n  /** Wraps the footer in a `<nav>` with this name (\"Legal\"). Without it, a plain block. */\n  footerLabel?: string;\n  /** Which edge of the trigger the panel lines up with (see `HoverMenu`). Default `end`. */\n  align?: \"start\" | \"end\" | \"left\" | \"right\";\n  panelClassName?: string;\n}) {\n  return (\n    <HoverMenu\n      ariaLabel={ariaLabel}\n      align={align}\n      trigger={({ open, toggle }) =>\n        trigger ? (\n          <button type=\"button\" onClick={toggle} className={cn(TOPBAR_TRIGGER_CLASS, \"relative\", triggerClassName)}>\n            <span className=\"sr-only\">{ariaLabel}</span>\n            {/* The space keeps the name from running into the face's text (\"Account\n                menu3 unread\"); as a flex item it takes no room. */}\n            {\" \"}\n            {trigger({ open })}\n          </button>\n        ) : (\n          <button\n            type=\"button\"\n            onClick={toggle}\n            aria-label={ariaLabel}\n            className={cn(TOPBAR_TRIGGER_CLASS, triggerClassName)}\n          >\n            {icon}\n          </button>\n        )\n      }\n    >\n      {(close) => {\n        const footerBody = typeof footer === \"function\" ? footer(close) : footer;\n        const footerClass =\n          \"flex flex-wrap gap-x-3 gap-y-1 text-xs text-[var(--text-muted)] [&_a:hover]:text-[var(--text-primary)] [&_a]:rounded-sm [&_a:focus-visible]:outline-none [&_a:focus-visible]:ring-2 [&_a:focus-visible]:ring-[var(--brand)]\";\n        return (\n          // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- a Tab bubbling up from a row or footer link, see keepTabInsidePanel\n          <ul className={cn(\"py-1\", panelClassName)} onKeyDown={keepTabInsidePanel}>\n            {header && (\n              <MenuSection className=\"mb-1 border-b border-[var(--border)] px-3 py-2\">\n                <div className=\"truncate text-sm font-medium text-[var(--text-primary)]\">{header.title}</div>\n                {header.subtitle != null && (\n                  <div className=\"truncate text-xs text-[var(--text-muted)]\">{header.subtitle}</div>\n                )}\n                {header.extra != null && <div className=\"mt-1\">{header.extra}</div>}\n              </MenuSection>\n            )}\n            {heading && (\n              <li className=\"px-3 py-1 text-[10px] font-semibold uppercase tracking-wide text-[var(--text-placeholder)]\">\n                {heading}\n              </li>\n            )}\n            {entries.map((entry) => {\n              if (entry.kind === \"divider\") {\n                return <li key={entry.key} className=\"my-1 border-t border-[var(--border)]\" />;\n              }\n              return (\n                <li key={entry.key}>\n                  {entry.kind === \"link\" ? (\n                    <MenuItem\n                      href={entry.to}\n                      renderLink={({ href, ...p }) => <Link to={href} {...p} />}\n                      onClick={close}\n                      leading={entry.icon}\n                      trailing={entry.trailing}\n                      tone={entry.tone}\n                      current={entry.current}\n                      disabled={entry.disabled}\n                    >\n                      {entry.label}\n                    </MenuItem>\n                  ) : (\n                    <MenuItem\n                      onClick={() => {\n                        entry.onSelect();\n                        close();\n                      }}\n                      leading={entry.icon}\n                      trailing={entry.trailing}\n                      tone={entry.tone}\n                      checked={entry.checked}\n                      checkable={entry.checkable}\n                      disabled={entry.disabled}\n                    >\n                      {entry.label}\n                    </MenuItem>\n                  )}\n                </li>\n              );\n            })}\n            {children?.(close)}\n            {footerBody != null && footerBody !== false && (\n              <MenuSection className=\"mt-1 border-t border-[var(--border)] px-3 py-2\">\n                {footerLabel ? (\n                  <nav aria-label={footerLabel} className={footerClass}>\n                    {footerBody}\n                  </nav>\n                ) : (\n                  <div className={footerClass}>{footerBody}</div>\n                )}\n              </MenuSection>\n            )}\n          </ul>\n        );\n      }}\n    </HoverMenu>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/shell.d.ts

@@ -3,7 +3,7 @@ export { TopBar, TopBarProps } from './shell/top-bar.js';
 export { AppShell, AppShellNavItem, AppShellProps, AppShellSubItem } from './shell/app-shell.js';
 export { OptionSwitcherMenu, OptionSwitcherOption } from './shell/option-switcher-menu.js';
 export { RoleSwitcher, RoleSwitcherProps } from './shell/role-switcher.js';
-export { TopBarActionMenu, TopBarMenuEntry } from './shell/topbar-action-menu.js';
+export { TopBarActionMenu, TopBarMenuEntry, TopBarMenuHeader } from './shell/topbar-action-menu.js';
 import 'react';
 import './theme/palette-presets.js';
 import './theme/chart-palette.js';
@@ -11,3 +11,4 @@ import './theme/theme-store.js';
 import 'zustand/middleware';
 import 'zustand';
 import 'lucide-react';
+import './components/menu-item.js';

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

@@ -4,6 +4,7 @@ import { ButtonVariant } from '../components/ui.js';
 import { UseWizardReturn, WizardLabels } from './types.js';
 import '../components/tooltip.js';
 import '../hooks/use-anchored-rect.js';
+import '../lib/clipping.js';
 
 /**
  * The chrome around a wizard: the step indicator, the step content, and the

package/dist/wizard/wizard-context.d.ts

@@ -15,5 +15,11 @@ interface WizardContextValue {
 }
 declare const WizardContextProvider: react.Provider<WizardContextValue | null>;
 declare function useWizardContext(): WizardContextValue;
+/**
+ * The wizard context, or `null` outside a `<StepperNav>`. For a hook that registers
+ * with the wizard when there is one and works without it — `useRhfWizardStep` in
+ * `@eifi1/ui-kit/rhf`, whose returned `validate` a custom nav can call itself.
+ */
+declare function useOptionalWizardContext(): WizardContextValue | null;
 
-export { WizardContextProvider, type WizardContextValue, useWizardContext };
+export { WizardContextProvider, type WizardContextValue, useOptionalWizardContext, useWizardContext };

package/dist/wizard/wizard-context.js

@@ -9,8 +9,12 @@ function useWizardContext() {
   }
   return ctx;
 }
+function useOptionalWizardContext() {
+  return useContext(WizardContext);
+}
 export {
   WizardContextProvider,
+  useOptionalWizardContext,
   useWizardContext
 };
 //# sourceMappingURL=wizard-context.js.map

package/dist/wizard/wizard-context.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/wizard/wizard-context.tsx"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { ValidateResult } from \"./types\";\n\nexport interface WizardContextValue {\n  /**\n   * Register a validator for the currently-mounted step. Returns an unregister\n   * fn (call it in a useEffect cleanup). `goNext` runs every registered\n   * validator for the active step (plus the step config's own `validate`),\n   * AND-combining the results — this replaces the per-page `useRef` +\n   * `validate: () => ref.current?.()` bridge each RHF step used to wire.\n   */\n  registerStepValidate: (\n    fn: () => ValidateResult | Promise<ValidateResult>,\n  ) => () => void;\n  /** Lets the mounted step disable Next/Skip (e.g. invalid tenant shares). */\n  setNextBlocked: (blocked: boolean) => void;\n}\n\nconst WizardContext = createContext<WizardContextValue | null>(null);\n\nexport const WizardContextProvider = WizardContext.Provider;\n\nexport function useWizardContext(): WizardContextValue {\n  const ctx = useContext(WizardContext);\n  if (!ctx) {\n    throw new Error(\"useWizardContext must be used within a <StepperNav>\");\n  }\n  return ctx;\n}\n"],"mappings":";AAAA,SAAS,eAAe,kBAAkB;AAkB1C,MAAM,gBAAgB,cAAyC,IAAI;AAE5D,MAAM,wBAAwB,cAAc;AAE5C,SAAS,mBAAuC;AACrD,QAAM,MAAM,WAAW,aAAa;AACpC,MAAI,CAAC,KAAK;AACR,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AACA,SAAO;AACT;","names":[]}
+{"version":3,"sources":["../../src/wizard/wizard-context.tsx"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { ValidateResult } from \"./types\";\n\nexport interface WizardContextValue {\n  /**\n   * Register a validator for the currently-mounted step. Returns an unregister\n   * fn (call it in a useEffect cleanup). `goNext` runs every registered\n   * validator for the active step (plus the step config's own `validate`),\n   * AND-combining the results — this replaces the per-page `useRef` +\n   * `validate: () => ref.current?.()` bridge each RHF step used to wire.\n   */\n  registerStepValidate: (\n    fn: () => ValidateResult | Promise<ValidateResult>,\n  ) => () => void;\n  /** Lets the mounted step disable Next/Skip (e.g. invalid tenant shares). */\n  setNextBlocked: (blocked: boolean) => void;\n}\n\nconst WizardContext = createContext<WizardContextValue | null>(null);\n\nexport const WizardContextProvider = WizardContext.Provider;\n\nexport function useWizardContext(): WizardContextValue {\n  const ctx = useContext(WizardContext);\n  if (!ctx) {\n    throw new Error(\"useWizardContext must be used within a <StepperNav>\");\n  }\n  return ctx;\n}\n\n/**\n * The wizard context, or `null` outside a `<StepperNav>`. For a hook that registers\n * with the wizard when there is one and works without it — `useRhfWizardStep` in\n * `@eifi1/ui-kit/rhf`, whose returned `validate` a custom nav can call itself.\n */\nexport function useOptionalWizardContext(): WizardContextValue | null {\n  return useContext(WizardContext);\n}\n"],"mappings":";AAAA,SAAS,eAAe,kBAAkB;AAkB1C,MAAM,gBAAgB,cAAyC,IAAI;AAE5D,MAAM,wBAAwB,cAAc;AAE5C,SAAS,mBAAuC;AACrD,QAAM,MAAM,WAAW,aAAa;AACpC,MAAI,CAAC,KAAK;AACR,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AACA,SAAO;AACT;AAOO,SAAS,2BAAsD;AACpE,SAAO,WAAW,aAAa;AACjC;","names":[]}

package/dist/wizard.d.ts

@@ -1,6 +1,6 @@
 export { DEFAULT_WIZARD_LABELS, FieldErrors, StepStatus, SummaryItem, SummarySection, UseWizardOptions, UseWizardReturn, ValidateResult, WizardLabels, WizardStepConfig, WizardUrlSync, resolveWizardLabels } from './wizard/types.js';
 export { useWizard } from './wizard/use-wizard.js';
-export { WizardContextProvider, WizardContextValue, useWizardContext } from './wizard/wizard-context.js';
+export { WizardContextProvider, WizardContextValue, useOptionalWizardContext, useWizardContext } from './wizard/wizard-context.js';
 export { RequiredFieldSpec, requiredFieldsValidator } from './wizard/validation.js';
 export { WizardStep } from './wizard/wizard-step.js';
 export { WizardSummary } from './wizard/wizard-summary.js';
@@ -9,3 +9,4 @@ import 'react';
 import './components/ui.js';
 import './components/tooltip.js';
 import './hooks/use-anchored-rect.js';
+import './lib/clipping.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@eifi1/ui-kit",
-  "version": "0.10.0",
+  "version": "0.11.0",
   "type": "module",
   "description": "App-agnostic shared design system: domain-free React components, theme and tokens.",
   "_sideEffects": "The barrel (src/index.ts) re-exports EVERY component, including components/chart, which statically imports recharts. Without this field a bundler must assume each of those modules has side effects, so it cannot drop the unused ones: importing a Button from '@eifi1/ui-kit' dragged all 433KB of recharts into the consumer's ENTRY chunk, and Keksdose was preloading it on every page load, login included. Nothing in src/ imports for side effects (no bare imports, no CSS imports from JS, no module-level global writes) — the token stylesheet is its own './tokens.css' export — so this is safe. CSS is still listed so any future stylesheet survives. Re-checked when `flag-icons` left `dependencies` and tsup started emitting a `\"use client\"` banner: neither touches this. The flag stylesheet was never imported from JS in the first place (that was the finding), and a directive prologue is a string literal every bundler lifts out before it decides whether a module is inert.",