@babylonjs/shared-ui-components 5.28.0 → 5.29.0

package/components/lines/ColorPickerLineComponent.js

@@ -1,62 +1,62 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import { ColorPicker } from "../colorPicker/ColorPicker.js";
-import style from "./ColorPickerLineComponent.modules.scss";
-export class ColorPickerLineComponent extends React.Component {
-    constructor(props) {
-        super(props);
-        this.state = { pickerEnabled: false, color: this.props.value, hex: this.getHexString(props) };
-        this._floatRef = React.createRef();
-        this._floatHostRef = React.createRef();
-        this._coverRef = React.createRef();
-    }
-    syncPositions() {
-        const div = this._floatRef.current;
-        const host = this._floatHostRef.current;
-        if (!div || !host) {
-            return;
-        }
-        let top = host.getBoundingClientRect().top;
-        const height = div.getBoundingClientRect().height;
-        if (top + height + 10 > window.innerHeight) {
-            top = window.innerHeight - height - 10;
-        }
-        div.style.top = top + "px";
-        if (!this.props.shouldPopRight) {
-            div.style.left = host.getBoundingClientRect().left - div.getBoundingClientRect().width + "px";
-        }
-        else {
-            div.style.left = host.getBoundingClientRect().left + "px";
-        }
-    }
-    shouldComponentUpdate(nextProps, nextState) {
-        const diffProps = this.getHexString(nextProps) !== this.getHexString();
-        if (diffProps) {
-            nextState.color = nextProps.value;
-            nextState.hex = this.getHexString(nextProps);
-        }
-        return diffProps || nextState.hex !== this.state.hex || nextState.pickerEnabled !== this.state.pickerEnabled;
-    }
-    getHexString(props = this.props) {
-        return props.value.toHexString();
-    }
-    componentDidUpdate() {
-        this.syncPositions();
-    }
-    componentDidMount() {
-        this.syncPositions();
-    }
-    render() {
-        return (_jsxs("div", { className: style.colorPicker, children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), _jsx("div", { className: style.colorRectBackground, ref: this._floatHostRef, onClick: () => this.setState({ pickerEnabled: true }), children: _jsx("div", { className: style.colorRect, style: { background: this.state.hex } }) }), this.state.pickerEnabled && (_jsx(_Fragment, { children: _jsx("div", { ref: this._coverRef, className: style.colorPickerCover, onClick: (evt) => {
-                            if (evt.target !== this._coverRef.current) {
-                                return;
-                            }
-                            this.setState({ pickerEnabled: false });
-                        }, children: _jsx("div", { className: style.colorPickerFloat, ref: this._floatRef, children: _jsx(ColorPicker, { backgroundColor: this.props.backgroundColor, lockObject: this.props.lockObject || {}, color: this.state.color, linearhint: this.props.linearHint, onColorChanged: (color) => {
-                                    const hex = color.toHexString();
-                                    this.setState({ hex, color });
-                                    this.props.onColorChanged(hex);
-                                } }) }) }) }))] }));
-    }
-}
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { ColorPicker } from "../colorPicker/ColorPicker.js";
+import style from "./ColorPickerLineComponent.modules.scss";
+export class ColorPickerLineComponent extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = { pickerEnabled: false, color: this.props.value, hex: this.getHexString(props) };
+        this._floatRef = React.createRef();
+        this._floatHostRef = React.createRef();
+        this._coverRef = React.createRef();
+    }
+    syncPositions() {
+        const div = this._floatRef.current;
+        const host = this._floatHostRef.current;
+        if (!div || !host) {
+            return;
+        }
+        let top = host.getBoundingClientRect().top;
+        const height = div.getBoundingClientRect().height;
+        if (top + height + 10 > window.innerHeight) {
+            top = window.innerHeight - height - 10;
+        }
+        div.style.top = top + "px";
+        if (!this.props.shouldPopRight) {
+            div.style.left = host.getBoundingClientRect().left - div.getBoundingClientRect().width + "px";
+        }
+        else {
+            div.style.left = host.getBoundingClientRect().left + "px";
+        }
+    }
+    shouldComponentUpdate(nextProps, nextState) {
+        const diffProps = this.getHexString(nextProps) !== this.getHexString();
+        if (diffProps) {
+            nextState.color = nextProps.value;
+            nextState.hex = this.getHexString(nextProps);
+        }
+        return diffProps || nextState.hex !== this.state.hex || nextState.pickerEnabled !== this.state.pickerEnabled;
+    }
+    getHexString(props = this.props) {
+        return props.value.toHexString();
+    }
+    componentDidUpdate() {
+        this.syncPositions();
+    }
+    componentDidMount() {
+        this.syncPositions();
+    }
+    render() {
+        return (_jsxs("div", { className: style.colorPicker, children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), _jsx("div", { className: style.colorRectBackground, ref: this._floatHostRef, onClick: () => this.setState({ pickerEnabled: true }), children: _jsx("div", { className: style.colorRect, style: { background: this.state.hex } }) }), this.state.pickerEnabled && (_jsx(_Fragment, { children: _jsx("div", { ref: this._coverRef, className: style.colorPickerCover, onClick: (evt) => {
+                            if (evt.target !== this._coverRef.current) {
+                                return;
+                            }
+                            this.setState({ pickerEnabled: false });
+                        }, children: _jsx("div", { className: style.colorPickerFloat, ref: this._floatRef, children: _jsx(ColorPicker, { backgroundColor: this.props.backgroundColor, lockObject: this.props.lockObject || {}, color: this.state.color, linearhint: this.props.linearHint, onColorChanged: (color) => {
+                                    const hex = color.toHexString();
+                                    this.setState({ hex, color });
+                                    this.props.onColorChanged(hex);
+                                } }) }) }) }))] }));
+    }
+}
 //# sourceMappingURL=ColorPickerLineComponent.js.map

