@babylonjs/node-editor 5.0.0-alpha.9 → 5.0.0-beta.1

package/babylon.nodeEditor.module.d.ts

@@ -21,6 +21,7 @@ declare module "@babylonjs/node-editor/blockTools" {
     import { ModBlock } from '@babylonjs/core/Materials/Node/Blocks/modBlock';
     import { ScaleBlock } from '@babylonjs/core/Materials/Node/Blocks/scaleBlock';
     import { TrigonometryBlock } from '@babylonjs/core/Materials/Node/Blocks/trigonometryBlock';
+    import { ConditionalBlock } from '@babylonjs/core/Materials/Node/Blocks/conditionalBlock';
     import { ClampBlock } from '@babylonjs/core/Materials/Node/Blocks/clampBlock';
     import { CrossBlock } from '@babylonjs/core/Materials/Node/Blocks/crossBlock';
     import { DotBlock } from '@babylonjs/core/Materials/Node/Blocks/dotBlock';
@@ -76,8 +77,15 @@ declare module "@babylonjs/node-editor/blockTools" {
     import { ParticleBlendMultiplyBlock } from '@babylonjs/core/Materials/Node/Blocks/Particle/particleBlendMultiplyBlock';
     import { FragCoordBlock } from '@babylonjs/core/Materials/Node/Blocks/Fragment/fragCoordBlock';
     import { ScreenSizeBlock } from '@babylonjs/core/Materials/Node/Blocks/Fragment/screenSizeBlock';
+    import { MatrixBuilderBlock } from '@babylonjs/core/Materials/Node/Blocks/matrixBuilderBlock';
+    import { SceneDepthBlock } from '@babylonjs/core/Materials/Node/Blocks/Dual/sceneDepthBlock';
+    import { ImageSourceBlock } from '@babylonjs/core/Materials/Node/Blocks/Dual/imageSourceBlock';
+    import { CloudBlock } from '@babylonjs/core/Materials/Node/Blocks/cloudBlock';
+    import { VoronoiNoiseBlock } from '@babylonjs/core/Materials/Node/Blocks/voronoiNoiseBlock';
+    import { ScreenSpaceBlock } from '@babylonjs/core/Materials/Node/Blocks/Fragment/screenSpaceBlock';
+    import { TwirlBlock } from '@babylonjs/core/Materials/Node/Blocks/Fragment/twirlBlock';
     export class BlockTools {
-        static GetBlockFromString(data: string, scene: Scene, nodeMaterial: NodeMaterial): DesaturateBlock | RefractBlock | ReflectBlock | DerivativeBlock | Rotate2dBlock | NormalBlendBlock | WorleyNoise3DBlock | SimplexPerlin3DBlock | BonesBlock | InstancesBlock | MorphTargetsBlock | DiscardBlock | ImageProcessingBlock | ColorMergerBlock | VectorMergerBlock | ColorSplitterBlock | VectorSplitterBlock | TextureBlock | ReflectionTextureBlock | LightBlock | FogBlock | VertexOutputBlock | FragmentOutputBlock | AddBlock | ClampBlock | ScaleBlock | CrossBlock | DotBlock | PowBlock | MultiplyBlock | TransformBlock | TrigonometryBlock | RemapBlock | NormalizeBlock | FresnelBlock | LerpBlock | NLerpBlock | DivideBlock | SubtractBlock | ModBlock | StepBlock | SmoothStepBlock | OneMinusBlock | ReciprocalBlock | ViewDirectionBlock | LightInformationBlock | MaxBlock | MinBlock | LengthBlock | DistanceBlock | NegateBlock | PerturbNormalBlock | RandomNumberBlock | ReplaceColorBlock | PosterizeBlock | ArcTan2Block | GradientBlock | FrontFacingBlock | WaveBlock | InputBlock | PBRMetallicRoughnessBlock | SheenBlock | AnisotropyBlock | ReflectionBlock | ClearCoatBlock | RefractionBlock | SubSurfaceBlock | CurrentScreenBlock | ParticleTextureBlock | ParticleRampGradientBlock | ParticleBlendMultiplyBlock | FragCoordBlock | ScreenSizeBlock | null;
+        static GetBlockFromString(data: string, scene: Scene, nodeMaterial: NodeMaterial): TwirlBlock | VoronoiNoiseBlock | ScreenSpaceBlock | CloudBlock | MatrixBuilderBlock | DesaturateBlock | RefractBlock | ReflectBlock | DerivativeBlock | Rotate2dBlock | NormalBlendBlock | WorleyNoise3DBlock | SimplexPerlin3DBlock | BonesBlock | InstancesBlock | MorphTargetsBlock | DiscardBlock | ImageProcessingBlock | ColorMergerBlock | VectorMergerBlock | ColorSplitterBlock | VectorSplitterBlock | TextureBlock | ReflectionTextureBlock | LightBlock | FogBlock | VertexOutputBlock | FragmentOutputBlock | AddBlock | ClampBlock | ScaleBlock | CrossBlock | DotBlock | PowBlock | MultiplyBlock | TransformBlock | TrigonometryBlock | RemapBlock | NormalizeBlock | FresnelBlock | LerpBlock | NLerpBlock | DivideBlock | SubtractBlock | ModBlock | StepBlock | SmoothStepBlock | OneMinusBlock | ReciprocalBlock | ViewDirectionBlock | LightInformationBlock | MaxBlock | MinBlock | LengthBlock | DistanceBlock | NegateBlock | PerturbNormalBlock | RandomNumberBlock | ReplaceColorBlock | PosterizeBlock | ArcTan2Block | GradientBlock | FrontFacingBlock | WaveBlock | InputBlock | PBRMetallicRoughnessBlock | SheenBlock | AnisotropyBlock | ReflectionBlock | ClearCoatBlock | RefractionBlock | SubSurfaceBlock | CurrentScreenBlock | ParticleTextureBlock | ParticleRampGradientBlock | ParticleBlendMultiplyBlock | FragCoordBlock | ScreenSizeBlock | SceneDepthBlock | ConditionalBlock | ImageSourceBlock | null;
         static GetColorFromConnectionNodeType(type: NodeMaterialBlockConnectionPointTypes): string;
         static GetConnectionNodeTypeFromString(type: string): NodeMaterialBlockConnectionPointTypes.Float | NodeMaterialBlockConnectionPointTypes.Vector2 | NodeMaterialBlockConnectionPointTypes.Vector3 | NodeMaterialBlockConnectionPointTypes.Vector4 | NodeMaterialBlockConnectionPointTypes.Color3 | NodeMaterialBlockConnectionPointTypes.Color4 | NodeMaterialBlockConnectionPointTypes.Matrix | NodeMaterialBlockConnectionPointTypes.AutoDetect;
         static GetStringFromConnectionNodeType(type: NodeMaterialBlockConnectionPointTypes): "Float" | "Vector2" | "Vector3" | "Vector4" | "Matrix" | "Color3" | "Color4" | "";
@@ -357,6 +365,7 @@ declare module "@babylonjs/node-editor/diagram/graphFrame" {
         private serializePortData;
         serialize(saveCollapsedState: boolean): IFrameData;
         export(): void;
+        adjustPorts(): void;
         static Parse(serializationData: IFrameData, canvas: GraphCanvasComponent, map?: {
             [key: number]: number;
         }): GraphFrame;
@@ -420,8 +429,8 @@ declare module "@babylonjs/node-editor/diagram/nodeLink" {
         onDisposedObservable: Observable<NodeLink>;
         get isVisible(): boolean;
         set isVisible(value: boolean);
-        get portA(): FrameNodePort | NodePort;
-        get portB(): FrameNodePort | NodePort | undefined;
+        get portA(): NodePort | FrameNodePort;
+        get portB(): NodePort | FrameNodePort | undefined;
         get nodeA(): GraphNode;
         get nodeB(): GraphNode | undefined;
         update(endX?: number, endY?: number, straight?: boolean): void;
@@ -433,12 +442,12 @@ declare module "@babylonjs/node-editor/diagram/nodeLink" {
 declare module "@babylonjs/node-editor/diagram/graphCanvas" {
     import * as React from "react";
     import { GlobalState } from "@babylonjs/node-editor/globalState";
-    import { NodeMaterialBlock } from '@babylonjs/core/Materials/Node/nodeMaterialBlock';
+    import { NodeMaterialBlock } from "@babylonjs/core/Materials/Node/nodeMaterialBlock";
     import { GraphNode } from "@babylonjs/node-editor/diagram/graphNode";
-    import { Nullable } from '@babylonjs/core/types';
+    import { Nullable } from "@babylonjs/core/types";
     import { NodeLink } from "@babylonjs/node-editor/diagram/nodeLink";
     import { NodePort } from "@babylonjs/node-editor/diagram/nodePort";
-    import { NodeMaterialConnectionPoint } from '@babylonjs/core/Materials/Node/nodeMaterialBlockConnectionPoint';
+    import { NodeMaterialConnectionPoint } from "@babylonjs/core/Materials/Node/nodeMaterialBlockConnectionPoint";
     import { GraphFrame } from "@babylonjs/node-editor/diagram/graphFrame";
     import { IEditorData, IFrameData } from "@babylonjs/node-editor/nodeLocationInfo";
     import { FrameNodePort } from "@babylonjs/node-editor/diagram/frameNodePort";
@@ -509,6 +518,7 @@ declare module "@babylonjs/node-editor/diagram/graphCanvas" {
         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;
@@ -566,10 +576,12 @@ declare module "@babylonjs/node-editor/sharedComponents/floatLineComponent" {
         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;
@@ -578,7 +590,7 @@ declare module "@babylonjs/node-editor/sharedComponents/floatLineComponent" {
 declare module "@babylonjs/node-editor/components/propertyTab/properties/floatPropertyTabComponent" {
     import * as React from "react";
     import { GlobalState } from "@babylonjs/node-editor/globalState";
-    import { InputBlock } from '@babylonjs/core/Materials/Node/Blocks/Input/inputBlock';
+    import { InputBlock } from "@babylonjs/core/Materials/Node/Blocks/Input/inputBlock";
     interface IFloatPropertyTabComponentProps {
         globalState: GlobalState;
         inputBlock: InputBlock;
@@ -684,7 +696,7 @@ declare module "@babylonjs/node-editor/sharedComponents/vector2LineComponent" {
 declare module "@babylonjs/node-editor/components/propertyTab/properties/vector2PropertyTabComponent" {
     import * as React from "react";
     import { GlobalState } from "@babylonjs/node-editor/globalState";
-    import { InputBlock } from '@babylonjs/core/Materials/Node/Blocks/Input/inputBlock';
+    import { InputBlock } from "@babylonjs/core/Materials/Node/Blocks/Input/inputBlock";
     interface IVector2PropertyTabComponentProps {
         globalState: GlobalState;
         inputBlock: InputBlock;
@@ -734,6 +746,7 @@ declare module "@babylonjs/node-editor/sharedUiComponents/colorPicker/colorPicke
      */
     export interface IColorPickerProps {
         color: Color3 | Color4;
+        linearhint?: boolean;
         debugMode?: boolean;
         onColorChanged?: (color: Color3 | Color4) => void;
     }
@@ -753,6 +766,7 @@ declare module "@babylonjs/node-editor/sharedUiComponents/colorPicker/colorPicke
         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;
@@ -768,7 +782,7 @@ declare module "@babylonjs/node-editor/sharedUiComponents/colorPicker/colorPicke
 }
 declare module "@babylonjs/node-editor/sharedComponents/colorPickerComponent" {
     import * as React from "react";
-    import { Color4, Color3 } from '@babylonjs/core/Maths/math.color';
+    import { Color4, Color3 } from "@babylonjs/core/Maths/math.color";
     import { GlobalState } from "@babylonjs/node-editor/globalState";
     export interface IColorPickerComponentProps {
         value: Color4 | Color3;
@@ -795,7 +809,7 @@ declare module "@babylonjs/node-editor/sharedComponents/colorPickerComponent" {
 declare module "@babylonjs/node-editor/sharedComponents/color3LineComponent" {
     import * as React from "react";
     import { Observable } from "@babylonjs/core/Misc/observable";
-    import { Color3 } from "@babylonjs/core/Maths/math.color";
+    import { Color3, Color4 } from "@babylonjs/core/Maths/math.color";
     import { PropertyChangedEvent } from "@babylonjs/node-editor/sharedComponents/propertyChangedEvent";
     import { GlobalState } from "@babylonjs/node-editor/globalState";
     export interface IColor3LineComponentProps {
@@ -808,16 +822,16 @@ declare module "@babylonjs/node-editor/sharedComponents/color3LineComponent" {
     }
     export class Color3LineComponent extends React.Component<IColor3LineComponentProps, {
         isExpanded: boolean;
-        color: Color3;
+        color: Color3 | Color4;
     }> {
         private _localChange;
         constructor(props: IColor3LineComponentProps);
         shouldComponentUpdate(nextProps: IColor3LineComponentProps, nextState: {
-            color: Color3;
+            color: Color3 | Color4;
         }): boolean;
         onChange(newValue: string): void;
         switchExpandState(): void;
-        raiseOnPropertyChanged(previousValue: Color3): void;
+        raiseOnPropertyChanged(previousValue: Color3 | Color4): void;
         updateStateR(value: number): void;
         updateStateG(value: number): void;
         updateStateB(value: number): void;
@@ -828,7 +842,7 @@ declare module "@babylonjs/node-editor/sharedComponents/color3LineComponent" {
 declare module "@babylonjs/node-editor/components/propertyTab/properties/color3PropertyTabComponent" {
     import * as React from "react";
     import { GlobalState } from "@babylonjs/node-editor/globalState";
-    import { InputBlock } from '@babylonjs/core/Materials/Node/Blocks/Input/inputBlock';
+    import { InputBlock } from "@babylonjs/core/Materials/Node/Blocks/Input/inputBlock";
     interface IColor3PropertyTabComponentProps {
         globalState: GlobalState;
         inputBlock: InputBlock;
@@ -877,7 +891,7 @@ declare module "@babylonjs/node-editor/sharedComponents/vector3LineComponent" {
 declare module "@babylonjs/node-editor/components/propertyTab/properties/vector3PropertyTabComponent" {
     import * as React from "react";
     import { GlobalState } from "@babylonjs/node-editor/globalState";
-    import { InputBlock } from '@babylonjs/core/Materials/Node/Blocks/Input/inputBlock';
+    import { InputBlock } from "@babylonjs/core/Materials/Node/Blocks/Input/inputBlock";
     interface IVector3PropertyTabComponentProps {
         globalState: GlobalState;
         inputBlock: InputBlock;
@@ -928,7 +942,7 @@ declare module "@babylonjs/node-editor/sharedComponents/vector4LineComponent" {
 declare module "@babylonjs/node-editor/components/propertyTab/properties/vector4PropertyTabComponent" {
     import * as React from "react";
     import { GlobalState } from "@babylonjs/node-editor/globalState";
-    import { InputBlock } from '@babylonjs/core/Materials/Node/Blocks/Input/inputBlock';
+    import { InputBlock } from "@babylonjs/core/Materials/Node/Blocks/Input/inputBlock";
     interface IVector4PropertyTabComponentProps {
         globalState: GlobalState;
         inputBlock: InputBlock;
@@ -941,16 +955,13 @@ declare module "@babylonjs/node-editor/sharedComponents/optionsLineComponent" {
     import * as React from "react";
     import { Observable } from "@babylonjs/core/Misc/observable";
     import { PropertyChangedEvent } from "@babylonjs/node-editor/sharedComponents/propertyChangedEvent";
-    class ListLineOption {
-        label: string;
-        value: number | string;
-    }
+    import { IInspectableOptions } from "@babylonjs/core/Misc/iInspectable";
     interface IOptionsLineComponentProps {
         label: string;
         target: any;
         className?: string;
         propertyName?: string;
-        options: ListLineOption[];
+        options: IInspectableOptions[];
         noDirectUpdate?: boolean;
         onSelect?: (value: number | string) => void;
         onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
@@ -1012,7 +1023,7 @@ declare module "@babylonjs/node-editor/sharedComponents/matrixLineComponent" {
 declare module "@babylonjs/node-editor/components/propertyTab/properties/matrixPropertyTabComponent" {
     import * as React from "react";
     import { GlobalState } from "@babylonjs/node-editor/globalState";
-    import { InputBlock } from '@babylonjs/core/Materials/Node/Blocks/Input/inputBlock';
+    import { InputBlock } from "@babylonjs/core/Materials/Node/Blocks/Input/inputBlock";
     interface IMatrixPropertyTabComponentProps {
         globalState: GlobalState;
         inputBlock: InputBlock;
@@ -1065,10 +1076,12 @@ declare module "@babylonjs/node-editor/sharedComponents/textInputLineComponent"
         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;
@@ -1123,6 +1136,7 @@ declare module "@babylonjs/node-editor/sharedComponents/checkBoxLineComponent" {
 declare module "@babylonjs/node-editor/diagram/properties/genericNodePropertyComponent" {
     import * as React from "react";
     import { IPropertyComponentProps } from "@babylonjs/node-editor/diagram/properties/propertyComponentProps";
+    import { Scene } from "@babylonjs/core/scene";
     export class GenericPropertyComponent extends React.Component<IPropertyComponentProps> {
         constructor(props: IPropertyComponentProps);
         render(): JSX.Element;
@@ -1134,8 +1148,10 @@ declare module "@babylonjs/node-editor/diagram/properties/genericNodePropertyCom
     export class GenericPropertyTabComponent extends React.Component<IPropertyComponentProps> {
         constructor(props: IPropertyComponentProps);
         forceRebuild(notifiers?: {
-            "rebuild"?: boolean;
-            "update"?: boolean;
+            rebuild?: boolean;
+            update?: boolean;
+            activatePreviewCommand?: boolean;
+            callback?: (scene: Scene) => void;
         }): void;
         render(): JSX.Element;
     }
@@ -1177,7 +1193,7 @@ declare module "@babylonjs/node-editor/sharedComponents/color4LineComponent" {
 declare module "@babylonjs/node-editor/components/propertyTab/properties/color4PropertyTabComponent" {
     import * as React from "react";
     import { GlobalState } from "@babylonjs/node-editor/globalState";
-    import { InputBlock } from '@babylonjs/core/Materials/Node/Blocks/Input/inputBlock';
+    import { InputBlock } from "@babylonjs/core/Materials/Node/Blocks/Input/inputBlock";
     interface IColor4PropertyTabComponentProps {
         globalState: GlobalState;
         inputBlock: InputBlock;
@@ -1209,9 +1225,9 @@ declare module "@babylonjs/node-editor/diagram/properties/transformNodePropertyC
     }
 }
 declare module "@babylonjs/node-editor/diagram/properties/gradientStepComponent" {
-    import * as React from 'react';
+    import * as React from "react";
     import { GlobalState } from "@babylonjs/node-editor/globalState";
-    import { GradientBlockColorStep } from '@babylonjs/core/Materials/Node/Blocks/gradientBlock';
+    import { GradientBlockColorStep } from "@babylonjs/core/Materials/Node/Blocks/gradientBlock";
     interface IGradientStepComponentProps {
         globalState: GlobalState;
         step: GradientBlockColorStep;
@@ -1236,6 +1252,7 @@ declare module "@babylonjs/node-editor/sharedComponents/buttonLineComponent" {
     export interface IButtonLineComponentProps {
         label: string;
         onClick: () => void;
+        isDisabled?: boolean;
     }
     export class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {
         constructor(props: IButtonLineComponentProps);
@@ -1244,7 +1261,7 @@ declare module "@babylonjs/node-editor/sharedComponents/buttonLineComponent" {
 }
 declare module "@babylonjs/node-editor/diagram/properties/gradientNodePropertyComponent" {
     import * as React from "react";
-    import { GradientBlockColorStep } from '@babylonjs/core/Materials/Node/Blocks/gradientBlock';
+    import { GradientBlockColorStep } from "@babylonjs/core/Materials/Node/Blocks/gradientBlock";
     import { IPropertyComponentProps } from "@babylonjs/node-editor/diagram/properties/propertyComponentProps";
     export class GradientPropertyTabComponent extends React.Component<IPropertyComponentProps> {
         private onValueChangedObserver;
@@ -1291,12 +1308,12 @@ declare module "@babylonjs/node-editor/sharedComponents/fileButtonLineComponent"
 declare module "@babylonjs/node-editor/diagram/properties/texturePropertyTabComponent" {
     import * as React from "react";
     import { IPropertyComponentProps } from "@babylonjs/node-editor/diagram/properties/propertyComponentProps";
-    import { ReflectionTextureBlock } from '@babylonjs/core/Materials/Node/Blocks/Dual/reflectionTextureBlock';
-    import { ReflectionBlock } from '@babylonjs/core/Materials/Node/Blocks/PBR/reflectionBlock';
-    import { RefractionBlock } from '@babylonjs/core/Materials/Node/Blocks/PBR/refractionBlock';
-    import { TextureBlock } from '@babylonjs/core/Materials/Node/Blocks/Dual/textureBlock';
-    import { CurrentScreenBlock } from '@babylonjs/core/Materials/Node/Blocks/Dual/currentScreenBlock';
-    import { ParticleTextureBlock } from '@babylonjs/core/Materials/Node/Blocks/Particle/particleTextureBlock';
+    import { ReflectionTextureBlock } from "@babylonjs/core/Materials/Node/Blocks/Dual/reflectionTextureBlock";
+    import { ReflectionBlock } from "@babylonjs/core/Materials/Node/Blocks/PBR/reflectionBlock";
+    import { RefractionBlock } from "@babylonjs/core/Materials/Node/Blocks/PBR/refractionBlock";
+    import { TextureBlock } from "@babylonjs/core/Materials/Node/Blocks/Dual/textureBlock";
+    import { CurrentScreenBlock } from "@babylonjs/core/Materials/Node/Blocks/Dual/currentScreenBlock";
+    import { ParticleTextureBlock } from "@babylonjs/core/Materials/Node/Blocks/Particle/particleTextureBlock";
     type ReflectionTexture = ReflectionTextureBlock | ReflectionBlock | RefractionBlock;
     type AnyTexture = TextureBlock | ReflectionTexture | CurrentScreenBlock | ParticleTextureBlock;
     export class TexturePropertyTabComponent extends React.Component<IPropertyComponentProps, {
@@ -1331,6 +1348,56 @@ declare module "@babylonjs/node-editor/diagram/properties/trigonometryNodeProper
         render(): JSX.Element;
     }
 }
+declare module "@babylonjs/node-editor/diagram/properties/conditionalNodePropertyComponent" {
+    import * as React from "react";
+    import { IPropertyComponentProps } from "@babylonjs/node-editor/diagram/properties/propertyComponentProps";
+    export class ConditionalPropertyTabComponent extends React.Component<IPropertyComponentProps> {
+        constructor(props: IPropertyComponentProps);
+        render(): JSX.Element;
+    }
+}
+declare module "@babylonjs/node-editor/diagram/properties/imageSourcePropertyTabComponent" {
+    import * as React from "react";
+    import { IPropertyComponentProps } from "@babylonjs/node-editor/diagram/properties/propertyComponentProps";
+    import { ImageSourceBlock } from "@babylonjs/core/Materials/Node/Blocks/Dual/imageSourceBlock";
+    export class ImageSourcePropertyTabComponent extends React.Component<IPropertyComponentProps, {
+        isEmbedded: boolean;
+    }> {
+        get imageSourceBlock(): 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;
+    }
+}
+declare module "@babylonjs/node-editor/diagram/properties/vectorMergerPropertyComponent" {
+    import * as React from "react";
+    import { IPropertyComponentProps } from "@babylonjs/node-editor/diagram/properties/propertyComponentProps";
+    export class VectorMergerPropertyTabComponent extends React.Component<IPropertyComponentProps> {
+        constructor(props: IPropertyComponentProps);
+        render(): JSX.Element;
+    }
+}
+declare module "@babylonjs/node-editor/diagram/properties/colorMergerPropertyComponent" {
+    import * as React from "react";
+    import { IPropertyComponentProps } from "@babylonjs/node-editor/diagram/properties/propertyComponentProps";
+    export class ColorMergerPropertyTabComponent extends React.Component<IPropertyComponentProps> {
+        constructor(props: IPropertyComponentProps);
+        render(): JSX.Element;
+    }
+}
 declare module "@babylonjs/node-editor/diagram/propertyLedger" {
     import { ComponentClass } from 'react';
     import { IPropertyComponentProps } from "@babylonjs/node-editor/diagram/properties/propertyComponentProps";
@@ -1478,6 +1545,30 @@ declare module "@babylonjs/node-editor/diagram/display/pbrDisplayManager" {
         updatePreviewContent(block: NodeMaterialBlock, contentArea: HTMLDivElement): void;
     }
 }
+declare module "@babylonjs/node-editor/diagram/display/conditionalDisplayManager" {
+    import { IDisplayManager } from "@babylonjs/node-editor/diagram/display/displayManager";
+    import { NodeMaterialBlock } from '@babylonjs/core/Materials/Node/nodeMaterialBlock';
+    export class ConditionalDisplayManager implements IDisplayManager {
+        getHeaderClass(block: NodeMaterialBlock): string;
+        shouldDisplayPortLabels(block: NodeMaterialBlock): boolean;
+        getHeaderText(block: NodeMaterialBlock): string;
+        getBackgroundColor(block: NodeMaterialBlock): string;
+        updatePreviewContent(block: NodeMaterialBlock, contentArea: HTMLDivElement): void;
+    }
+}
+declare module "@babylonjs/node-editor/diagram/display/imageSourceDisplayManager" {
+    import { IDisplayManager } from "@babylonjs/node-editor/diagram/display/displayManager";
+    import { NodeMaterialBlock } from '@babylonjs/core/Materials/Node/nodeMaterialBlock';
+    export class imageSourceDisplayManager implements IDisplayManager {
+        private _previewCanvas;
+        private _previewImage;
+        getHeaderClass(block: NodeMaterialBlock): string;
+        shouldDisplayPortLabels(block: NodeMaterialBlock): boolean;
+        getHeaderText(block: NodeMaterialBlock): string;
+        getBackgroundColor(block: NodeMaterialBlock): string;
+        updatePreviewContent(block: NodeMaterialBlock, contentArea: HTMLDivElement): void;
+    }
+}
 declare module "@babylonjs/node-editor/diagram/displayLedger" {
     export class DisplayLedger {
         static RegisteredControls: {
@@ -1497,6 +1588,8 @@ declare module "@babylonjs/node-editor/diagram/graphNode" {
     export class GraphNode {
         block: NodeMaterialBlock;
         private _visual;
+        private _headerContainer;
+        private _promotionWarning;
         private _header;
         private _connections;
         private _inputsContainer;
@@ -1544,7 +1637,7 @@ declare module "@babylonjs/node-editor/diagram/graphNode" {
         set isSelected(value: boolean);
         constructor(block: NodeMaterialBlock, globalState: GlobalState);
         isOverlappingFrame(frame: GraphFrame): boolean;
-        getPortForConnectionPoint(point: NodeMaterialConnectionPoint): Nullable<NodePort>;
+        getPortForConnectionPoint(point: NodeMaterialConnectionPoint): NodePort | null;
         getLinksForConnectionPoint(point: NodeMaterialConnectionPoint): NodeLink[];
         private _refreshFrames;
         _refreshLinks(): void;
@@ -1580,10 +1673,10 @@ declare module "@babylonjs/node-editor/globalState" {
         hostDocument: HTMLDocument;
         hostWindow: Window;
         onSelectionChangedObservable: Observable<Nullable<GraphFrame | GraphNode | NodePort | NodeLink | FramePortData>>;
-        onRebuildRequiredObservable: Observable<void>;
+        onRebuildRequiredObservable: Observable<boolean>;
         onBuiltObservable: Observable<void>;
         onResetRequiredObservable: Observable<void>;
-        onUpdateRequiredObservable: Observable<void>;
+        onUpdateRequiredObservable: Observable<Nullable<NodeMaterialBlock>>;
         onZoomToFitRequiredObservable: Observable<void>;
         onReOrganizedRequiredObservable: Observable<void>;
         onLogRequiredObservable: Observable<LogEntry>;
@@ -1596,9 +1689,9 @@ declare module "@babylonjs/node-editor/globalState" {
         onDepthPrePassChanged: Observable<void>;
         onAnimationCommandActivated: Observable<void>;
         onCandidateLinkMoved: Observable<Nullable<Vector2>>;
-        onSelectionBoxMoved: Observable<DOMRect | ClientRect>;
+        onSelectionBoxMoved: Observable<ClientRect | DOMRect>;
         onFrameCreatedObservable: Observable<GraphFrame>;
-        onCandidatePortSelectedObservable: Observable<Nullable<FrameNodePort | NodePort>>;
+        onCandidatePortSelectedObservable: Observable<Nullable<NodePort | FrameNodePort>>;
         onImportFrameObservable: Observable<any>;
         onGraphNodeRemovalObservable: Observable<GraphNode>;
         onPopupClosedObservable: Observable<void>;
@@ -1607,6 +1700,7 @@ declare module "@babylonjs/node-editor/globalState" {
         onExposePortOnFrameObservable: Observable<GraphNode>;
         previewType: PreviewType;
         previewFile: File;
+        particleSystemBlendMode: number;
         listOfCustomPreviewFiles: File[];
         rotatePreview: boolean;
         backgroundColor: Color4;
@@ -1649,6 +1743,7 @@ declare module "@babylonjs/node-editor/sharedComponents/draggableLineWithButtonC
         iconImage: any;
         onIconClick: (value: string) => void;
         iconTitle: string;
+        lenSuffixToRemove?: number;
     }
     export class DraggableLineWithButtonComponent extends React.Component<IDraggableLineWithButtonComponent> {
         constructor(props: IDraggableLineWithButtonComponent);
@@ -1688,18 +1783,21 @@ declare module "@babylonjs/node-editor/components/nodeList/nodeListComponent" {
         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;
     }
 }
 declare module "@babylonjs/node-editor/components/propertyTab/inputsPropertyTabComponent" {
     import * as React from "react";
     import { GlobalState } from "@babylonjs/node-editor/globalState";
-    import { InputBlock } from '@babylonjs/core/Materials/Node/Blocks/Input/inputBlock';
+    import { InputBlock } from "@babylonjs/core/Materials/Node/Blocks/Input/inputBlock";
     interface IInputsPropertyTabComponentProps {
         globalState: GlobalState;
         inputs: InputBlock[];
@@ -1766,10 +1864,10 @@ declare module "@babylonjs/node-editor/diagram/properties/nodePortPropertyCompon
 declare module "@babylonjs/node-editor/components/propertyTab/propertyTabComponent" {
     import * as React from "react";
     import { GlobalState } from "@babylonjs/node-editor/globalState";
-    import { Nullable } from '@babylonjs/core/types';
+    import { Nullable } from "@babylonjs/core/types";
     import { GraphNode } from "@babylonjs/node-editor/diagram/graphNode";
     import { GraphFrame } from "@babylonjs/node-editor/diagram/graphFrame";
-    import { InputBlock } from '@babylonjs/core/Materials/Node/Blocks/Input/inputBlock';
+    import { InputBlock } from "@babylonjs/core/Materials/Node/Blocks/Input/inputBlock";
     import { FrameNodePort } from "@babylonjs/node-editor/diagram/frameNodePort";
     import { NodePort } from "@babylonjs/node-editor/diagram/nodePort";
     interface IPropertyTabComponentProps {
@@ -1780,6 +1878,7 @@ declare module "@babylonjs/node-editor/components/propertyTab/propertyTabCompone
         currentFrame: Nullable<GraphFrame>;
         currentFrameNodePort: Nullable<FrameNodePort>;
         currentNodePort: Nullable<NodePort>;
+        uploadInProgress: boolean;
     }
     export class PropertyTabComponent extends React.Component<IPropertyTabComponentProps, IPropertyTabComponentState> {
         private _onBuiltObserver;
@@ -1897,6 +1996,7 @@ declare module "@babylonjs/node-editor/components/preview/previewAreaComponent"
         componentWillUnmount(): void;
         changeBackFaceCulling(value: boolean): void;
         changeDepthPrePass(value: boolean): void;
+        changeParticleSystemBlendMode(newOne: number): void;
         render(): JSX.Element;
     }
 }
@@ -1909,8 +2009,8 @@ declare module "@babylonjs/node-editor/sharedComponents/popup" {
 declare module "@babylonjs/node-editor/graphEditor" {
     import * as React from "react";
     import { GlobalState } from "@babylonjs/node-editor/globalState";
-    import { NodeMaterialBlock } from '@babylonjs/core/Materials/Node/nodeMaterialBlock';
-    import { Nullable } from '@babylonjs/core/types';
+    import { NodeMaterialBlock } from "@babylonjs/core/Materials/Node/nodeMaterialBlock";
+    import { Nullable } from "@babylonjs/core/types";
     import { IEditorData } from "@babylonjs/node-editor/nodeLocationInfo";
     import { GraphNode } from "@babylonjs/node-editor/diagram/graphNode";
     import { IInspectorOptions } from "@babylonjs/core/Debug/debugLayer";
@@ -1955,7 +2055,7 @@ declare module "@babylonjs/node-editor/graphEditor" {
         reconnectNewNodes(nodeIndex: number, newNodes: GraphNode[], sourceNodes: GraphNode[], done: boolean[]): void;
         pasteSelection(copiedNodes: GraphNode[], currentX: number, currentY: number, selectNew?: boolean): GraphNode[] | undefined;
         zoomToFit(): void;
-        buildMaterial(): void;
+        buildMaterial(autoConfigure?: boolean): void;
         build(): void;
         loadGraph(): void;
         showWaitScreen(): void;
@@ -2024,6 +2124,8 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/booleanLineCompo
     export interface IBooleanLineComponentProps {
         label: string;
         value: boolean;
+        icon?: string;
+        iconLabel?: string;
     }
     export class BooleanLineComponent extends React.Component<IBooleanLineComponentProps> {
         constructor(props: IBooleanLineComponentProps);
@@ -2035,6 +2137,8 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/buttonLineCompon
     export interface IButtonLineComponentProps {
         label: string;
         onClick: () => void;
+        icon?: string;
+        iconLabel?: string;
     }
     export class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {
         constructor(props: IButtonLineComponentProps);
@@ -2046,7 +2150,7 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/checkBoxLineComp
     import { Observable } from "@babylonjs/core/Misc/observable";
     import { PropertyChangedEvent } from "@babylonjs/node-editor/sharedUiComponents/propertyChangedEvent";
     export interface ICheckBoxLineComponentProps {
-        label: string;
+        label?: string;
         target?: any;
         propertyName?: string;
         isSelected?: () => boolean;
@@ -2054,6 +2158,10 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/checkBoxLineComp
         onValueChanged?: () => void;
         onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
         disabled?: boolean;
+        icon?: string;
+        iconLabel?: string;
+        faIcons?: {
+        };
     }
     export class CheckBoxLineComponent extends React.Component<ICheckBoxLineComponentProps, {
         isSelected: boolean;
@@ -2079,6 +2187,8 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/numericInputComp
         step?: number;
         onChange: (value: number) => void;
         precision?: number;
+        icon?: string;
+        iconLabel?: string;
     }
     export class NumericInputComponent extends React.Component<INumericInputComponentProps, {
         value: string;
@@ -2098,10 +2208,14 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/numericInputComp
 }
 declare module "@babylonjs/node-editor/sharedUiComponents/lines/colorPickerComponent" {
     import * as React from "react";
-    import { Color4, Color3 } from '@babylonjs/core/Maths/math.color';
+    import { Color4, Color3 } from "@babylonjs/core/Maths/math.color";
     export interface IColorPickerComponentProps {
         value: Color4 | Color3;
+        linearHint?: boolean;
         onColorChanged: (newOne: string) => void;
+        icon?: string;
+        iconLabel?: string;
+        shouldPopRight?: boolean;
     }
     interface IColorPickerComponentState {
         pickerEnabled: boolean;
@@ -2119,35 +2233,91 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/colorPickerCompo
         render(): JSX.Element;
     }
 }
+declare module "@babylonjs/node-editor/sharedUiComponents/tabs/propertyGrids/lockObject" {
+    /**
+     * Class used to provide lock mechanism
+     */
+    export class LockObject {
+        /**
+         * Gets or set if the lock is engaged
+         */
+        lock: boolean;
+    }
+}
+declare module "@babylonjs/node-editor/sharedUiComponents/lines/textInputLineComponent" {
+    import * as React from "react";
+    import { Observable } from "@babylonjs/core/Misc/observable";
+    import { PropertyChangedEvent } from "@babylonjs/node-editor/sharedUiComponents/propertyChangedEvent";
+    import { LockObject } from "@babylonjs/node-editor/sharedUiComponents/tabs/propertyGrids/lockObject";
+    interface ITextInputLineComponentProps {
+        label: string;
+        lockObject: LockObject;
+        target?: any;
+        propertyName?: string;
+        value?: string;
+        onChange?: (value: string) => void;
+        onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+        icon?: string;
+        iconLabel?: string;
+        noUnderline?: boolean;
+        numbersOnly?: boolean;
+        delayInput?: boolean;
+    }
+    export class TextInputLineComponent extends React.Component<ITextInputLineComponentProps, {
+        value: string;
+    }> {
+        private _localChange;
+        constructor(props: ITextInputLineComponentProps);
+        componentWillUnmount(): void;
+        shouldComponentUpdate(nextProps: ITextInputLineComponentProps, nextState: {
+            value: string;
+        }): boolean;
+        raiseOnPropertyChanged(newValue: string, previousValue: string): void;
+        updateValue(value: string): void;
+        render(): JSX.Element;
+    }
+}
 declare module "@babylonjs/node-editor/sharedUiComponents/lines/color3LineComponent" {
     import * as React from "react";
     import { Observable } from "@babylonjs/core/Misc/observable";
     import { PropertyChangedEvent } from "@babylonjs/node-editor/sharedUiComponents/propertyChangedEvent";
-    import { Color3 } from '@babylonjs/core/Maths/math.color';
+    import { Color3, Color4 } from "@babylonjs/core/Maths/math.color";
+    import { LockObject } from "@babylonjs/node-editor/sharedUiComponents/tabs/propertyGrids/lockObject";
     export interface IColor3LineComponentProps {
         label: string;
         target: any;
         propertyName: string;
         onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
         isLinear?: boolean;
+        icon?: string;
+        lockObject?: LockObject;
+        iconLabel?: string;
+        onValueChange?: (value: string) => void;
     }
     export class Color3LineComponent extends React.Component<IColor3LineComponentProps, {
         isExpanded: boolean;
-        color: Color3;
+        color: Color3 | Color4;
+        colorText: string;
     }> {
         private _localChange;
         constructor(props: IColor3LineComponentProps);
+        private convertToColor3;
         shouldComponentUpdate(nextProps: IColor3LineComponentProps, nextState: {
-            color: Color3;
+            color: Color3 | Color4;
+            colorText: string;
         }): boolean;
-        setPropertyValue(newColor: Color3): void;
+        setPropertyValue(newColor: Color3 | Color4, newColorText: string): void;
         onChange(newValue: string): void;
         switchExpandState(): void;
-        raiseOnPropertyChanged(previousValue: Color3): void;
+        raiseOnPropertyChanged(previousValue: Color3 | Color4): void;
         updateStateR(value: number): void;
         updateStateG(value: number): void;
         updateStateB(value: number): void;
         copyToClipboard(): void;
+        convert(colorString: string): void;
+        private _colorStringSaved;
+        private _colorPickerOpen;
+        private _colorString;
         render(): JSX.Element;
     }
 }
@@ -2163,6 +2333,8 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/color4LineCompon
         onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
         onChange?: () => void;
         isLinear?: boolean;
+        icon?: string;
+        iconLabel?: string;
     }
     export class Color4LineComponent extends React.Component<IColor4LineComponentProps, {
         isExpanded: boolean;
@@ -2202,6 +2374,8 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/fileButtonLineCo
         label: string;
         onClick: (file: File) => void;
         accept: string;
+        icon?: string;
+        iconLabel?: string;
     }
     export class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {
         private static _IDGenerator;
@@ -2218,6 +2392,8 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/fileMultipleButt
         label: string;
         onClick: (event: any) => void;
         accept: string;
+        icon?: string;
+        iconLabel?: string;
     }
     export class FileMultipleButtonLineComponent extends React.Component<IFileMultipleButtonLineComponentProps> {
         private static _IDGenerator;
@@ -2228,21 +2404,11 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/fileMultipleButt
         render(): JSX.Element;
     }
 }
-declare module "@babylonjs/node-editor/sharedUiComponents/tabs/propertyGrids/lockObject" {
-    /**
-     * Class used to provide lock mechanism
-     */
-    export class LockObject {
-        /**
-         * Gets or set if the lock is engaged
-         */
-        lock: boolean;
-    }
-}
 declare module "@babylonjs/node-editor/sharedUiComponents/lines/sliderLineComponent" {
     import * as React from "react";
     import { Observable } from "@babylonjs/core/Misc/observable";
     import { PropertyChangedEvent } from "@babylonjs/node-editor/sharedUiComponents/propertyChangedEvent";
+    import { LockObject } from "@babylonjs/node-editor/sharedUiComponents/tabs/propertyGrids/lockObject";
     interface ISliderLineComponentProps {
         label: string;
         target?: any;
@@ -2257,6 +2423,9 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/sliderLineCompon
         onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
         decimalCount?: number;
         margin?: boolean;
+        icon?: string;
+        iconLabel?: string;
+        lockObject?: LockObject;
     }
     export class SliderLineComponent extends React.Component<ISliderLineComponentProps, {
         value: number;
@@ -2293,6 +2462,9 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/floatLineCompone
         max?: number;
         smallUI?: boolean;
         onEnter?: (newValue: number) => void;
+        icon?: string;
+        iconLabel?: string;
+        defaultValue?: number;
     }
     export class FloatLineComponent extends React.Component<IFloatLineComponentProps, {
         value: string;
@@ -2330,6 +2502,8 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/hexLineComponent
         digits?: number;
         useEuler?: boolean;
         min?: number;
+        icon?: string;
+        iconLabel?: string;
     }
     export class HexLineComponent extends React.Component<IHexLineComponentProps, {
         value: string;
@@ -2350,8 +2524,14 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/hexLineComponent
         render(): JSX.Element;
     }
 }
+declare module "@babylonjs/node-editor/sharedUiComponents/lines/iSelectedLineContainer" {
+    export interface ISelectedLineContainer {
+        selectedLineContainerTitles: Array<string>;
+        selectedLineContainerTitlesNoFocus: Array<string>;
+    }
+}
 declare module "@babylonjs/node-editor/sharedUiComponents/lines/iconButtonLineComponent" {
-    import * as React from 'react';
+    import * as React from "react";
     export interface IIconButtonLineComponentProps {
         icon: string;
         onClick: () => void;
@@ -2382,17 +2562,21 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/indentedTextLine
 }
 declare module "@babylonjs/node-editor/sharedUiComponents/lines/lineContainerComponent" {
     import * as React from "react";
+    import { ISelectedLineContainer } from "@babylonjs/node-editor/sharedUiComponents/lines/iSelectedLineContainer";
     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;
     }
 }
@@ -2426,22 +2610,20 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/optionsLineCompo
     import * as React from "react";
     import { Observable } from "@babylonjs/core/Misc/observable";
     import { PropertyChangedEvent } from "@babylonjs/node-editor/sharedUiComponents/propertyChangedEvent";
+    import { IInspectableOptions } from "@babylonjs/core/Misc/iInspectable";
     export const Null_Value: number;
-    export class ListLineOption {
-        label: string;
-        value: number;
-        selected?: boolean;
-    }
     export interface IOptionsLineComponentProps {
         label: string;
         target: any;
         propertyName: string;
-        options: ListLineOption[];
+        options: IInspectableOptions[];
         noDirectUpdate?: boolean;
         onSelect?: (value: number) => void;
         extractValue?: () => number;
         onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
         allowNullValue?: boolean;
+        icon?: string;
+        iconLabel?: string;
     }
     export class OptionsLineComponent extends React.Component<IOptionsLineComponentProps, {
         value: number;
@@ -2472,6 +2654,8 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/radioLineCompone
         label: string;
         isSelected: () => boolean;
         onSelect: () => void;
+        icon?: string;
+        iconLabel?: string;
     }
     export class RadioButtonLineComponent extends React.Component<IRadioButtonLineComponentProps, {
         isSelected: boolean;
@@ -2484,34 +2668,6 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/radioLineCompone
         render(): JSX.Element;
     }
 }
-declare module "@babylonjs/node-editor/sharedUiComponents/lines/textInputLineComponent" {
-    import * as React from "react";
-    import { Observable } from "@babylonjs/core/Misc/observable";
-    import { PropertyChangedEvent } from "@babylonjs/node-editor/sharedUiComponents/propertyChangedEvent";
-    import { LockObject } from "@babylonjs/node-editor/sharedUiComponents/tabs/propertyGrids/lockObject";
-    interface ITextInputLineComponentProps {
-        label: string;
-        lockObject: LockObject;
-        target?: any;
-        propertyName?: string;
-        value?: string;
-        onChange?: (value: string) => void;
-        onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
-    }
-    export class TextInputLineComponent extends React.Component<ITextInputLineComponentProps, {
-        value: string;
-    }> {
-        private _localChange;
-        constructor(props: ITextInputLineComponentProps);
-        componentWillUnmount(): void;
-        shouldComponentUpdate(nextProps: ITextInputLineComponentProps, nextState: {
-            value: string;
-        }): boolean;
-        raiseOnPropertyChanged(newValue: string, previousValue: string): void;
-        updateValue(value: string): void;
-        render(): JSX.Element;
-    }
-}
 declare module "@babylonjs/node-editor/sharedUiComponents/lines/textLineComponent" {
     import * as React from "react";
     interface ITextLineComponentProps {
@@ -2523,6 +2679,9 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/textLineComponen
         url?: string;
         ignoreValue?: boolean;
         additionalClass?: string;
+        icon?: string;
+        iconLabel?: string;
+        tooltip?: string;
     }
     export class TextLineComponent extends React.Component<ITextLineComponentProps> {
         constructor(props: ITextLineComponentProps);
@@ -2539,6 +2698,8 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/valueLineCompone
         color?: string;
         fractionDigits?: number;
         units?: string;
+        icon?: string;
+        iconLabel?: string;
     }
     export class ValueLineComponent extends React.Component<IValueLineComponentProps> {
         constructor(props: IValueLineComponentProps);
@@ -2557,6 +2718,8 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/vector2LineCompo
         step?: number;
         onChange?: (newvalue: Vector2) => void;
         onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+        icon?: string;
+        iconLabel?: string;
     }
     export class Vector2LineComponent extends React.Component<IVector2LineComponentProps, {
         isExpanded: boolean;
@@ -2592,6 +2755,8 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/vector3LineCompo
         useEuler?: boolean;
         onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
         noSlider?: boolean;
+        icon?: string;
+        iconLabel?: string;
     }
     export class Vector3LineComponent extends React.Component<IVector3LineComponentProps, {
         isExpanded: boolean;
@@ -2629,6 +2794,8 @@ declare module "@babylonjs/node-editor/sharedUiComponents/lines/vector4LineCompo
         onChange?: (newvalue: Vector4) => void;
         useEuler?: boolean;
         onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+        icon?: string;
+        iconLabel?: string;
     }
     export class Vector4LineComponent extends React.Component<IVector4LineComponentProps, {
         isExpanded: boolean;