@babylonjs/shared-ui-components 5.28.0 → 5.30.0

package/lines/radioLineComponent.d.ts

@@ -1,21 +1,21 @@
-import * as React from "react";
-import type { Observable } from "@babylonjs/core/Misc/observable.js";
-interface IRadioButtonLineComponentProps {
-    onSelectionChangedObservable: Observable<RadioButtonLineComponent>;
-    label: string;
-    isSelected: () => boolean;
-    onSelect: () => void;
-    icon?: string;
-    iconLabel?: string;
-}
-export declare class RadioButtonLineComponent extends React.Component<IRadioButtonLineComponentProps, {
-    isSelected: boolean;
-}> {
-    private _onSelectionChangedObserver;
-    constructor(props: IRadioButtonLineComponentProps);
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    onChange(): void;
-    render(): JSX.Element;
-}
-export {};
+import * as React from "react";
+import type { Observable } from "@babylonjs/core/Misc/observable.js";
+interface IRadioButtonLineComponentProps {
+    onSelectionChangedObservable: Observable<RadioButtonLineComponent>;
+    label: string;
+    isSelected: () => boolean;
+    onSelect: () => void;
+    icon?: string;
+    iconLabel?: string;
+}
+export declare class RadioButtonLineComponent extends React.Component<IRadioButtonLineComponentProps, {
+    isSelected: boolean;
+}> {
+    private _onSelectionChangedObserver;
+    constructor(props: IRadioButtonLineComponentProps);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    onChange(): void;
+    render(): JSX.Element;
+}
+export {};

package/lines/radioLineComponent.js

@@ -1,27 +1,27 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-export class RadioButtonLineComponent extends React.Component {
-    constructor(props) {
-        super(props);
-        this.state = { isSelected: this.props.isSelected() };
-    }
-    componentDidMount() {
-        this._onSelectionChangedObserver = this.props.onSelectionChangedObservable.add((value) => {
-            this.setState({ isSelected: value === this });
-        });
-    }
-    componentWillUnmount() {
-        if (this._onSelectionChangedObserver) {
-            this.props.onSelectionChangedObservable.remove(this._onSelectionChangedObserver);
-            this._onSelectionChangedObserver = null;
-        }
-    }
-    onChange() {
-        this.props.onSelect();
-        this.props.onSelectionChangedObservable.notifyObservers(this);
-    }
-    render() {
-        return (_jsxs("div", { className: "radioLine", 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 }), _jsxs("div", { className: "radioContainer", children: [_jsx("input", { id: this.props.label, className: "radio", type: "radio", checked: this.state.isSelected, onChange: () => this.onChange() }), _jsx("label", { htmlFor: this.props.label, className: "labelForRadio" })] })] }));
-    }
-}
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+export class RadioButtonLineComponent extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = { isSelected: this.props.isSelected() };
+    }
+    componentDidMount() {
+        this._onSelectionChangedObserver = this.props.onSelectionChangedObservable.add((value) => {
+            this.setState({ isSelected: value === this });
+        });
+    }
+    componentWillUnmount() {
+        if (this._onSelectionChangedObserver) {
+            this.props.onSelectionChangedObservable.remove(this._onSelectionChangedObserver);
+            this._onSelectionChangedObserver = null;
+        }
+    }
+    onChange() {
+        this.props.onSelect();
+        this.props.onSelectionChangedObservable.notifyObservers(this);
+    }
+    render() {
+        return (_jsxs("div", { className: "radioLine", 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 }), _jsxs("div", { className: "radioContainer", children: [_jsx("input", { id: this.props.label, className: "radio", type: "radio", checked: this.state.isSelected, onChange: () => this.onChange() }), _jsx("label", { htmlFor: this.props.label, className: "labelForRadio" })] })] }));
+    }
+}
 //# sourceMappingURL=radioLineComponent.js.map

package/lines/sliderLineComponent.d.ts

