@ai-matrx/records-ui 0.101.2 → 0.101.8

package/CHANGELOG.md

@@ -1,5 +1,41 @@
 # Changelog — @ai-matrx/records-ui
 
+## 0.101.8
+
+Automatic changed-only republish (docs/metadata drift since the last tag — see
+`git diff npm/records-ui/v0.101.7..npm/records-ui/v0.101.8 -- apps/shared/records-ui`).
+No source changes intended and no consumer action required.
+
+## 0.101.7
+
+Automatic changed-only republish (docs/metadata drift since the last tag — see
+`git diff npm/records-ui/v0.101.2..npm/records-ui/v0.101.7 -- apps/shared/records-ui`).
+No source changes intended and no consumer action required.
+
+## 0.101.6
+
+Automatic changed-only republish (docs/metadata drift since the last tag — see
+`git diff npm/records-ui/v0.101.2..npm/records-ui/v0.101.6 -- apps/shared/records-ui`).
+No source changes intended and no consumer action required.
+
+## 0.101.5
+
+Automatic changed-only republish (docs/metadata drift since the last tag — see
+`git diff npm/records-ui/v0.101.2..npm/records-ui/v0.101.5 -- apps/shared/records-ui`).
+No source changes intended and no consumer action required.
+
+## 0.101.4
+
+Automatic changed-only republish (docs/metadata drift since the last tag — see
+`git diff npm/records-ui/v0.101.2..npm/records-ui/v0.101.4 -- apps/shared/records-ui`).
+No source changes intended and no consumer action required.
+
+## 0.101.3
+
+Automatic changed-only republish (docs/metadata drift since the last tag — see
+`git diff npm/records-ui/v0.101.2..npm/records-ui/v0.101.3 -- apps/shared/records-ui`).
+No source changes intended and no consumer action required.
+
 ## 0.101.2
 
 `TablesHome`: "Start from a template" (`templatesHref`) also shows while a new table is being named, so a

package/dist/index.cjs

