@iobroker/gui-components 10.0.1 → 10.0.3

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.
Files changed (43) hide show
  1. package/README.md +6 -2
  2. package/build/Components/FileBrowser.js +18 -13
  3. package/build/Components/FileBrowser.js.map +1 -1
  4. package/build/Components/{ObjectBrowser.d.ts → ObjectBrowser/ObjectBrowserClass.d.ts} +142 -77
  5. package/build/Components/ObjectBrowser/ObjectBrowserClass.js +2462 -0
  6. package/build/Components/ObjectBrowser/ObjectBrowserClass.js.map +1 -0
  7. package/build/Components/ObjectBrowser/constants.d.ts +50 -0
  8. package/build/Components/ObjectBrowser/constants.js +138 -0
  9. package/build/Components/ObjectBrowser/constants.js.map +1 -0
  10. package/build/Components/ObjectBrowser/contextMenu.d.ts +13 -0
  11. package/build/Components/ObjectBrowser/contextMenu.js +354 -0
  12. package/build/Components/ObjectBrowser/contextMenu.js.map +1 -0
  13. package/build/Components/ObjectBrowser/dialogs.d.ts +31 -0
  14. package/build/Components/ObjectBrowser/dialogs.js +421 -0
  15. package/build/Components/ObjectBrowser/dialogs.js.map +1 -0
  16. package/build/Components/ObjectBrowser/index.d.ts +20 -0
  17. package/build/Components/ObjectBrowser/index.js +20 -0
  18. package/build/Components/ObjectBrowser/index.js.map +1 -0
  19. package/build/Components/ObjectBrowser/renderLeaf.d.ts +41 -0
  20. package/build/Components/ObjectBrowser/renderLeaf.js +1077 -0
  21. package/build/Components/ObjectBrowser/renderLeaf.js.map +1 -0
  22. package/build/Components/ObjectBrowser/styles.d.ts +7 -0
  23. package/build/Components/ObjectBrowser/styles.js +662 -0
  24. package/build/Components/ObjectBrowser/styles.js.map +1 -0
  25. package/build/Components/ObjectBrowser/toolbar.d.ts +26 -0
  26. package/build/Components/ObjectBrowser/toolbar.js +327 -0
  27. package/build/Components/ObjectBrowser/toolbar.js.map +1 -0
  28. package/build/Components/{objectBrowser.types.d.ts → ObjectBrowser/types.d.ts} +15 -10
  29. package/build/Components/{objectBrowserUtils.d.ts → ObjectBrowser/utils.d.ts} +22 -2
  30. package/build/Components/{objectBrowserUtils.js → ObjectBrowser/utils.js} +46 -2
  31. package/build/Components/ObjectBrowser/utils.js.map +1 -0
  32. package/build/Components/TreeTable.d.ts +2 -2
  33. package/build/Components/TreeTable.js.map +1 -1
  34. package/build/Dialogs/SelectID.d.ts +4 -4
  35. package/build/Dialogs/SelectID.js +2 -2
  36. package/build/Dialogs/SelectID.js.map +1 -1
  37. package/build/index.d.ts +2 -2
  38. package/build/index.js +1 -1
  39. package/build/index.js.map +1 -1
  40. package/package.json +5 -5
  41. package/build/Components/ObjectBrowser.js +0 -5162
  42. package/build/Components/ObjectBrowser.js.map +0 -1
  43. package/build/Components/objectBrowserUtils.js.map +0 -1
@@ -3,10 +3,15 @@
3
3
  *
4
4
  * MIT License
5
5
  *
6
+ * The object browser itself: state, socket subscriptions, the tree and the rendering.
7
+ * The dialogs, the toolbar, the rows and the context menu live in the sibling files of this
8
+ * directory and get this instance as the first argument. Because of that, the members of this
9
+ * class are not private, even if they are not intended to be used outside of the object browser.
6
10
  */
7
11
  import React, { Component, type JSX } from 'react';
8
- import { getSelectIdIconFromObjects } from './objectBrowserUtils';
9
- import type { ObjectBrowserProps, AdapterColumn, ObjectBrowserFilter, ObjectBrowserState, TreeItem, CustomAdminColumnStored, ObjectEvent } from './objectBrowser.types';
12
+ import { getSelectIdIconFromObjects } from './utils';
13
+ import type { Width } from '../../types';
14
+ import type { ObjectBrowserProps, AdapterColumn, ObjectBrowserFilter, ObjectBrowserPossibleColumns, ObjectBrowserState, TreeInfo, TreeItem, CustomAdminColumnStored, ObjectEvent } from './types';
10
15
  export { getSelectIdIconFromObjects, type ObjectBrowserFilter };