@@ -1,37 +1,37 @@
-import * as React from "react";
-import type { Observable } from "@babylonjs/core/Misc/observable.js";
-import type { PropertyChangedEvent } from "../propertyChangedEvent";
-import type { LockObject } from "../tabs/propertyGrids/lockObject";
-interface ISliderLineComponentProps {
-    label: string;
-    target?: any;
-    propertyName?: string;
-    minimum: number;
-    maximum: number;
-    step: number;
-    directValue?: number;
-    useEuler?: boolean;
-    onChange?: (value: number) => void;
-    onInput?: (value: number) => void;
-    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
-    decimalCount?: number;
-    margin?: boolean;
-    icon?: string;
-    iconLabel?: string;
-    lockObject: LockObject;
-    unit?: React.ReactNode;
-}
-export declare class SliderLineComponent extends React.Component<ISliderLineComponentProps, {
-    value: number;
-}> {
-    private _localChange;
-    constructor(props: ISliderLineComponentProps);
-    shouldComponentUpdate(nextProps: ISliderLineComponentProps, nextState: {
-        value: number;
-    }): boolean;
-    onChange(newValueString: any): void;
-    onInput(newValueString: any): void;
-    prepareDataToRead(value: number): number;
-    render(): JSX.Element;
-}
-export {};
+import * as React from "react";
+import type { Observable } from "@babylonjs/core/Misc/observable.js";
+import type { PropertyChangedEvent } from "../propertyChangedEvent";
+import type { LockObject } from "../tabs/propertyGrids/lockObject";
+interface ISliderLineComponentProps {
+    label: string;
+    target?: any;
+    propertyName?: string;
+    minimum: number;
+    maximum: number;
+    step: number;
+    directValue?: number;
+    useEuler?: boolean;
+    onChange?: (value: number) => void;
+    onInput?: (value: number) => void;
+    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+    decimalCount?: number;
+    margin?: boolean;
+    icon?: string;
+    iconLabel?: string;
+    lockObject: LockObject;
+    unit?: React.ReactNode;
+}
+export declare class SliderLineComponent extends React.Component<ISliderLineComponentProps, {
+    value: number;
+}> {
+    private _localChange;
+    constructor(props: ISliderLineComponentProps);
+    shouldComponentUpdate(nextProps: ISliderLineComponentProps, nextState: {
+        value: number;
+    }): boolean;
+    onChange(newValueString: any): void;
+    onInput(newValueString: any): void;
+    prepareDataToRead(value: number): number;
+    render(): JSX.Element;
+}
+export {};

package/lines/sliderLineComponent.js

