@devicechain/widget-sdk 0.0.0-bootstrap.0 → 0.0.0-stage

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/echarts.js DELETED
@@ -1,193 +0,0 @@
1
- import {
2
- useWidgetThemeRoot
3
- } from "./chunks/chunk-CC2V7LVI.js";
4
-
5
- // src/chart/echart.tsx
6
- import { GaugeChart, LineChart } from "echarts/charts";
7
- import { GridComponent, TooltipComponent } from "echarts/components";
8
- import * as echarts from "echarts/core";
9
- import { CanvasRenderer } from "echarts/renderers";
10
- import { useEffect, useRef } from "react";
11
- import { jsx } from "react/jsx-runtime";
12
- echarts.use([LineChart, GaugeChart, GridComponent, TooltipComponent, CanvasRenderer]);
13
- function EChart({ option, className, style }) {
14
- const containerRef = useRef(null);
15
- const chartRef = useRef(null);
16
- useEffect(() => {
17
- const el = containerRef.current;
18
- if (!el) return;
19
- const chart = echarts.init(el);
20
- chartRef.current = chart;
21
- const observer = new ResizeObserver(() => chart.resize());
22
- observer.observe(el);
23
- return () => {
24
- observer.disconnect();
25
- chart.dispose();
26
- chartRef.current = null;
27
- };
28
- }, []);
29
- useEffect(() => {
30
- chartRef.current?.setOption(option, { notMerge: true });
31
- }, [option]);
32
- return /* @__PURE__ */ jsx("div", { ref: containerRef, className, style: { width: "100%", height: "100%", ...style } });
33
- }
34
-
35
- // src/chart/chart-options.ts
36
- function distinctNames(samples) {
37
- const seen = [];
38
- for (const s of samples) {
39
- if (!seen.includes(s.name)) seen.push(s.name);
40
- }
41
- return seen;
42
- }
43
- var clamp = (v, lo, hi) => Math.max(lo, Math.min(hi, v));
44
- function shortSide(size) {
45
- const s = Math.min(size?.width ?? 0, size?.height ?? 0);
46
- return s > 0 ? s : 200;
47
- }
48
- function buildLineOption(samples, theme, options = {}, size) {
49
- const names = options.measurements?.length ? options.measurements : distinctNames(samples);
50
- const axisFont = clamp(Math.round(shortSide(size) / 22), 8, 12);
51
- const series = names.map((name, i) => {
52
- const color = theme.series[i % theme.series.length];
53
- return {
54
- name,
55
- type: "line",
56
- showSymbol: false,
57
- lineStyle: { color },
58
- itemStyle: { color },
59
- data: samples.filter((s) => s.name === name && s.value != null && s.occurredTime != null).map((s) => [s.occurredTime, s.value])
60
- };
61
- });
62
- return {
63
- animation: false,
64
- textStyle: { color: theme.foreground, fontSize: axisFont },
65
- grid: { left: 8, right: 12, top: names.length > 1 ? 28 : 12, bottom: 8, containLabel: true },
66
- tooltip: { trigger: "axis" },
67
- legend: names.length > 1 ? { textStyle: { color: theme.mutedForeground, fontSize: axisFont }, top: 0 } : void 0,
68
- xAxis: {
69
- type: "time",
70
- axisLine: { lineStyle: { color: theme.border } },
71
- axisLabel: { color: theme.mutedForeground, fontSize: axisFont, hideOverlap: true }
72
- },
73
- yAxis: {
74
- type: "value",
75
- splitLine: { lineStyle: { color: theme.border } },
76
- axisLabel: { color: theme.mutedForeground, fontSize: axisFont }
77
- },
78
- series
79
- };
80
- }
81
- function buildGaugeOption(value, theme, options = {}, size) {
82
- const min = options.min ?? 0;
83
- const max = options.max ?? 100;
84
- const accent = theme.series[0];
85
- const unitSuffix = options.unit ? ` ${options.unit}` : "";
86
- const s = shortSide(size);
87
- const arcWidth = clamp(Math.round(s / 26), 4, 12);
88
- const labelFont = clamp(Math.round(s / 20), 8, 13);
89
- const valueFont = clamp(Math.round(s / 7), 14, 40);
90
- return {
91
- animation: false,
92
- series: [
93
- {
94
- type: "gauge",
95
- min,
96
- max,
97
- splitNumber: s < 160 ? 4 : 5,
98
- // fewer ticks than the default 10 → no cram
99
- radius: "95%",
100
- center: ["50%", "58%"],
101
- progress: { show: true, width: arcWidth, itemStyle: { color: accent } },
102
- pointer: { itemStyle: { color: accent }, length: "55%", width: clamp(Math.round(s / 50), 2, 6) },
103
- anchor: { show: false },
104
- axisLine: { lineStyle: { width: arcWidth, color: [[1, theme.border]] } },
105
- axisTick: { show: false },
106
- splitLine: { length: arcWidth, lineStyle: { color: theme.border, width: 1 } },
107
- axisLabel: { color: theme.mutedForeground, fontSize: labelFont, distance: arcWidth + 2 },
108
- detail: {
109
- valueAnimation: false,
110
- color: theme.foreground,
111
- fontSize: valueFont,
112
- offsetCenter: [0, "30%"],
113
- formatter: (v) => value == null ? "\u2014" : `${v}${unitSuffix}`
114
- },
115
- data: [{ value: value ?? min }]
116
- }
117
- ]
118
- };
119
- }
120
-
121
- // src/chart/chart-theme.ts
122
- import { useMemo, useSyncExternalStore } from "react";
123
- var FALLBACK = {
124
- foreground: "hsl(240 10% 3.9%)",
125
- mutedForeground: "hsl(240 3.8% 46.1%)",
126
- border: "hsl(240 5.9% 90%)",
127
- series: [
128
- "hsl(220 70% 50%)",
129
- "hsl(160 60% 45%)",
130
- "hsl(30 80% 55%)",
131
- "hsl(280 65% 60%)",
132
- "hsl(340 75% 55%)"
133
- ]
134
- };
135
- function readVar(style, name, fallback) {
136
- const raw = style.getPropertyValue(`--${name}`).trim();
137
- return raw ? `hsl(${raw})` : fallback;
138
- }
139
- function resolveChartTheme(el) {
140
- const style = getComputedStyle(el);
141
- return {
142
- foreground: readVar(style, "foreground", FALLBACK.foreground),
143
- mutedForeground: readVar(style, "muted-foreground", FALLBACK.mutedForeground),
144
- border: readVar(style, "border", FALLBACK.border),
145
- series: FALLBACK.series.map((fallback, i) => readVar(style, `chart-${i + 1}`, fallback))
146
- };
147
- }
148
- var sharedTheme = null;
149
- var themeListeners = /* @__PURE__ */ new Set();
150
- var themeObserver = null;
151
- function recomputeTheme() {
152
- sharedTheme = resolveChartTheme(document.documentElement);
153
- }
154
- function subscribeTheme(listener) {
155
- if (!themeObserver) {
156
- recomputeTheme();
157
- themeObserver = new MutationObserver(() => {
158
- recomputeTheme();
159
- for (const l of themeListeners) l();
160
- });
161
- themeObserver.observe(document.documentElement, {
162
- attributes: true,
163
- attributeFilter: ["class", "style"]
164
- });
165
- }
166
- themeListeners.add(listener);
167
- return () => {
168
- themeListeners.delete(listener);
169
- if (themeListeners.size === 0 && themeObserver) {
170
- themeObserver.disconnect();
171
- themeObserver = null;
172
- sharedTheme = null;
173
- }
174
- };
175
- }
176
- function getThemeSnapshot() {
177
- if (!sharedTheme) recomputeTheme();
178
- return sharedTheme;
179
- }
180
- function useChartTheme() {
181
- const shared = useSyncExternalStore(subscribeTheme, getThemeSnapshot, getThemeSnapshot);
182
- const root = useWidgetThemeRoot();
183
- const scoped = useMemo(() => root ? resolveChartTheme(root) : null, [root]);
184
- return scoped ?? shared;
185
- }
186
- export {
187
- EChart,
188
- buildGaugeOption,
189
- buildLineOption,
190
- resolveChartTheme,
191
- useChartTheme
192
- };
193
- //# sourceMappingURL=echarts.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../src/chart/echart.tsx", "../src/chart/chart-options.ts", "../src/chart/chart-theme.ts"],
4
- "sourcesContent": ["// Copyright The DeviceChain Authors\n// SPDX-License-Identifier: Apache-2.0\n\n// A thin React wrapper over Apache ECharts (ADR-039 chart engine).\n//\n// It imports from echarts/core and registers ONLY the chart types + components the\n// widgets use (line + gauge, grid/tooltip, canvas renderer) \u2014 tree-shaking away the\n// rest of ECharts so the bundle carries only what a dashboard needs. The wrapper\n// owns the imperative lifecycle: init on mount, setOption on change, resize with the\n// container, dispose on unmount.\n\nimport { GaugeChart, LineChart } from 'echarts/charts';\nimport { GridComponent, TooltipComponent } from 'echarts/components';\nimport * as echarts from 'echarts/core';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { useEffect, useRef } from 'react';\n\necharts.use([LineChart, GaugeChart, GridComponent, TooltipComponent, CanvasRenderer]);\n\n// A resolved ECharts option object (the shape echarts.setOption accepts). Widgets\n// build these with the pure builders in chart-options.ts.\nexport type EChartOption = echarts.EChartsCoreOption;\n\nexport interface EChartProps {\n option: EChartOption;\n className?: string;\n style?: React.CSSProperties;\n}\n\n// EChart fills its parent; the dashboard canvas sizes the parent, and a\n// ResizeObserver keeps the chart matched to it.\nexport function EChart({ option, className, style }: EChartProps) {\n const containerRef = useRef<HTMLDivElement>(null);\n const chartRef = useRef<echarts.ECharts | null>(null);\n\n // Init + teardown once for the element's lifetime.\n useEffect(() => {\n const el = containerRef.current;\n if (!el) return;\n\n const chart = echarts.init(el);\n chartRef.current = chart;\n\n const observer = new ResizeObserver(() => chart.resize());\n observer.observe(el);\n\n return () => {\n observer.disconnect();\n chart.dispose();\n chartRef.current = null;\n };\n }, []);\n\n // Re-apply the option whenever it changes. notMerge:true so a shrinking series\n // (rolling window) doesn't leave stale points behind.\n useEffect(() => {\n chartRef.current?.setOption(option, { notMerge: true });\n }, [option]);\n\n return (\n <div ref={containerRef} className={className} style={{ width: '100%', height: '100%', ...style }} />\n );\n}\n", "// Copyright The DeviceChain Authors\n// SPDX-License-Identifier: Apache-2.0\n\n// Pure ECharts option builders. Kept free of React/DOM so the data\u2192chart mapping\n// is unit-testable without a canvas: a widget resolves a ChartTheme + samples and\n// hands the result straight to <EChart>.\n\nimport type { MeasurementSample } from '@devicechain/dashboards';\n\nimport type { ElementSize } from '../hooks';\n\nimport type { ChartTheme } from './chart-theme';\nimport type { EChartOption } from './echart';\n\n// distinctNames returns the measurement names present in `samples`, in first-seen\n// order \u2014 used when a chart's datasource doesn't pin an explicit series list.\nfunction distinctNames(samples: MeasurementSample[]): string[] {\n const seen: string[] = [];\n for (const s of samples) {\n if (!seen.includes(s.name)) seen.push(s.name);\n }\n return seen;\n}\n\nconst clamp = (v: number, lo: number, hi: number): number => Math.max(lo, Math.min(hi, v));\n\n// gauge/line fonts and tick counts scale with the smaller container dimension so a\n// widget stays legible when resized. A zero/absent size (before first measure, or\n// in a non-DOM test) falls back to a nominal medium size.\nfunction shortSide(size?: ElementSize): number {\n const s = Math.min(size?.width ?? 0, size?.height ?? 0);\n return s > 0 ? s : 200;\n}\n\nexport interface LineChartOptions {\n // Measurement names to plot, one series each. Empty \u2192 every name seen in the\n // window (first-seen order).\n measurements?: string[];\n}\n\n// buildLineOption maps a rolling window of samples to a multi-series time chart,\n// one line per measurement name, coloured from the theme's chart palette.\nexport function buildLineOption(\n samples: MeasurementSample[],\n theme: ChartTheme,\n options: LineChartOptions = {},\n size?: ElementSize,\n): EChartOption {\n const names = options.measurements?.length ? options.measurements : distinctNames(samples);\n const axisFont = clamp(Math.round(shortSide(size) / 22), 8, 12);\n\n const series = names.map((name, i) => {\n const color = theme.series[i % theme.series.length];\n return {\n name,\n type: 'line' as const,\n showSymbol: false,\n lineStyle: { color },\n itemStyle: { color },\n data: samples\n .filter((s) => s.name === name && s.value != null && s.occurredTime != null)\n .map((s) => [s.occurredTime as string, s.value as number]),\n };\n });\n\n return {\n animation: false,\n textStyle: { color: theme.foreground, fontSize: axisFont },\n grid: { left: 8, right: 12, top: names.length > 1 ? 28 : 12, bottom: 8, containLabel: true },\n tooltip: { trigger: 'axis' },\n legend:\n names.length > 1 ? { textStyle: { color: theme.mutedForeground, fontSize: axisFont }, top: 0 } : undefined,\n xAxis: {\n type: 'time',\n axisLine: { lineStyle: { color: theme.border } },\n axisLabel: { color: theme.mutedForeground, fontSize: axisFont, hideOverlap: true },\n },\n yAxis: {\n type: 'value',\n splitLine: { lineStyle: { color: theme.border } },\n axisLabel: { color: theme.mutedForeground, fontSize: axisFont },\n },\n series,\n };\n}\n\nexport interface GaugeChartOptions {\n min?: number;\n max?: number;\n unit?: string;\n}\n\n// buildGaugeOption maps a single latest value to a gauge. A null value (nothing\n// received yet) shows an em dash and rests the needle at the minimum. Ticks, fonts,\n// and the arc width scale with the widget size so it stays legible when resized\n// (ECharts' default gauge crams ~10 labels at fixed fonts on a small canvas).\nexport function buildGaugeOption(\n value: number | null,\n theme: ChartTheme,\n options: GaugeChartOptions = {},\n size?: ElementSize,\n): EChartOption {\n const min = options.min ?? 0;\n const max = options.max ?? 100;\n const accent = theme.series[0];\n const unitSuffix = options.unit ? ` ${options.unit}` : '';\n\n const s = shortSide(size);\n const arcWidth = clamp(Math.round(s / 26), 4, 12);\n const labelFont = clamp(Math.round(s / 20), 8, 13);\n const valueFont = clamp(Math.round(s / 7), 14, 40);\n\n return {\n animation: false,\n series: [\n {\n type: 'gauge',\n min,\n max,\n splitNumber: s < 160 ? 4 : 5, // fewer ticks than the default 10 \u2192 no cram\n radius: '95%',\n center: ['50%', '58%'],\n progress: { show: true, width: arcWidth, itemStyle: { color: accent } },\n pointer: { itemStyle: { color: accent }, length: '55%', width: clamp(Math.round(s / 50), 2, 6) },\n anchor: { show: false },\n axisLine: { lineStyle: { width: arcWidth, color: [[1, theme.border]] } },\n axisTick: { show: false },\n splitLine: { length: arcWidth, lineStyle: { color: theme.border, width: 1 } },\n axisLabel: { color: theme.mutedForeground, fontSize: labelFont, distance: arcWidth + 2 },\n detail: {\n valueAnimation: false,\n color: theme.foreground,\n fontSize: valueFont,\n offsetCenter: [0, '30%'],\n formatter: (v: number) => (value == null ? '\u2014' : `${v}${unitSuffix}`),\n },\n data: [{ value: value ?? min }],\n },\n ],\n };\n}\n", "// Copyright The DeviceChain Authors\n// SPDX-License-Identifier: Apache-2.0\n\n// The chart colour theme: concrete colours resolved from the host's CSS custom properties,\n// because an ECharts canvas cannot resolve `var(--x)`. Pure DOM + React, no echarts import,\n// but it lives on the `/echarts` subpath with the rest of the chart helpers so the SDK root\n// stays chart-free.\n\nimport { useMemo, useSyncExternalStore } from 'react';\n\nimport { useWidgetThemeRoot } from '../context';\n\n// Concrete colors for an ECharts canvas, resolved from the CSS variables in scope\n// at a given element (charts can't use CSS vars directly).\nexport interface ChartTheme {\n foreground: string;\n mutedForeground: string;\n border: string;\n series: string[];\n}\n\n// Fallbacks used when a variable is absent (e.g. jsdom, or a host that hasn't set\n// the token) so a chart still renders in sensible default colors.\nconst FALLBACK: ChartTheme = {\n foreground: 'hsl(240 10% 3.9%)',\n mutedForeground: 'hsl(240 3.8% 46.1%)',\n border: 'hsl(240 5.9% 90%)',\n series: [\n 'hsl(220 70% 50%)',\n 'hsl(160 60% 45%)',\n 'hsl(30 80% 55%)',\n 'hsl(280 65% 60%)',\n 'hsl(340 75% 55%)',\n ],\n};\n\nfunction readVar(style: CSSStyleDeclaration, name: string, fallback: string): string {\n const raw = style.getPropertyValue(`--${name}`).trim();\n return raw ? `hsl(${raw})` : fallback;\n}\n\n// resolveChartTheme reads the theme tokens in scope at `el` into concrete colors\n// for ECharts. Reading at the element (not the document root) means a widget\n// nested under a re-themed subtree picks up the local override.\nexport function resolveChartTheme(el: Element): ChartTheme {\n const style = getComputedStyle(el);\n return {\n foreground: readVar(style, 'foreground', FALLBACK.foreground),\n mutedForeground: readVar(style, 'muted-foreground', FALLBACK.mutedForeground),\n border: readVar(style, 'border', FALLBACK.border),\n series: FALLBACK.series.map((fallback, i) => readVar(style, `chart-${i + 1}`, fallback)),\n };\n}\n\n// --- shared chart-theme store ------------------------------------------------\n//\n// Charts need concrete colors resolved from the CSS-variable theme. Rather than\n// have every chart widget mount its own MutationObserver on <html> and recompute\n// the same theme, one page-wide observer resolves it once per change and every\n// widget reads the shared, memoized value via useSyncExternalStore \u2014 so a busy\n// dashboard pays O(1), not O(number of charts), per theme toggle.\n\nlet sharedTheme: ChartTheme | null = null;\nconst themeListeners = new Set<() => void>();\nlet themeObserver: MutationObserver | null = null;\n\nfunction recomputeTheme(): void {\n sharedTheme = resolveChartTheme(document.documentElement);\n}\n\nfunction subscribeTheme(listener: () => void): () => void {\n if (!themeObserver) {\n recomputeTheme();\n themeObserver = new MutationObserver(() => {\n recomputeTheme();\n for (const l of themeListeners) l();\n });\n themeObserver.observe(document.documentElement, {\n attributes: true,\n attributeFilter: ['class', 'style'],\n });\n }\n themeListeners.add(listener);\n return () => {\n themeListeners.delete(listener);\n if (themeListeners.size === 0 && themeObserver) {\n themeObserver.disconnect();\n themeObserver = null;\n sharedTheme = null;\n }\n };\n}\n\nfunction getThemeSnapshot(): ChartTheme {\n if (!sharedTheme) recomputeTheme();\n return sharedTheme as ChartTheme;\n}\n\n// useChartTheme returns the current chart colors and re-renders the caller when\n// the document theme changes (a light/dark class or inline-style swap on <html>).\nexport function useChartTheme(): ChartTheme {\n const shared = useSyncExternalStore(subscribeTheme, getThemeSnapshot, getThemeSnapshot);\n // A host that scopes its tokens to a container says so (WidgetThemeRoot); its tokens are\n // fixed for the container's life, so they are read once there rather than observed.\n const root = useWidgetThemeRoot();\n const scoped = useMemo(() => (root ? resolveChartTheme(root) : null), [root]);\n return scoped ?? shared;\n}\n"],
5
- "mappings": "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",
6
- "names": []
7
- }
package/dist/flash.d.ts DELETED
@@ -1,13 +0,0 @@
1
- import { type CSSProperties } from 'react';
2
- export type FlashDirection = 'up' | 'down' | null;
3
- export declare function useFlashOnChange(value: number | null | undefined, enabled: boolean, identity?: string | number): FlashDirection;
4
- export declare function flashTextStyle(direction: FlashDirection, fadeMs?: number): CSSProperties;
5
- export declare function flashBackgroundStyle(direction: FlashDirection, fadeMs?: number): CSSProperties;
6
- export declare function FlashValue({ value, precision, enabled, identity, baseColor, style, }: {
7
- value: number | null | undefined;
8
- precision?: number;
9
- enabled: boolean;
10
- identity?: string | number;
11
- baseColor?: string;
12
- style?: CSSProperties;
13
- }): import("react").JSX.Element;
package/dist/format.d.ts DELETED
@@ -1,3 +0,0 @@
1
- export declare function formatTimestamp(iso: string | null, timeZone?: string): string;
2
- export declare function formatDateTime(iso: string | null, timeZone?: string): string;
3
- export declare function formatValue(value: number | null | undefined, precision?: number): string;
package/dist/frame.d.ts DELETED
@@ -1,8 +0,0 @@
1
- import { type CSSProperties, type ReactNode } from 'react';
2
- export interface WidgetFrameProps {
3
- title?: string;
4
- subtitle?: string;
5
- children: ReactNode;
6
- bodyStyle?: CSSProperties;
7
- }
8
- export declare function WidgetFrame({ title, subtitle, children, bodyStyle }: WidgetFrameProps): import("react").JSX.Element;
package/dist/hooks.d.ts DELETED
@@ -1,31 +0,0 @@
1
- import type { AlarmSubscription, CommandSubscription, DashboardDefinition, DatasourceSelector, DeviceResolver, EntityCandidateLister, LocationSubscription, MemberResolver, MeasurementSample, SelectionCandidate, SlotBinding, WidgetDataSource } from '@devicechain/dashboards';
2
- import type { AlarmStreamState, CommandStreamState, LocationStreamState, MeasurementStreamState } from '@devicechain/dashboards';
3
- import { DashboardHub } from '@devicechain/dashboards';
4
- import { type RefObject } from 'react';
5
- import { type WidgetCandidates } from './context';
6
- export type { AlarmStreamState, CommandStreamState, LocationStreamState, MeasurementStreamState };
7
- export declare function useDashboardHub(resolver: DeviceResolver, authorities: string[] | undefined): DashboardHub;
8
- export declare function useResolvedBindings(definition: DashboardDefinition, base: Record<string, SlotBinding>, selection: Record<string, SlotBinding>, resolver: MemberResolver): Record<string, SlotBinding>;
9
- export declare function useSlotCandidates(definition: DashboardDefinition, bindings: Record<string, SlotBinding>, resolver: MemberResolver, lister: EntityCandidateLister | undefined): WidgetCandidates | undefined;
10
- export interface CandidatesState {
11
- candidates: SelectionCandidate[];
12
- loading: boolean;
13
- error: unknown | null;
14
- wired: boolean;
15
- }
16
- export declare function useCandidates(slot: string | undefined): CandidatesState;
17
- export interface MeasurementStreamOptions {
18
- window?: number;
19
- initialSamples?: MeasurementSample[];
20
- }
21
- export declare function useMeasurementStream(hub: WidgetDataSource, datasource: DatasourceSelector | undefined, options?: MeasurementStreamOptions): MeasurementStreamState;
22
- export declare function useAlarmStream(hub: WidgetDataSource, subscription: AlarmSubscription): AlarmStreamState;
23
- export declare function useCommandStream(hub: WidgetDataSource, subscription: CommandSubscription): CommandStreamState;
24
- export declare function useLocationStream(hub: WidgetDataSource, subscription: LocationSubscription): LocationStreamState;
25
- export type DatasourceAvailability = 'unknown' | 'available' | 'unavailable';
26
- export declare function useDatasourceAvailability(hub: WidgetDataSource, datasource: DatasourceSelector | undefined): DatasourceAvailability;
27
- export interface ElementSize {
28
- width: number;
29
- height: number;
30
- }
31
- export declare function useElementSize<T extends HTMLElement>(): [RefObject<T | null>, ElementSize];
package/dist/index.d.ts DELETED
@@ -1,12 +0,0 @@
1
- export { defineWidget } from './define-widget';
2
- export type { ErasedComponent, ErasedWidgetDefinition, WidgetDefinition, WidgetImplementation } from './define-widget';
3
- export { createWidgetRegistry, WidgetRegistryError, type WidgetRegistry } from './registry';
4
- export type { EditorCommandChoice, EditorCommandChoices, WidgetComponent, WidgetEditorProps, WidgetEditorServices, WidgetProps, } from './widget';
5
- export { WidgetCandidatesProvider, WidgetSelectProvider, WidgetSubjectProvider, WidgetThemeRootProvider, WidgetTimeZoneProvider, useWidgetCandidates, useWidgetSelect, useWidgetSubject, useWidgetThemeRoot, useWidgetTimeZone, type WidgetCandidates, type WidgetSelect, } from './context';
6
- export { WidgetFrame, type WidgetFrameProps } from './frame';
7
- export { css, type ThemeVar } from './theme';
8
- export { formatDateTime, formatTimestamp, formatValue } from './format';
9
- export { FlashValue, flashBackgroundStyle, flashTextStyle, useFlashOnChange, type FlashDirection, } from './flash';
10
- export { optBoolean, optNumber, optString, pickSample, primaryMeasurementName } from './widget-options';
11
- export { useAlarmStream, useCandidates, useCommandStream, useDashboardHub, useDatasourceAvailability, useElementSize, useLocationStream, useMeasurementStream, useResolvedBindings, useSlotCandidates, type AlarmStreamState, type CandidatesState, type CommandStreamState, type DatasourceAvailability, type ElementSize, type LocationStreamState, type MeasurementStreamOptions, type MeasurementStreamState, } from './hooks';
12
- export { SDK_API_VERSION, WidgetCatalogError, defineWidgetDescriptor, isBuiltinWidgetId, isNamespacedWidgetId, validateWidgetDescriptor, type AckOptionRef, type BooleanOptionSpec, type BuiltinWidgetId, type ChannelBindingPolicy, type ChannelSnapshot, type ConstBinding, type DatasourcePolicy, type DatasourceSelectorKind, type DefaultsOf, type DescriptorIssue, type EnumOptionSpec, type GreaterThanConstraint, type NamespacedWidgetId, type NumberOptionRef, type NumberOptionSpec, type OptionConstraint, type OptionSpec, type OptionsOf, type StringOptionRef, type StringOptionSpec, type WidgetCatalog, type WidgetChannel, type WidgetDescriptor, type WidgetDisplay, type WidgetId, type WidgetInteractionDeclaration, type WidgetOptionSpecs, } from '@devicechain/dashboards';