@tensor_1/react 2.47.0 → 2.48.0

package/dist/display-preferences-model.d.ts

@@ -0,0 +1,53 @@
+type ThemePreference = 'light' | 'dark' | 'system';
+type ContrastPreference = 'standard' | 'more' | 'system';
+type TextScalePreference = 'sm' | 'md' | 'lg' | 'xl';
+type MotionPreference = 'system' | 'reduce';
+type DensityPreference = 'compact' | 'standard' | 'comfortable';
+interface DisplayPreferenceValues {
+    theme: ThemePreference;
+    contrast: ContrastPreference;
+    textScale: TextScalePreference;
+    motion: MotionPreference;
+    density: DensityPreference;
+}
+/** What the system says, for the `system` choices. */
+interface SystemDisplayPreferences {
+    dark: boolean;
+    moreContrast: boolean;
+}
+/** The attributes written on <html>; `undefined` means the attribute is removed. */
+interface DisplayAttributes {
+    'data-theme': 'light' | 'dark';
+    'data-contrast'?: 'more';
+    'data-text-scale'?: 'sm' | 'lg' | 'xl';
+    'data-motion'?: 'reduce';
+    'data-density'?: 'compact' | 'comfortable';
+}
+declare const DEFAULT_DISPLAY_PREFERENCES: DisplayPreferenceValues;
+/** The default `localStorage` key. */
+declare const DISPLAY_PREFERENCES_STORAGE_KEY = "uix-display-preferences";
+declare const DISPLAY_PREFERENCE_OPTIONS: {
+    readonly theme: readonly ["light", "dark", "system"];
+    readonly contrast: readonly ["standard", "more", "system"];
+    readonly textScale: readonly ["sm", "md", "lg", "xl"];
+    readonly motion: readonly ["system", "reduce"];
+    readonly density: readonly ["compact", "standard", "comfortable"];
+};
+/** Read stored preferences; anything missing or unknown falls back to `defaults`. */
+declare function parseDisplayPreferences(raw: string | null | undefined, defaults?: DisplayPreferenceValues): DisplayPreferenceValues;
+/** The <html> attributes for a set of preferences, resolving `system` against the system. */
+declare function resolveDisplayAttributes(prefs: DisplayPreferenceValues, system: SystemDisplayPreferences): DisplayAttributes;
+/** Write (or remove) the attributes on an element, normally `document.documentElement`. */
+declare function applyDisplayAttributes(root: Element, attributes: DisplayAttributes): void;
+/** The system's answers from `matchMedia`; all false where there is none (SSR, tests). */
+declare function readSystemDisplayPreferences(): SystemDisplayPreferences;
+/**
+ * An inline script for the document head that applies the stored preferences before the first
+ * paint, so a dark or large-text page never flashes light or small (HAR-1372). Self-contained ES5;
+ * it never throws. Put it in a `<script>` before the stylesheets:
+ *   <script dangerouslySetInnerHTML={{ __html: displayPreferencesScript() }} />
+ * It mirrors parseDisplayPreferences + resolveDisplayAttributes (tested to agree).
+ */
+declare function displayPreferencesScript(storageKey?: string, defaults?: DisplayPreferenceValues): string;
+
+export { type ContrastPreference, DEFAULT_DISPLAY_PREFERENCES, DISPLAY_PREFERENCES_STORAGE_KEY, DISPLAY_PREFERENCE_OPTIONS, type DensityPreference, type DisplayAttributes, type DisplayPreferenceValues, type MotionPreference, type SystemDisplayPreferences, type TextScalePreference, type ThemePreference, applyDisplayAttributes, displayPreferencesScript, parseDisplayPreferences, readSystemDisplayPreferences, resolveDisplayAttributes };

package/dist/display-preferences-model.js

