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