@babylonjs/shared-ui-components 5.28.0

package/tabs/propertyGrids/gui/imagePropertyGridComponent.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { CommonControlPropertyGridComponent } from "../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent.js";
+import { LineContainerComponent } from "../../../lines/lineContainerComponent.js";
+import { Image } from "@babylonjs/gui/2D/controls/image.js";
+import { FloatLineComponent } from "../../../lines/floatLineComponent.js";
+import { CheckBoxLineComponent } from "../../../lines/checkBoxLineComponent.js";
+import { OptionsLineComponent } from "../../../lines/optionsLineComponent.js";
+import { TextInputLineComponent } from "../../../lines/textInputLineComponent.js";
+export class ImagePropertyGridComponent extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        const image = this.props.image;
+        const stretchOptions = [
+            { label: "None", value: Image.STRETCH_NONE },
+            { label: "Fill", value: Image.STRETCH_FILL },
+            { label: "Uniform", value: Image.STRETCH_UNIFORM },
+            { label: "Extend", value: Image.STRETCH_EXTEND },
+            { label: "NinePatch", value: Image.STRETCH_NINE_PATCH },
+        ];
+        return (_jsxs("div", { className: "pane", children: [_jsx(CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, control: image, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsxs(LineContainerComponent, { title: "IMAGE", children: [_jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Source", target: image, propertyName: "source", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Source left", target: image, propertyName: "sourceLeft", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Source top", target: image, propertyName: "sourceTop", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Source width", target: image, propertyName: "sourceWidth", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Source height", target: image, propertyName: "sourceHeight", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(CheckBoxLineComponent, { label: "Autoscale", target: image, propertyName: "autoScale", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(OptionsLineComponent, { label: "Stretch", options: stretchOptions, target: image, propertyName: "stretch", onPropertyChangedObservable: this.props.onPropertyChangedObservable, onSelect: (value) => this.setState({ mode: value }) })] }), _jsxs(LineContainerComponent, { title: "ANIMATION SHEET", children: [_jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Cell Id", isInteger: true, target: image, propertyName: "cellId", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Cell width", target: image, propertyName: "cellWidth", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Cell height", target: image, propertyName: "cellHeight", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })] }));
+    }
+}
+//# sourceMappingURL=imagePropertyGridComponent.js.map

package/tabs/propertyGrids/gui/imagePropertyGridComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"imagePropertyGridComponent.js","sourceRoot":"","sources":["../../../../../../../dev/sharedUiComponents/src/tabs/propertyGrids/gui/imagePropertyGridComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\r\nimport type { Observable } from \"core/Misc/observable\";\r\nimport type { PropertyChangedEvent } from \"../../../propertyChangedEvent\";\r\nimport { CommonControlPropertyGridComponent } from \"../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent\";\r\nimport { LineContainerComponent } from \"../../../lines/lineContainerComponent\";\r\nimport type { LockObject } from \"../../../tabs/propertyGrids/lockObject\";\r\nimport { Image } from \"gui/2D/controls/image\";\r\nimport { FloatLineComponent } from \"../../../lines/floatLineComponent\";\r\nimport { CheckBoxLineComponent } from \"../../../lines/checkBoxLineComponent\";\r\nimport { OptionsLineComponent } from \"../../../lines/optionsLineComponent\";\r\nimport { TextInputLineComponent } from \"../../../lines/textInputLineComponent\";\r\n\r\ninterface IImagePropertyGridComponentProps {\r\n    image: Image;\r\n    lockObject: LockObject;\r\n    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n}\r\n\r\nexport class ImagePropertyGridComponent extends React.Component<IImagePropertyGridComponentProps> {\r\n    constructor(props: IImagePropertyGridComponentProps) {\r\n        super(props);\r\n    }\r\n\r\n    render() {\r\n        const image = this.props.image;\r\n\r\n        const stretchOptions = [\r\n            { label: \"None\", value: Image.STRETCH_NONE },\r\n            { label: \"Fill\", value: Image.STRETCH_FILL },\r\n            { label: \"Uniform\", value: Image.STRETCH_UNIFORM },\r\n            { label: \"Extend\", value: Image.STRETCH_EXTEND },\r\n            { label: \"NinePatch\", value: Image.STRETCH_NINE_PATCH },\r\n        ];\r\n\r\n        return (\r\n            <div className=\"pane\">\r\n                <CommonControlPropertyGridComponent lockObject={this.props.lockObject} control={image} onPropertyChangedObservable={this.props.onPropertyChangedObservable} />\r\n                <LineContainerComponent title=\"IMAGE\">\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Source\"\r\n                        target={image}\r\n                        propertyName=\"source\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Source left\"\r\n                        target={image}\r\n                        propertyName=\"sourceLeft\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Source top\"\r\n                        target={image}\r\n                        propertyName=\"sourceTop\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Source width\"\r\n                        target={image}\r\n                        propertyName=\"sourceWidth\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Source height\"\r\n                        target={image}\r\n                        propertyName=\"sourceHeight\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <CheckBoxLineComponent label=\"Autoscale\" target={image} propertyName=\"autoScale\" onPropertyChangedObservable={this.props.onPropertyChangedObservable} />\r\n                    <OptionsLineComponent\r\n                        label=\"Stretch\"\r\n                        options={stretchOptions}\r\n                        target={image}\r\n                        propertyName=\"stretch\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                        onSelect={(value) => this.setState({ mode: value })}\r\n                    />\r\n                </LineContainerComponent>\r\n                <LineContainerComponent title=\"ANIMATION SHEET\">\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Cell Id\"\r\n                        isInteger={true}\r\n                        target={image}\r\n                        propertyName=\"cellId\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Cell width\"\r\n                        target={image}\r\n                        propertyName=\"cellWidth\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Cell height\"\r\n                        target={image}\r\n                        propertyName=\"cellHeight\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                </LineContainerComponent>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"]}

package/tabs/propertyGrids/gui/inputTextPropertyGridComponent.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+import type { Observable } from "@babylonjs/core/Misc/observable.js";
+import type { PropertyChangedEvent } from "../../../propertyChangedEvent";
+import type { InputText } from "@babylonjs/gui/2D/controls/inputText.js";
+import type { LockObject } from "../../../tabs/propertyGrids/lockObject";
+interface IInputTextPropertyGridComponentProps {
+    inputText: InputText;
+    lockObject: LockObject;
+    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+}
+export declare class InputTextPropertyGridComponent extends React.Component<IInputTextPropertyGridComponentProps> {
+    constructor(props: IInputTextPropertyGridComponentProps);
+    render(): JSX.Element;
+}
+export {};

