@devicechain/widgets 0.24.0-rc.1 → 0.25.0-rc.2

package/README.md

@@ -65,7 +65,7 @@ bound to a slot needs its datasource resolved first (`resolveWidgets` or
 
 | channel | widgets |
 | --- | --- |
-| measurement | `timeseries-chart`, `latest-card`, `gauge`, `linear-gauge`, `level-gauge`, `battery`, `status-light`, `signal-bars`, `compass`, `progress-ring`, `table`, `bar-chart`, `pie-chart`, `fleet-table`, `fleet-count`, `device-status`, `online-doughnut` |
+| measurement | `timeseries-chart`, `latest-card`, `gauge`, `linear-gauge`, `level-gauge`, `battery`, `status-light`, `signal-bars`, `compass`, `progress-ring`, `table`, `bar-chart`, `pie-chart`, `fleet-table`, `fleet-count`, `device-status`, `online-doughnut`, `history-table` |
 | aggregate | `stat-card` |
 | none (static) | `label`, `image` |
 | alarm | `alarm-table`, `alarm-count`, `alarm-severity` |
@@ -83,6 +83,16 @@ each was last active) from device-state, not their readings. They ride the measu
 member feed (`data.members[].presence`), so the channel set is unchanged. `device-status` shows one
 device; `online-doughnut` takes a group.
 