11
16
  declare global {
12
17
  interface Window {
@@ -20,33 +25,47 @@ declare module '@mui/material/Button' {
20
25
  grey: true;
21
26
  }
22
27
  }
23
- export declare const ITEM_IMAGES: Record<string, JSX.Element>;
24
28
  export declare class ObjectBrowserClass extends Component<ObjectBrowserProps, ObjectBrowserState> {
25
- private info;
26
- private localStorage;
29
+ info: TreeInfo;
30
+ localStorage: Storage;
31
+ /**
32
+ * Own copy of the screen widths. The widths, that the user stored for THIS dialog, must not leak
33
+ * into the other instances of the object browser (the constant is a module singleton).
34
+ */
35
+ private readonly screenWidths;
27
36
  private readonly tableRef;
37
+ /** Watches the width of the table container to detect the width class */
38
+ private resizeObserver;
39
+ private observedContainer;
40
+ /** Width class for which the columns were calculated the last time */
41
+ private lastCalculatedWidth;
28
42
  private pausedSubscribes;
29
43
  private selectFirst;
30
44
  /** Last navigation that was applied from `navigateTo` or reported via `onNavigateTo` (loop guard). */
31
45
  private lastNav;
32
46
  /** True while applying `navigateTo`, so the derived-state watcher does not echo it back. */
33
47
  private applyingNav;
34
- private root;
35
- private readonly states;
36
- private subscribes;
48
+ root: TreeItem | null;
49
+ readonly states: Record<string, ioBroker.State>;
50
+ subscribes: string[];
37
51
  private unsubscribeTimer;
38
52
  private statesUpdateTimer;
39
53
  private objectsUpdateTimer;
40
- private readonly visibleCols;
41
- private readonly texts;
42
- private readonly possibleCols;
43
- private readonly imagePrefix;
44
- private adapterColumns;
54
+ /** Columns that are visible in the auto mode. Depends on the width of the container */
55
+ visibleCols: ObjectBrowserPossibleColumns[];
56
+ readonly texts: Record<string, string>;
57
+ readonly possibleCols: ObjectBrowserPossibleColumns[];
58
+ readonly imagePrefix: string;
59
+ adapterColumns: AdapterColumn[];
45
60
  private styleTheme;
46
- private edit;
47
- private readonly levelPadding;
61
+ edit: {
62
+ val: string | number | boolean | null;
63
+ q: number;
64
+ ack: boolean;
65
+ id: string;
66
+ };
67
+ readonly levelPadding: number;
48
68
  private customWidth;
49
- private resizeTimeout;
50
69
  private resizerNextName;
51
70
  private resizerActiveName;
52
71
  private resizerCurrentWidths;
@@ -59,20 +78,61 @@ export declare class ObjectBrowserClass extends Component<ObjectBrowserProps, Ob
59
78
  private resizerActiveDiv;
60
79
  private resizerNextDiv;
61
80
  private storedWidths;
62
- private systemConfig;
81
+ systemConfig: ioBroker.SystemConfigObject | null;
63
82
  objects: Record<string, ioBroker.Object>;
64
- private defaultHistory;
83
+ defaultHistory: string;
65
84
  private ctrlPressed;
66
- private columnsVisibility;
67
- private changedIds;
68
- private contextMenu;
69
- private recordStates;
70
- private styles;
85
+ columnsVisibility: {
86
+ id?: number | string;
87
+ name?: number | string;
88
+ type?: number;
89
+ role?: number;
90
+ room?: number;
91
+ func?: number;
92
+ changedFrom?: number;
93
+ qualityCode?: number;
94
+ timestamp?: number;
95
+ lastChange?: number;
96
+ val?: number;
97
+ buttons?: number;
98
+ };
99
+ changedIds: null | string[];
100
+ contextMenu: null | {
101
+ item: any;
102
+ ts: number;
103
+ };
104
+ recordStates: string[];
105
+ styles: {
106
+ cellIdIconFolder?: React.CSSProperties;
107
+ cellIdIconDocument?: React.CSSProperties;
108
+ iconDeviceError?: React.CSSProperties;
109
+ iconDeviceConnected?: React.CSSProperties;
110
+ iconDeviceDisconnected?: React.CSSProperties;
111
+ cellButtonsButtonWithCustoms?: React.CSSProperties;
112
+ invertedBackground?: React.CSSProperties;
113
+ invertedBackgroundFlex?: React.CSSProperties;
114
+ contextMenuEdit?: React.CSSProperties;
115
+ contextMenuEditValue?: React.CSSProperties;
116
+ contextMenuView?: React.CSSProperties;
117
+ contextMenuCustom?: React.CSSProperties;
118
+ contextMenuACL?: React.CSSProperties;
119
+ contextMenuRoom?: React.CSSProperties;
120
+ contextMenuRole?: React.CSSProperties;
121
+ contextMenuDelete?: React.CSSProperties;
122
+ filterInput?: React.CSSProperties;
123
+ iconCopy?: React.CSSProperties;
124
+ aliasReadWrite?: React.CSSProperties;
125
+ aliasAlone?: React.CSSProperties;
126
+ };
71
127
  private expertMode;
72
- private customColumnDialog;
128
+ customColumnDialog: null | {
129
+ value: boolean | number | string;
130
+ type: 'boolean' | 'number' | 'string';
131
+ initValue: boolean | number | string;
132
+ };
73
133
  constructor(props: ObjectBrowserProps);
74
134
  loadAllObjects(update?: boolean): Promise<void>;
75
- private expandAllSelected;
135
+ expandAllSelected(cb?: () => void): void;
76
136
  /**
77
137
  * @param isDouble is double click
78
138
  */
@@ -115,7 +175,6 @@ export declare class ObjectBrowserClass extends Component<ObjectBrowserProps, Ob
115
175
  * Called when an item is selected/deselected.
116
176
  */
117
177
  onSelect(toggleItem: string, isDouble?: boolean, cb?: () => void): void;
118
- private _renderDefinedList;
119
178
  /**
120
179
  * Renders the columns' selector.
121
180
  */
@@ -148,25 +207,18 @@ export declare class ObjectBrowserClass extends Component<ObjectBrowserProps, Ob
148
207
  columnsForAdmin: Record<string, CustomAdminColumnStored[]> | null;
149
208
  };
150
209
  };
