@homebound/beam 3.100.0 → 3.101.0

package/dist/index.d.cts

@@ -5257,6 +5257,7 @@ declare class RowState<R extends Kinded> {
      * at which point this would become `"top" | "bottom"`.
      */
     pinned: boolean;
+    private _aiMode;
     /** Whether we are dragged over. */
     isDraggedOver: DraggedOver;
     /**
@@ -5284,6 +5285,8 @@ declare class RowState<R extends Kinded> {
     get row(): GridDataRow<R>;
     /** Accepts a new unstable row, i.e. each `createRows` creates a new row literal. */
     set row(row: GridDataRow<R>);
+    /** True when `row.aiMode` is true or its function returns true. */
+    get aiMode(): boolean;
     /**
      * Whether we match a client-side filter; true if no filter is in place.
      *
@@ -5448,6 +5451,8 @@ type GridDataRow<R extends Kinded> = {
     draggable?: boolean;
     /** Image src for the row, to be used for card view */
     imgSrc?: string;
+    /** Paints the row with `Tokens.AiFieldBg`. Use `() => boolean` to read MobX without rebuilding `rows`. */
+    aiMode?: MaybeFn<boolean>;
     /**
      * Full-width content rendered with this row (no separator between them).
      * Plain content / render fn defaults to `"trailing"`; use `{ position, content }` for `"leading"`.

package/dist/index.d.ts

@@ -5257,6 +5257,7 @@ declare class RowState<R extends Kinded> {
      * at which point this would become `"top" | "bottom"`.
      */
     pinned: boolean;
+    private _aiMode;
     /** Whether we are dragged over. */
     isDraggedOver: DraggedOver;
     /**
@@ -5284,6 +5285,8 @@ declare class RowState<R extends Kinded> {
     get row(): GridDataRow<R>;
     /** Accepts a new unstable row, i.e. each `createRows` creates a new row literal. */
     set row(row: GridDataRow<R>);
+    /** True when `row.aiMode` is true or its function returns true. */
+    get aiMode(): boolean;
     /**
      * Whether we match a client-side filter; true if no filter is in place.
      *
@@ -5448,6 +5451,8 @@ type GridDataRow<R extends Kinded> = {
     draggable?: boolean;
     /** Image src for the row, to be used for card view */
     imgSrc?: string;
+    /** Paints the row with `Tokens.AiFieldBg`. Use `() => boolean` to read MobX without rebuilding `rows`. */
+    aiMode?: MaybeFn<boolean>;
     /**
      * Full-width content rendered with this row (no separator between them).
      * Plain content / render fn defaults to `"trailing"`; use `{ position, content }` for `"leading"`.

package/dist/index.js

@@ -6710,6 +6710,7 @@ var RowState = class {
       {
         _row: false,
         _data: observable2.ref,
+        _aiMode: observable2.ref,
         isCalculatingDirectMatch: false
       },
       { name: `RowState@${row.id}` }
@@ -6739,6 +6740,7 @@ var RowState = class {
    * at which point this would become `"top" | "bottom"`.
    */
   pinned = false;
+  _aiMode;
   /** Whether we are dragged over. */
   isDraggedOver = 0 /* None */;
   /**
@@ -6769,6 +6771,11 @@ var RowState = class {
   set row(row) {
     this._row = row;
     this._data = row.data;
+    if (this._aiMode !== row.aiMode) this._aiMode = row.aiMode;
+  }
+  /** True when `row.aiMode` is true or its function returns true. */
+  get aiMode() {
+    return !!maybeApply(this._aiMode);
   }
   /**
    * Whether we match a client-side filter; true if no filter is in place.
@@ -9048,7 +9055,8 @@ function RowImpl(props) {
     isKept: isKeptRow,
     isLastKeptRow,
     pinned,
-    level
+    level,
+    aiMode
   } = rs;
   const isHeader = row.kind === HEADER;
   const isTotals = row.kind === TOTALS;
@@ -9074,7 +9082,7 @@ function RowImpl(props) {
       paddingBottom: "pb_25px"
     }
   };
-  const rowHoverBg = maybeCssVar(style.rowHoverColor !== void 0 && style.rowHoverColor !== "none" ? style.rowHoverColor : "--b-surface-hover" /* SurfaceHover */);
+  const rowHoverBg = maybeCssVar(aiMode && !reservedRowKinds.includes(row.kind) ? "rgba(237, 233, 254, 1)" /* Purple100 */ : style.rowHoverColor !== void 0 && style.rowHoverColor !== "none" ? style.rowHoverColor : "--b-surface-hover" /* SurfaceHover */);
   const rowCss = {
     ...!reservedRowKinds.includes(row.kind) && style.nonHeaderRowCss,
     ...isFirstBodyRow && style.firstBodyRowCss,
@@ -9264,6 +9272,12 @@ function RowImpl(props) {
       ...isLastKeptRow && style.keptLastRowCss,
       // Apply the blue highlight to every runtime-pinned row's cells (wins over `isActive`)
       ...pinned && style.pinnedRowCss,
+      // AI wash wins over pinned/active; reserved kinds never get it.
+      ...aiMode && !reservedRowKinds.includes(row.kind) && {
+        backgroundColor: ["bgColor_var", {
+          "--backgroundColor": "var(--b-ai-field-bg)"
+        }]
+      },
       // Apply cell highlight styles to active cell and hover
       ...{
         ...applyCellHighlight && isCellActive ? {
@@ -17346,6 +17360,7 @@ function RowGroup(props) {
 }
 
 // src/components/Table/components/TableCard.tsx
+import { observer as observer2 } from "mobx-react";
 import { useMemo as useMemo27 } from "react";
 import { useFocusRing as useFocusRing11 } from "react-aria";
 import { Link as Link4 } from "react-router-dom";
@@ -17507,7 +17522,7 @@ import { Fragment as Fragment24, jsx as jsx97, jsxs as jsxs51 } from "react/jsx-
 var __maybeInc13 = (inc) => {
   return typeof inc === "string" ? inc : `calc(var(--t-spacing) * ${inc})`;
 };
-function TableCard(props) {
+function TableCardImpl(props) {
   const {
     rs,
     columns,
@@ -17564,8 +17579,9 @@ function TableCard(props) {
   }
   if (!title) return null;
   const onClick = rowStyle?.onClick;
-  return /* @__PURE__ */ jsx97(TableCardView, { ...tid, imgSrc: rs.row.imgSrc ?? "", title, leftEyebrow, rightEyebrow, badge, badgeTags, status, data: dataBlocks, progress, interactiveFooter, to: rowStyle?.rowLink?.(rs.row), onClick: onClick ? () => onClick(rs.row, api) : void 0, height, imageFit });
+  return /* @__PURE__ */ jsx97(TableCardView, { ...tid, imgSrc: rs.row.imgSrc ?? "", title, leftEyebrow, rightEyebrow, badge, badgeTags, status, data: dataBlocks, progress, interactiveFooter, to: rowStyle?.rowLink?.(rs.row), onClick: onClick ? () => onClick(rs.row, api) : void 0, height, imageFit, aiMode: rs.aiMode });
 }
+var TableCard = observer2(TableCardImpl);
 function TableCardView(props) {
   const {
     title,
@@ -17581,7 +17597,8 @@ function TableCardView(props) {
     to,
     onClick,
     height = 430,
-    imageFit = "cover"
+    imageFit = "cover",
+    aiMode = false
   } = props;
   const tid = useTestIds(props, "tableCardView");
   const action = to || onClick;
@@ -17731,7 +17748,7 @@ function TableCardView(props) {
         "--borderColor": "var(--b-field-border-default)"
       }],
       backgroundColor: ["bgColor_var", {
-        "--backgroundColor": "var(--b-surface-raised)"
+        "--backgroundColor": maybeCssVar31(aiMode ? "--b-ai-field-bg" /* AiFieldBg */ : "--b-surface-raised" /* SurfaceRaised */)
       }],
       height: ["h_var", {
         "--height": `${height}px`
@@ -22318,7 +22335,7 @@ function useActiveSection(sectionsWithRefs) {
   });
   useEffect26(() => {
     if (!("IntersectionObserver" in window)) return;
-    const observer2 = new IntersectionObserver((entries) => debouncedIntersectionCallback(entries), {
+    const observer3 = new IntersectionObserver((entries) => debouncedIntersectionCallback(entries), {
       /**
        * Creating rules to determine when a section is "in view" is a real challenge given the section sizes
        * are unknown and will likely be mixed (optimizing for large sections makes tracking small sections
@@ -22334,7 +22351,7 @@ function useActiveSection(sectionsWithRefs) {
       ref
     }) => {
       if (ref.current) {
-        observer2.observe(ref.current);
+        observer3.observe(ref.current);
       }
     });
     return () => {
@@ -22342,7 +22359,7 @@ function useActiveSection(sectionsWithRefs) {
         ref
       }) => {
         if (ref.current) {
-          observer2.unobserve(ref.current);
+          observer3.unobserve(ref.current);
         }
       });
     };