package/components/lines/FileButtonLineComponent.d.ts

@@ -1,16 +1,16 @@
-import * as React from "react";
-export interface IFileButtonLineComponentProps {
-    label: string;
-    onClick: (file: File) => void;
-    accept: string;
-    icon?: string;
-    iconLabel?: string;
-}
-export declare class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {
-    private static _IDGenerator;
-    private _id;
-    private _uploadInputRef;
-    constructor(props: IFileButtonLineComponentProps);
-    onChange(evt: any): void;
-    render(): JSX.Element;
-}
+import * as React from "react";
+export interface IFileButtonLineComponentProps {
+    label: string;
+    onClick: (file: File) => void;
+    accept: string;
+    icon?: string;
+    iconLabel?: string;
+}
+export declare class FileButtonLineComponent extends React.Component<IFileButtonLineComponentProps> {
+    private static _IDGenerator;
+    private _id;
+    private _uploadInputRef;
+    constructor(props: IFileButtonLineComponentProps);
+    onChange(evt: any): void;
+    render(): JSX.Element;
+}

package/components/lines/FileButtonLineComponent.js

@@ -1,22 +1,22 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import styles from "./FileButtonLineComponent.modules.scss";
-export class FileButtonLineComponent extends React.Component {
-    constructor(props) {
-        super(props);
-        this._id = FileButtonLineComponent._IDGenerator++;
-        this._uploadInputRef = React.createRef();
-    }
-    onChange(evt) {
-        const files = evt.target.files;
-        if (files && files.length) {
-            this.props.onClick(files[0]);
-        }
-        evt.target.value = "";
-    }
-    render() {
-        return (_jsxs("div", { className: styles.buttonLine, children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel }), _jsx("label", { htmlFor: "file-upload" + this._id, className: styles.fileUpload, children: this.props.label }), _jsx("input", { ref: this._uploadInputRef, id: "file-upload" + this._id, type: "file", accept: this.props.accept, onChange: (evt) => this.onChange(evt) })] }));
-    }
-}
-FileButtonLineComponent._IDGenerator = 0;
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import styles from "./FileButtonLineComponent.modules.scss";
+export class FileButtonLineComponent extends React.Component {
+    constructor(props) {
+        super(props);
+        this._id = FileButtonLineComponent._IDGenerator++;
+        this._uploadInputRef = React.createRef();
+    }
+    onChange(evt) {
+        const files = evt.target.files;
+        if (files && files.length) {
+            this.props.onClick(files[0]);
+        }
+        evt.target.value = "";
+    }
+    render() {
+        return (_jsxs("div", { className: styles.buttonLine, children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel }), _jsx("label", { htmlFor: "file-upload" + this._id, className: styles.fileUpload, children: this.props.label }), _jsx("input", { ref: this._uploadInputRef, id: "file-upload" + this._id, type: "file", accept: this.props.accept, onChange: (evt) => this.onChange(evt) })] }));
+    }
+}
+FileButtonLineComponent._IDGenerator = 0;
 //# sourceMappingURL=FileButtonLineComponent.js.map

