@tensor_1/react 2.26.3 → 2.27.0

package/dist/components/Pagination.js

@@ -1,5 +1,7 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Fragment as Fragment2 } from "react";
 import { cx } from "../cx.js";
+import { renderUixLink } from "../link.js";
 function getPageNumbers(page, total) {
   if (total <= 7) return Array.from({ length: total }, (_, i) => i + 1);
   const pages = [1];
@@ -14,45 +16,65 @@ function getPageNumbers(page, total) {
 const DEFAULT_PAGINATION_LABELS = {
   region: "Pagination",
   previous: "Previous page",
-  next: "Next page"
+  next: "Next page",
+  first: "First page"
 };
-function Pagination({ page, pageCount, onChange, labels: labelOverrides, className, ...props }) {
+function Pagination({
+  mode = "offset",
+  page = 1,
+  pageCount = 1,
+  onChange,
+  hrefFor,
+  renderLink,
+  hasPrevious = false,
+  hasNext = false,
+  onFirst,
+  onPrevious,
+  onNext,
+  firstHref,
+  previousHref,
+  nextHref,
+  summary,
+  labels: labelOverrides,
+  className,
+  ...props
+}) {
   const labels = { ...DEFAULT_PAGINATION_LABELS, ...labelOverrides };
-  const pages = getPageNumbers(page, pageCount);
-  return /* @__PURE__ */ jsxs("nav", { "aria-label": labels.region, className: cx("uix-pagination", className), ...props, children: [
-    /* @__PURE__ */ jsx(
-      "button",
-      {
+  const render = ({ key, content, label, current, disabled, href, onClick }) => {
+    if (href != null && !disabled) {
+      return /* @__PURE__ */ jsx(Fragment2, { children: renderUixLink(renderLink, {
+        href,
         className: "uix-pagination__btn",
-        onClick: () => onChange(page - 1),
-        disabled: page <= 1,
-        "aria-label": labels.previous,
-        children: "\u2039"
-      }
-    ),
-    pages.map(
-      (p, i) => p === "ellipsis" ? /* @__PURE__ */ jsx("span", { className: "uix-pagination__ellipsis", children: "\u2026" }, `e${i}`) : /* @__PURE__ */ jsx(
-        "button",
-        {
-          className: "uix-pagination__btn",
-          "aria-current": p === page ? "page" : void 0,
-          onClick: () => onChange(p),
-          children: p
-        },
-        p
-      )
-    ),
-    /* @__PURE__ */ jsx(
-      "button",
-      {
-        className: "uix-pagination__btn",
-        onClick: () => onChange(page + 1),
-        disabled: page >= pageCount,
-        "aria-label": labels.next,
-        children: "\u203A"
-      }
-    )
-  ] });
+        "aria-label": label,
+        "aria-current": current ? "page" : void 0,
+        children: content
+      }) }, key);
+    }
+    if (href != null || disabled && onClick == null) {
+      return /* @__PURE__ */ jsx("a", { className: "uix-pagination__btn", role: "link", "aria-disabled": "true", "aria-label": label, children: content }, key);
+    }
+    return /* @__PURE__ */ jsx("button", { type: "button", className: "uix-pagination__btn", "aria-label": label, "aria-current": current ? "page" : void 0, disabled, onClick, children: content }, key);
+  };
+  let controls;
+  if (mode === "cursor") {
+    const linked = firstHref != null || previousHref != null || nextHref != null;
+    controls = /* @__PURE__ */ jsxs(Fragment, { children: [
+      (onFirst || firstHref != null) && render({ key: "first", content: "\xAB", label: labels.first, disabled: !hasPrevious, href: linked ? firstHref ?? "" : void 0, onClick: onFirst }),
+      render({ key: "prev", content: "\u2039", label: labels.previous, disabled: !hasPrevious, href: linked ? previousHref ?? "" : void 0, onClick: onPrevious }),
+      summary != null && /* @__PURE__ */ jsx("span", { className: "uix-pagination__summary", children: summary }),
+      render({ key: "next", content: "\u203A", label: labels.next, disabled: !hasNext, href: linked ? nextHref ?? "" : void 0, onClick: onNext })
+    ] });
+  } else {
+    const go = (target) => hrefFor ? { href: hrefFor(target) } : { onClick: () => onChange?.(target) };
+    controls = /* @__PURE__ */ jsxs(Fragment, { children: [
+      render({ key: "prev", content: "\u2039", label: labels.previous, disabled: page <= 1, ...go(page - 1) }),
+      getPageNumbers(page, pageCount).map(
+        (p, i) => p === "ellipsis" ? /* @__PURE__ */ jsx("span", { className: "uix-pagination__ellipsis", children: "\u2026" }, `e${i}`) : render({ key: `p${p}`, content: p, current: p === page, ...go(p) })
+      ),
+      render({ key: "next", content: "\u203A", label: labels.next, disabled: page >= pageCount, ...go(page + 1) })
+    ] });
+  }
+  return /* @__PURE__ */ jsx("nav", { "aria-label": labels.region, className: cx("uix-pagination", className), ...props, children: controls });
 }
 export {
   DEFAULT_PAGINATION_LABELS,

package/dist/components/Peek.d.ts

@@ -17,6 +17,6 @@ interface PeekProps extends Omit<HTMLAttributes<HTMLDialogElement>, 'title'> {
     onNavNext?: () => void;
     hint?: string;
 }
-declare function Peek({ open, onClose, title, children, footer, onNavPrev, onNavNext, hint, previousLabel, nextLabel, closeLabel, className, onClick, ...rest }: PeekProps): react.JSX.Element;
+declare function Peek({ open, onClose, title, children, footer, onNavPrev, onNavNext, hint, previousLabel: previousLabelProp, nextLabel: nextLabelProp, closeLabel: closeLabelProp, className, onClick, ...rest }: PeekProps): react.JSX.Element;
 
 export { Peek, type PeekProps };

package/dist/components/Peek.js

@@ -2,12 +2,17 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useId } from "react";
 import { cx } from "../cx.js";
+import { useUixLabels } from "../labels-context.js";
 import { useDialog } from "../hooks/useDialog.js";
 import { backdropDismiss } from "../hooks/backdropDismiss.js";
 const CloseIcon = () => /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M4 4l8 8M12 4l-8 8" }) });
 const ChevronUp = () => /* @__PURE__ */ jsx("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M2 8l4-4 4 4" }) });
 const ChevronDown = () => /* @__PURE__ */ jsx("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M2 4l4 4 4-4" }) });