@@ -0,0 +1,64 @@
+const DEFAULT_DISPLAY_PREFERENCES = {
+  theme: "system",
+  contrast: "system",
+  textScale: "md",
+  motion: "system",
+  density: "standard"
+};
+const DISPLAY_PREFERENCES_STORAGE_KEY = "uix-display-preferences";
+const DISPLAY_PREFERENCE_OPTIONS = {
+  theme: ["light", "dark", "system"],
+  contrast: ["standard", "more", "system"],
+  textScale: ["sm", "md", "lg", "xl"],
+  motion: ["system", "reduce"],
+  density: ["compact", "standard", "comfortable"]
+};
+function parseDisplayPreferences(raw, defaults = DEFAULT_DISPLAY_PREFERENCES) {
+  let stored = {};
+  try {
+    stored = raw ? JSON.parse(raw) ?? {} : {};
+  } catch {
+    stored = {};
+  }
+  if (typeof stored !== "object") stored = {};
+  const pick = (key) => {
+    const value = stored[key];
+    return DISPLAY_PREFERENCE_OPTIONS[key].includes(value) ? value : defaults[key];
+  };
+  return { theme: pick("theme"), contrast: pick("contrast"), textScale: pick("textScale"), motion: pick("motion"), density: pick("density") };
+}
+function resolveDisplayAttributes(prefs, system) {
+  const theme = prefs.theme === "system" ? system.dark ? "dark" : "light" : prefs.theme;
+  const more = prefs.contrast === "more" || prefs.contrast === "system" && system.moreContrast;
+  return {
+    "data-theme": theme,
+    "data-contrast": more ? "more" : void 0,
+    "data-text-scale": prefs.textScale === "md" ? void 0 : prefs.textScale,
+    "data-motion": prefs.motion === "reduce" ? "reduce" : void 0,
+    "data-density": prefs.density === "standard" ? void 0 : prefs.density
+  };
+}
+function applyDisplayAttributes(root, attributes) {
+  for (const name of ["data-theme", "data-contrast", "data-text-scale", "data-motion", "data-density"]) {
+    const value = attributes[name];
+    if (value == null) root.removeAttribute(name);
+    else if (root.getAttribute(name) !== value) root.setAttribute(name, value);
+  }
+}
+function readSystemDisplayPreferences() {
+  const mm = (query) => typeof matchMedia === "function" && matchMedia(query).matches;
+  return { dark: mm("(prefers-color-scheme: dark)"), moreContrast: mm("(prefers-contrast: more)") };
+}
+function displayPreferencesScript(storageKey = DISPLAY_PREFERENCES_STORAGE_KEY, defaults = DEFAULT_DISPLAY_PREFERENCES) {
+  return `(function(){try{var d=document.documentElement,p={};try{p=JSON.parse(localStorage.getItem(${JSON.stringify(storageKey)})||'{}')||{}}catch(e){}if(typeof p!=='object')p={};var D=${JSON.stringify(defaults)},O=${JSON.stringify(DISPLAY_PREFERENCE_OPTIONS)};for(var k in O)if(O[k].indexOf(p[k])<0)p[k]=D[k];var m=function(q){return !!(window.matchMedia&&window.matchMedia(q).matches)};var s=function(n,v){if(v)d.setAttribute(n,v);else d.removeAttribute(n)};s('data-theme',p.theme==='light'||p.theme==='dark'?p.theme:(m('(prefers-color-scheme: dark)')?'dark':'light'));s('data-contrast',p.contrast==='more'||(p.contrast!=='standard'&&m('(prefers-contrast: more)'))?'more':'');s('data-text-scale',p.textScale==='sm'||p.textScale==='lg'||p.textScale==='xl'?p.textScale:'');s('data-motion',p.motion==='reduce'?'reduce':'');s('data-density',p.density==='compact'||p.density==='comfortable'?p.density:'')}catch(e){}})();`;
+}
+export {
+  DEFAULT_DISPLAY_PREFERENCES,
+  DISPLAY_PREFERENCES_STORAGE_KEY,
+  DISPLAY_PREFERENCE_OPTIONS,
+  applyDisplayAttributes,
+  displayPreferencesScript,
+  parseDisplayPreferences,
+  readSystemDisplayPreferences,
+  resolveDisplayAttributes
+};

package/dist/emoji.cjs