@@ -1,90 +1,90 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import { Tools } from "@babylonjs/core/Misc/tools.js";
-import { FloatLineComponent } from "./floatLineComponent.js";
-export class SliderLineComponent extends React.Component {
-    constructor(props) {
-        super(props);
-        this._localChange = false;
-        if (this.props.directValue !== undefined) {
-            this.state = {
-                value: this.props.directValue,
-            };
-        }
-        else {
-            let value = this.props.target[this.props.propertyName];
-            if (value === undefined) {
-                value = this.props.maximum;
-            }
-            this.state = { value: value };
-        }
-    }
-    shouldComponentUpdate(nextProps, nextState) {
-        if (nextProps.directValue !== undefined) {
-            nextState.value = nextProps.directValue;
-            return true;
-        }
-        let currentState = nextProps.target[nextProps.propertyName];
-        if (currentState === undefined) {
-            currentState = nextProps.maximum;
-        }
-        if (currentState !== nextState.value || this._localChange || nextProps.maximum !== this.props.maximum || nextProps.minimum !== this.props.minimum) {
-            nextState.value = currentState;
-            this._localChange = false;
-            return true;
-        }
-        if (nextProps.unit !== this.props.unit) {
-            return true;
-        }
-        return false;
-    }
-    onChange(newValueString) {
-        if (newValueString === "—")
-            return;
-        this._localChange = true;
-        let newValue = parseFloat(newValueString);
-        if (this.props.useEuler) {
-            newValue = Tools.ToRadians(newValue);
-        }
-        if (this.props.target) {
-            if (this.props.onPropertyChangedObservable) {
-                this.props.onPropertyChangedObservable.notifyObservers({
-                    object: this.props.target,
-                    property: this.props.propertyName,
-                    value: newValue,
-                    initialValue: this.state.value,
-                });
-            }
-            this.props.target[this.props.propertyName] = newValue;
-        }
-        if (this.props.onChange) {
-            this.props.onChange(newValue);
-        }
-        this.setState({ value: newValue });
-    }
-    onInput(newValueString) {
-        const newValue = parseFloat(newValueString);
-        if (this.props.onInput) {
-            this.props.onInput(newValue);
-        }
-    }
-    prepareDataToRead(value) {
-        if (value === null) {
-            value = 0;
-        }
-        if (this.props.useEuler) {
-            return Tools.ToDegrees(value);
-        }
-        return value;
-    }
-    render() {
-        return (_jsxs("div", { className: "sliderLine", children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (!this.props.icon || this.props.label != "") && (_jsx("div", { className: this.props.margin ? "label withMargins" : "label", title: this.props.label, children: this.props.label })), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, isInteger: this.props.decimalCount === 0, smallUI: true, label: "", target: this.state, digits: this.props.decimalCount === undefined ? 4 : this.props.decimalCount, propertyName: "value", min: this.props.minimum, max: this.props.maximum, onEnter: () => {
-                        const changed = this.prepareDataToRead(this.state.value);
-                        this.onChange(changed);
-                    }, onChange: () => {
-                        const changed = this.prepareDataToRead(this.state.value);
-                        this.onChange(changed);
-                    }, onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: this.props.unit }), _jsx("div", { className: "slider", children: _jsx("input", { className: "range", type: "range", step: this.props.step, min: this.prepareDataToRead(this.props.minimum), max: this.prepareDataToRead(this.props.maximum), value: this.prepareDataToRead(this.state.value), onInput: (evt) => this.onInput(evt.target.value), onChange: (evt) => this.onChange(evt.target.value) }) })] }));
-    }
-}
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Tools } from "@babylonjs/core/Misc/tools.js";
+import { FloatLineComponent } from "./floatLineComponent.js";
+export class SliderLineComponent extends React.Component {
+    constructor(props) {
+        super(props);
+        this._localChange = false;
+        if (this.props.directValue !== undefined) {
+            this.state = {
+                value: this.props.directValue,
+            };
+        }
+        else {
+            let value = this.props.target[this.props.propertyName];
+            if (value === undefined) {
+                value = this.props.maximum;
+            }
+            this.state = { value: value };
+        }
+    }
+    shouldComponentUpdate(nextProps, nextState) {
+        if (nextProps.directValue !== undefined) {
+            nextState.value = nextProps.directValue;
+            return true;
+        }
+        let currentState = nextProps.target[nextProps.propertyName];
+        if (currentState === undefined) {
+            currentState = nextProps.maximum;
+        }
+        if (currentState !== nextState.value || this._localChange || nextProps.maximum !== this.props.maximum || nextProps.minimum !== this.props.minimum) {
+            nextState.value = currentState;
+            this._localChange = false;
+            return true;
+        }
+        if (nextProps.unit !== this.props.unit) {
+            return true;
+        }
+        return false;
+    }
+    onChange(newValueString) {
+        if (newValueString === "—")
+            return;
+        this._localChange = true;
+        let newValue = parseFloat(newValueString);
+        if (this.props.useEuler) {
+            newValue = Tools.ToRadians(newValue);
+        }
+        if (this.props.target) {
+            if (this.props.onPropertyChangedObservable) {
+                this.props.onPropertyChangedObservable.notifyObservers({
+                    object: this.props.target,
+                    property: this.props.propertyName,
+                    value: newValue,
+                    initialValue: this.state.value,
+                });
+            }
+            this.props.target[this.props.propertyName] = newValue;
+        }
+        if (this.props.onChange) {
+            this.props.onChange(newValue);
+        }
+        this.setState({ value: newValue });
+    }
+    onInput(newValueString) {
+        const newValue = parseFloat(newValueString);
+        if (this.props.onInput) {
+            this.props.onInput(newValue);
+        }
+    }
+    prepareDataToRead(value) {
+        if (value === null) {
+            value = 0;
+        }
+        if (this.props.useEuler) {
+            return Tools.ToDegrees(value);
+        }
+        return value;
+    }
+    render() {
+        return (_jsxs("div", { className: "sliderLine", children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (!this.props.icon || this.props.label != "") && (_jsx("div", { className: this.props.margin ? "label withMargins" : "label", title: this.props.label, children: this.props.label })), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, isInteger: this.props.decimalCount === 0, smallUI: true, label: "", target: this.state, digits: this.props.decimalCount === undefined ? 4 : this.props.decimalCount, propertyName: "value", min: this.props.minimum, max: this.props.maximum, onEnter: () => {
+                        const changed = this.prepareDataToRead(this.state.value);
+                        this.onChange(changed);
+                    }, onChange: () => {
+                        const changed = this.prepareDataToRead(this.state.value);
+                        this.onChange(changed);
+                    }, onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: this.props.unit }), _jsx("div", { className: "slider", children: _jsx("input", { className: "range", type: "range", step: this.props.step, min: this.prepareDataToRead(this.props.minimum), max: this.prepareDataToRead(this.props.maximum), value: this.prepareDataToRead(this.state.value), onInput: (evt) => this.onInput(evt.target.value), onChange: (evt) => this.onChange(evt.target.value) }) })] }));
+    }
+}
 //# sourceMappingURL=sliderLineComponent.js.map