package/components/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 {};

package/components/lines/NumericInputComponent.js

@@ -1,87 +1,87 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import style from "./NumericInputComponent.modules.scss";
-export class NumericInputComponent extends React.Component {
-    constructor(props) {
-        super(props);
-        this._localChange = false;
-        this.state = { value: this.props.value.toFixed(this.props.precision !== undefined ? this.props.precision : 3) };
-    }
-    componentWillUnmount() {
-        if (this.props.lockObject) {
-            this.props.lockObject.lock = false;
-        }
-    }
-    shouldComponentUpdate(nextProps, nextState) {
-        if (this._localChange) {
-            return true;
-        }
-        if (nextProps.value.toString() !== nextState.value) {
-            nextState.value = nextProps.value.toFixed(this.props.precision !== undefined ? this.props.precision : 3);
-            return true;
-        }
-        return false;
-    }
-    updateValue(valueString) {
-        if (/[^0-9.-]/g.test(valueString)) {
-            return;
-        }
-        const valueAsNumber = parseFloat(valueString);
-        this._localChange = true;
-        this.setState({ value: valueString });
-        if (isNaN(valueAsNumber)) {
-            return;
-        }
-        this.props.onChange(valueAsNumber);
-    }
-    onBlur() {
-        this._localChange = false;
-        const valueAsNumber = parseFloat(this.state.value);
-        if (this.props.lockObject) {
-            this.props.lockObject.lock = false;
-        }
-        if (isNaN(valueAsNumber)) {
-            this.props.onChange(this.props.value);
-            return;
-        }
-        this.props.onChange(valueAsNumber);
-    }
-    incrementValue(amount) {
-        let currentValue = parseFloat(this.state.value);
-        if (isNaN(currentValue)) {
-            currentValue = 0;
-        }
-        this.updateValue((currentValue + amount).toFixed(this.props.precision !== undefined ? this.props.precision : 3));
-    }
-    onKeyDown(evt) {
-        const step = this.props.step || 1;
-        const handleArrowKey = (sign) => {
-            if (evt.shiftKey) {
-                sign *= 10;
-                if (evt.ctrlKey || evt.metaKey) {
-                    sign *= 10;
-                }
-            }
-            this.incrementValue(sign * step);
-            evt.preventDefault();
-        };
-        if (evt.key === "ArrowUp") {
-            handleArrowKey(1);
-        }
-        else if (evt.key === "ArrowDown") {
-            handleArrowKey(-1);
-        }
-    }
-    render() {
-        return (_jsxs("div", { className: style.numeric, children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), this.props.label && (_jsx("div", { className: style.numericLabel, title: this.props.label, children: `${this.props.label}: ` })), _jsx("input", { type: "number", step: this.props.step, className: style.numericInput, value: this.state.value, onChange: (evt) => this.updateValue(evt.target.value), onKeyDown: (evt) => this.onKeyDown(evt), onFocus: () => {
-                        if (this.props.lockObject) {
-                            this.props.lockObject.lock = true;
-                        }
-                    }, onBlur: () => this.onBlur() })] }));
-    }
-}
-// eslint-disable-next-line @typescript-eslint/naming-convention
-NumericInputComponent.defaultProps = {
-    step: 1,
-};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import style from "./NumericInputComponent.modules.scss";
+export class NumericInputComponent extends React.Component {
+    constructor(props) {
+        super(props);
+        this._localChange = false;
+        this.state = { value: this.props.value.toFixed(this.props.precision !== undefined ? this.props.precision : 3) };
+    }
+    componentWillUnmount() {
+        if (this.props.lockObject) {
+            this.props.lockObject.lock = false;
+        }
+    }
+    shouldComponentUpdate(nextProps, nextState) {
+        if (this._localChange) {
+            return true;
+        }
+        if (nextProps.value.toString() !== nextState.value) {
+            nextState.value = nextProps.value.toFixed(this.props.precision !== undefined ? this.props.precision : 3);
+            return true;
+        }
+        return false;
+    }
+    updateValue(valueString) {
+        if (/[^0-9.-]/g.test(valueString)) {
+            return;
+        }
+        const valueAsNumber = parseFloat(valueString);
+        this._localChange = true;
+        this.setState({ value: valueString });
+        if (isNaN(valueAsNumber)) {
+            return;
+        }
+        this.props.onChange(valueAsNumber);
+    }
+    onBlur() {
+        this._localChange = false;
+        const valueAsNumber = parseFloat(this.state.value);
+        if (this.props.lockObject) {
+            this.props.lockObject.lock = false;
+        }
+        if (isNaN(valueAsNumber)) {
+            this.props.onChange(this.props.value);
+            return;
+        }
+        this.props.onChange(valueAsNumber);
+    }
+    incrementValue(amount) {
+        let currentValue = parseFloat(this.state.value);
+        if (isNaN(currentValue)) {
+            currentValue = 0;
+        }
+        this.updateValue((currentValue + amount).toFixed(this.props.precision !== undefined ? this.props.precision : 3));
+    }
+    onKeyDown(evt) {
+        const step = this.props.step || 1;
+        const handleArrowKey = (sign) => {
+            if (evt.shiftKey) {
+                sign *= 10;
+                if (evt.ctrlKey || evt.metaKey) {
+                    sign *= 10;
+                }
+            }
+            this.incrementValue(sign * step);
+            evt.preventDefault();
+        };
+        if (evt.key === "ArrowUp") {
+            handleArrowKey(1);
+        }
+        else if (evt.key === "ArrowDown") {
+            handleArrowKey(-1);
+        }
+    }
+    render() {
+        return (_jsxs("div", { className: style.numeric, children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), this.props.label && (_jsx("div", { className: style.numericLabel, title: this.props.label, children: `${this.props.label}: ` })), _jsx("input", { type: "number", step: this.props.step, className: style.numericInput, value: this.state.value, onChange: (evt) => this.updateValue(evt.target.value), onKeyDown: (evt) => this.onKeyDown(evt), onFocus: () => {
+                        if (this.props.lockObject) {
+                            this.props.lockObject.lock = true;
+                        }
+                    }, onBlur: () => this.onBlur() })] }));
+    }
+}
+// eslint-disable-next-line @typescript-eslint/naming-convention
+NumericInputComponent.defaultProps = {
+    step: 1,
+};
 //# sourceMappingURL=NumericInputComponent.js.map

