@babylonjs/shared-ui-components 5.28.0 → 5.29.0

package/lines/lineContainerComponent.js

@@ -1,50 +1,50 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import { DataStorage } from "@babylonjs/core/Misc/dataStorage.js";
-import downArrow from "./downArrow.svg";
-export class LineContainerComponent extends React.Component {
-    constructor(props) {
-        super(props);
-        const initialState = DataStorage.ReadBoolean(this.props.title, !this.props.closed);
-        this.state = { isExpanded: initialState, isHighlighted: false };
-    }
-    switchExpandedState() {
-        const newState = !this.state.isExpanded;
-        DataStorage.WriteBoolean(this.props.title, newState);
-        this.setState({ isExpanded: newState });
-    }
-    renderHeader() {
-        const className = this.state.isExpanded ? "collapse" : "collapse closed";
-        return (_jsxs("div", { className: "header", onClick: () => this.switchExpandedState(), children: [_jsx("div", { className: "title", children: this.props.title }), _jsx("div", { className: className, children: _jsx("img", { className: "img", title: this.props.title, src: downArrow }) })] }));
-    }
-    componentDidMount() {
-        if (!this.props.selection) {
-            return;
-        }
-        if (this.props.selection.selectedLineContainerTitles.length === 0 && this.props.selection.selectedLineContainerTitlesNoFocus.length === 0) {
-            return;
-        }
-        if (this.props.selection.selectedLineContainerTitles.indexOf(this.props.title) > -1) {
-            setTimeout(() => {
-                this.props.selection.selectedLineContainerTitles = [];
-            });
-            this.setState({ isExpanded: true, isHighlighted: true });
-            window.setTimeout(() => {
-                this.setState({ isHighlighted: false });
-            }, 5000);
-        }
-        else if (this.props.selection.selectedLineContainerTitlesNoFocus.indexOf(this.props.title) > -1) {
-            this.setState({ isExpanded: true, isHighlighted: false });
-        }
-        else {
-            this.setState({ isExpanded: false });
-        }
-    }
-    render() {
-        if (!this.state.isExpanded) {
-            return (_jsx("div", { className: "paneContainer", children: _jsx("div", { className: "paneContainer-content", children: this.renderHeader() }) }));
-        }
-        return (_jsxs("div", { className: "paneContainer", children: [_jsxs("div", { className: "paneContainer-content", children: [this.renderHeader(), _jsx("div", { className: "paneList", children: this.props.children })] }), _jsx("div", { className: "paneContainer-highlight-border" + (!this.state.isHighlighted ? " transparent" : "") })] }));
-    }
-}
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { DataStorage } from "@babylonjs/core/Misc/dataStorage.js";
+import downArrow from "./downArrow.svg";
+export class LineContainerComponent extends React.Component {
+    constructor(props) {
+        super(props);
+        const initialState = DataStorage.ReadBoolean(this.props.title, !this.props.closed);
+        this.state = { isExpanded: initialState, isHighlighted: false };
+    }
+    switchExpandedState() {
+        const newState = !this.state.isExpanded;
+        DataStorage.WriteBoolean(this.props.title, newState);
+        this.setState({ isExpanded: newState });
+    }
+    renderHeader() {
+        const className = this.state.isExpanded ? "collapse" : "collapse closed";
+        return (_jsxs("div", { className: "header", onClick: () => this.switchExpandedState(), children: [_jsx("div", { className: "title", children: this.props.title }), _jsx("div", { className: className, children: _jsx("img", { className: "img", title: this.props.title, src: downArrow }) })] }));
+    }
+    componentDidMount() {
+        if (!this.props.selection) {
+            return;
+        }
+        if (this.props.selection.selectedLineContainerTitles.length === 0 && this.props.selection.selectedLineContainerTitlesNoFocus.length === 0) {
+            return;
+        }
+        if (this.props.selection.selectedLineContainerTitles.indexOf(this.props.title) > -1) {
+            setTimeout(() => {
+                this.props.selection.selectedLineContainerTitles = [];
+            });
+            this.setState({ isExpanded: true, isHighlighted: true });
+            window.setTimeout(() => {
+                this.setState({ isHighlighted: false });
+            }, 5000);
+        }
+        else if (this.props.selection.selectedLineContainerTitlesNoFocus.indexOf(this.props.title) > -1) {
+            this.setState({ isExpanded: true, isHighlighted: false });
+        }
+        else {
+            this.setState({ isExpanded: false });
+        }
+    }
+    render() {
+        if (!this.state.isExpanded) {
+            return (_jsx("div", { className: "paneContainer", children: _jsx("div", { className: "paneContainer-content", children: this.renderHeader() }) }));
+        }
+        return (_jsxs("div", { className: "paneContainer", children: [_jsxs("div", { className: "paneContainer-content", children: [this.renderHeader(), _jsx("div", { className: "paneList", children: this.props.children })] }), _jsx("div", { className: "paneContainer-highlight-border" + (!this.state.isHighlighted ? " transparent" : "") })] }));
+    }
+}
 //# sourceMappingURL=lineContainerComponent.js.map

