react-dockable-desktop 1.0.0 → 1.2.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/README.md +45 -7
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +359 -14
- package/dist/index.d.ts +359 -14
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/styles.css +583 -123
- package/package.json +2 -1
package/dist/index.d.cts
CHANGED
|
@@ -1,42 +1,89 @@
|
|
|
1
1
|
import * as React$1 from 'react';
|
|
2
2
|
import React__default, { ComponentType, ReactNode } from 'react';
|
|
3
3
|
|
|
4
|
+
/**
|
|
5
|
+
* @file WindowManager.tsx
|
|
6
|
+
* @description Core component for react-dockable-desktop layout engine.
|
|
7
|
+
* Renders the workspace desktop containing docked splits, tabbed panels, floated windows,
|
|
8
|
+
* resize handles, context menus, and taskbar docks. Exposes lifecycle event listeners.
|
|
9
|
+
*/
|
|
10
|
+
|
|
4
11
|
interface WindowManagerProps {
|
|
5
12
|
skin?: string;
|
|
6
13
|
defaultPanelIcon?: React__default.ReactNode;
|
|
7
14
|
}
|
|
8
15
|
declare const WindowManager: React__default.FC<WindowManagerProps>;
|
|
9
16
|
|
|
17
|
+
/**
|
|
18
|
+
* Represents a registered component configuration template inside the panel catalog registry.
|
|
19
|
+
*/
|
|
10
20
|
interface PanelRegistryEntry {
|
|
21
|
+
/** The React component type registered. */
|
|
11
22
|
Component: ComponentType<any>;
|
|
23
|
+
/** Default metadata settings configuration applied on instantiation. */
|
|
12
24
|
defaultOptions?: {
|
|
13
|
-
|
|
25
|
+
/** Tab and window headers text — plain string or i18n descriptor. */
|
|
26
|
+
title?: string | {
|
|
27
|
+
id: string;
|
|
28
|
+
defaultMessage?: string;
|
|
29
|
+
values?: Record<string, string | number>;
|
|
30
|
+
};
|
|
31
|
+
/** Icon placed next to title tags. */
|
|
14
32
|
icon?: React.ReactNode;
|
|
33
|
+
/** Initial mounting state inside the desktop layout grid. */
|
|
15
34
|
initialTarget?: 'floating' | 'docked' | 'tabbed';
|
|
35
|
+
/** Custom default bounds applied when the container is floated. */
|
|
16
36
|
favoritePosition?: {
|
|
17
37
|
x: number | string;
|
|
18
38
|
y: number | string;
|
|
19
39
|
width: number | string;
|
|
20
40
|
height: number | string;
|
|
21
41
|
};
|
|
42
|
+
/** Enables/disables window drag interactions. */
|
|
22
43
|
canDrag?: boolean;
|
|
44
|
+
/** Enables/disables minimizing of the panel instance. */
|
|
23
45
|
canMinimize?: boolean;
|
|
46
|
+
/** Enables/disables closing actions for the tab/window. */
|
|
24
47
|
canClose?: boolean;
|
|
48
|
+
/** Affixes the panel to the right edge. */
|
|
25
49
|
defaultStickyRight?: boolean;
|
|
50
|
+
/** Affixes the panel to the bottom edge. */
|
|
26
51
|
defaultStickyBottom?: boolean;
|
|
52
|
+
/** Disables live WebGL rendering canvas thumbnails inside the taskbar hover popup previews. */
|
|
27
53
|
disableLivePreview?: boolean;
|
|
54
|
+
/** Custom header actions renderer, placing custom components in the window/tab titlebar. */
|
|
55
|
+
renderHeaderActions?: (panelId: string) => React.ReactNode;
|
|
28
56
|
};
|
|
29
57
|
}
|
|
58
|
+
/**
|
|
59
|
+
* Registry mapping catalog entries to allow programmatic panel instantiation
|
|
60
|
+
* inside dynamic layout cells or floating windows.
|
|
61
|
+
*/
|
|
30
62
|
declare class PanelRegistryClass {
|
|
31
63
|
private registry;
|
|
64
|
+
/**
|
|
65
|
+
* Register a new component to the panel catalog registry.
|
|
66
|
+
* @param id - Unique string identifier.
|
|
67
|
+
* @param Component - React component instance template.
|
|
68
|
+
* @param defaultOptions - Custom default settings configuration.
|
|
69
|
+
*/
|
|
32
70
|
register<P extends object>(id: string, Component: ComponentType<P>, defaultOptions?: PanelRegistryEntry['defaultOptions']): void;
|
|
71
|
+
/**
|
|
72
|
+
* Retrieve a registered panel configuration by identifier.
|
|
73
|
+
*/
|
|
33
74
|
get(id: string): PanelRegistryEntry | undefined;
|
|
75
|
+
/**
|
|
76
|
+
* Returns a list of all registered panel entry identifiers.
|
|
77
|
+
*/
|
|
34
78
|
getRegisteredIds(): string[];
|
|
35
79
|
}
|
|
80
|
+
/** Global singleton instance of the Panel Registry. */
|
|
36
81
|
declare const PanelRegistry: PanelRegistryClass;
|
|
37
82
|
|
|
38
83
|
/**
|
|
39
|
-
*
|
|
84
|
+
* @file predefinedMessages.ts
|
|
85
|
+
* @description Provides the default localizable message catalogs and translation keys
|
|
86
|
+
* utilized by Dockable Desktop's context menus, headers, and tooltips.
|
|
40
87
|
*
|
|
41
88
|
* Each value's `id` is the react-intl message ID that the consumer should
|
|
42
89
|
* define in their IntlProvider messages table. The `defaultMessage` is used
|
|
@@ -106,6 +153,42 @@ declare const defaultPredefinedMessages: {
|
|
|
106
153
|
readonly id: "dockable-desktop-windowAnchoringOptions";
|
|
107
154
|
readonly defaultMessage: "Window Anchoring Options";
|
|
108
155
|
};
|
|
156
|
+
readonly unsavedChangesTitle: {
|
|
157
|
+
readonly id: "dockable-desktop-unsavedChangesTitle";
|
|
158
|
+
readonly defaultMessage: "Unsaved Changes";
|
|
159
|
+
};
|
|
160
|
+
readonly unsavedChangesMessage: {
|
|
161
|
+
readonly id: "dockable-desktop-unsavedChangesMessage";
|
|
162
|
+
readonly defaultMessage: "\"{title}\" has unsaved changes. Do you want to discard your changes and close?";
|
|
163
|
+
};
|
|
164
|
+
readonly discardChanges: {
|
|
165
|
+
readonly id: "dockable-desktop-discardChanges";
|
|
166
|
+
readonly defaultMessage: "Discard Changes";
|
|
167
|
+
};
|
|
168
|
+
readonly cancel: {
|
|
169
|
+
readonly id: "dockable-desktop-cancel";
|
|
170
|
+
readonly defaultMessage: "Cancel";
|
|
171
|
+
};
|
|
172
|
+
readonly yes: {
|
|
173
|
+
readonly id: "dockable-desktop-yes";
|
|
174
|
+
readonly defaultMessage: "Yes";
|
|
175
|
+
};
|
|
176
|
+
readonly no: {
|
|
177
|
+
readonly id: "dockable-desktop-no";
|
|
178
|
+
readonly defaultMessage: "No";
|
|
179
|
+
};
|
|
180
|
+
readonly ok: {
|
|
181
|
+
readonly id: "dockable-desktop-ok";
|
|
182
|
+
readonly defaultMessage: "OK";
|
|
183
|
+
};
|
|
184
|
+
readonly closePanelTooltip: {
|
|
185
|
+
readonly id: "dockable-desktop-closePanelTooltip";
|
|
186
|
+
readonly defaultMessage: "Close panel";
|
|
187
|
+
};
|
|
188
|
+
readonly closeTooltip: {
|
|
189
|
+
readonly id: "dockable-desktop-closeTooltip";
|
|
190
|
+
readonly defaultMessage: "Close";
|
|
191
|
+
};
|
|
109
192
|
};
|
|
110
193
|
/**
|
|
111
194
|
* Union of every key in `defaultPredefinedMessages`.
|
|
@@ -119,47 +202,120 @@ declare const defaultPredefinedMessages: {
|
|
|
119
202
|
*/
|
|
120
203
|
type PredefinedMessageKey = keyof typeof defaultPredefinedMessages;
|
|
121
204
|
|
|
205
|
+
/**
|
|
206
|
+
* @file dirtyOptions.ts
|
|
207
|
+
* @description Type definitions for customizing automatic close warning overlays.
|
|
208
|
+
*/
|
|
209
|
+
|
|
210
|
+
/**
|
|
211
|
+
* Represents custom configuration options applied to the automatic unsaved changes modal.
|
|
212
|
+
*/
|
|
213
|
+
interface DirtyStateOptions {
|
|
214
|
+
/**
|
|
215
|
+
* Custom header title text or localizable message descriptor.
|
|
216
|
+
* Replaces the default "Unsaved Changes" title.
|
|
217
|
+
*/
|
|
218
|
+
title?: string | ContextMenuPredefinedMessage;
|
|
219
|
+
/**
|
|
220
|
+
* Custom warning explanation text or localizable message descriptor.
|
|
221
|
+
* Replaces the standard default message body templates.
|
|
222
|
+
*/
|
|
223
|
+
message?: string | ContextMenuPredefinedMessage;
|
|
224
|
+
/**
|
|
225
|
+
* Optional custom alert notification banner text.
|
|
226
|
+
* Typically lists missing validation field requirements or backup statuses.
|
|
227
|
+
*/
|
|
228
|
+
alert?: string;
|
|
229
|
+
/**
|
|
230
|
+
* Color scheme severity level of the validation banner.
|
|
231
|
+
* Maps to theme highlight alerts. Default: 'info'
|
|
232
|
+
*/
|
|
233
|
+
alertType?: 'info' | 'warning' | 'success' | 'danger';
|
|
234
|
+
}
|
|
235
|
+
|
|
236
|
+
/**
|
|
237
|
+
* Structure representing localizable message descriptors used in context menus.
|
|
238
|
+
*/
|
|
122
239
|
interface ContextMenuPredefinedMessage {
|
|
240
|
+
/** Translation dictionary key. */
|
|
123
241
|
id: string;
|
|
242
|
+
/** Fallback label text if translation key is missing. */
|
|
124
243
|
defaultMessage?: string;
|
|
244
|
+
/** Values injected into the translated text placeholder. */
|
|
125
245
|
values?: Record<string, string | number>;
|
|
126
246
|
}
|
|
247
|
+
/** Function type interface responsible for resolving localizable messages to flat strings. */
|
|
127
248
|
type MessageFormatter = (msg: ContextMenuPredefinedMessage) => string;
|
|
249
|
+
/** Orientation modifier indicating split directions. */
|
|
128
250
|
type SplitOrientation = 'horizontal' | 'vertical';
|
|
251
|
+
/**
|
|
252
|
+
* Grid layout branch node containing nested splits and relative flex sizes.
|
|
253
|
+
*/
|
|
129
254
|
interface LayoutGridNode {
|
|
130
255
|
type: 'branch';
|
|
256
|
+
/** Split orientation orientation indicator. */
|
|
131
257
|
orientation: SplitOrientation;
|
|
258
|
+
/** Children branches or leaf panels. */
|
|
132
259
|
children: LayoutNode[];
|
|
260
|
+
/** Relative percentage sizes of each child layout block. */
|
|
133
261
|
sizes: number[];
|
|
134
262
|
}
|
|
263
|
+
/**
|
|
264
|
+
* Grid layout leaf node containing active tab groups and panel arrays.
|
|
265
|
+
*/
|
|
135
266
|
interface LayoutLeafNode {
|
|
136
267
|
type: 'leaf';
|
|
268
|
+
/** Unique leaf identifier. */
|
|
137
269
|
id: string;
|
|
270
|
+
/** Array of panel IDs mounted inside this group. */
|
|
138
271
|
panels: string[];
|
|
272
|
+
/** The currently active panel tab ID. */
|
|
139
273
|
activePanelId: string | null;
|
|
274
|
+
/** If false, close menu buttons are disabled for this group's tabs. */
|
|
140
275
|
canClose?: boolean;
|
|
141
|
-
/** When true the
|
|
142
|
-
* is closed/floated/minimised. Defaults to false (auto-remove). */
|
|
276
|
+
/** When true, the group persists in the layout even after its last panel is closed. */
|
|
143
277
|
keepOnEmpty?: boolean;
|
|
144
278
|
}
|
|
279
|
+
/** Union type representing either a branch or a leaf node in the layout grid. */
|
|
145
280
|
type LayoutNode = LayoutGridNode | LayoutLeafNode;
|
|
281
|
+
/**
|
|
282
|
+
* Bounds and depth metadata for floated panel windows.
|
|
283
|
+
*/
|
|
146
284
|
interface FloatingWindow {
|
|
285
|
+
/** Unique ID of the floating window. */
|
|
147
286
|
id: string;
|
|
287
|
+
/** CSS left position offset (supports number/px or percentage strings). */
|
|
148
288
|
x: number | string;
|
|
289
|
+
/** CSS top position offset. */
|
|
149
290
|
y: number | string;
|
|
291
|
+
/** CSS width value. */
|
|
150
292
|
width: number | string;
|
|
293
|
+
/** CSS height value. */
|
|
151
294
|
height: number | string;
|
|
295
|
+
/** Rendering depth stack index layer. */
|
|
152
296
|
z: number;
|
|
297
|
+
/** True if the window is currently maximized to full workspace bounds. */
|
|
153
298
|
maximized?: boolean;
|
|
299
|
+
/** Sticky right flag. */
|
|
154
300
|
stickyRight?: boolean;
|
|
301
|
+
/** Sticky bottom flag. */
|
|
155
302
|
stickyBottom?: boolean;
|
|
156
303
|
}
|
|
304
|
+
/**
|
|
305
|
+
* Stores active runtime properties and status metadata for individual panel instances.
|
|
306
|
+
*/
|
|
157
307
|
interface PanelInfo {
|
|
308
|
+
/** Unique panel identifier. */
|
|
158
309
|
id: string;
|
|
310
|
+
/** Plain text label or localizable message descriptor. */
|
|
159
311
|
title: string | ContextMenuPredefinedMessage;
|
|
312
|
+
/** String matching the component registration ID in the {@link PanelRegistry}. */
|
|
160
313
|
component: string;
|
|
314
|
+
/** Current workspace placement mode. */
|
|
161
315
|
state: 'docked' | 'floating' | 'minimized';
|
|
316
|
+
/** Last state held before panel was minimized. */
|
|
162
317
|
previousState?: 'docked' | 'floating';
|
|
318
|
+
/** Saved position boundaries used when returning the panel to a floating state. */
|
|
163
319
|
lastFloatingRect?: {
|
|
164
320
|
x: number;
|
|
165
321
|
y: number;
|
|
@@ -168,63 +324,109 @@ interface PanelInfo {
|
|
|
168
324
|
stickyRight?: boolean;
|
|
169
325
|
stickyBottom?: boolean;
|
|
170
326
|
};
|
|
327
|
+
/** The leaf group ID this panel was docked in prior to being floated. */
|
|
171
328
|
lastLeafId?: string;
|
|
329
|
+
/** True if the panel contains unsaved user edits. */
|
|
172
330
|
dirty?: boolean;
|
|
331
|
+
/** Custom options applied to the automatic unsaved changes modal. */
|
|
332
|
+
dirtyOptions?: DirtyStateOptions;
|
|
173
333
|
}
|
|
334
|
+
/**
|
|
335
|
+
* Global window manager state tree representing grid nodes, windows, and panels.
|
|
336
|
+
*/
|
|
174
337
|
interface WindowState {
|
|
338
|
+
/** Root branch node representing the grid. */
|
|
175
339
|
gridRoot: LayoutNode;
|
|
340
|
+
/** Array of active floated windows. */
|
|
176
341
|
floating: FloatingWindow[];
|
|
342
|
+
/** Array of minimized panels waiting in the taskbar dock. */
|
|
177
343
|
minimized: {
|
|
178
344
|
id: string;
|
|
179
345
|
title: string | ContextMenuPredefinedMessage;
|
|
180
346
|
component: string;
|
|
181
347
|
}[];
|
|
348
|
+
/** Map indexing panel metadata descriptors. */
|
|
182
349
|
panels: Record<string, PanelInfo>;
|
|
350
|
+
/** The ID of the panel tab currently being dragged. */
|
|
183
351
|
draggedPanelId: string | null;
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
352
|
+
/** The ID of the active/focused panel. */
|
|
353
|
+
activePanelId: string | null;
|
|
354
|
+
/** Current layout direction ('ltr' or 'rtl') */
|
|
355
|
+
dir: 'ltr' | 'rtl';
|
|
356
|
+
/** Convenient boolean flag indicating RTL direction */
|
|
357
|
+
isRtl: boolean;
|
|
188
358
|
}
|
|
359
|
+
/**
|
|
360
|
+
* Interface mapping layout actions, event bus handles, and serialization methods.
|
|
361
|
+
*/
|
|
189
362
|
interface WindowActions {
|
|
363
|
+
/** Instantiates a registered panel into the workspace. */
|
|
190
364
|
openPanel: (id: string, component: string, options?: {
|
|
191
365
|
title?: string | ContextMenuPredefinedMessage;
|
|
192
366
|
initialTarget?: 'floating' | 'docked' | 'tabbed';
|
|
193
367
|
stickyRight?: boolean;
|
|
194
368
|
stickyBottom?: boolean;
|
|
195
369
|
}) => void;
|
|
370
|
+
/** Directly closes a panel by ID, bypassing close confirmation dialogs. */
|
|
196
371
|
closePanel: (id: string) => void;
|
|
372
|
+
/** Minimizes a panel to the bottom taskbar, saving its current layout positioning. */
|
|
197
373
|
minimizePanel: (id: string) => void;
|
|
374
|
+
/** Restores a minimized panel back to its previous position in the grid or as a float. */
|
|
198
375
|
restorePanel: (id: string) => void;
|
|
376
|
+
/** Detaches a docked panel, turning it into a floating resizable window. */
|
|
199
377
|
floatPanel: (id: string, rect?: {
|
|
200
378
|
x: number;
|
|
201
379
|
y: number;
|
|
202
380
|
width: number;
|
|
203
381
|
height: number;
|
|
204
382
|
}) => void;
|
|
383
|
+
/** Returns a floating window back to a docked grid tab group. */
|
|
205
384
|
dockPanel: (id: string, targetLeafId?: string) => void;
|
|
385
|
+
/** Maximizes a floating window to cover the entire layout screen boundaries. */
|
|
206
386
|
maximizePanel: (id: string) => void;
|
|
387
|
+
/** Resizes flex dimensions of children inside split layout rows/columns. */
|
|
207
388
|
updateSplitSizes: (path: number[], sizes: number[]) => void;
|
|
389
|
+
/** Updates bounds or positioning attributes on a floating window. */
|
|
208
390
|
updateFloatingPosition: (id: string, updates: Partial<Pick<FloatingWindow, 'x' | 'y' | 'width' | 'height' | 'stickyRight' | 'stickyBottom'>>) => void;
|
|
391
|
+
/** Pushes a floating window z-index layer to render on top of others. */
|
|
209
392
|
bringToFront: (id: string) => void;
|
|
393
|
+
/** Serializes the active grid node structures and panel targets to JSON. */
|
|
210
394
|
saveLayout: () => string;
|
|
395
|
+
/** Rebuilds the grid layouts and floating window placements from a JSON string. */
|
|
211
396
|
loadLayout: (layoutJson: string) => void;
|
|
397
|
+
/** Publishes an event to the global inter-panel message bus. */
|
|
212
398
|
publish: (event: string, data: any) => void;
|
|
399
|
+
/** Subscribes callback listeners to inter-panel event messages. */
|
|
213
400
|
subscribe: (event: string, callback: (data: any) => void) => () => void;
|
|
401
|
+
/** Stores reference to the active tab ID being dragged. */
|
|
214
402
|
setDraggedPanelId: (id: string | null) => void;
|
|
403
|
+
/** Splits an existing tab group to dock a dragged panel next to it. */
|
|
215
404
|
dockPanelToGroup: (id: string, targetLeafId: string, position: 'left' | 'right' | 'top' | 'bottom' | 'center') => void;
|
|
405
|
+
/** Reorders tab indices inside a docked leaf group. */
|
|
216
406
|
movePanelOrder: (panelId: string, targetLeafId: string, targetIndex: number) => void;
|
|
407
|
+
/** Closes an empty split group. */
|
|
217
408
|
closeLeafGroup: (leafId: string) => void;
|
|
409
|
+
/** Binds a close intercept confirmation guard. */
|
|
218
410
|
registerCloseGuard: (id: string, guard: () => boolean | Promise<boolean>) => void;
|
|
411
|
+
/** Removes close confirmation guards. */
|
|
219
412
|
unregisterCloseGuard: (id: string) => void;
|
|
220
|
-
|
|
413
|
+
/** Set panel dirty state flag. */
|
|
414
|
+
setPanelDirty: (id: string, dirty: boolean, options?: DirtyStateOptions) => void;
|
|
415
|
+
/** Change title header. */
|
|
221
416
|
updatePanelTitle: (id: string, title: string | ContextMenuPredefinedMessage) => void;
|
|
417
|
+
/** Intercepts close panel requests, prompting warning dialogs if dirty. */
|
|
222
418
|
requestClosePanel: (id: string, options?: {
|
|
223
419
|
force?: boolean;
|
|
420
|
+
onConfirm?: (opts?: DirtyStateOptions) => Promise<boolean>;
|
|
224
421
|
}) => Promise<void>;
|
|
225
|
-
|
|
422
|
+
/** Docks a panel directly to workspace edges. */
|
|
226
423
|
dockPanelToWorkspaceEdge: (id: string, position: 'left' | 'right' | 'top' | 'bottom') => void;
|
|
424
|
+
/** Update active focused tab reference. */
|
|
425
|
+
setActivePanel: (id: string | null) => void;
|
|
426
|
+
/** Explicitly set or override layout direction */
|
|
427
|
+
setDirection: (dir: 'ltr' | 'rtl') => void;
|
|
227
428
|
}
|
|
429
|
+
/** Represents custom CSS classes injected into layout parts. */
|
|
228
430
|
interface StyleClasses {
|
|
229
431
|
modalClass?: string;
|
|
230
432
|
modalBodyClass?: string;
|
|
@@ -233,11 +435,13 @@ interface StyleClasses {
|
|
|
233
435
|
windowClass?: string;
|
|
234
436
|
windowBodyClass?: string;
|
|
235
437
|
}
|
|
438
|
+
/** Custom hook to read configured style class contexts. */
|
|
236
439
|
declare const useStyleClasses: () => StyleClasses;
|
|
237
440
|
interface WindowManagerProviderProps {
|
|
238
441
|
children: React__default.ReactNode;
|
|
239
442
|
formatMessage?: MessageFormatter;
|
|
240
443
|
predefinedMessages?: Record<string, ContextMenuPredefinedMessage>;
|
|
444
|
+
dir?: 'ltr' | 'rtl';
|
|
241
445
|
modalClass?: string;
|
|
242
446
|
modalBodyClass?: string;
|
|
243
447
|
sidePanelClass?: string;
|
|
@@ -246,91 +450,198 @@ interface WindowManagerProviderProps {
|
|
|
246
450
|
windowBodyClass?: string;
|
|
247
451
|
}
|
|
248
452
|
declare const WindowManagerProvider: React__default.FC<WindowManagerProviderProps>;
|
|
453
|
+
/**
|
|
454
|
+
* React hook to retrieve the active Window Manager layout state.
|
|
455
|
+
* @throws Error if used outside of a {@link WindowManagerProvider}.
|
|
456
|
+
*/
|
|
249
457
|
declare const useWindowManagerState: () => WindowState;
|
|
458
|
+
/**
|
|
459
|
+
* React hook to retrieve layouts mutation actions (dock, float, minimize, save/load).
|
|
460
|
+
* @throws Error if used outside of a {@link WindowManagerProvider}.
|
|
461
|
+
*/
|
|
250
462
|
declare const useWindowManagerActions: () => WindowActions;
|
|
463
|
+
/**
|
|
464
|
+
* React hook to retrieve the active i18n formatter.
|
|
465
|
+
*/
|
|
251
466
|
declare const useFormatMessage: () => MessageFormatter;
|
|
467
|
+
/**
|
|
468
|
+
* Helper to resolve dynamic label strings or localizable descriptor objects into text.
|
|
469
|
+
*/
|
|
252
470
|
declare const formatLabel: (label: string | ContextMenuPredefinedMessage | undefined, formatter: MessageFormatter) => string;
|
|
471
|
+
/**
|
|
472
|
+
* React hook providing pub-sub helper methods for inter-panel event messaging.
|
|
473
|
+
*/
|
|
253
474
|
declare const usePanelContext: () => {
|
|
254
475
|
publish: (event: string, data: any) => void;
|
|
255
476
|
subscribe: (event: string, callback: (data: any) => void) => () => void;
|
|
256
477
|
};
|
|
257
|
-
|
|
478
|
+
/**
|
|
479
|
+
* React hook to fetch the localizable predefined message map catalog.
|
|
480
|
+
*/
|
|
481
|
+
declare const usePredefinedMessages: () => Record<"floatWindow" | "minimizePanel" | "closeTab" | "restorePanel" | "maximizePanel" | "closePanel" | "dockWindow" | "minimize" | "maximize" | "restoreSize" | "close" | "closeEmptyGroup" | "anchorToRightEdge" | "anchorToBottomEdge" | "windowAnchoringOptions" | "unsavedChangesTitle" | "unsavedChangesMessage" | "discardChanges" | "cancel" | "yes" | "no" | "ok" | "closePanelTooltip" | "closeTooltip", ContextMenuPredefinedMessage>;
|
|
258
482
|
|
|
483
|
+
/**
|
|
484
|
+
* Options used when requesting to close a container.
|
|
485
|
+
*/
|
|
259
486
|
interface CloseOptions {
|
|
487
|
+
/** If true, bypasses any dirty state warnings or custom close guards. */
|
|
260
488
|
force?: boolean;
|
|
261
489
|
}
|
|
490
|
+
/** Represents the type of container context a panel/form is currently rendered inside. */
|
|
262
491
|
type ContainerType = 'left-panel' | 'right-panel' | 'modal' | 'dockable-panel' | 'standalone';
|
|
492
|
+
/**
|
|
493
|
+
* Contract interface exposed by a container (like a tab, window, modal, or side-panel)
|
|
494
|
+
* to its children forms, enabling them to control or listen to container events.
|
|
495
|
+
*/
|
|
263
496
|
interface FormContainerContract {
|
|
497
|
+
/** Request the container to close itself. Bypassed by default unless options.force is true. */
|
|
264
498
|
requestClose: (options?: CloseOptions) => void;
|
|
265
|
-
|
|
499
|
+
/** Mark the form's content as dirty (having unsaved changes), triggering alert dialogs on close. */
|
|
500
|
+
setDirty: (dirty: boolean, options?: DirtyStateOptions) => void;
|
|
501
|
+
/** Register a custom close guard handler. Returning false or a promise resolving to false blocks closing. */
|
|
266
502
|
onCloseRequested: (handler: () => boolean | Promise<boolean>) => (() => void);
|
|
503
|
+
/** Change the display title of the containing tab or window dynamically. */
|
|
267
504
|
setTitle: (title: string | {
|
|
268
505
|
id: string;
|
|
269
506
|
defaultMessage: string;
|
|
270
507
|
values?: Record<string, any>;
|
|
271
508
|
}) => void;
|
|
509
|
+
/** Change the tab or window icon dynamically. */
|
|
272
510
|
setIcon?: (icon: React.ReactNode) => void;
|
|
511
|
+
/** The type of container the panel is mounted in. */
|
|
273
512
|
containerType?: ContainerType;
|
|
513
|
+
/** Unique identifier of the panel or window instance. */
|
|
274
514
|
instanceId: string;
|
|
515
|
+
/** Subscribe to the container's close event. Returns an unsubscribe function. */
|
|
275
516
|
onClose?: (handler: () => void) => () => void;
|
|
517
|
+
/** Subscribe to the container's minimize event. Returns an unsubscribe function. */
|
|
276
518
|
onMinimize?: (handler: () => void) => () => void;
|
|
519
|
+
/** Subscribe to the container's restore event. Returns an unsubscribe function. */
|
|
277
520
|
onRestore?: (handler: () => void) => () => void;
|
|
521
|
+
/** Subscribe to the container's window resize event, returning width and height. */
|
|
278
522
|
onResize?: (handler: (width: number, height: number) => void) => () => void;
|
|
279
523
|
}
|
|
524
|
+
/**
|
|
525
|
+
* Context that supplies the {@link FormContainerContract} to panels inside the Window Manager.
|
|
526
|
+
*/
|
|
280
527
|
declare const FormContainerContext: React$1.Context<FormContainerContract>;
|
|
281
528
|
declare const FormContainerProvider: React$1.Provider<FormContainerContract>;
|
|
529
|
+
/**
|
|
530
|
+
* React hook to retrieve the current {@link FormContainerContract} from context.
|
|
531
|
+
* Enables sub-forms to trigger close requests, mark themselves dirty, rename their tabs, or listen to resize events.
|
|
532
|
+
*/
|
|
282
533
|
declare const useFormContainer: () => FormContainerContract;
|
|
283
534
|
|
|
535
|
+
/** Unique string identifier for panel/modal instances. */
|
|
284
536
|
type PanelInstanceId = string;
|
|
537
|
+
/**
|
|
538
|
+
* Descriptor object for localizable panel titles, supporting context translation systems.
|
|
539
|
+
*/
|
|
285
540
|
interface PanelTitleDescriptor {
|
|
541
|
+
/** The translation dictionary key. */
|
|
286
542
|
id: string;
|
|
543
|
+
/** Fallback string if translation key is missing. */
|
|
287
544
|
defaultMessage?: string;
|
|
545
|
+
/** Parameters to inject into the translated text string. */
|
|
288
546
|
values?: Record<string, string | number>;
|
|
289
547
|
}
|
|
548
|
+
/** Union type representing either a plain string or a localizable title descriptor. */
|
|
290
549
|
type PanelTitle = string | PanelTitleDescriptor;
|
|
550
|
+
/** Configuration options applied when opening a SidePanel. */
|
|
291
551
|
interface SidePanelOptions {
|
|
552
|
+
/** Display title for the side-panel header. */
|
|
292
553
|
title?: PanelTitle;
|
|
554
|
+
/** Icon displayed next to the panel title. */
|
|
293
555
|
icon?: React__default.ReactNode;
|
|
556
|
+
/** Specific CSS width (e.g. 300, '40%') for the panel container. */
|
|
294
557
|
width?: number | string;
|
|
295
558
|
}
|
|
559
|
+
/** Configuration options applied when opening a Modal. */
|
|
296
560
|
interface ModalOptions {
|
|
561
|
+
/** Display title for the modal header. */
|
|
297
562
|
title?: PanelTitle;
|
|
563
|
+
/** Icon displayed in the modal title bar. */
|
|
298
564
|
icon?: React__default.ReactNode;
|
|
565
|
+
/** Size modifier affecting CSS max-width rules. */
|
|
299
566
|
size?: 'small' | 'medium' | 'large' | 'fullscreen' | 'auto';
|
|
567
|
+
/** If false, hides the modal backdrop exit click and header close button. */
|
|
300
568
|
closable?: boolean;
|
|
301
569
|
}
|
|
570
|
+
/**
|
|
571
|
+
* Represents a rendered instance of a panel or modal in the layout.
|
|
572
|
+
*/
|
|
302
573
|
interface PanelInstance {
|
|
574
|
+
/** Unique ID generated for this instance. */
|
|
303
575
|
id: PanelInstanceId;
|
|
576
|
+
/** React Component to mount inside the panel. */
|
|
304
577
|
Component: ComponentType<any>;
|
|
578
|
+
/** Property props passed to the Component. */
|
|
305
579
|
props: Record<string, any>;
|
|
580
|
+
/** The target rendering layout zone. */
|
|
306
581
|
containerType: 'left-panel' | 'right-panel' | 'modal';
|
|
582
|
+
/** Configuration metadata settings. */
|
|
307
583
|
options: SidePanelOptions | ModalOptions;
|
|
584
|
+
/** True if the form container has unsaved user edits. */
|
|
308
585
|
dirty?: boolean;
|
|
586
|
+
/** Custom warning options applied to the automatic unsaved changes modal. */
|
|
587
|
+
dirtyOptions?: DirtyStateOptions;
|
|
309
588
|
}
|
|
589
|
+
/** Stores the active layout structures for floating overlays. */
|
|
310
590
|
interface PanelState {
|
|
591
|
+
/** The currently open left drawer panel instance, or null. */
|
|
311
592
|
leftPanel: PanelInstance | null;
|
|
593
|
+
/** The currently open right drawer panel instance, or null. */
|
|
312
594
|
rightPanel: PanelInstance | null;
|
|
595
|
+
/** Stack containing all active floating modal instances. */
|
|
313
596
|
modals: PanelInstance[];
|
|
314
597
|
}
|
|
598
|
+
/** Exposes methods to trigger state actions on drawers and modals. */
|
|
315
599
|
interface PanelActions {
|
|
600
|
+
/** Mounts a panel in the left-side container drawer. */
|
|
316
601
|
openLeftPanel: <P extends object>(Component: ComponentType<P>, props: P, options?: SidePanelOptions) => Promise<PanelInstanceId | null>;
|
|
602
|
+
/** Mounts a panel in the right-side container drawer. */
|
|
317
603
|
openRightPanel: <P extends object>(Component: ComponentType<P>, props: P, options?: SidePanelOptions) => Promise<PanelInstanceId | null>;
|
|
604
|
+
/** Pushes a new modal component instance to the top of the stack. */
|
|
318
605
|
openModal: <P extends object>(Component: ComponentType<P>, props: P, options?: ModalOptions) => PanelInstanceId;
|
|
606
|
+
/** Closes an instance by ID. */
|
|
319
607
|
close: (id: PanelInstanceId) => void;
|
|
608
|
+
/** Closes all drawers and modals in a single action. */
|
|
320
609
|
closeAll: () => void;
|
|
610
|
+
/** Closes all open modals. */
|
|
321
611
|
closeAllModals: () => void;
|
|
612
|
+
/** Retrieves metadata for an active instance by ID. */
|
|
322
613
|
getInstance: (id: PanelInstanceId) => PanelInstance | undefined;
|
|
323
|
-
|
|
324
|
-
|
|
614
|
+
/** Updates the props, configuration options, or dirty flag of an active panel. */
|
|
615
|
+
updateInstance: (id: PanelInstanceId, updates: Partial<Pick<PanelInstance, 'props' | 'options' | 'dirty' | 'dirtyOptions'>>) => void;
|
|
616
|
+
/** Flags an instance as dirty (contains unsaved changes). */
|
|
617
|
+
setDirty: (id: PanelInstanceId, dirty: boolean, options?: DirtyStateOptions) => void;
|
|
618
|
+
/** Subscribes a custom close confirmation intercept handler. */
|
|
325
619
|
registerCloseHandler: (id: PanelInstanceId, handler: () => Promise<boolean>) => void;
|
|
620
|
+
/** Unsubscribes close confirmation handler. */
|
|
326
621
|
unregisterCloseHandler: (id: PanelInstanceId) => void;
|
|
327
622
|
}
|
|
623
|
+
/**
|
|
624
|
+
* PanelProvider component manages the state and action handlers
|
|
625
|
+
* for drawers (left/right) and active stacked modal overlays.
|
|
626
|
+
*/
|
|
328
627
|
declare const PanelProvider: React__default.FC<{
|
|
329
628
|
children: ReactNode;
|
|
330
629
|
}>;
|
|
630
|
+
/**
|
|
631
|
+
* React hook to retrieve the active floating/drawer panels state.
|
|
632
|
+
* @throws Error if used outside of a {@link PanelProvider}.
|
|
633
|
+
*/
|
|
331
634
|
declare const usePanelState: () => PanelState;
|
|
635
|
+
/**
|
|
636
|
+
* React hook to retrieve actions enabling drawer toggles and modal push actions.
|
|
637
|
+
* @throws Error if used outside of a {@link PanelProvider}.
|
|
638
|
+
*/
|
|
332
639
|
declare const usePanelActions: () => PanelActions;
|
|
333
640
|
|
|
641
|
+
/**
|
|
642
|
+
* ModalStackRenderer component acts as the global container rendering
|
|
643
|
+
* all active stacked modal windows in the workspace.
|
|
644
|
+
*/
|
|
334
645
|
declare const ModalStackRenderer: React__default.FC;
|
|
335
646
|
|
|
336
647
|
interface SidePanelRendererProps {
|
|
@@ -341,29 +652,59 @@ interface SidePanelRendererProps {
|
|
|
341
652
|
*/
|
|
342
653
|
defaultWidth?: number | string;
|
|
343
654
|
}
|
|
655
|
+
/**
|
|
656
|
+
* SidePanelRenderer component acts as the global container rendering both
|
|
657
|
+
* left and right side drawers if they are currently active.
|
|
658
|
+
*/
|
|
344
659
|
declare const SidePanelRenderer: React__default.FC<SidePanelRendererProps>;
|
|
660
|
+
/**
|
|
661
|
+
* LeftPanelRenderer component renders ONLY the left side drawer if it is currently active.
|
|
662
|
+
*/
|
|
345
663
|
declare const LeftPanelRenderer: React__default.FC<SidePanelRendererProps>;
|
|
664
|
+
/**
|
|
665
|
+
* RightPanelRenderer component renders ONLY the right side drawer if it is currently active.
|
|
666
|
+
*/
|
|
346
667
|
declare const RightPanelRenderer: React__default.FC<SidePanelRendererProps>;
|
|
347
668
|
|
|
669
|
+
/**
|
|
670
|
+
* Props for the {@link ConfirmationForm} component.
|
|
671
|
+
*/
|
|
348
672
|
interface ConfirmationFormProps {
|
|
673
|
+
/** Optional custom title text or localizable descriptor for the dialog container. */
|
|
349
674
|
title?: string | {
|
|
350
675
|
id: string;
|
|
351
676
|
defaultMessage?: string;
|
|
352
677
|
values?: any;
|
|
353
678
|
};
|
|
679
|
+
/** Main message text or localizable descriptor to display. */
|
|
354
680
|
message: string | {
|
|
355
681
|
id: string;
|
|
356
682
|
defaultMessage?: string;
|
|
357
683
|
values?: any;
|
|
358
684
|
};
|
|
685
|
+
/** Optional auxiliary top alert notification text. */
|
|
359
686
|
alert?: string;
|
|
687
|
+
/** Type style classification for the alert notice banner. */
|
|
360
688
|
alertType?: 'info' | 'warning' | 'success' | 'danger';
|
|
689
|
+
/** If true, changes action button labels to 'Yes' and 'No' instead of 'OK' and 'Cancel'. */
|
|
361
690
|
useYesNoTitles?: boolean;
|
|
691
|
+
/** Callback fired when the user selects the confirm button. */
|
|
362
692
|
onOK?: () => void;
|
|
693
|
+
/** Callback fired when the user selects the cancel button. */
|
|
363
694
|
onCancel?: () => void;
|
|
364
695
|
}
|
|
696
|
+
/**
|
|
697
|
+
* ConfirmationForm component renders a standard dialog content layout,
|
|
698
|
+
* allowing users to confirm actions or abort them. Exposes action callbacks.
|
|
699
|
+
*/
|
|
365
700
|
declare const ConfirmationForm: React__default.FC<ConfirmationFormProps>;
|
|
366
701
|
|
|
702
|
+
/**
|
|
703
|
+
* @file Sidebar.tsx
|
|
704
|
+
* @description Sidebar navigation strip and drawer container component.
|
|
705
|
+
* Supports eager/lazy mounting, state preservation (display: none), and positioning (left/right).
|
|
706
|
+
*/
|
|
707
|
+
|
|
367
708
|
/**
|
|
368
709
|
* Per-tab configuration supplied by the consuming application.
|
|
369
710
|
*/
|
|
@@ -422,6 +763,10 @@ interface SidebarHandle {
|
|
|
422
763
|
/** Returns the currently active tab id, or null if the drawer is collapsed. */
|
|
423
764
|
getActiveTab: () => string | null;
|
|
424
765
|
}
|
|
766
|
+
/**
|
|
767
|
+
* Sidebar component rendering a tab strip and a collapsible content drawer.
|
|
768
|
+
* Supports imperative method bindings like openTab and closeDrawer via forwardRef.
|
|
769
|
+
*/
|
|
425
770
|
declare const Sidebar: React__default.ForwardRefExoticComponent<SidebarProps & React__default.RefAttributes<SidebarHandle>>;
|
|
426
771
|
|
|
427
772
|
export { type CloseOptions, ConfirmationForm, type ConfirmationFormProps, type ContextMenuPredefinedMessage, type FloatingWindow, FormContainerContext, type FormContainerContract, FormContainerProvider, type LayoutGridNode, type LayoutLeafNode, type LayoutNode, LeftPanelRenderer, type MessageFormatter, type ModalOptions, ModalStackRenderer, type PanelActions, type PanelInfo, type PanelInstance, type PanelInstanceId, PanelProvider, PanelRegistry, type PanelState, type PanelTitle, type PredefinedMessageKey, RightPanelRenderer, type SidePanelOptions, SidePanelRenderer, type SidePanelRendererProps, Sidebar, type SidebarHandle, type SidebarProps, type SidebarTab, type SplitOrientation, type StyleClasses, type WindowActions, WindowManager, WindowManagerProvider, type WindowState, defaultPredefinedMessages, formatLabel, useFormContainer, useFormatMessage, usePanelActions, usePanelContext, usePanelState, usePredefinedMessages, useStyleClasses, useWindowManagerActions, useWindowManagerState };
|