@tensor_1/react 2.30.0 → 2.32.0

package/dist/emoji.cjs

@@ -83,7 +83,7 @@ function fitsOn(side, a, f, vp, offset, padding) {
   return spaceOn(side, a, vp, offset) >= need + padding;
 }
 function computePosition(anchor, floating, viewport, options = {}) {
-  const { placement = "bottom-start", offset = 6, padding = 8, flip = true, shift = true, stickySide } = options;
+  const { placement = "bottom-start", offset = 6, padding = 8, flip = true, shift = true, shiftMainAxis = true, stickySide } = options;
   const { side: preferred, align } = parsePlacement(placement);
   let side = preferred;
   const sticky = stickySide === preferred || stickySide === OPPOSITE[preferred] ? stickySide : void 0;
@@ -116,12 +116,27 @@ function computePosition(anchor, floating, viewport, options = {}) {
     y = align === "start" ? start : align === "end" ? end : center;
     if (shift) y = clamp(y, padding, Math.max(padding, viewport.height - floating.height - padding));
   }
+  const mainAxisNatural = horizontal ? y : x;
+  const anchorInView = horizontal ? anchor.y + anchor.height > 0 && anchor.y < viewport.height : anchor.x + anchor.width > 0 && anchor.x < viewport.width;
+  let mainAxisRange = null;
+  if (shiftMainAxis && anchorInView) {
+    const extent = horizontal ? viewport.height - floating.height : viewport.width - floating.width;
+    mainAxisRange = [padding, Math.max(padding, extent - padding)];
+    if (horizontal) y = clamp(y, mainAxisRange[0], mainAxisRange[1]);
+    else x = clamp(x, mainAxisRange[0], mainAxisRange[1]);
+  }
   return {
     x,
     y,
     placement: align === "center" ? side : `${side}-${align}`,
     side,
-    align
+    align,
+    mainAxisNatural,
+    mainAxisRange,
+    available: {
+      width: Math.max(0, viewport.width - 2 * padding),
+      height: Math.max(0, viewport.height - 2 * padding)
+    }
   };
 }
 
@@ -140,6 +155,7 @@ function supportsAnchoring() {
   }
   return anchoringSupported;
 }