151
- private subscribe;
152
- private unsubscribe;
153
- private pauseSubscribe;
210
+ subscribe(id: string): void;
211
+ unsubscribe(id: string): void;
212
+ pauseSubscribe(isPause: boolean): void;
154
213
  clearFilter(): void;
155
214
  isFilterEmpty(): boolean;
156
- private getFilterInput;
157
- private getFilterSelect;
158
- private getFilterSelectRole;
159
- private getFilterSelectRoom;
160
- private getFilterSelectFunction;
161
- private getFilterSelectType;
162
- private getFilterSelectCustoms;
163
- private onExpandAll;
164
- private onCollapseAll;
215
+ onExpandAll(root?: TreeItem, expanded?: string[]): void;
216
+ onCollapseAll(): void;
165
217
  private expandDepth;
166
218
  private static collapseDepth;
167
- private onExpandVisible;
168
- private onStatesViewVisible;
169
- private onCollapseVisible;
219
+ onExpandVisible(): void;
220
+ onStatesViewVisible(): void;
221
+ onCollapseVisible(): void;
170
222
  private getEnumsForId;
171
223
  private _createAllEnums;
172
224
  private loadObjects;
@@ -174,10 +226,23 @@ export declare class ObjectBrowserClass extends Component<ObjectBrowserProps, Ob
174
226
  /**
175
227
  * Exports the selected objects based on the given options and triggers file generation
176
228
  */
177
- private _exportObjects;
229
+ _exportObjects(
230
+ /** Options to filter/reduce the output */
231
+ options: {
232
+ /** Whether all objects should be exported or only the selected ones */
233
+ isAll?: boolean;
234
+ /** Whether the output should be beautified */
235
+ beautify?: boolean;
236
+ /** Whether "system.repositories" should be excluded */
237
+ excludeSystemRepositories?: boolean;
238
+ /** Whether translations should be reduced to only the english value */
239
+ excludeTranslations?: boolean;
240
+ /** Whether the values of the states should be not included */
241
+ noStatesByExportImport?: boolean;
242
+ }): Promise<void>;
178
243
  renderExportDialog(): JSX.Element | null;
179
244
  renderRenameDialog(): JSX.Element | null;
180
- private parseJsonFile;
245
+ parseJsonFile(contents: string): Promise<void>;
181
246
  private handleJsonUpload;
182
247
  toolTipObjectCreating: () => JSX.Element[] | string;
183
248
  onOpenFile(): void;
@@ -186,33 +251,22 @@ export declare class ObjectBrowserClass extends Component<ObjectBrowserProps, Ob
186
251
  * Renders the toolbar.
187
252
  */
188
253
  getToolbar(): JSX.Element;
189
- private toggleExpanded;
190
- private onCopy;
191
- renderTooltipAccessControl: (acl: ioBroker.StateACL) => null | JSX.Element;
254
+ toggleExpanded(id: string): void;
255
+ onCopy(e: React.MouseEvent, text: string | undefined): void;
256
+ renderTooltipAccessControl(acl: ioBroker.StateACL): null | JSX.Element;
192
257
  renderColumnButtons(id: string, item: TreeItem): (JSX.Element | null)[] | JSX.Element | null;
193
- private readHistory;
194
- private getTooltipInfo;
195
- /**
196
- * This function renders the value in different forms in the table
197
- *
198
- * @param id state ID
199
- * @param item Item
200
- * @param narrowStyleWithDetails if use mobile view
201
- */
202
- private renderColumnValue;
258
+ readHistory(id: string): void;
259
+ getTooltipInfo(id: string, cb?: () => void): void;
203
260
  private _syncEnum;
