@ai-matrx/records-ui 0.101.30 → 0.101.33

package/dist/index.d.cts

@@ -584,8 +584,16 @@ interface ReferenceChipRef {
      * archived (chair ruling B3-21), so the chip still names it and draws the archived state.
      */
     archived?: boolean | undefined;
+    /** The record's (or its table's) icon — an emoji or short glyph — when the host knows one. */
+    icon?: string | null | undefined;
 }
 interface RecordsUiHost {
+    /**
+     * Draws an icon kept as a NAME ("Briefcase" — how the store keeps an icon a person picked from the
+     * icon list). A relation cell in an embedded table wears its record's icon; an emoji is drawn as
+     * text and a name only through this port. Unbound (or `null` back), the page glyph stands in.
+     */
+    renderIcon?: ((name: string) => ReactNode) | undefined;
     /**
      * TEMPORARY (one-grid merge, steps 5-8). Which table grid draws: `classic` — the default Grid
      * as it shipped in 0.86; `merged` — the same grid with the older /data grid's control layer on
@@ -2142,7 +2150,8 @@ declare const NO_COLUMNS_WHY: string;
  * ordered by the table's own sort exactly as before, and offers no Reorder.
  */
 interface GridViewOrder {
-    viewId: Uuid;
+    /** The saved view's id; `null` for a view a host holds inline (it still carries its own `sorts`). */
+    viewId: Uuid | null;
     /** The view's own order word (`definition.order`). */
     order: ViewOrder;
     /** The view's own sort (`definition.sorts`) — where a sorted view OPENS, over the table's. */
@@ -2324,6 +2333,11 @@ interface ViewReading {
  */
 type LabelLookup = ((field: Field$1, id: string) => string | null) & {
     archived?: (field: Field$1, id: string) => boolean;
+    /** The linked record's own icon, and its table's icon for one that has none (same call as the words). */
+    icons?: (field: Field$1, id: string) => {
+        icon: string | null;
+        tableIcon: string | null;
+    } | undefined;
 };
 /**
  * HOW LONG A CELL MAY SAY "Loading…" BEFORE IT HAS TO SAY WHAT IT IS WAITING
@@ -3372,6 +3386,7 @@ declare function useChoiceNudge(enabled?: boolean): ChoiceNudge | null;
 interface EmbeddedLook {
     blankEmpty: boolean;
     choiceDot: boolean;
+    plainRelation: boolean;
 }
 
 /** The envelope for one key, when the document carries one. */

package/dist/index.d.ts

@@ -584,8 +584,16 @@ interface ReferenceChipRef {
      * archived (chair ruling B3-21), so the chip still names it and draws the archived state.
      */
     archived?: boolean | undefined;
+    /** The record's (or its table's) icon — an emoji or short glyph — when the host knows one. */
+    icon?: string | null | undefined;
 }
 interface RecordsUiHost {
+    /**
+     * Draws an icon kept as a NAME ("Briefcase" — how the store keeps an icon a person picked from the
+     * icon list). A relation cell in an embedded table wears its record's icon; an emoji is drawn as
+     * text and a name only through this port. Unbound (or `null` back), the page glyph stands in.
+     */
+    renderIcon?: ((name: string) => ReactNode) | undefined;
     /**
      * TEMPORARY (one-grid merge, steps 5-8). Which table grid draws: `classic` — the default Grid
      * as it shipped in 0.86; `merged` — the same grid with the older /data grid's control layer on
@@ -2142,7 +2150,8 @@ declare const NO_COLUMNS_WHY: string;
  * ordered by the table's own sort exactly as before, and offers no Reorder.
  */
 interface GridViewOrder {
-    viewId: Uuid;
+    /** The saved view's id; `null` for a view a host holds inline (it still carries its own `sorts`). */
+    viewId: Uuid | null;
     /** The view's own order word (`definition.order`). */
     order: ViewOrder;
     /** The view's own sort (`definition.sorts`) — where a sorted view OPENS, over the table's. */
@@ -2324,6 +2333,11 @@ interface ViewReading {
  */
 type LabelLookup = ((field: Field$1, id: string) => string | null) & {
     archived?: (field: Field$1, id: string) => boolean;
+    /** The linked record's own icon, and its table's icon for one that has none (same call as the words). */
+    icons?: (field: Field$1, id: string) => {
+        icon: string | null;
+        tableIcon: string | null;
+    } | undefined;
 };
 /**
  * HOW LONG A CELL MAY SAY "Loading…" BEFORE IT HAS TO SAY WHAT IT IS WAITING
@@ -3372,6 +3386,7 @@ declare function useChoiceNudge(enabled?: boolean): ChoiceNudge | null;
 interface EmbeddedLook {
     blankEmpty: boolean;
     choiceDot: boolean;
+    plainRelation: boolean;
 }
 
 /** The envelope for one key, when the document carries one. */

package/dist/index.js

@@ -1844,10 +1844,10 @@ function shown(value) {
   if (typeof value === "number" || typeof value === "boolean") return String(value);
   return null;
 }
-function tellApart(rows, nameOf) {
+function tellApart(rows, nameOf2) {
   const byName = /* @__PURE__ */ new Map();
   for (const row of rows) {
-    const name = nameOf(row.id).trim().toLowerCase();
+    const name = nameOf2(row.id).trim().toLowerCase();
     byName.set(name, [...byName.get(name) ?? [], row]);
   }
   const out = /* @__PURE__ */ new Map();
@@ -2455,6 +2455,7 @@ function RecordLabelProvider({ children }) {
   const client = useRecordsClient3();
   const [names, setNames] = useState7({});
   const [archivedRefs, setArchivedRefs] = useState7({});
+  const [iconsOf, setIconsOf] = useState7({});
   const [settled, setSettled] = useState7({});
   const [waitingLines, setWaitingLines] = useState7({});
   const asked3 = useRef3(/* @__PURE__ */ new Set());
@@ -2537,6 +2538,7 @@ function RecordLabelProvider({ children }) {
     void (async () => {
       const learned = {};
       const archivedNow = {};
+      const iconsNow = {};
       await Promise.all(
         batch.map(async ({ field: field2, ids }) => {
           const wanted = [...ids];
@@ -2549,10 +2551,12 @@ function RecordLabelProvider({ children }) {
             learned[id] = !result.ok ? UNREAD_RECORD_LABEL : typeof words2 === "string" && words2 !== "" ? words2 : WITHHELD_RECORD_LABEL;
           }
           if (result.ok) for (const id of result.archived ?? []) archivedNow[`${field2.id}:${id}`] = true;
+          if (result.ok) for (const [id, pair] of Object.entries(result.icons ?? {})) iconsNow[id] = pair;
         })
       );
       setNames((current) => ({ ...current, ...learned }));
       if (Object.keys(archivedNow).length > 0) setArchivedRefs((current) => ({ ...current, ...archivedNow }));
+      if (Object.keys(iconsNow).length > 0) setIconsOf((current) => ({ ...current, ...iconsNow }));
       for (const { field: field2 } of batch) stopWaitClock(field2.id);
     })();
   }, [client, stopWaitClock]);
@@ -2600,9 +2604,10 @@ function RecordLabelProvider({ children }) {
     () => {
       const answer = ((field2, id) => lookupWords(field2, id));
       answer.archived = (field2, id) => archivedRefs[`${field2.id}:${id}`] === true;
+      answer.icons = (_field, id) => iconsOf[id];
       return answer;
     },
-    [lookupWords, archivedRefs]
+    [lookupWords, archivedRefs, iconsOf]
   );
   const waiting = useCallback2((field2) => waitingLines[field2.id] ?? null, [waitingLines]);
   const value = useMemo5(() => ({ lookup, want, waiting }), [lookup, want, waiting]);
@@ -5157,7 +5162,7 @@ import { Badge as Badge5, cn as cn17 } from "@ai-matrx/design-system";
 
 // src/embeddedLook.tsx
 import { createContext as createContext4, useContext as useContext4 } from "react";
-var EMBEDDED_LOOK = { blankEmpty: true, choiceDot: true };
+var EMBEDDED_LOOK = { blankEmpty: true, choiceDot: true, plainRelation: true };
 var EmbeddedLookContext = createContext4(null);
 var EmbeddedLookProvider = EmbeddedLookContext.Provider;
 function useEmbeddedLook() {
@@ -5173,6 +5178,7 @@ var EMBEDDED_TABLE_CLASS = [
   "[&_thead_th]:border-border",
   "[&_thead_th:last-child]:border-r-0"
 ].join(" ");
+var EMBEDDED_PLAIN_FOOTER_CLASS = "[&_tfoot]:bg-transparent [&_tfoot]:border-t-0";
 
 // src/enumLabels.ts
 function exhaustiveValuesOf() {
@@ -5465,6 +5471,20 @@ function kindLabel(kind) {
 
 // src/ReferenceChips.tsx
 import { jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
+function glyphOf(icon) {
+  const text = (icon ?? "").trim();
+  return text !== "" && text.length <= 8 && /[^\u0000-\u007f]/.test(text) ? text : null;
+}
+function nameOf(icon) {
+  const text = (icon ?? "").trim();
+  return /^[A-Za-z][A-Za-z0-9_-]{1,40}$/.test(text) ? text : null;
+}
+function iconOf(pair) {
+  const own3 = glyphOf(pair?.icon) ?? nameOf(pair?.icon);
+  const table = glyphOf(pair?.tableIcon) ?? nameOf(pair?.tableIcon);
+  const chosen = own3 ?? table;
+  return chosen ? { icon: chosen } : {};
+}
 function referencesOf(field2, value, kind, labels) {
   if (kind === "entity_reference") {
     return entityRefsOf2(value).map((r) => ({ token: r.token, id: r.id, label: r.label }));
@@ -5476,15 +5496,45 @@ function referencesOf(field2, value, kind, labels) {
     id,
     label: labels?.(field2, id) ?? null,
     tableId,
+    ...iconOf(labels?.icons?.(field2, id)),
     ...labels?.archived?.(field2, id) ? { archived: true } : {}
   }));
 }
 var ARCHIVED_REFERENCE_WORD = "Archived";
 var ARCHIVED_REFERENCE_TIP = "In the Archived view; restore it to use it again";
+function PageGlyph() {
+  return /* @__PURE__ */ jsxs18("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: 14, height: 14, fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "data-records-page-glyph": "", children: [
+    /* @__PURE__ */ jsx22("path", { d: "M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z" }),
+    /* @__PURE__ */ jsx22("path", { d: "M14 2v4a2 2 0 0 0 2 2h4" }),
+    /* @__PURE__ */ jsx22("path", { d: "M10 13H8" }),
+    /* @__PURE__ */ jsx22("path", { d: "M16 17H8" })
+  ] });
+}
 function ReferenceChip({ reference, waiting }) {
   const host = useRecordsUi();
   const words2 = reference.label ?? (reference.token === "record" ? waiting ?? "Loading\u2026" : WITHHELD_ENTITY_LABEL);
   const drawn = host.renderReference ? host.renderReference({ ...reference, label: reference.label ?? words2 }) : null;
+  const look = useEmbeddedLook();
+  if (look?.plainRelation) {
+    return /* @__PURE__ */ jsxs18(
+      "span",
+      {
+        className: cn15(
+          "inline-flex max-w-full min-w-0 items-center gap-1.5 text-sm text-foreground hover:underline [&_a]:text-inherit [&_a]:no-underline [&_a:hover]:underline",
+          reference.archived && "opacity-70"
+        ),
+        "data-records-reference-chip": reference.token,
+        "data-records-reference-plain": "",
+        "data-records-reference-archived": reference.archived ? "" : void 0,
+        title: reference.archived ? ARCHIVED_REFERENCE_TIP : words2,
+        children: [
+          /* @__PURE__ */ jsx22("span", { "aria-hidden": "true", "data-records-reference-icon": "", className: "inline-flex size-4 shrink-0 items-center justify-center text-muted-foreground", children: glyphOf(reference.icon) ? /* @__PURE__ */ jsx22("span", { className: "text-sm leading-none", children: reference.icon }) : reference.icon && host.renderIcon?.(reference.icon) || /* @__PURE__ */ jsx22(PageGlyph, {}) }),
+          drawn ?? /* @__PURE__ */ jsx22("span", { className: "truncate", children: words2 }),
+          reference.archived ? /* @__PURE__ */ jsx22("span", { className: "shrink-0 text-muted-foreground", children: ARCHIVED_REFERENCE_WORD }) : null
+        ]
+      }
+    );
+  }
   return /* @__PURE__ */ jsxs18(
     Badge4,
     {
@@ -6215,7 +6265,7 @@ function renderValue(field2, value, document2, labels, stillWaitingFor, look) {
           "data-records-choice-chip": "",
           ...chip.tinted ? { "data-records-choice-tint": "" } : {},
           children: [
-            look?.choiceDot ? /* @__PURE__ */ jsx26("span", { "aria-hidden": "true", "data-records-choice-dot": "", className: cn17("mr-1.5 inline-block size-1.5 shrink-0 rounded-full", chip.dot) }) : null,
+            look?.choiceDot ? /* @__PURE__ */ jsx26("span", { "aria-hidden": "true", "data-matrx-pill-ink": "", "data-records-choice-dot": "", className: cn17("mr-1.5 inline-block size-1.5 shrink-0 rounded-full", chip.dot) }) : null,
             statusMark(field2, item, Array.isArray(value) ? void 0 : document2),
             scalarText(field2, item, labels, Array.isArray(value) ? void 0 : stillWaitingFor)
           ]
@@ -6370,7 +6420,7 @@ function RecordValue({
   const shape = shown4 && (shown4.id === "date" || shown4.id === "datetime") && isDateField(field2) ? dateFormatFor(field2, value) : void 0;
   const dated = shape ? { ...shape, ...shown4?.options ? { options: shown4.options } : {} } : void 0;
   const formatted = shown4 ? formatColumnValue({ format: dated ?? shown4 }, value) : null;
-  if (formatted) return /* @__PURE__ */ jsx26(FormattedValue, { value, format: dated ?? shown4 });
+  if (formatted && !(embeddedLook?.blankEmpty && formatted.empty)) return /* @__PURE__ */ jsx26(FormattedValue, { value, format: dated ?? shown4 });
   return /* @__PURE__ */ jsx26(Fragment6, { children: renderValue(field2, value, document2, labels, stillWaitingFor, embeddedLook) });
 }
 var ONE_FIELD_ARRAYS = /* @__PURE__ */ new WeakMap();
@@ -16124,7 +16174,7 @@ function opensOnKey(event) {
   }
   return true;
 }
-function withOpenRecord(columns, onOpen, nameOf, place = "end", hrefOf) {
+function withOpenRecord(columns, onOpen, nameOf2, place = "end", hrefOf) {
   if (!onOpen) return columns;
   return columns.map((column, index) => {
     const original = column.cell;
@@ -16134,8 +16184,8 @@ function withOpenRecord(columns, onOpen, nameOf, place = "end", hrefOf) {
       {
         type: "button",
         "data-records-open-record": row.id,
-        "aria-label": openRecordLabel(nameOf(row)),
-        title: `${openRecordLabel(nameOf(row))} (Space)`,
+        "aria-label": openRecordLabel(nameOf2(row)),
+        title: `${openRecordLabel(nameOf2(row))} (Space)`,
         className: "shrink-0 rounded px-1 text-xs leading-5 text-muted-foreground opacity-40 hover:bg-muted hover:text-foreground focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring group-hover/matrx-row:opacity-100",
         onClick: (event) => {
           event.stopPropagation();
@@ -22288,7 +22338,7 @@ function GridBody({
     [storePaged, query, queryTotal, classicInCard, records.data?.total]
   );
   const showAddLine = mayAddRow && rows.length > 0;
-  const showSummaryLine = rows.length > 0 && (!merged || Object.keys(chosenSummaries).length > 0);
+  const showSummaryLine = rows.length > 0 && (embedded ? Object.keys(chosenSummaries).length > 0 : !merged || Object.keys(chosenSummaries).length > 0);
   const footerFace = JSON.stringify([
     showAddLine ? added.busy : null,
     showSummaryLine ? [chosenSummaries, summaries.values, summaries.rowCount, summaries.loading] : null
@@ -22471,7 +22521,7 @@ function GridBody({
           mode: phone ? "sheet" : toolbarFold2 >= 3 ? "menu" : "inline",
           pinned: /* @__PURE__ */ jsxs61(Fragment23, { children: [
             /* @__PURE__ */ jsx68(UndoRedoLive, { source: undoSource }),
-            !readOnly && rights.write ? /* @__PURE__ */ jsx68(
+            !embedded && !readOnly && rights.write ? /* @__PURE__ */ jsx68(
               NewFromTemplateMenu,
               {
                 tableId,
@@ -22483,7 +22533,8 @@ function GridBody({
           // NEW RECORD NEVER LEAVES THE ROW (live walk 2026-10-05: at 1440 px with the
           // side chat open it and "From template" both vanished behind the "…"). When the
           // row is short, "From template", undo and the rest ride the "…"; this stays.
-          ...!readOnly && rights.write ? {
+          // EMBEDDED: the "+ New page" line under the table is the create action.
+          ...!embedded && !readOnly && rights.write ? {
             primary: /* @__PURE__ */ jsx68(
               NewRecordControl,
               {
@@ -22548,7 +22599,7 @@ function GridBody({
         // 2026-09-28: with the Forms rail open "New record" read "New reco", faded
         // under the slot's edge). Pinned, it sticks to the row's right edge and what
         // scrolls passes under it — the merged grid's rule, not a second one.
-        ...!readOnly && rights.write ? {
+        ...!embedded && !readOnly && rights.write ? {
           overflow: {
             mode: "inline",
             pinned: /* @__PURE__ */ jsx68(Button42, { size: "sm", className: "shrink-0", disabled: editingBusy, onClick: () => void addRecord(), children: editingBusy ? "Adding\u2026" : "New record" })
@@ -22799,7 +22850,8 @@ function GridBody({
                   tableClassName: cn34(
                     !look.wrap && "[&_tbody_td]:max-w-[28rem] [&_tbody_td]:overflow-hidden [&_tbody_td]:text-ellipsis [&_tbody_td]:whitespace-nowrap! [&_tbody_td_*]:whitespace-nowrap!",
                     look.fit === "scroll" && "sm:[&>table]:w-max! sm:[&>table]:max-w-none! sm:[&>table]:min-w-full!",
-                    embedded && EMBEDDED_TABLE_CLASS
+                    embedded && EMBEDDED_TABLE_CLASS,
+                    embedded && !showSummaryLine && EMBEDDED_PLAIN_FOOTER_CLASS
                   ),
                   footerRows,
                   ...embedded ? { copy: false } : copyConfig ? { copy: copyConfig } : {},
@@ -31396,7 +31448,11 @@ function ViewSwitcher({
               onUseSort: (sort) => change({ sorts: [sort], order: "sorted" })
             } : {}
           }
-        } : {}
+        } : (view.sorts?.length ?? 0) > 0 || local.sorts ? (
+          /* A VIEW THE HOST HOLDS INLINE (Spaces) has no saved id but still has its sort: the
+             grid opens in it, never in the table's own order. */
+          { viewOrder: { viewId: null, order: null, sorts: local.sorts ?? view.sorts ?? [] } }
+        ) : {}
       }
     ) : /* @__PURE__ */ jsx105(
       Board,
@@ -45796,22 +45852,22 @@ function RailFrame({
   return /* @__PURE__ */ jsx152("aside", { "data-rail-column": "", className: "w-[26rem] shrink-0 overflow-y-auto rounded-md border p-3", children });
 }
 function filterInWords(filter, fields) {
-  const nameOf = (key) => {
+  const nameOf2 = (key) => {
     const field2 = fields.find((f) => f.key === key);
     return field2 ? fieldName(field2) : humanizeIdentifier17(key);
   };
   const parts = Object.keys(filter).map((key) => {
     const value = filter[key];
-    if (value === null || value === void 0) return `${nameOf(key)} is not filled in`;
+    if (value === null || value === void 0) return `${nameOf2(key)} is not filled in`;
     if (typeof value === "object") {
       const from = (value.from ?? "").toString().trim();
       const to = (value.to ?? "").toString().trim();
-      if (from !== "" && to !== "") return `${nameOf(key)} from ${from} up to ${to}`;
-      if (from !== "") return `${nameOf(key)} from ${from} onwards`;
-      if (to !== "") return `${nameOf(key)} up to ${to}`;
-      return `${nameOf(key)} in a period nobody named`;
+      if (from !== "" && to !== "") return `${nameOf2(key)} from ${from} up to ${to}`;
+      if (from !== "") return `${nameOf2(key)} from ${from} onwards`;
+      if (to !== "") return `${nameOf2(key)} up to ${to}`;
+      return `${nameOf2(key)} in a period nobody named`;
     }
-    return `${nameOf(key)} is ${String(value)}`;
+    return `${nameOf2(key)} is ${String(value)}`;
   });
   if (parts.length === 0) return "";
   if (parts.length === 1) return parts[0];