+var ANCHOR_BAND = 64;
 var anchorCount = 0;
 var namesOf = (value) => value.split(",").map((n) => n.trim()).filter((n) => n.startsWith("--"));
 function addAnchorName(el, name) {
@@ -164,9 +180,12 @@ function translationOf(el) {
 }
 var signed = (n) => `${n < 0 ? "-" : "+"} ${Math.round(Math.abs(n) * 100) / 100}px`;
 var prepared = /* @__PURE__ */ new WeakSet();
-function useAnchoredPosition(anchor, floatingRef, { open, placement = "bottom-start", offset = 6, padding = 8 }) {
-  const opts = (0, import_react.useRef)({ placement, offset, padding });
-  opts.current = { placement, offset, padding };
+function useAnchoredPosition(anchor, floatingRef, { open, placement = "bottom-start", offset = 6, padding = 8, shiftMainAxis = true, capHeight = false, onAnchorHidden }) {
+  const opts = (0, import_react.useRef)({ placement, offset, padding, shiftMainAxis, capHeight });
+  opts.current = { placement, offset, padding, shiftMainAxis, capHeight };
+  const onAnchorHiddenRef = (0, import_react.useRef)(onAnchorHidden);
+  onAnchorHiddenRef.current = onAnchorHidden;
+  const heightCap = (0, import_react.useRef)(null);
   const session = (0, import_react.useRef)(false);
   const side = (0, import_react.useRef)(null);
   const written = (0, import_react.useRef)("");
@@ -190,6 +209,15 @@ function useAnchoredPosition(anchor, floatingRef, { open, placement = "bottom-st
     }
     removeAnchorName(current.anchor, current.name);
   }, [floatingRef]);
+  const uncap = (0, import_react.useCallback)(() => {
+    const cap = heightCap.current;
+    if (!cap) return;
+    heightCap.current = null;
+    const floating = floatingRef.current;
+    if (!floating) return;
+    floating.style.maxHeight = cap.inlineMaxHeight;
+    if (cap.setOverflow) floating.style.overflowY = cap.inlineOverflowY;
+  }, [floatingRef]);
   const reposition = (0, import_react.useCallback)(() => {
     const anchorEl = resolveAnchor(anchor);
     const floating = floatingRef.current;
@@ -202,14 +230,36 @@ function useAnchoredPosition(anchor, floatingRef, { open, placement = "bottom-st
       prepared.add(floating);
       written.current = "";
     }
+    const { placement: p, offset: o, padding: pad, shiftMainAxis: keepInView, capHeight: cap } = opts.current;
+    if (cap) {
+      if (!heightCap.current) {
+        const own = getComputedStyle(floating);
+        const setOverflow = !own.overflowY || own.overflowY === "visible";
+        heightCap.current = {
+          inlineMaxHeight: s.maxHeight,
+          inlineOverflowY: s.overflowY,
+          ownMaxHeight: own.maxHeight && own.maxHeight !== "none" ? own.maxHeight : "",
+          setOverflow,
+          written: ""
+        };
+        if (setOverflow) s.overflowY = "auto";
+      }
+      const room = `${Math.max(0, window.innerHeight - 2 * pad)}px`;
+      const max = heightCap.current.ownMaxHeight ? `min(${room}, ${heightCap.current.ownMaxHeight})` : room;
+      if (max !== heightCap.current.written) {
+        s.maxHeight = max;
+        heightCap.current.written = max;
+      }
+    } else if (heightCap.current) {
+      uncap();
+    }
     const a = anchorEl.getBoundingClientRect();
     const size = { width: floating.offsetWidth, height: floating.offsetHeight };
-    const { placement: p, offset: o, padding: pad } = opts.current;
     const pos = computePosition(
       { x: a.x, y: a.y, width: a.width, height: a.height },
       size,
       { width: window.innerWidth, height: window.innerHeight },
-      { placement: p, offset: o, padding: pad, stickySide: side.current ?? void 0 }
+      { placement: p, offset: o, padding: pad, shiftMainAxis: keepInView, stickySide: side.current ?? void 0 }
     );
     const measured = size.width > 0 || size.height > 0;
     if (measured && session.current) side.current = pos.side;
@@ -223,7 +273,10 @@ function useAnchoredPosition(anchor, floatingRef, { open, placement = "bottom-st
       s.top = top2;
       written.current = key2;
     };
-    if (anchoringFailed.current || !supportsAnchoring()) {
+    const limit = pos.mainAxisRange;
+    const nearLimit = limit !== null && (pos.mainAxisNatural < limit[0] + ANCHOR_BAND || pos.mainAxisNatural > limit[1] - ANCHOR_BAND);
+    if (anchoringFailed.current || nearLimit || !supportsAnchoring()) {
+      if (anchoring.current) release(false);
       writeFixed(pos);
       return;
     }
@@ -260,7 +313,7 @@ function useAnchoredPosition(anchor, floatingRef, { open, placement = "bottom-st
         writeFixed(pos);
       }
     }
-  }, [anchor, floatingRef, release]);
+  }, [anchor, floatingRef, release, uncap]);
   useIsomorphicLayoutEffect(() => {
     if (!open) return;
     session.current = true;
@@ -289,8 +342,20 @@ function useAnchoredPosition(anchor, floatingRef, { open, placement = "bottom-st
       side.current = null;
       anchoringFailed.current = false;
       release(true);
+      uncap();
     };
-  }, [open, reposition, anchor, floatingRef, release]);
+  }, [open, reposition, anchor, floatingRef, release, uncap]);
+  const watchAnchor = open && !!onAnchorHidden;
+  (0, import_react.useEffect)(() => {
+    const anchorEl = resolveAnchor(anchor);
+    if (!watchAnchor || !anchorEl || typeof IntersectionObserver !== "function") return;
+    const observer = new IntersectionObserver((entries) => {
+      const latest = entries[entries.length - 1];
+      if (latest && !latest.isIntersecting) onAnchorHiddenRef.current?.();
+    });
+    observer.observe(anchorEl);
+    return () => observer.disconnect();
+  }, [watchAnchor, anchor]);
   (0, import_react.useEffect)(() => () => release(false), [release]);
   return reposition;
 }
@@ -312,16 +377,22 @@ var settle = (el) => {
   el.removeAttribute(PLACING);
 };
 function Popover({
-  popover = "auto",
+  popover: popoverProp,
   anchor,
   placement = "bottom-start",
   offset = 6,
   closeWhenAnchorHidden = false,
   onAnchorHidden,
+  capHeight = false,
+  openOnHover = false,
   className,
   children,
   ...props
 }) {
+  const hover = !!openOnHover && !!anchor;
+  const popover = popoverProp ?? (hover ? "manual" : "auto");
+  const openDelay = typeof openOnHover === "object" ? openOnHover.openDelay ?? 300 : 300;
+  const closeDelay = typeof openOnHover === "object" ? openOnHover.closeDelay ?? 150 : 150;
   const ref = (0, import_react2.useRef)(null);
   const [open, setOpen] = (0, import_react2.useState)(false);
   const openRef = (0, import_react2.useRef)(false);
@@ -331,7 +402,16 @@ function Popover({
   const reposition = useAnchoredPosition(anchor ?? null, ref, {
     open: open && !!anchor,
     placement,
-    offset
+    offset,
+    capHeight,
+    onAnchorHidden: closeWhenAnchorHidden ? () => {
+      const el = ref.current;
+      if (!el || !isPopoverOpen(el)) return;
+      onAnchorHiddenRef.current?.();
+      const active = el.ownerDocument.activeElement;
+      if (active && el.contains(active)) active.blur();
+      el.hidePopover();
+    } : void 0
   });
   (0, import_react2.useEffect)(() => {
     const el = ref.current;
@@ -366,25 +446,87 @@ function Popover({
       el.removeAttribute(PLACING);
     };
   }, [anchor, reposition]);
+  (0, import_react2.useEffect)(() => {
+    const el = ref.current;
+    const anchorEl = resolveAnchor(anchor);
+    if (!hover || !el || !anchorEl) return;
+    let timer;
+    const inside = (node) => !!node && (anchorEl.contains(node) || el.contains(node));
+    const stillWanted = () => {
+      try {
+        return anchorEl.matches(":hover") || el.matches(":hover") || inside(el.ownerDocument.activeElement);
+      } catch {
+        return false;
+      }
+    };
+    const show = (delay) => {
+      window.clearTimeout(timer);
+      timer = window.setTimeout(() => {
+        if (!isPopoverOpen(el)) {
+          try {
+            el.showPopover?.();
+          } catch {
+          }
+        }
+      }, delay);
+    };
+    const hide = (delay) => {
+      window.clearTimeout(timer);
+      timer = window.setTimeout(() => {
+        if (isPopoverOpen(el) && !stillWanted()) {
+          try {
+            el.hidePopover?.();
+          } catch {
+          }
+        }
+      }, delay);
+    };
+    const onEnter = (event) => {
+      if (event.pointerType !== "touch") show(openDelay);
+    };
+    const onLeave = (event) => {
+      if (event.pointerType !== "touch") hide(closeDelay);
+    };
+    const onFocusIn = () => show(0);
+    const onFocusOut = (event) => {
+      if (!inside(event.relatedTarget)) hide(closeDelay);
+    };
+    const onKeyDown = (event) => {
+      if (event.key !== "Escape" || !isPopoverOpen(el)) return;
+      window.clearTimeout(timer);
+      const hadFocus = el.contains(el.ownerDocument.activeElement);
+      try {
+        el.hidePopover?.();
+      } catch {
+      }
+      if (hadFocus) {
+        anchorEl.removeEventListener("focusin", onFocusIn);
+        anchorEl.focus();
+        anchorEl.addEventListener("focusin", onFocusIn);
+      }
+    };
+    for (const node of [anchorEl, el]) {
+      node.addEventListener("pointerenter", onEnter);
+      node.addEventListener("pointerleave", onLeave);
+      node.addEventListener("focusout", onFocusOut);
+      node.addEventListener("keydown", onKeyDown);
+    }
+    anchorEl.addEventListener("focusin", onFocusIn);
+    return () => {
+      window.clearTimeout(timer);
+      for (const node of [anchorEl, el]) {
+        node.removeEventListener("pointerenter", onEnter);
+        node.removeEventListener("pointerleave", onLeave);
+        node.removeEventListener("focusout", onFocusOut);
+        node.removeEventListener("keydown", onKeyDown);
+      }
+      anchorEl.removeEventListener("focusin", onFocusIn);
+    };
+  }, [hover, anchor, openDelay, closeDelay]);
   useIsomorphicLayoutEffect2(() => {
     openRef.current = open;
     if (open && ref.current) settle(ref.current);
   }, [open]);
-  (0, import_react2.useEffect)(() => {
-    const el = ref.current;
-    const anchorEl = resolveAnchor(anchor);
-    if (!closeWhenAnchorHidden || !open || !el || !anchorEl || typeof IntersectionObserver !== "function") return;
-    const observer = new IntersectionObserver((entries) => {
-      const latest = entries[entries.length - 1];
-      if (!latest || latest.isIntersecting || !isPopoverOpen(el)) return;
-      onAnchorHiddenRef.current?.();
-      const active = el.ownerDocument.activeElement;
-      if (active && el.contains(active)) active.blur();
-      el.hidePopover();
-    });
-    observer.observe(anchorEl);
-    return () => observer.disconnect();
-  }, [closeWhenAnchorHidden, open, anchor]);
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref, className: cx("uix-popover", className), ...popoverAttr, ...props, children });
 }
 

package/dist/emoji.d.cts

@@ -1,6 +1,6 @@
-import { E as EmojiPickerLabels, a as EmojiLocale, b as EmojiDataLoader } from './emoji-image-6mPZ15Zy.cjs';
-export { C as CompactEmoji, D as DEFAULT_EMOJI_PICKER_LABELS, c as EMOJI_GRID_COLUMNS, d as EmojiData, e as EmojiEntry, f as EmojiGroup, g as EmojiMessages, h as EmojiPicker, i as EmojiPickerProps, j as buildEmojiData, k as canRenderEmoji, l as emojiImageFileName, m as loadEmojiData, n as normalizeEmojiImageBaseUrl, s as searchEmoji } from './emoji-image-6mPZ15Zy.cjs';
-export { A as Align, P as Placement, S as Side } from './overlay-position-Cjv5E7mn.cjs';
+import { E as EmojiPickerLabels, a as EmojiLocale, b as EmojiDataLoader } from './emoji-image-DjCKpdwE.cjs';
+export { C as CompactEmoji, D as DEFAULT_EMOJI_PICKER_LABELS, c as EMOJI_GRID_COLUMNS, d as EmojiData, e as EmojiEntry, f as EmojiGroup, g as EmojiMessages, h as EmojiPicker, i as EmojiPickerProps, j as buildEmojiData, k as canRenderEmoji, l as emojiImageFileName, m as loadEmojiData, n as normalizeEmojiImageBaseUrl, s as searchEmoji } from './emoji-image-DjCKpdwE.cjs';
+export { A as Align, P as Placement, S as Side } from './overlay-position-2Afke51l.cjs';
 import * as react from 'react';
 
 interface ReactionSummary {

package/dist/file-model.d.ts

@@ -0,0 +1,56 @@
+/** File helpers shared by `FileUpload` and `Attachment` (HAR-984/985). Pure. */
+interface FileSizeOptions {
+    /**
+     * `1000` (default): decimal, as file managers on macOS and most of the web show sizes
+     * (1 MB = 1,000,000 bytes). `1024`: binary, as Windows and many servers count them
+     * (1 MB = 1,048,576 bytes) — use it when the rest of the product does, so one file never
+     * shows two sizes (HAR-1630).
+     */
+    base?: 1000 | 1024;
+    /**
+     * The five unit labels, bytes first. Default `['B', 'KB', 'MB', 'GB', 'TB']` for both bases;
+     * pass `['B', 'KiB', 'MiB', 'GiB', 'TiB']` to mark base 1024 the IEC way, or localised ones.
+     */
+    units?: readonly [string, string, string, string, string];
+}
+/** A product's own size formatter for `FileUpload` and `Attachment` (`formatSize`). */
+type FileSizeFormatter = (bytes: number, locale?: string) => string;
+/**
+ * "1.2 MB", "340 KB", "12 B" in the locale's number format. Base 1000 unless `options.base`
+ * is 1024.
+ */
+declare function formatFileSize(bytes: number, locale?: string, options?: FileSizeOptions): string;
+/** Whether a file matches an `accept` list (".pdf,image/*,application/zip"). An empty list accepts all. */
+declare function fileMatchesAccept(file: {
+    name: string;
+    type?: string;
+}, accept?: string): boolean;
+type FileRejectionReason = 'type' | 'size' | 'count';
+interface FileRejection<F = File> {
+    file: F;
+    reason: FileRejectionReason;
+}
+/**
+ * Splits picked files into accepted and rejected (wrong type, over `maxSize` bytes, or beyond
+ * `maxFiles` counting the `existing` ones). Order is kept.
+ */
+declare function partitionFiles<F extends {
+    name: string;
+    type?: string;
+    size: number;
+}>(files: readonly F[], { accept, maxSize, maxFiles, existing }: {
+    accept?: string;
+    maxSize?: number;
+    maxFiles?: number;
+    existing?: number;
+}): {
+    accepted: F[];
+    rejected: FileRejection<F>[];
+};
+/** A coarse kind for a file icon. */
+declare function fileKind(file: {
+    name: string;
+    type?: string;
+}): 'image' | 'video' | 'pdf' | 'sheet' | 'archive' | 'text' | 'other';
+
+export { type FileRejection, type FileRejectionReason, type FileSizeFormatter, type FileSizeOptions, fileKind, fileMatchesAccept, formatFileSize, partitionFiles };

package/dist/file-model.js

@@ -0,0 +1,52 @@
+const UNITS = ["B", "KB", "MB", "GB", "TB"];
+function formatFileSize(bytes, locale, options = {}) {
+  if (!Number.isFinite(bytes) || bytes < 0) return "";
+  const base = options.base === 1024 ? 1024 : 1e3;
+  const units = options.units ?? UNITS;
+  let value = bytes;
+  let unit = 0;
+  while (value >= base && unit < units.length - 1) {
+    value /= base;
+    unit += 1;
+  }
+  const digits = unit === 0 || value >= 100 ? 0 : 1;
+  return `${new Intl.NumberFormat(locale, { maximumFractionDigits: digits, minimumFractionDigits: 0 }).format(value)} ${units[unit]}`;
+}
+function fileMatchesAccept(file, accept) {
+  if (!accept || !accept.trim()) return true;
+  const name = file.name.toLowerCase();
+  const type = (file.type ?? "").toLowerCase();
+  return accept.split(",").map((t) => t.trim().toLowerCase()).filter(Boolean).some((token) => {
+    if (token.startsWith(".")) return name.endsWith(token);
+    if (token.endsWith("/*")) return type.startsWith(token.slice(0, -1));
+    return type === token;
+  });
+}
+function partitionFiles(files, { accept, maxSize, maxFiles, existing = 0 }) {
+  const accepted = [];
+  const rejected = [];
+  for (const file of files) {
+    if (!fileMatchesAccept(file, accept)) rejected.push({ file, reason: "type" });
+    else if (maxSize !== void 0 && file.size > maxSize) rejected.push({ file, reason: "size" });
+    else if (maxFiles !== void 0 && existing + accepted.length >= maxFiles) rejected.push({ file, reason: "count" });
+    else accepted.push(file);
+  }
+  return { accepted, rejected };
+}
+function fileKind(file) {
+  const type = (file.type ?? "").toLowerCase();
+  const ext = file.name.toLowerCase().split(".").pop() ?? "";
+  if (type.startsWith("image/") || ["png", "jpg", "jpeg", "gif", "webp", "svg", "heic"].includes(ext)) return "image";
+  if (type.startsWith("video/") || ["mp4", "mov", "webm"].includes(ext)) return "video";
+  if (type === "application/pdf" || ext === "pdf") return "pdf";
+  if (["xls", "xlsx", "csv", "ods"].includes(ext) || type.includes("spreadsheet") || type === "text/csv") return "sheet";
+  if (["zip", "7z", "gz", "tar", "rar"].includes(ext) || type.includes("zip")) return "archive";
+  if (type.startsWith("text/") || ["txt", "md", "log", "json", "xml", "doc", "docx", "odt", "rtf"].includes(ext)) return "text";
+  return "other";
+}
+export {
+  fileKind,
+  fileMatchesAccept,
+  formatFileSize,
+  partitionFiles
+};

package/dist/filter-model.d.ts

@@ -0,0 +1,112 @@
+/**
+ * Typed column filters for `FilterEditor` (HAR-1365; TENSOR C6 `table-filter-editor.tsx`,
+ * MOTUS C-1 "+ filter"). The value is data the product serializes into its own query; the
+ * summary feeds a `Chip`. Pure, so a server can summarize a saved view too.
+ */
+interface FilterChoice {
+    value: string;
+    label: string;
+}
+type TextFilterOperator = 'contains' | 'not-contains' | 'is' | 'is-not' | 'starts-with';
+type NumberFilterOperator = 'eq' | 'neq' | 'lt' | 'lte' | 'gt' | 'gte' | 'between';
+type FilterValue = {
+    kind: 'enum';
+    values: string[];
+} | {
+    kind: 'text';
+    operator: TextFilterOperator;
+    text: string;
+} | {
+    kind: 'number';
+    operator: NumberFilterOperator;
+    value?: number;
+    to?: number;
+} | {
+    kind: 'date-range';
+    from?: string;
+    to?: string;
+} | {
+    kind: 'boolean';
+    value?: boolean;
+} | {
+    kind: 'reference';
+    values: FilterChoice[];
+};
+type FilterValueKind = FilterValue['kind'];
+/**
+ * A named selection for an `enum` field (HAR-1505), e.g. "Open work" = new, open and pending.
+ * The id, label and values come from the product.
+ */
+interface FilterPreset {
+    id: string;
+    label: string;
+    /** The option values the preset selects. Compared as a set: order and repeats do not matter. */
+    values: readonly string[];
+}
+interface FilterField {
+    id: string;
+    /** Column name, also the start of the chip summary. */
+    label: string;
+    kind: FilterValueKind;
+    /** `enum`: the choices. */
+    options?: readonly FilterChoice[];
+    /** `reference`: finds records to pick; rejected promises show the error state. */
+    onSearch?: (query: string) => Promise<readonly FilterChoice[]>;
+    /** `text` / `number`: the operators offered, in order. Default: all of the kind. */
+    operators?: readonly (TextFilterOperator | NumberFilterOperator)[];
+    /** `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. */
+    trueLabel?: string;
+    falseLabel?: string;
+    /**
+     * `enum`: named selections shown as toggle chips above the options. Activating one replaces
+     * the selection with its values; the one equal to the selection is pressed, and the chip
+     * summary names it.
+     */
+    presets?: readonly FilterPreset[];
+}
+interface FilterSummaryLabels {
+    operators: Record<TextFilterOperator | NumberFilterOperator, string>;
+    yes: string;
+    no: string;
+    /** `{from}`, `{to}`; also used for a number range. */
+    range: string;
+    /** Only a start date. `{from}`. */
+    from: string;
+    /** Only an end date. `{to}`. */
+    until: string;
+    /** More than `maxListed` values: `{first}`, `{count}`. */
+    more: string;
+    /** An `enum` value equal to a preset: `{label}` (the preset), `{field}`. Default `{label}`. */
+    preset?: string;
+}
+declare const DEFAULT_FILTER_SUMMARY_LABELS: FilterSummaryLabels;
+declare const TEXT_FILTER_OPERATORS: readonly TextFilterOperator[];
+declare const NUMBER_FILTER_OPERATORS: readonly NumberFilterOperator[];
+/** 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;
+/**
+ * The first of `field.presets` whose values equal the value's as a set, or undefined. Only an
+ * `enum` value can match a preset.
+ */
+declare function matchFilterPreset(field: FilterField, value: FilterValue | undefined): FilterPreset | undefined;
+interface SummarizeFilterOptions {
+    labels?: Partial<FilterSummaryLabels>;
+    /** Formats a `YYYY-MM-DD` date (a product format such as DD.MM.YYYY). Default: as given. */
+    formatDate?: (date: string) => string;
+    /** Formats a number. Default: `String`. */
+    formatNumber?: (value: number) => string;
+    /** List this many values before "+N". Default 2. */
+    maxListed?: number;
+}
+/**
+ * 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`
+ * 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;
+
+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 };

package/dist/filter-model.js

@@ -0,0 +1,103 @@
+const DEFAULT_FILTER_SUMMARY_LABELS = {
+  operators: {
+    contains: "contains",
+    "not-contains": "does not contain",
+    is: "is",
+    "is-not": "is not",
+    "starts-with": "starts with",
+    eq: "=",
+    neq: "\u2260",
+    lt: "<",
+    lte: "\u2264",
+    gt: ">",
+    gte: "\u2265",
+    between: "between"
+  },
+  yes: "Yes",
+  no: "No",
+  range: "{from} \u2013 {to}",
+  from: "from {from}",
+  until: "until {to}",
+  more: "{first} +{count}",
+  preset: "{label}"
+};
+const TEXT_FILTER_OPERATORS = ["contains", "not-contains", "is", "is-not", "starts-with"];
+const NUMBER_FILTER_OPERATORS = ["eq", "neq", "lt", "lte", "gt", "gte", "between"];
+function emptyFilterValue(kind) {
+  switch (kind) {
+    case "enum":
+      return { kind, values: [] };
+    case "text":
+      return { kind, operator: "contains", text: "" };
+    case "number":
+      return { kind, operator: "eq" };
+    case "date-range":
+      return { kind };
+    case "boolean":
+      return { kind };
+    case "reference":
+      return { kind, values: [] };
+  }
+}
+function isFilterEmpty(value) {
+  if (!value) return true;
+  switch (value.kind) {
+    case "enum":
+    case "reference":
+      return value.values.length === 0;
+    case "text":
+      return value.text.trim() === "";
+    case "number":
+      return value.value === void 0 || value.operator === "between" && value.to === void 0;
+    case "date-range":
+      return !value.from && !value.to;
+    case "boolean":
+      return value.value === void 0;
+  }
+}
+function matchFilterPreset(field, value) {
+  if (value?.kind !== "enum" || !field.presets?.length) return void 0;
+  const chosen = new Set(value.values);
+  return field.presets.find((preset) => {
+    const wanted = new Set(preset.values);
+    return wanted.size === chosen.size && [...wanted].every((v) => chosen.has(v));
+  });
+}
+const fill = (template, values) => template.replace(/\{(\w+)\}/g, (match, key) => key in values ? String(values[key]) : match);
+function summarizeFilter(field, value, options = {}) {
+  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);
+  const num = (n) => `${options.formatNumber?.(n) ?? String(n)}${field.unit ? ` ${field.unit}` : ""}`;
+  const list = (items) => {
+    const max = Math.max(1, options.maxListed ?? 2);
+    return items.length > max ? fill(labels.more, { first: items.slice(0, max).join(", "), count: items.length - max }) : items.join(", ");
+  };
+  switch (value.kind) {
+    case "enum": {
+      const preset = matchFilterPreset(field, value);
+      if (preset) return fill(labels.preset ?? DEFAULT_FILTER_SUMMARY_LABELS.preset, { label: preset.label, field: field.label });
+      const byValue = new Map((field.options ?? []).map((o) => [o.value, o.label]));
+      return `${field.label}: ${list(value.values.map((v) => byValue.get(v) ?? v))}`;
+    }
+    case "reference":
+      return `${field.label}: ${list(value.values.map((v) => v.label))}`;
+    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 "boolean":
+      return `${field.label}: ${value.value ? field.trueLabel ?? labels.yes : field.falseLabel ?? labels.no}`;
+  }
+}
+export {
+  DEFAULT_FILTER_SUMMARY_LABELS,
+  NUMBER_FILTER_OPERATORS,
+  TEXT_FILTER_OPERATORS,
+  emptyFilterValue,
+  isFilterEmpty,
+  matchFilterPreset,
+  summarizeFilter
+};

package/dist/hooks/useAnchoredPosition.d.ts

@@ -7,6 +7,25 @@ interface UseAnchoredPositionOptions {
     placement?: Placement;
     offset?: number;
     padding?: number;
+    /**
+     * Keep the element inside the viewport on the side it hangs off as well: when it fits neither
+     * above nor below (or left nor right) it slides over the anchor instead of leaving the
+     * viewport. Once the anchor itself has left the viewport the element follows it out; pair
+     * that with `onAnchorHidden` to close it. Default true.
+     */
+    shiftMainAxis?: boolean;
+    /**
+     * Cap the element's height to the viewport minus the padding on both edges, and let it scroll
+     * (`overflow-y: auto`, unless its own CSS already sets an overflow). A `max-height` from the
+     * element's own CSS still applies when it is smaller. Default false.
+     */
+    capHeight?: boolean;
+    /**
+     * Called when the anchor has scrolled completely out of view (outside the viewport or a
+     * clipping ancestor) while `open`. Close the overlay here; `Popover closeWhenAnchorHidden`
+     * is built on it.
+     */
+    onAnchorHidden?: () => void;
 }
 type AnchorArg = RefObject<HTMLElement | null> | HTMLElement | null | undefined;
 /** @internal The element behind an anchor ref or element. */
@@ -22,9 +41,13 @@ declare const resolveAnchor: (a: AnchorArg) => HTMLElement | null;
  * `position: fixed` + left/top and follows scroll/resize from JS. While `open`, the side
  * chosen at open is kept until it no longer fits and the other side does, scrolls inside
  * the overlay itself are ignored, and a size change of either element re-places it.
+ * An element that fits on neither side is kept inside the viewport (it covers the anchor).
+ * While it is held there, or within `ANCHOR_BAND` of the limit, it is written as fixed
+ * coordinates even where anchor positioning exists: those cannot drift while the page scrolls,
+ * so it is inside on every frame, not one frame later (HAR-1613).
  * Returns a `reposition` fn for callers that want to nudge it manually (e.g. right when a
  * native popover's `toggle` fires).
  */
-declare function useAnchoredPosition(anchor: RefObject<HTMLElement | null> | HTMLElement | null | undefined, floatingRef: RefObject<HTMLElement | null>, { open, placement, offset, padding }: UseAnchoredPositionOptions): () => void;
+declare function useAnchoredPosition(anchor: RefObject<HTMLElement | null> | HTMLElement | null | undefined, floatingRef: RefObject<HTMLElement | null>, { open, placement, offset, padding, shiftMainAxis, capHeight, onAnchorHidden }: UseAnchoredPositionOptions): () => void;
 
 export { type UseAnchoredPositionOptions, resolveAnchor, useAnchoredPosition };