@@ -500,6 +500,8 @@ function Popover({
     };
     const onKeyDown = (event) => {
       if (event.key !== "Escape" || !isPopoverOpen(el)) return;
+      event.preventDefault();
+      event.stopPropagation();
       window.clearTimeout(timer);
       const hadFocus = el.contains(el.ownerDocument.activeElement);
       try {
@@ -1122,32 +1124,21 @@ function useKbdPlatform(platform) {
   const detected = (0, import_react5.useSyncExternalStore)(noSubscription, detectPlatform, serverPlatform);
   return platform ?? detected;
 }
-var ARIA_KEYS = {
-  Mod: { mac: "Meta", other: "Control" },
-  Ctrl: { mac: "Control", other: "Control" },
-  Esc: { mac: "Escape", other: "Escape" },
-  Del: { mac: "Delete", other: "Delete" },
-  " ": { mac: "Space", other: "Space" },
-  "+": { mac: "Plus", other: "Plus" }
-};
-function ariaKeyShortcuts(keys, platform) {
-  return keys.map((key) => ARIA_KEYS[key]?.[platform] ?? (key.length === 1 ? key.toUpperCase() : key)).join("+");
-}
 var isKeyShortcut = (value) => Array.isArray(value) && value.length > 0 && value.every((key) => typeof key === "string");
+function spokenKeys(keys, platform, keyLabels) {
+  return keys.map((key) => keyLabels?.[key] ?? KEYS[key]?.[platform]?.[1] ?? key).join("+");
+}
 function KbdCombo({ keys, platform, keyLabels, className, ...props }) {
   const active = useKbdPlatform(platform);
-  const parts = keys.map((key) => {
-    const known = KEYS[key]?.[active];
-    return { glyph: known?.[0] ?? key, spoken: keyLabels?.[key] ?? known?.[1] ?? key };
-  });
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("span", { className: cx("uix-kbd-combo", className), ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "uix-visually-hidden", children: parts.map((p) => p.spoken).join("+") }),
-    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "uix-kbd-combo__keys", "aria-hidden": "true", children: parts.map((p, i) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("kbd", { className: "uix-kbd", children: p.glyph }, `${keys[i]}-${i}`)) })
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "uix-visually-hidden", children: spokenKeys(keys, active, keyLabels) }),
+    /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "uix-kbd-combo__keys", "aria-hidden": "true", children: keys.map((key, i) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("kbd", { className: "uix-kbd", children: KEYS[key]?.[active]?.[0] ?? key }, `${key}-${i}`)) })
   ] });
 }
 
 // src/components/Tooltip.tsx
 var import_jsx_runtime6 = require("react/jsx-runtime");
