@babylonjs/gui-editor 5.0.0-beta.5 → 5.0.0-beta.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/babylon.guiEditor.max.js +604 -2134
  2. package/babylon.guiEditor.max.js.map +1 -1
  3. package/babylon.guiEditor.module.d.ts +104 -707
  4. package/package.json +2 -2
package/babylon.guiEditor.module.d.ts CHANGED
@@ -31,641 +31,6 @@ declare module "@babylonjs/gui-editor/tools" {
31
31
  static reorderGrid(grid: Grid, index: number, control: Control, cell: Vector2): void;
32
32
  }
33
33
  }
34
- declare module "@babylonjs/gui-editor/diagram/GUIEditorNodeMaterial" {
35
- export const GUIEditorNodeMaterial: {
36
- tags: null;
37
- ignoreAlpha: boolean;
38
- maxSimultaneousLights: number;
39
- mode: number;
40
- id: string;
41
- name: string;
42
- checkReadyOnEveryCall: boolean;
43
- checkReadyOnlyOnce: boolean;
44
- state: string;
45
- alpha: number;
46
- backFaceCulling: boolean;
47
- cullBackFaces: boolean;
48
- sideOrientation: number;
49
- alphaMode: number;
50
- _needDepthPrePass: boolean;
51
- disableDepthWrite: boolean;
52
- disableColorWrite: boolean;
53
- forceDepthWrite: boolean;
54
- depthFunction: number;
55
- separateCullingPass: boolean;
56
- fogEnabled: boolean;
57
- pointSize: number;
58
- zOffset: number;
59
- zOffsetUnits: number;
60
- pointsCloud: boolean;
61
- fillMode: number;
62
- editorData: {
63
- locations: {
64
- blockId: number;
65
- x: number;
66
- y: number;
67
- }[];
68
- frames: {
69
- x: number;
70
- y: number;
71
- width: number;
72
- height: number;
73
- color: number[];
74
- name: string;
75
- isCollapsed: boolean;
76
- blocks: number[];
77
- }[];
78
- x: number;
79
- y: number;
80
- zoom: number;
81
- };
82
- customType: string;
83
- outputNodes: number[];
84
- blocks: ({
85
- customType: string;
86
- id: number;
87
- name: string;
88
- comments: string;
89
- visibleInInspector: boolean;
90
- visibleOnFrame: boolean;
91
- target: number;
92
- inputs: {
93
- name: string;
94
- inputName: string;
95
- targetBlockId: number;
96
- targetConnectionName: string;
97
- isExposedOnFrame: boolean;
98
- exposedPortPosition: number;
99
- }[];
100
- outputs: {
101
- name: string;
102
- }[];
103
- complementZ: number;
104
- complementW: number;
105
- type?: undefined;
106
- mode?: undefined;
107
- animationType?: undefined;
108
- min?: undefined;
109
- max?: undefined;
110
- isBoolean?: undefined;
111
- matrixMode?: undefined;
112
- isConstant?: undefined;
113
- groupInInspector?: undefined;
114
- convertToGammaSpace?: undefined;
115
- convertToLinearSpace?: undefined;
116
- systemValue?: undefined;
117
- rSwizzle?: undefined;
118
- gSwizzle?: undefined;
119
- bSwizzle?: undefined;
120
- aSwizzle?: undefined;
121
- operation?: undefined;
122
- xSwizzle?: undefined;
123
- ySwizzle?: undefined;
124
- zSwizzle?: undefined;
125
- wSwizzle?: undefined;
126
- valueType?: undefined;
127
- value?: undefined;
128
- fragmentOnly?: undefined;
129
- disableLevelMultiplication?: undefined;
130
- } | {
131
- customType: string;
132
- id: number;
133
- name: string;
134
- comments: string;
135
- visibleInInspector: boolean;
136
- visibleOnFrame: boolean;
137
- target: number;
138
- inputs: never[];
139
- outputs: {
140
- name: string;
141
- }[];
142
- type: number;
143
- mode: number;
144
- animationType: number;
145
- min: number;
146
- max: number;
147
- isBoolean: boolean;
148
- matrixMode: number;
149
- isConstant: boolean;
150
- groupInInspector: string;
151
- convertToGammaSpace: boolean;
152
- convertToLinearSpace: boolean;
153
- complementZ?: undefined;
154
- complementW?: undefined;
155
- systemValue?: undefined;
156
- rSwizzle?: undefined;
157
- gSwizzle?: undefined;
158
- bSwizzle?: undefined;
159
- aSwizzle?: undefined;
160
- operation?: undefined;
161
- xSwizzle?: undefined;
162
- ySwizzle?: undefined;
163
- zSwizzle?: undefined;
164
- wSwizzle?: undefined;
165
- valueType?: undefined;
166
- value?: undefined;
167
- fragmentOnly?: undefined;
168
- disableLevelMultiplication?: undefined;
169
- } | {
170
- customType: string;
171
- id: number;
172
- name: string;
173
- comments: string;
174
- visibleInInspector: boolean;
175
- visibleOnFrame: boolean;
176
- target: number;
177
- inputs: never[];
178
- outputs: {
179
- name: string;
180
- }[];
181
- type: number;
182
- mode: number;
183
- systemValue: number;
184
- animationType: number;
185
- min: number;
186
- max: number;
187
- isBoolean: boolean;
188
- matrixMode: number;
189
- isConstant: boolean;
190
- groupInInspector: string;
191
- convertToGammaSpace: boolean;
192
- convertToLinearSpace: boolean;
193
- complementZ?: undefined;
194
- complementW?: undefined;
195
- rSwizzle?: undefined;
196
- gSwizzle?: undefined;
197
- bSwizzle?: undefined;
198
- aSwizzle?: undefined;
199
- operation?: undefined;
200
- xSwizzle?: undefined;
201
- ySwizzle?: undefined;
202
- zSwizzle?: undefined;
203
- wSwizzle?: undefined;
204
- valueType?: undefined;
205
- value?: undefined;
206
- fragmentOnly?: undefined;
207
- disableLevelMultiplication?: undefined;
208
- } | {
209
- customType: string;
210
- id: number;
211
- name: string;
212
- comments: string;
213
- visibleInInspector: boolean;
214
- visibleOnFrame: boolean;
215
- target: number;
216
- inputs: ({
217
- name: string;
218
- displayName: string;
219
- inputName?: undefined;
220
- targetBlockId?: undefined;
221
- targetConnectionName?: undefined;
222
- isExposedOnFrame?: undefined;
223
- exposedPortPosition?: undefined;
224
- } | {
225
- name: string;
226
- displayName: string;
227
- inputName: string;
228
- targetBlockId: number;
229
- targetConnectionName: string;
230
- isExposedOnFrame: boolean;
231
- exposedPortPosition: number;
232
- })[];
233
- outputs: never[];
234
- convertToGammaSpace: boolean;
235
- convertToLinearSpace: boolean;
236
- complementZ?: undefined;
237
- complementW?: undefined;
238
- type?: undefined;
239
- mode?: undefined;
240
- animationType?: undefined;
241
- min?: undefined;
242
- max?: undefined;
243
- isBoolean?: undefined;
244
- matrixMode?: undefined;
245
- isConstant?: undefined;
246
- groupInInspector?: undefined;
247
- systemValue?: undefined;
248
- rSwizzle?: undefined;
249
- gSwizzle?: undefined;
250
- bSwizzle?: undefined;
251
- aSwizzle?: undefined;
252
- operation?: undefined;
253
- xSwizzle?: undefined;
254
- ySwizzle?: undefined;
255
- zSwizzle?: undefined;
256
- wSwizzle?: undefined;
257
- valueType?: undefined;
258
- value?: undefined;
259
- fragmentOnly?: undefined;
260
- disableLevelMultiplication?: undefined;
261
- } | {
262
- customType: string;
263
- id: number;
264
- name: string;
265
- comments: string;
266
- visibleInInspector: boolean;
267
- visibleOnFrame: boolean;
268
- target: number;
269
- inputs: ({
270
- name: string;
271
- displayName: string;
272
- inputName: string;
273
- targetBlockId: number;
274
- targetConnectionName: string;
275
- isExposedOnFrame: boolean;
276
- exposedPortPosition: number;
277
- } | {
278
- name: string;
279
- displayName: string;
280
- isExposedOnFrame: boolean;
281
- exposedPortPosition: number;
282
- inputName?: undefined;
283
- targetBlockId?: undefined;
284
- targetConnectionName?: undefined;
285
- })[];
286
- outputs: {
287
- name: string;
288
- displayName: string;
289
- }[];
290
- complementZ?: undefined;
291
- complementW?: undefined;
292
- type?: undefined;
293
- mode?: undefined;
294
- animationType?: undefined;
295
- min?: undefined;
296
- max?: undefined;
297
- isBoolean?: undefined;
298
- matrixMode?: undefined;
299
- isConstant?: undefined;
300
- groupInInspector?: undefined;
301
- convertToGammaSpace?: undefined;
302
- convertToLinearSpace?: undefined;
303
- systemValue?: undefined;
304
- rSwizzle?: undefined;
305
- gSwizzle?: undefined;
306
- bSwizzle?: undefined;
307
- aSwizzle?: undefined;
308
- operation?: undefined;
309
- xSwizzle?: undefined;
310
- ySwizzle?: undefined;
311
- zSwizzle?: undefined;
312
- wSwizzle?: undefined;
313
- valueType?: undefined;
314
- value?: undefined;
315
- fragmentOnly?: undefined;
316
- disableLevelMultiplication?: undefined;
317
- } | {
318
- customType: string;
319
- id: number;
320
- name: string;
321
- comments: string;
322
- visibleInInspector: boolean;
323
- visibleOnFrame: boolean;
324
- target: number;
325
- inputs: ({
326
- name: string;
327
- displayName: string;
328
- inputName?: undefined;
329
- targetBlockId?: undefined;
330
- targetConnectionName?: undefined;
331
- isExposedOnFrame?: undefined;
332
- exposedPortPosition?: undefined;
333
- } | {
334
- name: string;
335
- displayName: string;
336
- inputName: string;
337
- targetBlockId: number;
338
- targetConnectionName: string;
339
- isExposedOnFrame: boolean;
340
- exposedPortPosition: number;
341
- })[];
342
- outputs: {
343
- name: string;
344
- displayName: string;
345
- }[];
346
- rSwizzle: string;
347
- gSwizzle: string;
348
- bSwizzle: string;
349
- aSwizzle: string;
350
- complementZ?: undefined;
351
- complementW?: undefined;
352
- type?: undefined;
353
- mode?: undefined;
354
- animationType?: undefined;
355
- min?: undefined;
356
- max?: undefined;
357
- isBoolean?: undefined;
358
- matrixMode?: undefined;
359
- isConstant?: undefined;
360
- groupInInspector?: undefined;
361
- convertToGammaSpace?: undefined;
362
- convertToLinearSpace?: undefined;
363
- systemValue?: undefined;
364
- operation?: undefined;
365
- xSwizzle?: undefined;
366
- ySwizzle?: undefined;
367
- zSwizzle?: undefined;
368
- wSwizzle?: undefined;
369
- valueType?: undefined;
370
- value?: undefined;
371
- fragmentOnly?: undefined;
372
- disableLevelMultiplication?: undefined;
373
- } | {
374
- customType: string;
375
- id: number;
376
- name: string;
377
- comments: string;
378
- visibleInInspector: boolean;
379
- visibleOnFrame: boolean;
380
- target: number;
381
- inputs: {
382
- name: string;
383
- inputName: string;
384
- targetBlockId: number;
385
- targetConnectionName: string;
386
- isExposedOnFrame: boolean;
387
- exposedPortPosition: number;
388
- }[];
389
- outputs: {
390
- name: string;
391
- }[];
392
- operation: number;
393
- complementZ?: undefined;
394
- complementW?: undefined;
395
- type?: undefined;
396
- mode?: undefined;
397
- animationType?: undefined;
398
- min?: undefined;
399
- max?: undefined;
400
- isBoolean?: undefined;
401
- matrixMode?: undefined;
402
- isConstant?: undefined;
403
- groupInInspector?: undefined;
404
- convertToGammaSpace?: undefined;
405
- convertToLinearSpace?: undefined;
406
- systemValue?: undefined;
407
- rSwizzle?: undefined;
408
- gSwizzle?: undefined;
409
- bSwizzle?: undefined;
410
- aSwizzle?: undefined;
411
- xSwizzle?: undefined;
412
- ySwizzle?: undefined;
413
- zSwizzle?: undefined;
414
- wSwizzle?: undefined;
415
- valueType?: undefined;
416
- value?: undefined;
417
- fragmentOnly?: undefined;
418
- disableLevelMultiplication?: undefined;
419
- } | {
420
- customType: string;
421
- id: number;
422
- name: string;
423
- comments: string;
424
- visibleInInspector: boolean;
425
- visibleOnFrame: boolean;
426
- target: number;
427
- inputs: ({
428
- name: string;
429
- inputName?: undefined;
430
- targetBlockId?: undefined;
431
- targetConnectionName?: undefined;
432
- isExposedOnFrame?: undefined;
433
- exposedPortPosition?: undefined;
434
- } | {
435
- name: string;
436
- inputName: string;
437
- targetBlockId: number;
438
- targetConnectionName: string;
439
- isExposedOnFrame: boolean;
440
- exposedPortPosition: number;
441
- })[];
442
- outputs: {
443
- name: string;
444
- }[];
445
- xSwizzle: string;
446
- ySwizzle: string;
447
- zSwizzle: string;
448
- wSwizzle: string;
449
- complementZ?: undefined;
450
- complementW?: undefined;
451
- type?: undefined;
452
- mode?: undefined;
453
- animationType?: undefined;
454
- min?: undefined;
455
- max?: undefined;
456
- isBoolean?: undefined;
457
- matrixMode?: undefined;
458
- isConstant?: undefined;
459
- groupInInspector?: undefined;
460
- convertToGammaSpace?: undefined;
461
- convertToLinearSpace?: undefined;
462
- systemValue?: undefined;
463
- rSwizzle?: undefined;
464
- gSwizzle?: undefined;
465
- bSwizzle?: undefined;
466
- aSwizzle?: undefined;
467
- operation?: undefined;
468
- valueType?: undefined;
469
- value?: undefined;
470
- fragmentOnly?: undefined;
471
- disableLevelMultiplication?: undefined;
472
- } | {
473
- customType: string;
474
- id: number;
475
- name: string;
476
- comments: string;
477
- visibleInInspector: boolean;
478
- visibleOnFrame: boolean;
479
- target: number;
480
- inputs: ({
481
- name: string;
482
- inputName: string;
483
- targetBlockId: number;
484
- targetConnectionName: string;
485
- isExposedOnFrame: boolean;
486
- exposedPortPosition: number;
487
- } | {
488
- name: string;
489
- isExposedOnFrame: boolean;
490
- exposedPortPosition: number;
491
- inputName?: undefined;
492
- targetBlockId?: undefined;
493
- targetConnectionName?: undefined;
494
- } | {
495
- name: string;
496
- inputName?: undefined;
497
- targetBlockId?: undefined;
498
- targetConnectionName?: undefined;
499
- isExposedOnFrame?: undefined;
500
- exposedPortPosition?: undefined;
501
- })[];
502
- outputs: {
503
- name: string;
504
- }[];
505
- complementZ?: undefined;
506
- complementW?: undefined;
507
- type?: undefined;
508
- mode?: undefined;
509
- animationType?: undefined;
510
- min?: undefined;
511
- max?: undefined;
512
- isBoolean?: undefined;
513
- matrixMode?: undefined;
514
- isConstant?: undefined;
515
- groupInInspector?: undefined;
516
- convertToGammaSpace?: undefined;
517
- convertToLinearSpace?: undefined;
518
- systemValue?: undefined;
519
- rSwizzle?: undefined;
520
- gSwizzle?: undefined;
521
- bSwizzle?: undefined;
522
- aSwizzle?: undefined;
523
- operation?: undefined;
524
- xSwizzle?: undefined;
525
- ySwizzle?: undefined;
526
- zSwizzle?: undefined;
527
- wSwizzle?: undefined;
528
- valueType?: undefined;
529
- value?: undefined;
530
- fragmentOnly?: undefined;
531
- disableLevelMultiplication?: undefined;
532
- } | {
533
- customType: string;
534
- id: number;
535
- name: string;
536
- comments: string;
537
- visibleInInspector: boolean;
538
- visibleOnFrame: boolean;
539
- target: number;
540
- inputs: never[];
541
- outputs: {
542
- name: string;
543
- }[];
544
- type: number;
545
- mode: number;
546
- animationType: number;
547
- min: number;
548
- max: number;
549
- isBoolean: boolean;
550
- matrixMode: number;
551
- isConstant: boolean;
552
- groupInInspector: string;
553
- convertToGammaSpace: boolean;
554
- convertToLinearSpace: boolean;
555
- valueType: string;
556
- value: number[];
557
- complementZ?: undefined;
558
- complementW?: undefined;
559
- systemValue?: undefined;
560
- rSwizzle?: undefined;
561
- gSwizzle?: undefined;
562
- bSwizzle?: undefined;
563
- aSwizzle?: undefined;
564
- operation?: undefined;
565
- xSwizzle?: undefined;
566
- ySwizzle?: undefined;
567
- zSwizzle?: undefined;
568
- wSwizzle?: undefined;
569
- fragmentOnly?: undefined;
570
- disableLevelMultiplication?: undefined;
571
- } | {
572
- customType: string;
573
- id: number;
574
- name: string;
575
- comments: string;
576
- visibleInInspector: boolean;
577
- visibleOnFrame: boolean;
578
- target: number;
579
- inputs: never[];
580
- outputs: {
581
- name: string;
582
- }[];
583
- type: number;
584
- mode: number;
585
- animationType: number;
586
- min: number;
587
- max: number;
588
- isBoolean: boolean;
589
- matrixMode: number;
590
- isConstant: boolean;
591
- groupInInspector: string;
592
- convertToGammaSpace: boolean;
593
- convertToLinearSpace: boolean;
594
- valueType: string;
595
- value: number;
596
- complementZ?: undefined;
597
- complementW?: undefined;
598
- systemValue?: undefined;
599
- rSwizzle?: undefined;
600
- gSwizzle?: undefined;
601
- bSwizzle?: undefined;
602
- aSwizzle?: undefined;
603
- operation?: undefined;
604
- xSwizzle?: undefined;
605
- ySwizzle?: undefined;
606
- zSwizzle?: undefined;
607
- wSwizzle?: undefined;
608
- fragmentOnly?: undefined;
609
- disableLevelMultiplication?: undefined;
610
- } | {
611
- customType: string;
612
- id: number;
613
- name: string;
614
- comments: string;
615
- visibleInInspector: boolean;
616
- visibleOnFrame: boolean;
617
- target: number;
618
- inputs: ({
619
- name: string;
620
- displayName: string;
621
- inputName: string;
622
- targetBlockId: number;
623
- targetConnectionName: string;
624
- isExposedOnFrame: boolean;
625
- exposedPortPosition: number;
626
- } | {
627
- name: string;
628
- displayName: string;
629
- inputName?: undefined;
630
- targetBlockId?: undefined;
631
- targetConnectionName?: undefined;
632
- isExposedOnFrame?: undefined;
633
- exposedPortPosition?: undefined;
634
- })[];
635
- outputs: {
636
- name: string;
637
- displayName: string;
638
- }[];
639
- convertToGammaSpace: boolean;
640
- convertToLinearSpace: boolean;
641
- fragmentOnly: boolean;
642
- disableLevelMultiplication: boolean;
643
- complementZ?: undefined;
644
- complementW?: undefined;
645
- type?: undefined;
646
- mode?: undefined;
647
- animationType?: undefined;
648
- min?: undefined;
649
- max?: undefined;
650
- isBoolean?: undefined;
651
- matrixMode?: undefined;
652
- isConstant?: undefined;
653
- groupInInspector?: undefined;
654
- systemValue?: undefined;
655
- rSwizzle?: undefined;
656
- gSwizzle?: undefined;
657
- bSwizzle?: undefined;
658
- aSwizzle?: undefined;
659
- operation?: undefined;
660
- xSwizzle?: undefined;
661
- ySwizzle?: undefined;
662
- zSwizzle?: undefined;
663
- wSwizzle?: undefined;
664
- valueType?: undefined;
665
- value?: undefined;
666
- })[];
667
- };
668
- }
669
34
  declare module "@babylonjs/gui-editor/diagram/workbench" {
670
35
  import * as React from "react";
671
36
  import { GlobalState } from "@babylonjs/gui-editor/globalState";
@@ -673,12 +38,9 @@ declare module "@babylonjs/gui-editor/diagram/workbench" {
673
38
  import { Control } from "@babylonjs/gui/2D/controls/control";
674
39
  import { Vector2, Vector3 } from "@babylonjs/core/Maths/math.vector";
675
40
  import { Scene } from "@babylonjs/core/scene";
676
- import { ArcRotateCamera } from "@babylonjs/core/Cameras/arcRotateCamera";
677
- import { Mesh } from "@babylonjs/core/Meshes/mesh";
678
- import { Plane } from "@babylonjs/core/Maths/math.plane";
679
- import { PointerInfo } from "@babylonjs/core/Events/pointerEvents";
680
- import { EventState } from "@babylonjs/core/Misc/observable";
681
- import { Rectangle } from "@babylonjs/gui/2D/controls/rectangle";
41
+ import { IWheelEvent } from "@babylonjs/core/Events/deviceInputEvents";
42
+ import { Container } from "@babylonjs/gui/2D/controls/container";
43
+ import { ISize } from "@babylonjs/core/Maths/math";
682
44
  export interface IWorkbenchComponentProps {
683
45
  globalState: GlobalState;
684
46
  }
@@ -688,12 +50,10 @@ declare module "@babylonjs/gui-editor/diagram/workbench" {
688
50
  Y = 3
689
51
  }
690
52
  export class WorkbenchComponent extends React.Component<IWorkbenchComponentProps> {
691
- artBoardBackground: Rectangle;
692
53
  private _rootContainer;
693
54
  private _setConstraintDirection;
694
55
  private _mouseStartPointX;
695
56
  private _mouseStartPointY;
696
- _textureMesh: Mesh;
697
57
  _scene: Scene;
698
58
  private _selectedGuiNodes;
699
59
  private _ctrlKeyIsPressed;
@@ -709,9 +69,6 @@ declare module "@babylonjs/gui-editor/diagram/workbench" {
709
69
  private _isOverGUINode;
710
70
  private _clipboard;
711
71
  private _selectAll;
712
- _camera: ArcRotateCamera;
713
- private _cameraRadias;
714
- private _cameraMaxRadiasFactor;
715
72
  private _pasted;
716
73
  private _engine;
717
74
  private _liveRenderObserver;
@@ -721,6 +78,25 @@ declare module "@babylonjs/gui-editor/diagram/workbench" {
721
78
  private _doubleClick;
722
79
  private _lockMainSelection;
723
80
  _liveGuiTextureRerender: boolean;
81
+ private _anyControlClicked;
82
+ private _visibleRegionContainer;
83
+ private _panAndZoomContainer;
84
+ get visibleRegionContainer(): Container;
85
+ private _trueRootContainer;
86
+ set trueRootContainer(value: Container);
87
+ get trueRootContainer(): Container;
88
+ private _nextLiveGuiRender;
89
+ private _liveGuiRerenderDelay;
90
+ private _defaultGUISize;
91
+ private _initialPanningOffset;
92
+ private _panningOffset;
93
+ private _zoomFactor;
94
+ private _zoomModeIncrement;
95
+ private _guiSize;
96
+ get guiSize(): ISize;
97
+ set guiSize(value: ISize);
98
+ applyEditorTransformation(): void;
99
+ removeEditorTransformation(): void;
724
100
  get globalState(): GlobalState;
725
101
  get nodes(): Control[];
726
102
  get selectedGuiNodes(): Control[];
@@ -731,7 +107,6 @@ declare module "@babylonjs/gui-editor/diagram/workbench" {
731
107
  keyEvent: (evt: KeyboardEvent) => void;
732
108
  private updateHitTest;
733
109
  private updateHitTestForSelection;
734
- private setCameraRadius;
735
110
  copyToClipboard(): void;
736
111
  pasteFromClipboard(): void;
737
112
  CopyGUIControl(original: Control): void;
@@ -742,7 +117,6 @@ declare module "@babylonjs/gui-editor/diagram/workbench" {
742
117
  loadFromSnippet(snippetId: string): Promise<void>;
743
118
  loadToEditor(): void;
744
119
  changeSelectionHighlight(value: boolean): void;
745
- resizeGuiTexture(newvalue: Vector2): void;
746
120
  findNodeFromGuiElement(guiControl: Control): Control;
747
121
  appendBlock(guiElement: Control): Control;
748
122
  private _isMainSelectionParent;
@@ -757,17 +131,17 @@ declare module "@babylonjs/gui-editor/diagram/workbench" {
757
131
  _onMove(guiControl: Control, evt: Vector2, startPos: Vector2, ignorClick?: boolean): boolean;
758
132
  convertToPercentage(guiControl: Control, includeScale: boolean): void;
759
133
  onMove(evt: React.PointerEvent): void;
760
- getGroundPosition(): Nullable<Vector3>;
134
+ private _screenToTexturePosition;
135
+ private getScaledPointerPosition;
761
136
  onDown(evt: React.PointerEvent<HTMLElement>): void;
762
137
  isUp: boolean;
763
138
  onUp(evt: React.PointerEvent): void;
764
139
  createGUICanvas(): void;
765
140
  synchronizeLiveGUI(): void;
766
- addControls(scene: Scene, camera: ArcRotateCamera): void;
767
- getPosition(scene: Scene, camera: ArcRotateCamera, plane: Plane, x?: number, y?: number): Vector3;
768
- panning(newPos: Vector3, initialPos: Vector3, inertia: number, ref: Vector3): Vector3;
769
- zoomWheel(p: PointerInfo, e: EventState, camera: ArcRotateCamera): number;
770
- zooming(delta: number, scene: Scene, camera: ArcRotateCamera, plane: Plane, ref: Vector3): void;
141
+ addControls(scene: Scene): void;
142
+ panning(): void;
143
+ zoomWheel(event: IWheelEvent): number;
144
+ zooming(delta: number): void;
771
145
  zeroIfClose(vec: Vector3): void;
772
146
  render(): JSX.Element;
773
147
  }
@@ -792,11 +166,60 @@ declare module "@babylonjs/gui-editor/sharedUiComponents/tabs/propertyGrids/lock
792
166
  lock: boolean;
793
167
  }
794
168
  }
795
- declare module "@babylonjs/gui-editor/diagram/guiGizmo" {
169
+ declare module "@babylonjs/gui-editor/diagram/coordinateHelper" {
796
170
  import { Control } from "@babylonjs/gui/2D/controls/control";
171
+ import { Matrix2D } from "@babylonjs/gui/2D/math2D";
172
+ import { Vector2 } from "@babylonjs/core/Maths/math.vector";
173
+ import { GlobalState } from "@babylonjs/gui-editor/globalState";
174
+ export class Rect {
175
+ top: number;
176
+ left: number;
177
+ right: number;
178
+ bottom: number;
179
+ constructor(left: number, top: number, right: number, bottom: number);
180
+ get center(): Vector2;
181
+ get width(): number;
182
+ get height(): number;
183
+ }
184
+ export class CoordinateHelper {
185
+ private static _matrixCache;
186
+ static globalState: GlobalState;
187
+ /**
188
+ * Get the scaling of a specific GUI control
189
+ * @param node the node for which we are getting the scaling
190
+ * @param relative should we return only the relative scaling (relative to the parent)
191
+ * @returns an X,Y vector of the scaling
192
+ */
193
+ static getScale(node: Control, relative?: boolean): Vector2;
194
+ static getRotation(node: Control, relative?: boolean): number;
195
+ /**
196
+ * This function calculates a local matrix for a node, including it's full transformation and pivot point
197
+ *
198
+ * @param node the node to calculate the matrix for
199
+ * @param useStoredValues should the stored (cached) values be used to calculate the matrix
200
+ * @returns a new matrix for the control
201
+ */
202
+ static getNodeMatrix(node: Control, storedValues?: Rect): Matrix2D;
203
+ /**
204
+ * Using the node's tree, calculate its world matrix and return it
205
+ * @param node the node to calculate the matrix for
206
+ * @param useStoredValuesIfPossible used stored valued (cached when pointer down is clicked)
207
+ * @returns the world matrix for this node
208
+ */
209
+ static nodeToRTTWorldMatrix(node: Control, storedValues?: Rect): Matrix2D;
210
+ static nodeToRTTSpace(node: Control, x: number, y: number, reference?: Vector2, storedValues?: Rect): Vector2;
211
+ static rttToLocalNodeSpace(node: Control, x: number, y: number, reference?: Vector2, storedValues?: Rect): Vector2;
212
+ static rttToCanvasSpace(x: number, y: number): Vector2;
213
+ static mousePointerToRTTSpace(node: Control, x?: number, y?: number): Vector2;
214
+ private static resetMatrixArray;
215
+ static computeLocalBounds(node: Control): Rect;
216
+ }
217
+ }
218
+ declare module "@babylonjs/gui-editor/diagram/guiGizmo" {
797
219
  import { Vector2 } from "@babylonjs/core/Maths/math.vector";
798
220
  import * as React from "react";
799
221
  import { GlobalState } from "@babylonjs/gui-editor/globalState";
222
+ import { Rect } from "@babylonjs/gui-editor/diagram/coordinateHelper";
800
223
  export interface IGuiGizmoProps {
801
224
  globalState: GlobalState;
802
225
  }
@@ -814,16 +237,6 @@ declare module "@babylonjs/gui-editor/diagram/guiGizmo" {
814
237
  rotation: number;
815
238
  isPivot: boolean;
816
239
  }
817
- class Rect {
818
- top: number;
819
- left: number;
820
- right: number;
821
- bottom: number;
822
- constructor(left: number, top: number, right: number, bottom: number);
823
- get center(): Vector2;
824
- get width(): number;
825
- get height(): number;
826
- }
827
240
  interface IGuiGizmoState {
828
241
  canvasBounds: Rect;
829
242
  scalePoints: IScalePoint[];
@@ -831,12 +244,8 @@ declare module "@babylonjs/gui-editor/diagram/guiGizmo" {
831
244
  isRotating: boolean;
832
245
  }
833
246
  export class GuiGizmoComponent extends React.Component<IGuiGizmoProps, IGuiGizmoState> {
834
- private _matrixCache;
835
247
  private _responsive;
836
- private _initH;
837
- private _initW;
838
- private _initX;
839
- private _initY;
248
+ private _storedValues;
840
249
  private _localBounds;
841
250
  private _rotation;
842
251
  constructor(props: IGuiGizmoProps);
@@ -846,41 +255,11 @@ declare module "@babylonjs/gui-editor/diagram/guiGizmo" {
846
255
  * @param force should the update be forced. otherwise it will be updated only when the pointer is down
847
256
  */
848
257
  updateGizmo(force?: boolean): void;
849
- private _resetMatrixArray;
850
- /**
851
- * This function calculates a local matrix for a node, including it's full transformation and pivot point
852
- *
853
- * @param node the node to calculate the matrix for
854
- * @param useStoredValues should the stored (cached) values be used to calculate the matrix
855
- * @returns a new matrix for the control
856
- */
857
- private _getNodeMatrix;
858
- /**
859
- * Using the node's tree, calculate its world matrix and return it
860
- * @param node the node to calculate the matrix for
861
- * @param useStoredValuesIfPossible used stored valued (cached when pointer down is clicked)
862
- * @returns the world matrix for this node
863
- */
864
- private _nodeToRTTWorldMatrix;
865
- private _nodeToRTTSpace;
866
- private _rttToLocalNodeSpace;
867
- private _rttToCanvasSpace;
868
- private _plane;
869
- private _mousePointerToRTTSpace;
870
- /**
871
- * Get the scaling of a specific GUI control
872
- * @param node the node for which we are getting the scaling
873
- * @param relative should we return only the relative scaling (relative to the parent)
874
- * @returns an X,Y vector of the scaling
875
- */
876
- getScale(node: Control, relative?: boolean): Vector2;
877
- getRotation(node: Control, relative?: boolean): number;
878
258
  onUp(evt?: React.PointerEvent): void;
879
259
  private _onUp;
880
260
  onMove(evt: React.PointerEvent): void;
881
261
  private _onMove;
882
262
  private _rotate;
883
- private _computeLocalBounds;
884
263
  private _dragLocalBounds;
885
264
  private _updateNodeFromLocalBounds;
886
265
  private _beginDraggingScalePoint;
@@ -896,11 +275,11 @@ declare module "@babylonjs/gui-editor/globalState" {
896
275
  import { WorkbenchComponent } from "@babylonjs/gui-editor/diagram/workbench";
897
276
  import { AdvancedDynamicTexture } from "@babylonjs/gui/2D/advancedDynamicTexture";
898
277
  import { PropertyChangedEvent } from "@babylonjs/gui-editor/sharedUiComponents/propertyChangedEvent";
899
- import { Vector2 } from "@babylonjs/core/Maths/math.vector";
900
278
  import { Scene } from "@babylonjs/core/scene";
901
279
  import { Control } from "@babylonjs/gui/2D/controls/control";
902
280
  import { LockObject } from "@babylonjs/gui-editor/sharedUiComponents/tabs/propertyGrids/lockObject";
903
281
  import { GuiGizmoComponent } from "@babylonjs/gui-editor/diagram/guiGizmo";
282
+ import { ISize } from "@babylonjs/core/Maths/math";
904
283
  export enum DragOverLocation {
905
284
  ABOVE = 0,
906
285
  BELOW = 1,
@@ -915,7 +294,7 @@ declare module "@babylonjs/gui-editor/globalState" {
915
294
  hostDocument: HTMLDocument;
916
295
  hostWindow: Window;
917
296
  onSelectionChangedObservable: Observable<Nullable<Control>>;
918
- onResizeObservable: Observable<Vector2>;
297
+ onResizeObservable: Observable<ISize>;
919
298
  onBuiltObservable: Observable<void>;
920
299
  onResetRequiredObservable: Observable<void>;
921
300
  onUpdateRequiredObservable: Observable<void>;
@@ -950,6 +329,7 @@ declare module "@babylonjs/gui-editor/globalState" {
950
329
  onDraggingStartObservable: Observable<void>;
951
330
  onWindowResizeObservable: Observable<void>;
952
331
  onGizmoUpdateRequireObservable: Observable<void>;
332
+ onArtBoardUpdateRequiredObservable: Observable<void>;
953
333
  draggedControl: Nullable<Control>;
954
334
  draggedControlDirection: DragOverLocation;
955
335
  isSaving: boolean;
@@ -1770,7 +1150,7 @@ declare module "@babylonjs/gui-editor/guiNodeTools" {
1770
1150
  import { ImageBasedSlider } from "@babylonjs/gui/2D/controls/sliders/imageBasedSlider";
1771
1151
  export class GUINodeTools {
1772
1152
  static ImageControlDefaultUrl: string;
1773
- static CreateControlFromString(data: string): Grid | Rectangle | Line | Image | TextBlock | Slider | ImageBasedSlider | RadioButton | InputText | ColorPicker | StackPanel | Ellipse | Checkbox | DisplayGrid;
1153
+ static CreateControlFromString(data: string): Grid | Line | Rectangle | Image | TextBlock | Slider | ImageBasedSlider | RadioButton | InputText | ColorPicker | StackPanel | Ellipse | Checkbox | DisplayGrid;
1774
1154
  }
1775
1155
  }
1776
1156
  declare module "@babylonjs/gui-editor/components/propertyTab/propertyTabComponent" {
@@ -1799,8 +1179,9 @@ declare module "@babylonjs/gui-editor/components/propertyTab/propertyTabComponen
1799
1179
  saveToSnippetServerHelper: (content: string, adt: AdvancedDynamicTexture) => Promise<string>;
1800
1180
  saveToSnippetServer: () => Promise<void>;
1801
1181
  loadFromSnippet(): void;
1802
- renderProperties(): JSX.Element | null;
1803
- renderControlIcon(): string;
1182
+ renderNode(node: Control): JSX.Element;
1183
+ renderProperties(node: Control): JSX.Element | null;
1184
+ renderControlIcon(node: Control): string;
1804
1185
  render(): JSX.Element | null;
1805
1186
  }
1806
1187
  }
@@ -1915,8 +1296,8 @@ declare module "@babylonjs/gui-editor/components/sceneExplorer/treeItemSelectabl
1915
1296
  scrollIntoView(): void;
1916
1297
  componentWillUnmount(): void;
1917
1298
  onSelect(): void;
1918
- renderChildren(isExpanded: boolean): (JSX.Element | null)[] | null;
1919
- render(): JSX.Element | null;
1299
+ renderChildren(isExpanded: boolean, offset?: boolean): (JSX.Element | null)[] | null;
1300
+ render(): JSX.Element | (JSX.Element | null)[] | null;
1920
1301
  dragOver(event: React.DragEvent<HTMLDivElement>): void;
1921
1302
  drop(): void;
1922
1303
  }
@@ -2050,6 +1431,22 @@ declare module "@babylonjs/gui-editor/components/commandBarComponent" {
2050
1431
  render(): JSX.Element;
2051
1432
  }
2052
1433
  }
1434
+ declare module "@babylonjs/gui-editor/diagram/artBoard" {
1435
+ import * as React from "react";
1436
+ import { GlobalState } from "@babylonjs/gui-editor/globalState";
1437
+ import { Rect } from "@babylonjs/gui-editor/diagram/coordinateHelper";
1438
+ interface IArtBoardProps {
1439
+ globalState: GlobalState;
1440
+ }
1441
+ interface IArtBoardState {
1442
+ bounds: Rect;
1443
+ }
1444
+ export class ArtBoardComponent extends React.Component<IArtBoardProps, IArtBoardState> {
1445
+ constructor(props: IArtBoardProps);
1446
+ update(): void;
1447
+ render(): JSX.Element;
1448
+ }
1449
+ }
2053
1450
  declare module "@babylonjs/gui-editor/workbenchEditor" {
2054
1451
  import * as React from "react";
2055
1452
  import { GlobalState } from "@babylonjs/gui-editor/globalState";