-function Peek({ open, onClose, title, children, footer, onNavPrev, onNavNext, hint, previousLabel = "Previous record", nextLabel = "Next record", closeLabel = "Close preview", className, onClick, ...rest }) {
+function Peek({ open, onClose, title, children, footer, onNavPrev, onNavNext, hint, previousLabel: previousLabelProp, nextLabel: nextLabelProp, closeLabel: closeLabelProp, className, onClick, ...rest }) {
+  const uixLabels = useUixLabels();
+  const previousLabel = previousLabelProp ?? uixLabels.peek?.previous ?? "Previous record";
+  const nextLabel = nextLabelProp ?? uixLabels.peek?.next ?? "Next record";
+  const closeLabel = closeLabelProp ?? uixLabels.peek?.close ?? "Close preview";
   const ref = useDialog(open, onClose);
   const hasNav = onNavPrev != null || onNavNext != null;
   const titleId = useId();

package/dist/components/SchedulingCalendar.d.ts

@@ -1,9 +1,17 @@
 import * as react from 'react';
 import { ReactNode } from 'react';
+import { CalendarWeekday } from '../calendar-model.js';
 
 type SchedulingCalendarView = 'month' | 'week' | 'agenda';
 type SchedulingEntryState = 'scheduled' | 'conflicted' | 'in-progress' | 'blackout-violation';
 type SchedulingOverlayKind = 'maintenance' | 'blackout';
+/**
+ * Which date text a `formatDate` call is for (TENSOR B1/C9, HAR-1347):
+ * `day` names one day (each day cell's accessible name, the week-range title);
+ * `weekday` is the short column header (the date is any day of that weekday);
+ * `month` is the month-view title (the date is the first of the month).
+ */
+type SchedulingDatePart = 'day' | 'weekday' | 'month';
 interface SchedulingCalendarEntry {
     id: string;
     title: string;
@@ -38,6 +46,12 @@ interface SchedulingCalendarLabels {
     grid: string;
     entry: string;
     legend: string;
+    /** The "+N more" toggle on a day with more entries than `maxEntriesPerDay`. `{count}` placeholder. */
+    moreEntries: string;
+    /** Accessible name of that toggle. `{count}` and `{date}` placeholders. */
+    moreEntriesLabel: string;
+    /** The toggle once the day is expanded in place. */
+    fewerEntries: string;
     states: Record<SchedulingEntryState, string>;
 }
 declare const DEFAULT_SCHEDULING_CALENDAR_LABELS: SchedulingCalendarLabels;
@@ -53,6 +67,37 @@ interface SchedulingCalendarProps {
     filter?: (entry: SchedulingCalendarEntry) => boolean;
     renderEntry?: (entry: SchedulingCalendarEntry) => ReactNode;
     locale?: string;
+    /** First column of the month and week grids: 0 = Sunday … 6 = Saturday. Defaults to 1 (Monday). */
+    weekStartsOn?: CalendarWeekday;
+    /**
+     * Formats every calendar date the component writes (`date` is `YYYY-MM-DD`). Use it to
+     * apply a product date format such as DD.MM.YYYY; defaults to `Intl` in `locale`.
+     */
+    formatDate?: (date: string, part: SchedulingDatePart) => string;
+    /**
+     * Formats an entry's start or end instant (ISO 8601) for the agenda and the entry names.
+     * The component does not shift it: render it in `timeZone` yourself. Defaults to `Intl`
+     * medium date + short time in `timeZone`.
+     */
+    formatInstant?: (instant: string) => string;
+    /**
+     * Show at most this many entries in a month or week day; the rest collapse behind a
+     * "+N more" toggle. Unset shows every entry.
+     */
+    maxEntriesPerDay?: number;
+    /**
+     * Called by the "+N more" toggle with the day and every entry on it. When set, the
+     * consumer shows them (a popover, a drawer, the day view) and the day stays collapsed;
+     * otherwise the day expands in place.
+     */
+    onShowMore?: (date: string, entries: SchedulingCalendarEntry[]) => void;
+    /**
+     * A small badge beside a day's date, e.g. a collision count. Keep it short (a number or a
+     * glyph): it shares a narrow column with the date and is clipped, not wrapped. It sits
+     * outside the date button, so give it its own accessible text (a visually hidden word next
+     * to the number). Return null for no badge.
+     */
+    renderDayBadge?: (date: string, entries: SchedulingCalendarEntry[]) => ReactNode;
     loading?: boolean;
     error?: string;
     onRetry?: () => void;
@@ -60,6 +105,6 @@ interface SchedulingCalendarProps {
     labels?: Partial<SchedulingCalendarLabels>;
 }
 /** Month/week/agenda calendar for UTC ranges rendered in an explicit IANA time zone. */
-declare function SchedulingCalendar({ entries, anchorDate, timeZone, view: controlledView, onViewChange, onAnchorDateChange, onSelectEntry, overlays, filter, renderEntry, locale, loading, error, onRetry, className, labels: labelOverrides, }: SchedulingCalendarProps): react.JSX.Element;
+declare function SchedulingCalendar({ entries, anchorDate, timeZone, view: controlledView, onViewChange, onAnchorDateChange, onSelectEntry, overlays, filter, renderEntry, locale, weekStartsOn, formatDate, formatInstant: formatInstantProp, maxEntriesPerDay, onShowMore, renderDayBadge, loading, error, onRetry, className, labels: labelOverrides, }: SchedulingCalendarProps): react.JSX.Element;
 
-export { DEFAULT_SCHEDULING_CALENDAR_LABELS, SchedulingCalendar, type SchedulingCalendarEntry, type SchedulingCalendarLabels, type SchedulingCalendarOverlay, type SchedulingCalendarProps, type SchedulingCalendarView, type SchedulingEntryState, type SchedulingOverlayKind };
+export { DEFAULT_SCHEDULING_CALENDAR_LABELS, SchedulingCalendar, type SchedulingCalendarEntry, type SchedulingCalendarLabels, type SchedulingCalendarOverlay, type SchedulingCalendarProps, type SchedulingCalendarView, type SchedulingDatePart, type SchedulingEntryState, type SchedulingOverlayKind };

package/dist/components/SchedulingCalendar.js

@@ -3,6 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useMemo, useRef, useState } from "react";
 import { addCalendarDays, addCalendarMonths, buildMonthGrid, startOfMonth, zonedDateSpan } from "../calendar-model.js";
 import { cx } from "../cx.js";
+import { useUixLabels } from "../labels-context.js";
 import { StatusPill } from "./StatusPill.js";
 import { fillLabel } from "../fill-label.js";
 const DEFAULT_SCHEDULING_CALENDAR_LABELS = {
@@ -20,10 +21,19 @@ const DEFAULT_SCHEDULING_CALENDAR_LABELS = {
   grid: "{view} schedule",
   entry: "{title}, {state}, {start} to {end}",
   legend: "Schedule state legend",
+  moreEntries: "+{count} more",
+  moreEntriesLabel: "{count} more entries on {date}",
+  fewerEntries: "Show fewer",
   states: { scheduled: "Scheduled", conflicted: "Conflicted", "in-progress": "In progress", "blackout-violation": "Blackout violation" }
 };
 const stateTone = (state) => state === "scheduled" ? "info" : state === "in-progress" ? "success" : "danger";
-const dateLabel = (date, locale) => new Intl.DateTimeFormat(locale, { dateStyle: "full", timeZone: "UTC" }).format(/* @__PURE__ */ new Date(`${date}T00:00:00Z`));
+const utcDate = (date) => /* @__PURE__ */ new Date(`${date}T00:00:00Z`);
+const INTL_PARTS = {
+  day: { dateStyle: "full", timeZone: "UTC" },
+  weekday: { weekday: "short", timeZone: "UTC" },
+  month: { month: "long", year: "numeric", timeZone: "UTC" }
+};
+const intlDate = (date, part, locale) => new Intl.DateTimeFormat(locale, INTL_PARTS[part]).format(utcDate(date));
 const EMPTY_OVERLAYS = [];
 function SchedulingCalendar({
   entries,
@@ -37,28 +47,38 @@ function SchedulingCalendar({
   filter,
   renderEntry,
   locale,
+  weekStartsOn = 1,
+  formatDate,
+  formatInstant: formatInstantProp,
+  maxEntriesPerDay,
+  onShowMore,
+  renderDayBadge,
   loading,
   error,
   onRetry,
   className,
   labels: labelOverrides
 }) {
+  const uixLabels = useUixLabels();
   const labels = {
     ...DEFAULT_SCHEDULING_CALENDAR_LABELS,
+    ...uixLabels.schedulingCalendar,
     ...labelOverrides,
-    states: { ...DEFAULT_SCHEDULING_CALENDAR_LABELS.states, ...labelOverrides?.states }
+    states: { ...DEFAULT_SCHEDULING_CALENDAR_LABELS.states, ...uixLabels.schedulingCalendar?.states, ...labelOverrides?.states }
   };
   const stateLabel = labels.states;
   const viewLabel = { month: labels.viewMonth, week: labels.viewWeek, agenda: labels.viewAgenda };
   const [internalView, setInternalView] = useState("month");
   const view = controlledView ?? internalView;
   const [activeDate, setActiveDate] = useState(anchorDate);
+  const [expandedDates, setExpandedDates] = useState(() => /* @__PURE__ */ new Set());
+  const dateText = (date, part) => formatDate?.(date, part) ?? intlDate(date, part, locale);
   const gridRef = useRef(null);
   const visibleEntries = useMemo(() => entries.filter((entry) => filter?.(entry) ?? true), [entries, filter]);
   const entrySpans = useMemo(() => new Map(visibleEntries.map((entry) => [entry.id, zonedDateSpan(entry.start, entry.end, timeZone)])), [visibleEntries, timeZone]);
   const overlaySpans = useMemo(() => new Map(overlays.map((overlay) => [overlay.id, { start: overlay.start.slice(0, 10), end: overlay.end.slice(0, 10) }])), [overlays]);
-  const monthDays = useMemo(() => buildMonthGrid(startOfMonth(anchorDate)), [anchorDate]);
-  const weekday = ((/* @__PURE__ */ new Date(`${anchorDate}T00:00:00Z`)).getUTCDay() + 6) % 7;
+  const monthDays = useMemo(() => buildMonthGrid(startOfMonth(anchorDate), weekStartsOn), [anchorDate, weekStartsOn]);
+  const weekday = (utcDate(anchorDate).getUTCDay() - weekStartsOn + 7) % 7;
   const weekStart = addCalendarDays(anchorDate, -weekday);
   const weekDays = useMemo(() => Array.from({ length: 7 }, (_, index) => addCalendarDays(weekStart, index)), [weekStart]);
   const days = useMemo(() => view === "month" ? monthDays.map((day) => day.date) : weekDays, [view, monthDays, weekDays]);
@@ -95,14 +115,26 @@ function SchedulingCalendar({
     const span = overlaySpans.get(overlay.id);
     return date >= span.start && date <= span.end;
   });
-  const formatInstant = (instant) => new Intl.DateTimeFormat(locale, { timeZone, dateStyle: "medium", timeStyle: "short" }).format(new Date(instant));
+  const formatInstant = (instant) => formatInstantProp?.(instant) ?? new Intl.DateTimeFormat(locale, { timeZone, dateStyle: "medium", timeStyle: "short" }).format(new Date(instant));
+  const toggleMore = (date, dayEntries) => {
+    if (onShowMore) {
+      onShowMore(date, dayEntries);
+      return;
+    }
+    setExpandedDates((current) => {
+      const next = new Set(current);
+      if (next.has(date)) next.delete(date);
+      else next.add(date);
+      return next;
+    });
+  };
   return /* @__PURE__ */ jsxs("section", { className: cx("uix-scheduling-calendar", className), "aria-label": fillLabel(labels.region, { timeZone }), children: [
     /* @__PURE__ */ jsxs("div", { className: "uix-scheduling-calendar__header", children: [
       /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsx("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: () => movePeriod(-1), disabled: !onAnchorDateChange, children: labels.previous }),
         /* @__PURE__ */ jsx("button", { type: "button", className: "uix-btn uix-btn--ghost uix-btn--sm", onClick: () => movePeriod(1), disabled: !onAnchorDateChange, children: labels.next })
       ] }),
-      /* @__PURE__ */ jsx("strong", { children: view === "month" ? new Intl.DateTimeFormat(locale, { month: "long", year: "numeric", timeZone: "UTC" }).format(/* @__PURE__ */ new Date(`${anchorDate}T00:00:00Z`)) : `${dateLabel(weekStart, locale)} \u2013 ${dateLabel(weekDays[weekDays.length - 1], locale)}` }),
+      /* @__PURE__ */ jsx("strong", { children: view === "month" ? dateText(startOfMonth(anchorDate), "month") : `${dateText(weekStart, "day")} \u2013 ${dateText(weekDays[weekDays.length - 1], "day")}` }),
       /* @__PURE__ */ jsx("div", { className: "uix-segmented", role: "group", "aria-label": labels.viewGroup, children: ["month", "week", "agenda"].map((option) => /* @__PURE__ */ jsx("button", { type: "button", className: "uix-segmented__option", "aria-pressed": view === option, "data-selected": view === option || void 0, onClick: () => setView(option), children: viewLabel[option] }, option)) })
     ] }),
     loading ? /* @__PURE__ */ jsx("div", { className: "uix-scheduling-calendar__state", role: "status", children: labels.loading }) : error ? /* @__PURE__ */ jsxs("div", { className: "uix-scheduling-calendar__state", role: "alert", children: [
@@ -122,22 +154,37 @@ function SchedulingCalendar({
         ] }),
         /* @__PURE__ */ jsx(StatusPill, { tone: stateTone(state), children: stateLabel[state] })
       ] }) }, entry.id);
-    }) }) }) : /* @__PURE__ */ jsx("div", { ref: gridRef, className: cx("uix-scheduling-calendar__grid", view === "week" && "uix-scheduling-calendar__grid--week"), role: "group", "aria-label": fillLabel(labels.grid, { view: viewLabel[view] }), children: days.map((date, index) => {
-      const dayEntries = entriesFor(date);
-      const dayOverlays = overlaysFor(date);
-      return /* @__PURE__ */ jsxs("div", { className: "uix-scheduling-calendar__day", "data-outside": view === "month" && !monthDays[index].inMonth || void 0, children: [
-        /* @__PURE__ */ jsx("button", { type: "button", className: "uix-scheduling-calendar__date", "data-calendar-date": date, tabIndex: activeDate === date ? 0 : -1, onFocus: () => setActiveDate(date), onKeyDown: (event) => onDayKeyDown(event, date), "aria-label": dateLabel(date, locale), children: Number(date.slice(-2)) }),
-        dayOverlays.map((overlay) => /* @__PURE__ */ jsx("span", { className: "uix-scheduling-calendar__overlay", "data-kind": overlay.kind, children: overlay.label }, overlay.id)),
-        /* @__PURE__ */ jsx("div", { className: "uix-scheduling-calendar__entries", children: dayEntries.map((entry) => {
-          const span = entrySpans.get(entry.id);
-          const state = entry.state ?? "scheduled";
-          return /* @__PURE__ */ jsxs("button", { type: "button", className: "uix-scheduling-calendar__entry", "data-state": state, "data-range-start": date === span.start || void 0, "data-range-end": date === span.end || void 0, onClick: () => onSelectEntry?.(entry), "aria-label": fillLabel(labels.entry, { title: entry.title, state: stateLabel[state], start: formatInstant(entry.start), end: formatInstant(entry.end) }), children: [
-            /* @__PURE__ */ jsx("span", { children: renderEntry?.(entry) ?? entry.title }),
-            /* @__PURE__ */ jsx("span", { className: "uix-visually-hidden", children: stateLabel[state] })
-          ] }, entry.id);
-        }) })
-      ] }, date);
-    }) }),
+    }) }) }) : /* @__PURE__ */ jsxs("div", { ref: gridRef, className: cx("uix-scheduling-calendar__grid", view === "week" && "uix-scheduling-calendar__grid--week"), role: "group", "aria-label": fillLabel(labels.grid, { view: viewLabel[view] }), children: [
+      days.slice(0, 7).map((date) => /* @__PURE__ */ jsx("div", { className: "uix-scheduling-calendar__weekday", "aria-hidden": "true", children: dateText(date, "weekday") }, `weekday-${date}`)),
+      days.map((date, index) => {
+        const dayEntries = entriesFor(date);
+        const dayOverlays = overlaysFor(date);
+        const overflowing = maxEntriesPerDay !== void 0 && dayEntries.length > maxEntriesPerDay;
+        const collapsed = overflowing && (onShowMore !== void 0 || !expandedDates.has(date));
+        const shownEntries = collapsed ? dayEntries.slice(0, Math.max(0, maxEntriesPerDay)) : dayEntries;
+        const hiddenCount = dayEntries.length - shownEntries.length;
+        const badge = renderDayBadge?.(date, dayEntries);
+        const dateButton = /* @__PURE__ */ jsx("button", { type: "button", className: "uix-scheduling-calendar__date", "data-calendar-date": date, tabIndex: activeDate === date ? 0 : -1, onFocus: () => setActiveDate(date), onKeyDown: (event) => onDayKeyDown(event, date), "aria-label": dateText(date, "day"), children: Number(date.slice(-2)) });
+        return /* @__PURE__ */ jsxs("div", { className: "uix-scheduling-calendar__day", "data-outside": view === "month" && !monthDays[index].inMonth || void 0, children: [
+          badge == null || badge === false ? dateButton : /* @__PURE__ */ jsxs("div", { className: "uix-scheduling-calendar__dayhead", children: [
+            /* @__PURE__ */ jsx("span", { className: "uix-scheduling-calendar__badge", children: badge }),
+            dateButton
+          ] }),
+          dayOverlays.map((overlay) => /* @__PURE__ */ jsx("span", { className: "uix-scheduling-calendar__overlay", "data-kind": overlay.kind, children: overlay.label }, overlay.id)),
+          /* @__PURE__ */ jsxs("div", { className: "uix-scheduling-calendar__entries", children: [
+            shownEntries.map((entry) => {
+              const span = entrySpans.get(entry.id);
+              const state = entry.state ?? "scheduled";
+              return /* @__PURE__ */ jsxs("button", { type: "button", className: "uix-scheduling-calendar__entry", "data-state": state, "data-range-start": date === span.start || void 0, "data-range-end": date === span.end || void 0, onClick: () => onSelectEntry?.(entry), "aria-label": fillLabel(labels.entry, { title: entry.title, state: stateLabel[state], start: formatInstant(entry.start), end: formatInstant(entry.end) }), children: [
+                /* @__PURE__ */ jsx("span", { children: renderEntry?.(entry) ?? entry.title }),
+                /* @__PURE__ */ jsx("span", { className: "uix-visually-hidden", children: stateLabel[state] })
+              ] }, entry.id);
+            }),
+            overflowing && /* @__PURE__ */ jsx("button", { type: "button", className: "uix-scheduling-calendar__more", "aria-expanded": onShowMore ? void 0 : !collapsed, "aria-label": collapsed ? fillLabel(labels.moreEntriesLabel, { count: hiddenCount, date: dateText(date, "day") }) : void 0, onClick: () => toggleMore(date, dayEntries), children: collapsed ? fillLabel(labels.moreEntries, { count: hiddenCount }) : labels.fewerEntries })
+          ] })
+        ] }, date);
+      })
+    ] }),
     /* @__PURE__ */ jsx("div", { className: "uix-scheduling-calendar__legend", "aria-label": labels.legend, children: ["scheduled", "conflicted", "in-progress", "blackout-violation"].map((state) => /* @__PURE__ */ jsx("span", { "data-state": state, children: stateLabel[state] }, state)) })
   ] });
 }

