@richardmcquiston01/dashboard-widgets-toolkit 0.8.0 → 0.10.0
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/core.cjs +605 -14
- package/dist/core.cjs.map +1 -1
- package/dist/core.d.cts +134 -3
- package/dist/core.d.ts +134 -3
- package/dist/core.js +583 -15
- package/dist/core.js.map +1 -1
- package/dist/index.cjs +605 -14
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +583 -15
- package/dist/index.js.map +1 -1
- package/dist/react.cjs +1202 -136
- package/dist/react.cjs.map +1 -1
- package/dist/react.d.cts +80 -3
- package/dist/react.d.ts +80 -3
- package/dist/react.js +1202 -136
- package/dist/react.js.map +1 -1
- package/dist/{scale-CrXxawQn.d.cts → scale-N69bo7wo.d.cts} +36 -1
- package/dist/{scale-CrXxawQn.d.ts → scale-N69bo7wo.d.ts} +36 -1
- package/dist/styles.css +173 -0
- package/package.json +1 -1
package/dist/react.d.cts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ReactNode, RefObject } from 'react';
|
|
2
|
-
import { D as DashboardWidget, W as WidgetSize, a as WidgetFill, G as GraphWidgetData, N as NiceDomain, b as WidgetDefinition, c as DetailProviderOptions, d as DetailData, e as DetailQuery, L as Locale, f as DashboardLayout, A as AlertListWidgetData, B as BarListWidgetData, g as GaugeWidgetData, K as KpiWidgetData, T as TableWidgetData, R as ResolvedTableControls, h as TextWidgetData, i as WidgetData, j as ResolveOptions, k as WidgetContext, l as WidgetProviders } from './scale-
|
|
2
|
+
import { D as DashboardWidget, W as WidgetSize, a as WidgetFill, G as GraphWidgetData, N as NiceDomain, b as WidgetDefinition, c as DetailProviderOptions, d as DetailData, e as DetailQuery, L as Locale, f as DashboardLayout, A as AlertListWidgetData, B as BarListWidgetData, g as GaugeWidgetData, K as KpiWidgetData, T as TableWidgetData, R as ResolvedTableControls, h as TextWidgetData, i as WidgetData, j as ResolveOptions, k as WidgetContext, l as WidgetProviders } from './scale-N69bo7wo.cjs';
|
|
3
3
|
|
|
4
4
|
interface WidgetCardProps {
|
|
5
5
|
readonly title: string;
|
|
@@ -37,6 +37,8 @@ interface WidgetCardProps {
|
|
|
37
37
|
* which card scrolled into view. `ResolvedWidgetCard` sets it for you.
|
|
38
38
|
*/
|
|
39
39
|
readonly widgetKey?: string;
|
|
40
|
+
/** Marks the card as being edited (dashed outline); set by `Dashboard`. */
|
|
41
|
+
readonly editing?: boolean;
|
|
40
42
|
/** 2 to 6; default 2. */
|
|
41
43
|
readonly headingLevel?: 2 | 3 | 4 | 5 | 6;
|
|
42
44
|
readonly className?: string;
|
|
@@ -46,7 +48,7 @@ interface WidgetCardProps {
|
|
|
46
48
|
* The frame every widget sits in: title, optional description and actions,
|
|
47
49
|
* a minimize toggle, and loading, empty and error states.
|
|
48
50
|
*/
|
|
49
|
-
declare function WidgetCard({ title, description, actions, minimized, onToggleMinimized, onView, status, emptyText, error, onRetry, footer, size, fill, columnSpan, width, widgetKey, headingLevel, className, children, }: WidgetCardProps): ReactNode;
|
|
51
|
+
declare function WidgetCard({ title, description, actions, minimized, onToggleMinimized, onView, status, emptyText, error, onRetry, footer, size, fill, columnSpan, width, widgetKey, editing, headingLevel, className, children, }: WidgetCardProps): ReactNode;
|
|
50
52
|
/** The title to show: alert lists add their total, e.g. "Low stock (3)". */
|
|
51
53
|
declare function widgetTitle(widget: DashboardWidget): string;
|
|
52
54
|
interface ResolvedWidgetCardProps {
|
|
@@ -61,6 +63,8 @@ interface ResolvedWidgetCardProps {
|
|
|
61
63
|
/** See `WidgetCardProps.onView`. */
|
|
62
64
|
readonly onView?: () => void;
|
|
63
65
|
readonly onRetry?: () => void;
|
|
66
|
+
/** See `WidgetCardProps.editing`. */
|
|
67
|
+
readonly editing?: boolean;
|
|
64
68
|
readonly headingLevel?: 2 | 3 | 4 | 5 | 6;
|
|
65
69
|
readonly className?: string;
|
|
66
70
|
}
|
|
@@ -148,7 +152,7 @@ declare function useDetailData(definition: WidgetDefinition, load: DetailLoader
|
|
|
148
152
|
};
|
|
149
153
|
|
|
150
154
|
/** Every element that carries a stable `dwt-*` class, for `classNames`. */
|
|
151
|
-
type DashboardClassSlot = 'dashboard' | 'hiddenBar' | 'grid' | 'card' | 'cardHeader' | 'cardTitle' | 'cardDescription' | 'cardActions' | 'cardBody' | 'cardFooter' | 'button' | 'status' | 'empty' | 'error' | 'text' | 'kpi' | 'gauge' | 'table' | 'barList' | 'alertList' | 'chart' | 'legend' | 'tooltip' | 'tableTwin' | 'detail';
|
|
155
|
+
type DashboardClassSlot = 'dashboard' | 'hiddenBar' | 'toolbar' | 'pageBar' | 'grid' | 'card' | 'cardHeader' | 'cardTitle' | 'cardDescription' | 'cardActions' | 'cardBody' | 'cardFooter' | 'button' | 'status' | 'empty' | 'error' | 'text' | 'kpi' | 'gauge' | 'table' | 'barList' | 'alertList' | 'chart' | 'legend' | 'tooltip' | 'tableTwin' | 'detail';
|
|
152
156
|
/**
|
|
153
157
|
* Extra classes per slot, appended to the `dwt-*` class (never replacing
|
|
154
158
|
* it), e.g. `{ card: 'rounded-lg shadow-sm' }` for Tailwind.
|
|
@@ -167,6 +171,49 @@ interface DashboardLabels {
|
|
|
167
171
|
readonly moveLater: (title: string) => string;
|
|
168
172
|
readonly hiddenWidgets: string;
|
|
169
173
|
readonly minimizedWidgets: string;
|
|
174
|
+
/** Edit mode toolbar (`editMode="toggle"`). */
|
|
175
|
+
readonly customize: string;
|
|
176
|
+
readonly done: string;
|
|
177
|
+
readonly reset: string;
|
|
178
|
+
readonly revertChanges: string;
|
|
179
|
+
readonly confirmReset: string;
|
|
180
|
+
readonly confirmRevert: string;
|
|
181
|
+
/** Accessible names of the inline "✓" and "X" confirmation buttons. */
|
|
182
|
+
readonly confirmYes: string;
|
|
183
|
+
readonly confirmNo: string;
|
|
184
|
+
/** Announced when edit mode starts and ends. */
|
|
185
|
+
readonly editingOn: string;
|
|
186
|
+
readonly editingOff: string;
|
|
187
|
+
/** Names the toolbar group for assistive technology. */
|
|
188
|
+
readonly dashboardControls: string;
|
|
189
|
+
/** The lock icon on a locked card, e.g. "Revenue is locked". */
|
|
190
|
+
readonly locked: (title: string) => string;
|
|
191
|
+
/** The lock icon on a card shown to an administrator (`overrideLocks`). */
|
|
192
|
+
readonly lockedForViewers: (title: string) => string;
|
|
193
|
+
/** Pages: names the tab list, and each tab ("Page 2 of 3: Sales"). */
|
|
194
|
+
readonly pageBar: string;
|
|
195
|
+
readonly pageTabName: (index: number, count: number, title: string) => string;
|
|
196
|
+
readonly previousPageButton: string;
|
|
197
|
+
readonly nextPageButton: string;
|
|
198
|
+
/** Page management while editing. */
|
|
199
|
+
readonly managePages: string;
|
|
200
|
+
readonly addPage: string;
|
|
201
|
+
readonly renamePage: (title: string) => string;
|
|
202
|
+
readonly pageTitle: string;
|
|
203
|
+
readonly savePageTitle: string;
|
|
204
|
+
readonly cancelPageTitle: string;
|
|
205
|
+
readonly deletePage: (title: string) => string;
|
|
206
|
+
readonly confirmDeletePage: (title: string) => string;
|
|
207
|
+
readonly movePageLeft: (title: string) => string;
|
|
208
|
+
readonly movePageRight: (title: string) => string;
|
|
209
|
+
/** The select on each card that moves it to another page. */
|
|
210
|
+
readonly moveToPage: (title: string) => string;
|
|
211
|
+
readonly moveToPagePlaceholder: string;
|
|
212
|
+
readonly moveToPageOption: (title: string, rowsFree: number) => string;
|
|
213
|
+
readonly newPageOption: string;
|
|
214
|
+
readonly movedToPage: (title: string, pageTitle: string) => string;
|
|
215
|
+
readonly pageFull: (pageTitle: string, maxRows: number) => string;
|
|
216
|
+
readonly emptyPage: string;
|
|
170
217
|
/** Added to the accessible name of links that open in a new tab. */
|
|
171
218
|
readonly opensInNewTab: string;
|
|
172
219
|
/** The card's View button, opening the detail view. */
|
|
@@ -237,6 +284,36 @@ interface DashboardProps extends WidgetSettings {
|
|
|
237
284
|
* everyone else (`enforceLocks`). It never changes the locks themselves.
|
|
238
285
|
*/
|
|
239
286
|
readonly overrideLocks?: boolean;
|
|
287
|
+
/**
|
|
288
|
+
* `always` (default): move and hide controls show whenever `onLayoutChange`
|
|
289
|
+
* is set. `toggle`: they show only while editing, behind a Customize
|
|
290
|
+
* button, so a stray click can't rearrange the page. Minimize and its bar
|
|
291
|
+
* work in both modes.
|
|
292
|
+
*/
|
|
293
|
+
readonly editMode?: 'always' | 'toggle';
|
|
294
|
+
/** Controlled editing state (`editMode="toggle"`). */
|
|
295
|
+
readonly editing?: boolean;
|
|
296
|
+
/** Initial editing state when uncontrolled. Default false. */
|
|
297
|
+
readonly defaultEditing?: boolean;
|
|
298
|
+
/** Called when the viewer starts or finishes editing. */
|
|
299
|
+
readonly onEditingChange?: (editing: boolean) => void;
|
|
300
|
+
/** What Reset layout restores. Default: the empty layout (sortOrder order). */
|
|
301
|
+
readonly defaultLayout?: DashboardLayout;
|
|
302
|
+
/** Show the built-in Customize/Done/Reset toolbar (toggle mode). Default true. */
|
|
303
|
+
readonly toolbar?: boolean;
|
|
304
|
+
/**
|
|
305
|
+
* The page in view (a page key) when the layout has pages. Controlled with
|
|
306
|
+
* `onActivePageChange`; without it the dashboard keeps its own, starting on
|
|
307
|
+
* `defaultActivePage` or the first page. Pages never listed fall back to
|
|
308
|
+
* the first.
|
|
309
|
+
*/
|
|
310
|
+
readonly activePage?: string;
|
|
311
|
+
readonly defaultActivePage?: string;
|
|
312
|
+
readonly onActivePageChange?: (pageKey: string) => void;
|
|
313
|
+
/** Rows a page holds unless the page says otherwise. Default 4. */
|
|
314
|
+
readonly maxRows?: number;
|
|
315
|
+
/** Most pages the viewer can add while editing. Default: no limit. */
|
|
316
|
+
readonly maxPages?: number;
|
|
240
317
|
readonly onRetry?: (key: string) => void;
|
|
241
318
|
/**
|
|
242
319
|
* Loads the full data for a widget's detail view (widgets whose definition
|
package/dist/react.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ReactNode, RefObject } from 'react';
|
|
2
|
-
import { D as DashboardWidget, W as WidgetSize, a as WidgetFill, G as GraphWidgetData, N as NiceDomain, b as WidgetDefinition, c as DetailProviderOptions, d as DetailData, e as DetailQuery, L as Locale, f as DashboardLayout, A as AlertListWidgetData, B as BarListWidgetData, g as GaugeWidgetData, K as KpiWidgetData, T as TableWidgetData, R as ResolvedTableControls, h as TextWidgetData, i as WidgetData, j as ResolveOptions, k as WidgetContext, l as WidgetProviders } from './scale-
|
|
2
|
+
import { D as DashboardWidget, W as WidgetSize, a as WidgetFill, G as GraphWidgetData, N as NiceDomain, b as WidgetDefinition, c as DetailProviderOptions, d as DetailData, e as DetailQuery, L as Locale, f as DashboardLayout, A as AlertListWidgetData, B as BarListWidgetData, g as GaugeWidgetData, K as KpiWidgetData, T as TableWidgetData, R as ResolvedTableControls, h as TextWidgetData, i as WidgetData, j as ResolveOptions, k as WidgetContext, l as WidgetProviders } from './scale-N69bo7wo.js';
|
|
3
3
|
|
|
4
4
|
interface WidgetCardProps {
|
|
5
5
|
readonly title: string;
|
|
@@ -37,6 +37,8 @@ interface WidgetCardProps {
|
|
|
37
37
|
* which card scrolled into view. `ResolvedWidgetCard` sets it for you.
|
|
38
38
|
*/
|
|
39
39
|
readonly widgetKey?: string;
|
|
40
|
+
/** Marks the card as being edited (dashed outline); set by `Dashboard`. */
|
|
41
|
+
readonly editing?: boolean;
|
|
40
42
|
/** 2 to 6; default 2. */
|
|
41
43
|
readonly headingLevel?: 2 | 3 | 4 | 5 | 6;
|
|
42
44
|
readonly className?: string;
|
|
@@ -46,7 +48,7 @@ interface WidgetCardProps {
|
|
|
46
48
|
* The frame every widget sits in: title, optional description and actions,
|
|
47
49
|
* a minimize toggle, and loading, empty and error states.
|
|
48
50
|
*/
|
|
49
|
-
declare function WidgetCard({ title, description, actions, minimized, onToggleMinimized, onView, status, emptyText, error, onRetry, footer, size, fill, columnSpan, width, widgetKey, headingLevel, className, children, }: WidgetCardProps): ReactNode;
|
|
51
|
+
declare function WidgetCard({ title, description, actions, minimized, onToggleMinimized, onView, status, emptyText, error, onRetry, footer, size, fill, columnSpan, width, widgetKey, editing, headingLevel, className, children, }: WidgetCardProps): ReactNode;
|
|
50
52
|
/** The title to show: alert lists add their total, e.g. "Low stock (3)". */
|
|
51
53
|
declare function widgetTitle(widget: DashboardWidget): string;
|
|
52
54
|
interface ResolvedWidgetCardProps {
|
|
@@ -61,6 +63,8 @@ interface ResolvedWidgetCardProps {
|
|
|
61
63
|
/** See `WidgetCardProps.onView`. */
|
|
62
64
|
readonly onView?: () => void;
|
|
63
65
|
readonly onRetry?: () => void;
|
|
66
|
+
/** See `WidgetCardProps.editing`. */
|
|
67
|
+
readonly editing?: boolean;
|
|
64
68
|
readonly headingLevel?: 2 | 3 | 4 | 5 | 6;
|
|
65
69
|
readonly className?: string;
|
|
66
70
|
}
|
|
@@ -148,7 +152,7 @@ declare function useDetailData(definition: WidgetDefinition, load: DetailLoader
|
|
|
148
152
|
};
|
|
149
153
|
|
|
150
154
|
/** Every element that carries a stable `dwt-*` class, for `classNames`. */
|
|
151
|
-
type DashboardClassSlot = 'dashboard' | 'hiddenBar' | 'grid' | 'card' | 'cardHeader' | 'cardTitle' | 'cardDescription' | 'cardActions' | 'cardBody' | 'cardFooter' | 'button' | 'status' | 'empty' | 'error' | 'text' | 'kpi' | 'gauge' | 'table' | 'barList' | 'alertList' | 'chart' | 'legend' | 'tooltip' | 'tableTwin' | 'detail';
|
|
155
|
+
type DashboardClassSlot = 'dashboard' | 'hiddenBar' | 'toolbar' | 'pageBar' | 'grid' | 'card' | 'cardHeader' | 'cardTitle' | 'cardDescription' | 'cardActions' | 'cardBody' | 'cardFooter' | 'button' | 'status' | 'empty' | 'error' | 'text' | 'kpi' | 'gauge' | 'table' | 'barList' | 'alertList' | 'chart' | 'legend' | 'tooltip' | 'tableTwin' | 'detail';
|
|
152
156
|
/**
|
|
153
157
|
* Extra classes per slot, appended to the `dwt-*` class (never replacing
|
|
154
158
|
* it), e.g. `{ card: 'rounded-lg shadow-sm' }` for Tailwind.
|
|
@@ -167,6 +171,49 @@ interface DashboardLabels {
|
|
|
167
171
|
readonly moveLater: (title: string) => string;
|
|
168
172
|
readonly hiddenWidgets: string;
|
|
169
173
|
readonly minimizedWidgets: string;
|
|
174
|
+
/** Edit mode toolbar (`editMode="toggle"`). */
|
|
175
|
+
readonly customize: string;
|
|
176
|
+
readonly done: string;
|
|
177
|
+
readonly reset: string;
|
|
178
|
+
readonly revertChanges: string;
|
|
179
|
+
readonly confirmReset: string;
|
|
180
|
+
readonly confirmRevert: string;
|
|
181
|
+
/** Accessible names of the inline "✓" and "X" confirmation buttons. */
|
|
182
|
+
readonly confirmYes: string;
|
|
183
|
+
readonly confirmNo: string;
|
|
184
|
+
/** Announced when edit mode starts and ends. */
|
|
185
|
+
readonly editingOn: string;
|
|
186
|
+
readonly editingOff: string;
|
|
187
|
+
/** Names the toolbar group for assistive technology. */
|
|
188
|
+
readonly dashboardControls: string;
|
|
189
|
+
/** The lock icon on a locked card, e.g. "Revenue is locked". */
|
|
190
|
+
readonly locked: (title: string) => string;
|
|
191
|
+
/** The lock icon on a card shown to an administrator (`overrideLocks`). */
|
|
192
|
+
readonly lockedForViewers: (title: string) => string;
|
|
193
|
+
/** Pages: names the tab list, and each tab ("Page 2 of 3: Sales"). */
|
|
194
|
+
readonly pageBar: string;
|
|
195
|
+
readonly pageTabName: (index: number, count: number, title: string) => string;
|
|
196
|
+
readonly previousPageButton: string;
|
|
197
|
+
readonly nextPageButton: string;
|
|
198
|
+
/** Page management while editing. */
|
|
199
|
+
readonly managePages: string;
|
|
200
|
+
readonly addPage: string;
|
|
201
|
+
readonly renamePage: (title: string) => string;
|
|
202
|
+
readonly pageTitle: string;
|
|
203
|
+
readonly savePageTitle: string;
|
|
204
|
+
readonly cancelPageTitle: string;
|
|
205
|
+
readonly deletePage: (title: string) => string;
|
|
206
|
+
readonly confirmDeletePage: (title: string) => string;
|
|
207
|
+
readonly movePageLeft: (title: string) => string;
|
|
208
|
+
readonly movePageRight: (title: string) => string;
|
|
209
|
+
/** The select on each card that moves it to another page. */
|
|
210
|
+
readonly moveToPage: (title: string) => string;
|
|
211
|
+
readonly moveToPagePlaceholder: string;
|
|
212
|
+
readonly moveToPageOption: (title: string, rowsFree: number) => string;
|
|
213
|
+
readonly newPageOption: string;
|
|
214
|
+
readonly movedToPage: (title: string, pageTitle: string) => string;
|
|
215
|
+
readonly pageFull: (pageTitle: string, maxRows: number) => string;
|
|
216
|
+
readonly emptyPage: string;
|
|
170
217
|
/** Added to the accessible name of links that open in a new tab. */
|
|
171
218
|
readonly opensInNewTab: string;
|
|
172
219
|
/** The card's View button, opening the detail view. */
|
|
@@ -237,6 +284,36 @@ interface DashboardProps extends WidgetSettings {
|
|
|
237
284
|
* everyone else (`enforceLocks`). It never changes the locks themselves.
|
|
238
285
|
*/
|
|
239
286
|
readonly overrideLocks?: boolean;
|
|
287
|
+
/**
|
|
288
|
+
* `always` (default): move and hide controls show whenever `onLayoutChange`
|
|
289
|
+
* is set. `toggle`: they show only while editing, behind a Customize
|
|
290
|
+
* button, so a stray click can't rearrange the page. Minimize and its bar
|
|
291
|
+
* work in both modes.
|
|
292
|
+
*/
|
|
293
|
+
readonly editMode?: 'always' | 'toggle';
|
|
294
|
+
/** Controlled editing state (`editMode="toggle"`). */
|
|
295
|
+
readonly editing?: boolean;
|
|
296
|
+
/** Initial editing state when uncontrolled. Default false. */
|
|
297
|
+
readonly defaultEditing?: boolean;
|
|
298
|
+
/** Called when the viewer starts or finishes editing. */
|
|
299
|
+
readonly onEditingChange?: (editing: boolean) => void;
|
|
300
|
+
/** What Reset layout restores. Default: the empty layout (sortOrder order). */
|
|
301
|
+
readonly defaultLayout?: DashboardLayout;
|
|
302
|
+
/** Show the built-in Customize/Done/Reset toolbar (toggle mode). Default true. */
|
|
303
|
+
readonly toolbar?: boolean;
|
|
304
|
+
/**
|
|
305
|
+
* The page in view (a page key) when the layout has pages. Controlled with
|
|
306
|
+
* `onActivePageChange`; without it the dashboard keeps its own, starting on
|
|
307
|
+
* `defaultActivePage` or the first page. Pages never listed fall back to
|
|
308
|
+
* the first.
|
|
309
|
+
*/
|
|
310
|
+
readonly activePage?: string;
|
|
311
|
+
readonly defaultActivePage?: string;
|
|
312
|
+
readonly onActivePageChange?: (pageKey: string) => void;
|
|
313
|
+
/** Rows a page holds unless the page says otherwise. Default 4. */
|
|
314
|
+
readonly maxRows?: number;
|
|
315
|
+
/** Most pages the viewer can add while editing. Default: no limit. */
|
|
316
|
+
readonly maxPages?: number;
|
|
240
317
|
readonly onRetry?: (key: string) => void;
|
|
241
318
|
/**
|
|
242
319
|
* Loads the full data for a widget's detail view (widgets whose definition
|