package/tabs/propertyGrids/gui/inputTextPropertyGridComponent.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { CommonControlPropertyGridComponent } from "../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent.js";
+import { LineContainerComponent } from "../../../lines/lineContainerComponent.js";
+import { TextInputLineComponent } from "../../../lines/textInputLineComponent.js";
+import { SliderLineComponent } from "../../../lines/sliderLineComponent.js";
+import { CheckBoxLineComponent } from "../../../lines/checkBoxLineComponent.js";
+import { FloatLineComponent } from "../../../lines/floatLineComponent.js";
+export class InputTextPropertyGridComponent extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        const inputText = this.props.inputText;
+        return (_jsxs("div", { className: "pane", children: [_jsx(CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, control: inputText, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsxs(LineContainerComponent, { title: "INPUTTEXT", children: [_jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Text", target: inputText, propertyName: "text", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Prompt", target: inputText, propertyName: "promptMessage", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Max width", target: inputText, propertyName: "maxWidth", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Highlight color", target: inputText, propertyName: "textHighlightColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(SliderLineComponent, { lockObject: this.props.lockObject, label: "Highligher opacity", minimum: 0, maximum: 1, step: 0.01, target: inputText, propertyName: "highligherOpacity", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(CheckBoxLineComponent, { label: "On focus select all", target: inputText, propertyName: "onFocusSelectAll", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Focused background", target: inputText, propertyName: "focusedBackground", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Max width", target: inputText, propertyName: "maxWidth", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Margin", target: inputText, propertyName: "margin", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(CheckBoxLineComponent, { label: "Auto stretch width", target: inputText, propertyName: "autoStretchWidth", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Thickness", target: inputText, propertyName: "thickness", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Placeholder text", target: inputText, propertyName: "placeholderText", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Placeholder color", target: inputText, propertyName: "placeholderColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })] }));
+    }
+}
+//# sourceMappingURL=inputTextPropertyGridComponent.js.map

package/tabs/propertyGrids/gui/inputTextPropertyGridComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inputTextPropertyGridComponent.js","sourceRoot":"","sources":["../../../../../../../dev/sharedUiComponents/src/tabs/propertyGrids/gui/inputTextPropertyGridComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\r\nimport type { Observable } from \"core/Misc/observable\";\r\nimport type { PropertyChangedEvent } from \"../../../propertyChangedEvent\";\r\nimport { CommonControlPropertyGridComponent } from \"../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent\";\r\nimport type { InputText } from \"gui/2D/controls/inputText\";\r\nimport { LineContainerComponent } from \"../../../lines/lineContainerComponent\";\r\nimport { TextInputLineComponent } from \"../../../lines/textInputLineComponent\";\r\nimport { SliderLineComponent } from \"../../../lines/sliderLineComponent\";\r\nimport { CheckBoxLineComponent } from \"../../../lines/checkBoxLineComponent\";\r\nimport { FloatLineComponent } from \"../../../lines/floatLineComponent\";\r\nimport type { LockObject } from \"../../../tabs/propertyGrids/lockObject\";\r\n\r\ninterface IInputTextPropertyGridComponentProps {\r\n    inputText: InputText;\r\n    lockObject: LockObject;\r\n    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n}\r\n\r\nexport class InputTextPropertyGridComponent extends React.Component<IInputTextPropertyGridComponentProps> {\r\n    constructor(props: IInputTextPropertyGridComponentProps) {\r\n        super(props);\r\n    }\r\n\r\n    render() {\r\n        const inputText = this.props.inputText;\r\n\r\n        return (\r\n            <div className=\"pane\">\r\n                <CommonControlPropertyGridComponent lockObject={this.props.lockObject} control={inputText} onPropertyChangedObservable={this.props.onPropertyChangedObservable} />\r\n                <LineContainerComponent title=\"INPUTTEXT\">\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Text\"\r\n                        target={inputText}\r\n                        propertyName=\"text\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Prompt\"\r\n                        target={inputText}\r\n                        propertyName=\"promptMessage\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Max width\"\r\n                        target={inputText}\r\n                        propertyName=\"maxWidth\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Highlight color\"\r\n                        target={inputText}\r\n                        propertyName=\"textHighlightColor\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <SliderLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Highligher opacity\"\r\n                        minimum={0}\r\n                        maximum={1}\r\n                        step={0.01}\r\n                        target={inputText}\r\n                        propertyName=\"highligherOpacity\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <CheckBoxLineComponent\r\n                        label=\"On focus select all\"\r\n                        target={inputText}\r\n                        propertyName=\"onFocusSelectAll\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Focused background\"\r\n                        target={inputText}\r\n                        propertyName=\"focusedBackground\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Max width\"\r\n                        target={inputText}\r\n                        propertyName=\"maxWidth\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Margin\"\r\n                        target={inputText}\r\n                        propertyName=\"margin\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <CheckBoxLineComponent\r\n                        label=\"Auto stretch width\"\r\n                        target={inputText}\r\n                        propertyName=\"autoStretchWidth\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Thickness\"\r\n                        target={inputText}\r\n                        propertyName=\"thickness\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Placeholder text\"\r\n                        target={inputText}\r\n                        propertyName=\"placeholderText\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Placeholder color\"\r\n                        target={inputText}\r\n                        propertyName=\"placeholderColor\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                </LineContainerComponent>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"]}

package/tabs/propertyGrids/gui/linePropertyGridComponent.d.ts

@@ -0,0 +1,16 @@
+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";
+import type { Line } from "@babylonjs/gui/2D/controls/line.js";
+interface ILinePropertyGridComponentProps {
+    line: Line;
+    lockObject: LockObject;
+    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+}
+export declare class LinePropertyGridComponent extends React.Component<ILinePropertyGridComponentProps> {
+    constructor(props: ILinePropertyGridComponentProps);
+    onDashChange(value: string): void;
+    render(): JSX.Element;
+}
+export {};

package/tabs/propertyGrids/gui/linePropertyGridComponent.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { CommonControlPropertyGridComponent } from "../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent.js";
+import { LineContainerComponent } from "../../../lines/lineContainerComponent.js";
+import { FloatLineComponent } from "../../../lines/floatLineComponent.js";
+import { TextInputLineComponent } from "../../../lines/textInputLineComponent.js";
+export class LinePropertyGridComponent extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    onDashChange(value) {
+        const line = this.props.line;
+        const split = value.split(",");
+        line.dash = [];
+        split.forEach((v) => {
+            const int = parseInt(v);
+            if (isNaN(int)) {
+                return;
+            }
+            line.dash.push(int);
+        });
+    }
+    render() {
+        const line = this.props.line;
+        return (_jsxs("div", { className: "pane", children: [_jsx(CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, control: line, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsxs(LineContainerComponent, { title: "LINE", children: [_jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Line width", target: line, propertyName: "lineWidth", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "X1", target: line, propertyName: "x1", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Y1", target: line, propertyName: "y1", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "X2", target: line, propertyName: "x2", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Y2", target: line, propertyName: "y2", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Dash pattern", target: line, value: line.dash.join(","), onChange: (newValue) => this.onDashChange(newValue) })] })] }));
+    }
+}
+//# sourceMappingURL=linePropertyGridComponent.js.map

