@devicechain/widgets 0.19.0-rc.1 → 0.20.0-rc.4

package/dist/widgets/label.d.ts

@@ -1,2 +1,34 @@
-import { type WidgetProps } from '../widget';
-export declare function Label({ widget }: WidgetProps): import("react").JSX.Element;
+import { type WidgetProps } from '@devicechain/widget-sdk';
+export declare function Label({ widget }: WidgetProps<null>): import("react").JSX.Element;
+export declare const labelWidget: import("@devicechain/widget-sdk").WidgetDefinition<"none", {
+    readonly title: {
+        readonly kind: 'string';
+        readonly labelId: 'widgetLabelTitle';
+        readonly doc: 'Heading shown in the widget frame. Blank hides the frame heading.';
+    };
+    readonly text: {
+        readonly kind: "string";
+        readonly required: true;
+        readonly labelId: "widgetLabelText";
+        readonly doc: "The text to show. Rendered as plain text — markup is never interpreted.";
+    };
+    readonly align: {
+        readonly kind: "enum";
+        readonly values: readonly ["left", "center", "right"];
+        readonly labelId: "widgetLabelAlign";
+        readonly valueLabelIds: {
+            readonly left: "widgetAlignLeft";
+            readonly center: "widgetAlignCenter";
+            readonly right: "widgetAlignRight";
+        };
+        readonly placeholderId: "widgetPlaceholderDefault";
+        readonly doc: "Horizontal alignment of the text. Default center.";
+    };
+    readonly fontSize: {
+        readonly kind: "number";
+        readonly min: 1;
+        readonly labelId: "widgetLabelFontSize";
+        readonly helpId: "widgetHintFontSize";
+        readonly doc: "Text size in pixels. Default 16.";
+    };
+}>;

package/dist/widgets/latest-card.d.ts

@@ -1,2 +1,43 @@
-import { type WidgetProps } from '../widget';
+import { type WidgetProps } from '@devicechain/widget-sdk';
 export declare function LatestCard({ widget, data }: WidgetProps): import("react").JSX.Element;
+export declare const latestCardWidget: import("@devicechain/widget-sdk").WidgetDefinition<"measurement", {
+    readonly title: {
+        readonly kind: 'string';
+        readonly labelId: 'widgetLabelTitle';
+        readonly doc: 'Heading shown in the widget frame. Defaults to the displayed measurement name.';
+    };
+    readonly measurement: {
+        readonly kind: "string";
+        readonly labelId: "widgetLabelMeasurement";
+        readonly helpId: "widgetHintMeasurement";
+        readonly doc: "Which measurement to display. Defaults to the first the datasource selects.";
+    };
+    readonly unit: {
+        readonly kind: 'string';
+        readonly labelId: 'widgetLabelUnit';
+        readonly doc: 'Unit suffix shown beside the value.';
+    };
+    readonly precision: {
+        readonly kind: 'number';
+        readonly integer: true;
+        readonly min: 0;
+        readonly max: 100;
+        readonly labelId: 'widgetLabelPrecision';
+        readonly helpId: 'widgetHintPrecision';
+        readonly doc: 'Decimal places to round displayed values to. Unset shows the raw value.';
+    };
+    readonly flashOnChange: {
+        readonly kind: 'boolean';
+        readonly labelId: 'widgetFlashOnChange';
+        readonly helpId: 'widgetFlashOnChangeHint';
+        readonly doc: 'Briefly tint a value green on a rise and red on a fall when it changes.';
+    };
+    readonly window: {
+        readonly kind: 'number';
+        readonly integer: true;
+        readonly min: 1;
+        readonly labelId: 'widgetLabelWindow';
+        readonly helpId: 'widgetHintWindow';
+        readonly doc: 'Samples retained across ALL of the widget\'s measurements before the oldest are dropped. Bounds memory; only the chart draws them. Default 300.';
+    };
+}>;

package/dist/widgets/map.d.ts

@@ -1,3 +1,23 @@
-import type { LocationStreamState } from '../hooks';
-import { type WidgetProps } from '../widget';
+import { type LocationStreamState, type WidgetProps } from '@devicechain/widget-sdk';
 export declare function MapWidget({ widget, data }: WidgetProps<LocationStreamState>): import("react").JSX.Element;