package/dist/components/SearchSuggest.d.ts

@@ -82,6 +82,6 @@ interface SearchSuggestProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onCha
  * (`aria-activedescendant`), Enter opens it (the first row when none is active), Escape closes the
  * list and a second Escape clears the text.
  */
-declare function SearchSuggest({ value, onValueChange, options, onSelect, label, placeholder, highlight, heading, headingAction, footer, loading, loadingLabel, empty, error, shortcutHint, clearLabel, status, size, open: openProp, strategy, onOpenChange, inputRef, autoFocus, name, className, onBlur, ...props }: SearchSuggestProps): react.JSX.Element;
+declare function SearchSuggest({ value, onValueChange, options, onSelect, label, placeholder, highlight, heading, headingAction, footer, loading, loadingLabel, empty, error, shortcutHint, clearLabel: clearLabelProp, status, size, open: openProp, strategy, onOpenChange, inputRef, autoFocus, name, className, onBlur, ...props }: SearchSuggestProps): react.JSX.Element;
 
 export { SearchSuggest, type SearchSuggestAction, type SearchSuggestOption, type SearchSuggestProps };

package/dist/components/SearchSuggest.js

@@ -2,6 +2,7 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useId, useImperativeHandle, useLayoutEffect, useRef, useState } from "react";
 import { cx } from "../cx.js";