@@ -269,6 +269,7 @@ __export(src_exports, {
   TableSettings: () => TableSettings,
   TableToolbarSlotContext: () => TableToolbarSlotContext,
   TablesHome: () => TablesHome,
+  TemplatePreview: () => TemplatePreview,
   TimelineView: () => TimelineView,
   UNREAD_RECORD_LABEL: () => UNREAD_RECORD_LABEL,
   VIEW_ADDRESS_KEYS: () => VIEW_ADDRESS_KEYS,
@@ -550,6 +551,7 @@ __export(src_exports, {
   useTableRights: () => useTableRights,
   useTableToolbarSlot: () => useTableToolbarSlot,
   useTablesAnywhere: () => useTablesAnywhere,
+  useTemplatePreview: () => useTemplatePreview,
   useViewRecords: () => useViewRecords,
   useWhoChanged: () => useWhoChanged,
   viewActions: () => viewActions,
@@ -676,8 +678,16 @@ function RecordsUiProvider({ value, children }) {
 function useRecordsUi() {
   return (0, import_react.useContext)(HostContext) ?? {};
 }
+function quiet(may, say2) {
+  if (say2 !== false) return may;
+  return { ...may, why: () => "", ..."reason" in may ? { reason: "" } : {} };
+}
 function useTableRights(table) {
   const host = useRecordsUi();
+  const asked3 = useTableRightsAsked(table, host);
+  return (0, import_react.useMemo)(() => quiet(asked3, host.sayLevelNeeded), [asked3, host.sayLevelNeeded]);
+}
+function useTableRightsAsked(table, host) {
   const bound = Boolean(host.rights);
   const asked3 = (0, import_react2.useMyLevel)(bound || !table ? null : table.id);
   return (0, import_react.useMemo)(() => {
@@ -690,22 +700,24 @@ function useTableRights(table) {
 }
 function useRecordRights(recordId) {
   const asked3 = (0, import_react2.useMyLevel)(recordId);
+  const say2 = useRecordsUi().sayLevelNeeded;
   return (0, import_react.useMemo)(() => {
     if (!recordId) return NOT_ANSWERED_YET;
     if (asked3.loading) return NOT_ANSWERED_YET;
-    if (asked3.error) return whatYouMayDo(null, true);
-    return whatYouMayDo(asked3.data, true);
-  }, [recordId, asked3.loading, asked3.error, asked3.data]);
+    if (asked3.error) return quiet(whatYouMayDo(null, true), say2);
+    return quiet(whatYouMayDo(asked3.data, true), say2);
+  }, [recordId, asked3.loading, asked3.error, asked3.data, say2]);
 }
 function useRowRights(rowIds, enabled) {
   const asked3 = (0, import_react2.useMyLevels)(enabled ? rowIds : []);
+  const say2 = useRecordsUi().sayLevelNeeded;
   return (0, import_react.useMemo)(() => {
     if (!enabled) return () => null;
     if (asked3.loading) return () => NOT_ANSWERED_YET;
-    if (asked3.error) return () => whatYouMayDo(null, true);
+    if (asked3.error) return () => quiet(whatYouMayDo(null, true), say2);
     const held = asked3.data ?? {};
-    return (rowId) => whatYouMayDo(held[rowId] ?? null, true);
-  }, [enabled, asked3.loading, asked3.error, asked3.data]);
+    return (rowId) => quiet(whatYouMayDo(held[rowId] ?? null, true), say2);
+  }, [enabled, asked3.loading, asked3.error, asked3.data, say2]);
 }
 
 // src/plainWords.ts
@@ -26572,7 +26584,7 @@ function Peek({ tableId, recordId, onClose, className, onPage = false }) {
       ) : host.chat && !askOpenBelow ? /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(import_design_system80.Button, { size: "sm", variant: talking ? "ghost" : "outline", onClick: () => setTalking((t) => !t), children: talking ? "Close chat" : "Talk to this record" }) : null,
       organizationId ? /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(ShareControl, { kind: "record", organizationId, subjectId: recordId, name: title, may: may.share }) : null,
       /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(RowShownTo, { recordId }),
-      may.write ? /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(import_design_system80.Button, { size: "sm", variant: editing ? "ghost" : "outline", onClick: () => setEditing((e) => !e), children: editing ? "Stop editing" : "Edit" }) : may.known ? (
+      may.write ? /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(import_design_system80.Button, { size: "sm", variant: editing ? "ghost" : "outline", onClick: () => setEditing((e) => !e), children: editing ? "Stop editing" : "Edit" }) : may.known && may.why("write") ? (
         // Absent AND explained: no Edit button, and one sentence saying what
         // it would take and who can give it.
         /* @__PURE__ */ (0, import_jsx_runtime90.jsx)("span", { className: "max-w-[18rem] text-[11px] text-muted-foreground", children: may.why("write") })
@@ -35965,7 +35977,7 @@ function DigestScheduler({
   const [channel, setChannel] = (0, import_react197.useState)(
     existing?.channel === "email" || existing?.channel === "sms" ? existing.channel : "in_app"
   );
-  const [quiet, setQuiet] = (0, import_react197.useState)((0, import_records50.hasQuietHours)(existing?.quiet_hours));
+  const [quiet2, setQuiet] = (0, import_react197.useState)((0, import_records50.hasQuietHours)(existing?.quiet_hours));
   const [quietFrom, setQuietFrom] = (0, import_react197.useState)(existing?.quiet_hours?.start ?? "22:00");
   const [quietTo, setQuietTo] = (0, import_react197.useState)(existing?.quiet_hours?.end ?? "07:00");
   const [recipients, setRecipients] = (0, import_react197.useState)(
@@ -36003,8 +36015,8 @@ function DigestScheduler({
     return null;
   }, [cadence, weekday, time]);
   const quietHours = (0, import_react197.useMemo)(
-    () => quiet ? { start: quietFrom, end: quietTo, tz: timezone } : { tz: timezone },
-    [quiet, quietFrom, quietTo, timezone]
+    () => quiet2 ? { start: quietFrom, end: quietTo, tz: timezone } : { tz: timezone },
+    [quiet2, quietFrom, quietTo, timezone]
   );
   const fallbackName = `${CADENCE_TITLE[cadence] ?? "Weekly"} ${tableName2 ?? "records"} summary`;
   async function scheduleIt() {
@@ -36172,10 +36184,10 @@ function DigestScheduler({
       ] })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("label", { className: "flex items-center gap-1.5 text-xs", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_design_system104.Checkbox, { checked: quiet, onCheckedChange: (on) => setQuiet(Boolean(on)) }),
+      /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(import_design_system104.Checkbox, { checked: quiet2, onCheckedChange: (on) => setQuiet(Boolean(on)) }),
       "Not between certain hours"
     ] }),
-    quiet ? /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("div", { className: "flex items-center gap-2", children: [
+    quiet2 ? /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("div", { className: "flex items-center gap-2", children: [
       /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
         import_design_system104.BasicInput,
         {
@@ -37209,7 +37221,7 @@ function NotifyRuleEditor({ tableId, seed, chosenRuleId, onChoose, className })
       await load();
     })();
   }, [subscriptions, seed, write, load]);
-  async function subscribe(viewId, viewName, cadence, channel, schedule, quiet) {
+  async function subscribe(viewId, viewName, cadence, channel, schedule, quiet2) {
     setBusy(true);
     const ok = await write({
       name: `${viewName} \u2014 ${CADENCE_WORDS2[cadence] ?? cadence}`,
@@ -37217,7 +37229,7 @@ function NotifyRuleEditor({ tableId, seed, chosenRuleId, onChoose, className })
       cadence,
       channel,
       schedule: schedule.trim() === "" ? null : schedule.trim(),
-      quietHours: quiet
+      quietHours: quiet2
     });
     setBusy(false);
     if (!ok) return;
@@ -37334,8 +37346,8 @@ function NotifyRuleEditor({ tableId, seed, chosenRuleId, onChoose, className })
           const start = form.elements.namedItem("quiet_start").value;
           const end = form.elements.namedItem("quiet_end").value;
           const name = views.find((v) => v.id === view)?.name ?? "View";
-          const quiet = start && end ? { start, end, tz: Intl.DateTimeFormat().resolvedOptions().timeZone } : null;
-          if (view) void subscribe(view, name, cadence, channel, schedule, quiet);
+          const quiet2 = start && end ? { start, end, tz: Intl.DateTimeFormat().resolvedOptions().timeZone } : null;
+          if (view) void subscribe(view, name, cadence, channel, schedule, quiet2);
         },
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("select", { name: "view", "aria-label": "View to be told about", className: "h-7 rounded border bg-background px-1 text-xs", children: views.map((view) => /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("option", { value: view.id, children: view.name }, view.id)) }),
@@ -46054,4 +46066,88 @@ function Decision({ approvalId, onDecided }) {
     error ? /* @__PURE__ */ (0, import_jsx_runtime151.jsx)(RefusalLine, { error }) : null
   ] });
 }
+
+// src/TemplatePreview.tsx
+var import_react263 = require("react");
+var import_memory = require("@ai-matrx/records/memory");
+var import_react264 = require("@ai-matrx/records/react");
+var import_jsx_runtime152 = require("react/jsx-runtime");
+function useTemplatePreview(spec, today) {
+  return (0, import_react263.useMemo)(() => (0, import_memory.templatePreview)(spec, today ? { today } : {}), [spec, today]);
+}
+function TemplatePreview({ spec, today, initialTable, host, aside, booking, className }) {
+  const preview = useTemplatePreview(spec, today);
+  const bound = (0, import_react263.useMemo)(() => ({ ...host, sayLevelNeeded: false }), [host]);
+  const first = preview.tables.find((t) => t.token === initialTable) ?? preview.tables[0];
+  const [active, setActive] = (0, import_react263.useState)(first?.id ?? null);
+  const table = preview.tables.find((t) => t.id === active) ?? first;
+  if (!table) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("div", { className: ["flex min-w-0 flex-col gap-3", className].filter(Boolean).join(" "), "data-template-preview": preview.tables.length, children: [
+    preview.tables.length > 1 || aside ? /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("div", { className: "flex min-w-0 flex-wrap items-center gap-1.5", role: "tablist", "aria-label": "Tables", children: [
+      preview.tables.map((t) => /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(
+        "button",
+        {
+          type: "button",
+          role: "tab",
+          "aria-selected": t.id === table.id,
+          "data-template-preview-table": t.token,
+          onClick: () => setActive(t.id),
+          className: [
+            "inline-flex h-8 items-center gap-1.5 rounded-md border px-3 text-sm",
+            t.id === table.id ? "border-primary bg-primary/10 text-foreground" : "border-border text-muted-foreground hover:text-foreground"
+          ].join(" "),
+          children: [
+            t.name,
+            /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("span", { className: "text-xs tabular-nums text-muted-foreground", children: t.rows })
+          ]
+        },
+        t.id
+      )),
+      aside ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("div", { className: "ml-auto", children: aside }) : null
+    ] }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(RecordsMount, { config: preview.config, host: bound, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("div", { className: "min-h-[32rem] min-w-0 overflow-hidden rounded-xl border border-border bg-card", children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(TablePage, { tableId: table.id }, table.id) }),
+      /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(PreviewForms, { preview, booking }),
+      preview.dashboards.length ? /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("section", { className: "flex min-w-0 flex-col gap-3", "aria-label": "Dashboards", "data-template-preview-dashboards": preview.dashboards.length, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("h2", { className: "text-lg font-semibold tracking-tight", children: "Dashboards" }),
+        preview.dashboards.map((d) => /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("div", { className: "min-w-0 overflow-hidden rounded-xl border border-border bg-card p-3", "data-template-preview-dashboard": d.token, children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(DashboardCanvas, { tableId: d.tableId, activeDashboardId: d.id }) }, d.id))
+      ] }) : null
+    ] })
+  ] });
+}
+function PreviewForms({ preview, booking }) {
+  const client = (0, import_react264.useRecordsClient)();
+  const [forms, setForms] = (0, import_react263.useState)(null);
+  const [pages, setPages] = (0, import_react263.useState)([]);
+  (0, import_react263.useEffect)(() => {
+    let gone = false;
+    void client.forms().then((answered) => {
+      if (!gone) setForms(answered.ok ? answered.data.map(formFromSummary) : []);
+    });
+    const wanted = booking ? preview.forms.filter((f) => f.booking) : [];
+    void Promise.all(
+      wanted.map(async (f) => {
+        const answered = await preview.config.dataSource.rpc("booking_public", { p_form_id: f.id });
+        return answered.error ? null : { id: f.id, page: answered.data };
+      })
+    ).then((got) => {
+      if (!gone) setPages(got.filter((g) => g !== null));
+    });
+    return () => {
+      gone = true;
+    };
+  }, [client, preview, booking]);
+  if (!forms?.length && !pages.length) return null;
+  return /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("section", { className: "flex min-w-0 flex-col gap-3", "aria-label": "Forms and booking", "data-template-preview-forms": forms?.length ?? 0, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("h2", { className: "text-lg font-semibold tracking-tight", children: "Forms and booking" }),
+    /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("div", { className: "grid min-w-0 gap-4 md:grid-cols-2", children: (forms ?? []).map((f) => /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("div", { className: "min-w-0 rounded-xl border border-border bg-card p-4", "data-template-preview-form": f.slug ?? f.id, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("h3", { className: "mb-3 text-sm font-semibold", children: f.name }),
+      /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(FormRunner, { form: f })
+    ] }, f.id)) }),
+    booking ? pages.map((p) => /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("div", { className: "min-w-0 rounded-xl border border-border bg-card p-4", "data-template-preview-booking": p.id, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("h3", { className: "mb-3 text-sm font-semibold", children: String(p.page["title"] ?? "") }),
+      booking(p.page)
+    ] }, p.id)) : null
+  ] });
+}
 //# sourceMappingURL=index.cjs.map