+export declare const mapWidget: import("@devicechain/widget-sdk").WidgetDefinition<"location", {
+    readonly title: {
+        readonly kind: 'string';
+        readonly labelId: 'widgetLabelTitle';
+        readonly doc: 'Heading shown in the widget frame. Blank hides the frame heading.';
+    };
+    readonly tileUrl: {
+        readonly kind: "string";
+        readonly labelId: "widgetLabelTileUrl";
+        readonly helpId: "widgetTileUrlHint";
+        readonly control: "basemap";
+        readonly doc: "Raster tile URL template, e.g. https://tiles.example.com/{z}/{x}/{y}.png. Leave empty to inherit the tenant's basemap; setting one overrides it for this board only.";
+    };
+    readonly attribution: {
+        readonly kind: "string";
+        readonly labelId: "widgetLabelAttribution";
+        readonly helpId: "widgetAttributionHint";
+        readonly control: "basemap";
+        readonly doc: "Credit line the tile source requires, shown on the map. Set whatever the provider you chose asks for.";
+    };
+}>;

package/dist/widgets/table.d.ts

@@ -1,2 +1,32 @@
-import { type WidgetProps } from '../widget';
+import { type WidgetProps } from '@devicechain/widget-sdk';
 export declare function Table({ widget, data }: WidgetProps): import("react").JSX.Element;
+export declare const tableWidget: import("@devicechain/widget-sdk").WidgetDefinition<"measurement", {
+    readonly title: {
+        readonly kind: 'string';
+        readonly labelId: 'widgetLabelTitle';
+        readonly doc: 'Heading shown in the widget frame. Blank hides the frame heading.';
+    };
+    readonly precision: {
+        readonly kind: 'number';
+        readonly integer: true;
+        readonly min: 0;
+        readonly max: 100;
+        readonly labelId: 'widgetLabelPrecision';
+        readonly helpId: 'widgetHintPrecision';
+        readonly doc: 'Decimal places to round displayed values to. Unset shows the raw value.';
+    };
+    readonly flashOnChange: {
+        readonly kind: 'boolean';
+        readonly labelId: 'widgetFlashOnChange';
+        readonly helpId: 'widgetFlashOnChangeHint';
+        readonly doc: 'Briefly tint a value green on a rise and red on a fall when it changes.';
+    };
+    readonly window: {
+        readonly kind: 'number';
+        readonly integer: true;
+        readonly min: 1;
+        readonly labelId: 'widgetLabelWindow';
+        readonly helpId: 'widgetHintWindow';
+        readonly doc: 'Samples retained across ALL of the widget\'s measurements before the oldest are dropped. Bounds memory; only the chart draws them. Default 300.';
+    };
+}>;

package/dist/widgets/time-series-chart.d.ts

@@ -1,2 +1,17 @@
-import { type WidgetProps } from '../widget';
+import { type WidgetProps } from '@devicechain/widget-sdk';
 export declare function TimeSeriesChart({ widget, data }: WidgetProps): import("react").JSX.Element;
+export declare const timeSeriesChartWidget: import("@devicechain/widget-sdk").WidgetDefinition<"measurement", {
+    readonly title: {
+        readonly kind: 'string';
+        readonly labelId: 'widgetLabelTitle';
+        readonly doc: 'Heading shown in the widget frame. Blank hides the frame heading.';
+    };
+    readonly window: {
+        readonly kind: 'number';
+        readonly integer: true;
+        readonly min: 1;
+        readonly labelId: 'widgetLabelWindow';
+        readonly helpId: 'widgetHintWindow';
+        readonly doc: 'Samples retained across ALL of the widget\'s measurements before the oldest are dropped. Bounds memory; only the chart draws them. Default 300.';
+    };
+}>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@devicechain/widgets",
-  "version": "0.19.0-rc.1",
-  "description": "DeviceChain presentational dashboard widgets across five channels — telemetry (time-series chart + gauge over Apache ECharts, latest card, table, label, image), alarm (table, count), control (command button), selection (entity selector), and location (map over MapLibre GL, lazily loaded, tile source supplied by the host app) — plus the renderer that lays them out. Themed via CSS custom properties, no Tailwind leakage.",
+  "version": "0.20.0-rc.4",
+  "description": "DeviceChain's built-in dashboard widgets across six channels — telemetry (time-series chart + gauge over Apache ECharts, latest card, table), static (label, image; no data), alarm (table, count), control (command button), selection (entity selector), and location (map over MapLibre GL, lazily loaded, tile source supplied by the host app) — plus the renderer that lays them out. Each is a registration built on @devicechain/widget-sdk. Themed via CSS custom properties, no Tailwind leakage.",
   "keywords": [
     "devicechain",
     "iot",
@@ -49,29 +49,30 @@
     "pretest": "node ../../scripts/build-packages.mjs",
     "test": "vitest run"
   },