package/tabs/propertyGrids/gui/linePropertyGridComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"linePropertyGridComponent.js","sourceRoot":"","sources":["../../../../../../../dev/sharedUiComponents/src/tabs/propertyGrids/gui/linePropertyGridComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\r\nimport type { Observable } from \"core/Misc/observable\";\r\nimport type { PropertyChangedEvent } from \"../../../propertyChangedEvent\";\r\nimport { CommonControlPropertyGridComponent } from \"../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent\";\r\nimport type { LockObject } from \"../../../tabs/propertyGrids/lockObject\";\r\nimport type { Line } from \"gui/2D/controls/line\";\r\nimport { LineContainerComponent } from \"../../../lines/lineContainerComponent\";\r\nimport { FloatLineComponent } from \"../../../lines/floatLineComponent\";\r\nimport { TextInputLineComponent } from \"../../../lines/textInputLineComponent\";\r\n\r\ninterface ILinePropertyGridComponentProps {\r\n    line: Line;\r\n    lockObject: LockObject;\r\n    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n}\r\n\r\nexport class LinePropertyGridComponent extends React.Component<ILinePropertyGridComponentProps> {\r\n    constructor(props: ILinePropertyGridComponentProps) {\r\n        super(props);\r\n    }\r\n\r\n    onDashChange(value: string) {\r\n        const line = this.props.line;\r\n        const split = value.split(\",\");\r\n        line.dash = [];\r\n\r\n        split.forEach((v) => {\r\n            const int = parseInt(v);\r\n\r\n            if (isNaN(int)) {\r\n                return;\r\n            }\r\n\r\n            line.dash.push(int);\r\n        });\r\n    }\r\n\r\n    render() {\r\n        const line = this.props.line;\r\n\r\n        return (\r\n            <div className=\"pane\">\r\n                <CommonControlPropertyGridComponent lockObject={this.props.lockObject} control={line} onPropertyChangedObservable={this.props.onPropertyChangedObservable} />\r\n                <LineContainerComponent title=\"LINE\">\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Line width\"\r\n                        target={line}\r\n                        propertyName=\"lineWidth\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"X1\"\r\n                        target={line}\r\n                        propertyName=\"x1\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Y1\"\r\n                        target={line}\r\n                        propertyName=\"y1\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"X2\"\r\n                        target={line}\r\n                        propertyName=\"x2\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Y2\"\r\n                        target={line}\r\n                        propertyName=\"y2\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Dash pattern\"\r\n                        target={line}\r\n                        value={line.dash.join(\",\")}\r\n                        onChange={(newValue) => this.onDashChange(newValue)}\r\n                    />\r\n                </LineContainerComponent>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"]}

package/tabs/propertyGrids/gui/radioButtonPropertyGridComponent.d.ts

@@ -0,0 +1,15 @@
+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";
+import type { RadioButton } from "@babylonjs/gui/2D/controls/radioButton.js";
+interface IRadioButtonPropertyGridComponentProps {
+    radioButtons: RadioButton[];
+    lockObject: LockObject;
+    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+}
+export declare class RadioButtonPropertyGridComponent extends React.Component<IRadioButtonPropertyGridComponentProps> {
+    constructor(props: IRadioButtonPropertyGridComponentProps);
+    render(): JSX.Element;
+}
+export {};