+var useIsomorphicLayoutEffect4 = typeof document !== "undefined" ? import_react6.useLayoutEffect : import_react6.useEffect;
 function Tooltip({ label, content, placement = "top", shortcut, className, children, ...props }) {
   const triggerRef = (0, import_react6.useRef)(null);
   const bubbleRef = (0, import_react6.useRef)(null);
@@ -1158,7 +1149,6 @@ function Tooltip({ label, content, placement = "top", shortcut, className, child
   const childShortcut = (0, import_react6.isValidElement)(children) ? children.props.shortcut : void 0;
   const own = shortcut ?? (isKeyShortcut(childShortcut) ? childShortcut : void 0);
   const keys = own && own.length > 0 ? own : null;
-  const keyshortcuts = keys ? ariaKeyShortcuts(keys, platform) : void 0;
   useAnchoredPosition(triggerRef, bubbleRef, { open, placement, offset: 6 });
   const cancelClose = () => {
     if (closeTimer.current != null) {
@@ -1192,13 +1182,16 @@ function Tooltip({ label, content, placement = "top", shortcut, className, child
     cancelClose();
     closeTimer.current = window.setTimeout(hide, 100);
   };
-  (0, import_react6.useEffect)(() => {
-    if (!open) return;
+  useIsomorphicLayoutEffect4(() => {
+    if (!open) return void 0;
     const onKey = (e) => {
-      if (e.key === "Escape") hide();
+      if (e.key !== "Escape") return;
+      e.preventDefault();
+      e.stopPropagation();
+      hide();
     };
-    document.addEventListener("keydown", onKey);
-    return () => document.removeEventListener("keydown", onKey);
+    document.addEventListener("keydown", onKey, true);
+    return () => document.removeEventListener("keydown", onKey, true);
   }, [open]);
   (0, import_react6.useEffect)(() => () => {
     if (closeTimer.current != null) clearTimeout(closeTimer.current);
@@ -1211,30 +1204,27 @@ function Tooltip({ label, content, placement = "top", shortcut, className, child
     }
   }, []);
   const bubbleAttr = { popover: "manual" };
+  const text = content ?? label;
+  const description = keys ? [text != null ? `${id}-text` : null, `${id}-keys`].filter(Boolean).join(" ") : id;
   const single = (0, import_react6.isValidElement)(children);
   const child = single ? (0, import_react6.cloneElement)(children, {
-    "aria-describedby": [children.props["aria-describedby"], id].filter(Boolean).join(" "),
-    ...keyshortcuts ? { "aria-keyshortcuts": keyshortcuts } : {}
+    "aria-describedby": [children.props["aria-describedby"], description].filter(Boolean).join(" ")
   }) : children;
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
     "span",
     {
       ref: triggerRef,
       className: cx("uix-tooltip", className),
-      "aria-describedby": single ? void 0 : id,
-      "aria-keyshortcuts": single ? void 0 : keyshortcuts,
+      "aria-describedby": single ? void 0 : description,
       tabIndex: single ? void 0 : 0,
       onMouseEnter: show,
       onMouseLeave: scheduleHide,
       onFocus: show,
       onBlur: hide,
-      onKeyDown: (e) => {
-        if (e.key === "Escape") hide();
-      },
       ...props,
       children: [
         child,
-        /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
           "span",
           {
             ref: bubbleRef,
@@ -1244,10 +1234,13 @@ function Tooltip({ label, content, placement = "top", shortcut, className, child
             onMouseEnter: cancelClose,
             onMouseLeave: scheduleHide,
             ...bubbleAttr,
-            children: [
-              content ?? label,
-              keys && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "uix-tooltip__shortcut", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(KbdCombo, { keys: [...keys], platform }) })
-            ]
+            children: keys ? /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+              text != null && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { id: `${id}-text`, children: text }),
+              /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("span", { className: "uix-tooltip__shortcut", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { id: `${id}-keys`, className: "uix-visually-hidden", children: spokenKeys(keys, platform) }),
+                /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(KbdCombo, { keys: [...keys], platform, "aria-hidden": "true" })
+              ] })
+            ] }) : text
           }
         )
       ]

package/dist/filter-model.d.ts

@@ -9,6 +9,12 @@ interface FilterChoice {
 }
 type TextFilterOperator = 'contains' | 'not-contains' | 'is' | 'is-not' | 'starts-with';
 type NumberFilterOperator = 'eq' | 'neq' | 'lt' | 'lte' | 'gt' | 'gte' | 'between';
+/**
+ * A date condition (HAR-1832). `on`, `before` and `after` take one day in `from`; `between` takes
+ * `from` and `to`, both inclusive. "Before" excludes the day and "after" starts the next day:
+ * `dateFilterBounds` turns each into the half-open range a query needs.
+ */
+type DateFilterOperator = 'on' | 'before' | 'after' | 'between';
 type FilterValue = {
     kind: 'enum';
     values: string[];
@@ -25,12 +31,24 @@ type FilterValue = {
     kind: 'date-range';
     from?: string;
     to?: string;
+}
+/** A date with a condition (HAR-1832); `YYYY-MM-DD`. A saved `between` stays `between`, even of one day. */
+ | {
+    kind: 'date';
+    operator: DateFilterOperator;
+    from?: string;
+    to?: string;
 } | {
     kind: 'boolean';
     value?: boolean;
 } | {
     kind: 'reference';
     values: FilterChoice[];
+}
+/** Free-text values typed in as tags (HAR-1832), e.g. several hostnames; matched by the product. */
+ | {
+    kind: 'tags';
+    values: string[];
 };
 type FilterValueKind = FilterValue['kind'];
 /**
@@ -52,8 +70,15 @@ interface FilterField {
     options?: readonly FilterChoice[];
     /** `reference`: finds records to pick; rejected promises show the error state. */
     onSearch?: (query: string) => Promise<readonly FilterChoice[]>;
+    /**
+     * `reference`: labels for chosen ids that arrived without one (a saved view restores ids).
+     * The editor asks once for every id whose label is missing or equal to the id.
+     */
+    resolveLabels?: (ids: readonly string[]) => Promise<readonly FilterChoice[]>;
     /** `text` / `number`: the operators offered, in order. Default: all of the kind. */
     operators?: readonly (TextFilterOperator | NumberFilterOperator)[];
+    /** `date`: the conditions offered, in order. Default: on, before, after, between. */
+    dateOperators?: readonly DateFilterOperator[];
     /** `number`: a unit shown after the value, e.g. "days". */
     unit?: string;
     /** `boolean`: words for true and false, e.g. Escalated / Not escalated. Default from labels. */
@@ -80,14 +105,45 @@ interface FilterSummaryLabels {
     more: string;
     /** An `enum` value equal to a preset: `{label}` (the preset), `{field}`. Default `{label}`. */
     preset?: string;
+    /** `date` conditions (HAR-1832), `{date}`. Default "{date}", "before {date}", "after {date}". */
+    on?: string;
+    before?: string;
+    after?: string;
 }
 declare const DEFAULT_FILTER_SUMMARY_LABELS: FilterSummaryLabels;
 declare const TEXT_FILTER_OPERATORS: readonly TextFilterOperator[];
 declare const NUMBER_FILTER_OPERATORS: readonly NumberFilterOperator[];
+declare const DATE_FILTER_OPERATORS: readonly DateFilterOperator[];
 /** The empty value for a field kind (what Clear resets to). */
 declare function emptyFilterValue(kind: FilterValueKind): FilterValue;
 /** True when the value filters nothing (so the chip goes away). */
 declare function isFilterEmpty(value: FilterValue | undefined): boolean;
+/**
+ * A range whose ends were typed the wrong way round (from 10 Oct to 1 Oct, 7 to 2) put in order,
+ * so it means what the person meant instead of matching nothing (PR #168 review). Number
+ * `between`, date `between` and `date-range`; every other value comes back as it is. Internal:
+ * FilterEditor applies through it, `dateFilterBounds` and `summarizeFilter` read through it.
+ */
+declare function orderFilterRange<V extends FilterValue | undefined>(value: V): V;
+/**
+ * The half-open range a `date` filter means, for a query (HAR-1832): `{ from }` is the first day
+ * included, `{ until }` the first day NOT included, either may be missing. "On 5 Oct" is
+ * `[5 Oct, 6 Oct)`, "before 5 Oct" is `[…, 5 Oct)`, "after 5 Oct" is `[6 Oct, …)`, "between 1 and
+ * 5 Oct" is `[1 Oct, 6 Oct)`. A `date-range` value reads as `between` with optional ends. Empty
+ * values give `{}`.
+ */
+declare function dateFilterBounds(input: FilterValue | undefined): {
+    from?: string;
+    until?: string;
+};
+/** True for a chosen reference whose label is missing or only repeats its id (restored from an id). */
+declare const isUnresolvedChoice: (choice: FilterChoice) => boolean;
+/**
+ * Fills in the labels of a `reference` value restored from ids (HAR-1832), with
+ * `field.resolveLabels`. Other values, and values whose labels are all known, come back as they
+ * are. Ids the resolver does not return keep the label they had.
+ */
+declare function resolveFilterLabels(field: FilterField, value: FilterValue | undefined): Promise<FilterValue | undefined>;
 /**
  * The first of `field.presets` whose values equal the value's as a set, or undefined. Only an
  * `enum` value can match a preset.
@@ -104,9 +160,9 @@ interface SummarizeFilterOptions {
 }
 /**
  * One line for the filter chip, e.g. "State: Open, Pending", "Priority ≥ 2", "Created:
- * 01.10.2026 – 05.10.2026", "Escalated: Yes". An enum value equal to one of `field.presets`
+ * 01.10.2026 – 05.10.2026", "Created: before 05.10.2026", "Host: db-01, db-02 +1", "Escalated: Yes". An enum value equal to one of `field.presets`
  * gives that preset's label (the `preset` label). Empty values give an empty string.
  */
-declare function summarizeFilter(field: FilterField, value: FilterValue | undefined, options?: SummarizeFilterOptions): string;
+declare function summarizeFilter(field: FilterField, input: FilterValue | undefined, options?: SummarizeFilterOptions): string;
 
-export { DEFAULT_FILTER_SUMMARY_LABELS, type FilterChoice, type FilterField, type FilterPreset, type FilterSummaryLabels, type FilterValue, type FilterValueKind, NUMBER_FILTER_OPERATORS, type NumberFilterOperator, type SummarizeFilterOptions, TEXT_FILTER_OPERATORS, type TextFilterOperator, emptyFilterValue, isFilterEmpty, matchFilterPreset, summarizeFilter };
+export { DATE_FILTER_OPERATORS, DEFAULT_FILTER_SUMMARY_LABELS, type DateFilterOperator, type FilterChoice, type FilterField, type FilterPreset, type FilterSummaryLabels, type FilterValue, type FilterValueKind, NUMBER_FILTER_OPERATORS, type NumberFilterOperator, type SummarizeFilterOptions, TEXT_FILTER_OPERATORS, type TextFilterOperator, dateFilterBounds, emptyFilterValue, isFilterEmpty, isUnresolvedChoice, matchFilterPreset, orderFilterRange, resolveFilterLabels, summarizeFilter };

package/dist/filter-model.js

@@ -19,10 +19,14 @@ const DEFAULT_FILTER_SUMMARY_LABELS = {
   from: "from {from}",
   until: "until {to}",
   more: "{first} +{count}",
-  preset: "{label}"
+  preset: "{label}",
+  on: "{date}",
+  before: "before {date}",
+  after: "after {date}"
 };
 const TEXT_FILTER_OPERATORS = ["contains", "not-contains", "is", "is-not", "starts-with"];
 const NUMBER_FILTER_OPERATORS = ["eq", "neq", "lt", "lte", "gt", "gte", "between"];
+const DATE_FILTER_OPERATORS = ["on", "before", "after", "between"];
 function emptyFilterValue(kind) {
   switch (kind) {
     case "enum":
@@ -33,10 +37,14 @@ function emptyFilterValue(kind) {
       return { kind, operator: "eq" };
     case "date-range":
       return { kind };
+    case "date":
+      return { kind, operator: "on" };
     case "boolean":
       return { kind };
     case "reference":
       return { kind, values: [] };
+    case "tags":
+      return { kind, values: [] };
   }
 }
 function isFilterEmpty(value) {
@@ -44,6 +52,7 @@ function isFilterEmpty(value) {
   switch (value.kind) {
     case "enum":
     case "reference":
+    case "tags":
       return value.values.length === 0;
     case "text":
       return value.text.trim() === "";
@@ -51,10 +60,53 @@ function isFilterEmpty(value) {
       return value.value === void 0 || value.operator === "between" && value.to === void 0;
     case "date-range":
       return !value.from && !value.to;
+    case "date":
+      return !value.from || value.operator === "between" && !value.to;
     case "boolean":
       return value.value === void 0;
   }
 }
+function addDays(date, days) {
+  const [y, m, d] = date.split("-").map(Number);
+  const next = new Date(Date.UTC(y, m - 1, d + days));
+  return next.toISOString().slice(0, 10);
+}
+function orderFilterRange(value) {
+  if (!value) return value;
+  if (value.kind === "number" && value.operator === "between" && value.value !== void 0 && value.to !== void 0 && value.value > value.to) {
+    return { ...value, value: value.to, to: value.value };
+  }
+  if ((value.kind === "date-range" || value.kind === "date" && value.operator === "between") && value.from && value.to && value.from > value.to) {
+    return { ...value, from: value.to, to: value.from };
+  }
+  return value;
+}
+function dateFilterBounds(input) {
+  const value = orderFilterRange(input);
+  if (value?.kind === "date-range") {
+    return { ...value.from ? { from: value.from } : {}, ...value.to ? { until: addDays(value.to, 1) } : {} };
+  }
+  if (value?.kind !== "date" || isFilterEmpty(value)) return {};
+  const day = value.from;
+  switch (value.operator) {
+    case "on":
+      return { from: day, until: addDays(day, 1) };
+    case "before":
+      return { until: day };
+    case "after":
+      return { from: addDays(day, 1) };
+    case "between":
+      return { from: day, until: addDays(value.to, 1) };
+  }
+}
+const isUnresolvedChoice = (choice) => !choice.label || choice.label === choice.value;
+async function resolveFilterLabels(field, value) {
+  if (value?.kind !== "reference" || !field.resolveLabels) return value;
+  const missing = value.values.filter(isUnresolvedChoice).map((v) => v.value);
+  if (missing.length === 0) return value;
+  const resolved = new Map((await field.resolveLabels(missing)).map((c) => [c.value, c.label]));
+  return { kind: "reference", values: value.values.map((v) => resolved.has(v.value) ? { value: v.value, label: resolved.get(v.value) } : v) };
+}
 function matchFilterPreset(field, value) {
   if (value?.kind !== "enum" || !field.presets?.length) return void 0;
   const chosen = new Set(value.values);
@@ -64,7 +116,8 @@ function matchFilterPreset(field, value) {
   });
 }
 const fill = (template, values) => template.replace(/\{(\w+)\}/g, (match, key) => key in values ? String(values[key]) : match);
-function summarizeFilter(field, value, options = {}) {
+function summarizeFilter(field, input, options = {}) {
+  const value = orderFilterRange(input);
   if (!value || isFilterEmpty(value)) return "";
   const labels = { ...DEFAULT_FILTER_SUMMARY_LABELS, ...options.labels, operators: { ...DEFAULT_FILTER_SUMMARY_LABELS.operators, ...options.labels?.operators } };
   const date = options.formatDate ?? ((d) => d);
@@ -82,22 +135,34 @@ function summarizeFilter(field, value, options = {}) {
     }
     case "reference":
       return `${field.label}: ${list(value.values.map((v) => v.label))}`;
+    case "tags":
+      return `${field.label}: ${list(value.values)}`;
     case "text":
       return `${field.label} ${labels.operators[value.operator]} \u201C${value.text.trim()}\u201D`;
     case "number":
       return value.operator === "between" ? `${field.label}: ${fill(labels.range, { from: num(value.value), to: num(value.to) })}` : `${field.label} ${labels.operators[value.operator]} ${num(value.value)}`;
     case "date-range":
       return `${field.label}: ${value.from && value.to ? fill(labels.range, { from: date(value.from), to: date(value.to) }) : value.from ? fill(labels.from, { from: date(value.from) }) : fill(labels.until, { to: date(value.to) })}`;
+    case "date": {
+      if (value.operator === "between") return `${field.label}: ${fill(labels.range, { from: date(value.from), to: date(value.to) })}`;
+      const template = labels[value.operator] ?? DEFAULT_FILTER_SUMMARY_LABELS[value.operator];
+      return `${field.label}: ${fill(template, { date: date(value.from) })}`;
+    }
     case "boolean":
       return `${field.label}: ${value.value ? field.trueLabel ?? labels.yes : field.falseLabel ?? labels.no}`;
   }
 }
 export {
+  DATE_FILTER_OPERATORS,
   DEFAULT_FILTER_SUMMARY_LABELS,
   NUMBER_FILTER_OPERATORS,
   TEXT_FILTER_OPERATORS,
+  dateFilterBounds,
   emptyFilterValue,
   isFilterEmpty,
+  isUnresolvedChoice,
   matchFilterPreset,
+  orderFilterRange,
+  resolveFilterLabels,
   summarizeFilter
 };

package/dist/hooks/useChangeHighlight.d.ts

@@ -0,0 +1,33 @@
+import { RefObject } from 'react';
+
+interface ChangeHighlightOptions {
+    /**
+     * Said through the page's polite live region when the value changes, e.g. "Status changed to
+     * Resolved by A. Novak". The highlight is the signal and its place is the location; this is
+     * the description for people who cannot see either (motion standard §2.5).
+     */
+    announce?: string;
+    /** Turn the highlight off, e.g. while the person is editing the value themselves. */
+    disabled?: boolean;
+}
+/**
+ * Flash `.uix-changed` on an element when `value` changes after mount — never on the first
+ * render (HAR-2585). A second change restarts the highlight. Compare by `Object.is`: pass a
+ * primitive (a status, a count, an `updatedAt`), not a fresh object.
+ *
+ * ```tsx
+ * const ref = useChangeHighlight<HTMLTableCellElement>(row.status, { announce: `Status: ${row.status}` });
+ * <Td ref={ref}>{row.status}</Td>
+ * ```
+ *
+ * The hook sets `data-uix-changed` on the element (React never renders that attribute, so a
+ * re-render cannot clear it) and removes it when the animation ends.
+ */
+declare function useChangeHighlight<T extends HTMLElement = HTMLElement>(value: unknown, { announce, disabled }?: ChangeHighlightOptions): RefObject<T | null>;
+/**
+ * Flash `.uix-changed` on `el` now (restarting a highlight already running). For changes that
+ * do not flow through a React value, e.g. a row a live update replaced.
+ */
+declare function flashChanged(el: HTMLElement): void;
+
+export { type ChangeHighlightOptions, flashChanged, useChangeHighlight };

package/dist/hooks/useChangeHighlight.js

@@ -0,0 +1,44 @@
+"use client";
+import { useEffect, useRef } from "react";
+import { announcePolite, ensureAnnouncer } from "../announce.js";
+function useChangeHighlight(value, { announce, disabled } = {}) {
+  const ref = useRef(null);
+  const previous = useRef(value);
+  const announces = announce !== void 0;
+  useEffect(() => {
+    if (announces) ensureAnnouncer(ref.current);
+  }, [announces]);
+  useEffect(() => {
+    if (Object.is(previous.current, value)) return;
+    previous.current = value;
+    const el = ref.current;
+    if (disabled || !el) return;
+    flashChanged(el);
+    if (announce) announcePolite(announce, el);
+  }, [value, announce, disabled]);
+  return ref;
+}
+const handlers = /* @__PURE__ */ new WeakMap();
+function flashChanged(el) {
+  if (el.hasAttribute("data-uix-changed")) {
+    el.removeAttribute("data-uix-changed");
+    void el.offsetWidth;
+  }
+  el.setAttribute("data-uix-changed", "");
+  const previous = handlers.get(el);
+  if (previous) el.removeEventListener("animationend", previous);
+  const done = (event) => {
+    const target = event.target;
+    if (!event.animationName.startsWith("uix-changed")) return;
+    if (target !== el && target?.parentNode !== el) return;
+    el.removeAttribute("data-uix-changed");
+    el.removeEventListener("animationend", done);
+    handlers.delete(el);
+  };
+  handlers.set(el, done);
+  el.addEventListener("animationend", done);
+}
+export {
+  flashChanged,
+  useChangeHighlight
+};

package/dist/hooks/useDialog.d.ts

@@ -2,6 +2,11 @@
  * `keepOpen` is asked when the browser closed the dialog on its own (Escape or a close request
  * nobody cancelled, a `method="dialog"` form). Returning `true` reopens it instead of calling
  * `onClose`: a form dialog with unsaved input or a save in flight (HAR-2029).
+ *
+ * The dialog opens and closes in a layout effect (HAR-1831). A dialog its caller unmounts while
+ * open (`{open && <ConfirmDialog …/>}`, or a page that navigates away) is closed in the commit,
+ * while it is still in the document, so the browser returns focus to the control that opened it;
+ * a passive cleanup ran after the element was removed, and focus fell to `<body>`.
  */
 declare function useDialog(open: boolean, onClose?: () => void, keepOpen?: () => boolean): React.RefObject<HTMLDialogElement>;
 

package/dist/hooks/useDialog.js

@@ -1,5 +1,6 @@
 "use client";
-import { useRef, useEffect } from "react";
+import { useRef, useEffect, useLayoutEffect } from "react";
+const useIsomorphicLayoutEffect = typeof document !== "undefined" ? useLayoutEffect : useEffect;
 let lockCount = 0;
 let saved = null;
 function lockBodyScroll() {
@@ -36,7 +37,7 @@ function useDialog(open, onClose, keepOpen) {
   onCloseRef.current = onClose;
   const keepOpenRef = useRef(keepOpen);
   keepOpenRef.current = keepOpen;
-  useEffect(() => {
+  useIsomorphicLayoutEffect(() => {
     const el = ref.current;
     if (!el || !open) {
       if (el && el.open) el.close();