package/lines/linkButtonComponent.d.ts

@@ -1,16 +1,16 @@
-import * as React from "react";
-import type { IconProp } from "@fortawesome/fontawesome-svg-core";
-interface ILinkButtonComponentProps {
-    label: string;
-    buttonLabel: string;
-    url?: string;
-    onClick: () => void;
-    icon?: IconProp;
-    onIconClick?: () => void;
-}
-export declare class LinkButtonComponent extends React.Component<ILinkButtonComponentProps> {
-    constructor(props: ILinkButtonComponentProps);
-    onLink(): void;
-    render(): JSX.Element;
-}
-export {};
+import * as React from "react";
+import type { IconProp } from "@fortawesome/fontawesome-svg-core";
+interface ILinkButtonComponentProps {
+    label: string;
+    buttonLabel: string;
+    url?: string;
+    onClick: () => void;
+    icon?: IconProp;
+    onIconClick?: () => void;
+}
+export declare class LinkButtonComponent extends React.Component<ILinkButtonComponentProps> {
+    constructor(props: ILinkButtonComponentProps);
+    onLink(): void;
+    render(): JSX.Element;
+}
+export {};

package/lines/linkButtonComponent.js

@@ -1,21 +1,21 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-export class LinkButtonComponent extends React.Component {
-    constructor(props) {
-        super(props);
-    }
-    onLink() {
-        if (this.props.url) {
-            window.open(this.props.url, "_blank");
-        }
-    }
-    render() {
-        return (_jsxs("div", { className: "linkButtonLine", children: [_jsx("div", { className: "link", title: this.props.label, onClick: () => this.onLink(), children: this.props.label }), _jsx("div", { className: "link-button", children: _jsx("button", { onClick: () => this.props.onClick(), children: this.props.buttonLabel }) }), this.props.icon && (_jsx("div", { className: "link-icon hoverIcon", onClick: () => {
-                        if (this.props.onIconClick) {
-                            this.props.onIconClick();
-                        }
-                    }, children: _jsx(FontAwesomeIcon, { icon: this.props.icon }) }))] }));
-    }
-}
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+export class LinkButtonComponent extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    onLink() {
+        if (this.props.url) {
+            window.open(this.props.url, "_blank");
+        }
+    }
+    render() {
+        return (_jsxs("div", { className: "linkButtonLine", children: [_jsx("div", { className: "link", title: this.props.label, onClick: () => this.onLink(), children: this.props.label }), _jsx("div", { className: "link-button", children: _jsx("button", { onClick: () => this.props.onClick(), children: this.props.buttonLabel }) }), this.props.icon && (_jsx("div", { className: "link-icon hoverIcon", onClick: () => {
+                        if (this.props.onIconClick) {
+                            this.props.onIconClick();
+                        }
+                    }, children: _jsx(FontAwesomeIcon, { icon: this.props.icon }) }))] }));
+    }
+}
 //# sourceMappingURL=linkButtonComponent.js.map

package/lines/matrixLineComponent.d.ts