-  "dependencies": {
-    "echarts": "^6.0.0"
-  },
   "peerDependencies": {
-    "@devicechain/client": "0.19.0-rc.1",
-    "@devicechain/dashboards": "0.19.0-rc.1",
-    "maplibre-gl": "^6.7.0",
-    "react": "^19.2.8",
-    "react-dom": "^19.2.8"
+    "@devicechain/client": "0.20.0-rc.4",
+    "@devicechain/dashboards": "0.20.0-rc.4",
+    "@devicechain/widget-sdk": "0.20.0-rc.4",
+    "echarts": "^6.0.0",
+    "maplibre-gl": "^6.11.2",
+    "react": "^19.3.0",
+    "react-dom": "^19.3.0"
   },
   "devDependencies": {
-    "@devicechain/client": "0.19.0-rc.1",
-    "@devicechain/dashboards": "0.19.0-rc.1",
+    "@devicechain/client": "0.20.0-rc.4",
+    "@devicechain/dashboards": "0.20.0-rc.4",
+    "@devicechain/widget-sdk": "0.20.0-rc.4",
     "@testing-library/react": "^16.3.3",
-    "@types/node": "^26.4.1",
-    "@types/react": "^19.2.18",
-    "@types/react-dom": "^19.2.7",
+    "@types/node": "^26.6.4",
+    "@types/react": "^19.3.0",
+    "@types/react-dom": "^19.3.0",
+    "echarts": "^6.0.0",
     "esbuild": "^0.28.2",
-    "jsdom": "^30.0.1",
-    "maplibre-gl": "^6.7.0",
-    "react": "^19.2.8",
-    "react-dom": "^19.2.8",
+    "jsdom": "^30.1.1",
+    "maplibre-gl": "^6.11.2",
+    "react": "^19.3.0",
+    "react-dom": "^19.3.0",
     "typescript": "~7.0.2",
-    "vitest": "^5.0.0"
+    "vitest": "^5.0.3"
   }
 }

package/dist/chart-options.d.ts

@@ -1,14 +0,0 @@
-import type { MeasurementSample } from '@devicechain/dashboards';
-import type { EChartOption } from './echart';
-import type { ElementSize } from './hooks';
-import type { ChartTheme } from './theme';
-export interface LineChartOptions {
-    measurements?: string[];
-}
-export declare function buildLineOption(samples: MeasurementSample[], theme: ChartTheme, options?: LineChartOptions, size?: ElementSize): EChartOption;
-export interface GaugeChartOptions {
-    min?: number;
-    max?: number;
-    unit?: string;
-}
-export declare function buildGaugeOption(value: number | null, theme: ChartTheme, options?: GaugeChartOptions, size?: ElementSize): EChartOption;

package/dist/echart.d.ts

@@ -1,8 +0,0 @@
-import * as echarts from 'echarts/core';
-export type EChartOption = echarts.EChartsCoreOption;
-export interface EChartProps {
-    option: EChartOption;
-    className?: string;
-    style?: React.CSSProperties;
-}
-export declare function EChart({ option, className, style }: EChartProps): import("react").JSX.Element;

package/dist/flash.d.ts

@@ -1,13 +0,0 @@
-import { type CSSProperties } from 'react';
-export type FlashDirection = 'up' | 'down' | null;
-export declare function useFlashOnChange(value: number | null | undefined, enabled: boolean, identity?: string | number): FlashDirection;
-export declare function flashTextStyle(direction: FlashDirection, fadeMs?: number): CSSProperties;
-export declare function flashBackgroundStyle(direction: FlashDirection, fadeMs?: number): CSSProperties;
-export declare function FlashValue({ value, precision, enabled, identity, baseColor, style, }: {
-    value: number | null | undefined;
-    precision?: number;
-    enabled: boolean;
-    identity?: string | number;
-    baseColor?: string;
-    style?: CSSProperties;
-}): import("react").JSX.Element;

package/dist/format.d.ts

@@ -1,3 +0,0 @@
-export declare function formatTimestamp(iso: string | null): string;
-export declare function formatDateTime(iso: string | null): string;
-export declare function formatValue(value: number | null | undefined, precision?: number): string;

package/dist/frame.d.ts

@@ -1,25 +0,0 @@
-import { type CSSProperties, type ReactNode } from 'react';
-import type { SelectionCandidate, SelectionTarget } from '@devicechain/dashboards';
-export declare function WidgetSubjectProvider({ label, children, }: {
-    label: string | undefined;
-    children: ReactNode;
-}): import("react").JSX.Element;
-export type WidgetSelect = (target: SelectionTarget) => void;
-export declare function WidgetSelectProvider({ select, children, }: {
-    select: WidgetSelect | undefined;
-    children: ReactNode;
-}): import("react").JSX.Element;
-export declare function useWidgetSelect(): WidgetSelect | undefined;
-export type WidgetCandidates = (slot: string) => Promise<SelectionCandidate[]>;
-export declare function WidgetCandidatesProvider({ candidates, children, }: {
-    candidates: WidgetCandidates | undefined;
-    children: ReactNode;
-}): import("react").JSX.Element;
-export declare function useWidgetCandidates(): WidgetCandidates | undefined;
-export interface WidgetFrameProps {
-    title?: string;
-    subtitle?: string;
-    children: ReactNode;
-    bodyStyle?: CSSProperties;
-}
-export declare function WidgetFrame({ title, subtitle, children, bodyStyle }: WidgetFrameProps): import("react").JSX.Element;