package/lines/booleanLineComponent.d.ts

@@ -1,11 +1,11 @@
-import * as React from "react";
-export interface IBooleanLineComponentProps {
-    label: string;
-    value: boolean;
-    icon?: string;
-    iconLabel?: string;
-}
-export declare class BooleanLineComponent extends React.Component<IBooleanLineComponentProps> {
-    constructor(props: IBooleanLineComponentProps);
-    render(): JSX.Element;
-}
+import * as React from "react";
+export interface IBooleanLineComponentProps {
+    label: string;
+    value: boolean;
+    icon?: string;
+    iconLabel?: string;
+}
+export declare class BooleanLineComponent extends React.Component<IBooleanLineComponentProps> {
+    constructor(props: IBooleanLineComponentProps);
+    render(): JSX.Element;
+}

package/lines/booleanLineComponent.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";
-import { faCheck, faTimesCircle } from "@fortawesome/free-solid-svg-icons";
-export class BooleanLineComponent extends React.Component {
-    constructor(props) {
-        super(props);
-    }
-    render() {
-        const check = this.props.value ? _jsx(FontAwesomeIcon, { icon: faCheck }) : _jsx(FontAwesomeIcon, { icon: faTimesCircle });
-        const className = this.props.value ? "value check" : "value uncheck";
-        return (_jsxs("div", { className: "textLine", children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), _jsx("div", { className: "label", title: this.props.label, children: this.props.label }), _jsx("div", { className: className, children: check })] }));
-    }
-}
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faCheck, faTimesCircle } from "@fortawesome/free-solid-svg-icons";
+export class BooleanLineComponent extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        const check = this.props.value ? _jsx(FontAwesomeIcon, { icon: faCheck }) : _jsx(FontAwesomeIcon, { icon: faTimesCircle });
+        const className = this.props.value ? "value check" : "value uncheck";
+        return (_jsxs("div", { className: "textLine", children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), _jsx("div", { className: "label", title: this.props.label, children: this.props.label }), _jsx("div", { className: className, children: check })] }));
+    }
+}
 //# sourceMappingURL=booleanLineComponent.js.map