package/lines/targetsProxy.d.ts

@@ -1,11 +1,11 @@
-import type { PropertyChangedEvent } from "../propertyChangedEvent";
-import type { Observable } from "@babylonjs/core/Misc/observable.js";
-export declare const conflictingValuesPlaceholder = "\u2014";
-/**
- *
- * @param targets a list of selected targets
- * @param onPropertyChangedObservable
- * @param getProperty
- * @returns a proxy object that can be passed as a target into the input
- */
-export declare function makeTargetsProxy<Type>(targets: Type[], onPropertyChangedObservable?: Observable<PropertyChangedEvent>, getProperty?: (target: Type, property: keyof Type) => any): any;
+import type { PropertyChangedEvent } from "../propertyChangedEvent";
+import type { Observable } from "@babylonjs/core/Misc/observable.js";
+export declare const conflictingValuesPlaceholder = "\u2014";
+/**
+ *
+ * @param targets a list of selected targets
+ * @param onPropertyChangedObservable
+ * @param getProperty
+ * @returns a proxy object that can be passed as a target into the input
+ */
+export declare function makeTargetsProxy<Type>(targets: Type[], onPropertyChangedObservable?: Observable<PropertyChangedEvent>, getProperty?: (target: Type, property: keyof Type) => any): any;

package/lines/targetsProxy.js