package/dist/hooks.d.ts

@@ -1,54 +0,0 @@
-import type { AlarmRow, AlarmSubscription, CommandRow, CommandSubscription, DashboardDefinition, DatasourceSelector, EntityCandidateLister, LocationSample, LocationSubscription, MemberResolver, MeasurementSample, SelectionCandidate, SlotBinding, WidgetDataSource } from '@devicechain/dashboards';
-import { type RefObject } from 'react';
-import { type WidgetCandidates } from './frame';
-import { type ChartTheme } from './theme';
-export declare function useResolvedBindings(definition: DashboardDefinition, base: Record<string, SlotBinding>, selection: Record<string, SlotBinding>, resolver: MemberResolver): Record<string, SlotBinding>;
-export declare function useSlotCandidates(definition: DashboardDefinition, bindings: Record<string, SlotBinding>, resolver: MemberResolver, lister: EntityCandidateLister | undefined): WidgetCandidates | undefined;
-export interface CandidatesState {
-    candidates: SelectionCandidate[];
-    loading: boolean;
-    error: unknown | null;
-    wired: boolean;
-}
-export declare function useCandidates(slot: string | undefined): CandidatesState;
-export interface MeasurementStreamState {
-    latest: Record<string, MeasurementSample>;
-    samples: MeasurementSample[];
-    error: unknown | null;
-}
-export interface AlarmStreamState {
-    alarms: AlarmRow[];
-    total: number;
-    loading: boolean;
-    error: unknown | null;
-}
-export interface CommandStreamState {
-    deviceToken: string | null;
-    commands: CommandRow[];
-    total: number;
-    loading: boolean;
-    error: unknown | null;
-}
-export interface LocationStreamState {
-    locations: LocationSample[];
-    deviceTokens: string[];
-    forbidden: boolean;
-    loading: boolean;
-    error: unknown | null;
-}
-export interface MeasurementStreamOptions {
-    window?: number;
-    initialSamples?: MeasurementSample[];
-}
-export declare function useMeasurementStream(hub: WidgetDataSource, datasource: DatasourceSelector | undefined, options?: MeasurementStreamOptions): MeasurementStreamState;
-export declare function useAlarmStream(hub: WidgetDataSource, subscription: AlarmSubscription): AlarmStreamState;
-export declare function useCommandStream(hub: WidgetDataSource, subscription: CommandSubscription): CommandStreamState;
-export declare function useLocationStream(hub: WidgetDataSource, subscription: LocationSubscription): LocationStreamState;
-export type DatasourceAvailability = 'unknown' | 'available' | 'unavailable';
-export declare function useDatasourceAvailability(hub: WidgetDataSource, datasource: DatasourceSelector | undefined): DatasourceAvailability;
-export interface ElementSize {
-    width: number;
-    height: number;
-}
-export declare function useElementSize<T extends HTMLElement>(): [RefObject<T | null>, ElementSize];
-export declare function useChartTheme(): ChartTheme;

package/dist/theme.d.ts

@@ -1,9 +0,0 @@
-export declare function css(name: ThemeVar): string;
-export type ThemeVar = 'background' | 'foreground' | 'card' | 'card-foreground' | 'muted' | 'muted-foreground' | 'primary' | 'border' | 'destructive';
-export interface ChartTheme {
-    foreground: string;
-    mutedForeground: string;
-    border: string;
-    series: string[];
-}
-export declare function resolveChartTheme(el: Element): ChartTheme;

package/dist/widget.d.ts

@@ -1,16 +0,0 @@
-import type { MeasurementSample, WidgetActions, WidgetInstance } from '@devicechain/dashboards';
-import type { ComponentType } from 'react';
-import type { MeasurementStreamState } from './hooks';
-export interface WidgetProps<D = MeasurementStreamState> {
-    widget: WidgetInstance;
-    data: D;
-    actions?: WidgetActions;
-}
-export type WidgetComponent<D = MeasurementStreamState> = ComponentType<WidgetProps<D>>;
-export declare function pickSample(latest: Record<string, MeasurementSample>, name: string | undefined): MeasurementSample | undefined;
-type Options = Record<string, unknown> | undefined;
-export declare function optString(options: Options, key: string): string | undefined;
-export declare function optNumber(options: Options, key: string): number | undefined;
-export declare function optBoolean(options: Options, key: string): boolean;
-export declare function primaryMeasurementName(widget: WidgetInstance): string | undefined;
-export {};