package/tabs/propertyGrids/gui/radioButtonPropertyGridComponent.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { CommonControlPropertyGridComponent } from "../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent.js";
+import { LineContainerComponent } from "../../../lines/lineContainerComponent.js";
+import { FloatLineComponent } from "../../../lines/floatLineComponent.js";
+import { TextInputLineComponent } from "../../../lines/textInputLineComponent.js";
+import { CheckBoxLineComponent } from "../../../lines/checkBoxLineComponent.js";
+import { makeTargetsProxy } from "../../../lines/targetsProxy.js";
+export class RadioButtonPropertyGridComponent extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        const radioButtons = this.props.radioButtons;
+        return (_jsxs("div", { className: "pane", children: [_jsx(CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, controls: radioButtons, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsxs(LineContainerComponent, { title: "RADIO BUTTON", children: [_jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Thickness", target: makeTargetsProxy(radioButtons, this.props.onPropertyChangedObservable), propertyName: "thickness", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Check size ratio", target: makeTargetsProxy(radioButtons, this.props.onPropertyChangedObservable), propertyName: "checkSizeRatio", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Group", target: makeTargetsProxy(radioButtons, this.props.onPropertyChangedObservable), propertyName: "group", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(CheckBoxLineComponent, { label: "Checked", target: makeTargetsProxy(radioButtons, this.props.onPropertyChangedObservable), propertyName: "isChecked", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })] }));
+    }
+}
+//# sourceMappingURL=radioButtonPropertyGridComponent.js.map

package/tabs/propertyGrids/gui/radioButtonPropertyGridComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radioButtonPropertyGridComponent.js","sourceRoot":"","sources":["../../../../../../../dev/sharedUiComponents/src/tabs/propertyGrids/gui/radioButtonPropertyGridComponent.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,kCAAkC,EAAE,MAAM,oEAAoE,CAAC;AAGxH,OAAO,EAAE,sBAAsB,EAAE,MAAM,uCAAuC,CAAC;AAC/E,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AACvE,OAAO,EAAE,sBAAsB,EAAE,MAAM,uCAAuC,CAAC;AAC/E,OAAO,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAC7E,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAQ/D,MAAM,OAAO,gCAAiC,SAAQ,KAAK,CAAC,SAAiD;IACzG,YAAY,KAA6C;QACrD,KAAK,CAAC,KAAK,CAAC,CAAC;IACjB,CAAC;IAED,MAAM;QACF,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC;QAE7C,OAAO,CACH,eAAK,SAAS,EAAC,MAAM,aACjB,KAAC,kCAAkC,IAC/B,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,QAAQ,EAAE,YAAY,EACtB,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,MAAC,sBAAsB,IAAC,KAAK,EAAC,cAAc,aACxC,KAAC,kBAAkB,IACf,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,WAAW,EACjB,MAAM,EAAE,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,CAAC,EAC9E,YAAY,EAAC,WAAW,EACxB,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,kBAAkB,IACf,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,kBAAkB,EACxB,MAAM,EAAE,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,CAAC,EAC9E,YAAY,EAAC,gBAAgB,EAC7B,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,sBAAsB,IACnB,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,OAAO,EACb,MAAM,EAAE,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,CAAC,EAC9E,YAAY,EAAC,OAAO,EACpB,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,qBAAqB,IAClB,KAAK,EAAC,SAAS,EACf,MAAM,EAAE,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,CAAC,EAC9E,YAAY,EAAC,WAAW,EACxB,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,IACmB,IACvB,CACT,CAAC;IACN,CAAC;CACJ","sourcesContent":["import * as React from \"react\";\r\nimport type { Observable } from \"core/Misc/observable\";\r\nimport type { PropertyChangedEvent } from \"../../../propertyChangedEvent\";\r\nimport { CommonControlPropertyGridComponent } from \"../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent\";\r\nimport type { LockObject } from \"../../../tabs/propertyGrids/lockObject\";\r\nimport type { RadioButton } from \"gui/2D/controls/radioButton\";\r\nimport { LineContainerComponent } from \"../../../lines/lineContainerComponent\";\r\nimport { FloatLineComponent } from \"../../../lines/floatLineComponent\";\r\nimport { TextInputLineComponent } from \"../../../lines/textInputLineComponent\";\r\nimport { CheckBoxLineComponent } from \"../../../lines/checkBoxLineComponent\";\r\nimport { makeTargetsProxy } from \"../../../lines/targetsProxy\";\r\n\r\ninterface IRadioButtonPropertyGridComponentProps {\r\n    radioButtons: RadioButton[];\r\n    lockObject: LockObject;\r\n    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n}\r\n\r\nexport class RadioButtonPropertyGridComponent extends React.Component<IRadioButtonPropertyGridComponentProps> {\r\n    constructor(props: IRadioButtonPropertyGridComponentProps) {\r\n        super(props);\r\n    }\r\n\r\n    render() {\r\n        const radioButtons = this.props.radioButtons;\r\n\r\n        return (\r\n            <div className=\"pane\">\r\n                <CommonControlPropertyGridComponent\r\n                    lockObject={this.props.lockObject}\r\n                    controls={radioButtons}\r\n                    onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                />\r\n                <LineContainerComponent title=\"RADIO BUTTON\">\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Thickness\"\r\n                        target={makeTargetsProxy(radioButtons, this.props.onPropertyChangedObservable)}\r\n                        propertyName=\"thickness\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Check size ratio\"\r\n                        target={makeTargetsProxy(radioButtons, this.props.onPropertyChangedObservable)}\r\n                        propertyName=\"checkSizeRatio\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Group\"\r\n                        target={makeTargetsProxy(radioButtons, this.props.onPropertyChangedObservable)}\r\n                        propertyName=\"group\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <CheckBoxLineComponent\r\n                        label=\"Checked\"\r\n                        target={makeTargetsProxy(radioButtons, this.props.onPropertyChangedObservable)}\r\n                        propertyName=\"isChecked\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                </LineContainerComponent>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"]}

package/tabs/propertyGrids/gui/rectanglePropertyGridComponent.d.ts

@@ -0,0 +1,15 @@
+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";
+import type { Rectangle } from "@babylonjs/gui/2D/controls/rectangle.js";
+interface IRectanglePropertyGridComponentProps {
+    rectangle: Rectangle;
+    lockObject: LockObject;
+    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+}
+export declare class RectanglePropertyGridComponent extends React.Component<IRectanglePropertyGridComponentProps> {
+    constructor(props: IRectanglePropertyGridComponentProps);
+    render(): JSX.Element;
+}
+export {};

package/tabs/propertyGrids/gui/rectanglePropertyGridComponent.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { CommonControlPropertyGridComponent } from "../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent.js";
+import { LineContainerComponent } from "../../../lines/lineContainerComponent.js";
+import { FloatLineComponent } from "../../../lines/floatLineComponent.js";
+import { CheckBoxLineComponent } from "../../../lines/checkBoxLineComponent.js";
+export class RectanglePropertyGridComponent extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        const rectangle = this.props.rectangle;
+        return (_jsxs("div", { className: "pane", children: [_jsx(CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, control: rectangle, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsxs(LineContainerComponent, { title: "RECTANGLE", children: [_jsx(CheckBoxLineComponent, { label: "Clip children", target: rectangle, propertyName: "clipChildren", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Thickness", target: rectangle, propertyName: "thickness", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Corner radius", target: rectangle, propertyName: "cornerRadius", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })] }));
+    }
+}
+//# sourceMappingURL=rectanglePropertyGridComponent.js.map

package/tabs/propertyGrids/gui/rectanglePropertyGridComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rectanglePropertyGridComponent.js","sourceRoot":"","sources":["../../../../../../../dev/sharedUiComponents/src/tabs/propertyGrids/gui/rectanglePropertyGridComponent.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,kCAAkC,EAAE,MAAM,oEAAoE,CAAC;AAGxH,OAAO,EAAE,sBAAsB,EAAE,MAAM,uCAAuC,CAAC;AAC/E,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AACvE,OAAO,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAQ7E,MAAM,OAAO,8BAA+B,SAAQ,KAAK,CAAC,SAA+C;IACrG,YAAY,KAA2C;QACnD,KAAK,CAAC,KAAK,CAAC,CAAC;IACjB,CAAC;IAED,MAAM;QACF,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;QAEvC,OAAO,CACH,eAAK,SAAS,EAAC,MAAM,aACjB,KAAC,kCAAkC,IAAC,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,OAAO,EAAE,SAAS,EAAE,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GAAI,EAClK,MAAC,sBAAsB,IAAC,KAAK,EAAC,WAAW,aACrC,KAAC,qBAAqB,IAClB,KAAK,EAAC,eAAe,EACrB,MAAM,EAAE,SAAS,EACjB,YAAY,EAAC,cAAc,EAC3B,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,kBAAkB,IACf,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,WAAW,EACjB,MAAM,EAAE,SAAS,EACjB,YAAY,EAAC,WAAW,EACxB,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,kBAAkB,IACf,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,eAAe,EACrB,MAAM,EAAE,SAAS,EACjB,YAAY,EAAC,cAAc,EAC3B,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,IACmB,IACvB,CACT,CAAC;IACN,CAAC;CACJ","sourcesContent":["import * as React from \"react\";\r\nimport type { Observable } from \"core/Misc/observable\";\r\nimport type { PropertyChangedEvent } from \"../../../propertyChangedEvent\";\r\nimport { CommonControlPropertyGridComponent } from \"../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent\";\r\nimport type { LockObject } from \"../../../tabs/propertyGrids/lockObject\";\r\nimport type { Rectangle } from \"gui/2D/controls/rectangle\";\r\nimport { LineContainerComponent } from \"../../../lines/lineContainerComponent\";\r\nimport { FloatLineComponent } from \"../../../lines/floatLineComponent\";\r\nimport { CheckBoxLineComponent } from \"../../../lines/checkBoxLineComponent\";\r\n\r\ninterface IRectanglePropertyGridComponentProps {\r\n    rectangle: Rectangle;\r\n    lockObject: LockObject;\r\n    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n}\r\n\r\nexport class RectanglePropertyGridComponent extends React.Component<IRectanglePropertyGridComponentProps> {\r\n    constructor(props: IRectanglePropertyGridComponentProps) {\r\n        super(props);\r\n    }\r\n\r\n    render() {\r\n        const rectangle = this.props.rectangle;\r\n\r\n        return (\r\n            <div className=\"pane\">\r\n                <CommonControlPropertyGridComponent lockObject={this.props.lockObject} control={rectangle} onPropertyChangedObservable={this.props.onPropertyChangedObservable} />\r\n                <LineContainerComponent title=\"RECTANGLE\">\r\n                    <CheckBoxLineComponent\r\n                        label=\"Clip children\"\r\n                        target={rectangle}\r\n                        propertyName=\"clipChildren\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Thickness\"\r\n                        target={rectangle}\r\n                        propertyName=\"thickness\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Corner radius\"\r\n                        target={rectangle}\r\n                        propertyName=\"cornerRadius\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                </LineContainerComponent>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"]}

package/tabs/propertyGrids/gui/scrollViewerPropertyGridComponent.d.ts

@@ -0,0 +1,15 @@
+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";
+import type { ScrollViewer } from "@babylonjs/gui/2D/controls/scrollViewers/scrollViewer.js";
+interface IScrollViewerPropertyGridComponentProps {
+    scrollViewer: ScrollViewer;
+    lockObject: LockObject;
+    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+}
+export declare class ScrollViewerPropertyGridComponent extends React.Component<IScrollViewerPropertyGridComponentProps> {
+    constructor(props: IScrollViewerPropertyGridComponentProps);
+    render(): JSX.Element;
+}
+export {};

package/tabs/propertyGrids/gui/scrollViewerPropertyGridComponent.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { CommonControlPropertyGridComponent } from "../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent.js";
+import { LineContainerComponent } from "../../../lines/lineContainerComponent.js";
+import { FloatLineComponent } from "../../../lines/floatLineComponent.js";
+import { TextInputLineComponent } from "../../../lines/textInputLineComponent.js";
+export class ScrollViewerPropertyGridComponent extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        const scrollViewer = this.props.scrollViewer;
+        return (_jsxs("div", { className: "pane", children: [_jsx(CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, control: scrollViewer, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsxs(LineContainerComponent, { title: "RECTANGLE", children: [_jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Thickness", target: scrollViewer, propertyName: "thickness", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Corner radius", target: scrollViewer, propertyName: "cornerRadius", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }), _jsxs(LineContainerComponent, { title: "SCROLLVIEWER", children: [_jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Bar size", target: scrollViewer, propertyName: "barSize", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Bar color", target: scrollViewer, propertyName: "barColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Bar background", target: scrollViewer, propertyName: "barBackground", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Wheel precision", target: scrollViewer, propertyName: "wheelPrecision", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })] }));
+    }
+}
+//# sourceMappingURL=scrollViewerPropertyGridComponent.js.map

package/tabs/propertyGrids/gui/scrollViewerPropertyGridComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scrollViewerPropertyGridComponent.js","sourceRoot":"","sources":["../../../../../../../dev/sharedUiComponents/src/tabs/propertyGrids/gui/scrollViewerPropertyGridComponent.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,kCAAkC,EAAE,MAAM,oEAAoE,CAAC;AAGxH,OAAO,EAAE,sBAAsB,EAAE,MAAM,uCAAuC,CAAC;AAC/E,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AACvE,OAAO,EAAE,sBAAsB,EAAE,MAAM,uCAAuC,CAAC;AAQ/E,MAAM,OAAO,iCAAkC,SAAQ,KAAK,CAAC,SAAkD;IAC3G,YAAY,KAA8C;QACtD,KAAK,CAAC,KAAK,CAAC,CAAC;IACjB,CAAC;IAED,MAAM;QACF,MAAM,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC;QAE7C,OAAO,CACH,eAAK,SAAS,EAAC,MAAM,aACjB,KAAC,kCAAkC,IAC/B,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,OAAO,EAAE,YAAY,EACrB,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,MAAC,sBAAsB,IAAC,KAAK,EAAC,WAAW,aACrC,KAAC,kBAAkB,IACf,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,WAAW,EACjB,MAAM,EAAE,YAAY,EACpB,YAAY,EAAC,WAAW,EACxB,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,kBAAkB,IACf,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,eAAe,EACrB,MAAM,EAAE,YAAY,EACpB,YAAY,EAAC,cAAc,EAC3B,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,IACmB,EACzB,MAAC,sBAAsB,IAAC,KAAK,EAAC,cAAc,aACxC,KAAC,kBAAkB,IACf,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,UAAU,EAChB,MAAM,EAAE,YAAY,EACpB,YAAY,EAAC,SAAS,EACtB,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,sBAAsB,IACnB,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,WAAW,EACjB,MAAM,EAAE,YAAY,EACpB,YAAY,EAAC,UAAU,EACvB,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,sBAAsB,IACnB,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,gBAAgB,EACtB,MAAM,EAAE,YAAY,EACpB,YAAY,EAAC,eAAe,EAC5B,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,kBAAkB,IACf,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EACjC,KAAK,EAAC,iBAAiB,EACvB,MAAM,EAAE,YAAY,EACpB,YAAY,EAAC,gBAAgB,EAC7B,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,IACmB,IACvB,CACT,CAAC;IACN,CAAC;CACJ","sourcesContent":["import * as React from \"react\";\r\nimport type { Observable } from \"core/Misc/observable\";\r\nimport type { PropertyChangedEvent } from \"../../../propertyChangedEvent\";\r\nimport { CommonControlPropertyGridComponent } from \"../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent\";\r\nimport type { LockObject } from \"../../../tabs/propertyGrids/lockObject\";\r\nimport type { ScrollViewer } from \"gui/2D/controls/scrollViewers/scrollViewer\";\r\nimport { LineContainerComponent } from \"../../../lines/lineContainerComponent\";\r\nimport { FloatLineComponent } from \"../../../lines/floatLineComponent\";\r\nimport { TextInputLineComponent } from \"../../../lines/textInputLineComponent\";\r\n\r\ninterface IScrollViewerPropertyGridComponentProps {\r\n    scrollViewer: ScrollViewer;\r\n    lockObject: LockObject;\r\n    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n}\r\n\r\nexport class ScrollViewerPropertyGridComponent extends React.Component<IScrollViewerPropertyGridComponentProps> {\r\n    constructor(props: IScrollViewerPropertyGridComponentProps) {\r\n        super(props);\r\n    }\r\n\r\n    render() {\r\n        const scrollViewer = this.props.scrollViewer;\r\n\r\n        return (\r\n            <div className=\"pane\">\r\n                <CommonControlPropertyGridComponent\r\n                    lockObject={this.props.lockObject}\r\n                    control={scrollViewer}\r\n                    onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                />\r\n                <LineContainerComponent title=\"RECTANGLE\">\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Thickness\"\r\n                        target={scrollViewer}\r\n                        propertyName=\"thickness\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Corner radius\"\r\n                        target={scrollViewer}\r\n                        propertyName=\"cornerRadius\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                </LineContainerComponent>\r\n                <LineContainerComponent title=\"SCROLLVIEWER\">\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Bar size\"\r\n                        target={scrollViewer}\r\n                        propertyName=\"barSize\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Bar color\"\r\n                        target={scrollViewer}\r\n                        propertyName=\"barColor\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Bar background\"\r\n                        target={scrollViewer}\r\n                        propertyName=\"barBackground\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Wheel precision\"\r\n                        target={scrollViewer}\r\n                        propertyName=\"wheelPrecision\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                </LineContainerComponent>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"]}

package/tabs/propertyGrids/gui/sliderPropertyGridComponent.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+import type { Observable } from "@babylonjs/core/Misc/observable.js";
+import type { PropertyChangedEvent } from "../../../propertyChangedEvent";
+import type { LockObject } from "../lockObject";
+import type { Slider } from "@babylonjs/gui/2D/controls/sliders/slider.js";
+interface ISliderPropertyGridComponentProps {
+    slider: Slider;
+    lockObject: LockObject;
+    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+}
+export declare class SliderPropertyGridComponent extends React.Component<ISliderPropertyGridComponentProps> {
+    constructor(props: ISliderPropertyGridComponentProps);
+    render(): JSX.Element;
+}
+export {};

package/tabs/propertyGrids/gui/sliderPropertyGridComponent.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { CommonControlPropertyGridComponent } from "./commonControlPropertyGridComponent.js";
+import { LineContainerComponent } from "../../../lines/lineContainerComponent.js";
+import { FloatLineComponent } from "../../../lines/floatLineComponent.js";
+import { CheckBoxLineComponent } from "../../../lines/checkBoxLineComponent.js";
+import { TextInputLineComponent } from "../../../lines/textInputLineComponent.js";
+export class SliderPropertyGridComponent extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        const slider = this.props.slider;
+        return (_jsxs("div", { className: "pane", children: [_jsx(CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, control: slider, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsxs(LineContainerComponent, { title: "SLIDER", children: [_jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Border color", target: slider, propertyName: "borderColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(CheckBoxLineComponent, { label: "Display thumb", target: slider, propertyName: "displayThumb", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(CheckBoxLineComponent, { label: "Thumb circle", target: slider, propertyName: "isThumbCircle", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(CheckBoxLineComponent, { label: "Vertical", target: slider, propertyName: "isVertical", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(CheckBoxLineComponent, { label: "Thumb clamped", target: slider, propertyName: "isThumbClamped", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Bar offset", target: slider, propertyName: "barOffset", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Thumb width", target: slider, propertyName: "thumbWidth", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Minimum", target: slider, propertyName: "minimum", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Maximum", target: slider, propertyName: "maximum", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Value", target: slider, propertyName: "value", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })] }));
+    }
+}
+//# sourceMappingURL=sliderPropertyGridComponent.js.map

package/tabs/propertyGrids/gui/sliderPropertyGridComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sliderPropertyGridComponent.js","sourceRoot":"","sources":["../../../../../../../dev/sharedUiComponents/src/tabs/propertyGrids/gui/sliderPropertyGridComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\r\nimport type { Observable } from \"core/Misc/observable\";\r\nimport type { PropertyChangedEvent } from \"../../../propertyChangedEvent\";\r\nimport { CommonControlPropertyGridComponent } from \"./commonControlPropertyGridComponent\";\r\nimport { LineContainerComponent } from \"../../../lines/lineContainerComponent\";\r\nimport type { LockObject } from \"../lockObject\";\r\nimport type { Slider } from \"gui/2D/controls/sliders/slider\";\r\nimport { FloatLineComponent } from \"../../../lines/floatLineComponent\";\r\nimport { CheckBoxLineComponent } from \"../../../lines/checkBoxLineComponent\";\r\nimport { TextInputLineComponent } from \"../../../lines/textInputLineComponent\";\r\n\r\ninterface ISliderPropertyGridComponentProps {\r\n    slider: Slider;\r\n    lockObject: LockObject;\r\n    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n}\r\n\r\nexport class SliderPropertyGridComponent extends React.Component<ISliderPropertyGridComponentProps> {\r\n    constructor(props: ISliderPropertyGridComponentProps) {\r\n        super(props);\r\n    }\r\n\r\n    render() {\r\n        const slider = this.props.slider;\r\n\r\n        return (\r\n            <div className=\"pane\">\r\n                <CommonControlPropertyGridComponent lockObject={this.props.lockObject} control={slider} onPropertyChangedObservable={this.props.onPropertyChangedObservable} />\r\n                <LineContainerComponent title=\"SLIDER\">\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Border color\"\r\n                        target={slider}\r\n                        propertyName=\"borderColor\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <CheckBoxLineComponent label=\"Display thumb\" target={slider} propertyName=\"displayThumb\" onPropertyChangedObservable={this.props.onPropertyChangedObservable} />\r\n                    <CheckBoxLineComponent label=\"Thumb circle\" target={slider} propertyName=\"isThumbCircle\" onPropertyChangedObservable={this.props.onPropertyChangedObservable} />\r\n                    <CheckBoxLineComponent label=\"Vertical\" target={slider} propertyName=\"isVertical\" onPropertyChangedObservable={this.props.onPropertyChangedObservable} />\r\n                    <CheckBoxLineComponent\r\n                        label=\"Thumb clamped\"\r\n                        target={slider}\r\n                        propertyName=\"isThumbClamped\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Bar offset\"\r\n                        target={slider}\r\n                        propertyName=\"barOffset\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Thumb width\"\r\n                        target={slider}\r\n                        propertyName=\"thumbWidth\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Minimum\"\r\n                        target={slider}\r\n                        propertyName=\"minimum\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Maximum\"\r\n                        target={slider}\r\n                        propertyName=\"maximum\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Value\"\r\n                        target={slider}\r\n                        propertyName=\"value\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                </LineContainerComponent>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"]}

package/tabs/propertyGrids/gui/stackPanelPropertyGridComponent.d.ts

@@ -0,0 +1,15 @@
+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";
+import type { StackPanel } from "@babylonjs/gui/2D/controls/stackPanel.js";
+interface IStackPanelPropertyGridComponentProps {
+    stackPanel: StackPanel;
+    lockObject: LockObject;
+    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+}
+export declare class StackPanelPropertyGridComponent extends React.Component<IStackPanelPropertyGridComponentProps> {
+    constructor(props: IStackPanelPropertyGridComponentProps);
+    render(): JSX.Element;
+}
+export {};

package/tabs/propertyGrids/gui/stackPanelPropertyGridComponent.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { CommonControlPropertyGridComponent } from "../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent.js";
+import { LineContainerComponent } from "../../../lines/lineContainerComponent.js";
+import { CheckBoxLineComponent } from "../../../lines/checkBoxLineComponent.js";
+export class StackPanelPropertyGridComponent extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        const stackPanel = this.props.stackPanel;
+        return (_jsxs("div", { className: "pane", children: [_jsx(CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, control: stackPanel, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsxs(LineContainerComponent, { title: "STACKPANEL", children: [_jsx(CheckBoxLineComponent, { label: "Clip children", target: stackPanel, propertyName: "clipChildren", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(CheckBoxLineComponent, { label: "Vertical", target: stackPanel, propertyName: "isVertical", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })] }));
+    }
+}
+//# sourceMappingURL=stackPanelPropertyGridComponent.js.map

package/tabs/propertyGrids/gui/stackPanelPropertyGridComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"stackPanelPropertyGridComponent.js","sourceRoot":"","sources":["../../../../../../../dev/sharedUiComponents/src/tabs/propertyGrids/gui/stackPanelPropertyGridComponent.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,kCAAkC,EAAE,MAAM,oEAAoE,CAAC;AAGxH,OAAO,EAAE,sBAAsB,EAAE,MAAM,uCAAuC,CAAC;AAC/E,OAAO,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAQ7E,MAAM,OAAO,+BAAgC,SAAQ,KAAK,CAAC,SAAgD;IACvG,YAAY,KAA4C;QACpD,KAAK,CAAC,KAAK,CAAC,CAAC;IACjB,CAAC;IAED,MAAM;QACF,MAAM,UAAU,GAAG,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC;QAEzC,OAAO,CACH,eAAK,SAAS,EAAC,MAAM,aACjB,KAAC,kCAAkC,IAAC,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,OAAO,EAAE,UAAU,EAAE,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GAAI,EACnK,MAAC,sBAAsB,IAAC,KAAK,EAAC,YAAY,aACtC,KAAC,qBAAqB,IAClB,KAAK,EAAC,eAAe,EACrB,MAAM,EAAE,UAAU,EAClB,YAAY,EAAC,cAAc,EAC3B,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GACrE,EACF,KAAC,qBAAqB,IAAC,KAAK,EAAC,UAAU,EAAC,MAAM,EAAE,UAAU,EAAE,YAAY,EAAC,YAAY,EAAC,2BAA2B,EAAE,IAAI,CAAC,KAAK,CAAC,2BAA2B,GAAI,IACxI,IACvB,CACT,CAAC;IACN,CAAC;CACJ","sourcesContent":["import * as React from \"react\";\r\nimport type { Observable } from \"core/Misc/observable\";\r\nimport type { PropertyChangedEvent } from \"../../../propertyChangedEvent\";\r\nimport { CommonControlPropertyGridComponent } from \"../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent\";\r\nimport type { LockObject } from \"../../../tabs/propertyGrids/lockObject\";\r\nimport type { StackPanel } from \"gui/2D/controls/stackPanel\";\r\nimport { LineContainerComponent } from \"../../../lines/lineContainerComponent\";\r\nimport { CheckBoxLineComponent } from \"../../../lines/checkBoxLineComponent\";\r\n\r\ninterface IStackPanelPropertyGridComponentProps {\r\n    stackPanel: StackPanel;\r\n    lockObject: LockObject;\r\n    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n}\r\n\r\nexport class StackPanelPropertyGridComponent extends React.Component<IStackPanelPropertyGridComponentProps> {\r\n    constructor(props: IStackPanelPropertyGridComponentProps) {\r\n        super(props);\r\n    }\r\n\r\n    render() {\r\n        const stackPanel = this.props.stackPanel;\r\n\r\n        return (\r\n            <div className=\"pane\">\r\n                <CommonControlPropertyGridComponent lockObject={this.props.lockObject} control={stackPanel} onPropertyChangedObservable={this.props.onPropertyChangedObservable} />\r\n                <LineContainerComponent title=\"STACKPANEL\">\r\n                    <CheckBoxLineComponent\r\n                        label=\"Clip children\"\r\n                        target={stackPanel}\r\n                        propertyName=\"clipChildren\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <CheckBoxLineComponent label=\"Vertical\" target={stackPanel} propertyName=\"isVertical\" onPropertyChangedObservable={this.props.onPropertyChangedObservable} />\r\n                </LineContainerComponent>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"]}

package/tabs/propertyGrids/gui/textBlockPropertyGridComponent.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+import type { Observable } from "@babylonjs/core/Misc/observable.js";
+import type { PropertyChangedEvent } from "../../../propertyChangedEvent";
+import type { TextBlock } from "@babylonjs/gui/2D/controls/textBlock.js";
+import type { LockObject } from "../../../tabs/propertyGrids/lockObject";
+interface ITextBlockPropertyGridComponentProps {
+    textBlock: TextBlock;
+    lockObject: LockObject;
+    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
+}
+export declare class TextBlockPropertyGridComponent extends React.Component<ITextBlockPropertyGridComponentProps> {
+    constructor(props: ITextBlockPropertyGridComponentProps);
+    render(): JSX.Element;
+}
+export {};

package/tabs/propertyGrids/gui/textBlockPropertyGridComponent.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { CommonControlPropertyGridComponent } from "../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent.js";
+import { TextWrapping } from "@babylonjs/gui/2D/controls/textBlock.js";
+import { Control } from "@babylonjs/gui/2D/controls/control.js";
+import { LineContainerComponent } from "../../../lines/lineContainerComponent.js";
+import { TextInputLineComponent } from "../../../lines/textInputLineComponent.js";
+import { OptionsLineComponent } from "../../../lines/optionsLineComponent.js";
+import { CheckBoxLineComponent } from "../../../lines/checkBoxLineComponent.js";
+import { FloatLineComponent } from "../../../lines/floatLineComponent.js";
+export class TextBlockPropertyGridComponent extends React.Component {
+    constructor(props) {
+        super(props);
+    }
+    render() {
+        const textBlock = this.props.textBlock;
+        const horizontalOptions = [
+            { label: "Left", value: Control.HORIZONTAL_ALIGNMENT_LEFT },
+            { label: "Right", value: Control.HORIZONTAL_ALIGNMENT_RIGHT },
+            { label: "Center", value: Control.HORIZONTAL_ALIGNMENT_CENTER },
+        ];
+        const verticalOptions = [
+            { label: "Top", value: Control.VERTICAL_ALIGNMENT_TOP },
+            { label: "Bottom", value: Control.VERTICAL_ALIGNMENT_BOTTOM },
+            { label: "Center", value: Control.VERTICAL_ALIGNMENT_CENTER },
+        ];
+        const wrappingOptions = [
+            { label: "Clip", value: TextWrapping.Clip },
+            { label: "Ellipsis", value: TextWrapping.Ellipsis },
+            { label: "Word wrap", value: TextWrapping.WordWrap },
+        ];
+        return (_jsxs("div", { className: "pane", children: [_jsx(CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, control: textBlock, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsxs(LineContainerComponent, { title: "TEXTBLOCK", children: [_jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Text", target: textBlock, propertyName: "text", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(OptionsLineComponent, { label: "Horizontal text alignment", options: horizontalOptions, target: textBlock, propertyName: "textHorizontalAlignment", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(OptionsLineComponent, { label: "Vertical text alignment", options: verticalOptions, target: textBlock, propertyName: "textVerticalAlignment", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(CheckBoxLineComponent, { label: "Resize to fit", target: textBlock, propertyName: "resizeToFit", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(OptionsLineComponent, { label: "Wrapping", options: wrappingOptions, target: textBlock, propertyName: "textWrapping", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Line spacing", target: textBlock, propertyName: "lineSpacing", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }), _jsxs(LineContainerComponent, { title: "OUTLINE", children: [_jsx(FloatLineComponent, { lockObject: this.props.lockObject, label: "Outline width", target: textBlock, propertyName: "outlineWidth", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), _jsx(TextInputLineComponent, { lockObject: this.props.lockObject, label: "Outline color", target: textBlock, propertyName: "outlineColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })] }));
+    }
+}
+//# sourceMappingURL=textBlockPropertyGridComponent.js.map

package/tabs/propertyGrids/gui/textBlockPropertyGridComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"textBlockPropertyGridComponent.js","sourceRoot":"","sources":["../../../../../../../dev/sharedUiComponents/src/tabs/propertyGrids/gui/textBlockPropertyGridComponent.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from \"react\";\r\nimport type { Observable } from \"core/Misc/observable\";\r\nimport type { PropertyChangedEvent } from \"../../../propertyChangedEvent\";\r\nimport { CommonControlPropertyGridComponent } from \"../../../tabs/propertyGrids/gui/commonControlPropertyGridComponent\";\r\nimport type { TextBlock } from \"gui/2D/controls/textBlock\";\r\nimport { TextWrapping } from \"gui/2D/controls/textBlock\";\r\nimport { Control } from \"gui/2D/controls/control\";\r\nimport { LineContainerComponent } from \"../../../lines/lineContainerComponent\";\r\nimport { TextInputLineComponent } from \"../../../lines/textInputLineComponent\";\r\nimport type { LockObject } from \"../../../tabs/propertyGrids/lockObject\";\r\nimport { OptionsLineComponent } from \"../../../lines/optionsLineComponent\";\r\nimport { CheckBoxLineComponent } from \"../../../lines/checkBoxLineComponent\";\r\nimport { FloatLineComponent } from \"../../../lines/floatLineComponent\";\r\n\r\ninterface ITextBlockPropertyGridComponentProps {\r\n    textBlock: TextBlock;\r\n    lockObject: LockObject;\r\n    onPropertyChangedObservable?: Observable<PropertyChangedEvent>;\r\n}\r\n\r\nexport class TextBlockPropertyGridComponent extends React.Component<ITextBlockPropertyGridComponentProps> {\r\n    constructor(props: ITextBlockPropertyGridComponentProps) {\r\n        super(props);\r\n    }\r\n\r\n    render() {\r\n        const textBlock = this.props.textBlock;\r\n\r\n        const horizontalOptions = [\r\n            { label: \"Left\", value: Control.HORIZONTAL_ALIGNMENT_LEFT },\r\n            { label: \"Right\", value: Control.HORIZONTAL_ALIGNMENT_RIGHT },\r\n            { label: \"Center\", value: Control.HORIZONTAL_ALIGNMENT_CENTER },\r\n        ];\r\n\r\n        const verticalOptions = [\r\n            { label: \"Top\", value: Control.VERTICAL_ALIGNMENT_TOP },\r\n            { label: \"Bottom\", value: Control.VERTICAL_ALIGNMENT_BOTTOM },\r\n            { label: \"Center\", value: Control.VERTICAL_ALIGNMENT_CENTER },\r\n        ];\r\n\r\n        const wrappingOptions = [\r\n            { label: \"Clip\", value: TextWrapping.Clip },\r\n            { label: \"Ellipsis\", value: TextWrapping.Ellipsis },\r\n            { label: \"Word wrap\", value: TextWrapping.WordWrap },\r\n        ];\r\n\r\n        return (\r\n            <div className=\"pane\">\r\n                <CommonControlPropertyGridComponent lockObject={this.props.lockObject} control={textBlock} onPropertyChangedObservable={this.props.onPropertyChangedObservable} />\r\n                <LineContainerComponent title=\"TEXTBLOCK\">\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Text\"\r\n                        target={textBlock}\r\n                        propertyName=\"text\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <OptionsLineComponent\r\n                        label=\"Horizontal text alignment\"\r\n                        options={horizontalOptions}\r\n                        target={textBlock}\r\n                        propertyName=\"textHorizontalAlignment\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <OptionsLineComponent\r\n                        label=\"Vertical text alignment\"\r\n                        options={verticalOptions}\r\n                        target={textBlock}\r\n                        propertyName=\"textVerticalAlignment\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <CheckBoxLineComponent\r\n                        label=\"Resize to fit\"\r\n                        target={textBlock}\r\n                        propertyName=\"resizeToFit\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <OptionsLineComponent\r\n                        label=\"Wrapping\"\r\n                        options={wrappingOptions}\r\n                        target={textBlock}\r\n                        propertyName=\"textWrapping\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Line spacing\"\r\n                        target={textBlock}\r\n                        propertyName=\"lineSpacing\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                </LineContainerComponent>\r\n                <LineContainerComponent title=\"OUTLINE\">\r\n                    <FloatLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Outline width\"\r\n                        target={textBlock}\r\n                        propertyName=\"outlineWidth\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                    <TextInputLineComponent\r\n                        lockObject={this.props.lockObject}\r\n                        label=\"Outline color\"\r\n                        target={textBlock}\r\n                        propertyName=\"outlineColor\"\r\n                        onPropertyChangedObservable={this.props.onPropertyChangedObservable}\r\n                    />\r\n                </LineContainerComponent>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"]}

package/tabs/propertyGrids/lockObject.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Class used to provide lock mechanism
+ */
+export declare class LockObject {
+    /**
+     * Gets or set if the lock is engaged
+     */
+    lock: boolean;
+}

package/tabs/propertyGrids/lockObject.js

@@ -0,0 +1,12 @@
+/**
+ * Class used to provide lock mechanism
+ */
+export class LockObject {
+    constructor() {
+        /**
+         * Gets or set if the lock is engaged
+         */
+        this.lock = false;
+    }
+}
+//# sourceMappingURL=lockObject.js.map

package/tabs/propertyGrids/lockObject.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"lockObject.js","sourceRoot":"","sources":["../../../../../../dev/sharedUiComponents/src/tabs/propertyGrids/lockObject.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,OAAO,UAAU;IAAvB;QACI;;WAEG;QACI,SAAI,GAAG,KAAK,CAAC;IACxB,CAAC;CAAA","sourcesContent":["/**\r\n * Class used to provide lock mechanism\r\n */\r\nexport class LockObject {\r\n    /**\r\n     * Gets or set if the lock is engaged\r\n     */\r\n    public lock = false;\r\n}\r\n"]}