+`history-table` lists one device's stored history as rows, one per time bucket over the board's
+span, each cell the bucket's average (the table says "avg per 5m"). It reads the store's buckets
+(`binding.history`), not the live feed, and refuses a group.
+
+A frame offers a data download from its title bar when its widget opts in: `timeseries-chart`,
+`fleet-table` and `history-table` hand it a table (CSV), and the charts drawn on a canvas
+(`timeseries-chart`, `gauge`, `compass`) a PNG. The file holds what the widget shows, for the
+span and bucket on screen, and its name says so. A widget of your own opts in with the
+optional `exportRows` prop of `WidgetFrame` (see the widget SDK).
+
 The time-series chart, the dial gauge and the compass are drawn with
 [Apache ECharts](https://echarts.apache.org); the other widgets are plain DOM
 and SVG. The map is [MapLibre GL](https://maplibre.org), loaded lazily so a board

package/dist/absolute-range-picker.d.ts

@@ -0,0 +1,22 @@
+import type { AbsoluteRange, AbsoluteRangeProblem } from '@devicechain/dashboards';
+export interface AbsolutePickerLabels {
+    custom: string;
+    from: string;
+    to: string;
+    apply: string;
+    cancel: string;
+    zone: (zone: string, offset: string) => string;
+    problem: Record<AbsoluteRangeProblem, string>;
+}
+export declare function toLocalInput(ms: number): string;
+export declare function fromLocalInput(value: string): number;
+export declare function zoneInfo(at?: number): {
+    zone: string;
+    offset: string;
+};
+export default function AbsoluteRangePicker({ initial, labels, onApply, onCancel, }: {
+    initial?: AbsoluteRange;
+    labels: AbsolutePickerLabels;
+    onApply: (fromMs: number, toMs: number) => AbsoluteRangeProblem | undefined;
+    onCancel: () => void;
+}): import("react").JSX.Element;

package/dist/binding-policy.d.ts

@@ -4,6 +4,7 @@ export declare function measurementSpan(descriptor: WidgetDescriptor, widget: Wi
 export declare function membersMode(descriptor: WidgetDescriptor, widget: WidgetInstance): boolean;
 export declare function measurementIsMembersOnly(descriptor: WidgetDescriptor): boolean;
 export declare function presenceMode(descriptor: WidgetDescriptor): boolean;
+export declare function historyMode(descriptor: WidgetDescriptor): boolean;
 export declare function alarmSubscription(descriptor: WidgetDescriptor, widget: WidgetInstance): AlarmSubscription;
 export declare function groupsAlarmsByDeviceType(descriptor: WidgetDescriptor, widget: WidgetInstance): boolean;
 export declare function commandSubscription(descriptor: WidgetDescriptor, widget: WidgetInstance): CommandSubscription;

package/dist/builtin-descriptors.d.ts

@@ -1628,6 +1628,75 @@ export declare const builtinWidgetDescriptors: {
             readonly helpId: 'widgetHintStaleAfter';
         };
     }>>;
+    readonly 'history-table': WidgetDescriptor<"measurement", DocumentedSpecs<{
+        readonly title: {
+            readonly kind: 'string';
+            readonly labelId: 'widgetLabelTitle';
+        };
+        readonly columns: {
+            readonly kind: 'list';
+            readonly maxItems: 24;
+            readonly labelId: 'widgetLabelColumns';
+            readonly helpId: 'widgetHintColumns';
+            readonly item: {
+                readonly measurement: {
+                    readonly kind: 'string';
+                    readonly required: true;
+                    readonly labelId: 'widgetLabelMeasurement';
+                };
+                readonly label: {
+                    readonly kind: 'string';
+                    readonly labelId: 'widgetLabelColumnHeading';
+                };
+                readonly unit: {
+                    readonly kind: 'string';
+                    readonly labelId: 'widgetLabelUnit';
+                };
+                readonly precision: {
+                    readonly kind: 'number';
+                    readonly integer: true;
+                    readonly min: 0;
+                    readonly max: 100;
+                    readonly labelId: 'widgetLabelPrecision';
+                    readonly helpId: 'widgetHintPrecision';
+                };
+            };
+        };
+        readonly precision: {
+            readonly kind: 'number';
+            readonly integer: true;
+            readonly min: 0;
+            readonly max: 100;
+            readonly labelId: 'widgetLabelPrecision';
+            readonly helpId: 'widgetHintPrecision';
+        };
+        readonly oldestFirst: {
+            readonly kind: "boolean";
+            readonly labelId: "widgetLabelOldestFirst";
+        };
+        readonly pageSize: {
+            readonly kind: "number";
+            readonly integer: true;
+            readonly min: 5;
+            readonly max: 100;
+            readonly labelId: "widgetLabelRowsPerPage";
+        };
+        readonly staleAfterSeconds: {
+            readonly kind: 'number';
+            readonly integer: true;
+            readonly min: 1;
+            readonly labelId: 'widgetLabelStaleAfter';
+            readonly helpId: 'widgetHintStaleAfter';
+        };
+        readonly windowSeconds: {
+            readonly kind: 'number';
+            readonly integer: true;
+            readonly min: 60;
+            readonly max: 604800;
+            readonly labelId: 'widgetLabelWindowSeconds';
+            readonly helpId: 'widgetHintWindowSeconds';
+        };
+    }>>;
 };
 export declare const builtinWidgetCatalog: import("@devicechain/dashboards").WidgetCatalog;
 export {};

package/dist/builtin-registry.d.ts

@@ -1586,5 +1586,73 @@ export declare const builtinWidgetDefinitions: readonly [import("@devicechain/wi
         readonly labelId: 'widgetLabelStaleAfter';
         readonly helpId: 'widgetHintStaleAfter';
     };
+}>>, import("@devicechain/widget-sdk").WidgetDefinition<"measurement", import("./builtin-descriptors").DocumentedSpecs<{
+    readonly title: {
+        readonly kind: 'string';
+        readonly labelId: 'widgetLabelTitle';
+    };
+    readonly columns: {
+        readonly kind: 'list';
+        readonly maxItems: 24;
+        readonly labelId: 'widgetLabelColumns';
+        readonly helpId: 'widgetHintColumns';
+        readonly item: {
+            readonly measurement: {
+                readonly kind: 'string';
+                readonly required: true;
+                readonly labelId: 'widgetLabelMeasurement';
+            };
+            readonly label: {
+                readonly kind: 'string';
+                readonly labelId: 'widgetLabelColumnHeading';
+            };
+            readonly unit: {
+                readonly kind: 'string';
+                readonly labelId: 'widgetLabelUnit';
+            };
+            readonly precision: {
+                readonly kind: 'number';
+                readonly integer: true;
+                readonly min: 0;
+                readonly max: 100;
+                readonly labelId: 'widgetLabelPrecision';
+                readonly helpId: 'widgetHintPrecision';
+            };
+        };
+    };
+    readonly precision: {
+        readonly kind: 'number';
+        readonly integer: true;
+        readonly min: 0;
+        readonly max: 100;
+        readonly labelId: 'widgetLabelPrecision';
+        readonly helpId: 'widgetHintPrecision';
+    };
+    readonly oldestFirst: {
+        readonly kind: "boolean";
+        readonly labelId: "widgetLabelOldestFirst";
+    };
+    readonly pageSize: {
+        readonly kind: "number";
+        readonly integer: true;
+        readonly min: 5;
+        readonly max: 100;
+        readonly labelId: "widgetLabelRowsPerPage";
+    };
+    readonly staleAfterSeconds: {
+        readonly kind: 'number';
+        readonly integer: true;
+        readonly min: 1;
+        readonly labelId: 'widgetLabelStaleAfter';
+        readonly helpId: 'widgetHintStaleAfter';
+    };
+    readonly windowSeconds: {
+        readonly kind: 'number';
+        readonly integer: true;
+        readonly min: 60;
+        readonly max: 604800;
+        readonly labelId: 'widgetLabelWindowSeconds';
+        readonly helpId: 'widgetHintWindowSeconds';
+    };
 }>>];
 export declare function createBuiltinWidgetRegistry(): WidgetRegistry;