204
- private syncEnum;
205
- private renderEnumDialog;
206
- private renderEditRoleDialog;
207
- private onColumnsEditCustomDialogClose;
208
- private renderColumnsEditCustomDialog;
261
+ syncEnum(id: string, enumName: 'func' | 'room', newArray: string[]): Promise<void>;
262
+ onColumnsEditCustomDialogClose(isSave?: boolean): void;
209
263
  /**
210
264
  * Renders a custom value.
211
265
  */
212
266
  renderCustomValue(obj: ioBroker.Object, it: AdapterColumn, item: TreeItem): JSX.Element | null;
213
267
  renderAliasLink(id: string, index?: number, customStyle?: Record<string, any>): JSX.Element | null;
214
268
  /**
215
- * Renders a leaf.
269
+ * Renders one row of the table.
216
270
  */
217
271
  renderLeaf(item: TreeItem, isExpanded: boolean | undefined, counter: {
218
272
  count: number;
@@ -226,7 +280,25 @@ export declare class ObjectBrowserClass extends Component<ObjectBrowserProps, Ob
226
280
  renderItem(root: TreeItem, isExpanded: boolean | undefined, counter?: {
227
281
  count: number;
228
282
  }): (JSX.Element | null)[];
229
- private calculateColumnsVisibility;
283
+ calculateColumnsVisibility(aColumnsAuto?: boolean | null, aColumns?: string[] | null, aColumnsForAdmin?: Record<string, CustomAdminColumnStored[]> | null, aColumnsWidths?: Record<string, number>): void;
284
+ /**
285
+ * The width class of the object browser. It is measured from the container and not from the
286
+ * window, so the browser shows the right columns if it is used in a narrow panel or dialog too.
287
+ * `props.width` overwrites the measured value.
288
+ */
289
+ get width(): Width;
290
+ /** Watch the width of the table container to detect the width class (see `width`) */
291
+ observeContainerWidth(): void;
292
+ /** Store the width class of the container if it changed */
293
+ setContainerWidth(containerWidth: number): void;
294
+ /**
295
+ * All column widths as CSS variables of the table container. The header and every row read the
296
+ * widths from here (see `colWidth`), so they can never get out of sync, and the resizer can
297
+ * change a width by writing one variable instead of re-rendering all rows.
298
+ */
299
+ getColumnWidthVariables(): React.CSSProperties;
300
+ /** Set the width of one column without re-rendering the rows */
301
+ setColumnWidth(name: string, width: number): void;
230
302
  resizerMouseMove: (e: MouseEvent) => void;
231
303
  resizerMouseUp: () => void;
232
304
  resizerMouseDown: (e: React.MouseEvent<HTMLDivElement>) => void;
@@ -246,8 +318,6 @@ export declare class ObjectBrowserClass extends Component<ObjectBrowserProps, Ob
246
318
  * Render the right handle for resizing
247
319
  */
248
320
  renderHandleRight(): JSX.Element;
249
- private renderHeader;
250
- private renderToast;
251
321
  /** Derive the current navigation target from the dialog/selection state. */
252
322
  private getStateNav;
253
323
  private static navEqual;
@@ -262,23 +332,18 @@ export declare class ObjectBrowserClass extends Component<ObjectBrowserProps, Ob
262
332
  */
263
333
  componentDidUpdate(prevProps: ObjectBrowserProps): void;
264
334
  scrollToItem(id: string): void;
265
- private renderCustomDialog;
266
- private onUpdate;
267
- private renderEditObjectDialog;
268
- private renderViewObjectFileDialog;
269
- private renderAliasEditorDialog;
335
+ onUpdate(valAck: {
336
+ val: ioBroker.StateValue;
337
+ ack: boolean;
338
+ q: ioBroker.STATE_QUALITY[keyof ioBroker.STATE_QUALITY];
339
+ expire: number | undefined;
340
+ }): void;
270
341
  showAddDataPointDialog(id: string, initialType: ioBroker.ObjectType, initialStateType?: ioBroker.CommonType): void;
271
342
  /** Renders the aliases list for one state (if more than 2) */
272
- private renderAliasMenu;
273
- /**
274
- * Renders the right mouse button context menu
275
- */
276
- private renderContextMenu;
277
- private renderEditValueDialog;
278
343
  doFilter(doNotStore?: boolean): void;
279
344
  /**
280
345
  * The rendering method of this component.
281
346
  */
282
347
  render(): JSX.Element;
283
348
  }
284
- export declare const ObjectBrowser: (props: Record<string, any>) => JSX.Element;
349
+ export declare const ObjectBrowser: typeof ObjectBrowserClass;