@@ -1,36 +1,36 @@
-import * as React from "react";
-import type { Vector3, Vector4 } from "@babylonjs/core/Maths/math.vector.js";
-import { Matrix } from "@babylonjs/core/Maths/math.vector.js";
-import type { Observable } from "@babylonjs/core/Misc/observable.js";
-import type { PropertyChangedEvent } from "../propertyChangedEvent";
-import type { LockObject } from "../tabs/propertyGrids/lockObject";
-interface IMatrixLineComponentProps {
-    label: string;
-    target: any;
-    propertyName: string;
-    step?: number;
-    onChange?: (newValue: Matrix) => void;
-    onModeChange?: (mode: number) => void;
-    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
-    mode?: number;
-    lockObject: LockObject;
-}
-export declare class MatrixLineComponent extends React.Component<IMatrixLineComponentProps, {
-    value: Matrix;
-    mode: number;
-    angle: number;
-}> {
-    private _localChange;
-    constructor(props: IMatrixLineComponentProps);
-    shouldComponentUpdate(nextProps: IMatrixLineComponentProps, nextState: {
-        value: Matrix;
-        mode: number;
-        angle: number;
-    }): boolean;
-    raiseOnPropertyChanged(previousValue: Vector3): void;
-    updateMatrix(): void;
-    updateRow(value: Vector4, row: number): void;
-    updateBasedOnMode(value: number): void;
-    render(): JSX.Element;
-}
-export {};
+import * as React from "react";
+import type { Vector3, Vector4 } from "@babylonjs/core/Maths/math.vector.js";
+import { Matrix } from "@babylonjs/core/Maths/math.vector.js";
+import type { Observable } from "@babylonjs/core/Misc/observable.js";
+import type { PropertyChangedEvent } from "../propertyChangedEvent";
+import type { LockObject } from "../tabs/propertyGrids/lockObject";
+interface IMatrixLineComponentProps {
+    label: string;
+    target: any;
+    propertyName: string;
+    step?: number;
+    onChange?: (newValue: Matrix) => void;
+    onModeChange?: (mode: number) => void;
+    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+    mode?: number;
+    lockObject: LockObject;
+}
+export declare class MatrixLineComponent extends React.Component<IMatrixLineComponentProps, {
+    value: Matrix;
+    mode: number;
+    angle: number;
+}> {
+    private _localChange;
+    constructor(props: IMatrixLineComponentProps);
+    shouldComponentUpdate(nextProps: IMatrixLineComponentProps, nextState: {
+        value: Matrix;
+        mode: number;
+        angle: number;
+    }): boolean;
+    raiseOnPropertyChanged(previousValue: Vector3): void;
+    updateMatrix(): void;
+    updateRow(value: Vector4, row: number): void;
+    updateBasedOnMode(value: number): void;
+    render(): JSX.Element;
+}
+export {};

package/lines/matrixLineComponent.js