package/dist/chunks/absolute-range-picker-E57G2TPX.js

@@ -0,0 +1,139 @@
+// src/absolute-range-picker.tsx
+import { useId, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var pad = (n) => String(n).padStart(2, "0");
+function toLocalInput(ms) {
+  const d = new Date(ms);
+  return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}T${pad(d.getHours())}:${pad(d.getMinutes())}`;
+}
+function fromLocalInput(value) {
+  return value ? new Date(value).getTime() : Number.NaN;
+}
+function zoneInfo(at = Date.now()) {
+  const zone = Intl.DateTimeFormat().resolvedOptions().timeZone || "local";
+  const minutes = -new Date(at).getTimezoneOffset();
+  const sign = minutes < 0 ? "-" : "+";
+  const abs = Math.abs(minutes);
+  return { zone, offset: `UTC${sign}${pad(Math.floor(abs / 60))}:${pad(abs % 60)}` };
+}
+var field = {
+  display: "flex",
+  flexDirection: "column",
+  gap: 2,
+  fontSize: 12,
+  flex: "1 1 13rem",
+  minWidth: 0
+};
+var input = {
+  font: "inherit",
+  fontSize: 13,
+  padding: "3px 6px",
+  color: "hsl(var(--foreground))",
+  background: "hsl(var(--background))",
+  border: "1px solid hsl(var(--border))",
+  borderRadius: 4,
+  minWidth: 0
+};
+var action = (primary) => ({
+  padding: "3px 10px",
+  fontSize: 12,
+  cursor: "pointer",
+  color: primary ? "hsl(var(--background))" : "hsl(var(--foreground))",
+  background: primary ? "hsl(var(--foreground))" : "transparent",
+  border: "1px solid hsl(var(--border))",
+  borderRadius: 4
+});
+function AbsoluteRangePicker({
+  initial,
+  labels,
+  onApply,
+  onCancel
+}) {
+  const id = useId();
+  const now = Date.now();
+  const [from, setFrom] = useState(() => toLocalInput(initial?.fromMs ?? now - 60 * 60 * 1e3));
+  const [to, setTo] = useState(() => toLocalInput(initial?.toMs ?? now));
+  const [problem, setProblem] = useState();
+  const { zone, offset } = zoneInfo();
+  const max = toLocalInput(now);
+  const submit = () => {
+    const p = onApply(fromLocalInput(from), fromLocalInput(to));
+    setProblem(p);
+  };
+  return /* @__PURE__ */ jsxs(
+    "form",
+    {
+      "data-absolute-picker": "",
+      "aria-label": labels.custom,
+      onSubmit: (e) => {
+        e.preventDefault();
+        submit();
+      },
+      onKeyDown: (e) => {
+        if (e.key === "Escape") onCancel();
+      },
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        gap: 8,
+        padding: 10,
+        boxSizing: "border-box",
+        width: "min(24rem, calc(100vw - 32px))",
+        color: "hsl(var(--foreground))",
+        background: "hsl(var(--background))",
+        border: "1px solid hsl(var(--border))",
+        borderRadius: 6,
+        boxShadow: "0 4px 16px rgba(0,0,0,0.18)"
+      },
+      children: [
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 8, flexWrap: "wrap" }, children: [
+          /* @__PURE__ */ jsxs("label", { htmlFor: `${id}-from`, style: field, children: [
+            labels.from,
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                id: `${id}-from`,
+                "data-absolute-from": "",
+                type: "datetime-local",
+                value: from,
+                max,
+                required: true,
+                onChange: (e) => setFrom(e.target.value),
+                style: input
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs("label", { htmlFor: `${id}-to`, style: field, children: [
+            labels.to,
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                id: `${id}-to`,
+                "data-absolute-to": "",
+                type: "datetime-local",
+                value: to,
+                max,
+                required: true,
+                onChange: (e) => setTo(e.target.value),
+                style: input
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx("div", { "data-absolute-zone": "", style: { fontSize: 12, color: "hsl(var(--muted-foreground))" }, children: labels.zone(zone, offset) }),
+        problem ? /* @__PURE__ */ jsx("div", { role: "alert", "data-absolute-problem": problem, style: { fontSize: 12, color: "hsl(var(--destructive))" }, children: labels.problem[problem] }) : null,
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: 6, justifyContent: "flex-end" }, children: [
+          /* @__PURE__ */ jsx("button", { type: "button", onClick: onCancel, style: action(false), children: labels.cancel }),
+          /* @__PURE__ */ jsx("button", { type: "submit", "data-absolute-apply": "", style: action(true), children: labels.apply })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  AbsoluteRangePicker as default,
+  fromLocalInput,
+  toLocalInput,
+  zoneInfo
+};
+//# sourceMappingURL=absolute-range-picker-E57G2TPX.js.map

package/dist/chunks/absolute-range-picker-E57G2TPX.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/absolute-range-picker.tsx"],
+  "sourcesContent": ["// Copyright The DeviceChain Authors\n// SPDX-License-Identifier: Apache-2.0\n\n// The from-to picker for an absolute time range. Its own chunk: the time-range bar imports it on the\n// first click of \"Custom\", so a board that never opens it never downloads it (and the bar itself,\n// which every board with a header carries, stays small).\n//\n// The two fields are the browser's own `datetime-local` inputs, which read and write the VIEWER'S\n// zone. That zone is printed beside them, always, because \"02:00\" means nothing without one; the\n// window is stored as instants, and the link it offers is in UTC.\n\nimport type { AbsoluteRange, AbsoluteRangeProblem } from '@devicechain/dashboards';\nimport { useId, useState, type CSSProperties } from 'react';\n\nexport interface AbsolutePickerLabels {\n  custom: string;\n  from: string;\n  to: string;\n  apply: string;\n  cancel: string;\n  // \"Times are in Europe/Berlin (UTC+02:00). Shared links use UTC.\"\n  zone: (zone: string, offset: string) => string;\n  problem: Record<AbsoluteRangeProblem, string>;\n}\n\nconst pad = (n: number) => String(n).padStart(2, '0');\n\n// A `datetime-local` value (`2026-10-22T14:30`) for an instant, in the viewer's zone.\nexport function toLocalInput(ms: number): string {\n  const d = new Date(ms);\n  return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}T${pad(d.getHours())}:${pad(d.getMinutes())}`;\n}\n\n// The instant for a `datetime-local` value read in the viewer's zone, or NaN for an empty/invalid one.\nexport function fromLocalInput(value: string): number {\n  return value ? new Date(value).getTime() : Number.NaN;\n}\n\nexport function zoneInfo(at: number = Date.now()): { zone: string; offset: string } {\n  const zone = Intl.DateTimeFormat().resolvedOptions().timeZone || 'local';\n  const minutes = -new Date(at).getTimezoneOffset();\n  const sign = minutes < 0 ? '-' : '+';\n  const abs = Math.abs(minutes);\n  return { zone, offset: `UTC${sign}${pad(Math.floor(abs / 60))}:${pad(abs % 60)}` };\n}\n\nconst field: CSSProperties = {\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 2,\n  fontSize: 12,\n  flex: '1 1 13rem',\n  minWidth: 0,\n};\nconst input: CSSProperties = {\n  font: 'inherit',\n  fontSize: 13,\n  padding: '3px 6px',\n  color: 'hsl(var(--foreground))',\n  background: 'hsl(var(--background))',\n  border: '1px solid hsl(var(--border))',\n  borderRadius: 4,\n  minWidth: 0,\n};\nconst action = (primary: boolean): CSSProperties => ({\n  padding: '3px 10px',\n  fontSize: 12,\n  cursor: 'pointer',\n  color: primary ? 'hsl(var(--background))' : 'hsl(var(--foreground))',\n  background: primary ? 'hsl(var(--foreground))' : 'transparent',\n  border: '1px solid hsl(var(--border))',\n  borderRadius: 4,\n});\n\nexport default function AbsoluteRangePicker({\n  initial,\n  labels,\n  onApply,\n  onCancel,\n}: {\n  initial?: AbsoluteRange;\n  labels: AbsolutePickerLabels;\n  // Returns why the window was refused, or undefined when it was taken.\n  onApply: (fromMs: number, toMs: number) => AbsoluteRangeProblem | undefined;\n  onCancel: () => void;\n}) {\n  const id = useId();\n  const now = Date.now();\n  // Open on the window already in force, or on the last hour as a starting point to edit.\n  const [from, setFrom] = useState(() => toLocalInput(initial?.fromMs ?? now - 60 * 60 * 1000));\n  const [to, setTo] = useState(() => toLocalInput(initial?.toMs ?? now));\n  const [problem, setProblem] = useState<AbsoluteRangeProblem | undefined>();\n  const { zone, offset } = zoneInfo();\n  const max = toLocalInput(now);\n\n  const submit = () => {\n    const p = onApply(fromLocalInput(from), fromLocalInput(to));\n    setProblem(p);\n  };\n\n  return (\n    <form\n      data-absolute-picker=\"\"\n      aria-label={labels.custom}\n      onSubmit={(e) => {\n        e.preventDefault();\n        submit();\n      }}\n      onKeyDown={(e) => {\n        if (e.key === 'Escape') onCancel();\n      }}\n      style={{\n        display: 'flex',\n        flexDirection: 'column',\n        gap: 8,\n        padding: 10,\n        boxSizing: 'border-box',\n        width: 'min(24rem, calc(100vw - 32px))',\n        color: 'hsl(var(--foreground))',\n        background: 'hsl(var(--background))',\n        border: '1px solid hsl(var(--border))',\n        borderRadius: 6,\n        boxShadow: '0 4px 16px rgba(0,0,0,0.18)',\n      }}\n    >\n      <div style={{ display: 'flex', gap: 8, flexWrap: 'wrap' }}>\n        <label htmlFor={`${id}-from`} style={field}>\n          {labels.from}\n          <input\n            id={`${id}-from`}\n            data-absolute-from=\"\"\n            type=\"datetime-local\"\n            value={from}\n            max={max}\n            required\n            onChange={(e) => setFrom(e.target.value)}\n            style={input}\n          />\n        </label>\n        <label htmlFor={`${id}-to`} style={field}>\n          {labels.to}\n          <input\n            id={`${id}-to`}\n            data-absolute-to=\"\"\n            type=\"datetime-local\"\n            value={to}\n            max={max}\n            required\n            onChange={(e) => setTo(e.target.value)}\n            style={input}\n          />\n        </label>\n      </div>\n      <div data-absolute-zone=\"\" style={{ fontSize: 12, color: 'hsl(var(--muted-foreground))' }}>\n        {labels.zone(zone, offset)}\n      </div>\n      {problem ? (\n        <div role=\"alert\" data-absolute-problem={problem} style={{ fontSize: 12, color: 'hsl(var(--destructive))' }}>\n          {labels.problem[problem]}\n        </div>\n      ) : null}\n      <div style={{ display: 'flex', gap: 6, justifyContent: 'flex-end' }}>\n        <button type=\"button\" onClick={onCancel} style={action(false)}>\n          {labels.cancel}\n        </button>\n        <button type=\"submit\" data-absolute-apply=\"\" style={action(true)}>\n          {labels.apply}\n        </button>\n      </div>\n    </form>\n  );\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/chunks/{aggregate-feed-4FSBQYJL.js → aggregate-feed-XX36GNY6.js}

