react-semaphor 0.0.31

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/README.md ADDED
File without changes
@@ -0,0 +1,514 @@
1
+ /// <reference types="react-grid-layout" />
2
+
3
+ import { FontSpec } from 'chart.js';
4
+ import { JSX as JSX_2 } from 'react/jsx-runtime';
5
+ import { Layout } from 'react-grid-layout';
6
+ import { StoreApi } from 'zustand';
7
+ import { UseBoundStore } from 'zustand';
8
+
9
+ declare type Actions = {
10
+ setThemeStyle: (themeStyle: StyleProps) => void;
11
+ setIsEditorSaveEvent: (isEditorSaveEvent: boolean) => void;
12
+ setDashboard: (dashboard: TDashboard) => void;
13
+ setDashboardTheme: (theme: 'light' | 'dark' | 'system') => void;
14
+ setDashboardTitle: (title: string) => void;
15
+ setDashboardDescription: (description: string) => void;
16
+ setSheets: (sheets: TSheet[]) => void;
17
+ setSheetTitle: (sheetId: string, title: string) => void;
18
+ setSheetDescription: (sheetId: string, description: string) => void;
19
+ setSelectedSheetId: (sheetId: string | null) => void;
20
+ setSheetLayout: (sheetId: string, layout: ReactGridLayout.Layout[]) => void;
21
+ setCards: (sheetId: string, cards: TCard[]) => void;
22
+ setSelectedCardId: (sheetId: string, cardId: string | null) => void;
23
+ setSelectedCard: (card: TCard | null) => void;
24
+ setCardTitle: (sheetId: string, cardId: string, title: string) => void;
25
+ setCardSql: (sheetId: string, cardId: string, sql: string) => void;
26
+ setCardDescription: (sheetId: string, cardId: string, description: string) => void;
27
+ setCardData: (sheetId: string, cardId: string, data: any[]) => void;
28
+ addCard: (sheetId: string, card: TCard) => void;
29
+ updateCard: (sheetId: string, card: TCard) => void;
30
+ removeCard: (sheetId: string, card: TCard) => void;
31
+ setIsDashboardEditing: (editing: boolean) => void;
32
+ setShowDashboardJSON: (show: boolean) => void;
33
+ setIsVisualEditing: (editing: boolean) => void;
34
+ setShowFilters: (show: boolean) => void;
35
+ addFilter: (filter: TFilter) => void;
36
+ removeFilter: (filterId: string) => void;
37
+ updateFilter: (filter: TFilter) => void;
38
+ addOrUpdateFilterValue: (filterValue: TFilterValue) => void;
39
+ removeFilterValue: (filterId: string) => void;
40
+ setStyle: (style: TStyle) => void;
41
+ getStyle: () => TStyle | undefined;
42
+ setOnSaveFunction: (onSaveFunction: (dashboard: TDashboard) => void) => void;
43
+ setOnAddCard: (onAddCard: (card: TCard, sheetId: string) => void) => void;
44
+ setOnUpdateCard: (onUpdateCard: (card: TCard, sheetId: string) => void) => void;
45
+ setOnRemoveCard: (onRemoveCard: (card: TCard, sheetId: string) => void) => void;
46
+ setOnEvent: (onEvent: (event: TEvent) => void) => void;
47
+ getDashboard: () => TDashboard | undefined;
48
+ getSelectedSheet: () => TSheet | undefined;
49
+ getSelectedSheetCards: () => TCard[] | undefined;
50
+ getSelectedCard: () => TCard | undefined;
51
+ getSelectedSheetLayout: () => ReactGridLayout.Layout[] | undefined;
52
+ };
53
+
54
+ declare type BaseFilter = {
55
+ filterId: TFilter['id'];
56
+ expression?: string;
57
+ name: string;
58
+ valueType: 'string' | 'number' | 'date' | 'boolean';
59
+ connectionType?: 'database' | 'api';
60
+ };
61
+
62
+ export declare function cleanCard(card: TCard): TCard;
63
+
64
+ export declare function Dashboard(props: DashboardProps): JSX_2.Element;
65
+
66
+ export declare function DashboardPlus({ showControls, showFooter, ...rest }: DashboardPlusProps): JSX_2.Element;
67
+
68
+ declare type DashboardPlusProps = {
69
+ id: string;
70
+ authToken: string;
71
+ style?: TStyle;
72
+ currentTheme?: 'light' | 'dark' | 'system';
73
+ onSave?: (dashboard: TDashboard) => void;
74
+ LoadingComponent?: (props: LoadingProps) => React.ReactNode;
75
+ ErrorComponent?: (props: ErrorProps) => React.ReactNode;
76
+ showControls?: boolean;
77
+ showFooter?: boolean;
78
+ } & DashboardProps;
79
+
80
+ export declare type DashboardProps = {
81
+ id: string;
82
+ authToken: string;
83
+ style?: TStyle;
84
+ currentTheme?: 'light' | 'dark' | 'system';
85
+ onEvent?: (event: TEvent) => void;
86
+ onSave?: (dashboard: TDashboard) => void;
87
+ LoadingComponent?: (props: LoadingProps) => React.ReactNode;
88
+ ErrorComponent?: (props: ErrorProps) => React.ReactNode;
89
+ };
90
+
91
+ declare type DashboardStore = {
92
+ theme?: 'light' | 'dark' | 'system';
93
+ themeStyle?: StyleProps;
94
+ dashboard: TDashboard;
95
+ selectedSheetId?: string | null | undefined;
96
+ selectedCardId?: string | null;
97
+ selectedCard?: TCard | null;
98
+ isDashboardEditing: boolean;
99
+ isVisualEditing: boolean;
100
+ showDashboardJSON: boolean;
101
+ showFilters: boolean;
102
+ filterValues?: TFilterValue[];
103
+ isEditorSaveEvent: boolean;
104
+ onEvent?: (event: TEvent) => void;
105
+ onSaveFunction?: (dashboard: TDashboard) => void;
106
+ onAddCard?: (card: TCard, sheetId: string) => void;
107
+ onUpdateCard?: (card: TCard, sheetId: string) => void;
108
+ onRemoveCard?: (card: TCard, sheetId: string) => void;
109
+ actions: Actions;
110
+ };
111
+
112
+ export declare type ErrorProps = {
113
+ message?: string;
114
+ };
115
+
116
+ declare type FilterForBetween = BaseFilter & {
117
+ operation: 'between' | 'not between';
118
+ values: [number, number];
119
+ };
120
+
121
+ declare type FilterForCompare = BaseFilter & {
122
+ operation: '>' | '<' | '>=' | '<=';
123
+ values: [number];
124
+ };
125
+
126
+ declare type FilterForDate = BaseFilter & {
127
+ operation: 'between' | 'not between';
128
+ values: [Date, Date];
129
+ };
130
+
131
+ declare type FilterForEqual = BaseFilter & {
132
+ operation: '=' | '!=' | 'is null' | 'is not null';
133
+ values: [string | number];
134
+ };
135
+
136
+ declare type FilterForIn = BaseFilter & {
137
+ operation: 'in' | 'not in';
138
+ values: (string | number)[];
139
+ };
140
+
141
+ declare type FilterForString = BaseFilter & {
142
+ operation: 'like' | 'not like';
143
+ values: [string];
144
+ };
145
+
146
+ export declare function getDashbaordStateWithoutData(dashboardState: TDashboard): {
147
+ sheets: {
148
+ cards: TCard[] | undefined;
149
+ id: string;
150
+ title?: string | undefined;
151
+ description?: string | undefined;
152
+ layout?: Layout[] | undefined;
153
+ }[] | undefined;
154
+ id: string;
155
+ title?: string | undefined;
156
+ description?: string | undefined;
157
+ style?: TStyle | undefined;
158
+ filters?: TFilter[] | undefined;
159
+ };
160
+
161
+ export declare type LoadingProps = {
162
+ message?: string;
163
+ };
164
+
165
+ export declare type StyleProps = {
166
+ dashboardPanel?: string;
167
+ dashboardTabsContainer?: string;
168
+ dashboardCard?: string;
169
+ dashboardHeader?: string;
170
+ dashboardTitle?: string;
171
+ dashboardDescription?: string;
172
+ gridLayout?: {
173
+ className?: string;
174
+ margin?: [number, number];
175
+ };
176
+ chart?: {
177
+ font?: Partial<FontSpec>;
178
+ dataset?: any;
179
+ options?: any;
180
+ };
181
+ };
182
+
183
+ export declare type TCard = {
184
+ id: string;
185
+ title: string;
186
+ description?: string;
187
+ connectionId?: string;
188
+ type: TChartType;
189
+ sql?: string;
190
+ data?: any[];
191
+ cfg?: any;
192
+ customCfg?: any;
193
+ preferences?: TCardPreferences;
194
+ lastSelectedDatabase?: string;
195
+ lastSelectedSchema?: string;
196
+ lastSelectedTable?: string;
197
+ refreshInterval?: string;
198
+ };
199
+
200
+ export declare type TCardPreferences = {
201
+ filterOnClick?: boolean;
202
+ filterOnClickField?: string;
203
+ };
204
+
205
+ declare type TChartType = 'bar' | 'horizontalBar' | 'line' | 'pie' | 'doughnut' | 'radar' | 'polarArea' | 'bubble' | 'scatter' | 'stackedBar' | 'table';
206
+
207
+ export declare type TDashboard = {
208
+ id: string;
209
+ title?: string;
210
+ description?: string;
211
+ sheets?: TSheet[];
212
+ style?: TStyle;
213
+ filters?: TFilter[];
214
+ };
215
+
216
+ export declare type TEvent = {
217
+ type: 'success' | 'error' | 'info' | 'warning';
218
+ message: any;
219
+ };
220
+
221
+ declare type TFilter = {
222
+ id: string;
223
+ connectionId: string;
224
+ title: string;
225
+ column: string;
226
+ dataType: string;
227
+ table: string;
228
+ database: string;
229
+ sql: string;
230
+ };
231
+
232
+ declare type TFilterValue = FilterForString | FilterForEqual | FilterForCompare | FilterForBetween | FilterForIn | FilterForDate;
233
+
234
+ export declare type TSheet = {
235
+ id: string;
236
+ title?: string;
237
+ description?: string;
238
+ layout?: ReactGridLayout.Layout[];
239
+ cards?: TCard[];
240
+ };
241
+
242
+ export declare type TStyle = {
243
+ default: StyleProps;
244
+ dark?: StyleProps;
245
+ };
246
+
247
+ export declare function useActions(): {
248
+ setDashboardTitle: (title: string) => void;
249
+ getStyle: () => TStyle | undefined;
250
+ getDashboard: () => TDashboard | undefined;
251
+ setOnSaveFunction: (onSaveFunction: (dashboard: TDashboard) => void) => void;
252
+ setOnAddCard: (onAddCard: (card: TCard, sheetId: string) => void) => void;
253
+ setOnUpateCard: (onUpdateCard: (card: TCard, sheetId: string) => void) => void;
254
+ setOnRemoveCard: (onRemoveCard: (card: TCard, sheetId: string) => void) => void;
255
+ };
256
+
257
+ export declare const useDashboardStore: UseBoundStore<Omit<StoreApi<DashboardStore>, "setState"> & {
258
+ setState(nextStateOrUpdater: DashboardStore | Partial<DashboardStore> | ((state: {
259
+ theme?: "light" | "dark" | "system" | undefined;
260
+ themeStyle?: {
261
+ dashboardPanel?: string | undefined;
262
+ dashboardTabsContainer?: string | undefined;
263
+ dashboardCard?: string | undefined;
264
+ dashboardHeader?: string | undefined;
265
+ dashboardTitle?: string | undefined;
266
+ dashboardDescription?: string | undefined;
267
+ gridLayout?: {
268
+ className?: string | undefined;
269
+ margin?: [number, number] | undefined;
270
+ } | undefined;
271
+ chart?: {
272
+ font?: {
273
+ family?: string | undefined;
274
+ size?: number | undefined;
275
+ style?: "normal" | "italic" | "oblique" | "initial" | "inherit" | undefined;
276
+ weight?: number | "bold" | "normal" | "lighter" | "bolder" | null | undefined;
277
+ lineHeight?: string | number | undefined;
278
+ } | undefined;
279
+ dataset?: any;
280
+ options?: any;
281
+ } | undefined;
282
+ } | undefined;
283
+ dashboard: {
284
+ id: string;
285
+ title?: string | undefined;
286
+ description?: string | undefined;
287
+ sheets?: {
288
+ id: string;
289
+ title?: string | undefined;
290
+ description?: string | undefined;
291
+ layout?: {
292
+ i: string;
293
+ x: number;
294
+ y: number;
295
+ w: number;
296
+ h: number;
297
+ minW?: number | undefined;
298
+ maxW?: number | undefined;
299
+ minH?: number | undefined;
300
+ maxH?: number | undefined;
301
+ moved?: boolean | undefined;
302
+ static?: boolean | undefined;
303
+ isDraggable?: boolean | undefined;
304
+ isResizable?: boolean | undefined;
305
+ resizeHandles?: ("w" | "s" | "e" | "n" | "sw" | "nw" | "se" | "ne")[] | undefined;
306
+ isBounded?: boolean | undefined;
307
+ }[] | undefined;
308
+ cards?: {
309
+ id: string;
310
+ title: string;
311
+ description?: string | undefined;
312
+ connectionId?: string | undefined;
313
+ type: TChartType;
314
+ sql?: string | undefined;
315
+ data?: any[] | undefined;
316
+ cfg?: any;
317
+ customCfg?: any;
318
+ preferences?: {
319
+ filterOnClick?: boolean | undefined;
320
+ filterOnClickField?: string | undefined;
321
+ } | undefined;
322
+ lastSelectedDatabase?: string | undefined;
323
+ lastSelectedSchema?: string | undefined;
324
+ lastSelectedTable?: string | undefined;
325
+ refreshInterval?: string | undefined;
326
+ }[] | undefined;
327
+ }[] | undefined;
328
+ style?: {
329
+ default: {
330
+ dashboardPanel?: string | undefined;
331
+ dashboardTabsContainer?: string | undefined;
332
+ dashboardCard?: string | undefined;
333
+ dashboardHeader?: string | undefined;
334
+ dashboardTitle?: string | undefined;
335
+ dashboardDescription?: string | undefined;
336
+ gridLayout?: {
337
+ className?: string | undefined;
338
+ margin?: [number, number] | undefined;
339
+ } | undefined;
340
+ chart?: {
341
+ font?: {
342
+ family?: string | undefined;
343
+ size?: number | undefined;
344
+ style?: "normal" | "italic" | "oblique" | "initial" | "inherit" | undefined;
345
+ weight?: number | "bold" | "normal" | "lighter" | "bolder" | null | undefined;
346
+ lineHeight?: string | number | undefined;
347
+ } | undefined;
348
+ dataset?: any;
349
+ options?: any;
350
+ } | undefined;
351
+ };
352
+ dark?: {
353
+ dashboardPanel?: string | undefined;
354
+ dashboardTabsContainer?: string | undefined;
355
+ dashboardCard?: string | undefined;
356
+ dashboardHeader?: string | undefined;
357
+ dashboardTitle?: string | undefined;
358
+ dashboardDescription?: string | undefined;
359
+ gridLayout?: {
360
+ className?: string | undefined;
361
+ margin?: [number, number] | undefined;
362
+ } | undefined;
363
+ chart?: {
364
+ font?: {
365
+ family?: string | undefined;
366
+ size?: number | undefined;
367
+ style?: "normal" | "italic" | "oblique" | "initial" | "inherit" | undefined;
368
+ weight?: number | "bold" | "normal" | "lighter" | "bolder" | null | undefined;
369
+ lineHeight?: string | number | undefined;
370
+ } | undefined;
371
+ dataset?: any;
372
+ options?: any;
373
+ } | undefined;
374
+ } | undefined;
375
+ } | undefined;
376
+ filters?: {
377
+ id: string;
378
+ connectionId: string;
379
+ title: string;
380
+ column: string;
381
+ dataType: string;
382
+ table: string;
383
+ database: string;
384
+ sql: string;
385
+ }[] | undefined;
386
+ };
387
+ selectedSheetId?: string | null | undefined;
388
+ selectedCardId?: string | null | undefined;
389
+ selectedCard?: {
390
+ id: string;
391
+ title: string;
392
+ description?: string | undefined;
393
+ connectionId?: string | undefined;
394
+ type: TChartType;
395
+ sql?: string | undefined;
396
+ data?: any[] | undefined;
397
+ cfg?: any;
398
+ customCfg?: any;
399
+ preferences?: {
400
+ filterOnClick?: boolean | undefined;
401
+ filterOnClickField?: string | undefined;
402
+ } | undefined;
403
+ lastSelectedDatabase?: string | undefined;
404
+ lastSelectedSchema?: string | undefined;
405
+ lastSelectedTable?: string | undefined;
406
+ refreshInterval?: string | undefined;
407
+ } | null | undefined;
408
+ isDashboardEditing: boolean;
409
+ isVisualEditing: boolean;
410
+ showDashboardJSON: boolean;
411
+ showFilters: boolean;
412
+ filterValues?: ({
413
+ filterId: string;
414
+ expression?: string | undefined;
415
+ name: string;
416
+ valueType: "string" | "number" | "boolean" | "date";
417
+ connectionType?: "database" | "api" | undefined;
418
+ operation: "like" | "not like";
419
+ values: [string];
420
+ } | {
421
+ filterId: string;
422
+ expression?: string | undefined;
423
+ name: string;
424
+ valueType: "string" | "number" | "boolean" | "date";
425
+ connectionType?: "database" | "api" | undefined;
426
+ operation: "=" | "!=" | "is null" | "is not null";
427
+ values: [string | number];
428
+ } | {
429
+ filterId: string;
430
+ expression?: string | undefined;
431
+ name: string;
432
+ valueType: "string" | "number" | "boolean" | "date";
433
+ connectionType?: "database" | "api" | undefined;
434
+ operation: ">" | "<" | ">=" | "<=";
435
+ values: [number];
436
+ } | {
437
+ filterId: string;
438
+ expression?: string | undefined;
439
+ name: string;
440
+ valueType: "string" | "number" | "boolean" | "date";
441
+ connectionType?: "database" | "api" | undefined;
442
+ operation: "between" | "not between";
443
+ values: [number, number];
444
+ } | {
445
+ filterId: string;
446
+ expression?: string | undefined;
447
+ name: string;
448
+ valueType: "string" | "number" | "boolean" | "date";
449
+ connectionType?: "database" | "api" | undefined;
450
+ operation: "between" | "not between";
451
+ values: [Date, Date];
452
+ } | {
453
+ filterId: string;
454
+ expression?: string | undefined;
455
+ name: string;
456
+ valueType: "string" | "number" | "boolean" | "date";
457
+ connectionType?: "database" | "api" | undefined;
458
+ operation: "in" | "not in";
459
+ values: (string | number)[];
460
+ })[] | undefined;
461
+ isEditorSaveEvent: boolean;
462
+ onEvent?: ((event: TEvent) => void) | undefined;
463
+ onSaveFunction?: ((dashboard: TDashboard) => void) | undefined;
464
+ onAddCard?: ((card: TCard, sheetId: string) => void) | undefined;
465
+ onUpdateCard?: ((card: TCard, sheetId: string) => void) | undefined;
466
+ onRemoveCard?: ((card: TCard, sheetId: string) => void) | undefined;
467
+ actions: {
468
+ setThemeStyle: (themeStyle: StyleProps) => void;
469
+ setIsEditorSaveEvent: (isEditorSaveEvent: boolean) => void;
470
+ setDashboard: (dashboard: TDashboard) => void;
471
+ setDashboardTheme: (theme: 'light' | 'dark' | 'system') => void;
472
+ setDashboardTitle: (title: string) => void;
473
+ setDashboardDescription: (description: string) => void;
474
+ setSheets: (sheets: TSheet[]) => void;
475
+ setSheetTitle: (sheetId: string, title: string) => void;
476
+ setSheetDescription: (sheetId: string, description: string) => void;
477
+ setSelectedSheetId: (sheetId: string | null) => void;
478
+ setSheetLayout: (sheetId: string, layout: ReactGridLayout.Layout[]) => void;
479
+ setCards: (sheetId: string, cards: TCard[]) => void;
480
+ setSelectedCardId: (sheetId: string, cardId: string | null) => void;
481
+ setSelectedCard: (card: TCard | null) => void;
482
+ setCardTitle: (sheetId: string, cardId: string, title: string) => void;
483
+ setCardSql: (sheetId: string, cardId: string, sql: string) => void;
484
+ setCardDescription: (sheetId: string, cardId: string, description: string) => void;
485
+ setCardData: (sheetId: string, cardId: string, data: any[]) => void;
486
+ addCard: (sheetId: string, card: TCard) => void;
487
+ updateCard: (sheetId: string, card: TCard) => void;
488
+ removeCard: (sheetId: string, card: TCard) => void;
489
+ setIsDashboardEditing: (editing: boolean) => void;
490
+ setShowDashboardJSON: (show: boolean) => void;
491
+ setIsVisualEditing: (editing: boolean) => void;
492
+ setShowFilters: (show: boolean) => void;
493
+ addFilter: (filter: TFilter) => void;
494
+ removeFilter: (filterId: string) => void;
495
+ updateFilter: (filter: TFilter) => void;
496
+ addOrUpdateFilterValue: (filterValue: TFilterValue) => void;
497
+ removeFilterValue: (filterId: string) => void;
498
+ setStyle: (style: TStyle) => void;
499
+ getStyle: () => TStyle | undefined;
500
+ setOnSaveFunction: (onSaveFunction: (dashboard: TDashboard) => void) => void;
501
+ setOnAddCard: (onAddCard: (card: TCard, sheetId: string) => void) => void;
502
+ setOnUpdateCard: (onUpdateCard: (card: TCard, sheetId: string) => void) => void;
503
+ setOnRemoveCard: (onRemoveCard: (card: TCard, sheetId: string) => void) => void;
504
+ setOnEvent: (onEvent: (event: TEvent) => void) => void;
505
+ getDashboard: () => TDashboard | undefined;
506
+ getSelectedSheet: () => TSheet | undefined;
507
+ getSelectedSheetCards: () => TCard[] | undefined;
508
+ getSelectedCard: () => TCard | undefined;
509
+ getSelectedSheetLayout: () => ReactGridLayout.Layout[] | undefined;
510
+ };
511
+ }) => void), shouldReplace?: boolean | undefined): void;
512
+ }>;
513
+
514
+ export { }