@@ -1,43 +1,43 @@
-export const conflictingValuesPlaceholder = "—";
-/**
- *
- * @param targets a list of selected targets
- * @param onPropertyChangedObservable
- * @param getProperty
- * @returns a proxy object that can be passed as a target into the input
- */
-export function makeTargetsProxy(targets, onPropertyChangedObservable, getProperty = (target, property) => target[property]) {
-    return new Proxy({}, {
-        get(_, name) {
-            const property = name;
-            if (targets.length === 0)
-                return conflictingValuesPlaceholder;
-            const firstValue = getProperty(targets[0], property);
-            for (const target of targets) {
-                if (getProperty(target, property) !== firstValue) {
-                    return conflictingValuesPlaceholder;
-                }
-            }
-            return firstValue;
-        },
-        set(_, name, value) {
-            if (value === "—")
-                return true;
-            const property = name;
-            for (const target of targets) {
-                const initialValue = target[property];
-                target[property] = value;
-                if (onPropertyChangedObservable) {
-                    onPropertyChangedObservable.notifyObservers({
-                        object: target,
-                        property: name,
-                        value: target[property],
-                        initialValue,
-                    });
-                }
-            }
-            return true;
-        },
-    });
-}
+export const conflictingValuesPlaceholder = "—";
+/**
+ *
+ * @param targets a list of selected targets
+ * @param onPropertyChangedObservable
+ * @param getProperty
+ * @returns a proxy object that can be passed as a target into the input
+ */
+export function makeTargetsProxy(targets, onPropertyChangedObservable, getProperty = (target, property) => target[property]) {
+    return new Proxy({}, {
+        get(_, name) {
+            const property = name;
+            if (targets.length === 0)
+                return conflictingValuesPlaceholder;
+            const firstValue = getProperty(targets[0], property);
+            for (const target of targets) {
+                if (getProperty(target, property) !== firstValue) {
+                    return conflictingValuesPlaceholder;
+                }
+            }
+            return firstValue;
+        },
+        set(_, name, value) {
+            if (value === "—")
+                return true;
+            const property = name;
+            for (const target of targets) {
+                const initialValue = target[property];
+                target[property] = value;
+                if (onPropertyChangedObservable) {
+                    onPropertyChangedObservable.notifyObservers({
+                        object: target,
+                        property: name,
+                        value: target[property],
+                        initialValue,
+                    });
+                }
+            }
+            return true;
+        },
+    });
+}
 //# sourceMappingURL=targetsProxy.js.map

package/lines/textInputLineComponent.d.ts

@@ -1,47 +1,47 @@
-import * as React from "react";
-import type { Observable } from "@babylonjs/core/Misc/observable.js";
-import type { PropertyChangedEvent } from "../propertyChangedEvent";
-import type { LockObject } from "../tabs/propertyGrids/lockObject";
-export 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;
-    arrows?: boolean;
-    arrowsIncrement?: (amount: number) => void;
-    step?: number;
-    numeric?: boolean;
-    roundValues?: boolean;
-    min?: number;
-    max?: number;
-    placeholder?: string;
-    unit?: React.ReactNode;
-    validator?: (value: string) => boolean;
-    multilines?: boolean;
-}
-export declare class TextInputLineComponent extends React.Component<ITextInputLineComponentProps, {
-    value: string;
-    dragging: boolean;
-}> {
-    private _localChange;
-    constructor(props: ITextInputLineComponentProps);
-    componentWillUnmount(): void;
-    shouldComponentUpdate(nextProps: ITextInputLineComponentProps, nextState: {
-        value: string;
-        dragging: boolean;
-    }): boolean;
-    raiseOnPropertyChanged(newValue: string, previousValue: string): void;
-    getCurrentNumericValue(value: string): number;
-    updateValue(value: string, valueToValidate?: string): void;
-    incrementValue(amount: number): void;
-    onKeyDown(event: React.KeyboardEvent): 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 { LockObject } from "../tabs/propertyGrids/lockObject";
+export 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;
+    arrows?: boolean;
+    arrowsIncrement?: (amount: number) => void;
+    step?: number;
+    numeric?: boolean;
+    roundValues?: boolean;
+    min?: number;
+    max?: number;
+    placeholder?: string;
+    unit?: React.ReactNode;
+    validator?: (value: string) => boolean;
+    multilines?: boolean;
+}
+export declare class TextInputLineComponent extends React.Component<ITextInputLineComponentProps, {
+    value: string;
+    dragging: boolean;
+}> {
+    private _localChange;
+    constructor(props: ITextInputLineComponentProps);
+    componentWillUnmount(): void;
+    shouldComponentUpdate(nextProps: ITextInputLineComponentProps, nextState: {
+        value: string;
+        dragging: boolean;
+    }): boolean;
+    raiseOnPropertyChanged(newValue: string, previousValue: string): void;
+    getCurrentNumericValue(value: string): number;
+    updateValue(value: string, valueToValidate?: string): void;
+    incrementValue(amount: number): void;
+    onKeyDown(event: React.KeyboardEvent): void;
+    render(): JSX.Element;
+}