@@ -1,6 +1,6 @@
 import {
   measurementSpan
-} from "./chunk-JFH4QMLA.js";
+} from "./chunk-NYHNQ5VR.js";
 
 // src/aggregate-feed.tsx
 import {
@@ -156,4 +156,4 @@ function AggregateFeed({ hub, widget, descriptor, Component, actions, ErrorFrame
 export {
   AggregateFeed as default
 };
-//# sourceMappingURL=aggregate-feed-4FSBQYJL.js.map
+//# sourceMappingURL=aggregate-feed-XX36GNY6.js.map

package/dist/chunks/{aggregate-widgets-2ZQBW3YF.js → aggregate-widgets-72HMPMBU.js}

@@ -1,13 +1,3 @@
-import {
-  DEFAULT_PAGE_SIZE,
-  cellFor,
-  clampPage,
-  columnNames,
-  deviceBars,
-  deviceLabel,
-  pageCount,
-  sortMembers
-} from "./chunk-62CHYCHI.js";
 import {
   niceDomain,
   pieSlices,
@@ -16,11 +6,31 @@ import {
 import {
   fleetStrings
 } from "./chunk-QMGKB6J3.js";
+import {
+  Explained
+} from "./chunk-AF4M5OXQ.js";
+import {
+  NoReading
+} from "./chunk-JVC6JYUR.js";
+import {
+  fleetExport
+} from "./chunk-VTGKDO44.js";
 import "./chunk-BRH66T5F.js";
 import {
   LevelEmpty,
   LevelReadout
-} from "./chunk-XQQQNTBX.js";
+} from "./chunk-EQOWBDS7.js";
+import "./chunk-XJ7UF2CP.js";
+import {
+  DEFAULT_PAGE_SIZE,
+  cellFor,
+  clampPage,
+  columnNames,
+  deviceBars,
+  deviceLabel,
+  pageCount,
+  sortMembers
+} from "./chunk-62CHYCHI.js";
 
 // src/widgets/bar-chart.tsx
 import { useMemo } from "react";
@@ -135,8 +145,8 @@ function DeviceBars({
   );
   if (!measurement) return /* @__PURE__ */ jsx(LevelEmpty, { message: strings.noMeasurement });
   if (!fleet || fleet.status === "loading") return /* @__PURE__ */ jsx(LevelEmpty, { message: strings.loading });
-  if (fleet.status === "unbound") return /* @__PURE__ */ jsx(LevelEmpty, { message: strings.unbound });
-  if (fleet.status === "forbidden") return /* @__PURE__ */ jsx(LevelEmpty, { message: strings.forbidden });
+  if (fleet.status === "unbound") return /* @__PURE__ */ jsx(Explained, { kind: "unbound", message: strings.unbound });
+  if (fleet.status === "forbidden") return /* @__PURE__ */ jsx(Explained, { kind: "forbidden", message: strings.forbidden });
   if (fleet.status === "unsupported") return /* @__PURE__ */ jsx(LevelEmpty, { message: strings.unsupported });
   if (bars.length === 0) return /* @__PURE__ */ jsx(LevelEmpty, { message: strings.noMembers });
   const drawn = bars.slice(0, MAX_DEVICE_BARS);
@@ -314,10 +324,10 @@ function FleetCount({ widget, data }) {
   const measurement = optString2(widget.options, "measurement") ?? primaryMeasurementName(widget);
   const thresholds = useMemo2(() => optThresholds(widget.options, "thresholds"), [widget.options]);
   const title = optString2(widget.options, "title");
-  const empty = (message) => /* @__PURE__ */ jsx2(WidgetFrame2, { title, children: /* @__PURE__ */ jsx2(LevelEmpty, { message }) });
+  const empty = (message, kind) => /* @__PURE__ */ jsx2(WidgetFrame2, { title, children: kind ? /* @__PURE__ */ jsx2(Explained, { kind, message }) : /* @__PURE__ */ jsx2(LevelEmpty, { message }) });
   if (!fleet || fleet.status === "loading") return empty(strings.loading);
-  if (fleet.status === "unbound") return empty(strings.unbound);
-  if (fleet.status === "forbidden") return empty(strings.forbidden);
+  if (fleet.status === "unbound") return empty(strings.unbound, "unbound");
+  if (fleet.status === "forbidden") return empty(strings.forbidden, "forbidden");
   if (fleet.status === "unsupported") return empty(strings.unsupported);
   if (!showDevices) {
     if (measurement === void 0) return empty(strings.noMeasurementCount);
@@ -473,8 +483,8 @@ function FleetTable({ widget, data }) {
   if (!fleet || fleet.status === "loading") {
     return /* @__PURE__ */ jsx3(Frame, { title, children: /* @__PURE__ */ jsx3(LevelEmpty, { message: strings.loading }) });
   }
-  if (fleet.status === "unbound") return /* @__PURE__ */ jsx3(Frame, { title, children: /* @__PURE__ */ jsx3(LevelEmpty, { message: strings.unbound }) });
-  if (fleet.status === "forbidden") return /* @__PURE__ */ jsx3(Frame, { title, children: /* @__PURE__ */ jsx3(LevelEmpty, { message: strings.forbidden }) });
+  if (fleet.status === "unbound") return /* @__PURE__ */ jsx3(Frame, { title, children: /* @__PURE__ */ jsx3(Explained, { kind: "unbound", message: strings.unbound }) });
+  if (fleet.status === "forbidden") return /* @__PURE__ */ jsx3(Frame, { title, children: /* @__PURE__ */ jsx3(Explained, { kind: "forbidden", message: strings.forbidden }) });
   if (fleet.status === "unsupported") return /* @__PURE__ */ jsx3(Frame, { title, children: /* @__PURE__ */ jsx3(LevelEmpty, { message: strings.unsupported }) });
   if (fleet.members.length === 0) return /* @__PURE__ */ jsx3(Frame, { title, children: /* @__PURE__ */ jsx3(LevelEmpty, { message: strings.noMembers }) });
   return /* @__PURE__ */ jsx3(Table, { widget, fleet, strings });
@@ -626,44 +636,61 @@ function Table({
       ] }, member.token);
     })
   ] });
-  return /* @__PURE__ */ jsx3(Frame, { title: optString3(widget.options, "title"), children: /* @__PURE__ */ jsxs3("div", { style: { display: "flex", flexDirection: "column", height: "100%", minHeight: 0 }, children: [
-    /* @__PURE__ */ jsx3(
-      "div",
-      {
-        role: "region",
-        "aria-label": optString3(widget.options, "title") ?? strings.device,
-        tabIndex: 0,
-        "data-fleet-scroll": "",
-        style: { flex: 1, minHeight: 0, overflow: "auto" },
-        children: /* @__PURE__ */ jsx3(Responsive, { wide, narrow })
-      }
-    ),
-    (fleet.truncated || pages > 1) && /* @__PURE__ */ jsxs3(
-      "div",
-      {
-        "data-fleet-footer": "",
-        style: {
-          display: "flex",
-          flexWrap: "wrap",
-          alignItems: "center",
-          justifyContent: "space-between",
-          gap: spaceVar2(2),
-          padding: `${spaceVar2(1)} ${spaceVar2(3)}`,
-          fontSize: fontVar2("sm"),
-          color: css3("muted-foreground"),
-          borderTop: `1px solid ${css3("border")}`
-        },
-        children: [
-          /* @__PURE__ */ jsx3("span", { "data-fleet-truncated": fleet.truncated ? "" : void 0, children: fleet.truncated ? strings.truncated(fleet.members.length, fleet.total) : "" }),
-          pages > 1 && /* @__PURE__ */ jsxs3("span", { style: { display: "inline-flex", alignItems: "center", gap: spaceVar2(2) }, children: [
-            /* @__PURE__ */ jsx3("button", { type: "button", style: pagerButton, disabled: shownPage === 0, onClick: () => setPage(shownPage - 1), "aria-label": strings.previous, children: "\u2039" }),
-            /* @__PURE__ */ jsx3("span", { children: strings.range(shownPage * pageSize + 1, shownPage * pageSize + rows.length, sorted.length) }),
-            /* @__PURE__ */ jsx3("button", { type: "button", style: pagerButton, disabled: shownPage >= pages - 1, onClick: () => setPage(shownPage + 1), "aria-label": strings.next, children: "\u203A" })
-          ] })
-        ]
-      }
-    )
-  ] }) });
+  return /* @__PURE__ */ jsx3(
+    WidgetFrame3,
+    {
+      title: optString3(widget.options, "title"),
+      flush: true,
+      exportRows: () => fleetExport({
+        subject: optString3(widget.options, "title") ?? "fleet",
+        members: fleet.members,
+        total: fleet.total,
+        columns: columns.map((name) => {
+          const f = formats.get(name);
+          return { name, heading: (f?.label ?? name) + (f?.unit ? ` (${f.unit})` : ""), precision: f?.precision };
+        }),
+        sort
+      }),
+      children: /* @__PURE__ */ jsxs3("div", { style: { display: "flex", flexDirection: "column", height: "100%", minHeight: 0 }, children: [
+        /* @__PURE__ */ jsx3(
+          "div",
+          {
+            role: "region",
+            "aria-label": optString3(widget.options, "title") ?? strings.device,
+            tabIndex: 0,
+            "data-fleet-scroll": "",
+            style: { flex: 1, minHeight: 0, overflow: "auto" },
+            children: /* @__PURE__ */ jsx3(Responsive, { wide, narrow })
+          }
+        ),
+        (fleet.truncated || pages > 1) && /* @__PURE__ */ jsxs3(
+          "div",
+          {
+            "data-fleet-footer": "",
+            style: {
+              display: "flex",
+              flexWrap: "wrap",
+              alignItems: "center",
+              justifyContent: "space-between",
+              gap: spaceVar2(2),
+              padding: `${spaceVar2(1)} ${spaceVar2(3)}`,
+              fontSize: fontVar2("sm"),
+              color: css3("muted-foreground"),
+              borderTop: `1px solid ${css3("border")}`
+            },
+            children: [
+              /* @__PURE__ */ jsx3("span", { "data-fleet-truncated": fleet.truncated ? "" : void 0, children: fleet.truncated ? strings.truncated(fleet.members.length, fleet.total) : "" }),
+              pages > 1 && /* @__PURE__ */ jsxs3("span", { style: { display: "inline-flex", alignItems: "center", gap: spaceVar2(2) }, children: [
+                /* @__PURE__ */ jsx3("button", { type: "button", style: pagerButton, disabled: shownPage === 0, onClick: () => setPage(shownPage - 1), "aria-label": strings.previous, children: "\u2039" }),
+                /* @__PURE__ */ jsx3("span", { children: strings.range(shownPage * pageSize + 1, shownPage * pageSize + rows.length, sorted.length) }),
+                /* @__PURE__ */ jsx3("button", { type: "button", style: pagerButton, disabled: shownPage >= pages - 1, onClick: () => setPage(shownPage + 1), "aria-label": strings.next, children: "\u203A" })
+              ] })
+            ]
+          }
+        )
+      ] })
+    }
+  );
 }
 function positiveSeconds(v) {
   return v !== void 0 && Number.isFinite(v) && v > 0 ? v : void 0;
@@ -839,6 +866,7 @@ import {
   optNumber as optNumber4,
   optString as optString5,
   optThresholds as optThresholds2,
+  pickSample as pickSample2,
   spaceVar as spaceVar4,
   useSeverityColors as useSeverityColors3,
   WidgetFrame as WidgetFrame5,
@@ -981,6 +1009,20 @@ function StatCard({ widget, data }) {
   const wantsTrend = optBoolean2(widget.options, "sparkline");
   const card = /* @__PURE__ */ jsx6(WidgetFrame5, { title, sampleTime: stat === "last" ? reading.kind === "value" ? reading.time ?? null : null : void 0, children: ({ size, scale }) => {
     if (reading.kind === "empty") {
+      if (reading.reason === "unbound" || reading.reason === "noData" || reading.reason === "noReadings") {
+        return /* @__PURE__ */ jsx6(
+          NoReading,
+          {
+            unbound: reading.reason === "unbound",
+            measurement: reading.name,
+            lastSample: pickSample2(data.latest, reading.name),
+            unit,
+            precision,
+            detail: reading.reason === "noReadings" ? emptyMessage(reading, strings) : void 0,
+            waitMs: reading.reason === "noReadings" ? 0 : void 0
+          }
+        );
+      }
       return /* @__PURE__ */ jsx6(LevelEmpty, { message: emptyMessage(reading, strings) });
     }
     const isCount = reading.stat === "count";
@@ -1087,4 +1129,4 @@ export {
   PieChart,
   StatCard
 };
-//# sourceMappingURL=aggregate-widgets-2ZQBW3YF.js.map
+//# sourceMappingURL=aggregate-widgets-72HMPMBU.js.map