package/lines/buttonLineComponent.d.ts

@@ -1,12 +1,12 @@
-import * as React from "react";
-export interface IButtonLineComponentProps {
-    label: string;
-    onClick: () => void;
-    icon?: string;
-    iconLabel?: string;
-    isDisabled?: boolean;
-}
-export declare class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {
-    constructor(props: IButtonLineComponentProps);
-    render(): JSX.Element;
-}
+import * as React from "react";
+export interface IButtonLineComponentProps {
+    label: string;
+    onClick: () => void;
+    icon?: string;
+    iconLabel?: string;
+    isDisabled?: boolean;
+}
+export declare class ButtonLineComponent extends React.Component<IButtonLineComponentProps> {
+    constructor(props: IButtonLineComponentProps);
+    render(): JSX.Element;
+}

package/lines/buttonLineComponent.js

@@ -1,11 +1,11 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-export class ButtonLineComponent extends React.Component {
-    constructor(props) {
-        super(props);
-    }
-    render() {
-        return (_jsxs("div", { className: "buttonLine" + (this.props.isDisabled ? " disabled" : ""), children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), _jsx("button", { onClick: () => this.props.onClick(), children: this.props.label })] }));
-    }
-}
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+export class ButtonLineComponent extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        return (_jsxs("div", { className: "buttonLine" + (this.props.isDisabled ? " disabled" : ""), children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), _jsx("button", { onClick: () => this.props.onClick(), children: this.props.label })] }));
+    }
+}
 //# sourceMappingURL=buttonLineComponent.js.map

package/lines/checkBoxLineComponent.d.ts

@@ -1,36 +1,36 @@
-import * as React from "react";
-import type { Observable } from "@babylonjs/core/Misc/observable.js";
-import type { PropertyChangedEvent } from "./../propertyChangedEvent";
-import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
-export interface ICheckBoxLineComponentProps {
-    label?: string;
-    target?: any;
-    propertyName?: string;
-    isSelected?: () => boolean;
-    onSelect?: (value: boolean) => void;
-    onValueChanged?: () => void;
-    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
-    disabled?: boolean;
-    icon?: string;
-    iconLabel?: string;
-    faIcons?: {
-        enabled: IconDefinition;
-        disabled: IconDefinition;
-    };
-    large?: boolean;
-}
-export declare 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;
-}
+import * as React from "react";
+import type { Observable } from "@babylonjs/core/Misc/observable.js";
+import type { PropertyChangedEvent } from "./../propertyChangedEvent";
+import type { IconDefinition } from "@fortawesome/fontawesome-common-types";
+export interface ICheckBoxLineComponentProps {
+    label?: string;
+    target?: any;
+    propertyName?: string;
+    isSelected?: () => boolean;
+    onSelect?: (value: boolean) => void;
+    onValueChanged?: () => void;
+    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+    disabled?: boolean;
+    icon?: string;
+    iconLabel?: string;
+    faIcons?: {
+        enabled: IconDefinition;
+        disabled: IconDefinition;
+    };
+    large?: boolean;
+}
+export declare 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;
+}