@antelopejs/dms 0.7.7 → 0.7.9

package/frontend-vue/layers/dms-ui/app/components/blocks/LiveToggleBlock.vue

@@ -0,0 +1,92 @@
+<script setup lang="ts">
+import { computed, onBeforeUnmount, onMounted, ref } from "vue";
+import DmsSegmented from "../segmented/Segmented.vue";
+import { usePageLive } from "../../composables/live/usePageLive";
+import { formatElapsed } from "../../build/composables/live/formatElapsed";
+import { useLiveToggleShortcut } from "../../build/composables/live/useLiveToggleShortcut";
+import type { DefaultComponentProps } from "../../../../dms-core/app/types/component";
+
+interface LiveToggleBlockProps extends DefaultComponentProps {
+  align?: "left" | "center" | "right";
+  /** Shows "updated N s ago". */
+  showUpdatedAt?: boolean;
+}
+
+const props = withDefaults(defineProps<LiveToggleBlockProps>(), {
+  align: "right",
+  showUpdatedAt: true,
+});
+
+const DIRECT = "direct";
+const PAUSE = "pause";
+const TICK_MS = 1000;
+const ALIGN_CLASSES: Record<
+  NonNullable<LiveToggleBlockProps["align"]>,
+  string
+> = {
+  left: "justify-start",
+  center: "justify-center",
+  right: "justify-end",
+};
+
+const { t } = useI18n();
+const live = usePageLive();
+
+// The state lives in the browser (its storage, its clock): the server and the
+// hydrating render draw nothing, the mounted block draws the real state.
+const isMounted = ref(false);
+const now = ref(Date.now());
+let ticker: ReturnType<typeof setInterval> | undefined;
+
+onMounted(() => {
+  isMounted.value = true;
+  if (props.showUpdatedAt) {
+    ticker = setInterval(() => (now.value = Date.now()), TICK_MS);
+  }
+});
+onBeforeUnmount(() => clearInterval(ticker));
+
+const mode = computed({
+  get: () => (live.isPaused.value ? PAUSE : DIRECT),
+  set: (next: string | number) => {
+    if (next === PAUSE) live.pause();
+    else live.resume();
+  },
+});
+
+const items = computed(() => [
+  { value: DIRECT, label: t("dms.live.direct"), icon: "i-ph-broadcast" },
+  { value: PAUSE, label: t("dms.live.pause"), icon: "i-ph-pause" },
+]);
+
+const updatedLabel = computed(() => {
+  const at = live.lastUpdatedAt.value;
+  if (at === null) return "";
+  const { unit, count } = formatElapsed(now.value - at);
+  return t(`dms.live.updated_${unit}`, { count }, count);
+});
+
+useLiveToggleShortcut(() => live.toggle());
+</script>
+
+<template>
+  <div
+    v-if="isMounted && live.isEnabled.value"
+    class="dms-live-toggle flex flex-wrap items-center gap-2.5"
+    :class="ALIGN_CLASSES[align]"
+  >
+    <span
+      v-if="showUpdatedAt"
+      class="text-muted text-[12.5px] tabular-nums"
+      aria-live="off"
+    >
+      {{ updatedLabel }}
+    </span>
+    <DmsSegmented
+      v-model="mode"
+      :items="items"
+      :aria-label="t('dms.live.aria_label')"
+      size="sm"
+    />
+  </div>
+</template>

package/frontend-vue/layers/dms-ui/app/components/field-row/FieldRow.vue

@@ -107,15 +107,24 @@ const theme = tv({
     disabled: {
       true: { root: "opacity-55" },
     },
+    // Without a label cell, the control is the grid's only child: it spans
+    // both columns instead of falling into the form's 240px label column.
+    labeled: {
+      false: { control: "col-span-full" },
+    },
   },
 });
 
