babylonjs-node-editor 5.0.0-rc.9 → 5.0.2

package/babylon.nodeEditor.d.ts

@@ -0,0 +1,2678 @@
+
+declare module BABYLON.NodeEditor {
+    export class BlockTools {
+        static GetBlockFromString(data: string, scene: BABYLON.Scene, nodeMaterial: BABYLON.NodeMaterial): BABYLON.ElbowBlock | BABYLON.TwirlBlock | BABYLON.VoronoiNoiseBlock | BABYLON.ScreenSpaceBlock | BABYLON.CloudBlock | BABYLON.MatrixBuilderBlock | BABYLON.DesaturateBlock | BABYLON.RefractBlock | BABYLON.ReflectBlock | BABYLON.DerivativeBlock | BABYLON.Rotate2dBlock | BABYLON.NormalBlendBlock | BABYLON.WorleyNoise3DBlock | BABYLON.SimplexPerlin3DBlock | BABYLON.BonesBlock | BABYLON.InstancesBlock | BABYLON.MorphTargetsBlock | BABYLON.DiscardBlock | BABYLON.ImageProcessingBlock | BABYLON.ColorMergerBlock | BABYLON.VectorMergerBlock | BABYLON.ColorSplitterBlock | BABYLON.VectorSplitterBlock | BABYLON.TextureBlock | BABYLON.ReflectionTextureBlock | BABYLON.LightBlock | BABYLON.FogBlock | BABYLON.VertexOutputBlock | BABYLON.FragmentOutputBlock | BABYLON.AddBlock | BABYLON.ClampBlock | BABYLON.ScaleBlock | BABYLON.CrossBlock | BABYLON.DotBlock | BABYLON.PowBlock | BABYLON.MultiplyBlock | BABYLON.TransformBlock | BABYLON.TrigonometryBlock | BABYLON.RemapBlock | BABYLON.NormalizeBlock | BABYLON.FresnelBlock | BABYLON.LerpBlock | BABYLON.NLerpBlock | BABYLON.DivideBlock | BABYLON.SubtractBlock | BABYLON.ModBlock | BABYLON.StepBlock | BABYLON.SmoothStepBlock | BABYLON.OneMinusBlock | BABYLON.ReciprocalBlock | BABYLON.ViewDirectionBlock | BABYLON.LightInformationBlock | BABYLON.MaxBlock | BABYLON.MinBlock | BABYLON.LengthBlock | BABYLON.DistanceBlock | BABYLON.NegateBlock | BABYLON.PerturbNormalBlock | BABYLON.RandomNumberBlock | BABYLON.ReplaceColorBlock | BABYLON.PosterizeBlock | BABYLON.ArcTan2Block | BABYLON.GradientBlock | BABYLON.FrontFacingBlock | BABYLON.WaveBlock | BABYLON.InputBlock | BABYLON.PBRMetallicRoughnessBlock | BABYLON.SheenBlock | BABYLON.AnisotropyBlock | BABYLON.ReflectionBlock | BABYLON.ClearCoatBlock | BABYLON.RefractionBlock | BABYLON.SubSurfaceBlock | BABYLON.CurrentScreenBlock | BABYLON.ParticleTextureBlock | BABYLON.ParticleRampGradientBlock | BABYLON.ParticleBlendMultiplyBlock | BABYLON.FragCoordBlock | BABYLON.ScreenSizeBlock | BABYLON.SceneDepthBlock | BABYLON.ConditionalBlock | BABYLON.ImageSourceBlock | BABYLON.ClipPlanesBlock | null;
+        static GetColorFromConnectionNodeType(type: BABYLON.NodeMaterialBlockConnectionPointTypes): string;
+        static GetConnectionNodeTypeFromString(type: string): BABYLON.NodeMaterialBlockConnectionPointTypes.Float | BABYLON.NodeMaterialBlockConnectionPointTypes.Vector2 | BABYLON.NodeMaterialBlockConnectionPointTypes.Vector3 | BABYLON.NodeMaterialBlockConnectionPointTypes.Vector4 | BABYLON.NodeMaterialBlockConnectionPointTypes.Color3 | BABYLON.NodeMaterialBlockConnectionPointTypes.Color4 | BABYLON.NodeMaterialBlockConnectionPointTypes.Matrix | BABYLON.NodeMaterialBlockConnectionPointTypes.AutoDetect;
+        static GetStringFromConnectionNodeType(type: BABYLON.NodeMaterialBlockConnectionPointTypes): "" | "Float" | "Vector2" | "Vector3" | "Vector4" | "Matrix" | "Color3" | "Color4";
+    }
+
+
+    interface ILogComponentProps {
+        globalState: GlobalState;
+    }
+    export class LogEntry {
+        message: string;
+        isError: boolean;
+        time: Date;
+        constructor(message: string, isError: boolean);
+    }
+    export class LogComponent extends React.Component<ILogComponentProps, {
+        logs: LogEntry[];
+    }> {
+        constructor(props: ILogComponentProps);
+        componentDidMount(): void;
+        componentDidUpdate(): void;
+        render(): JSX.Element;
+    }
+
+
+    interface INodeListComponentProps {
+        globalState: GlobalState;
+    }
+    export class NodeListComponent extends React.Component<INodeListComponentProps, {
+        filter: string;
+    }> {
+        private _onResetRequiredObserver;
+        private static _Tooltips;
+        private _customFrameList;
+        private _customBlockList;
+        constructor(props: INodeListComponentProps);
+        componentWillUnmount(): void;
+        filterContent(filter: string): void;
+        loadCustomFrame(file: File): void;
+        removeItem(value: string): void;
+        loadCustomBlock(file: File): void;
+        removeCustomBlock(value: string): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IPreviewAreaComponentProps {
+        globalState: GlobalState;
+        width: number;
+    }
+    export class PreviewAreaComponent extends React.Component<IPreviewAreaComponentProps, {
+        isLoading: boolean;
+    }> {
+        private _onIsLoadingChangedObserver;
+        private _onResetRequiredObserver;
+        constructor(props: IPreviewAreaComponentProps);
+        componentWillUnmount(): void;
+        changeBackFaceCulling(value: boolean): void;
+        changeDepthPrePass(value: boolean): void;
+        changeParticleSystemBlendMode(newOne: number): void;
+        render(): JSX.Element;
+    }
+
+
+    export class PreviewManager {
+        private _nodeMaterial;
+        private _onBuildObserver;
+        private _onPreviewCommandActivatedObserver;
+        private _onAnimationCommandActivatedObserver;
+        private _onUpdateRequiredObserver;
+        private _onPreviewBackgroundChangedObserver;
+        private _onBackFaceCullingChangedObserver;
+        private _onDepthPrePassChangedObserver;
+        private _onLightUpdatedObserver;
+        private _engine;
+        private _scene;
+        private _meshes;
+        private _camera;
+        private _material;
+        private _globalState;
+        private _currentType;
+        private _lightParent;
+        private _postprocess;
+        private _proceduralTexture;
+        private _particleSystem;
+        private _layer;
+        constructor(targetCanvas: HTMLCanvasElement, globalState: GlobalState);
+        private _handleAnimations;
+        private _prepareLights;
+        private _prepareScene;
+        private _refreshPreviewMesh;
+        private _loadParticleSystem;
+        private _forceCompilationAsync;
+        private _updatePreview;
+        dispose(): void;
+    }
+
+
+    interface IPreviewMeshControlComponent {
+        globalState: GlobalState;
+        togglePreviewAreaComponent: () => void;
+    }
+    export class PreviewMeshControlComponent extends React.Component<IPreviewMeshControlComponent> {
+        private _colorInputRef;
+        private _filePickerRef;
+        private _onResetRequiredObserver;
+        constructor(props: IPreviewMeshControlComponent);
+        componentWillUnmount(): void;
+        changeMeshType(newOne: PreviewType): void;
+        useCustomMesh(evt: any): void;
+        onPopUp(): void;
+        changeAnimation(): void;
+        changeBackground(value: string): void;
+        changeBackgroundClick(): void;
+        render(): JSX.Element;
+    }
+
+
+    export enum PreviewType {
+        Sphere = 0,
+        Box = 1,
+        Torus = 2,
+        Cylinder = 3,
+        Plane = 4,
+        ShaderBall = 5,
+        DefaultParticleSystem = 6,
+        Bubbles = 7,
+        Smoke = 8,
+        Rain = 9,
+        Explosion = 10,
+        Fire = 11,
+        Custom = 12
+    }
+
+
+    interface IInputsPropertyTabComponentProps {
+        globalState: GlobalState;
+        inputs: BABYLON.InputBlock[];
+    }
+    export class InputsPropertyTabComponent extends React.Component<IInputsPropertyTabComponentProps> {
+        constructor(props: IInputsPropertyTabComponentProps);
+        processInputBlockUpdate(ib: BABYLON.InputBlock): void;
+        renderInputBlock(block: BABYLON.InputBlock): JSX.Element | null;
+        render(): JSX.Element;
+    }
+
+
+    interface IColor3PropertyTabComponentProps {
+        globalState: GlobalState;
+        inputBlock: BABYLON.InputBlock;
+    }
+    export class Color3PropertyTabComponent extends React.Component<IColor3PropertyTabComponentProps> {
+        render(): JSX.Element;
+    }
+
+
+    interface IColor4PropertyTabComponentProps {
+        globalState: GlobalState;
+        inputBlock: BABYLON.InputBlock;
+    }
+    export class Color4PropertyTabComponent extends React.Component<IColor4PropertyTabComponentProps> {
+        render(): JSX.Element;
+    }
+
+
+    interface IFloatPropertyTabComponentProps {
+        globalState: GlobalState;
+        inputBlock: BABYLON.InputBlock;
+    }
+    export class FloatPropertyTabComponent extends React.Component<IFloatPropertyTabComponentProps> {
+        render(): JSX.Element;
+    }
+
+
+    interface IMatrixPropertyTabComponentProps {
+        globalState: GlobalState;
+        inputBlock: BABYLON.InputBlock;
+    }
+    export class MatrixPropertyTabComponent extends React.Component<IMatrixPropertyTabComponentProps> {
+        render(): JSX.Element;
+    }
+
+
+    interface IVector2PropertyTabComponentProps {
+        globalState: GlobalState;
+        inputBlock: BABYLON.InputBlock;
+    }
+    export class Vector2PropertyTabComponent extends React.Component<IVector2PropertyTabComponentProps> {
+        render(): JSX.Element;
+    }
+
+
+    interface IVector3PropertyTabComponentProps {
+        globalState: GlobalState;
+        inputBlock: BABYLON.InputBlock;
+    }
+    export class Vector3PropertyTabComponent extends React.Component<IVector3PropertyTabComponentProps> {
+        render(): JSX.Element;
+    }
+
+
+    interface IVector4PropertyTabComponentProps {
+        globalState: GlobalState;
+        inputBlock: BABYLON.InputBlock;
+    }
+    export class Vector4PropertyTabComponent extends React.Component<IVector4PropertyTabComponentProps> {
+        render(): JSX.Element;
+    }
+
+
+    interface IPropertyTabComponentProps {
+        globalState: GlobalState;
+    }
+    interface IPropertyTabComponentState {
+        currentNode: BABYLON.Nullable<GraphNode>;
+        currentFrame: BABYLON.Nullable<GraphFrame>;
+        currentFrameNodePort: BABYLON.Nullable<FrameNodePort>;
+        currentNodePort: BABYLON.Nullable<NodePort>;
+        uploadInProgress: boolean;
+    }
+    export class PropertyTabComponent extends React.Component<IPropertyTabComponentProps, IPropertyTabComponentState> {
+        private _onBuiltObserver;
+        private _modeSelect;
+        constructor(props: IPropertyTabComponentProps);
+        componentDidMount(): void;
+        componentWillUnmount(): void;
+        processInputBlockUpdate(ib: BABYLON.InputBlock): void;
+        renderInputBlock(block: BABYLON.InputBlock): JSX.Element | null;
+        load(file: File): void;
+        loadFrame(file: File): void;
+        save(): void;
+        customSave(): void;
+        saveToSnippetServer(): void;
+        loadFromSnippet(): void;
+        changeMode(value: any, force?: boolean, loadDefault?: boolean): boolean;
+        render(): JSX.Element;
+    }
+
+
+    export class ClampDisplayManager implements IDisplayManager {
+        getHeaderClass(): string;
+        shouldDisplayPortLabels(): boolean;
+        getHeaderText(block: BABYLON.NodeMaterialBlock): string;
+        getBackgroundColor(): string;
+        updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
+    }
+
+
+    export class ConditionalDisplayManager implements IDisplayManager {
+        getHeaderClass(): string;
+        shouldDisplayPortLabels(): boolean;
+        getHeaderText(block: BABYLON.NodeMaterialBlock): string;
+        getBackgroundColor(): string;
+        updatePreviewContent(): void;
+    }
+
+
+    export class DiscardDisplayManager implements IDisplayManager {
+        getHeaderClass(): string;
+        shouldDisplayPortLabels(): boolean;
+        getHeaderText(block: BABYLON.NodeMaterialBlock): string;
+        getBackgroundColor(): string;
+        updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
+    }
+
+
+    export interface IDisplayManager {
+        getHeaderClass(block: BABYLON.NodeMaterialBlock): string;
+        shouldDisplayPortLabels(block: BABYLON.NodeMaterialBlock): boolean;
+        updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
+        getBackgroundColor(block: BABYLON.NodeMaterialBlock): string;
+        getHeaderText(block: BABYLON.NodeMaterialBlock): string;
+    }
+
+
+    export class ElbowDisplayManager implements IDisplayManager {
+        getHeaderClass(): string;
+        shouldDisplayPortLabels(): boolean;
+        getHeaderText(block: BABYLON.NodeMaterialBlock): string;
+        getBackgroundColor(block: BABYLON.NodeMaterialBlock): string;
+        updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
+    }
+
+
+    export class GradientDisplayManager implements IDisplayManager {
+        getHeaderClass(): string;
+        shouldDisplayPortLabels(): boolean;
+        getHeaderText(block: BABYLON.NodeMaterialBlock): string;
+        getBackgroundColor(block: BABYLON.NodeMaterialBlock): string;
+        updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
+    }
+
+
+    export class ImageSourceDisplayManager implements IDisplayManager {
+        private _previewCanvas;
+        private _previewImage;
+        getHeaderClass(): string;
+        shouldDisplayPortLabels(): boolean;
+        getHeaderText(block: BABYLON.NodeMaterialBlock): string;
+        getBackgroundColor(): string;
+        updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
+    }
+
+
+    export class InputDisplayManager implements IDisplayManager {
+        getHeaderClass(block: BABYLON.NodeMaterialBlock): "" | "constant" | "inspector";
+        shouldDisplayPortLabels(): boolean;
+        getHeaderText(block: BABYLON.NodeMaterialBlock): string;
+        static GetBaseType(type: BABYLON.NodeMaterialBlockConnectionPointTypes): string;
+        getBackgroundColor(block: BABYLON.NodeMaterialBlock): string;
+        updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
+    }
+
+
+    export class OutputDisplayManager implements IDisplayManager {
+        getHeaderClass(): string;
+        shouldDisplayPortLabels(): boolean;
+        getHeaderText(block: BABYLON.NodeMaterialBlock): string;
+        getBackgroundColor(): string;
+        updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
+    }
+
+
+    export class PBRDisplayManager implements IDisplayManager {
+        getHeaderClass(): string;
+        shouldDisplayPortLabels(): boolean;
+        getHeaderText(block: BABYLON.NodeMaterialBlock): string;
+        getBackgroundColor(): string;
+        updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
+    }
+
+
+    export class RemapDisplayManager implements IDisplayManager {
+        getHeaderClass(): string;
+        shouldDisplayPortLabels(): boolean;
+        getHeaderText(block: BABYLON.NodeMaterialBlock): string;
+        getBackgroundColor(): string;
+        private _extractInputValue;
+        updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
+    }
+
+
+    export class TextureDisplayManager implements IDisplayManager {
+        private _previewCanvas;
+        private _previewImage;
+        getHeaderClass(): string;
+        shouldDisplayPortLabels(): boolean;
+        getHeaderText(block: BABYLON.NodeMaterialBlock): string;
+        getBackgroundColor(block: BABYLON.NodeMaterialBlock): string;
+        updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
+    }
+
+
+    export class TrigonometryDisplayManager implements IDisplayManager {
+        getHeaderClass(): string;
+        shouldDisplayPortLabels(): boolean;
+        getHeaderText(block: BABYLON.NodeMaterialBlock): string;
+        getBackgroundColor(): string;
+        updatePreviewContent(block: BABYLON.NodeMaterialBlock, contentArea: HTMLDivElement): void;
+    }
+
+
+    export class DisplayLedger {
+        static RegisteredControls: {
+            [key: string]: any;
+        };
+    }
+
+
+    export class FrameNodePort extends NodePort {
+        connectionPoint: BABYLON.NodeMaterialConnectionPoint;
+        node: GraphNode;
+        private _parentFrameId;
+        private _isInput;
+        private _framePortPosition;
+        private _framePortId;
+        private _onFramePortPositionChangedObservable;
+        get parentFrameId(): number;
+        get onFramePortPositionChangedObservable(): BABYLON.Observable<FrameNodePort>;
+        get isInput(): boolean;
+        get framePortId(): number;
+        get framePortPosition(): FramePortPosition;
+        set framePortPosition(position: FramePortPosition);
+        constructor(portContainer: HTMLElement, connectionPoint: BABYLON.NodeMaterialConnectionPoint, node: GraphNode, globalState: GlobalState, isInput: boolean, framePortId: number, parentFrameId: number);
+        static CreateFrameNodePortElement(connectionPoint: BABYLON.NodeMaterialConnectionPoint, node: GraphNode, root: HTMLElement, displayManager: BABYLON.Nullable<IDisplayManager>, globalState: GlobalState, isInput: boolean, framePortId: number, parentFrameId: number): FrameNodePort;
+    }
+
+
+    export interface IGraphCanvasComponentProps {
+        globalState: GlobalState;
+        onEmitNewBlock: (block: BABYLON.NodeMaterialBlock) => GraphNode;
+    }
+    export type FramePortData = {
+        frame: GraphFrame;
+        port: FrameNodePort;
+    };
+    export const isFramePortData: (variableToCheck: any) => variableToCheck is FramePortData;
+    export class GraphCanvasComponent extends React.Component<IGraphCanvasComponentProps> {
+        private readonly _minZoom;
+        private readonly _maxZoom;
+        private _hostCanvas;
+        private _graphCanvas;
+        private _selectionContainer;
+        private _frameContainer;
+        private _svgCanvas;
+        private _rootContainer;
+        private _nodes;
+        private _links;
+        private _mouseStartPointX;
+        private _mouseStartPointY;
+        private _dropPointX;
+        private _dropPointY;
+        private _selectionStartX;
+        private _selectionStartY;
+        private _candidateLinkedHasMoved;
+        private _x;
+        private _y;
+        private _zoom;
+        private _selectedNodes;
+        private _selectedLink;
+        private _selectedPort;
+        private _candidateLink;
+        private _candidatePort;
+        private _gridSize;
+        private _selectionBox;
+        private _selectedFrames;
+        private _frameCandidate;
+        private _frames;
+        private _altKeyIsPressed;
+        private _ctrlKeyIsPressed;
+        private _oldY;
+        _frameIsMoving: boolean;
+        _isLoading: boolean;
+        get gridSize(): number;
+        set gridSize(value: number);
+        get globalState(): GlobalState;
+        get nodes(): GraphNode[];
+        get links(): NodeLink[];
+        get frames(): GraphFrame[];
+        get zoom(): number;
+        set zoom(value: number);
+        get x(): number;
+        set x(value: number);
+        get y(): number;
+        set y(value: number);
+        get selectedNodes(): GraphNode[];
+        get selectedLink(): BABYLON.Nullable<NodeLink>;
+        get selectedFrames(): GraphFrame[];
+        get selectedPort(): BABYLON.Nullable<NodePort>;
+        get canvasContainer(): HTMLDivElement;
+        get hostCanvas(): HTMLDivElement;
+        get svgCanvas(): HTMLElement;
+        get selectionContainer(): HTMLDivElement;
+        get frameContainer(): HTMLDivElement;
+        constructor(props: IGraphCanvasComponentProps);
+        static _RefreshNode: (node: GraphNode, visitedNodes?: Set<GraphNode> | undefined, visitedLinks?: Set<NodeLink> | undefined) => void;
+        getGridPosition(position: number, useCeil?: boolean): number;
+        getGridPositionCeil(position: number): number;
+        updateTransform(): void;
+        onKeyUp(): void;
+        findNodeFromBlock(block: BABYLON.NodeMaterialBlock): GraphNode;
+        reset(): void;
+        connectPorts(pointA: BABYLON.NodeMaterialConnectionPoint, pointB: BABYLON.NodeMaterialConnectionPoint): void;
+        removeLink(link: NodeLink): void;
+        appendBlock(block: BABYLON.NodeMaterialBlock): GraphNode;
+        distributeGraph(): void;
+        componentDidMount(): void;
+        onMove(evt: React.PointerEvent): void;
+        onDown(evt: React.PointerEvent<HTMLElement>): void;
+        onUp(evt: React.PointerEvent): void;
+        onWheel(evt: React.WheelEvent): void;
+        zoomToFit(): void;
+        processCandidatePort(): void;
+        connectNodes(nodeA: GraphNode, pointA: BABYLON.NodeMaterialConnectionPoint, nodeB: GraphNode, pointB: BABYLON.NodeMaterialConnectionPoint): void;
+        processEditorData(editorData: IEditorData): void;
+        addFrame(frameData: IFrameData): void;
+        render(): JSX.Element;
+    }
+
+
+    export enum FramePortPosition {
+        Top = 0,
+        Middle = 1,
+        Bottom = 2
+    }
+    export class GraphFrame {
+        private readonly _collapsedWidth;
+        private static _FrameCounter;
+        private static _FramePortCounter;
+        private _name;
+        private _color;
+        private _x;
+        private _y;
+        private _gridAlignedX;
+        private _gridAlignedY;
+        private _width;
+        private _height;
+        element: HTMLDivElement;
+        private _borderElement;
+        private _headerElement;
+        private _headerTextElement;
+        private _headerCollapseElement;
+        private _headerCloseElement;
+        private _commentsElement;
+        private _portContainer;
+        private _outputPortContainer;
+        private _inputPortContainer;
+        private _nodes;
+        private _ownerCanvas;
+        private _mouseStartPointX;
+        private _mouseStartPointY;
+        private _onSelectionChangedObserver;
+        private _onGraphNodeRemovalObserver;
+        private _onExposePortOnFrameObserver;
+        private _onNodeLinkDisposedObservers;
+        private _isCollapsed;
+        private _frameInPorts;
+        private _frameOutPorts;
+        private _controlledPorts;
+        private _exposedInPorts;
+        private _exposedOutPorts;
+        private _id;
+        private _comments;
+        private _frameIsResizing;
+        private _resizingDirection;
+        private _minFrameHeight;
+        private _minFrameWidth;
+        private _mouseXLimit;
+        onExpandStateChanged: BABYLON.Observable<GraphFrame>;
+        private readonly _closeSVG;
+        private readonly _expandSVG;
+        private readonly _collapseSVG;
+        get id(): number;
+        get isCollapsed(): boolean;
+        private _createInputPort;
+        private _markFramePortPositions;
+        private _createFramePorts;
+        private _removePortFromExposedWithNode;
+        private _removePortFromExposedWithLink;
+        private _createInputPorts;
+        private _createOutputPorts;
+        redrawFramePorts(): void;
+        set isCollapsed(value: boolean);
+        get nodes(): GraphNode[];
+        get ports(): FrameNodePort[];
+        get name(): string;
+        set name(value: string);
+        get color(): BABYLON.Color3;
+        set color(value: BABYLON.Color3);
+        get x(): number;
+        set x(value: number);
+        get y(): number;
+        set y(value: number);
+        get width(): number;
+        set width(value: number);
+        get height(): number;
+        set height(value: number);
+        get comments(): string;
+        set comments(comments: string);
+        constructor(candidate: BABYLON.Nullable<HTMLDivElement>, canvas: GraphCanvasComponent, doNotCaptureNodes?: boolean);
+        refresh(): void;
+        addNode(node: GraphNode): void;
+        removeNode(node: GraphNode): void;
+        syncNode(node: GraphNode): void;
+        cleanAccumulation(): void;
+        private _onDown;
+        move(newX: number, newY: number, align?: boolean): void;
+        private _onUp;
+        _moveFrame(offsetX: number, offsetY: number): void;
+        private _onMove;
+        moveFramePortUp(nodePort: FrameNodePort): void;
+        private _movePortUp;
+        moveFramePortDown(nodePort: FrameNodePort): void;
+        private _movePortDown;
+        private _initResizing;
+        private _cleanUpResizing;
+        private _updateMinHeightWithComments;
+        private _isResizingTop;
+        private _isResizingRight;
+        private _isResizingBottom;
+        private _isResizingLeft;
+        private _onRightHandlePointerDown;
+        private _onRightHandlePointerMove;
+        private _moveRightHandle;
+        private _onRightHandlePointerUp;
+        private _onBottomHandlePointerDown;
+        private _onBottomHandlePointerMove;
+        private _moveBottomHandle;
+        private _onBottomHandlePointerUp;
+        private _onLeftHandlePointerDown;
+        private _onLeftHandlePointerMove;
+        private _moveLeftHandle;
+        private _onLeftHandlePointerUp;
+        private _onTopHandlePointerDown;
+        private _onTopHandlePointerMove;
+        private _moveTopHandle;
+        private _onTopHandlePointerUp;
+        private _onTopRightHandlePointerDown;
+        private _onTopRightHandlePointerMove;
+        private _moveTopRightHandle;
+        private _onTopRightHandlePointerUp;
+        private _onBottomRightHandlePointerDown;
+        private _onBottomRightHandlePointerMove;
+        private _moveBottomRightHandle;
+        private _onBottomRightHandlePointerUp;
+        private _onBottomLeftHandlePointerDown;
+        private _onBottomLeftHandlePointerMove;
+        private _moveBottomLeftHandle;
+        private _onBottomLeftHandlePointerUp;
+        private _onTopLeftHandlePointerDown;
+        private _onTopLeftHandlePointerMove;
+        private _moveTopLeftHandle;
+        private _onTopLeftHandlePointerUp;
+        private _expandLeft;
+        private _expandTop;
+        private _expandRight;
+        private _expandBottom;
+        dispose(): void;
+        private _serializePortData;
+        serialize(saveCollapsedState: boolean): IFrameData;
+        export(): void;
+        adjustPorts(): void;
+        static Parse(serializationData: IFrameData, canvas: GraphCanvasComponent, map?: {
+            [key: number]: number;
+        }): GraphFrame;
+    }
+
+
+    /// <reference types="react" />
+    export class GraphNode {
+        block: BABYLON.NodeMaterialBlock;
+        private _visual;
+        private _headerContainer;
+        private _promotionWarning;
+        private _header;
+        private _connections;
+        private _inputsContainer;
+        private _outputsContainer;
+        private _content;
+        private _comments;
+        private _inputPorts;
+        private _outputPorts;
+        private _links;
+        private _x;
+        private _y;
+        private _gridAlignedX;
+        private _gridAlignedY;
+        private _mouseStartPointX;
+        private _mouseStartPointY;
+        private _globalState;
+        private _onSelectionChangedObserver;
+        private _onSelectionBoxMovedObserver;
+        private _onFrameCreatedObserver;
+        private _onUpdateRequiredObserver;
+        private _ownerCanvas;
+        private _isSelected;
+        private _displayManager;
+        private _isVisible;
+        private _enclosingFrameId;
+        get isVisible(): boolean;
+        set isVisible(value: boolean);
+        private _upateNodePortNames;
+        get outputPorts(): NodePort[];
+        get inputPorts(): NodePort[];
+        get links(): NodeLink[];
+        get gridAlignedX(): number;
+        get gridAlignedY(): number;
+        get x(): number;
+        set x(value: number);
+        get y(): number;
+        set y(value: number);
+        get width(): number;
+        get height(): number;
+        get id(): number;
+        get name(): string;
+        get isSelected(): boolean;
+        get enclosingFrameId(): number;
+        set enclosingFrameId(value: number);
+        set isSelected(value: boolean);
+        constructor(block: BABYLON.NodeMaterialBlock, globalState: GlobalState);
+        isOverlappingFrame(frame: GraphFrame): boolean;
+        getPortForConnectionPoint(point: BABYLON.NodeMaterialConnectionPoint): NodePort | null;
+        getLinksForConnectionPoint(point: BABYLON.NodeMaterialConnectionPoint): NodeLink[];
+        private _refreshFrames;
+        _refreshLinks(): void;
+        refresh(): void;
+        private _onDown;
+        cleanAccumulation(useCeil?: boolean): void;
+        private _onUp;
+        private _onMove;
+        renderProperties(): BABYLON.Nullable<JSX.Element>;
+        appendVisual(root: HTMLDivElement, owner: GraphCanvasComponent): void;
+        dispose(): void;
+    }
+
+
+    export class NodeLink {
+        private _graphCanvas;
+        private _portA;
+        private _portB?;
+        private _nodeA;
+        private _nodeB?;
+        private _path;
+        private _selectionPath;
+        private _onSelectionChangedObserver;
+        private _isVisible;
+        onDisposedObservable: BABYLON.Observable<NodeLink>;
+        get isVisible(): boolean;
+        set isVisible(value: boolean);
+        get portA(): NodePort | FrameNodePort;
+        get portB(): NodePort | FrameNodePort | undefined;
+        get nodeA(): GraphNode;
+        get nodeB(): GraphNode | undefined;
+        update(endX?: number, endY?: number, straight?: boolean): void;
+        constructor(graphCanvas: GraphCanvasComponent, portA: NodePort, nodeA: GraphNode, portB?: NodePort, nodeB?: GraphNode);
+        onClick(evt: MouseEvent): void;
+        dispose(notify?: boolean): void;
+    }
+
+
+    export class NodePort {
+        connectionPoint: BABYLON.NodeMaterialConnectionPoint;
+        node: GraphNode;
+        protected _element: HTMLDivElement;
+        protected _img: HTMLImageElement;
+        protected _globalState: GlobalState;
+        protected _portLabelElement: Element;
+        protected _onCandidateLinkMovedObserver: BABYLON.Nullable<BABYLON.Observer<BABYLON.Nullable<BABYLON.Vector2>>>;
+        protected _onSelectionChangedObserver: BABYLON.Nullable<BABYLON.Observer<BABYLON.Nullable<ISelectionChangedOptions>>>;
+        protected _exposedOnFrame: boolean;
+        delegatedPort: BABYLON.Nullable<FrameNodePort>;
+        get element(): HTMLDivElement;
+        get portName(): string;
+        set portName(newName: string);
+        get disabled(): boolean;
+        hasLabel(): boolean;
+        get exposedOnFrame(): boolean;
+        set exposedOnFrame(value: boolean);
+        get exposedPortPosition(): number;
+        set exposedPortPosition(value: number);
+        private _isConnectedToNodeOutsideOfFrame;
+        refresh(): void;
+        constructor(portContainer: HTMLElement, connectionPoint: BABYLON.NodeMaterialConnectionPoint, node: GraphNode, globalState: GlobalState);
+        dispose(): void;
+        static CreatePortElement(connectionPoint: BABYLON.NodeMaterialConnectionPoint, node: GraphNode, root: HTMLElement, displayManager: BABYLON.Nullable<IDisplayManager>, globalState: GlobalState): NodePort;
+    }
+
+
+    export class ColorMergerPropertyTabComponent extends React.Component<IPropertyComponentProps> {
+        constructor(props: IPropertyComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    export class ConditionalPropertyTabComponent extends React.Component<IPropertyComponentProps> {
+        constructor(props: IPropertyComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    export interface IFrameNodePortPropertyTabComponentProps {
+        globalState: GlobalState;
+        frameNodePort: FrameNodePort;
+        frame: GraphFrame;
+    }
+    export class FrameNodePortPropertyTabComponent extends React.Component<IFrameNodePortPropertyTabComponentProps, {
+        port: FrameNodePort;
+    }> {
+        private _onFramePortPositionChangedObserver;
+        private _onSelectionChangedObserver;
+        constructor(props: IFrameNodePortPropertyTabComponentProps);
+        componentWillUnmount(): void;
+        render(): JSX.Element;
+    }
+
+
+    export interface IFramePropertyTabComponentProps {
+        globalState: GlobalState;
+        frame: GraphFrame;
+    }
+    export class FramePropertyTabComponent extends React.Component<IFramePropertyTabComponentProps> {
+        private _onFrameExpandStateChangedObserver;
+        constructor(props: IFramePropertyTabComponentProps);
+        componentDidMount(): void;
+        componentWillUnmount(): void;
+        render(): JSX.Element;
+    }
+
+
+    export class GenericPropertyComponent extends React.Component<IPropertyComponentProps> {
+        constructor(props: IPropertyComponentProps);
+        render(): JSX.Element;
+    }
+    export class GeneralPropertyTabComponent extends React.Component<IPropertyComponentProps> {
+        constructor(props: IPropertyComponentProps);
+        render(): JSX.Element;
+    }
+    export class GenericPropertyTabComponent extends React.Component<IPropertyComponentProps> {
+        constructor(props: IPropertyComponentProps);
+        forceRebuild(notifiers?: {
+            rebuild?: boolean;
+            update?: boolean;
+            activatePreviewCommand?: boolean;
+            callback?: (scene: BABYLON.Scene) => void;
+        }): void;
+        render(): JSX.Element;
+    }
+
+
+    export class GradientPropertyTabComponent extends React.Component<IPropertyComponentProps> {
+        private _onValueChangedObserver;
+        constructor(props: IPropertyComponentProps);
+        componentDidMount(): void;
+        componentWillUnmount(): void;
+        forceRebuild(): void;
+        deleteStep(step: BABYLON.GradientBlockColorStep): void;
+        copyStep(step: BABYLON.GradientBlockColorStep): void;
+        addNewStep(): void;
+        checkForReOrder(): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IGradientStepComponentProps {
+        globalState: GlobalState;
+        step: BABYLON.GradientBlockColorStep;
+        lineIndex: number;
+        onDelete: () => void;
+        onUpdateStep: () => void;
+        onCheckForReOrder: () => void;
+        onCopy?: () => void;
+    }
+    export class GradientStepComponent extends React.Component<IGradientStepComponentProps, {
+        gradient: number;
+    }> {
+        constructor(props: IGradientStepComponentProps);
+        updateColor(color: string): void;
+        updateStep(gradient: number): void;
+        onPointerUp(): void;
+        render(): JSX.Element;
+    }
+
+
+    export class ImageSourcePropertyTabComponent extends React.Component<IPropertyComponentProps, {
+        isEmbedded: boolean;
+    }> {
+        get imageSourceBlock(): BABYLON.ImageSourceBlock;
+        constructor(props: IPropertyComponentProps);
+        UNSAFE_componentWillUpdate(nextProps: IPropertyComponentProps, nextState: {
+            isEmbedded: boolean;
+            loadAsCubeTexture: boolean;
+        }): void;
+        private _generateRandomForCache;
+        updateAfterTextureLoad(): void;
+        removeTexture(): void;
+        _prepareTexture(): void;
+        /**
+         * Replaces the texture of the node
+         * @param file the file of the texture to use
+         */
+        replaceTexture(file: File): void;
+        replaceTextureWithUrl(url: string): void;
+        render(): JSX.Element;
+    }
+
+
+    export class InputPropertyTabComponent extends React.Component<IPropertyComponentProps> {
+        private _onValueChangedObserver;
+        constructor(props: IPropertyComponentProps);
+        componentDidMount(): void;
+        componentWillUnmount(): void;
+        renderValue(globalState: GlobalState): JSX.Element | null;
+        setDefaultValue(): void;
+        render(): JSX.Element;
+    }
+
+
+    export class LightInformationPropertyTabComponent extends React.Component<IPropertyComponentProps> {
+        render(): JSX.Element;
+    }
+
+
+    export class LightPropertyTabComponent extends React.Component<IPropertyComponentProps> {
+        render(): JSX.Element;
+    }
+
+
+    export interface IFrameNodePortPropertyTabComponentProps {
+        globalState: GlobalState;
+        nodePort: NodePort;
+    }
+    export class NodePortPropertyTabComponent extends React.Component<IFrameNodePortPropertyTabComponentProps> {
+        private _onSelectionChangedObserver;
+        constructor(props: IFrameNodePortPropertyTabComponentProps);
+        componentWillUnmount(): void;
+        toggleExposeOnFrame(value: boolean): void;
+        render(): JSX.Element;
+    }
+
+
+    export interface IPropertyComponentProps {
+        globalState: GlobalState;
+        block: BABYLON.NodeMaterialBlock;
+    }
+
+
+    type ReflectionTexture = BABYLON.ReflectionTextureBlock | BABYLON.ReflectionBlock | BABYLON.RefractionBlock;
+    type AnyTexture = BABYLON.TextureBlock | ReflectionTexture | BABYLON.CurrentScreenBlock | BABYLON.ParticleTextureBlock;
+    export class TexturePropertyTabComponent extends React.Component<IPropertyComponentProps, {
+        isEmbedded: boolean;
+        loadAsCubeTexture: boolean;
+        textureIsPrefiltered: boolean;
+    }> {
+        get textureBlock(): AnyTexture;
+        constructor(props: IPropertyComponentProps);
+        UNSAFE_componentWillUpdate(nextProps: IPropertyComponentProps, nextState: {
+            isEmbedded: boolean;
+            loadAsCubeTexture: boolean;
+        }): void;
+        private _generateRandomForCache;
+        updateAfterTextureLoad(): void;
+        removeTexture(): void;
+        _prepareTexture(): void;
+        /**
+         * Replaces the texture of the node
+         * @param file the file of the texture to use
+         */
+        replaceTexture(file: File): void;
+        replaceTextureWithUrl(url: string): void;
+        render(): JSX.Element;
+    }
+
+
+    export class TransformPropertyTabComponent extends React.Component<IPropertyComponentProps> {
+        constructor(props: IPropertyComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    export class TrigonometryPropertyTabComponent extends React.Component<IPropertyComponentProps> {
+        constructor(props: IPropertyComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    export class VectorMergerPropertyTabComponent extends React.Component<IPropertyComponentProps> {
+        constructor(props: IPropertyComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    export class PropertyLedger {
+        static RegisteredControls: {
+            [key: string]: React.ComponentClass<IPropertyComponentProps>;
+        };
+    }
+
+
+    export class ISelectionChangedOptions {
+        selection: BABYLON.Nullable<GraphNode | NodeLink | GraphFrame | NodePort | FramePortData>;
+        forceKeepSelection?: boolean;
+    }
+    export class GlobalState {
+        nodeMaterial: BABYLON.NodeMaterial;
+        hostElement: HTMLElement;
+        hostDocument: HTMLDocument;
+        hostWindow: Window;
+        onNewNodeCreatedObservable: BABYLON.Observable<GraphNode>;
+        onSelectionChangedObservable: BABYLON.Observable<BABYLON.Nullable<ISelectionChangedOptions>>;
+        onRebuildRequiredObservable: BABYLON.Observable<boolean>;
+        onBuiltObservable: BABYLON.Observable<void>;
+        onResetRequiredObservable: BABYLON.Observable<void>;
+        onUpdateRequiredObservable: BABYLON.Observable<BABYLON.Nullable<BABYLON.NodeMaterialBlock>>;
+        onZoomToFitRequiredObservable: BABYLON.Observable<void>;
+        onReOrganizedRequiredObservable: BABYLON.Observable<void>;
+        onLogRequiredObservable: BABYLON.Observable<LogEntry>;
+        onErrorMessageDialogRequiredObservable: BABYLON.Observable<string>;
+        onIsLoadingChanged: BABYLON.Observable<boolean>;
+        onPreviewCommandActivated: BABYLON.Observable<boolean>;
+        onLightUpdated: BABYLON.Observable<void>;
+        onPreviewBackgroundChanged: BABYLON.Observable<void>;
+        onBackFaceCullingChanged: BABYLON.Observable<void>;
+        onDepthPrePassChanged: BABYLON.Observable<void>;
+        onAnimationCommandActivated: BABYLON.Observable<void>;
+        onCandidateLinkMoved: BABYLON.Observable<BABYLON.Nullable<BABYLON.Vector2>>;
+        onSelectionBoxMoved: BABYLON.Observable<ClientRect | DOMRect>;
+        onFrameCreatedObservable: BABYLON.Observable<GraphFrame>;
+        onCandidatePortSelectedObservable: BABYLON.Observable<BABYLON.Nullable<NodePort | FrameNodePort>>;
+        onImportFrameObservable: BABYLON.Observable<any>;
+        onGraphNodeRemovalObservable: BABYLON.Observable<GraphNode>;
+        onPopupClosedObservable: BABYLON.Observable<void>;
+        onNewBlockRequiredObservable: BABYLON.Observable<{
+            type: string;
+            targetX: number;
+            targetY: number;
+            needRepositioning?: boolean | undefined;
+        }>;
+        onGetNodeFromBlock: (block: BABYLON.NodeMaterialBlock) => GraphNode;
+        onGridSizeChanged: BABYLON.Observable<void>;
+        onExposePortOnFrameObservable: BABYLON.Observable<GraphNode>;
+        previewType: PreviewType;
+        previewFile: File;
+        particleSystemBlendMode: number;
+        listOfCustomPreviewFiles: File[];
+        rotatePreview: boolean;
+        backgroundColor: BABYLON.Color4;
+        backFaceCulling: boolean;
+        depthPrePass: boolean;
+        blockKeyboardEvents: boolean;
+        hemisphericLight: boolean;
+        directionalLight0: boolean;
+        directionalLight1: boolean;
+        controlCamera: boolean;
+        storeEditorData: (serializationObject: any, frame?: BABYLON.Nullable<GraphFrame>) => void;
+        _mode: BABYLON.NodeMaterialModes;
+        /** Gets the mode */
+        get mode(): BABYLON.NodeMaterialModes;
+        /** Sets the mode */
+        set mode(m: BABYLON.NodeMaterialModes);
+        customSave?: {
+            label: string;
+            action: (data: string) => Promise<void>;
+        };
+        constructor();
+    }
+
+
+    interface IGraphEditorProps {
+        globalState: GlobalState;
+    }
+    interface IGraphEditorState {
+        showPreviewPopUp: boolean;
+    }
+    interface IInternalPreviewAreaOptions extends BABYLON.IInspectorOptions {
+        popup: boolean;
+        original: boolean;
+        explorerWidth?: string;
+        inspectorWidth?: string;
+        embedHostWidth?: string;
+    }
+    export class GraphEditor extends React.Component<IGraphEditorProps, IGraphEditorState> {
+        static readonly NodeWidth = 100;
+        private _graphCanvasRef;
+        private _diagramContainerRef;
+        private _graphCanvas;
+        private _diagramContainer;
+        private _startX;
+        private _moveInProgress;
+        private _leftWidth;
+        private _rightWidth;
+        private _blocks;
+        private _previewManager;
+        private _copiedNodes;
+        private _copiedFrames;
+        private _mouseLocationX;
+        private _mouseLocationY;
+        private _onWidgetKeyUpPointer;
+        private _previewHost;
+        private _popUpWindow;
+        /**
+         * Creates a node and recursivly creates its parent nodes from it's input
+         * @param block
+         * @param recursion
+         */
+        createNodeFromObject(block: BABYLON.NodeMaterialBlock, recursion?: boolean): GraphNode;
+        addValueNode(type: string): GraphNode;
+        componentDidMount(): void;
+        componentWillUnmount(): void;
+        constructor(props: IGraphEditorProps);
+        reconnectNewNodes(nodeIndex: number, newNodes: GraphNode[], sourceNodes: GraphNode[], done: boolean[]): void;
+        pasteSelection(copiedNodes: GraphNode[], currentX: number, currentY: number, selectNew?: boolean): GraphNode[] | undefined;
+        zoomToFit(): void;
+        buildMaterial(autoConfigure?: boolean): void;
+        build(): void;
+        loadGraph(): void;
+        showWaitScreen(): void;
+        hideWaitScreen(): void;
+        reOrganize(editorData?: BABYLON.Nullable<IEditorData>, isImportingAFrame?: boolean): void;
+        onPointerDown(evt: React.PointerEvent<HTMLDivElement>): void;
+        onPointerUp(evt: React.PointerEvent<HTMLDivElement>): void;
+        resizeColumns(evt: React.PointerEvent<HTMLDivElement>, forLeft?: boolean): void;
+        buildColumnLayout(): string;
+        emitNewBlock(blockType: string, targetX: number, targetY: number): void;
+        dropNewBlock(event: React.DragEvent<HTMLDivElement>): void;
+        handlePopUp: () => void;
+        handleClosingPopUp: () => void;
+        initiatePreviewArea: (canvas?: HTMLCanvasElement) => void;
+        createPopUp: () => void;
+        createPopupWindow: (title: string, windowVariableName: string, width?: number, height?: number) => Window | null;
+        createPreviewMeshControlHost: (options: IInternalPreviewAreaOptions, parentControl: BABYLON.Nullable<HTMLElement>) => void;
+        createPreviewHost: (options: IInternalPreviewAreaOptions, parentControl: BABYLON.Nullable<HTMLElement>) => void;
+        fixPopUpStyles: (document: Document) => void;
+        render(): JSX.Element;
+    }
+
+
+
+
+    /**
+     * Interface used to specify creation options for the node editor
+     */
+    export interface INodeEditorOptions {
+        nodeMaterial: BABYLON.NodeMaterial;
+        hostElement?: HTMLElement;
+        customSave?: {
+            label: string;
+            action: (data: string) => Promise<void>;
+        };
+        customLoadObservable?: BABYLON.Observable<any>;
+    }
+    /**
+     * Class used to create a node editor
+     */
+    export class NodeEditor {
+        private static _CurrentState;
+        /**
+         * Show the node editor
+         * @param options defines the options to use to configure the node editor
+         */
+        static Show(options: INodeEditorOptions): void;
+    }
+
+
+    export interface INodeLocationInfo {
+        blockId: number;
+        x: number;
+        y: number;
+    }
+    export interface IFrameData {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+        color: number[];
+        name: string;
+        isCollapsed: boolean;
+        blocks: number[];
+        comments: string;
+    }
+    export interface IEditorData {
+        locations: INodeLocationInfo[];
+        x: number;
+        y: number;
+        zoom: number;
+        frames?: IFrameData[];
+        map?: {
+            [key: number]: number;
+        };
+    }
+
+
+    interface IPortalProps {
+        globalState: GlobalState;
+    }
+    export class Portal extends React.Component<IPortalProps> {
+        render(): React.ReactPortal;
+    }
+
+
+    export class SerializationTools {
+        static UpdateLocations(material: BABYLON.NodeMaterial, globalState: GlobalState, frame?: BABYLON.Nullable<GraphFrame>): void;
+        static Serialize(material: BABYLON.NodeMaterial, globalState: GlobalState, frame?: BABYLON.Nullable<GraphFrame>): string;
+        static Deserialize(serializationObject: any, globalState: GlobalState): void;
+        static AddFrameToMaterial(serializationObject: any, globalState: GlobalState, currentMaterial: BABYLON.NodeMaterial): void;
+    }
+
+
+    export interface IButtonLineComponentProps {
+        label: string;
+        onClick: () => void;
+        isDisabled?: boolean;
+    }
+    export class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {
+        constructor(props: IButtonLineComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    export interface ICheckBoxLineComponentProps {
+        label: string;
+        target?: any;
+        propertyName?: string;
+        isSelected?: () => boolean;
+        onSelect?: (value: boolean) => void;
+        onValueChanged?: () => void;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        disabled?: boolean;
+    }
+    export class CheckBoxLineComponent extends React.Component<ICheckBoxLineComponentProps, {
+        isSelected: boolean;
+        isDisabled?: boolean;
+    }> {
+        private static _UniqueIdSeed;
+        private _uniqueId;
+        private _localChange;
+        constructor(props: ICheckBoxLineComponentProps);
+        shouldComponentUpdate(nextProps: ICheckBoxLineComponentProps, nextState: {
+            isSelected: boolean;
+            isDisabled: boolean;
+        }): boolean;
+        onChange(): void;
+        render(): JSX.Element;
+    }
+
+
+    export interface IColor3LineComponentProps {
+        label: string;
+        target: any;
+        propertyName: string;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        onChange?: () => void;
+        globalState: GlobalState;
+    }
+    interface IColor3LineComponentState {
+        isExpanded: boolean;
+    }
+    export class Color3LineComponent extends React.Component<IColor3LineComponentProps, IColor3LineComponentState> {
+        constructor(props: IColor3LineComponentProps);
+        onChange(newValue: string): void;
+        switchExpandState(): void;
+        updateColor(newValue: BABYLON.Color3 | BABYLON.Color4): void;
+        modifyColor(modifier: (previous: BABYLON.Color3 | BABYLON.Color4) => void): void;
+        getCurrentColor(): BABYLON.Color3 | BABYLON.Color4;
+        copyToClipboard(): void;
+        render(): JSX.Element;
+    }
+
+
+    export interface IColor4LineComponentProps {
+        label: string;
+        target: any;
+        propertyName: string;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        onChange?: () => void;
+        globalState: GlobalState;
+    }
+    export class Color4LineComponent extends React.Component<IColor4LineComponentProps, {
+        isExpanded: boolean;
+    }> {
+        constructor(props: IColor4LineComponentProps);
+        onChange(newValue: string): void;
+        switchExpandState(): void;
+        updateColor(newValue: BABYLON.Color4): void;
+        modifyColor(modifier: (previous: BABYLON.Color4) => void): void;
+        getCurrentColor(): BABYLON.Color4;
+        copyToClipboard(): void;
+        render(): JSX.Element;
+    }
+
+
+    export interface IColorPickerComponentProps {
+        value: BABYLON.Color4 | BABYLON.Color3;
+        onColorChanged: (newOne: string) => void;
+        globalState: GlobalState;
+    }
+    interface IColorPickerComponentState {
+        pickerEnabled: boolean;
+        color: BABYLON.Color3 | BABYLON.Color4;
+        hex: string;
+    }
+    export class ColorPickerLineComponent extends React.Component<IColorPickerComponentProps, IColorPickerComponentState> {
+        private _floatRef;
+        private _floatHostRef;
+        constructor(props: IColorPickerComponentProps);
+        syncPositions(): void;
+        shouldComponentUpdate(nextProps: IColorPickerComponentProps, nextState: IColorPickerComponentState): boolean;
+        componentDidUpdate(): void;
+        componentDidMount(): void;
+        setPickerState(enabled: boolean): void;
+        render(): JSX.Element;
+    }
+
+
+    export interface IButtonLineComponentProps {
+        data: string;
+        tooltip: string;
+    }
+    export class DraggableLineComponent extends React.Component<IButtonLineComponentProps> {
+        constructor(props: IButtonLineComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    export interface IDraggableLineWithButtonComponent {
+        data: string;
+        tooltip: string;
+        iconImage: any;
+        onIconClick: (value: string) => void;
+        iconTitle: string;
+        lenSuffixToRemove?: number;
+    }
+    export class DraggableLineWithButtonComponent extends React.Component<IDraggableLineWithButtonComponent> {
+        constructor(props: IDraggableLineWithButtonComponent);
+        render(): JSX.Element;
+    }
+
+
+    interface IFileButtonLineComponentProps {
+        label: string;
+        onClick: (file: File) => void;
+        accept: string;
+        uploadName?: string;
+    }
+    export class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {
+        private _uploadRef;
+        constructor(props: IFileButtonLineComponentProps);
+        onChange(evt: any): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IFloatLineComponentProps {
+        label: string;
+        target: any;
+        propertyName: string;
+        onChange?: (newValue: number) => void;
+        isInteger?: boolean;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        additionalClass?: string;
+        step?: string;
+        digits?: number;
+        globalState: GlobalState;
+        min?: number;
+        max?: number;
+        smallUI?: boolean;
+        onEnter?: (newValue: number) => void;
+    }
+    export class FloatLineComponent extends React.Component<IFloatLineComponentProps, {
+        value: string;
+    }> {
+        private _localChange;
+        private _store;
+        private _regExp;
+        private _onFocus;
+        constructor(props: IFloatLineComponentProps);
+        shouldComponentUpdate(nextProps: IFloatLineComponentProps, nextState: {
+            value: string;
+        }): boolean;
+        componentWillUnmount(): void;
+        raiseOnPropertyChanged(newValue: number, previousValue: number): void;
+        updateValue(valueString: string): void;
+        render(): JSX.Element;
+    }
+
+
+    interface ILineContainerComponentProps {
+        title: string;
+        children: any[] | any;
+        closed?: boolean;
+    }
+    export class LineContainerComponent extends React.Component<ILineContainerComponentProps, {
+        isExpanded: boolean;
+    }> {
+        constructor(props: ILineContainerComponentProps);
+        switchExpandedState(): void;
+        renderHeader(): JSX.Element;
+        render(): JSX.Element;
+    }
+
+
+    interface ILineWithFileButtonComponentProps {
+        title: string;
+        closed?: boolean;
+        label: string;
+        iconImage: any;
+        onIconClick: (file: File) => void;
+        accept: string;
+        uploadName?: string;
+    }
+    export class LineWithFileButtonComponent extends React.Component<ILineWithFileButtonComponentProps, {
+        isExpanded: boolean;
+    }> {
+        private _uploadRef;
+        constructor(props: ILineWithFileButtonComponentProps);
+        onChange(evt: any): void;
+        switchExpandedState(): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IMatrixLineComponentProps {
+        label: string;
+        target: any;
+        propertyName: string;
+        step?: number;
+        onChange?: (newValue: BABYLON.Matrix) => void;
+        onModeChange?: (mode: number) => void;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        mode?: number;
+        globalState: GlobalState;
+    }
+    export class MatrixLineComponent extends React.Component<IMatrixLineComponentProps, {
+        value: BABYLON.Matrix;
+        mode: number;
+        angle: number;
+    }> {
+        private _localChange;
+        constructor(props: IMatrixLineComponentProps);
+        shouldComponentUpdate(nextProps: IMatrixLineComponentProps, nextState: {
+            value: BABYLON.Matrix;
+            mode: number;
+            angle: number;
+        }): boolean;
+        raiseOnPropertyChanged(previousValue: BABYLON.Vector3): void;
+        updateMatrix(): void;
+        updateRow(value: BABYLON.Vector4, row: number): void;
+        updateBasedOnMode(value: number): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IMessageDialogComponentProps {
+        globalState: GlobalState;
+    }
+    export class MessageDialogComponent extends React.Component<IMessageDialogComponentProps, {
+        message: string;
+        isError: boolean;
+    }> {
+        constructor(props: IMessageDialogComponentProps);
+        render(): JSX.Element | null;
+    }
+
+
+    interface INumericInputComponentProps {
+        label: string;
+        value: number;
+        step?: number;
+        onChange: (value: number) => void;
+        globalState: GlobalState;
+    }
+    export class NumericInputComponent extends React.Component<INumericInputComponentProps, {
+        value: string;
+    }> {
+        static defaultProps: {
+            step: number;
+        };
+        private _localChange;
+        constructor(props: INumericInputComponentProps);
+        shouldComponentUpdate(nextProps: INumericInputComponentProps, nextState: {
+            value: string;
+        }): boolean;
+        updateValue(evt: any): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IOptionsLineComponentProps {
+        label: string;
+        target: any;
+        className?: string;
+        propertyName?: string;
+        options: BABYLON.IInspectableOptions[];
+        noDirectUpdate?: boolean;
+        onSelect?: (value: number | string) => void;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        valuesAreStrings?: boolean;
+        defaultIfNull?: number;
+        getSelection?: (target: any) => number;
+    }
+    export class OptionsLineComponent extends React.Component<IOptionsLineComponentProps, {
+        value: number | string;
+    }> {
+        private _localChange;
+        private _getValue;
+        constructor(props: IOptionsLineComponentProps);
+        setValue(value: string | number): void;
+        shouldComponentUpdate(nextProps: IOptionsLineComponentProps, nextState: {
+            value: number;
+        }): boolean;
+        raiseOnPropertyChanged(newValue: number | string, previousValue: number | string): void;
+        updateValue(valueString: string): void;
+        render(): JSX.Element;
+    }
+
+
+    export class Popup {
+        static CreatePopup(title: string, windowVariableName: string, width?: number, height?: number): HTMLDivElement | null;
+        static _CopyStyles(sourceDoc: HTMLDocument, targetDoc: HTMLDocument): void;
+    }
+
+
+    export class PropertyChangedEvent {
+        object: any;
+        property: string;
+        value: any;
+        initialValue: any;
+    }
+
+
+    interface ISliderLineComponentProps {
+        label: string;
+        target?: any;
+        propertyName?: string;
+        minimum: number;
+        maximum: number;
+        step: number;
+        directValue?: number;
+        useEuler?: boolean;
+        onChange?: (value: number) => void;
+        onInput?: (value: number) => void;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        decimalCount?: number;
+        globalState: GlobalState;
+    }
+    export class SliderLineComponent extends React.Component<ISliderLineComponentProps, {
+        value: number;
+    }> {
+        private _localChange;
+        constructor(props: ISliderLineComponentProps);
+        shouldComponentUpdate(nextProps: ISliderLineComponentProps, nextState: {
+            value: number;
+        }): boolean;
+        onChange(newValueString: any): void;
+        onInput(newValueString: any): void;
+        prepareDataToRead(value: number): number;
+        render(): JSX.Element;
+    }
+
+
+    interface ITextInputLineComponentProps {
+        label: string;
+        globalState: GlobalState;
+        target?: any;
+        propertyName?: string;
+        value?: string;
+        multilines?: boolean;
+        onChange?: (value: string) => void;
+        validator?: (value: string) => boolean;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class TextInputLineComponent extends React.Component<ITextInputLineComponentProps, {
+        value: string;
+    }> {
+        private _localChange;
+        private _onFocus;
+        constructor(props: ITextInputLineComponentProps);
+        shouldComponentUpdate(nextProps: ITextInputLineComponentProps, nextState: {
+            value: string;
+        }): boolean;
+        componentWillUnmount(): void;
+        raiseOnPropertyChanged(newValue: string, previousValue: string): void;
+        updateValue(value: string, raisePropertyChanged: boolean): void;
+        render(): JSX.Element;
+    }
+
+
+    interface ITextLineComponentProps {
+        label: string;
+        value: string;
+        color?: string;
+        underline?: boolean;
+        onLink?: () => void;
+    }
+    export class TextLineComponent extends React.Component<ITextLineComponentProps> {
+        constructor(props: ITextLineComponentProps);
+        onLink(): void;
+        renderContent(): JSX.Element;
+        render(): JSX.Element;
+    }
+
+
+    interface ITextureLineComponentProps {
+        texture: BABYLON.BaseTexture;
+        width: number;
+        height: number;
+        globalState?: any;
+        hideChannelSelect?: boolean;
+    }
+    export interface ITextureLineComponentState {
+        displayRed: boolean;
+        displayGreen: boolean;
+        displayBlue: boolean;
+        displayAlpha: boolean;
+        face: number;
+    }
+    export class TextureLineComponent extends React.Component<ITextureLineComponentProps, ITextureLineComponentState> {
+        private _canvasRef;
+        constructor(props: ITextureLineComponentProps);
+        shouldComponentUpdate(): boolean;
+        componentDidMount(): void;
+        componentDidUpdate(): void;
+        updatePreview(): void;
+        static UpdatePreview(previewCanvas: HTMLCanvasElement, texture: BABYLON.BaseTexture, width: number, options: ITextureLineComponentState, onReady?: () => void, globalState?: any): Promise<void>;
+        render(): JSX.Element;
+    }
+
+
+    interface IVector2LineComponentProps {
+        label: string;
+        target: any;
+        propertyName: string;
+        step?: number;
+        onChange?: (newvalue: BABYLON.Vector2) => void;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        globalState: GlobalState;
+    }
+    export class Vector2LineComponent extends React.Component<IVector2LineComponentProps, {
+        isExpanded: boolean;
+        value: BABYLON.Vector2;
+    }> {
+        static defaultProps: {
+            step: number;
+        };
+        private _localChange;
+        constructor(props: IVector2LineComponentProps);
+        shouldComponentUpdate(nextProps: IVector2LineComponentProps, nextState: {
+            isExpanded: boolean;
+            value: BABYLON.Vector2;
+        }): boolean;
+        switchExpandState(): void;
+        raiseOnPropertyChanged(previousValue: BABYLON.Vector2): void;
+        updateStateX(value: number): void;
+        updateStateY(value: number): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IVector3LineComponentProps {
+        label: string;
+        target: any;
+        propertyName: string;
+        step?: number;
+        onChange?: (newvalue: BABYLON.Vector3) => void;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        globalState: GlobalState;
+    }
+    export class Vector3LineComponent extends React.Component<IVector3LineComponentProps, {
+        isExpanded: boolean;
+        value: BABYLON.Vector3;
+    }> {
+        static defaultProps: {
+            step: number;
+        };
+        private _localChange;
+        constructor(props: IVector3LineComponentProps);
+        shouldComponentUpdate(nextProps: IVector3LineComponentProps, nextState: {
+            isExpanded: boolean;
+            value: BABYLON.Vector3;
+        }): boolean;
+        switchExpandState(): void;
+        raiseOnPropertyChanged(previousValue: BABYLON.Vector3): void;
+        updateVector3(): void;
+        updateStateX(value: number): void;
+        updateStateY(value: number): void;
+        updateStateZ(value: number): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IVector4LineComponentProps {
+        label: string;
+        target?: any;
+        propertyName?: string;
+        value?: BABYLON.Vector4;
+        step?: number;
+        onChange?: (newvalue: BABYLON.Vector4) => void;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        globalState: GlobalState;
+    }
+    export class Vector4LineComponent extends React.Component<IVector4LineComponentProps, {
+        isExpanded: boolean;
+        value: BABYLON.Vector4;
+    }> {
+        static defaultProps: {
+            step: number;
+        };
+        private _localChange;
+        constructor(props: IVector4LineComponentProps);
+        shouldComponentUpdate(nextProps: IVector4LineComponentProps, nextState: {
+            isExpanded: boolean;
+            value: BABYLON.Vector4;
+        }): boolean;
+        switchExpandState(): void;
+        raiseOnPropertyChanged(previousValue: BABYLON.Vector4): void;
+        updateVector4(): void;
+        updateStateX(value: number): void;
+        updateStateY(value: number): void;
+        updateStateZ(value: number): void;
+        updateStateW(value: number): void;
+        render(): JSX.Element;
+    }
+
+
+    export interface IColorComponentEntryProps {
+        value: number;
+        label: string;
+        max?: number;
+        min?: number;
+        onChange: (value: number) => void;
+        disabled?: boolean;
+    }
+    export class ColorComponentEntry extends React.Component<IColorComponentEntryProps> {
+        constructor(props: IColorComponentEntryProps);
+        updateValue(valueString: string): void;
+        render(): JSX.Element;
+    }
+
+
+    /**
+     * Interface used to specify creation options for color picker
+     */
+    export interface IColorPickerProps {
+        color: BABYLON.Color3 | BABYLON.Color4;
+        linearhint?: boolean;
+        debugMode?: boolean;
+        onColorChanged?: (color: BABYLON.Color3 | BABYLON.Color4) => void;
+    }
+    /**
+     * Interface used to specify creation options for color picker
+     */
+    export interface IColorPickerState {
+        color: BABYLON.Color3;
+        alpha: number;
+    }
+    /**
+     * Class used to create a color picker
+     */
+    export class ColorPicker extends React.Component<IColorPickerProps, IColorPickerState> {
+        private _saturationRef;
+        private _hueRef;
+        private _isSaturationPointerDown;
+        private _isHuePointerDown;
+        constructor(props: IColorPickerProps);
+        shouldComponentUpdate(nextProps: IColorPickerProps, nextState: IColorPickerState): boolean;
+        onSaturationPointerDown(evt: React.PointerEvent<HTMLDivElement>): void;
+        onSaturationPointerUp(evt: React.PointerEvent<HTMLDivElement>): void;
+        onSaturationPointerMove(evt: React.PointerEvent<HTMLDivElement>): void;
+        onHuePointerDown(evt: React.PointerEvent<HTMLDivElement>): void;
+        onHuePointerUp(evt: React.PointerEvent<HTMLDivElement>): void;
+        onHuePointerMove(evt: React.PointerEvent<HTMLDivElement>): void;
+        private _evaluateSaturation;
+        private _evaluateHue;
+        componentDidUpdate(): void;
+        raiseOnColorChanged(): void;
+        render(): JSX.Element;
+    }
+
+
+    export interface IHexColorProps {
+        value: string;
+        expectedLength: number;
+        onChange: (value: string) => void;
+    }
+    export class HexColor extends React.Component<IHexColorProps, {
+        hex: string;
+    }> {
+        constructor(props: IHexColorProps);
+        shouldComponentUpdate(nextProps: IHexColorProps, nextState: {
+            hex: string;
+        }): boolean;
+        updateHexValue(valueString: string): void;
+        render(): JSX.Element;
+    }
+
+
+    export interface IBooleanLineComponentProps {
+        label: string;
+        value: boolean;
+        icon?: string;
+        iconLabel?: string;
+    }
+    export class BooleanLineComponent extends React.Component<IBooleanLineComponentProps> {
+        constructor(props: IBooleanLineComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    export interface IButtonLineComponentProps {
+        label: string;
+        onClick: () => void;
+        icon?: string;
+        iconLabel?: string;
+    }
+    export class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {
+        constructor(props: IButtonLineComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    export interface ICheckBoxLineComponentProps {
+        label?: string;
+        target?: any;
+        propertyName?: string;
+        isSelected?: () => boolean;
+        onSelect?: (value: boolean) => void;
+        onValueChanged?: () => void;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        disabled?: boolean;
+        icon?: string;
+        iconLabel?: string;
+        faIcons?: {
+            enabled: any;
+            disabled: any;
+        };
+        large?: boolean;
+    }
+    export class CheckBoxLineComponent extends React.Component<ICheckBoxLineComponentProps, {
+        isSelected: boolean;
+        isDisabled?: boolean;
+        isConflict: boolean;
+    }> {
+        private _localChange;
+        constructor(props: ICheckBoxLineComponentProps);
+        shouldComponentUpdate(nextProps: ICheckBoxLineComponentProps, nextState: {
+            isSelected: boolean;
+            isDisabled: boolean;
+            isConflict: boolean;
+        }): boolean;
+        onChange(): void;
+        render(): JSX.Element;
+    }
+
+
+    export interface IColor3LineComponentProps {
+        label: string;
+        target: any;
+        propertyName: string;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        isLinear?: boolean;
+        icon?: string;
+        lockObject?: LockObject;
+        iconLabel?: string;
+        onValueChange?: (value: string) => void;
+    }
+    export class Color3LineComponent extends React.Component<IColor3LineComponentProps> {
+        render(): JSX.Element;
+    }
+
+
+    export interface IColor4LineComponentProps {
+        label: string;
+        target?: any;
+        propertyName: string;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        onChange?: () => void;
+        isLinear?: boolean;
+        icon?: string;
+        iconLabel?: string;
+        lockObject?: LockObject;
+    }
+    export class Color4LineComponent extends React.Component<IColor4LineComponentProps> {
+        render(): JSX.Element;
+    }
+
+
+    export interface IColorLineComponentProps {
+        label: string;
+        target?: any;
+        propertyName: string;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        onChange?: () => void;
+        isLinear?: boolean;
+        icon?: string;
+        iconLabel?: string;
+        lockObject?: LockObject;
+        disableAlpha?: boolean;
+    }
+    interface IColorLineComponentState {
+        isExpanded: boolean;
+        color: BABYLON.Color4;
+    }
+    export class ColorLineComponent extends React.Component<IColorLineComponentProps, IColorLineComponentState> {
+        constructor(props: IColorLineComponentProps);
+        shouldComponentUpdate(nextProps: IColorLineComponentProps, nextState: IColorLineComponentState): boolean;
+        getValue(props?: Readonly<IColorLineComponentProps> & Readonly<{
+            children?: React.ReactNode;
+        }>): BABYLON.Color4;
+        setColorFromString(colorString: string): void;
+        setColor(newColor: BABYLON.Color4): void;
+        switchExpandState(): void;
+        updateStateR(value: number): void;
+        updateStateG(value: number): void;
+        updateStateB(value: number): void;
+        updateStateA(value: number): void;
+        copyToClipboard(): void;
+        private _convertToColor;
+        private _toColor3;
+        render(): JSX.Element;
+    }
+
+
+    export interface IColorPickerComponentProps {
+        value: BABYLON.Color4 | BABYLON.Color3;
+        linearHint?: boolean;
+        onColorChanged: (newOne: string) => void;
+        icon?: string;
+        iconLabel?: string;
+        shouldPopRight?: boolean;
+    }
+    interface IColorPickerComponentState {
+        pickerEnabled: boolean;
+        color: BABYLON.Color3 | BABYLON.Color4;
+        hex: string;
+    }
+    export class ColorPickerLineComponent extends React.Component<IColorPickerComponentProps, IColorPickerComponentState> {
+        private _floatRef;
+        private _floatHostRef;
+        constructor(props: IColorPickerComponentProps);
+        syncPositions(): void;
+        shouldComponentUpdate(nextProps: IColorPickerComponentProps, nextState: IColorPickerComponentState): boolean;
+        getHexString(props?: Readonly<IColorPickerComponentProps> & Readonly<{
+            children?: React.ReactNode;
+        }>): string;
+        componentDidUpdate(): void;
+        componentDidMount(): void;
+        render(): JSX.Element;
+    }
+
+
+    export interface IButtonLineComponentProps {
+        data: string;
+        tooltip: string;
+    }
+    export class DraggableLineComponent extends React.Component<IButtonLineComponentProps> {
+        constructor(props: IButtonLineComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface IFileButtonLineComponentProps {
+        label: string;
+        onClick: (file: File) => void;
+        accept: string;
+        icon?: string;
+        iconLabel?: string;
+    }
+    export class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {
+        private static _IDGenerator;
+        private _id;
+        private _uploadInputRef;
+        constructor(props: IFileButtonLineComponentProps);
+        onChange(evt: any): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IFileMultipleButtonLineComponentProps {
+        label: string;
+        onClick: (event: any) => void;
+        accept: string;
+        icon?: string;
+        iconLabel?: string;
+    }
+    export class FileMultipleButtonLineComponent extends React.Component<IFileMultipleButtonLineComponentProps> {
+        private static _IDGenerator;
+        private _id;
+        private _uploadInputRef;
+        constructor(props: IFileMultipleButtonLineComponentProps);
+        onChange(evt: any): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IFloatLineComponentProps {
+        label: string;
+        target: any;
+        propertyName: string;
+        lockObject?: LockObject;
+        onChange?: (newValue: number) => void;
+        isInteger?: boolean;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        additionalClass?: string;
+        step?: string;
+        digits?: number;
+        useEuler?: boolean;
+        min?: number;
+        max?: number;
+        smallUI?: boolean;
+        onEnter?: (newValue: number) => void;
+        icon?: string;
+        iconLabel?: string;
+        defaultValue?: number;
+        arrows?: boolean;
+        unit?: React.ReactNode;
+        onDragStart?: (newValue: number) => void;
+        onDragStop?: (newValue: number) => void;
+    }
+    export class FloatLineComponent extends React.Component<IFloatLineComponentProps, {
+        value: string;
+        dragging: boolean;
+    }> {
+        private _localChange;
+        private _store;
+        constructor(props: IFloatLineComponentProps);
+        componentWillUnmount(): void;
+        getValueString(value: any): string;
+        shouldComponentUpdate(nextProps: IFloatLineComponentProps, nextState: {
+            value: string;
+            dragging: boolean;
+        }): boolean;
+        raiseOnPropertyChanged(newValue: number, previousValue: number): void;
+        updateValue(valueString: string): void;
+        lock(): void;
+        unlock(): void;
+        incrementValue(amount: number): void;
+        onKeyDown(event: React.KeyboardEvent): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IHexLineComponentProps {
+        label: string;
+        target: any;
+        propertyName: string;
+        lockObject?: LockObject;
+        onChange?: (newValue: number) => void;
+        isInteger?: boolean;
+        replaySourceReplacement?: string;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        additionalClass?: string;
+        step?: string;
+        digits?: number;
+        useEuler?: boolean;
+        min?: number;
+        icon?: string;
+        iconLabel?: string;
+    }
+    export class HexLineComponent extends React.Component<IHexLineComponentProps, {
+        value: string;
+    }> {
+        private _localChange;
+        private _store;
+        private _propertyChange;
+        constructor(props: IHexLineComponentProps);
+        componentWillUnmount(): void;
+        shouldComponentUpdate(nextProps: IHexLineComponentProps, nextState: {
+            value: string;
+        }): boolean;
+        raiseOnPropertyChanged(newValue: number, previousValue: number): void;
+        convertToHexString(valueString: string): string;
+        updateValue(valueString: string, raisePropertyChanged: boolean): void;
+        lock(): void;
+        unlock(): void;
+        render(): JSX.Element;
+    }
+
+
+    export interface IIconButtonLineComponentProps {
+        icon: string;
+        onClick: () => void;
+        tooltip: string;
+        active?: boolean;
+    }
+    export class IconButtonLineComponent extends React.Component<IIconButtonLineComponentProps> {
+        constructor(props: IIconButtonLineComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface IIconComponentProps {
+        icon: string;
+        label?: string;
+    }
+    export class IconComponent extends React.Component<IIconComponentProps> {
+        render(): JSX.Element;
+    }
+
+
+    interface IIndentedTextLineComponentProps {
+        value?: string;
+        color?: string;
+        underline?: boolean;
+        onLink?: () => void;
+        url?: string;
+        additionalClass?: string;
+    }
+    export class IndentedTextLineComponent extends React.Component<IIndentedTextLineComponentProps> {
+        constructor(props: IIndentedTextLineComponentProps);
+        onLink(): void;
+        renderContent(): JSX.Element;
+        render(): JSX.Element;
+    }
+
+
+    interface IInputArrowsComponentProps {
+        incrementValue: (amount: number) => void;
+        setDragging: (dragging: boolean) => void;
+    }
+    export class InputArrowsComponent extends React.Component<IInputArrowsComponentProps> {
+        private _arrowsRef;
+        private _drag;
+        private _releaseListener;
+        private _lockChangeListener;
+        render(): JSX.Element;
+    }
+
+
+    export interface ISelectedLineContainer {
+        selectedLineContainerTitles: Array<string>;
+        selectedLineContainerTitlesNoFocus: Array<string>;
+    }
+
+
+    interface ILineContainerComponentProps {
+        selection?: ISelectedLineContainer;
+        title: string;
+        children: any[] | any;
+        closed?: boolean;
+    }
+    export class LineContainerComponent extends React.Component<ILineContainerComponentProps, {
+        isExpanded: boolean;
+        isHighlighted: boolean;
+    }> {
+        constructor(props: ILineContainerComponentProps);
+        switchExpandedState(): void;
+        renderHeader(): JSX.Element;
+        componentDidMount(): void;
+        render(): JSX.Element;
+    }
+
+
+    interface ILinkButtonComponentProps {
+        label: string;
+        buttonLabel: string;
+        url?: string;
+        onClick: () => void;
+        icon?: any;
+        onIconClick?: () => void;
+    }
+    export class LinkButtonComponent extends React.Component<ILinkButtonComponentProps> {
+        constructor(props: ILinkButtonComponentProps);
+        onLink(): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IMessageLineComponentProps {
+        text: string;
+        color?: string;
+        icon?: any;
+    }
+    export class MessageLineComponent extends React.Component<IMessageLineComponentProps> {
+        constructor(props: IMessageLineComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface INumericInputComponentProps {
+        label: string;
+        value: number;
+        step?: number;
+        onChange: (value: number) => void;
+        precision?: number;
+        icon?: string;
+        iconLabel?: string;
+    }
+    export class NumericInputComponent extends React.Component<INumericInputComponentProps, {
+        value: string;
+    }> {
+        static defaultProps: {
+            step: number;
+        };
+        private _localChange;
+        constructor(props: INumericInputComponentProps);
+        shouldComponentUpdate(nextProps: INumericInputComponentProps, nextState: {
+            value: string;
+        }): boolean;
+        updateValue(evt: any): void;
+        onBlur(): void;
+        render(): JSX.Element;
+    }
+
+
+    export var Null_Value: number;
+    export interface IOptionsLineComponentProps {
+        label: string;
+        target: any;
+        propertyName: string;
+        options: BABYLON.IInspectableOptions[];
+        noDirectUpdate?: boolean;
+        onSelect?: (value: number) => void;
+        extractValue?: () => number;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        allowNullValue?: boolean;
+        icon?: string;
+        iconLabel?: string;
+    }
+    export class OptionsLineComponent extends React.Component<IOptionsLineComponentProps, {
+        value: number;
+    }> {
+        private _localChange;
+        private _remapValueIn;
+        private _remapValueOut;
+        constructor(props: IOptionsLineComponentProps);
+        shouldComponentUpdate(nextProps: IOptionsLineComponentProps, nextState: {
+            value: number;
+        }): boolean;
+        raiseOnPropertyChanged(newValue: number, previousValue: number): void;
+        updateValue(valueString: string): void;
+        render(): JSX.Element;
+    }
+
+
+    export class Popup {
+        static CreatePopup(title: string, windowVariableName: string, width?: number, height?: number): HTMLDivElement | null;
+        private static _CopyStyles;
+    }
+
+
+    interface IRadioButtonLineComponentProps {
+        onSelectionChangedObservable: BABYLON.Observable<RadioButtonLineComponent>;
+        label: string;
+        isSelected: () => boolean;
+        onSelect: () => void;
+        icon?: string;
+        iconLabel?: string;
+    }
+    export class RadioButtonLineComponent extends React.Component<IRadioButtonLineComponentProps, {
+        isSelected: boolean;
+    }> {
+        private _onSelectionChangedObserver;
+        constructor(props: IRadioButtonLineComponentProps);
+        componentDidMount(): void;
+        componentWillUnmount(): void;
+        onChange(): void;
+        render(): JSX.Element;
+    }
+
+
+    interface ISliderLineComponentProps {
+        label: string;
+        target?: any;
+        propertyName?: string;
+        minimum: number;
+        maximum: number;
+        step: number;
+        directValue?: number;
+        useEuler?: boolean;
+        onChange?: (value: number) => void;
+        onInput?: (value: number) => void;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        decimalCount?: number;
+        margin?: boolean;
+        icon?: string;
+        iconLabel?: string;
+        lockObject?: LockObject;
+        unit?: React.ReactNode;
+    }
+    export class SliderLineComponent extends React.Component<ISliderLineComponentProps, {
+        value: number;
+    }> {
+        private _localChange;
+        constructor(props: ISliderLineComponentProps);
+        shouldComponentUpdate(nextProps: ISliderLineComponentProps, nextState: {
+            value: number;
+        }): boolean;
+        onChange(newValueString: any): void;
+        onInput(newValueString: any): void;
+        prepareDataToRead(value: number): number;
+        render(): JSX.Element;
+    }
+
+
+    export const conflictingValuesPlaceholder = "\u2014";
+    /**
+     *
+     * @param targets a list of selected targets
+     * @param onPropertyChangedObservable
+     * @param getProperty
+     * @returns a proxy object that can be passed as a target into the input
+     */
+    export function makeTargetsProxy<Type>(targets: Type[], onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>, getProperty?: (target: Type, property: keyof Type) => any): any;
+
+
+    export interface ITextInputLineComponentProps {
+        label?: string;
+        lockObject?: LockObject;
+        target?: any;
+        propertyName?: string;
+        value?: string;
+        onChange?: (value: string) => void;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        icon?: string;
+        iconLabel?: string;
+        noUnderline?: boolean;
+        numbersOnly?: boolean;
+        delayInput?: boolean;
+        arrows?: boolean;
+        arrowsIncrement?: (amount: number) => void;
+        step?: number;
+        numeric?: boolean;
+        roundValues?: boolean;
+        min?: number;
+        max?: number;
+        placeholder?: string;
+        unit?: React.ReactNode;
+    }
+    export class TextInputLineComponent extends React.Component<ITextInputLineComponentProps, {
+        value: string;
+        dragging: boolean;
+    }> {
+        private _localChange;
+        constructor(props: ITextInputLineComponentProps);
+        componentWillUnmount(): void;
+        shouldComponentUpdate(nextProps: ITextInputLineComponentProps, nextState: {
+            value: string;
+            dragging: boolean;
+        }): boolean;
+        raiseOnPropertyChanged(newValue: string, previousValue: string): void;
+        getCurrentNumericValue(value: string): number;
+        updateValue(value: string): void;
+        incrementValue(amount: number): void;
+        onKeyDown(event: React.KeyboardEvent): void;
+        render(): JSX.Element;
+    }
+
+
+    interface ITextLineComponentProps {
+        label?: string;
+        value?: string;
+        color?: string;
+        underline?: boolean;
+        onLink?: () => void;
+        url?: string;
+        ignoreValue?: boolean;
+        additionalClass?: string;
+        icon?: string;
+        iconLabel?: string;
+        tooltip?: string;
+    }
+    export class TextLineComponent extends React.Component<ITextLineComponentProps> {
+        constructor(props: ITextLineComponentProps);
+        onLink(): void;
+        renderContent(): JSX.Element | null;
+        render(): JSX.Element;
+    }
+
+
+    /// <reference types="react" />
+    interface IUnitButtonProps {
+        unit: string;
+        locked?: boolean;
+        onClick?: (unit: string) => void;
+    }
+    export function UnitButton(props: IUnitButtonProps): JSX.Element;
+
+
+    interface IValueLineComponentProps {
+        label: string;
+        value: number;
+        color?: string;
+        fractionDigits?: number;
+        units?: string;
+        icon?: string;
+        iconLabel?: string;
+    }
+    export class ValueLineComponent extends React.Component<IValueLineComponentProps> {
+        constructor(props: IValueLineComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface IVector2LineComponentProps {
+        label: string;
+        target: any;
+        propertyName: string;
+        step?: number;
+        onChange?: (newvalue: BABYLON.Vector2) => void;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        icon?: string;
+        iconLabel?: string;
+    }
+    export class Vector2LineComponent extends React.Component<IVector2LineComponentProps, {
+        isExpanded: boolean;
+        value: BABYLON.Vector2;
+    }> {
+        static defaultProps: {
+            step: number;
+        };
+        private _localChange;
+        constructor(props: IVector2LineComponentProps);
+        shouldComponentUpdate(nextProps: IVector2LineComponentProps, nextState: {
+            isExpanded: boolean;
+            value: BABYLON.Vector2;
+        }): boolean;
+        switchExpandState(): void;
+        raiseOnPropertyChanged(previousValue: BABYLON.Vector2): void;
+        updateStateX(value: number): void;
+        updateStateY(value: number): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IVector3LineComponentProps {
+        label: string;
+        target: any;
+        propertyName: string;
+        step?: number;
+        onChange?: (newvalue: BABYLON.Vector3) => void;
+        useEuler?: boolean;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        noSlider?: boolean;
+        icon?: string;
+        iconLabel?: string;
+    }
+    export class Vector3LineComponent extends React.Component<IVector3LineComponentProps, {
+        isExpanded: boolean;
+        value: BABYLON.Vector3;
+    }> {
+        static defaultProps: {
+            step: number;
+        };
+        private _localChange;
+        constructor(props: IVector3LineComponentProps);
+        getCurrentValue(): any;
+        shouldComponentUpdate(nextProps: IVector3LineComponentProps, nextState: {
+            isExpanded: boolean;
+            value: BABYLON.Vector3;
+        }): boolean;
+        switchExpandState(): void;
+        raiseOnPropertyChanged(previousValue: BABYLON.Vector3): void;
+        updateVector3(): void;
+        updateStateX(value: number): void;
+        updateStateY(value: number): void;
+        updateStateZ(value: number): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IVector4LineComponentProps {
+        label: string;
+        target: any;
+        propertyName: string;
+        step?: number;
+        onChange?: (newvalue: BABYLON.Vector4) => void;
+        useEuler?: boolean;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+        icon?: string;
+        iconLabel?: string;
+    }
+    export class Vector4LineComponent extends React.Component<IVector4LineComponentProps, {
+        isExpanded: boolean;
+        value: BABYLON.Vector4;
+    }> {
+        static defaultProps: {
+            step: number;
+        };
+        private _localChange;
+        constructor(props: IVector4LineComponentProps);
+        getCurrentValue(): any;
+        shouldComponentUpdate(nextProps: IVector4LineComponentProps, nextState: {
+            isExpanded: boolean;
+            value: BABYLON.Vector4;
+        }): boolean;
+        switchExpandState(): void;
+        raiseOnPropertyChanged(previousValue: BABYLON.Vector4): void;
+        updateVector4(): void;
+        updateStateX(value: number): void;
+        updateStateY(value: number): void;
+        updateStateZ(value: number): void;
+        updateStateW(value: number): void;
+        render(): JSX.Element;
+    }
+
+
+    export class PropertyChangedEvent {
+        object: any;
+        property: string;
+        value: any;
+        initialValue: any;
+        allowNullValue?: boolean;
+    }
+
+
+    export class StringTools {
+        private static _SaveAs;
+        private static _Click;
+        /**
+         * Download a string into a file that will be saved locally by the browser
+         * @param document
+         * @param content defines the string to download locally as a file
+         * @param filename
+         */
+        static DownloadAsFile(document: HTMLDocument, content: string, filename: string): void;
+    }
+
+
+    interface ICheckboxPropertyGridComponentProps {
+        checkbox: BABYLON.GUI.Checkbox;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class CheckboxPropertyGridComponent extends React.Component<ICheckboxPropertyGridComponentProps> {
+        constructor(props: ICheckboxPropertyGridComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface IColorPickerPropertyGridComponentProps {
+        colorPicker: BABYLON.GUI.ColorPicker;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class ColorPickerPropertyGridComponent extends React.Component<IColorPickerPropertyGridComponentProps> {
+        constructor(props: IColorPickerPropertyGridComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface ICommonControlPropertyGridComponentProps {
+        controls?: BABYLON.GUI.Control[];
+        control?: BABYLON.GUI.Control;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class CommonControlPropertyGridComponent extends React.Component<ICommonControlPropertyGridComponentProps> {
+        constructor(props: ICommonControlPropertyGridComponentProps);
+        renderGridInformation(control: BABYLON.GUI.Control): JSX.Element | null;
+        render(): JSX.Element | undefined;
+    }
+
+
+    interface IControlPropertyGridComponentProps {
+        control: BABYLON.GUI.Control;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class ControlPropertyGridComponent extends React.Component<IControlPropertyGridComponentProps> {
+        constructor(props: IControlPropertyGridComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface IEllipsePropertyGridComponentProps {
+        ellipse: BABYLON.GUI.Ellipse;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class EllipsePropertyGridComponent extends React.Component<IEllipsePropertyGridComponentProps> {
+        constructor(props: IEllipsePropertyGridComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface IGridPropertyGridComponentProps {
+        grid: BABYLON.GUI.Grid;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class GridPropertyGridComponent extends React.Component<IGridPropertyGridComponentProps> {
+        constructor(props: IGridPropertyGridComponentProps);
+        renderRows(): JSX.Element[];
+        renderColumns(): JSX.Element[];
+        render(): JSX.Element;
+    }
+
+
+    interface IImageBasedSliderPropertyGridComponentProps {
+        imageBasedSlider: BABYLON.GUI.ImageBasedSlider;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class ImageBasedSliderPropertyGridComponent extends React.Component<IImageBasedSliderPropertyGridComponentProps> {
+        constructor(props: IImageBasedSliderPropertyGridComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface IImagePropertyGridComponentProps {
+        image: BABYLON.GUI.Image;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class ImagePropertyGridComponent extends React.Component<IImagePropertyGridComponentProps> {
+        constructor(props: IImagePropertyGridComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface IInputTextPropertyGridComponentProps {
+        inputText: BABYLON.GUI.InputText;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class InputTextPropertyGridComponent extends React.Component<IInputTextPropertyGridComponentProps> {
+        constructor(props: IInputTextPropertyGridComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface ILinePropertyGridComponentProps {
+        line: BABYLON.GUI.Line;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class LinePropertyGridComponent extends React.Component<ILinePropertyGridComponentProps> {
+        constructor(props: ILinePropertyGridComponentProps);
+        onDashChange(value: string): void;
+        render(): JSX.Element;
+    }
+
+
+    interface IRadioButtonPropertyGridComponentProps {
+        radioButtons: BABYLON.GUI.RadioButton[];
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class RadioButtonPropertyGridComponent extends React.Component<IRadioButtonPropertyGridComponentProps> {
+        constructor(props: IRadioButtonPropertyGridComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface IRectanglePropertyGridComponentProps {
+        rectangle: BABYLON.GUI.Rectangle;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class RectanglePropertyGridComponent extends React.Component<IRectanglePropertyGridComponentProps> {
+        constructor(props: IRectanglePropertyGridComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface IScrollViewerPropertyGridComponentProps {
+        scrollViewer: BABYLON.GUI.ScrollViewer;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class ScrollViewerPropertyGridComponent extends React.Component<IScrollViewerPropertyGridComponentProps> {
+        constructor(props: IScrollViewerPropertyGridComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface ISliderPropertyGridComponentProps {
+        slider: BABYLON.GUI.Slider;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class SliderPropertyGridComponent extends React.Component<ISliderPropertyGridComponentProps> {
+        constructor(props: ISliderPropertyGridComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface IStackPanelPropertyGridComponentProps {
+        stackPanel: BABYLON.GUI.StackPanel;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class StackPanelPropertyGridComponent extends React.Component<IStackPanelPropertyGridComponentProps> {
+        constructor(props: IStackPanelPropertyGridComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    interface ITextBlockPropertyGridComponentProps {
+        textBlock: BABYLON.GUI.TextBlock;
+        lockObject: LockObject;
+        onPropertyChangedObservable?: BABYLON.Observable<PropertyChangedEvent>;
+    }
+    export class TextBlockPropertyGridComponent extends React.Component<ITextBlockPropertyGridComponentProps> {
+        constructor(props: ITextBlockPropertyGridComponentProps);
+        render(): JSX.Element;
+    }
+
+
+    /**
+     * Class used to provide lock mechanism
+     */
+    export class LockObject {
+        /**
+         * Gets or set if the lock is engaged
+         */
+        lock: boolean;
+    }
+
+
+
+}
+
+
+