@@ -1,103 +1,103 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import { Matrix, Quaternion } from "@babylonjs/core/Maths/math.vector.js";
-import { Vector4LineComponent } from "./vector4LineComponent.js";
-import { OptionsLineComponent } from "./optionsLineComponent.js";
-import { SliderLineComponent } from "./sliderLineComponent.js";
-export class MatrixLineComponent extends React.Component {
-    constructor(props) {
-        super(props);
-        this._localChange = false;
-        const matrix = this.props.target[this.props.propertyName].clone();
-        let angle = 0;
-        if (this.props.mode) {
-            const quat = new Quaternion();
-            matrix.decompose(undefined, quat);
-            const euler = quat.toEulerAngles();
-            switch (this.props.mode) {
-                case 1:
-                    angle = euler.x;
-                    break;
-                case 2:
-                    angle = euler.y;
-                    break;
-                case 3:
-                    angle = euler.z;
-                    break;
-            }
-        }
-        this.state = { value: matrix, mode: this.props.mode || 0, angle: angle };
-    }
-    shouldComponentUpdate(nextProps, nextState) {
-        const nextPropsValue = nextProps.target[nextProps.propertyName];
-        if (!nextPropsValue.equals(nextState.value) || this._localChange) {
-            nextState.value = nextPropsValue.clone();
-            this._localChange = false;
-            return true;
-        }
-        return nextState.mode !== this.state.mode || nextState.angle !== this.state.angle;
-    }
-    raiseOnPropertyChanged(previousValue) {
-        if (this.props.onChange) {
-            this.props.onChange(this.state.value);
-        }
-        if (!this.props.onPropertyChangedObservable) {
-            return;
-        }
-        this.props.onPropertyChangedObservable.notifyObservers({
-            object: this.props.target,
-            property: this.props.propertyName,
-            value: this.state.value,
-            initialValue: previousValue,
-        });
-    }
-    updateMatrix() {
-        const store = this.props.target[this.props.propertyName].clone();
-        this.props.target[this.props.propertyName] = this.state.value;
-        this.setState({ value: store });
-        this.raiseOnPropertyChanged(store);
-    }
-    updateRow(value, row) {
-        this._localChange = true;
-        this.state.value.setRow(row, value);
-        this.updateMatrix();
-    }
-    updateBasedOnMode(value) {
-        switch (this.state.mode) {
-            case 1: {
-                Matrix.RotationXToRef(this.state.angle, this.state.value);
-                break;
-            }
-            case 2: {
-                Matrix.RotationYToRef(this.state.angle, this.state.value);
-                break;
-            }
-            case 3: {
-                Matrix.RotationZToRef(this.state.angle, this.state.value);
-                break;
-            }
-        }
-        this.updateMatrix();
-        this.setState({ angle: value });
-    }
-    render() {
-        const modeOptions = [
-            { label: "User-defined", value: 0 },
-            { label: "Rotation over X axis", value: 1 },
-            { label: "Rotation over Y axis", value: 2 },
-            { label: "Rotation over Z axis", value: 3 },
-        ];
-        return (_jsxs("div", { className: "vector3Line", children: [_jsx("div", { className: "firstLine", children: _jsx("div", { className: "label", title: this.props.label, children: this.props.label }) }), _jsx("div", { className: "secondLine", children: _jsx(OptionsLineComponent, { label: "Mode", className: "no-right-margin", options: modeOptions, target: this, noDirectUpdate: true, propertyName: "", extractValue: () => {
-                            return this.state.mode;
-                        }, onSelect: (value) => {
-                            this.props.target[this.props.propertyName] = Matrix.Identity();
-                            Matrix.IdentityToRef(this.state.value);
-                            this.setState({ mode: value, angle: 0 });
-                            this.updateMatrix();
-                            if (this.props.onModeChange) {
-                                this.props.onModeChange(value);
-                            }
-                        } }) }), this.state.mode === 0 && (_jsxs("div", { className: "secondLine", children: [_jsx(Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #0", value: this.state.value.getRow(0), onChange: (value) => this.updateRow(value, 0) }), _jsx(Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #1", value: this.state.value.getRow(1), onChange: (value) => this.updateRow(value, 1) }), _jsx(Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #2", value: this.state.value.getRow(2), onChange: (value) => this.updateRow(value, 2) }), _jsx(Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #3", value: this.state.value.getRow(3), onChange: (value) => this.updateRow(value, 3) })] })), this.state.mode !== 0 && (_jsx("div", { className: "secondLine", children: _jsx(SliderLineComponent, { label: "Angle", lockObject: this.props.lockObject, minimum: 0, maximum: 2 * Math.PI, useEuler: true, step: 0.1, directValue: this.state.angle, onChange: (value) => this.updateBasedOnMode(value) }) }))] }));
-    }
-}
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Matrix, Quaternion } from "@babylonjs/core/Maths/math.vector.js";
+import { Vector4LineComponent } from "./vector4LineComponent.js";
+import { OptionsLineComponent } from "./optionsLineComponent.js";
+import { SliderLineComponent } from "./sliderLineComponent.js";
+export class MatrixLineComponent extends React.Component {
+    constructor(props) {
+        super(props);
+        this._localChange = false;
+        const matrix = this.props.target[this.props.propertyName].clone();
+        let angle = 0;
+        if (this.props.mode) {
+            const quat = new Quaternion();
+            matrix.decompose(undefined, quat);
+            const euler = quat.toEulerAngles();
+            switch (this.props.mode) {
+                case 1:
+                    angle = euler.x;
+                    break;
+                case 2:
+                    angle = euler.y;
+                    break;
+                case 3:
+                    angle = euler.z;
+                    break;
+            }
+        }
+        this.state = { value: matrix, mode: this.props.mode || 0, angle: angle };
+    }
+    shouldComponentUpdate(nextProps, nextState) {
+        const nextPropsValue = nextProps.target[nextProps.propertyName];
+        if (!nextPropsValue.equals(nextState.value) || this._localChange) {
+            nextState.value = nextPropsValue.clone();
+            this._localChange = false;
+            return true;
+        }
+        return nextState.mode !== this.state.mode || nextState.angle !== this.state.angle;
+    }
+    raiseOnPropertyChanged(previousValue) {
+        if (this.props.onChange) {
+            this.props.onChange(this.state.value);
+        }
+        if (!this.props.onPropertyChangedObservable) {
+            return;
+        }
+        this.props.onPropertyChangedObservable.notifyObservers({
+            object: this.props.target,
+            property: this.props.propertyName,
+            value: this.state.value,
+            initialValue: previousValue,
+        });
+    }
+    updateMatrix() {
+        const store = this.props.target[this.props.propertyName].clone();
+        this.props.target[this.props.propertyName] = this.state.value;
+        this.setState({ value: store });
+        this.raiseOnPropertyChanged(store);
+    }
+    updateRow(value, row) {
+        this._localChange = true;
+        this.state.value.setRow(row, value);
+        this.updateMatrix();
+    }
+    updateBasedOnMode(value) {
+        switch (this.state.mode) {
+            case 1: {
+                Matrix.RotationXToRef(this.state.angle, this.state.value);
+                break;
+            }
+            case 2: {
+                Matrix.RotationYToRef(this.state.angle, this.state.value);
+                break;
+            }
+            case 3: {
+                Matrix.RotationZToRef(this.state.angle, this.state.value);
+                break;
+            }
+        }
+        this.updateMatrix();
+        this.setState({ angle: value });
+    }
+    render() {
+        const modeOptions = [
+            { label: "User-defined", value: 0 },
+            { label: "Rotation over X axis", value: 1 },
+            { label: "Rotation over Y axis", value: 2 },
+            { label: "Rotation over Z axis", value: 3 },
+        ];
+        return (_jsxs("div", { className: "vector3Line", children: [_jsx("div", { className: "firstLine", children: _jsx("div", { className: "label", title: this.props.label, children: this.props.label }) }), _jsx("div", { className: "secondLine", children: _jsx(OptionsLineComponent, { label: "Mode", className: "no-right-margin", options: modeOptions, target: this, noDirectUpdate: true, propertyName: "", extractValue: () => {
+                            return this.state.mode;
+                        }, onSelect: (value) => {
+                            this.props.target[this.props.propertyName] = Matrix.Identity();
+                            Matrix.IdentityToRef(this.state.value);
+                            this.setState({ mode: value, angle: 0 });
+                            this.updateMatrix();
+                            if (this.props.onModeChange) {
+                                this.props.onModeChange(value);
+                            }
+                        } }) }), this.state.mode === 0 && (_jsxs("div", { className: "secondLine", children: [_jsx(Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #0", value: this.state.value.getRow(0), onChange: (value) => this.updateRow(value, 0) }), _jsx(Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #1", value: this.state.value.getRow(1), onChange: (value) => this.updateRow(value, 1) }), _jsx(Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #2", value: this.state.value.getRow(2), onChange: (value) => this.updateRow(value, 2) }), _jsx(Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #3", value: this.state.value.getRow(3), onChange: (value) => this.updateRow(value, 3) })] })), this.state.mode !== 0 && (_jsx("div", { className: "secondLine", children: _jsx(SliderLineComponent, { label: "Angle", lockObject: this.props.lockObject, minimum: 0, maximum: 2 * Math.PI, useEuler: true, step: 0.1, directValue: this.state.angle, onChange: (value) => this.updateBasedOnMode(value) }) }))] }));
+    }
+}
 //# sourceMappingURL=matrixLineComponent.js.map

package/lines/messageLineComponent.d.ts

@@ -1,12 +1,12 @@
-import * as React from "react";
-import type { IconProp } from "@fortawesome/fontawesome-svg-core";
-interface IMessageLineComponentProps {
-    text: string;
-    color?: string;
-    icon?: IconProp;
-}
-export declare class MessageLineComponent extends React.Component<IMessageLineComponentProps> {
-    constructor(props: IMessageLineComponentProps);
-    render(): JSX.Element;
-}
-export {};
+import * as React from "react";
+import type { IconProp } from "@fortawesome/fontawesome-svg-core";
+interface IMessageLineComponentProps {
+    text: string;
+    color?: string;
+    icon?: IconProp;
+}
+export declare class MessageLineComponent extends React.Component<IMessageLineComponentProps> {
+    constructor(props: IMessageLineComponentProps);
+    render(): JSX.Element;
+}
+export {};

package/lines/messageLineComponent.js

@@ -1,15 +1,15 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-export class MessageLineComponent extends React.Component {
-    constructor(props) {
-        super(props);
-    }
-    render() {
-        if (this.props.icon) {
-            return (_jsxs("div", { className: "iconMessageLine", children: [_jsx("div", { className: "icon", style: { color: this.props.color ? this.props.color : "" }, children: _jsx(FontAwesomeIcon, { icon: this.props.icon }) }), _jsx("div", { className: "value", title: this.props.text, children: this.props.text })] }));
-        }
-        return (_jsx("div", { className: "messageLine", children: _jsx("div", { className: "value", title: this.props.text, style: { color: this.props.color ? this.props.color : "" }, children: this.props.text }) }));
-    }
-}
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+export class MessageLineComponent extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        if (this.props.icon) {
+            return (_jsxs("div", { className: "iconMessageLine", children: [_jsx("div", { className: "icon", style: { color: this.props.color ? this.props.color : "" }, children: _jsx(FontAwesomeIcon, { icon: this.props.icon }) }), _jsx("div", { className: "value", title: this.props.text, children: this.props.text })] }));
+        }
+        return (_jsx("div", { className: "messageLine", children: _jsx("div", { className: "value", title: this.props.text, style: { color: this.props.color ? this.props.color : "" }, children: this.props.text }) }));
+    }
+}
 //# sourceMappingURL=messageLineComponent.js.map

package/lines/numericInputComponent.d.ts

@@ -1,31 +1,31 @@
-import * as React from "react";
-import type { LockObject } from "../tabs/propertyGrids/lockObject";
-interface INumericInputComponentProps {
-    label: string;
-    value: number;
-    step?: number;
-    onChange: (value: number) => void;
-    precision?: number;
-    icon?: string;
-    iconLabel?: string;
-    lockObject: LockObject;
-}
-export declare class NumericInputComponent extends React.Component<INumericInputComponentProps, {
-    value: string;
-}> {
-    static defaultProps: {
-        step: number;
-    };
-    private _localChange;
-    constructor(props: INumericInputComponentProps);
-    componentWillUnmount(): void;
-    shouldComponentUpdate(nextProps: INumericInputComponentProps, nextState: {
-        value: string;
-    }): boolean;
-    updateValue(valueString: string): void;
-    onBlur(): void;
-    incrementValue(amount: number): void;
-    onKeyDown(evt: React.KeyboardEvent<HTMLInputElement>): void;
-    render(): JSX.Element;
-}
-export {};
+import * as React from "react";
+import type { LockObject } from "../tabs/propertyGrids/lockObject";
+interface INumericInputComponentProps {
+    label: string;
+    value: number;
+    step?: number;
+    onChange: (value: number) => void;
+    precision?: number;
+    icon?: string;
+    iconLabel?: string;
+    lockObject: LockObject;
+}
+export declare class NumericInputComponent extends React.Component<INumericInputComponentProps, {
+    value: string;
+}> {
+    static defaultProps: {
+        step: number;
+    };
+    private _localChange;
+    constructor(props: INumericInputComponentProps);
+    componentWillUnmount(): void;
+    shouldComponentUpdate(nextProps: INumericInputComponentProps, nextState: {
+        value: string;
+    }): boolean;
+    updateValue(valueString: string): void;
+    onBlur(): void;
+    incrementValue(amount: number): void;
+    onKeyDown(evt: React.KeyboardEvent<HTMLInputElement>): void;
+    render(): JSX.Element;
+}
+export {};