+const hasText = computed(
+  () => !!(props.label || props.description || slots.label || slots.details),
+);
 const ui = computed(() =>
   theme({
     layout: props.layout,
     inset: props.inset,
     spacing: props.spacing,
     disabled: props.disabled,
+    labeled: hasText.value,
   }),
 );
 const labelTag = computed(() => (props.labelFor ? "label" : "div"));
@@ -127,10 +136,7 @@ const { processI18n } = useTranslation();
 <template>
   <div :class="ui.root()">
     <div :class="ui.body()">
-      <div
-        v-if="props.label || props.description || slots.label || slots.details"
-        :class="ui.text()"
-      >
+      <div v-if="hasText" :class="ui.text()">
         <component
           :is="labelTag"
           v-if="props.label || slots.label"

package/frontend-vue/layers/dms-ui/app/components/period/PeriodSelector.vue

@@ -12,6 +12,7 @@ import type {
 } from "#dms-core/app/composables/period/types";
 import type { DefaultComponentProps } from "../../../../dms-core/app/types/component";
 import { usePeriodDraft } from "../../build/composables/period/usePeriodDraft";
+import { usePeriodLocation } from "../../build/composables/period/usePeriodLocation";
 import {
   type CalendarRange,
   calendarToRange,
@@ -21,6 +22,7 @@ import {
 } from "../../build/composables/period/periodDisplay";
 import PeriodRangeCalendar from "../../build/components/period/PeriodRangeCalendar.vue";
 import { useUserRegionalPreferences } from "#dms-core/app/composables/user/useUserRegionalPreferences";
+import { usePageLive } from "../../composables/live/usePageLive";
 
 interface Props extends DefaultComponentProps {
   id: string;
@@ -93,11 +95,28 @@ useWatch(props.watchActions || [], props.componentId);
 
 const { t, locale } = useI18n();
 
+// A paused live page keeps its period where it was: a relative preset
+// sliding every minute would refetch every block reading it.
+const { isPaused: isPagePaused } = usePageLive();
 const period = usePeriod({
   defaultPreset: props.defaultPreset,
   defaultComparison: props.defaultComparison,
   presets: props.presets,
   comparisons: props.comparisons,
+  holdClock: () => isPagePaused.value,
+});
+
+// Before the scope registers, so the cards' first request already carries
+// the period of the URL (or of the user's last choice), never the default.
+usePeriodLocation(period, {
+  id: props.id,
+  pageId: props.pageId,
+  fallback: {
+    preset: period.preset.value,
+    comparison: period.comparison.value,
+    customRange: null,
+    customCompareRange: null,
+  },
 });
 
 const cleanup = registerPeriodScope(props.id, period.state);

package/frontend-vue/layers/dms-ui/app/components/table-view/TableView.vue

@@ -8,7 +8,12 @@ import type {
   Table,
   VisibilityState,
 } from "@tanstack/vue-table";
-import { refDebounced, useActiveElement, watchDebounced } from "@vueuse/core";
+import {
+  refDebounced,
+  until,
+  useActiveElement,
+  watchDebounced,
+} from "@vueuse/core";
 import {
   QUICK_ACTION_BUTTON_KEY,
   QUICK_ACTION_COMPONENT_KEY,
@@ -71,7 +76,15 @@ import {
 import { selectedRowIds } from "../../build/composables/table-view/utils/bulkActions";
 import { isBulkAction } from "../../build/composables/actions/bulkSelection";
 import { selectionScopeKey } from "../../build/utils/selectionScope";
-import { readRecordId } from "../../build/composables/table-view/utils/recordLink";
+import {
+  isDeepLinkAction,
+  readRecordId,
+  resolveDeepLinkedRow,
+} from "../../build/composables/table-view/utils/recordLink";
+import {
+  rowSidePanelOwnerKey,
+  useRowSidePanelContent,
+} from "#dms-layout/app/build/composables/layout/rowSidePanel";
 import type { CustomRowAction } from "../../types/row-action";
 import {
   type QuickFilterItem,
@@ -82,7 +95,10 @@ import {
   staticQuickFilterItems,
 } from "../../build/composables/table-view/utils/quickFilters";
 import { useNavBadges } from "../../build/composables/navigation/useNavBadges";
-import { resolveRowClickAction } from "../../utils/rowClickAction";
+import {
+  resolveRowClickAction,
+  rowCustomActions,
+} from "../../utils/rowClickAction";
 import { usePermissionPreview } from "#dms-core/app/build/composables/auth/usePermissionPreview";
 
 import UTable from "../../build/components/table/Table.vue";
@@ -110,6 +126,9 @@ import { useAccumulatedPages } from "../../build/composables/table-view/useAccum
 import { usePersistedPagination } from "../../build/composables/table-view/usePersistedPagination";
 import { useTableRows } from "../../build/composables/table-view/useTableRows";
 import { useRefreshTriggers } from "../../build/composables/blocks/useRefreshTriggers";
+import { useTableLiveHold } from "../../build/composables/table-view/useTableLiveHold";
+import { usePageLive } from "../../composables/live/usePageLive";
+import LiveHoldBanner from "../../build/components/table-view/LiveHoldBanner.vue";
 import { useTableReorder } from "../../build/composables/table-view/useTableReorder";
 import {
   groupedOptionsFor,
@@ -179,6 +198,8 @@ interface TableViewProps<T extends Data> extends TableViewConfig<T> {
   isSoleTableView?: boolean;
   /** Topics whose events make the table read its rows again. */
   realtimeTopic?: string | string[];
+  /** Keeps the rows while the live page is paused (backend `liveHold`). */
+  liveHold?: boolean;
 }
 
 const props = defineProps<TableViewProps<T>>();
@@ -801,6 +822,14 @@ const archiveQuery = computed(() =>
   archiveMode ? { showArchived: showArchived.value } : {},
 );
 
+// The gate is set up with the other refresh triggers below; the hold only
+// reads it once the table is on screen.
+const liveHold = useTableLiveHold({
+  isEnabled: !!props.liveHold,
+  isSource: tableRows.isSource,
+  gate: () => liveGate,
+});
+
 const { data, status, error, refresh } = await useTableListData<T>({
   componentId,
   pageId,
@@ -808,6 +837,7 @@ const { data, status, error, refresh } = await useTableListData<T>({
   query: queryRequest,
   archiveQuery,
   isSelfManaged: isActiveDisplaySelfManaged,
+  heldQuery: liveHold.heldQuery,
 });
 
 // Nothing listed yet (a client navigation paints before the first page
@@ -949,6 +979,7 @@ const { data: tabCountsData, refresh: refreshTabCounts } =
     rows: tableRows,
     queries: tabCountsQuery,
     archiveQuery,
+    heldQuery: liveHold.heldQuery,
   });
 
 const viewItems = computed<TableViewItem[]>(() =>
@@ -1125,8 +1156,19 @@ const refreshAll = async () => {
 
 // The rows can move without the table seeing it (a batch, a job, another
 // block's action): a topic of the backend or a page refresh reads them again,
-// keeping the current rows on screen until the answer lands.
-useRefreshTriggers(props.realtimeTopic, () => void refreshAll());
+// keeping the current rows on screen until the answer lands. On a live page
+// the row events below go through the same gate.
+const liveGate = useRefreshTriggers(
+  props.realtimeTopic,
+  () => void refreshAll(),
+);
+// What the user asks for (a row action, the refresh button, ⌘R, a display's
+// own action) reads at once, even while the live page is paused, and brings
+// a held table up to date.
+const refreshByUser = () => {
+  liveGate.acknowledge();
+  return refreshAll();
+};
 
 // "Preview as role": a link tab to a page the previewed role could not open
 // is drawn locked, one to a page it opens partially is drawn partially
@@ -1203,7 +1245,7 @@ const {
   caption,
   labelKey,
   rowIdKey: props.rowIdKey,
-  refreshCallback: refreshAll,
+  refreshCallback: refreshByUser,
   formComponents,
   formContainer,
   formPages,
@@ -1395,12 +1437,28 @@ const realtimeEventHandlers: Record<
   },
 };
 
+// On a live page a row event is one more event behind the table: in Direct
+// it reads the rows again (at most once per `maxRate`), paused it is counted
+// and the rows stay as they are. Rows gone elsewhere still leave a selection
+// the page shows moving.
+const { isEnabled: isPageLive, isPaused: isPagePaused } = usePageLive();
+const gateRowEvent = (type: string, ids: string[], event: object) => {
+  if (type === REALTIME_EVENT_TYPE.DELETED && !isPagePaused.value) {
+    deselectRows(ids);
+  }
+  liveGate.trigger(event);
+};
+
 useRealtimeTopic(realtimeRowTopic, (event) => {
   const payload = event as { type: string; payload?: { ids?: string[] } };
   const handler = realtimeEventHandlers[payload.type];
   if (!handler) return;
   const ids = payload.payload?.ids ?? [];
   if (ids.length === 0 && payload.type !== REALTIME_EVENT_TYPE.CREATED) return;
+  if (isPageLive.value) {
+    gateRowEvent(payload.type, ids, event);
+    return;
+  }
   void handler(ids);
 });
 
@@ -1599,20 +1657,36 @@ watch(rowSelect, (selection) => {
   if (Object.keys(selection).length === 0) allMatching.value = false;
 });
 
-// A deep-linked action reopens on the row the URL names, listed or not.
+// A deep-linked action reopens on the row the URL names, listed or not. A
+// list still loading is waited for first: a row it lists keeps its position
+// among the rows shown, and a source table without `fetchRowUrl` has no
+// route to read one row from.
 const deepLinkAction = (tableProps.value.rowActions?.custom ?? []).find(
-  (action) => action.deepLink,
+  isDeepLinkAction,
 );
 const openRecordFromUrl = async () => {
   const id = deepLinkAction ? readRecordId(route.query, urlScope) : undefined;
   if (!deepLinkAction || !id) return;
-  const listed = shownResults.value?.find((row) => getRowId(row) === id);
-  const row = listed ?? (await tableRows.getRow(id).catch(() => undefined));
+  await until(isListLoading).toBe(false);
+  const row = await resolveDeepLinkedRow(id, {
+    listed: shownResults.value ?? undefined,
+    idOf: getRowId,
+    getRow: tableRows.getRow,
+  });
   if (row) handleCustomRowAction(deepLinkAction, row as Data);
 };
 
 const selectedIds = computed(() => selectedRowIds(rowSelect.value));
 
+// The row a side panel has open, which the grid highlights.
+const rowSidePanel = useRowSidePanelContent();
+const rowSidePanelOwner = rowSidePanelOwnerKey(pageId!, componentId!);
+const openRowId = computed(() =>
+  rowSidePanel.value?.ownerKey === rowSidePanelOwner
+    ? rowSidePanel.value.rowKey
+    : undefined,
+);
+
 const isRowActionEnabled = (
   config: boolean | RowActionConfig | undefined,
   item: T,
@@ -1707,6 +1781,11 @@ const displayRowActions = {
     isRowActionEnabled(tableProps.value.rowActions?.edit, item),
   canDeleteRow: (item: T) =>
     isRowActionEnabled(tableProps.value.rowActions?.delete, item),
+  customFor: (item: T) =>
+    rowCustomActions(
+      tableProps.value.rowActions?.custom,
+      item as Record<string, unknown>,
+    ),
 };
 
 // The TanStack instance is only available as a #body slot prop; captured here so
@@ -1746,7 +1825,7 @@ const displayContext = computed(
     componentId,
     pageId,
     options: optionsForDisplay(activeDisplayId.value),
-    refresh: refreshAll,
+    refresh: refreshByUser,
     reorder: reorderState.value,
     table: displayTable.value,
   }),
@@ -1833,7 +1912,7 @@ onBeforeUnmount(() => unregisterQuickActionTarget?.());
 
 defineShortcuts(
   buildTableViewShortcuts({
-    refresh: refreshAll,
+    refresh: refreshByUser,
     tableProps,
     newRow: () => newRow(queryParamDefaults.value),
     globalFilter,
@@ -2004,8 +2083,9 @@ onMounted(() => {
     :bulk-actions="bulkCustomActions"
     v-model:all-matching="allMatching"
     :presence-by-row="presenceByRowFiltered"
+    :open-row-id="openRowId"
     @add="handleRowAdd"
-    @refresh="refreshAll"
+    @refresh="refreshByUser"
     @details="handleRowClick"
     @delete="(e) => deleteRows(e)"
     @archive="(e) => archiveRows(e)"
@@ -2016,6 +2096,12 @@ onMounted(() => {
     @duplicate="handleRowDuplicate"
     @edit="handleRowEdit"
   >
+    <template v-if="liveHold.newCount.value > 0" #notice>
+      <LiveHoldBanner
+        :count="liveHold.newCount.value"
+        @show="liveHold.showNew"
+      />
+    </template>
     <template v-if="hasViews" #views>
       <TableViews
         :items="viewItems"

package/frontend-vue/layers/dms-ui/app/composables/live/usePageLive.ts

@@ -0,0 +1,52 @@
+import { computed, type ComputedRef } from "vue";
+import { currentPageLive } from "../../build/composables/live/currentPageLive";
+
+/** The Direct / Pause state of the page on screen, for a module's component. */
+export interface PageLiveState {
+  /** The page declares `live`: it has a Direct / Pause state at all. */
+  isEnabled: ComputedRef<boolean>;
+  /** The page's data follows its events: Direct, or a page without `live`. */
+  isLive: ComputedRef<boolean>;
+  /** The page is paused: its blocks request nothing on their events. */
+  isPaused: ComputedRef<boolean>;
+  pause: () => void;
+  /** Leaves the pause: each block that missed an event refetches once. */
+  resume: () => void;
+  toggle: () => void;
+  /** When the page last read its data (ms since the epoch), `null` without `live`. */
+  lastUpdatedAt: ComputedRef<number | null>;
+  /** Distinct events the page received since the pause. */
+  missedCount: ComputedRef<number>;
+}
+
+/**
+ * Follows the Direct / Pause state of the page on screen (see the page option
+ * `live` and the `LiveToggle()` block), so a custom block stays in step with
+ * the built-in ones without reading the DOM: stop a client-side ticker while
+ * paused, show what was missed, offer its own switch.
+ *
+ * On a page without `live`, or while server-rendering, `isEnabled` is false,
+ * the page reads as live and never paused, and `pause` / `resume` do nothing.
+ *
+ * ```ts
+ * const { isPaused, missedCount, resume } = usePageLive();
+ * ```
+ *
+ * A component that refetches on its own realtime topic need not use it:
+ * built-in blocks with a `realtimeTopic` already follow the state.
+ */
+export function usePageLive(): PageLiveState {
+  const isPaused = computed(() => currentPageLive()?.isPaused.value ?? false);
+  return {
+    isEnabled: computed(() => currentPageLive() !== null),
+    isLive: computed(() => !isPaused.value),
+    isPaused,
+    pause: () => currentPageLive()?.pause(),
+    resume: () => currentPageLive()?.resume(),
+    toggle: () => currentPageLive()?.toggle(),
+    lastUpdatedAt: computed(
+      () => currentPageLive()?.lastUpdatedAt.value ?? null,
+    ),
+    missedCount: computed(() => currentPageLive()?.missedCount.value ?? 0),
+  };
+}

package/frontend-vue/layers/dms-ui/app/composables/table-view/shortcuts/index.ts

@@ -23,6 +23,11 @@ import {
 } from "./tableViewShiftA";
 import { TABLE_VIEW_DELETE_METADATA } from "./tableViewDelete";
 import { TABLE_VIEW_SHIFT_F_METADATA } from "./tableViewShiftF";
+import {
+  TABLE_VIEW_J_METADATA,
+  TABLE_VIEW_K_METADATA,
+  TABLE_VIEW_PANEL_ESCAPE_METADATA,
+} from "./tableViewRowPanel";
 
 export const TABLE_VIEW_SHORTCUTS_METADATA = [
   TABLE_VIEW_META_R_METADATA,
@@ -31,6 +36,9 @@ export const TABLE_VIEW_SHORTCUTS_METADATA = [
   TABLE_VIEW_SHIFT_A_METADATA,
   TABLE_VIEW_DELETE_METADATA,
   TABLE_VIEW_SHIFT_F_METADATA,
+  TABLE_VIEW_J_METADATA,
+  TABLE_VIEW_K_METADATA,
+  TABLE_VIEW_PANEL_ESCAPE_METADATA,
 ];
 
 interface BuildTableViewShortcutsParams<T extends Data> {

package/frontend-vue/layers/dms-ui/app/composables/table-view/shortcuts/tableViewRowPanel.ts

@@ -0,0 +1,30 @@
+// The keys of a row opened from the table (see `listenRowSteps` and
+// `listenRowPanelClose`): listed in the shortcuts help, handled by the panel,
+// drawer or modal while it is open.
+
+const ROW_OPEN_CONDITION = {
+  descriptionKey: "$dms.shortcuts.tableview.row_open.condition",
+};
+
+export const TABLE_VIEW_J_METADATA: ShortcutMetadata = {
+  key: ["j"],
+  descriptionKey: "$dms.shortcuts.tableview.j.description",
+  component: "$dms.components.tableview",
+  condition: ROW_OPEN_CONDITION,
+};
+
+export const TABLE_VIEW_K_METADATA: ShortcutMetadata = {
+  key: ["k"],
+  descriptionKey: "$dms.shortcuts.tableview.k.description",
+  component: "$dms.components.tableview",
+  condition: ROW_OPEN_CONDITION,
+};
+
+export const TABLE_VIEW_PANEL_ESCAPE_METADATA: ShortcutMetadata = {
+  key: ["$keyboard.escape"],
+  descriptionKey: "$dms.shortcuts.tableview.panel_escape.description",
+  component: "$dms.components.tableview",
+  condition: {
+    descriptionKey: "$dms.shortcuts.tableview.panel_escape.condition",
+  },
+};

package/frontend-vue/layers/dms-ui/app/composables/table-view/types/action-target.ts

@@ -1,5 +1,18 @@
 import type { DrawerDirection } from "../../containers/types";
 
+/** What a `sidePanel` target sets besides its component (backend `SidePanelTargetOptions`). */
+export interface SidePanelTargetOptions {
+  /** Title of the panel header (`$`: an i18n key); the action's label else. */
+  title?: string;
+  /**
+   * The row's position under the title: an i18n key (`$`-prefixed) receiving
+   * `{ index }` (from 1) and `{ total }`.
+   */
+  positionLabel?: string;
+  /** The open row is kept in the URL (`?record=`): on unless `false`. */
+  deepLink?: boolean;
+}
+
 export type ActionTarget =
   | {
       type: "drawer";
@@ -16,6 +29,8 @@ export type ActionTarget =
       title?: string;
       description?: string;
     }
+  /** A non-modal panel docked on the right of the page, on a row. */
+  | ({ type: "sidePanel"; component: ComponentInfo } & SidePanelTargetOptions)
   | { type: "page"; url: string }
   | { type: "external"; url: string; newTab?: boolean }
   /** Runs a quick action, by its `category:id` key or bare id. */

package/frontend-vue/layers/dms-ui/app/composables/table-view/types/config.ts

@@ -219,7 +219,11 @@ export interface TableViewSourceCapabilities {
 /** Where a `TableView.fromSource` table reads its rows (backend `source`). */
 export interface TableViewSourceConfig {
   fetchUrl: string;
+  /** Route answering one row, `{id}` its id (backend `fetchRowUrl`). */
+  fetchRowUrl?: string;
   capabilities: TableViewSourceCapabilities;
+  /** Id of the `PeriodSelector` whose period is sent to `fetchUrl`. */
+  periodScope?: string;
 }
 
 export interface TableViewListResponse<T> {

package/frontend-vue/layers/dms-ui/app/composables/table-view/types/display.ts

@@ -92,7 +92,14 @@ export interface TableViewDisplayActions<T> {
   details: (item: T) => void;
   /** What a click on the row does in the grid: its default action. */
   open: (item: T) => void;
-  custom: (action: CustomRowAction) => void;
+  /** Runs a custom row action on the row, as its grid menu entry does. */
+  custom: (action: CustomRowAction, item?: T) => void;
+  /**
+   * The table's custom row actions the row offers: those whose `rule` accepts
+   * it, in their declared order. A card drawing its own menu lists these and
+   * runs one with `custom`; an action's `id` finds a given one.
+   */
+  customFor: (item: T) => CustomRowAction[];
 }
 
 /**

package/frontend-vue/layers/dms-ui/app/config/shortcuts-registry.ts

@@ -1,4 +1,5 @@
 import { GLOBAL_SHORTCUTS_METADATA } from "../build/composables/global/shortcuts";
+import { LIVE_TOGGLE_SHORTCUTS_METADATA } from "../build/composables/live/shortcuts";
 import { TAB_SHORTCUTS_METADATA } from "../composables/tab/shortcuts";
 import { TABLE_VIEW_SHORTCUTS_METADATA } from "../composables/table-view/shortcuts";
 import type { ComponentShortcuts } from "../types/shortcuts";
@@ -16,4 +17,8 @@ export default [
     component: "TableView",
     shortcuts: TABLE_VIEW_SHORTCUTS_METADATA,
   },
+  {
+    component: "LiveToggle",
+    shortcuts: LIVE_TOGGLE_SHORTCUTS_METADATA,
+  },
 ] satisfies ComponentShortcuts[];

package/frontend-vue/layers/dms-ui/app/types/live.ts

@@ -0,0 +1,8 @@
+/**
+ * Mirror of `PageLiveOptions` from `@antelopejs/interface-dms/page`: the
+ * Direct / Pause valve a page declares with `live`.
+ */
+export interface PageLiveOptions {
+  /** Shortest interval, in seconds, between two refetches of one block. */
+  maxRate?: number;
+}

package/frontend-vue/layers/dms-ui/app/types/row-action.ts

@@ -14,6 +14,8 @@ export interface CustomRowActionBulkOptions {
 export type CustomRowActionBulk = true | CustomRowActionBulkOptions;
 
 export interface CustomRowAction {
+  /** Names the action for a card or display that places it itself. */
+  id?: string;
   label: string;
   icon?: string;
   target: ActionTarget;
@@ -24,7 +26,10 @@ export interface CustomRowAction {
   isVisible?: boolean;
   /** Legacy spelling of `isVisible`, still honoured. */
   visible?: boolean;
-  /** Preferred row-click target when its rule accepts the row. */
+  /**
+   * Preferred row-click target when its rule accepts the row: a double-click,
+   * or a single click on a table with `rowClick: "single"`.
+   */
   isDefault?: boolean;
   /** Color of the inline button or menu entry. */
   color?: ColorValue;
@@ -34,6 +39,6 @@ export interface CustomRowAction {
   showLabel?: boolean;
   /** Offered on the selection bar too. */
   bulk?: CustomRowActionBulk;
-  /** The drawer or modal it opens is reflected in the URL (`?record=`). */
+  /** The drawer, modal or side panel it opens is reflected in the URL (`?record=`). */
   deepLink?: boolean;
 }