1 | import { Message } from '@lumino/messaging';
|
2 | import { ISignal } from '@lumino/signaling';
|
3 | import { AccordionLayout } from './accordionlayout';
|
4 | import { SplitLayout } from './splitlayout';
|
5 | import { SplitPanel } from './splitpanel';
|
6 | import { Title } from './title';
|
7 | import { Widget } from './widget';
|
8 |
|
9 |
|
10 |
|
11 |
|
12 |
|
13 |
|
14 | export declare class AccordionPanel extends SplitPanel {
|
15 | |
16 |
|
17 |
|
18 |
|
19 |
|
20 | constructor(options?: AccordionPanel.IOptions);
|
21 | /**
|
22 | * The renderer used by the accordion panel.
|
23 | */
|
24 | get renderer(): AccordionPanel.IRenderer;
|
25 | /**
|
26 | * The section title space.
|
27 | *
|
28 | * This is the height if the panel is vertical and the width if it is
|
29 | * horizontal.
|
30 | */
|
31 | get titleSpace(): number;
|
32 | set titleSpace(value: number);
|
33 | /**
|
34 | * A read-only array of the section titles in the panel.
|
35 | */
|
36 | get titles(): ReadonlyArray<HTMLElement>;
|
37 | /**
|
38 | * A signal emitted when a widget of the AccordionPanel is collapsed or expanded.
|
39 | */
|
40 | get expansionToggled(): ISignal<this, number>;
|
41 | /**
|
42 | * Add a widget to the end of the panel.
|
43 | *
|
44 | * @param widget - The widget to add to the panel.
|
45 | *
|
46 | * #### Notes
|
47 | * If the widget is already contained in the panel, it will be moved.
|
48 | */
|
49 | addWidget(widget: Widget): void;
|
50 | /**
|
51 | * Collapse the widget at position `index`.
|
52 | *
|
53 | * #### Notes
|
54 | * If no widget is found for `index`, this will bail.
|
55 | *
|
56 | * @param index Widget index
|
57 | */
|
58 | collapse(index: number): void;
|
59 | /**
|
60 | * Expand the widget at position `index`.
|
61 | *
|
62 | * #### Notes
|
63 | * If no widget is found for `index`, this will bail.
|
64 | *
|
65 | * @param index Widget index
|
66 | */
|
67 | expand(index: number): void;
|
68 | /**
|
69 | * Insert a widget at the specified index.
|
70 | *
|
71 | * @param index - The index at which to insert the widget.
|
72 | *
|
73 | * @param widget - The widget to insert into to the panel.
|
74 | *
|
75 | * #### Notes
|
76 | * If the widget is already contained in the panel, it will be moved.
|
77 | */
|
78 | insertWidget(index: number, widget: Widget): void;
|
79 | /**
|
80 | * Handle the DOM events for the accordion panel.
|
81 | *
|
82 | * @param event - The DOM event sent to the panel.
|
83 | *
|
84 | * #### Notes
|
85 | * This method implements the DOM `EventListener` interface and is
|
86 | * called in response to events on the panel's DOM node. It should
|
87 | * not be called directly by user code.
|
88 | */
|
89 | handleEvent(event: Event): void;
|
90 | /**
|
91 | * A message handler invoked on a `'before-attach'` message.
|
92 | */
|
93 | protected onBeforeAttach(msg: Message): void;
|
94 | /**
|
95 | * A message handler invoked on an `'after-detach'` message.
|
96 | */
|
97 | protected onAfterDetach(msg: Message): void;
|
98 | /**
|
99 | * Handle the `changed` signal of a title object.
|
100 | */
|
101 | private _onTitleChanged;
|
102 | /**
|
103 | * Compute the size of widgets in this panel on the title click event.
|
104 | * On closing, the size of the widget is cached and we will try to expand
|
105 | * the last opened widget.
|
106 | * On opening, we will use the cached size if it is available to restore the
|
107 | * widget.
|
108 | * In both cases, if we can not compute the size of widgets, we will let
|
109 | * `SplitLayout` decide.
|
110 | *
|
111 | * @param index - The index of widget to be opened of closed
|
112 | *
|
113 | * @returns Relative size of widgets in this panel, if this size can
|
114 | * not be computed, return `undefined`
|
115 | */
|
116 | private _computeWidgetSize;
|
117 | /**
|
118 | * Handle the `'click'` event for the accordion panel
|
119 | */
|
120 | private _evtClick;
|
121 | /**
|
122 | * Handle the `'keydown'` event for the accordion panel.
|
123 | */
|
124 | private _eventKeyDown;
|
125 | private _toggleExpansion;
|
126 | private _widgetSizesCache;
|
127 | private _expansionToggled;
|
128 | }
|
129 | /**
|
130 | * The namespace for the `AccordionPanel` class statics.
|
131 | */
|
132 | export declare namespace AccordionPanel {
|
133 | |
134 |
|
135 |
|
136 | type Orientation = SplitLayout.Orientation;
|
137 | |
138 |
|
139 |
|
140 | type Alignment = SplitLayout.Alignment;
|
141 | |
142 |
|
143 |
|
144 | type IRenderer = AccordionLayout.IRenderer;
|
145 | |
146 |
|
147 |
|
148 | interface IOptions extends Partial<AccordionLayout.IOptions> {
|
149 | |
150 |
|
151 |
|
152 |
|
153 |
|
154 |
|
155 |
|
156 | layout?: AccordionLayout;
|
157 | }
|
158 | |
159 |
|
160 |
|
161 | class Renderer extends SplitPanel.Renderer implements IRenderer {
|
162 | constructor();
|
163 | /**
|
164 | * A selector which matches any title node in the accordion.
|
165 | */
|
166 | readonly titleClassName = "lm-AccordionPanel-title";
|
167 | /**
|
168 | * Render the collapse indicator for a section title.
|
169 | *
|
170 | * @param data - The data to use for rendering the section title.
|
171 | *
|
172 | * @returns A element representing the collapse indicator.
|
173 | */
|
174 | createCollapseIcon(data: Title<Widget>): HTMLElement;
|
175 | /**
|
176 | * Render the element for a section title.
|
177 | *
|
178 | * @param data - The data to use for rendering the section title.
|
179 | *
|
180 | * @returns A element representing the section title.
|
181 | */
|
182 | createSectionTitle(data: Title<Widget>): HTMLElement;
|
183 | /**
|
184 | * Create a unique render key for the title.
|
185 | *
|
186 | * @param data - The data to use for the title.
|
187 | *
|
188 | * @returns The unique render key for the title.
|
189 | *
|
190 | * #### Notes
|
191 | * This method caches the key against the section title the first time
|
192 | * the key is generated.
|
193 | */
|
194 | createTitleKey(data: Title<Widget>): string;
|
195 | private static _nInstance;
|
196 | private readonly _uuid;
|
197 | private _titleID;
|
198 | private _titleKeys;
|
199 | }
|
200 | /**
|
201 | * The default `Renderer` instance.
|
202 | */
|
203 | const defaultRenderer: Renderer;
|
204 | }
|