@smart-webcomponents-angular/window 22.0.3 → 24.0.16
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/esm2020/window/smart.window.mjs +136 -106
- package/fesm2015/smart-webcomponents-angular-window.mjs +135 -105
- package/fesm2015/smart-webcomponents-angular-window.mjs.map +1 -1
- package/fesm2020/smart-webcomponents-angular-window.mjs +135 -105
- package/fesm2020/smart-webcomponents-angular-window.mjs.map +1 -1
- package/index.d.ts +5489 -5228
- package/package.json +1 -1
- package/source/modules/smart.window.js +1 -1
- package/source/smart.button.js +1 -1
- package/source/smart.combobox.js +2 -2
- package/source/smart.dropdownlist.js +2 -2
- package/source/smart.element.js +2 -2
- package/source/smart.listbox.js +2 -2
- package/source/smart.multilinetextbox.js +1 -1
- package/source/smart.progressbar.js +1 -1
- package/source/smart.scrollbar.js +1 -1
- package/source/smart.textbox.js +1 -1
- package/source/smart.window.js +2 -2
- package/styles/smart.base.css +1 -1
- package/styles/smart.window.css +2 -2
- package/window/smart.window.d.ts +110 -105
|
@@ -121,43 +121,43 @@ class WindowComponent extends BaseElement {
|
|
|
121
121
|
constructor(ref) {
|
|
122
122
|
super(ref);
|
|
123
123
|
this.eventHandlers = [];
|
|
124
|
-
/** @description This event is triggered
|
|
124
|
+
/** @description This event is triggered immediately before the window begins its opening process, allowing developers to perform any preparatory actions or modifications prior to the window becoming visible to the user.
|
|
125
125
|
* @param event. The custom event. */
|
|
126
126
|
this.onOpening = new EventEmitter();
|
|
127
|
-
/** @description This event is triggered when the window is opened
|
|
127
|
+
/** @description This event is triggered when the window becomes visible to the user—specifically, when it is opened or brought into view.
|
|
128
128
|
* @param event. The custom event. */
|
|
129
129
|
this.onOpen = new EventEmitter();
|
|
130
|
-
/** @description This event is triggered
|
|
130
|
+
/** @description This event is triggered immediately before the window begins the closing process, allowing developers to execute custom logic or prompt the user for confirmation before the window is fully closed.
|
|
131
131
|
* @param event. The custom event. */
|
|
132
132
|
this.onClosing = new EventEmitter();
|
|
133
|
-
/** @description This event is triggered when the window is closed
|
|
133
|
+
/** @description This event is triggered when the window is closed or becomes hidden, such as when the user closes the browser tab, navigates away, or minimizes the window, causing it to no longer be visible to the user.
|
|
134
134
|
* @param event. The custom event. */
|
|
135
135
|
this.onClose = new EventEmitter();
|
|
136
|
-
/** @description This event is triggered
|
|
136
|
+
/** @description This event is triggered whenever the application window is minimized or collapsed by the user. It allows you to execute custom logic in response to the window being hidden from view.
|
|
137
137
|
* @param event. The custom event. */
|
|
138
138
|
this.onCollapse = new EventEmitter();
|
|
139
|
-
/** @description This event is triggered when
|
|
139
|
+
/** @description This event is triggered when the user finishes dragging the window, signaling the completion of the drag-and-drop operation. It occurs after the mouse button is released and the window movement has stopped.
|
|
140
140
|
* @param event. The custom event. */
|
|
141
141
|
this.onDragEnd = new EventEmitter();
|
|
142
|
-
/** @description This event is triggered when window
|
|
142
|
+
/** @description This event is triggered when the user initiates a window drag operation, indicating that the dragging of the window has begun. It fires as soon as the user starts moving the window, typically by clicking and holding the window's title bar.
|
|
143
143
|
* @param event. The custom event. */
|
|
144
144
|
this.onDragStart = new EventEmitter();
|
|
145
|
-
/** @description This event is triggered
|
|
145
|
+
/** @description This event is triggered whenever the window is resized to a larger size, indicating that the user has expanded the window either by dragging its edges or by maximizing it.
|
|
146
146
|
* @param event. The custom event. */
|
|
147
147
|
this.onExpand = new EventEmitter();
|
|
148
|
-
/** @description This event is triggered
|
|
148
|
+
/** @description This event is triggered whenever the application window transitions into a maximized state. It fires immediately after the window expands to fill the available screen space, allowing developers to implement custom logic in response to the window being maximized by the user or programmatically.
|
|
149
149
|
* @param event. The custom event. */
|
|
150
150
|
this.onMaximize = new EventEmitter();
|
|
151
|
-
/** @description This event is triggered
|
|
151
|
+
/** @description This event is triggered whenever the application window is minimized by the user. It occurs immediately after the minimize action takes place, allowing developers to execute custom logic—such as pausing background processes, saving state, or updating the UI—in response to the window being minimized.
|
|
152
152
|
* @param event. The custom event. */
|
|
153
153
|
this.onMinimize = new EventEmitter();
|
|
154
|
-
/** @description This event is triggered when window
|
|
154
|
+
/** @description This event is triggered when the user completes resizing the browser window, specifically after the resizing action has finished and the window size is no longer changing.
|
|
155
155
|
* @param event. The custom event. */
|
|
156
156
|
this.onResizeEnd = new EventEmitter();
|
|
157
|
-
/** @description This event is triggered when window
|
|
157
|
+
/** @description This event is triggered when the user initiates a window resize action, such as clicking and dragging the window’s edge or corner to change its dimensions. It marks the beginning of the window resizing process, allowing you to execute scripts or handle UI updates as soon as resizing starts.
|
|
158
158
|
* @param event. The custom event. */
|
|
159
159
|
this.onResizeStart = new EventEmitter();
|
|
160
|
-
/** @description This event is triggered when the window is
|
|
160
|
+
/** @description This event is triggered when the window is returned to its original size and position after being maximized, effectively restoring it to the state it was in prior to maximization.
|
|
161
161
|
* @param event. The custom event. */
|
|
162
162
|
this.onRestore = new EventEmitter();
|
|
163
163
|
this.nativeElement = ref.nativeElement;
|
|
@@ -172,497 +172,497 @@ class WindowComponent extends BaseElement {
|
|
|
172
172
|
}
|
|
173
173
|
return this.nativeElement;
|
|
174
174
|
}
|
|
175
|
-
/** @description Determines
|
|
175
|
+
/** @description Determines whether the 'Add New' tab within the Tabs element is currently visible to the user. Note: This property is only relevant when used with the TabsWindow component; it does not apply to other components. */
|
|
176
176
|
get addNewTab() {
|
|
177
177
|
return this.nativeElement ? this.nativeElement.addNewTab : undefined;
|
|
178
178
|
}
|
|
179
179
|
set addNewTab(value) {
|
|
180
180
|
this.nativeElement ? this.nativeElement.addNewTab = value : undefined;
|
|
181
181
|
}
|
|
182
|
-
/** @description Sets or
|
|
182
|
+
/** @description Sets or retrieves the current animation mode. When this property is set to 'none', all animations are disabled. If set to any other supported value, animations will be enabled and behave according to the specified mode. */
|
|
183
183
|
get animation() {
|
|
184
184
|
return this.nativeElement ? this.nativeElement.animation : undefined;
|
|
185
185
|
}
|
|
186
186
|
set animation(value) {
|
|
187
187
|
this.nativeElement ? this.nativeElement.animation = value : undefined;
|
|
188
188
|
}
|
|
189
|
-
/** @description
|
|
189
|
+
/** @description Controls the automatic capitalization behavior for user input as it is entered or edited. This setting specifies whether characters are auto-capitalized (e.g., sentences, words, or all characters) in the input field. Note: This property is only relevant when used with the MultilinePromptWindow component. */
|
|
190
190
|
get autoCapitalize() {
|
|
191
191
|
return this.nativeElement ? this.nativeElement.autoCapitalize : undefined;
|
|
192
192
|
}
|
|
193
193
|
set autoCapitalize(value) {
|
|
194
194
|
this.nativeElement ? this.nativeElement.autoCapitalize = value : undefined;
|
|
195
195
|
}
|
|
196
|
-
/** @description
|
|
196
|
+
/** @description Specifies whether the element should automatically expand its height to accommodate vertically overflowing input. Note: This setting only applies to MultilinePromptWindow components. */
|
|
197
197
|
get autoExpand() {
|
|
198
198
|
return this.nativeElement ? this.nativeElement.autoExpand : undefined;
|
|
199
199
|
}
|
|
200
200
|
set autoExpand(value) {
|
|
201
201
|
this.nativeElement ? this.nativeElement.autoExpand = value : undefined;
|
|
202
202
|
}
|
|
203
|
-
/** @description
|
|
203
|
+
/** @description Specifies the text displayed on the 'Cancel' button within the Prompt Window. This label informs users which button will dismiss or close the prompt without taking any action. */
|
|
204
204
|
get cancelLabel() {
|
|
205
205
|
return this.nativeElement ? this.nativeElement.cancelLabel : undefined;
|
|
206
206
|
}
|
|
207
207
|
set cancelLabel(value) {
|
|
208
208
|
this.nativeElement ? this.nativeElement.cancelLabel = value : undefined;
|
|
209
209
|
}
|
|
210
|
-
/** @description
|
|
210
|
+
/** @description Specifies the text that appears on the 'Complete' button within the Progress Window, allowing customization of the button label to better suit user interface requirements. */
|
|
211
211
|
get completeLabel() {
|
|
212
212
|
return this.nativeElement ? this.nativeElement.completeLabel : undefined;
|
|
213
213
|
}
|
|
214
214
|
set completeLabel(value) {
|
|
215
215
|
this.nativeElement ? this.nativeElement.completeLabel = value : undefined;
|
|
216
216
|
}
|
|
217
|
-
/** @description
|
|
217
|
+
/** @description Specifies the text displayed on the 'Confirm' button within the Prompt Window, allowing customization of the button label to suit your application's context. */
|
|
218
218
|
get confirmLabel() {
|
|
219
219
|
return this.nativeElement ? this.nativeElement.confirmLabel : undefined;
|
|
220
220
|
}
|
|
221
221
|
set confirmLabel(value) {
|
|
222
222
|
this.nativeElement ? this.nativeElement.confirmLabel = value : undefined;
|
|
223
223
|
}
|
|
224
|
-
/** @description
|
|
224
|
+
/** @description Indicates whether the window is currently collapsed. When set to true, only the window's header is displayed while the content area is hidden. If false, both the header and the full content of the window are visible. */
|
|
225
225
|
get collapsed() {
|
|
226
226
|
return this.nativeElement ? this.nativeElement.collapsed : undefined;
|
|
227
227
|
}
|
|
228
228
|
set collapsed(value) {
|
|
229
229
|
this.nativeElement ? this.nativeElement.collapsed = value : undefined;
|
|
230
230
|
}
|
|
231
|
-
/** @description When a modal window is opened,
|
|
231
|
+
/** @description When a modal window is opened, this property specifies whether clicking on the overlay (mask) outside the modal will close the window. Set it to true to allow users to dismiss the modal by clicking the mask, or false to require an explicit action (such as clicking a close button) to close the modal. */
|
|
232
232
|
get closeOnMaskClick() {
|
|
233
233
|
return this.nativeElement ? this.nativeElement.closeOnMaskClick : undefined;
|
|
234
234
|
}
|
|
235
235
|
set closeOnMaskClick(value) {
|
|
236
236
|
this.nativeElement ? this.nativeElement.closeOnMaskClick = value : undefined;
|
|
237
237
|
}
|
|
238
|
-
/** @description
|
|
238
|
+
/** @description Specifies the data source to be loaded into the TabsWindow component. This property is relevant exclusively for the TabsWindow and will not affect other components. */
|
|
239
239
|
get dataSource() {
|
|
240
240
|
return this.nativeElement ? this.nativeElement.dataSource : undefined;
|
|
241
241
|
}
|
|
242
242
|
set dataSource(value) {
|
|
243
243
|
this.nativeElement ? this.nativeElement.dataSource = value : undefined;
|
|
244
244
|
}
|
|
245
|
-
/** @description
|
|
245
|
+
/** @description Controls whether the window is active and visible to the user. When enabled, the window is operational and can be interacted with; when disabled, the window is hidden or inactive, and user interactions are ignored. */
|
|
246
246
|
get disabled() {
|
|
247
247
|
return this.nativeElement ? this.nativeElement.disabled : undefined;
|
|
248
248
|
}
|
|
249
249
|
set disabled(value) {
|
|
250
250
|
this.nativeElement ? this.nativeElement.disabled = value : undefined;
|
|
251
251
|
}
|
|
252
|
-
/** @description
|
|
252
|
+
/** @description Controls whether the window snapping feature is active. When enabled, users can automatically align and resize windows by dragging them to the edges or corners of the screen. Disabling this feature prevents windows from snapping into place during movement. */
|
|
253
253
|
get disableSnap() {
|
|
254
254
|
return this.nativeElement ? this.nativeElement.disableSnap : undefined;
|
|
255
255
|
}
|
|
256
256
|
set disableSnap(value) {
|
|
257
257
|
this.nativeElement ? this.nativeElement.disableSnap = value : undefined;
|
|
258
258
|
}
|
|
259
|
-
/** @description By default the window
|
|
259
|
+
/** @description By default, pressing the 'Escape' key will automatically close the window. To prevent the window from closing when 'Escape' is pressed, set this property to true. */
|
|
260
260
|
get disableEscape() {
|
|
261
261
|
return this.nativeElement ? this.nativeElement.disableEscape : undefined;
|
|
262
262
|
}
|
|
263
263
|
set disableEscape(value) {
|
|
264
264
|
this.nativeElement ? this.nativeElement.disableEscape = value : undefined;
|
|
265
265
|
}
|
|
266
|
-
/** @description By default the window
|
|
266
|
+
/** @description By default, the window handles certain keyboard inputs such as the arrow keys ('ArrowUp', 'ArrowDown', etc.), 'Escape', and similar keys for scrolling or navigation actions. Set this property to true to disable the window’s default keyboard handling, allowing you to manage these key events manually within your application. */
|
|
267
267
|
get disableKeyboard() {
|
|
268
268
|
return this.nativeElement ? this.nativeElement.disableKeyboard : undefined;
|
|
269
269
|
}
|
|
270
270
|
set disableKeyboard(value) {
|
|
271
271
|
this.nativeElement ? this.nativeElement.disableKeyboard = value : undefined;
|
|
272
272
|
}
|
|
273
|
-
/** @description
|
|
273
|
+
/** @description Specifies the visual presentation of characters entered within the input field. For example, this setting can control whether characters are shown as plain text or masked (such as for password fields). This option applies specifically to the Prompt Window component. */
|
|
274
274
|
get displayMode() {
|
|
275
275
|
return this.nativeElement ? this.nativeElement.displayMode : undefined;
|
|
276
276
|
}
|
|
277
277
|
set displayMode(value) {
|
|
278
278
|
this.nativeElement ? this.nativeElement.displayMode = value : undefined;
|
|
279
279
|
}
|
|
280
|
-
/** @description Applicable to TabsWindow when docked
|
|
280
|
+
/** @description ''Applicable to TabsWindow components when they are docked within a DockingLayout Custom Element.This property specifies the valid drop locations for the window—and its tab items—inside the DockingLayout. The property accepts an array of positional values, allowing you to define multiple allowable drop zones.Details: Positions prefixed with 'layout-' apply to each individual tab item (child element) of the TabsWindow being dragged. These determine where tab items can be dropped within the overall layout, outside their original container. Other position values (without the 'layout-' prefix) indicate allowed drop positions directly within the hovered target TabsWindow, specifying where the whole window or its tabs can be placed relative to the target window.Notes: This property is used exclusively by jqxDockingLayout custom elements. It controls the possible drop targets—both at the window and tab levels—within the DockingLayout environment.Allowed Values: The array values specify the permitted drop positions. Refer to the documentation for a complete list of supported position strings. */
|
|
281
281
|
get dropPosition() {
|
|
282
282
|
return this.nativeElement ? this.nativeElement.dropPosition : undefined;
|
|
283
283
|
}
|
|
284
284
|
set dropPosition(value) {
|
|
285
285
|
this.nativeElement ? this.nativeElement.dropPosition = value : undefined;
|
|
286
286
|
}
|
|
287
|
-
/** @description A callback function
|
|
287
|
+
/** @description A callback function that specifies how to format the label displayed on the Progress Bar. This function allows customization of the label's content or appearance based on the current progress value. Note: This property is only applicable to the ProgressWindow component. */
|
|
288
288
|
get formatFunction() {
|
|
289
289
|
return this.nativeElement ? this.nativeElement.formatFunction : undefined;
|
|
290
290
|
}
|
|
291
291
|
set formatFunction(value) {
|
|
292
292
|
this.nativeElement ? this.nativeElement.formatFunction = value : undefined;
|
|
293
293
|
}
|
|
294
|
-
/** @description
|
|
294
|
+
/** @description Specifies the exact placement or alignment of the footer section within the window element, such as positioning it at the bottom, fixed, absolute, or relative to other content. This property controls where the footer appears in relation to the window’s layout. */
|
|
295
295
|
get footerPosition() {
|
|
296
296
|
return this.nativeElement ? this.nativeElement.footerPosition : undefined;
|
|
297
297
|
}
|
|
298
298
|
set footerPosition(value) {
|
|
299
299
|
this.nativeElement ? this.nativeElement.footerPosition = value : undefined;
|
|
300
300
|
}
|
|
301
|
-
/** @description
|
|
301
|
+
/** @description Specifies the custom template used to render the footer section of the Dialog window. If footerTemplate is set to null (the default), the Dialog will not display a footer section. You can provide a template string or a function to customize the appearance and content of the Dialog’s footer. */
|
|
302
302
|
get footerTemplate() {
|
|
303
303
|
return this.nativeElement ? this.nativeElement.footerTemplate : undefined;
|
|
304
304
|
}
|
|
305
305
|
set footerTemplate(value) {
|
|
306
306
|
this.nativeElement ? this.nativeElement.footerTemplate = value : undefined;
|
|
307
307
|
}
|
|
308
|
-
/** @description
|
|
308
|
+
/** @description Specifies which buttons will be displayed in the header section, allowing you to control the visibility of header actions for users. */
|
|
309
309
|
get headerButtons() {
|
|
310
310
|
return this.nativeElement ? this.nativeElement.headerButtons : undefined;
|
|
311
311
|
}
|
|
312
312
|
set headerButtons(value) {
|
|
313
313
|
this.nativeElement ? this.nativeElement.headerButtons = value : undefined;
|
|
314
314
|
}
|
|
315
|
-
/** @description
|
|
315
|
+
/** @description Specifies the custom template to be used for rendering the header section of the dialog window. If headerTemplate is set to null (the default value), the dialog will display its standard header layout. By providing a template, you can fully customize the appearance and content of the dialog's header area. */
|
|
316
316
|
get headerTemplate() {
|
|
317
317
|
return this.nativeElement ? this.nativeElement.headerTemplate : undefined;
|
|
318
318
|
}
|
|
319
319
|
set headerTemplate(value) {
|
|
320
320
|
this.nativeElement ? this.nativeElement.headerTemplate = value : undefined;
|
|
321
321
|
}
|
|
322
|
-
/** @description
|
|
322
|
+
/** @description Specifies the exact placement of the header section within the window element, such as top, bottom, left, or right. This setting controls where the header appears relative to the content of the window. */
|
|
323
323
|
get headerPosition() {
|
|
324
324
|
return this.nativeElement ? this.nativeElement.headerPosition : undefined;
|
|
325
325
|
}
|
|
326
326
|
set headerPosition(value) {
|
|
327
327
|
this.nativeElement ? this.nativeElement.headerPosition = value : undefined;
|
|
328
328
|
}
|
|
329
|
-
/** @description
|
|
329
|
+
/** @description Displays supplementary helper text beneath the text box, providing users with additional guidance or context. This hint appears only when the text box is focused (i.e., the user is actively typing or has selected the field). Note: This property is specifically applicable to the Prompt Window component. */
|
|
330
330
|
get hint() {
|
|
331
331
|
return this.nativeElement ? this.nativeElement.hint : undefined;
|
|
332
332
|
}
|
|
333
333
|
set hint(value) {
|
|
334
334
|
this.nativeElement ? this.nativeElement.hint = value : undefined;
|
|
335
335
|
}
|
|
336
|
-
/** @description Sets the
|
|
336
|
+
/** @description Sets the Progress bar value to the indeterminate state ('null'), activating its loading animation to indicate ongoing progress without a defined endpoint. Note: This property is only applicable when used within a ProgressWindow component. */
|
|
337
337
|
get indeterminate() {
|
|
338
338
|
return this.nativeElement ? this.nativeElement.indeterminate : undefined;
|
|
339
339
|
}
|
|
340
340
|
set indeterminate(value) {
|
|
341
341
|
this.nativeElement ? this.nativeElement.indeterminate = value : undefined;
|
|
342
342
|
}
|
|
343
|
-
/** @description
|
|
343
|
+
/** @description Specifies the direction in which the Progress Bar fills (e.g., left-to-right, right-to-left, top-to-bottom, or bottom-to-top). Note: This property is only applicable when used within a ProgressWindow component. */
|
|
344
344
|
get inverted() {
|
|
345
345
|
return this.nativeElement ? this.nativeElement.inverted : undefined;
|
|
346
346
|
}
|
|
347
347
|
set inverted(value) {
|
|
348
348
|
this.nativeElement ? this.nativeElement.inverted = value : undefined;
|
|
349
349
|
}
|
|
350
|
-
/** @description
|
|
350
|
+
/** @description Specifies the text displayed as the window title in the header section, typically shown at the top of the application window or dialog box. */
|
|
351
351
|
get label() {
|
|
352
352
|
return this.nativeElement ? this.nativeElement.label : undefined;
|
|
353
353
|
}
|
|
354
354
|
set label(value) {
|
|
355
355
|
this.nativeElement ? this.nativeElement.label = value : undefined;
|
|
356
356
|
}
|
|
357
|
-
/** @description When enabled the resizing operation
|
|
357
|
+
/** @description When enabled, the resizing operation updates the element’s size in real time as the user drags its edges, providing immediate visual feedback. By default, this feature is disabled; instead, a highlighter appears around the edges of the window during resizing to indicate the prospective new size, while the element itself resizes only once the operation is complete. */
|
|
358
358
|
get liveResize() {
|
|
359
359
|
return this.nativeElement ? this.nativeElement.liveResize : undefined;
|
|
360
360
|
}
|
|
361
361
|
set liveResize(value) {
|
|
362
362
|
this.nativeElement ? this.nativeElement.liveResize = value : undefined;
|
|
363
363
|
}
|
|
364
|
-
/** @description
|
|
364
|
+
/** @description Note: This property is relevant only for TabsWindow elements that are utilized within a DockingLayout custom element.This property is exclusively used by jqxDockingLayout to specify ownership of a TabsWindow. It determines which jqxDockingLayout instance the window is associated with. If a TabsWindow is removed from its parent DockingLayout element, this property continues to reference the original docking layout to which it belonged.The property accepts either: A string representing the id of a jqxDockingLayout present on the page. An instance of a jqxDockingLayout object.This allows for flexible identification of the owning layout, either by ID or by direct reference to the layout instance. */
|
|
365
365
|
get layout() {
|
|
366
366
|
return this.nativeElement ? this.nativeElement.layout : undefined;
|
|
367
367
|
}
|
|
368
368
|
set layout(value) {
|
|
369
369
|
this.nativeElement ? this.nativeElement.layout = value : undefined;
|
|
370
370
|
}
|
|
371
|
-
/** @description
|
|
371
|
+
/** @description Gets or sets the unlockKey, a unique code required to activate or unlock access to the product’s full features or licensed functionality. */
|
|
372
372
|
get unlockKey() {
|
|
373
373
|
return this.nativeElement ? this.nativeElement.unlockKey : undefined;
|
|
374
374
|
}
|
|
375
375
|
set unlockKey(value) {
|
|
376
376
|
this.nativeElement ? this.nativeElement.unlockKey = value : undefined;
|
|
377
377
|
}
|
|
378
|
-
/** @description
|
|
378
|
+
/** @description Specifies the language to be used for displaying messages. This property can be set or retrieved, and works in conjunction with the messages property to determine which set of localized messages is shown to the user. Changing the language updates the displayed messages accordingly. */
|
|
379
379
|
get locale() {
|
|
380
380
|
return this.nativeElement ? this.nativeElement.locale : undefined;
|
|
381
381
|
}
|
|
382
382
|
set locale(value) {
|
|
383
383
|
this.nativeElement ? this.nativeElement.locale = value : undefined;
|
|
384
384
|
}
|
|
385
|
-
/** @description
|
|
385
|
+
/** @description Note: This property is only applicable to a TabsWindow when it is docked within a DockingLayout custom element. When enabled, it controls whether the TabsWindow can be resized by the user. If set to true, users will be able to adjust the size of the TabsWindow within the DockingLayout; if set to false, resizing will be disabled and the TabsWindow will have a fixed size. */
|
|
386
386
|
get locked() {
|
|
387
387
|
return this.nativeElement ? this.nativeElement.locked : undefined;
|
|
388
388
|
}
|
|
389
389
|
set locked(value) {
|
|
390
390
|
this.nativeElement ? this.nativeElement.locked = value : undefined;
|
|
391
391
|
}
|
|
392
|
-
/** @description Callback,
|
|
392
|
+
/** @description Callback function used within the localization module, typically invoked when a localization event occurs (e.g., language change, resource load). This callback handles tasks such as updating UI elements or retrieving localized content based on the current language settings. */
|
|
393
393
|
get localizeFormatFunction() {
|
|
394
394
|
return this.nativeElement ? this.nativeElement.localizeFormatFunction : undefined;
|
|
395
395
|
}
|
|
396
396
|
set localizeFormatFunction(value) {
|
|
397
397
|
this.nativeElement ? this.nativeElement.localizeFormatFunction = value : undefined;
|
|
398
398
|
}
|
|
399
|
-
/** @description
|
|
399
|
+
/** @description Indicates whether the window is currently maximized. When set to true, the window expands to fill the entire available viewport, covering all other interface elements and leaving no visible borders or title bars. If false, the window retains its previous size and position. This property can be used to programmatically check or control the window’s maximized state within the application. */
|
|
400
400
|
get maximized() {
|
|
401
401
|
return this.nativeElement ? this.nativeElement.maximized : undefined;
|
|
402
402
|
}
|
|
403
403
|
set maximized(value) {
|
|
404
404
|
this.nativeElement ? this.nativeElement.maximized = value : undefined;
|
|
405
405
|
}
|
|
406
|
-
/** @description
|
|
406
|
+
/** @description Defines or retrieves an object containing localized strings used throughout the widget’s user interface. This property allows developers to customize the widget’s displayed text for different languages and regions. It is typically used together with the locale property to ensure that the widget adapts its content based on the selected language or regional settings. */
|
|
407
407
|
get messages() {
|
|
408
408
|
return this.nativeElement ? this.nativeElement.messages : undefined;
|
|
409
409
|
}
|
|
410
410
|
set messages(value) {
|
|
411
411
|
this.nativeElement ? this.nativeElement.messages = value : undefined;
|
|
412
412
|
}
|
|
413
|
-
/** @description
|
|
413
|
+
/** @description Specifies whether the window should function as a modal dialog. When set to true, the window captures user focus and prevents interaction with any other elements on the page until it is closed. This ensures that the user must address or dismiss the modal window before returning to the rest of the content. */
|
|
414
414
|
get modal() {
|
|
415
415
|
return this.nativeElement ? this.nativeElement.modal : undefined;
|
|
416
416
|
}
|
|
417
417
|
set modal(value) {
|
|
418
418
|
this.nativeElement ? this.nativeElement.modal = value : undefined;
|
|
419
419
|
}
|
|
420
|
-
/** @description
|
|
420
|
+
/** @description For use with TabsWindow when docked within a DockingLayout custom element: Specifies the maximum size that the TabsWindow component can occupy when it is docked. For the ProgressWindow component: Defines the maximum value for the progress bar, allowing users to set the upper limit of the ProgressBar's range. */
|
|
421
421
|
get max() {
|
|
422
422
|
return this.nativeElement ? this.nativeElement.max : undefined;
|
|
423
423
|
}
|
|
424
424
|
set max(value) {
|
|
425
425
|
this.nativeElement ? this.nativeElement.max = value : undefined;
|
|
426
426
|
}
|
|
427
|
-
/** @description Applicable to TabsWindow when docked inside DockingLayout
|
|
427
|
+
/** @description Applicable to TabsWindow when docked inside a DockingLayout custom element. Specifies the minimum allowed size for the item within the layout, ensuring it does not shrink below this value during resizing operations.Also applies to ProgressWindow, where it lets the user set the minimum value for the ProgressBar, defining the lowest possible progress state that can be represented. */
|
|
428
428
|
get min() {
|
|
429
429
|
return this.nativeElement ? this.nativeElement.min : undefined;
|
|
430
430
|
}
|
|
431
431
|
set min(value) {
|
|
432
432
|
this.nativeElement ? this.nativeElement.min = value : undefined;
|
|
433
433
|
}
|
|
434
|
-
/** @description
|
|
434
|
+
/** @description Indicates whether the window is currently minimized. When set to true, the window is reduced to an icon or compact form and positioned (docked) in the bottom left corner of the viewport. If false, the window remains in its normal, active state. */
|
|
435
435
|
get minimized() {
|
|
436
436
|
return this.nativeElement ? this.nativeElement.minimized : undefined;
|
|
437
437
|
}
|
|
438
438
|
set minimized(value) {
|
|
439
439
|
this.nativeElement ? this.nativeElement.minimized = value : undefined;
|
|
440
440
|
}
|
|
441
|
-
/** @description
|
|
441
|
+
/** @description Specifies or retrieves the maximum number of characters a user is allowed to enter into the input field. This property applies to both Prompt and MultilinePrompt windows. If set, the input will be limited to the defined character count, preventing users from entering more characters than specified. */
|
|
442
442
|
get maxLength() {
|
|
443
443
|
return this.nativeElement ? this.nativeElement.maxLength : undefined;
|
|
444
444
|
}
|
|
445
445
|
set maxLength(value) {
|
|
446
446
|
this.nativeElement ? this.nativeElement.maxLength = value : undefined;
|
|
447
447
|
}
|
|
448
|
-
/** @description
|
|
448
|
+
/** @description Defines the minimum number of characters a user must enter before the autocomplete feature is activated. This property can be both set (to specify the desired threshold) and retrieved (to check the current threshold). Note: This setting is only applicable to Prompt and MultilinePrompt windows. */
|
|
449
449
|
get minLength() {
|
|
450
450
|
return this.nativeElement ? this.nativeElement.minLength : undefined;
|
|
451
451
|
}
|
|
452
452
|
set minLength(value) {
|
|
453
453
|
this.nativeElement ? this.nativeElement.minLength = value : undefined;
|
|
454
454
|
}
|
|
455
|
-
/** @description
|
|
455
|
+
/** @description Indicates whether the window is currently visible to the user. Returns true if the window is displayed on the screen and can be interacted with, and false if it is hidden or minimized. */
|
|
456
456
|
get opened() {
|
|
457
457
|
return this.nativeElement ? this.nativeElement.opened : undefined;
|
|
458
458
|
}
|
|
459
459
|
set opened(value) {
|
|
460
460
|
this.nativeElement ? this.nativeElement.opened = value : undefined;
|
|
461
461
|
}
|
|
462
|
-
/** @description
|
|
462
|
+
/** @description Indicates whether the window is pinned. A pinned window cannot be moved (dragged) by the user, but it can still be resized. When set to true, this property disables window dragging while allowing resizing operations. */
|
|
463
463
|
get pinned() {
|
|
464
464
|
return this.nativeElement ? this.nativeElement.pinned : undefined;
|
|
465
465
|
}
|
|
466
466
|
set pinned(value) {
|
|
467
467
|
this.nativeElement ? this.nativeElement.pinned = value : undefined;
|
|
468
468
|
}
|
|
469
|
-
/** @description
|
|
469
|
+
/** @description Specifies the placeholder text that appears inside the input field before the user enters a value. Note: This option is only applicable to the Prompt Window component. */
|
|
470
470
|
get placeholder() {
|
|
471
471
|
return this.nativeElement ? this.nativeElement.placeholder : undefined;
|
|
472
472
|
}
|
|
473
473
|
set placeholder(value) {
|
|
474
474
|
this.nativeElement ? this.nativeElement.placeholder = value : undefined;
|
|
475
475
|
}
|
|
476
|
-
/** @description
|
|
476
|
+
/** @description Specifies the text label displayed above or alongside the input field within the PromptWindow component. This label helps users understand what information is expected in the input field. */
|
|
477
477
|
get promptLabel() {
|
|
478
478
|
return this.nativeElement ? this.nativeElement.promptLabel : undefined;
|
|
479
479
|
}
|
|
480
480
|
set promptLabel(value) {
|
|
481
481
|
this.nativeElement ? this.nativeElement.promptLabel = value : undefined;
|
|
482
482
|
}
|
|
483
|
-
/** @description If the element
|
|
483
|
+
/** @description If the element has the "readonly" attribute, users cannot modify its value; the field will display data in a non-editable state, though users can still select and copy its contents. This differs from a "disabled" element, as a "readonly" field remains focusable and included in form submissions. */
|
|
484
484
|
get readonly() {
|
|
485
485
|
return this.nativeElement ? this.nativeElement.readonly : undefined;
|
|
486
486
|
}
|
|
487
487
|
set readonly(value) {
|
|
488
488
|
this.nativeElement ? this.nativeElement.readonly = value : undefined;
|
|
489
489
|
}
|
|
490
|
-
/** @description When
|
|
490
|
+
/** @description When this option is enabled, a resize handle appears in the bottom-right corner of the window. Users can initiate the resizing operation exclusively by dragging this indicator; resizing from any other window edge or corner is disabled. */
|
|
491
491
|
get resizeIndicator() {
|
|
492
492
|
return this.nativeElement ? this.nativeElement.resizeIndicator : undefined;
|
|
493
493
|
}
|
|
494
494
|
set resizeIndicator(value) {
|
|
495
495
|
this.nativeElement ? this.nativeElement.resizeIndicator = value : undefined;
|
|
496
496
|
}
|
|
497
|
-
/** @description
|
|
497
|
+
/** @description Specifies how the window can be resized by the user.Available resizing modes: none – Disables all window resizing; the window size is fixed. vertical – Allows the window to be resized only vertically (top and bottom edges). horizontal – Allows the window to be resized only horizontally (left and right edges). both – Enables both horizontal and vertical resizing; the window can be resized in any direction. top – The window can only be resized by dragging the top edge. bottom – The window can only be resized by dragging the bottom edge. left – The window can only be resized by dragging the left edge. right – The window can only be resized by dragging the right edge.Choose the desired mode to control which edges of the window users can drag to resize, or to prevent resizing entirely. */
|
|
498
498
|
get resizeMode() {
|
|
499
499
|
return this.nativeElement ? this.nativeElement.resizeMode : undefined;
|
|
500
500
|
}
|
|
501
501
|
set resizeMode(value) {
|
|
502
502
|
this.nativeElement ? this.nativeElement.resizeMode = value : undefined;
|
|
503
503
|
}
|
|
504
|
-
/** @description
|
|
504
|
+
/** @description Gets or sets a value that determines whether the element’s alignment is configured to support right-to-left (RTL) languages and text direction, such as Arabic or Hebrew. Use this property to ensure proper display and alignment for locales that require RTL font and layout support. */
|
|
505
505
|
get rightToLeft() {
|
|
506
506
|
return this.nativeElement ? this.nativeElement.rightToLeft : undefined;
|
|
507
507
|
}
|
|
508
508
|
set rightToLeft(value) {
|
|
509
509
|
this.nativeElement ? this.nativeElement.rightToLeft = value : undefined;
|
|
510
510
|
}
|
|
511
|
-
/** @description
|
|
511
|
+
/** @description Indicates that the input field is required and must be filled out by the user before the form can be submitted. If left empty, the form submission will be blocked, prompting the user to complete this field. 'Note:' This setting is applicable to the Prompt Window. */
|
|
512
512
|
get required() {
|
|
513
513
|
return this.nativeElement ? this.nativeElement.required : undefined;
|
|
514
514
|
}
|
|
515
515
|
set required(value) {
|
|
516
516
|
this.nativeElement ? this.nativeElement.required = value : undefined;
|
|
517
517
|
}
|
|
518
|
-
/** @description
|
|
518
|
+
/** @description Defines the error message displayed when the required attribute is enabled and the user submits the input field without providing a value. This setting only applies to the Prompt Window interface. */
|
|
519
519
|
get requiredMessage() {
|
|
520
520
|
return this.nativeElement ? this.nativeElement.requiredMessage : undefined;
|
|
521
521
|
}
|
|
522
522
|
set requiredMessage(value) {
|
|
523
523
|
this.nativeElement ? this.nativeElement.requiredMessage = value : undefined;
|
|
524
524
|
}
|
|
525
|
-
/** @description
|
|
525
|
+
/** @description Specifies whether the input field's content should be automatically highlighted (selected) when the field gains focus. Note: This setting applies specifically to the Prompt Window component. */
|
|
526
526
|
get selectAllOnFocus() {
|
|
527
527
|
return this.nativeElement ? this.nativeElement.selectAllOnFocus : undefined;
|
|
528
528
|
}
|
|
529
529
|
set selectAllOnFocus(value) {
|
|
530
530
|
this.nativeElement ? this.nativeElement.selectAllOnFocus = value : undefined;
|
|
531
531
|
}
|
|
532
|
-
/** @description
|
|
532
|
+
/** @description Specifies or retrieves the currently selected tab within the component. This property applies exclusively to the TabsWindow component. */
|
|
533
533
|
get selectedIndex() {
|
|
534
534
|
return this.nativeElement ? this.nativeElement.selectedIndex : undefined;
|
|
535
535
|
}
|
|
536
536
|
set selectedIndex(value) {
|
|
537
537
|
this.nativeElement ? this.nativeElement.selectedIndex = value : undefined;
|
|
538
538
|
}
|
|
539
|
-
/** @description
|
|
539
|
+
/** @description Specifies how the user is allowed to navigate between different tabs within the interface. This property is relevant only when using the TabsWindow component. */
|
|
540
540
|
get selectionMode() {
|
|
541
541
|
return this.nativeElement ? this.nativeElement.selectionMode : undefined;
|
|
542
542
|
}
|
|
543
543
|
set selectionMode(value) {
|
|
544
544
|
this.nativeElement ? this.nativeElement.selectionMode = value : undefined;
|
|
545
545
|
}
|
|
546
|
-
/** @description
|
|
546
|
+
/** @description Specifies the zero-based index position of the last character included in the current text selection. Note: This property is relevant only for use within MultilinePromptWindow components. */
|
|
547
547
|
get selectionEnd() {
|
|
548
548
|
return this.nativeElement ? this.nativeElement.selectionEnd : undefined;
|
|
549
549
|
}
|
|
550
550
|
set selectionEnd(value) {
|
|
551
551
|
this.nativeElement ? this.nativeElement.selectionEnd = value : undefined;
|
|
552
552
|
}
|
|
553
|
-
/** @description
|
|
553
|
+
/** @description Specifies the zero-based index of the first character in the currently selected text within the prompt window. This property is only applicable when using the MultilinePromptWindow component. */
|
|
554
554
|
get selectionStart() {
|
|
555
555
|
return this.nativeElement ? this.nativeElement.selectionStart : undefined;
|
|
556
556
|
}
|
|
557
557
|
set selectionStart(value) {
|
|
558
558
|
this.nativeElement ? this.nativeElement.selectionStart = value : undefined;
|
|
559
559
|
}
|
|
560
|
-
/** @description
|
|
560
|
+
/** @description Controls the visibility of the label displayed on the Progress Bar. Note: This setting is only applicable when used within the Progress Window component. */
|
|
561
561
|
get showProgressValue() {
|
|
562
562
|
return this.nativeElement ? this.nativeElement.showProgressValue : undefined;
|
|
563
563
|
}
|
|
564
564
|
set showProgressValue(value) {
|
|
565
565
|
this.nativeElement ? this.nativeElement.showProgressValue = value : undefined;
|
|
566
566
|
}
|
|
567
|
-
/** @description A getter that
|
|
567
|
+
/** @description A getter that retrieves all sibling LayoutPanel instances—those sharing the same immediate parent—when a LayoutPanel item is docked within a DockingLayout. The returned siblings are also DockingLayout items (specifically, other LayoutPanels). This property is only available for TabsWindow components that are docked inside a DockingLayout. */
|
|
568
568
|
get siblings() {
|
|
569
569
|
return this.nativeElement ? this.nativeElement.siblings : undefined;
|
|
570
570
|
}
|
|
571
571
|
set siblings(value) {
|
|
572
572
|
this.nativeElement ? this.nativeElement.siblings = value : undefined;
|
|
573
573
|
}
|
|
574
|
-
/** @description
|
|
574
|
+
/** @description Relevant when a TabsWindow component is nested within a DockingLayout custom element. This property specifies the size (width or height, depending on layout orientation) allocated to the TabsWindow within the docking layout, allowing developers to control how much space the window occupies relative to other docked components. */
|
|
575
575
|
get size() {
|
|
576
576
|
return this.nativeElement ? this.nativeElement.size : undefined;
|
|
577
577
|
}
|
|
578
578
|
set size(value) {
|
|
579
579
|
this.nativeElement ? this.nativeElement.size = value : undefined;
|
|
580
580
|
}
|
|
581
|
-
/** @description
|
|
581
|
+
/** @description Indicates whether spelling and grammar checking should be enabled for the element. This property determines if the content entered within the element will be reviewed for spelling and grammatical errors. Note: This option is only relevant for the MultilinePromptWindow component. */
|
|
582
582
|
get spellCheck() {
|
|
583
583
|
return this.nativeElement ? this.nativeElement.spellCheck : undefined;
|
|
584
584
|
}
|
|
585
585
|
set spellCheck(value) {
|
|
586
586
|
this.nativeElement ? this.nativeElement.spellCheck = value : undefined;
|
|
587
587
|
}
|
|
588
|
-
/** @description
|
|
588
|
+
/** @description Determines whether close buttons are shown on each tab within the Tab Strip of the TabsWindow. You can use this property to enable or disable the visibility of close buttons on tabs, allowing users to close individual tabs directly from the Tab Strip. Note: This property is only applicable to the TabsWindow component. */
|
|
589
589
|
get tabCloseButtons() {
|
|
590
590
|
return this.nativeElement ? this.nativeElement.tabCloseButtons : undefined;
|
|
591
591
|
}
|
|
592
592
|
set tabCloseButtons(value) {
|
|
593
593
|
this.nativeElement ? this.nativeElement.tabCloseButtons = value : undefined;
|
|
594
594
|
}
|
|
595
|
-
/** @description
|
|
595
|
+
/** @description Specifies when the close button is visible—either only when a tab is selected or always visible on all tabs. Note: This property applies exclusively to the TabsWindow component. */
|
|
596
596
|
get tabCloseButtonMode() {
|
|
597
597
|
return this.nativeElement ? this.nativeElement.tabCloseButtonMode : undefined;
|
|
598
598
|
}
|
|
599
599
|
set tabCloseButtonMode(value) {
|
|
600
600
|
this.nativeElement ? this.nativeElement.tabCloseButtonMode = value : undefined;
|
|
601
601
|
}
|
|
602
|
-
/** @description
|
|
602
|
+
/** @description Specifies how the scroll buttons for tabs are displayed or behave. This option is only relevant when the tabLayout property is set to 'scroll', allowing tabs to be scrolled horizontally. Note: This property applies exclusively to the TabsWindow component. */
|
|
603
603
|
get tabOverflow() {
|
|
604
604
|
return this.nativeElement ? this.nativeElement.tabOverflow : undefined;
|
|
605
605
|
}
|
|
606
606
|
set tabOverflow(value) {
|
|
607
607
|
this.nativeElement ? this.nativeElement.tabOverflow = value : undefined;
|
|
608
608
|
}
|
|
609
|
-
/** @description
|
|
609
|
+
/** @description Determines the position of the Tab Strip within the TabsWindow. Note: This property applies exclusively to the TabsWindow component. */
|
|
610
610
|
get tabPosition() {
|
|
611
611
|
return this.nativeElement ? this.nativeElement.tabPosition : undefined;
|
|
612
612
|
}
|
|
613
613
|
set tabPosition(value) {
|
|
614
614
|
this.nativeElement ? this.nativeElement.tabPosition = value : undefined;
|
|
615
615
|
}
|
|
616
|
-
/** @description
|
|
616
|
+
/** @description Defines or retrieves the position of the scroll buttons located within the tab header of a TabsWindow component. This setting is exclusively applicable to TabsWindow instances and allows you to control where the scroll buttons appear (for example, at the start, end, or both ends of the tab header). */
|
|
617
617
|
get tabScrollButtonsPosition() {
|
|
618
618
|
return this.nativeElement ? this.nativeElement.tabScrollButtonsPosition : undefined;
|
|
619
619
|
}
|
|
620
620
|
set tabScrollButtonsPosition(value) {
|
|
621
621
|
this.nativeElement ? this.nativeElement.tabScrollButtonsPosition = value : undefined;
|
|
622
622
|
}
|
|
623
|
-
/** @description
|
|
623
|
+
/** @description Defines or retrieves the orientation of the text displayed in the tab labels within the TabsWindow component. This property determines whether the tab text is laid out horizontally or vertically. Note: This property is exclusively applicable to the TabsWindow component and has no effect on other components. */
|
|
624
624
|
get tabTextOrientation() {
|
|
625
625
|
return this.nativeElement ? this.nativeElement.tabTextOrientation : undefined;
|
|
626
626
|
}
|
|
627
627
|
set tabTextOrientation(value) {
|
|
628
628
|
this.nativeElement ? this.nativeElement.tabTextOrientation = value : undefined;
|
|
629
629
|
}
|
|
630
|
-
/** @description
|
|
630
|
+
/** @description Specifies the visual theme to be applied. The theme controls the appearance, including colors, fonts, and styling, of the element to ensure a consistent look and feel across the user interface. */
|
|
631
631
|
get theme() {
|
|
632
632
|
return this.nativeElement ? this.nativeElement.theme : undefined;
|
|
633
633
|
}
|
|
634
634
|
set theme(value) {
|
|
635
635
|
this.nativeElement ? this.nativeElement.theme = value : undefined;
|
|
636
636
|
}
|
|
637
|
-
/** @description If is set to true, the element cannot be
|
|
637
|
+
/** @description If this property is set to true, the element will be excluded from keyboard navigation and cannot receive focus either programmatically or via user interaction. This ensures that users will be unable to focus on the element using methods such as the Tab key or calling focus() in JavaScript. */
|
|
638
638
|
get unfocusable() {
|
|
639
639
|
return this.nativeElement ? this.nativeElement.unfocusable : undefined;
|
|
640
640
|
}
|
|
641
641
|
set unfocusable(value) {
|
|
642
642
|
this.nativeElement ? this.nativeElement.unfocusable = value : undefined;
|
|
643
643
|
}
|
|
644
|
-
/** @description
|
|
644
|
+
/** @description Specifies the current value displayed within the TextBox or ProgressBar component inside a Dialog, Prompt, or Progress Window. This value can represent user input (for TextBox) or progress status (for ProgressBar) and is used to dynamically update the UI element's content or state. */
|
|
645
645
|
get value() {
|
|
646
646
|
return this.nativeElement ? this.nativeElement.value : undefined;
|
|
647
647
|
}
|
|
648
648
|
set value(value) {
|
|
649
649
|
this.nativeElement ? this.nativeElement.value = value : undefined;
|
|
650
650
|
}
|
|
651
|
-
/** @description
|
|
651
|
+
/** @description Specifies the actual parent element of the target element. The window's sizing and movement are restricted to the boundaries of this parent element, meaning the window can only be resized or repositioned within the visible area of the designated parent. */
|
|
652
652
|
get windowParent() {
|
|
653
653
|
return this.nativeElement ? this.nativeElement.windowParent : undefined;
|
|
654
654
|
}
|
|
655
655
|
set windowParent(value) {
|
|
656
656
|
this.nativeElement ? this.nativeElement.windowParent = value : undefined;
|
|
657
657
|
}
|
|
658
|
-
/** @description
|
|
658
|
+
/** @description Specifies the text-wrapping behavior for the input field. Note: This property is only relevant when used with the MultilinePromptWindow component. */
|
|
659
659
|
get wrap() {
|
|
660
660
|
return this.nativeElement ? this.nativeElement.wrap : undefined;
|
|
661
661
|
}
|
|
662
662
|
set wrap(value) {
|
|
663
663
|
this.nativeElement ? this.nativeElement.wrap = value : undefined;
|
|
664
664
|
}
|
|
665
|
-
/** @description Appends a
|
|
665
|
+
/** @description Appends a new tab item to the end of the existing list of tab items within the specified parent element. This operation updates the parent element's tab item collection, ensuring the new tab appears as the last item in the tab navigation.
|
|
666
666
|
* @param {Node} node. A TabItem element that should be added to the rest of the items as the last item.
|
|
667
667
|
* @returns {Node}
|
|
668
668
|
*/
|
|
@@ -680,7 +680,13 @@ class WindowComponent extends BaseElement {
|
|
|
680
680
|
return result;
|
|
681
681
|
});
|
|
682
682
|
}
|
|
683
|
-
|
|
683
|
+
appendChildSync(node) {
|
|
684
|
+
if (this.nativeElement.isRendered) {
|
|
685
|
+
return this.nativeElement.appendChild(node);
|
|
686
|
+
}
|
|
687
|
+
return null;
|
|
688
|
+
}
|
|
689
|
+
/** @description Sets the window to the highest z-order level, bringing it to the foreground and ensuring it is visible and accessible for user interaction above all other open windows.
|
|
684
690
|
*/
|
|
685
691
|
bringToFront() {
|
|
686
692
|
if (this.nativeElement.isRendered) {
|
|
@@ -692,7 +698,7 @@ class WindowComponent extends BaseElement {
|
|
|
692
698
|
});
|
|
693
699
|
}
|
|
694
700
|
}
|
|
695
|
-
/** @description
|
|
701
|
+
/** @description Removes all existing content from the window, effectively resetting the window’s display area to an empty state. This operation clears any text, images, or elements currently visible within the window.
|
|
696
702
|
*/
|
|
697
703
|
clear() {
|
|
698
704
|
if (this.nativeElement.isRendered) {
|
|
@@ -704,7 +710,7 @@ class WindowComponent extends BaseElement {
|
|
|
704
710
|
});
|
|
705
711
|
}
|
|
706
712
|
}
|
|
707
|
-
/** @description Closes the window.
|
|
713
|
+
/** @description Closes the currently active window in the application, terminating its user interface and releasing any associated resources. If there are unsaved changes or prompts, the user may be asked to confirm before the window is closed.
|
|
708
714
|
*/
|
|
709
715
|
close() {
|
|
710
716
|
if (this.nativeElement.isRendered) {
|
|
@@ -716,7 +722,7 @@ class WindowComponent extends BaseElement {
|
|
|
716
722
|
});
|
|
717
723
|
}
|
|
718
724
|
}
|
|
719
|
-
/** @description
|
|
725
|
+
/** @description Minimizes the window, reducing it to a smaller icon or hidden state, without closing the application.
|
|
720
726
|
* @returns {HTMLElement}
|
|
721
727
|
*/
|
|
722
728
|
collapse() {
|
|
@@ -733,7 +739,13 @@ class WindowComponent extends BaseElement {
|
|
|
733
739
|
return result;
|
|
734
740
|
});
|
|
735
741
|
}
|
|
736
|
-
|
|
742
|
+
collapseSync() {
|
|
743
|
+
if (this.nativeElement.isRendered) {
|
|
744
|
+
return this.nativeElement.collapse();
|
|
745
|
+
}
|
|
746
|
+
return null;
|
|
747
|
+
}
|
|
748
|
+
/** @description Ensures the specified tab item is brought into view by automatically scrolling the tab bar as needed. This functionality is exclusive to the TabsWindow component.
|
|
737
749
|
* @param {number} index. The index of the tab to scroll to.
|
|
738
750
|
*/
|
|
739
751
|
ensureVisible(index) {
|
|
@@ -746,7 +758,7 @@ class WindowComponent extends BaseElement {
|
|
|
746
758
|
});
|
|
747
759
|
}
|
|
748
760
|
}
|
|
749
|
-
/** @description
|
|
761
|
+
/** @description Restores the window to its full size and visibility after it has been collapsed or minimized, allowing users to view and interact with its contents again.
|
|
750
762
|
* @returns {any[]}
|
|
751
763
|
*/
|
|
752
764
|
expand() {
|
|
@@ -763,7 +775,13 @@ class WindowComponent extends BaseElement {
|
|
|
763
775
|
return result;
|
|
764
776
|
});
|
|
765
777
|
}
|
|
766
|
-
|
|
778
|
+
expandSync() {
|
|
779
|
+
if (this.nativeElement.isRendered) {
|
|
780
|
+
return this.nativeElement.expand();
|
|
781
|
+
}
|
|
782
|
+
return null;
|
|
783
|
+
}
|
|
784
|
+
/** @description Inserts a new tab along with its corresponding content section into the user interface. This function is specifically designed for use within the TabsWindow component and will not operate outside of this context.
|
|
767
785
|
* @param {number} index. The index to insert a new tab at.
|
|
768
786
|
* @param {any} details. An Object with the fields "label", "labelSize", "content" and "group".
|
|
769
787
|
*/
|
|
@@ -777,7 +795,7 @@ class WindowComponent extends BaseElement {
|
|
|
777
795
|
});
|
|
778
796
|
}
|
|
779
797
|
}
|
|
780
|
-
/** @description Inserts the specified "smart-tab-item" node before the reference "smart-tab-item" node.
|
|
798
|
+
/** @description Inserts the specified "smart-tab-item" node directly before the reference "smart-tab-item" node within the tab collection. This operation is only applicable when manipulating tab items inside a TabsWindow component.
|
|
781
799
|
* @param {Node} newNode. The "smart-tab-item" node to insert.
|
|
782
800
|
* @param {Node | null} referenceNode?. The "smart-tab-item" node before which newNode is inserted.
|
|
783
801
|
* @returns {Node}
|
|
@@ -796,7 +814,13 @@ class WindowComponent extends BaseElement {
|
|
|
796
814
|
return result;
|
|
797
815
|
});
|
|
798
816
|
}
|
|
799
|
-
|
|
817
|
+
insertBeforeSync(newNode, referenceNode) {
|
|
818
|
+
if (this.nativeElement.isRendered) {
|
|
819
|
+
return this.nativeElement.insertBefore(newNode, referenceNode);
|
|
820
|
+
}
|
|
821
|
+
return null;
|
|
822
|
+
}
|
|
823
|
+
/** @description Revised Description:"Sets the window's position on the screen by moving it to specified X and Y coordinates, effectively relocating the window to a new location."
|
|
800
824
|
* @param {string | number} left. Left position. For example: '100px'.
|
|
801
825
|
* @param {string | number} top. Top position. For example: '100px'.
|
|
802
826
|
*/
|
|
@@ -810,7 +834,7 @@ class WindowComponent extends BaseElement {
|
|
|
810
834
|
});
|
|
811
835
|
}
|
|
812
836
|
}
|
|
813
|
-
/** @description
|
|
837
|
+
/** @description Expands the window to occupy the entire available viewing area, ensuring it fills all usable screen space without overlapping system taskbars or menus.
|
|
814
838
|
*/
|
|
815
839
|
maximize() {
|
|
816
840
|
if (this.nativeElement.isRendered) {
|
|
@@ -822,7 +846,7 @@ class WindowComponent extends BaseElement {
|
|
|
822
846
|
});
|
|
823
847
|
}
|
|
824
848
|
}
|
|
825
|
-
/** @description
|
|
849
|
+
/** @description Reduces the window to the taskbar or dock, temporarily hiding it from view without closing the application.
|
|
826
850
|
*/
|
|
827
851
|
minimize() {
|
|
828
852
|
if (this.nativeElement.isRendered) {
|
|
@@ -834,7 +858,7 @@ class WindowComponent extends BaseElement {
|
|
|
834
858
|
});
|
|
835
859
|
}
|
|
836
860
|
}
|
|
837
|
-
/** @description Opens the
|
|
861
|
+
/** @description Opens a new browser window or tab with the specified URL or content, allowing additional web pages or resources to be displayed alongside the current page.
|
|
838
862
|
*/
|
|
839
863
|
open() {
|
|
840
864
|
if (this.nativeElement.isRendered) {
|
|
@@ -846,7 +870,7 @@ class WindowComponent extends BaseElement {
|
|
|
846
870
|
});
|
|
847
871
|
}
|
|
848
872
|
}
|
|
849
|
-
/** @description
|
|
873
|
+
/** @description Prevents the window from being moved by locking its position. Disables the ability to drag or reposition the window, ensuring it remains fixed in place.
|
|
850
874
|
*/
|
|
851
875
|
pin() {
|
|
852
876
|
if (this.nativeElement.isRendered) {
|
|
@@ -858,7 +882,7 @@ class WindowComponent extends BaseElement {
|
|
|
858
882
|
});
|
|
859
883
|
}
|
|
860
884
|
}
|
|
861
|
-
/** @description Removes a tab
|
|
885
|
+
/** @description Removes a tab along with its corresponding content section from the interface. This function is designed to work exclusively within the TabsWindow component.
|
|
862
886
|
* @param {number} index. The index of the tab to remove.
|
|
863
887
|
*/
|
|
864
888
|
removeAt(index) {
|
|
@@ -871,7 +895,7 @@ class WindowComponent extends BaseElement {
|
|
|
871
895
|
});
|
|
872
896
|
}
|
|
873
897
|
}
|
|
874
|
-
/** @description Removes a child "smart-tab-item"
|
|
898
|
+
/** @description Removes a child node with the "smart-tab-item" tag from the parent container. Note: This operation is only supported within the TabsWindow component; attempting to use it elsewhere will have no effect.
|
|
875
899
|
* @param {Node} node. The "smart-tab-item" node to remove.
|
|
876
900
|
* @returns {Node}
|
|
877
901
|
*/
|
|
@@ -889,7 +913,13 @@ class WindowComponent extends BaseElement {
|
|
|
889
913
|
return result;
|
|
890
914
|
});
|
|
891
915
|
}
|
|
892
|
-
|
|
916
|
+
removeChildSync(node) {
|
|
917
|
+
if (this.nativeElement.isRendered) {
|
|
918
|
+
return this.nativeElement.removeChild(node);
|
|
919
|
+
}
|
|
920
|
+
return null;
|
|
921
|
+
}
|
|
922
|
+
/** @description Restores the window to its previous dimensions and position before it was maximized or minimized, returning it to the exact size and location it had prior to those actions.
|
|
893
923
|
*/
|
|
894
924
|
restore() {
|
|
895
925
|
if (this.nativeElement.isRendered) {
|
|
@@ -901,7 +931,7 @@ class WindowComponent extends BaseElement {
|
|
|
901
931
|
});
|
|
902
932
|
}
|
|
903
933
|
}
|
|
904
|
-
/** @description Selects
|
|
934
|
+
/** @description Selects the specified tab within the interface. This action applies exclusively to elements of type TabsWindow.
|
|
905
935
|
* @param {number} index. The index of the tab to select.
|
|
906
936
|
*/
|
|
907
937
|
select(index) {
|
|
@@ -914,7 +944,7 @@ class WindowComponent extends BaseElement {
|
|
|
914
944
|
});
|
|
915
945
|
}
|
|
916
946
|
}
|
|
917
|
-
/** @description
|
|
947
|
+
/** @description Removes the pinned (fixed) state from the window, allowing the user to freely move or drag the window to a different position on the screen.
|
|
918
948
|
*/
|
|
919
949
|
unpin() {
|
|
920
950
|
if (this.nativeElement.isRendered) {
|
|
@@ -926,7 +956,7 @@ class WindowComponent extends BaseElement {
|
|
|
926
956
|
});
|
|
927
957
|
}
|
|
928
958
|
}
|
|
929
|
-
/** @description Updates the header label.
|
|
959
|
+
/** @description Updates the text displayed in the header label to reflect new information or changes, ensuring that the header accurately represents the current content or context of the section.
|
|
930
960
|
* @param {string} label. The new label of the Header.
|
|
931
961
|
*/
|
|
932
962
|
updateLabel(label) {
|
|
@@ -939,7 +969,7 @@ class WindowComponent extends BaseElement {
|
|
|
939
969
|
});
|
|
940
970
|
}
|
|
941
971
|
}
|
|
942
|
-
/** @description
|
|
972
|
+
/** @description Replaces the existing content with new or modified information, ensuring that the displayed data reflects the latest updates or changes.
|
|
943
973
|
* @param {string | HTMLElement} content. The new content of the window.
|
|
944
974
|
*/
|
|
945
975
|
updateContent(content) {
|
|
@@ -952,7 +982,7 @@ class WindowComponent extends BaseElement {
|
|
|
952
982
|
});
|
|
953
983
|
}
|
|
954
984
|
}
|
|
955
|
-
/** @description Updates
|
|
985
|
+
/** @description Updates an individual tab within a TabsWindow component and modifies its corresponding content section. This operation exclusively applies to elements of the TabsWindow type. Use this function to change tab labels, update active states, or refresh the content associated with a specific tab within the TabsWindow interface.
|
|
956
986
|
* @param {number} index. The index of the tab to update.
|
|
957
987
|
* @param {string} label. The new label of the tab. The value can be the id of an HTMLTemplateElement
|
|
958
988
|
* @param {string | HTMLElement} content. The new content of the tab.
|