+import { useUixLabels } from "../labels-context.js";
 import { useAnchoredPosition } from "../hooks/useAnchoredPosition.js";
 import { searchSegments } from "../search-suggest-model.js";
 import { Spinner } from "./Spinner.js";
@@ -33,7 +34,7 @@ function SearchSuggest({
   empty,
   error,
   shortcutHint,
-  clearLabel = "Clear search",
+  clearLabel: clearLabelProp,
   status,
   size = "md",
   open: openProp,
@@ -46,6 +47,8 @@ function SearchSuggest({
   onBlur,
   ...props
 }) {
+  const uixLabels = useUixLabels();
+  const clearLabel = clearLabelProp ?? uixLabels.searchSuggest?.clear ?? "Clear search";
   const id = useId();
   const listboxId = `${id}-listbox`;
   const headingId = `${id}-heading`;

package/dist/components/Sidebar.d.ts

@@ -11,7 +11,7 @@ interface SidebarProps extends HTMLAttributes<HTMLElement> {
     expandLabel?: string;
     collapseLabel?: string;
 }
-declare function Sidebar({ collapsed, nav, onToggle, brand, toggleIcon, children, expandLabel, collapseLabel, className, ...props }: SidebarProps): react.JSX.Element;
+declare function Sidebar({ collapsed, nav, onToggle, brand, toggleIcon, children, expandLabel: expandLabelProp, collapseLabel: collapseLabelProp, className, ...props }: SidebarProps): react.JSX.Element;
 interface SidebarSectionProps {
     label?: string;
     children?: ReactNode;
@@ -22,9 +22,14 @@ interface NavItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
     badge?: ReactNode;
     active?: boolean;
     as?: 'a' | 'button';
+    /**
+     * A second line under the label (a sub-label, a count, a long German term); it wraps,
+     * and the row grows to fit (HAR-1355; TENSOR B31). Hidden in the rail.
+     */
+    description?: ReactNode;
     children?: ReactNode;
 }
-declare function NavItem({ icon, badge, active, as: Tag, children, className, ...props }: NavItemProps): react.JSX.Element;
+declare function NavItem({ icon, badge, active, as: Tag, description, children, className, ...props }: NavItemProps): react.JSX.Element;
 interface NavGroupProps {
     icon?: ReactNode;
     label: ReactNode;

package/dist/components/Sidebar.js

@@ -2,8 +2,12 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useId, useRef, useState } from "react";
 import { cx } from "../cx.js";
+import { useUixLabels } from "../labels-context.js";
 const ChevronIcon = () => /* @__PURE__ */ jsx("svg", { className: "uix-navgroup__chevron", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M2 4l4 4 4-4" }) });
-function Sidebar({ collapsed, nav, onToggle, brand, toggleIcon, children, expandLabel = "Expand sidebar", collapseLabel = "Collapse sidebar", className, ...props }) {
+function Sidebar({ collapsed, nav, onToggle, brand, toggleIcon, children, expandLabel: expandLabelProp, collapseLabel: collapseLabelProp, className, ...props }) {
+  const uixLabels = useUixLabels();
+  const expandLabel = expandLabelProp ?? uixLabels.sidebar?.expand ?? "Expand sidebar";
+  const collapseLabel = collapseLabelProp ?? uixLabels.sidebar?.collapse ?? "Collapse sidebar";
   const isCollapsed = collapsed ?? nav === "rail";
   return /* @__PURE__ */ jsxs("nav", { className: cx("uix-sidebar", className), "data-collapsed": isCollapsed || void 0, "data-nav": nav, ...props, children: [
     (brand != null || onToggle) && /* @__PURE__ */ jsxs("div", { className: "uix-sidebar__head", children: [
@@ -23,7 +27,12 @@ function SidebarSection({ label, children }) {
     children
   ] });
 }
-function NavItem({ icon, badge, active, as: Tag = "a", children, className, ...props }) {
+function NavItem({ icon, badge, active, as: Tag = "a", description, children, className, ...props }) {
+  const text = description == null ? /* @__PURE__ */ jsx("span", { className: "uix-navitem__label", children }) : /* @__PURE__ */ jsxs("span", { className: "uix-navitem__text", children: [
+    /* @__PURE__ */ jsx("span", { className: "uix-navitem__label", children }),
+    /* @__PURE__ */ jsx("span", { className: "uix-navitem__desc", children: description })
+  ] });
+  const multiline = description == null ? void 0 : true;
   if (Tag === "button") {
     const { href: _href, ...btnProps } = props;
     return /* @__PURE__ */ jsxs(
@@ -32,10 +41,11 @@ function NavItem({ icon, badge, active, as: Tag = "a", children, className, ...p
         type: "button",
         className: cx("uix-navitem", className),
         "aria-current": active ? "page" : void 0,
+        "data-multiline": multiline,
         ...btnProps,
         children: [
           icon && /* @__PURE__ */ jsx("span", { className: "uix-navitem__icon", "aria-hidden": "true", children: icon }),
-          /* @__PURE__ */ jsx("span", { className: "uix-navitem__label", children }),
+          text,
           badge != null && /* @__PURE__ */ jsx("span", { className: "uix-navitem__badge", children: badge })
         ]
       }
@@ -46,10 +56,11 @@ function NavItem({ icon, badge, active, as: Tag = "a", children, className, ...p
     {
       className: cx("uix-navitem", className),
       "aria-current": active ? "page" : void 0,
+      "data-multiline": multiline,
       ...props,
       children: [
         icon && /* @__PURE__ */ jsx("span", { className: "uix-navitem__icon", "aria-hidden": "true", children: icon }),
-        /* @__PURE__ */ jsx("span", { className: "uix-navitem__label", children }),
+        text,
         badge != null && /* @__PURE__ */ jsx("span", { className: "uix-navitem__badge", children: badge })
       ]
     }

package/dist/components/Stat.d.ts

@@ -1,5 +1,6 @@
 import * as react from 'react';
 import { HTMLAttributes, ReactNode } from 'react';
+import { UixRenderLink } from '../link.js';
 
 interface StatTrend {
     direction: 'up' | 'down';
@@ -32,6 +33,21 @@ interface StatProps extends HTMLAttributes<HTMLElement> {
     };
     /** Whether the editor this tile opens is currently open (`aria-expanded`). */
     expanded?: boolean;
+    /**
+     * What `onActivate` opens, for `aria-haspopup` (HAR-1350; TENSOR B6). Default `'dialog'`;
+     * `'menu'` for a status menu; `false` for an in-place action (no chevron either).
+     */
+    haspopup?: 'dialog' | 'menu' | 'listbox' | false;
+    /**
+     * Makes the whole tile a link (HAR-1350; TENSOR B7, MOTUS B-A7). Server-renderable, unlike
+     * `onActivate`. Ignored when `onActivate` is set. The forwarded ref reaches the `<a>` only
+     * without `renderLink`.
+     */
+    href?: string;
+    /** The link tile is the current page (`aria-current="page"`). */
+    current?: boolean;
+    /** Your router's link for `href`; default a plain `<a>`. */
+    renderLink?: UixRenderLink;
 }
 /**
  * KPI / stat tile over `.uix-stat`. With `onActivate` the tile is a button; the forwarded

package/dist/components/Stat.js

@@ -1,23 +1,26 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef, useId } from "react";
 import { cx } from "../cx.js";
+import { renderUixLink } from "../link.js";
 const Chevron = () => /* @__PURE__ */ jsx("span", { className: "uix-stat__chevron", "aria-hidden": "true", children: /* @__PURE__ */ jsx("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "m6 9 6 6 6-6" }) }) });
-const Stat = forwardRef(function Stat2({ label, value, icon, meta, trend, tone = "neutral", size = "hero", onActivate, activateLabel, expanded, trendLabels, className, onClick, ...props }, ref) {
+const Stat = forwardRef(function Stat2({ label, value, icon, meta, trend, tone = "neutral", size = "hero", onActivate, activateLabel, expanded, trendLabels, haspopup = "dialog", href, current, renderLink, className, onClick, ...props }, ref) {
   const id = useId();
   const interactive = onActivate != null;
+  const linked = !interactive && href != null;
   const classes = cx(
     "uix-stat",
     tone !== "neutral" && `uix-stat--${tone}`,
     size === "compact" && "uix-stat--compact",
-    interactive && "uix-stat--interactive",
+    (interactive || linked) && "uix-stat--interactive",
+    linked && "uix-stat--link",
     className
   );
-  const Row = interactive ? "span" : "div";
+  const Row = interactive || linked ? "span" : "div";
   const body = /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs(Row, { className: "uix-stat__label", children: [
       /* @__PURE__ */ jsx("span", { id: interactive ? `${id}-label` : void 0, children: label }),
       icon,
-      interactive && /* @__PURE__ */ jsx(Chevron, {})
+      interactive && haspopup !== false && /* @__PURE__ */ jsx(Chevron, {})
     ] }),
     /* @__PURE__ */ jsx(Row, { className: "uix-stat__value", id: interactive ? `${id}-value` : void 0, children: value }),
     (meta != null || trend != null) && /* @__PURE__ */ jsxs(Row, { className: "uix-stat__meta", id: interactive ? `${id}-meta` : void 0, children: [
@@ -29,6 +32,10 @@ const Stat = forwardRef(function Stat2({ label, value, icon, meta, trend, tone =
       meta
     ] })
   ] });
+  if (linked) {
+    const linkProps = { ...props, href, className: classes, onClick, "aria-current": current ? "page" : void 0, children: body };
+    return /* @__PURE__ */ jsx(Fragment, { children: renderLink ? renderUixLink(renderLink, linkProps) : /* @__PURE__ */ jsx("a", { ref, ...linkProps }) });
+  }
   if (!interactive) {
     return /* @__PURE__ */ jsx("div", { ref, className: classes, onClick, ...props, children: body });
   }
@@ -39,7 +46,7 @@ const Stat = forwardRef(function Stat2({ label, value, icon, meta, trend, tone =
       ...props,
       ref,
       className: classes,
-      "aria-haspopup": "dialog",
+      "aria-haspopup": haspopup === false ? void 0 : haspopup,
       "aria-expanded": expanded,
       "aria-labelledby": `${id}-label ${id}-sep ${id}-value${activateLabel ? ` ${id}-action` : ""}`,
       "aria-describedby": meta != null || trend != null ? `${id}-meta` : void 0,

package/dist/components/Steps.d.ts

@@ -0,0 +1,48 @@
+import * as react from 'react';
+import { LiHTMLAttributes, ReactNode, HTMLAttributes } from 'react';
+import { UixRenderLink } from '../link.js';
+
+type StepState = 'complete' | 'current' | 'upcoming' | 'waiting' | 'error';
+/** The state words read after each step's title (state is never colour alone). */
+interface StepStateLabels {
+    complete: string;
+    current: string;
+    upcoming: string;
+    waiting: string;
+    error: string;
+}
+declare const DEFAULT_STEP_STATE_LABELS: StepStateLabels;
+interface StepsProps extends HTMLAttributes<HTMLOListElement> {
+    /**
+     * `horizontal` (default) lays the steps in a row and stacks them below 40rem;
+     * `vertical` always stacks, with descriptions under each title.
+     */
+    orientation?: 'horizontal' | 'vertical';
+    /** Names the list, e.g. "Intake progress". */
+    label?: string;
+    stateLabels?: Partial<StepStateLabels>;
+    /** `Step` elements, in order. */
+    children?: ReactNode;
+}
+interface StepProps extends Omit<LiHTMLAttributes<HTMLLIElement>, 'title'> {
+    title: ReactNode;
+    description?: ReactNode;
+    state?: StepState;
+    /** Marker content. Default: the step number; ✓ when complete; ! on error. */
+    marker?: ReactNode;
+    /** A navigable step (a wizard you can jump back in). */
+    href?: string;
+    renderLink?: UixRenderLink;
+    onSelect?: () => void;
+    /** Set by `Steps`. */
+    index?: number;
+    /** Set by `Steps`. */
+    last?: boolean;
+    /** Set by `Steps`. */
+    stateLabels?: StepStateLabels;
+}
+/** Numbered progress through a multi-step flow (HAR-1362; TENSOR C13, MOTUS C-9). */
+declare function Steps({ orientation, label, stateLabels, className, children, ...props }: StepsProps): react.JSX.Element;
+declare function Step({ title, description, state, marker, href, renderLink, onSelect, index, last, stateLabels, className, ...props }: StepProps): react.JSX.Element;
+
+export { DEFAULT_STEP_STATE_LABELS, Step, type StepProps, type StepState, type StepStateLabels, Steps, type StepsProps };