@babylonjs/shared-ui-components 5.28.0 → 5.29.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/colorPicker/colorComponentEntry.d.ts +18 -18
- package/colorPicker/colorComponentEntry.js +36 -36
- package/colorPicker/colorPicker.d.ts +43 -43
- package/colorPicker/colorPicker.js +136 -136
- package/colorPicker/hexColor.d.ts +20 -20
- package/colorPicker/hexColor.js +42 -42
- package/components/Button.d.ts +10 -10
- package/components/Button.js +6 -6
- package/components/Icon.d.ts +6 -6
- package/components/Icon.js +6 -6
- package/components/Label.d.ts +7 -7
- package/components/Label.js +6 -6
- package/components/MessageDialog.d.ts +7 -7
- package/components/MessageDialog.js +22 -22
- package/components/Toggle.d.ts +8 -8
- package/components/Toggle.js +15 -15
- package/components/bars/CommandBarComponent.d.ts +16 -16
- package/components/bars/CommandBarComponent.js +68 -68
- package/components/bars/CommandButtonComponent.d.ts +11 -11
- package/components/bars/CommandButtonComponent.js +6 -6
- package/components/bars/CommandDropdownComponent.d.ts +26 -26
- package/components/bars/CommandDropdownComponent.js +48 -48
- package/components/classNames.d.ts +2 -2
- package/components/classNames.js +18 -18
- package/components/colorPicker/ColorComponentEntry.d.ts +18 -18
- package/components/colorPicker/ColorComponentEntry.js +37 -37
- package/components/colorPicker/ColorPicker.d.ts +43 -43
- package/components/colorPicker/ColorPicker.js +137 -137
- package/components/colorPicker/HexColor.d.ts +20 -20
- package/components/colorPicker/HexColor.js +45 -45
- package/components/layout/DraggableIcon.d.ts +23 -0
- package/components/layout/DraggableIcon.js +18 -0
- package/components/layout/DraggableIcon.js.map +1 -0
- package/components/layout/FlexibleColumn.d.ts +17 -0
- package/components/layout/FlexibleColumn.js +12 -0
- package/components/layout/FlexibleColumn.js.map +1 -0
- package/components/layout/FlexibleDragHandler.d.ts +18 -0
- package/components/layout/FlexibleDragHandler.js +88 -0
- package/components/layout/FlexibleDragHandler.js.map +1 -0
- package/components/layout/FlexibleDropZone.d.ts +19 -0
- package/components/layout/FlexibleDropZone.js +12 -0
- package/components/layout/FlexibleDropZone.js.map +1 -0
- package/components/layout/FlexibleGridContainer.d.ts +10 -0
- package/components/layout/FlexibleGridContainer.js +23 -0
- package/components/layout/FlexibleGridContainer.js.map +1 -0
- package/components/layout/FlexibleGridLayout.d.ts +16 -0
- package/components/layout/FlexibleGridLayout.js +24 -0
- package/components/layout/FlexibleGridLayout.js.map +1 -0
- package/components/layout/FlexibleResizeBar.d.ts +40 -0
- package/components/layout/FlexibleResizeBar.js +21 -0
- package/components/layout/FlexibleResizeBar.js.map +1 -0
- package/components/layout/FlexibleTab.d.ts +34 -0
- package/components/layout/FlexibleTab.js +36 -0
- package/components/layout/FlexibleTab.js.map +1 -0
- package/components/layout/FlexibleTabsContainer.d.ts +28 -0
- package/components/layout/FlexibleTabsContainer.js +54 -0
- package/components/layout/FlexibleTabsContainer.js.map +1 -0
- package/components/layout/LayoutContext.d.ts +12 -0
- package/components/layout/LayoutContext.js +3 -0
- package/components/layout/LayoutContext.js.map +1 -0
- package/components/layout/types.d.ts +78 -0
- package/components/layout/types.js +13 -0
- package/components/layout/types.js.map +1 -0
- package/components/layout/utils.d.ts +25 -0
- package/components/layout/utils.js +68 -0
- package/components/layout/utils.js.map +1 -0
- package/components/lines/ColorLineComponent.d.ts +40 -40
- package/components/lines/ColorLineComponent.js +145 -145
- package/components/lines/ColorPickerLineComponent.d.ts +33 -33
- package/components/lines/ColorPickerLineComponent.js +61 -61
- package/components/lines/FileButtonLineComponent.d.ts +16 -16
- package/components/lines/FileButtonLineComponent.js +21 -21
- package/components/lines/NumericInputComponent.d.ts +31 -31
- package/components/lines/NumericInputComponent.js +86 -86
- package/lines/booleanLineComponent.d.ts +11 -11
- package/lines/booleanLineComponent.js +14 -14
- package/lines/buttonLineComponent.d.ts +12 -12
- package/lines/buttonLineComponent.js +10 -10
- package/lines/checkBoxLineComponent.d.ts +36 -36
- package/lines/checkBoxLineComponent.js +88 -88
- package/lines/color3LineComponent.d.ts +18 -18
- package/lines/color3LineComponent.js +9 -9
- package/lines/color4LineComponent.d.ts +18 -18
- package/lines/color4LineComponent.js +9 -9
- package/lines/colorLineComponent.d.ts +40 -40
- package/lines/colorLineComponent.js +144 -144
- package/lines/colorPickerComponent.d.ts +31 -31
- package/lines/colorPickerComponent.js +60 -60
- package/lines/draggableLineComponent.d.ts +9 -9
- package/lines/draggableLineComponent.js +12 -12
- package/lines/fileButtonLineComponent.d.ts +17 -17
- package/lines/fileButtonLineComponent.js +20 -20
- package/lines/fileMultipleButtonLineComponent.d.ts +17 -17
- package/lines/fileMultipleButtonLineComponent.js +20 -20
- package/lines/floatLineComponent.d.ts +50 -50
- package/lines/floatLineComponent.js +175 -175
- package/lines/hexLineComponent.d.ts +40 -40
- package/lines/hexLineComponent.js +121 -121
- package/lines/iSelectedLineContainer.d.ts +4 -4
- package/lines/iSelectedLineContainer.js +1 -1
- package/lines/iconButtonLineComponent.d.ts +11 -11
- package/lines/iconButtonLineComponent.js +10 -10
- package/lines/iconComponent.d.ts +9 -9
- package/lines/iconComponent.js +7 -7
- package/lines/indentedTextLineComponent.d.ts +16 -16
- package/lines/indentedTextLineComponent.js +26 -26
- package/lines/inputArrowsComponent.d.ts +13 -13
- package/lines/inputArrowsComponent.js +37 -37
- package/lines/lineContainerComponent.d.ts +19 -19
- package/lines/lineContainerComponent.js +49 -49
- package/lines/linkButtonComponent.d.ts +16 -16
- package/lines/linkButtonComponent.js +20 -20
- package/lines/matrixLineComponent.d.ts +36 -36
- package/lines/matrixLineComponent.js +102 -102
- package/lines/messageLineComponent.d.ts +12 -12
- package/lines/messageLineComponent.js +14 -14
- package/lines/numericInputComponent.d.ts +31 -31
- package/lines/numericInputComponent.js +85 -85
- package/lines/optionsLineComponent.d.ts +48 -48
- package/lines/optionsLineComponent.js +118 -118
- package/lines/popup.d.ts +4 -4
- package/lines/popup.js +67 -67
- package/lines/radioLineComponent.d.ts +21 -21
- package/lines/radioLineComponent.js +26 -26
- package/lines/sliderLineComponent.d.ts +37 -37
- package/lines/sliderLineComponent.js +89 -89
- package/lines/targetsProxy.d.ts +11 -11
- package/lines/targetsProxy.js +42 -42
- package/lines/textInputLineComponent.d.ts +47 -47
- package/lines/textInputLineComponent.js +154 -154
- package/lines/textLineComponent.d.ts +21 -21
- package/lines/textLineComponent.js +30 -30
- package/lines/unitButton.d.ts +8 -8
- package/lines/unitButton.js +7 -7
- package/lines/valueLineComponent.d.ts +15 -15
- package/lines/valueLineComponent.js +12 -12
- package/lines/vector2LineComponent.d.ts +36 -36
- package/lines/vector2LineComponent.js +63 -63
- package/lines/vector3LineComponent.d.ts +41 -41
- package/lines/vector3LineComponent.js +74 -74
- package/lines/vector4LineComponent.d.ts +42 -42
- package/lines/vector4LineComponent.js +81 -81
- package/nodeGraphSystem/displayLedger.d.ts +5 -5
- package/nodeGraphSystem/displayLedger.js +3 -3
- package/nodeGraphSystem/frameNodePort.d.ts +25 -25
- package/nodeGraphSystem/frameNodePort.js +59 -59
- package/nodeGraphSystem/graphCanvas.d.ts +111 -111
- package/nodeGraphSystem/graphCanvas.js +1131 -1131
- package/nodeGraphSystem/graphFrame.d.ts +153 -153
- package/nodeGraphSystem/graphFrame.js +1328 -1328
- package/nodeGraphSystem/graphNode.d.ts +79 -79
- package/nodeGraphSystem/graphNode.js +459 -459
- package/nodeGraphSystem/interfaces/displayManager.d.ts +13 -13
- package/nodeGraphSystem/interfaces/displayManager.js +1 -1
- package/nodeGraphSystem/interfaces/nodeContainer.d.ts +6 -6
- package/nodeGraphSystem/interfaces/nodeContainer.js +1 -1
- package/nodeGraphSystem/interfaces/nodeData.d.ts +15 -15
- package/nodeGraphSystem/interfaces/nodeData.js +1 -1
- package/nodeGraphSystem/interfaces/nodeLocationInfo.d.ts +26 -26
- package/nodeGraphSystem/interfaces/nodeLocationInfo.js +1 -1
- package/nodeGraphSystem/interfaces/portData.d.ts +28 -28
- package/nodeGraphSystem/interfaces/portData.js +7 -7
- package/nodeGraphSystem/interfaces/propertyComponentProps.d.ts +6 -6
- package/nodeGraphSystem/interfaces/propertyComponentProps.js +1 -1
- package/nodeGraphSystem/interfaces/selectionChangedOptions.d.ts +11 -11
- package/nodeGraphSystem/interfaces/selectionChangedOptions.js +1 -1
- package/nodeGraphSystem/nodeLink.d.ts +31 -31
- package/nodeGraphSystem/nodeLink.js +182 -182
- package/nodeGraphSystem/nodePort.d.ts +35 -35
- package/nodeGraphSystem/nodePort.js +128 -128
- package/nodeGraphSystem/propertyLedger.d.ts +8 -8
- package/nodeGraphSystem/propertyLedger.js +3 -3
- package/nodeGraphSystem/stateManager.d.ts +45 -45
- package/nodeGraphSystem/stateManager.js +18 -18
- package/nodeGraphSystem/tools.d.ts +5 -5
- package/nodeGraphSystem/tools.js +36 -36
- package/nodeGraphSystem/typeLedger.d.ts +8 -8
- package/nodeGraphSystem/typeLedger.js +2 -2
- package/nodeGraphSystem/types/framePortData.d.ts +7 -7
- package/nodeGraphSystem/types/framePortData.js +1 -1
- package/package.json +4 -3
- package/propertyChangedEvent.d.ts +7 -7
- package/propertyChangedEvent.js +2 -2
- package/stories/Button.stories.d.ts +10 -10
- package/stories/Button.stories.js +19 -19
- package/stories/Icon.stories.d.ts +9 -9
- package/stories/Icon.stories.js +16 -16
- package/stories/Label.stories.d.ts +8 -8
- package/stories/Label.stories.js +10 -10
- package/stories/MessageDialog.stories.d.ts +9 -9
- package/stories/MessageDialog.stories.js +19 -19
- package/stories/Toggle.stories.d.ts +9 -9
- package/stories/Toggle.stories.js +17 -17
- package/stories/bars/CommandBarComponent.stories.d.ts +11 -11
- package/stories/bars/CommandBarComponent.stories.js +12 -12
- package/stories/bars/CommandButtonComponent.stories.d.ts +6 -6
- package/stories/bars/CommandButtonComponent.stories.js +6 -6
- package/stories/colorPicker/ColorPicker.stories.d.ts +11 -11
- package/stories/colorPicker/ColorPicker.stories.js +4 -4
- package/stories/layout/FlexibleGridLayout.stories.d.ts +46 -0
- package/stories/layout/FlexibleGridLayout.stories.js +48 -0
- package/stories/layout/FlexibleGridLayout.stories.js.map +1 -0
- package/stories/lines/ColorLineComponent.stories.d.ts +21 -21
- package/stories/lines/ColorLineComponent.stories.js +9 -9
- package/stories/lines/ColorPickerLineComponent.stories.d.ts +14 -14
- package/stories/lines/ColorPickerLineComponent.stories.js +10 -10
- package/stories/lines/FileButtonLineComponent.stories.d.ts +6 -6
- package/stories/lines/FileButtonLineComponent.stories.js +5 -5
- package/stories/lines/NumericInputComponent.stories.d.ts +11 -11
- package/stories/lines/NumericInputComponent.stories.js +5 -5
- package/stringTools.d.ts +11 -11
- package/stringTools.js +88 -88
- package/tabs/propertyGrids/gui/checkboxPropertyGridComponent.d.ts +15 -15
- package/tabs/propertyGrids/gui/checkboxPropertyGridComponent.js +15 -15
- package/tabs/propertyGrids/gui/colorPickerPropertyGridComponent.d.ts +15 -15
- package/tabs/propertyGrids/gui/colorPickerPropertyGridComponent.js +14 -14
- package/tabs/propertyGrids/gui/commonControlPropertyGridComponent.d.ts +17 -17
- package/tabs/propertyGrids/gui/commonControlPropertyGridComponent.js +55 -55
- package/tabs/propertyGrids/gui/controlPropertyGridComponent.d.ts +15 -15
- package/tabs/propertyGrids/gui/controlPropertyGridComponent.js +12 -12
- package/tabs/propertyGrids/gui/ellipsePropertyGridComponent.d.ts +15 -15
- package/tabs/propertyGrids/gui/ellipsePropertyGridComponent.js +15 -15
- package/tabs/propertyGrids/gui/gridPropertyGridComponent.d.ts +17 -17
- package/tabs/propertyGrids/gui/gridPropertyGridComponent.js +38 -38
- package/tabs/propertyGrids/gui/imageBasedSliderPropertyGridComponent.d.ts +15 -15
- package/tabs/propertyGrids/gui/imageBasedSliderPropertyGridComponent.js +16 -16
- package/tabs/propertyGrids/gui/imagePropertyGridComponent.d.ts +15 -15
- package/tabs/propertyGrids/gui/imagePropertyGridComponent.js +25 -25
- package/tabs/propertyGrids/gui/inputTextPropertyGridComponent.d.ts +15 -15
- package/tabs/propertyGrids/gui/inputTextPropertyGridComponent.js +17 -17
- package/tabs/propertyGrids/gui/linePropertyGridComponent.d.ts +16 -16
- package/tabs/propertyGrids/gui/linePropertyGridComponent.js +27 -27
- package/tabs/propertyGrids/gui/radioButtonPropertyGridComponent.d.ts +15 -15
- package/tabs/propertyGrids/gui/radioButtonPropertyGridComponent.js +17 -17
- package/tabs/propertyGrids/gui/rectanglePropertyGridComponent.d.ts +15 -15
- package/tabs/propertyGrids/gui/rectanglePropertyGridComponent.js +15 -15
- package/tabs/propertyGrids/gui/scrollViewerPropertyGridComponent.d.ts +15 -15
- package/tabs/propertyGrids/gui/scrollViewerPropertyGridComponent.js +15 -15
- package/tabs/propertyGrids/gui/sliderPropertyGridComponent.d.ts +15 -15
- package/tabs/propertyGrids/gui/sliderPropertyGridComponent.js +16 -16
- package/tabs/propertyGrids/gui/stackPanelPropertyGridComponent.d.ts +15 -15
- package/tabs/propertyGrids/gui/stackPanelPropertyGridComponent.js +14 -14
- package/tabs/propertyGrids/gui/textBlockPropertyGridComponent.d.ts +15 -15
- package/tabs/propertyGrids/gui/textBlockPropertyGridComponent.js +34 -34
- package/tabs/propertyGrids/lockObject.d.ts +9 -9
- package/tabs/propertyGrids/lockObject.js +11 -11
@@ -1,64 +1,64 @@
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
|
-
import * as React from "react";
|
3
|
-
import { NumericInputComponent } from "./numericInputComponent.js";
|
4
|
-
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
5
|
-
import { faMinus, faPlus } from "@fortawesome/free-solid-svg-icons";
|
6
|
-
export class Vector2LineComponent extends React.Component {
|
7
|
-
constructor(props) {
|
8
|
-
super(props);
|
9
|
-
this._localChange = false;
|
10
|
-
this.state = { isExpanded: false, value: this.props.target[this.props.propertyName].clone() };
|
11
|
-
}
|
12
|
-
shouldComponentUpdate(nextProps, nextState) {
|
13
|
-
const nextPropsValue = nextProps.target[nextProps.propertyName];
|
14
|
-
if (!nextPropsValue.equals(nextState.value) || this._localChange) {
|
15
|
-
nextState.value = nextPropsValue.clone();
|
16
|
-
this._localChange = false;
|
17
|
-
return true;
|
18
|
-
}
|
19
|
-
return false;
|
20
|
-
}
|
21
|
-
switchExpandState() {
|
22
|
-
this._localChange = true;
|
23
|
-
this.setState({ isExpanded: !this.state.isExpanded });
|
24
|
-
}
|
25
|
-
raiseOnPropertyChanged(previousValue) {
|
26
|
-
if (this.props.onChange) {
|
27
|
-
this.props.onChange(this.state.value);
|
28
|
-
}
|
29
|
-
if (!this.props.onPropertyChangedObservable) {
|
30
|
-
return;
|
31
|
-
}
|
32
|
-
this.props.onPropertyChangedObservable.notifyObservers({
|
33
|
-
object: this.props.target,
|
34
|
-
property: this.props.propertyName,
|
35
|
-
value: this.state.value,
|
36
|
-
initialValue: previousValue,
|
37
|
-
});
|
38
|
-
}
|
39
|
-
updateStateX(value) {
|
40
|
-
this._localChange = true;
|
41
|
-
const store = this.state.value.clone();
|
42
|
-
this.props.target[this.props.propertyName].x = value;
|
43
|
-
this.state.value.x = value;
|
44
|
-
this.setState({ value: this.state.value });
|
45
|
-
this.raiseOnPropertyChanged(store);
|
46
|
-
}
|
47
|
-
updateStateY(value) {
|
48
|
-
this._localChange = true;
|
49
|
-
const store = this.state.value.clone();
|
50
|
-
this.props.target[this.props.propertyName].y = value;
|
51
|
-
this.state.value.y = value;
|
52
|
-
this.setState({ value: this.state.value });
|
53
|
-
this.raiseOnPropertyChanged(store);
|
54
|
-
}
|
55
|
-
render() {
|
56
|
-
const chevron = this.state.isExpanded ? _jsx(FontAwesomeIcon, { icon: faMinus }) : _jsx(FontAwesomeIcon, { icon: faPlus });
|
57
|
-
return (_jsxs("div", { className: "vector3Line", children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), _jsxs("div", { className: "firstLine", title: this.props.label, children: [_jsx("div", { className: "label", children: this.props.label }), _jsx("div", { className: "vector", children: `X: ${this.state.value.x.toFixed(2)}, Y: ${this.state.value.y.toFixed(2)}` }), _jsx("div", { className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand", children: chevron })] }), this.state.isExpanded && (_jsxs("div", { className: "secondLine", children: [_jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "x", step: this.props.step, value: this.state.value.x, onChange: (value) => this.updateStateX(value) }), _jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "y", step: this.props.step, value: this.state.value.y, onChange: (value) => this.updateStateY(value) })] }))] }));
|
58
|
-
}
|
59
|
-
}
|
60
|
-
// eslint-disable-next-line @typescript-eslint/naming-convention
|
61
|
-
Vector2LineComponent.defaultProps = {
|
62
|
-
step: 0.001, // cm
|
63
|
-
};
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
|
+
import * as React from "react";
|
3
|
+
import { NumericInputComponent } from "./numericInputComponent.js";
|
4
|
+
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
5
|
+
import { faMinus, faPlus } from "@fortawesome/free-solid-svg-icons";
|
6
|
+
export class Vector2LineComponent extends React.Component {
|
7
|
+
constructor(props) {
|
8
|
+
super(props);
|
9
|
+
this._localChange = false;
|
10
|
+
this.state = { isExpanded: false, value: this.props.target[this.props.propertyName].clone() };
|
11
|
+
}
|
12
|
+
shouldComponentUpdate(nextProps, nextState) {
|
13
|
+
const nextPropsValue = nextProps.target[nextProps.propertyName];
|
14
|
+
if (!nextPropsValue.equals(nextState.value) || this._localChange) {
|
15
|
+
nextState.value = nextPropsValue.clone();
|
16
|
+
this._localChange = false;
|
17
|
+
return true;
|
18
|
+
}
|
19
|
+
return false;
|
20
|
+
}
|
21
|
+
switchExpandState() {
|
22
|
+
this._localChange = true;
|
23
|
+
this.setState({ isExpanded: !this.state.isExpanded });
|
24
|
+
}
|
25
|
+
raiseOnPropertyChanged(previousValue) {
|
26
|
+
if (this.props.onChange) {
|
27
|
+
this.props.onChange(this.state.value);
|
28
|
+
}
|
29
|
+
if (!this.props.onPropertyChangedObservable) {
|
30
|
+
return;
|
31
|
+
}
|
32
|
+
this.props.onPropertyChangedObservable.notifyObservers({
|
33
|
+
object: this.props.target,
|
34
|
+
property: this.props.propertyName,
|
35
|
+
value: this.state.value,
|
36
|
+
initialValue: previousValue,
|
37
|
+
});
|
38
|
+
}
|
39
|
+
updateStateX(value) {
|
40
|
+
this._localChange = true;
|
41
|
+
const store = this.state.value.clone();
|
42
|
+
this.props.target[this.props.propertyName].x = value;
|
43
|
+
this.state.value.x = value;
|
44
|
+
this.setState({ value: this.state.value });
|
45
|
+
this.raiseOnPropertyChanged(store);
|
46
|
+
}
|
47
|
+
updateStateY(value) {
|
48
|
+
this._localChange = true;
|
49
|
+
const store = this.state.value.clone();
|
50
|
+
this.props.target[this.props.propertyName].y = value;
|
51
|
+
this.state.value.y = value;
|
52
|
+
this.setState({ value: this.state.value });
|
53
|
+
this.raiseOnPropertyChanged(store);
|
54
|
+
}
|
55
|
+
render() {
|
56
|
+
const chevron = this.state.isExpanded ? _jsx(FontAwesomeIcon, { icon: faMinus }) : _jsx(FontAwesomeIcon, { icon: faPlus });
|
57
|
+
return (_jsxs("div", { className: "vector3Line", children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), _jsxs("div", { className: "firstLine", title: this.props.label, children: [_jsx("div", { className: "label", children: this.props.label }), _jsx("div", { className: "vector", children: `X: ${this.state.value.x.toFixed(2)}, Y: ${this.state.value.y.toFixed(2)}` }), _jsx("div", { className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand", children: chevron })] }), this.state.isExpanded && (_jsxs("div", { className: "secondLine", children: [_jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "x", step: this.props.step, value: this.state.value.x, onChange: (value) => this.updateStateX(value) }), _jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "y", step: this.props.step, value: this.state.value.y, onChange: (value) => this.updateStateY(value) })] }))] }));
|
58
|
+
}
|
59
|
+
}
|
60
|
+
// eslint-disable-next-line @typescript-eslint/naming-convention
|
61
|
+
Vector2LineComponent.defaultProps = {
|
62
|
+
step: 0.001, // cm
|
63
|
+
};
|
64
64
|
//# sourceMappingURL=vector2LineComponent.js.map
|
@@ -1,41 +1,41 @@
|
|
1
|
-
import * as React from "react";
|
2
|
-
import type { Vector3 } from "@babylonjs/core/Maths/math.vector.js";
|
3
|
-
import type { Observable } from "@babylonjs/core/Misc/observable.js";
|
4
|
-
import type { PropertyChangedEvent } from "../propertyChangedEvent";
|
5
|
-
import type { LockObject } from "../tabs/propertyGrids/lockObject";
|
6
|
-
interface IVector3LineComponentProps {
|
7
|
-
label: string;
|
8
|
-
target: any;
|
9
|
-
propertyName: string;
|
10
|
-
step?: number;
|
11
|
-
onChange?: (newvalue: Vector3) => void;
|
12
|
-
useEuler?: boolean;
|
13
|
-
onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
|
14
|
-
noSlider?: boolean;
|
15
|
-
icon?: string;
|
16
|
-
iconLabel?: string;
|
17
|
-
lockObject: LockObject;
|
18
|
-
}
|
19
|
-
export declare class Vector3LineComponent extends React.Component<IVector3LineComponentProps, {
|
20
|
-
isExpanded: boolean;
|
21
|
-
value: Vector3;
|
22
|
-
}> {
|
23
|
-
static defaultProps: {
|
24
|
-
step: number;
|
25
|
-
};
|
26
|
-
private _localChange;
|
27
|
-
constructor(props: IVector3LineComponentProps);
|
28
|
-
getCurrentValue(): any;
|
29
|
-
shouldComponentUpdate(nextProps: IVector3LineComponentProps, nextState: {
|
30
|
-
isExpanded: boolean;
|
31
|
-
value: Vector3;
|
32
|
-
}): boolean;
|
33
|
-
switchExpandState(): void;
|
34
|
-
raiseOnPropertyChanged(previousValue: Vector3): void;
|
35
|
-
updateVector3(): void;
|
36
|
-
updateStateX(value: number): void;
|
37
|
-
updateStateY(value: number): void;
|
38
|
-
updateStateZ(value: number): void;
|
39
|
-
render(): JSX.Element;
|
40
|
-
}
|
41
|
-
export {};
|
1
|
+
import * as React from "react";
|
2
|
+
import type { Vector3 } from "@babylonjs/core/Maths/math.vector.js";
|
3
|
+
import type { Observable } from "@babylonjs/core/Misc/observable.js";
|
4
|
+
import type { PropertyChangedEvent } from "../propertyChangedEvent";
|
5
|
+
import type { LockObject } from "../tabs/propertyGrids/lockObject";
|
6
|
+
interface IVector3LineComponentProps {
|
7
|
+
label: string;
|
8
|
+
target: any;
|
9
|
+
propertyName: string;
|
10
|
+
step?: number;
|
11
|
+
onChange?: (newvalue: Vector3) => void;
|
12
|
+
useEuler?: boolean;
|
13
|
+
onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
|
14
|
+
noSlider?: boolean;
|
15
|
+
icon?: string;
|
16
|
+
iconLabel?: string;
|
17
|
+
lockObject: LockObject;
|
18
|
+
}
|
19
|
+
export declare class Vector3LineComponent extends React.Component<IVector3LineComponentProps, {
|
20
|
+
isExpanded: boolean;
|
21
|
+
value: Vector3;
|
22
|
+
}> {
|
23
|
+
static defaultProps: {
|
24
|
+
step: number;
|
25
|
+
};
|
26
|
+
private _localChange;
|
27
|
+
constructor(props: IVector3LineComponentProps);
|
28
|
+
getCurrentValue(): any;
|
29
|
+
shouldComponentUpdate(nextProps: IVector3LineComponentProps, nextState: {
|
30
|
+
isExpanded: boolean;
|
31
|
+
value: Vector3;
|
32
|
+
}): boolean;
|
33
|
+
switchExpandState(): void;
|
34
|
+
raiseOnPropertyChanged(previousValue: Vector3): void;
|
35
|
+
updateVector3(): void;
|
36
|
+
updateStateX(value: number): void;
|
37
|
+
updateStateY(value: number): void;
|
38
|
+
updateStateZ(value: number): void;
|
39
|
+
render(): JSX.Element;
|
40
|
+
}
|
41
|
+
export {};
|
@@ -1,75 +1,75 @@
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
|
-
import * as React from "react";
|
3
|
-
import { NumericInputComponent } from "../lines/numericInputComponent.js";
|
4
|
-
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
5
|
-
import { faMinus, faPlus } from "@fortawesome/free-solid-svg-icons";
|
6
|
-
import { SliderLineComponent } from "../lines/sliderLineComponent.js";
|
7
|
-
import { Tools } from "@babylonjs/core/Misc/tools.js";
|
8
|
-
export class Vector3LineComponent extends React.Component {
|
9
|
-
constructor(props) {
|
10
|
-
super(props);
|
11
|
-
this._localChange = false;
|
12
|
-
this.state = { isExpanded: false, value: this.getCurrentValue().clone() };
|
13
|
-
}
|
14
|
-
getCurrentValue() {
|
15
|
-
return this.props.target[this.props.propertyName];
|
16
|
-
}
|
17
|
-
shouldComponentUpdate(nextProps, nextState) {
|
18
|
-
const nextPropsValue = this.getCurrentValue();
|
19
|
-
if (!nextPropsValue.equals(nextState.value) || this._localChange) {
|
20
|
-
nextState.value = nextPropsValue.clone();
|
21
|
-
this._localChange = false;
|
22
|
-
return true;
|
23
|
-
}
|
24
|
-
return false;
|
25
|
-
}
|
26
|
-
switchExpandState() {
|
27
|
-
this._localChange = true;
|
28
|
-
this.setState({ isExpanded: !this.state.isExpanded });
|
29
|
-
}
|
30
|
-
raiseOnPropertyChanged(previousValue) {
|
31
|
-
if (this.props.onChange) {
|
32
|
-
this.props.onChange(this.state.value);
|
33
|
-
}
|
34
|
-
if (!this.props.onPropertyChangedObservable) {
|
35
|
-
return;
|
36
|
-
}
|
37
|
-
this.props.onPropertyChangedObservable.notifyObservers({
|
38
|
-
object: this.props.target,
|
39
|
-
property: this.props.propertyName,
|
40
|
-
value: this.state.value,
|
41
|
-
initialValue: previousValue,
|
42
|
-
});
|
43
|
-
}
|
44
|
-
updateVector3() {
|
45
|
-
const store = this.props.target[this.props.propertyName].clone();
|
46
|
-
this.props.target[this.props.propertyName] = this.state.value;
|
47
|
-
this.setState({ value: store });
|
48
|
-
this.raiseOnPropertyChanged(store);
|
49
|
-
}
|
50
|
-
updateStateX(value) {
|
51
|
-
this._localChange = true;
|
52
|
-
this.state.value.x = value;
|
53
|
-
this.updateVector3();
|
54
|
-
}
|
55
|
-
updateStateY(value) {
|
56
|
-
this._localChange = true;
|
57
|
-
this.state.value.y = value;
|
58
|
-
this.updateVector3();
|
59
|
-
}
|
60
|
-
updateStateZ(value) {
|
61
|
-
this._localChange = true;
|
62
|
-
this.state.value.z = value;
|
63
|
-
this.updateVector3();
|
64
|
-
}
|
65
|
-
render() {
|
66
|
-
const chevron = this.state.isExpanded ? _jsx(FontAwesomeIcon, { icon: faMinus }) : _jsx(FontAwesomeIcon, { icon: faPlus });
|
67
|
-
return (_jsxs("div", { className: "vector3Line", children: [_jsxs("div", { className: "firstLine", 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: "vector", children: [!this.props.useEuler && `X: ${this.state.value.x.toFixed(2)}, Y: ${this.state.value.y.toFixed(2)}, Z: ${this.state.value.z.toFixed(2)}`, this.props.useEuler &&
|
68
|
-
`X: ${Tools.ToDegrees(this.state.value.x).toFixed(2)}, Y: ${Tools.ToDegrees(this.state.value.y).toFixed(2)}, Z: ${Tools.ToDegrees(this.state.value.z).toFixed(2)}`] }), _jsx("div", { className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand", children: chevron })] }), this.state.isExpanded && !this.props.useEuler && (_jsxs("div", { className: "secondLine", children: [_jsx(NumericInputComponent, { label: "x", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.x, onChange: (value) => this.updateStateX(value) }), _jsx(NumericInputComponent, { label: "y", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.y, onChange: (value) => this.updateStateY(value) }), _jsx(NumericInputComponent, { label: "z", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.z, onChange: (value) => this.updateStateZ(value) })] })), this.state.isExpanded && this.props.useEuler && !this.props.noSlider && (_jsxs("div", { className: "secondLine", children: [_jsx(SliderLineComponent, { lockObject: this.props.lockObject, margin: true, label: "x", minimum: 0, maximum: 360, step: 0.1, directValue: Tools.ToDegrees(this.state.value.x), onChange: (value) => this.updateStateX(Tools.ToRadians(value)) }), _jsx(SliderLineComponent, { lockObject: this.props.lockObject, margin: true, label: "y", minimum: 0, maximum: 360, step: 0.1, directValue: Tools.ToDegrees(this.state.value.y), onChange: (value) => this.updateStateY(Tools.ToRadians(value)) }), _jsx(SliderLineComponent, { lockObject: this.props.lockObject, margin: true, label: "z", minimum: 0, maximum: 360, step: 0.1, directValue: Tools.ToDegrees(this.state.value.z), onChange: (value) => this.updateStateZ(Tools.ToRadians(value)) })] })), this.state.isExpanded && this.props.useEuler && this.props.noSlider && (_jsxs("div", { className: "secondLine", children: [_jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "x", step: this.props.step, value: Tools.ToDegrees(this.state.value.x), onChange: (value) => this.updateStateX(Tools.ToRadians(value)) }), _jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "y", step: this.props.step, value: Tools.ToDegrees(this.state.value.y), onChange: (value) => this.updateStateY(Tools.ToRadians(value)) }), _jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "z", step: this.props.step, value: Tools.ToDegrees(this.state.value.z), onChange: (value) => this.updateStateZ(Tools.ToRadians(value)) })] }))] }));
|
69
|
-
}
|
70
|
-
}
|
71
|
-
// eslint-disable-next-line @typescript-eslint/naming-convention
|
72
|
-
Vector3LineComponent.defaultProps = {
|
73
|
-
step: 0.001, // cm
|
74
|
-
};
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
|
+
import * as React from "react";
|
3
|
+
import { NumericInputComponent } from "../lines/numericInputComponent.js";
|
4
|
+
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
5
|
+
import { faMinus, faPlus } from "@fortawesome/free-solid-svg-icons";
|
6
|
+
import { SliderLineComponent } from "../lines/sliderLineComponent.js";
|
7
|
+
import { Tools } from "@babylonjs/core/Misc/tools.js";
|
8
|
+
export class Vector3LineComponent extends React.Component {
|
9
|
+
constructor(props) {
|
10
|
+
super(props);
|
11
|
+
this._localChange = false;
|
12
|
+
this.state = { isExpanded: false, value: this.getCurrentValue().clone() };
|
13
|
+
}
|
14
|
+
getCurrentValue() {
|
15
|
+
return this.props.target[this.props.propertyName];
|
16
|
+
}
|
17
|
+
shouldComponentUpdate(nextProps, nextState) {
|
18
|
+
const nextPropsValue = this.getCurrentValue();
|
19
|
+
if (!nextPropsValue.equals(nextState.value) || this._localChange) {
|
20
|
+
nextState.value = nextPropsValue.clone();
|
21
|
+
this._localChange = false;
|
22
|
+
return true;
|
23
|
+
}
|
24
|
+
return false;
|
25
|
+
}
|
26
|
+
switchExpandState() {
|
27
|
+
this._localChange = true;
|
28
|
+
this.setState({ isExpanded: !this.state.isExpanded });
|
29
|
+
}
|
30
|
+
raiseOnPropertyChanged(previousValue) {
|
31
|
+
if (this.props.onChange) {
|
32
|
+
this.props.onChange(this.state.value);
|
33
|
+
}
|
34
|
+
if (!this.props.onPropertyChangedObservable) {
|
35
|
+
return;
|
36
|
+
}
|
37
|
+
this.props.onPropertyChangedObservable.notifyObservers({
|
38
|
+
object: this.props.target,
|
39
|
+
property: this.props.propertyName,
|
40
|
+
value: this.state.value,
|
41
|
+
initialValue: previousValue,
|
42
|
+
});
|
43
|
+
}
|
44
|
+
updateVector3() {
|
45
|
+
const store = this.props.target[this.props.propertyName].clone();
|
46
|
+
this.props.target[this.props.propertyName] = this.state.value;
|
47
|
+
this.setState({ value: store });
|
48
|
+
this.raiseOnPropertyChanged(store);
|
49
|
+
}
|
50
|
+
updateStateX(value) {
|
51
|
+
this._localChange = true;
|
52
|
+
this.state.value.x = value;
|
53
|
+
this.updateVector3();
|
54
|
+
}
|
55
|
+
updateStateY(value) {
|
56
|
+
this._localChange = true;
|
57
|
+
this.state.value.y = value;
|
58
|
+
this.updateVector3();
|
59
|
+
}
|
60
|
+
updateStateZ(value) {
|
61
|
+
this._localChange = true;
|
62
|
+
this.state.value.z = value;
|
63
|
+
this.updateVector3();
|
64
|
+
}
|
65
|
+
render() {
|
66
|
+
const chevron = this.state.isExpanded ? _jsx(FontAwesomeIcon, { icon: faMinus }) : _jsx(FontAwesomeIcon, { icon: faPlus });
|
67
|
+
return (_jsxs("div", { className: "vector3Line", children: [_jsxs("div", { className: "firstLine", 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: "vector", children: [!this.props.useEuler && `X: ${this.state.value.x.toFixed(2)}, Y: ${this.state.value.y.toFixed(2)}, Z: ${this.state.value.z.toFixed(2)}`, this.props.useEuler &&
|
68
|
+
`X: ${Tools.ToDegrees(this.state.value.x).toFixed(2)}, Y: ${Tools.ToDegrees(this.state.value.y).toFixed(2)}, Z: ${Tools.ToDegrees(this.state.value.z).toFixed(2)}`] }), _jsx("div", { className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand", children: chevron })] }), this.state.isExpanded && !this.props.useEuler && (_jsxs("div", { className: "secondLine", children: [_jsx(NumericInputComponent, { label: "x", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.x, onChange: (value) => this.updateStateX(value) }), _jsx(NumericInputComponent, { label: "y", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.y, onChange: (value) => this.updateStateY(value) }), _jsx(NumericInputComponent, { label: "z", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.z, onChange: (value) => this.updateStateZ(value) })] })), this.state.isExpanded && this.props.useEuler && !this.props.noSlider && (_jsxs("div", { className: "secondLine", children: [_jsx(SliderLineComponent, { lockObject: this.props.lockObject, margin: true, label: "x", minimum: 0, maximum: 360, step: 0.1, directValue: Tools.ToDegrees(this.state.value.x), onChange: (value) => this.updateStateX(Tools.ToRadians(value)) }), _jsx(SliderLineComponent, { lockObject: this.props.lockObject, margin: true, label: "y", minimum: 0, maximum: 360, step: 0.1, directValue: Tools.ToDegrees(this.state.value.y), onChange: (value) => this.updateStateY(Tools.ToRadians(value)) }), _jsx(SliderLineComponent, { lockObject: this.props.lockObject, margin: true, label: "z", minimum: 0, maximum: 360, step: 0.1, directValue: Tools.ToDegrees(this.state.value.z), onChange: (value) => this.updateStateZ(Tools.ToRadians(value)) })] })), this.state.isExpanded && this.props.useEuler && this.props.noSlider && (_jsxs("div", { className: "secondLine", children: [_jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "x", step: this.props.step, value: Tools.ToDegrees(this.state.value.x), onChange: (value) => this.updateStateX(Tools.ToRadians(value)) }), _jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "y", step: this.props.step, value: Tools.ToDegrees(this.state.value.y), onChange: (value) => this.updateStateY(Tools.ToRadians(value)) }), _jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "z", step: this.props.step, value: Tools.ToDegrees(this.state.value.z), onChange: (value) => this.updateStateZ(Tools.ToRadians(value)) })] }))] }));
|
69
|
+
}
|
70
|
+
}
|
71
|
+
// eslint-disable-next-line @typescript-eslint/naming-convention
|
72
|
+
Vector3LineComponent.defaultProps = {
|
73
|
+
step: 0.001, // cm
|
74
|
+
};
|
75
75
|
//# sourceMappingURL=vector3LineComponent.js.map
|
@@ -1,42 +1,42 @@
|
|
1
|
-
import * as React from "react";
|
2
|
-
import type { Vector4 } from "@babylonjs/core/Maths/math.vector.js";
|
3
|
-
import type { Observable } from "@babylonjs/core/Misc/observable.js";
|
4
|
-
import type { PropertyChangedEvent } from "../propertyChangedEvent";
|
5
|
-
import type { LockObject } from "../tabs/propertyGrids/lockObject";
|
6
|
-
interface IVector4LineComponentProps {
|
7
|
-
label: string;
|
8
|
-
target?: any;
|
9
|
-
propertyName?: string;
|
10
|
-
step?: number;
|
11
|
-
onChange?: (newvalue: Vector4) => void;
|
12
|
-
useEuler?: boolean;
|
13
|
-
onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
|
14
|
-
icon?: string;
|
15
|
-
iconLabel?: string;
|
16
|
-
value?: Vector4;
|
17
|
-
lockObject: LockObject;
|
18
|
-
}
|
19
|
-
export declare class Vector4LineComponent extends React.Component<IVector4LineComponentProps, {
|
20
|
-
isExpanded: boolean;
|
21
|
-
value: Vector4;
|
22
|
-
}> {
|
23
|
-
static defaultProps: {
|
24
|
-
step: number;
|
25
|
-
};
|
26
|
-
private _localChange;
|
27
|
-
constructor(props: IVector4LineComponentProps);
|
28
|
-
getCurrentValue(): any;
|
29
|
-
shouldComponentUpdate(nextProps: IVector4LineComponentProps, nextState: {
|
30
|
-
isExpanded: boolean;
|
31
|
-
value: Vector4;
|
32
|
-
}): boolean;
|
33
|
-
switchExpandState(): void;
|
34
|
-
raiseOnPropertyChanged(previousValue: Vector4): void;
|
35
|
-
updateVector4(): void;
|
36
|
-
updateStateX(value: number): void;
|
37
|
-
updateStateY(value: number): void;
|
38
|
-
updateStateZ(value: number): void;
|
39
|
-
updateStateW(value: number): void;
|
40
|
-
render(): JSX.Element;
|
41
|
-
}
|
42
|
-
export {};
|
1
|
+
import * as React from "react";
|
2
|
+
import type { Vector4 } from "@babylonjs/core/Maths/math.vector.js";
|
3
|
+
import type { Observable } from "@babylonjs/core/Misc/observable.js";
|
4
|
+
import type { PropertyChangedEvent } from "../propertyChangedEvent";
|
5
|
+
import type { LockObject } from "../tabs/propertyGrids/lockObject";
|
6
|
+
interface IVector4LineComponentProps {
|
7
|
+
label: string;
|
8
|
+
target?: any;
|
9
|
+
propertyName?: string;
|
10
|
+
step?: number;
|
11
|
+
onChange?: (newvalue: Vector4) => void;
|
12
|
+
useEuler?: boolean;
|
13
|
+
onPropertyChangedObservable?: Observable<PropertyChangedEvent>;
|
14
|
+
icon?: string;
|
15
|
+
iconLabel?: string;
|
16
|
+
value?: Vector4;
|
17
|
+
lockObject: LockObject;
|
18
|
+
}
|
19
|
+
export declare class Vector4LineComponent extends React.Component<IVector4LineComponentProps, {
|
20
|
+
isExpanded: boolean;
|
21
|
+
value: Vector4;
|
22
|
+
}> {
|
23
|
+
static defaultProps: {
|
24
|
+
step: number;
|
25
|
+
};
|
26
|
+
private _localChange;
|
27
|
+
constructor(props: IVector4LineComponentProps);
|
28
|
+
getCurrentValue(): any;
|
29
|
+
shouldComponentUpdate(nextProps: IVector4LineComponentProps, nextState: {
|
30
|
+
isExpanded: boolean;
|
31
|
+
value: Vector4;
|
32
|
+
}): boolean;
|
33
|
+
switchExpandState(): void;
|
34
|
+
raiseOnPropertyChanged(previousValue: Vector4): void;
|
35
|
+
updateVector4(): void;
|
36
|
+
updateStateX(value: number): void;
|
37
|
+
updateStateY(value: number): void;
|
38
|
+
updateStateZ(value: number): void;
|
39
|
+
updateStateW(value: number): void;
|
40
|
+
render(): JSX.Element;
|
41
|
+
}
|
42
|
+
export {};
|
@@ -1,82 +1,82 @@
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
|
-
import * as React from "react";
|
3
|
-
import { NumericInputComponent } from "./numericInputComponent.js";
|
4
|
-
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
5
|
-
import { faMinus, faPlus } from "@fortawesome/free-solid-svg-icons";
|
6
|
-
export class Vector4LineComponent extends React.Component {
|
7
|
-
constructor(props) {
|
8
|
-
super(props);
|
9
|
-
this._localChange = false;
|
10
|
-
this.state = { isExpanded: false, value: this.getCurrentValue().clone() };
|
11
|
-
}
|
12
|
-
getCurrentValue() {
|
13
|
-
return this.props.value || this.props.target[this.props.propertyName];
|
14
|
-
}
|
15
|
-
shouldComponentUpdate(nextProps, nextState) {
|
16
|
-
const nextPropsValue = this.getCurrentValue();
|
17
|
-
if (!nextPropsValue.equals(nextState.value) || this._localChange) {
|
18
|
-
nextState.value = nextPropsValue.clone();
|
19
|
-
this._localChange = false;
|
20
|
-
return true;
|
21
|
-
}
|
22
|
-
return false;
|
23
|
-
}
|
24
|
-
switchExpandState() {
|
25
|
-
this._localChange = true;
|
26
|
-
this.setState({ isExpanded: !this.state.isExpanded });
|
27
|
-
}
|
28
|
-
raiseOnPropertyChanged(previousValue) {
|
29
|
-
if (this.props.onChange) {
|
30
|
-
this.props.onChange(this.state.value);
|
31
|
-
}
|
32
|
-
if (!this.props.onPropertyChangedObservable) {
|
33
|
-
return;
|
34
|
-
}
|
35
|
-
this.props.onPropertyChangedObservable.notifyObservers({
|
36
|
-
object: this.props.target,
|
37
|
-
property: this.props.propertyName || "",
|
38
|
-
value: this.state.value,
|
39
|
-
initialValue: previousValue,
|
40
|
-
});
|
41
|
-
}
|
42
|
-
updateVector4() {
|
43
|
-
const store = this.getCurrentValue().clone();
|
44
|
-
if (this.props.value) {
|
45
|
-
this.props.value.copyFrom(this.state.value);
|
46
|
-
}
|
47
|
-
else {
|
48
|
-
this.props.target[this.props.propertyName] = this.state.value;
|
49
|
-
}
|
50
|
-
this.setState({ value: store });
|
51
|
-
this.raiseOnPropertyChanged(store);
|
52
|
-
}
|
53
|
-
updateStateX(value) {
|
54
|
-
this._localChange = true;
|
55
|
-
this.state.value.x = value;
|
56
|
-
this.updateVector4();
|
57
|
-
}
|
58
|
-
updateStateY(value) {
|
59
|
-
this._localChange = true;
|
60
|
-
this.state.value.y = value;
|
61
|
-
this.updateVector4();
|
62
|
-
}
|
63
|
-
updateStateZ(value) {
|
64
|
-
this._localChange = true;
|
65
|
-
this.state.value.z = value;
|
66
|
-
this.updateVector4();
|
67
|
-
}
|
68
|
-
updateStateW(value) {
|
69
|
-
this._localChange = true;
|
70
|
-
this.state.value.w = value;
|
71
|
-
this.updateVector4();
|
72
|
-
}
|
73
|
-
render() {
|
74
|
-
const chevron = this.state.isExpanded ? _jsx(FontAwesomeIcon, { icon: faMinus }) : _jsx(FontAwesomeIcon, { icon: faPlus });
|
75
|
-
return (_jsxs("div", { className: "vector3Line", children: [_jsxs("div", { className: "firstLine", children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), _jsx("div", { className: "label", title: this.props.label, children: this.props.label }), _jsx("div", { className: "vector", children: `X: ${this.state.value.x.toFixed(2)}, Y: ${this.state.value.y.toFixed(2)}, Z: ${this.state.value.z.toFixed(2)}, W: ${this.state.value.w.toFixed(2)}` }), _jsx("div", { className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand", children: chevron })] }), _jsxs("div", { className: "secondLine", children: [_jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "x", step: this.props.step, value: this.state.value.x, onChange: (value) => this.updateStateX(value) }), _jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "y", step: this.props.step, value: this.state.value.y, onChange: (value) => this.updateStateY(value) }), _jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "z", step: this.props.step, value: this.state.value.z, onChange: (value) => this.updateStateZ(value) }), _jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "w", step: this.props.step, value: this.state.value.w, onChange: (value) => this.updateStateW(value) })] })] }));
|
76
|
-
}
|
77
|
-
}
|
78
|
-
// eslint-disable-next-line @typescript-eslint/naming-convention
|
79
|
-
Vector4LineComponent.defaultProps = {
|
80
|
-
step: 0.001, // cm
|
81
|
-
};
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
2
|
+
import * as React from "react";
|
3
|
+
import { NumericInputComponent } from "./numericInputComponent.js";
|
4
|
+
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
5
|
+
import { faMinus, faPlus } from "@fortawesome/free-solid-svg-icons";
|
6
|
+
export class Vector4LineComponent extends React.Component {
|
7
|
+
constructor(props) {
|
8
|
+
super(props);
|
9
|
+
this._localChange = false;
|
10
|
+
this.state = { isExpanded: false, value: this.getCurrentValue().clone() };
|
11
|
+
}
|
12
|
+
getCurrentValue() {
|
13
|
+
return this.props.value || this.props.target[this.props.propertyName];
|
14
|
+
}
|
15
|
+
shouldComponentUpdate(nextProps, nextState) {
|
16
|
+
const nextPropsValue = this.getCurrentValue();
|
17
|
+
if (!nextPropsValue.equals(nextState.value) || this._localChange) {
|
18
|
+
nextState.value = nextPropsValue.clone();
|
19
|
+
this._localChange = false;
|
20
|
+
return true;
|
21
|
+
}
|
22
|
+
return false;
|
23
|
+
}
|
24
|
+
switchExpandState() {
|
25
|
+
this._localChange = true;
|
26
|
+
this.setState({ isExpanded: !this.state.isExpanded });
|
27
|
+
}
|
28
|
+
raiseOnPropertyChanged(previousValue) {
|
29
|
+
if (this.props.onChange) {
|
30
|
+
this.props.onChange(this.state.value);
|
31
|
+
}
|
32
|
+
if (!this.props.onPropertyChangedObservable) {
|
33
|
+
return;
|
34
|
+
}
|
35
|
+
this.props.onPropertyChangedObservable.notifyObservers({
|
36
|
+
object: this.props.target,
|
37
|
+
property: this.props.propertyName || "",
|
38
|
+
value: this.state.value,
|
39
|
+
initialValue: previousValue,
|
40
|
+
});
|
41
|
+
}
|
42
|
+
updateVector4() {
|
43
|
+
const store = this.getCurrentValue().clone();
|
44
|
+
if (this.props.value) {
|
45
|
+
this.props.value.copyFrom(this.state.value);
|
46
|
+
}
|
47
|
+
else {
|
48
|
+
this.props.target[this.props.propertyName] = this.state.value;
|
49
|
+
}
|
50
|
+
this.setState({ value: store });
|
51
|
+
this.raiseOnPropertyChanged(store);
|
52
|
+
}
|
53
|
+
updateStateX(value) {
|
54
|
+
this._localChange = true;
|
55
|
+
this.state.value.x = value;
|
56
|
+
this.updateVector4();
|
57
|
+
}
|
58
|
+
updateStateY(value) {
|
59
|
+
this._localChange = true;
|
60
|
+
this.state.value.y = value;
|
61
|
+
this.updateVector4();
|
62
|
+
}
|
63
|
+
updateStateZ(value) {
|
64
|
+
this._localChange = true;
|
65
|
+
this.state.value.z = value;
|
66
|
+
this.updateVector4();
|
67
|
+
}
|
68
|
+
updateStateW(value) {
|
69
|
+
this._localChange = true;
|
70
|
+
this.state.value.w = value;
|
71
|
+
this.updateVector4();
|
72
|
+
}
|
73
|
+
render() {
|
74
|
+
const chevron = this.state.isExpanded ? _jsx(FontAwesomeIcon, { icon: faMinus }) : _jsx(FontAwesomeIcon, { icon: faPlus });
|
75
|
+
return (_jsxs("div", { className: "vector3Line", children: [_jsxs("div", { className: "firstLine", children: [this.props.icon && _jsx("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), _jsx("div", { className: "label", title: this.props.label, children: this.props.label }), _jsx("div", { className: "vector", children: `X: ${this.state.value.x.toFixed(2)}, Y: ${this.state.value.y.toFixed(2)}, Z: ${this.state.value.z.toFixed(2)}, W: ${this.state.value.w.toFixed(2)}` }), _jsx("div", { className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand", children: chevron })] }), _jsxs("div", { className: "secondLine", children: [_jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "x", step: this.props.step, value: this.state.value.x, onChange: (value) => this.updateStateX(value) }), _jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "y", step: this.props.step, value: this.state.value.y, onChange: (value) => this.updateStateY(value) }), _jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "z", step: this.props.step, value: this.state.value.z, onChange: (value) => this.updateStateZ(value) }), _jsx(NumericInputComponent, { lockObject: this.props.lockObject, label: "w", step: this.props.step, value: this.state.value.w, onChange: (value) => this.updateStateW(value) })] })] }));
|
76
|
+
}
|
77
|
+
}
|
78
|
+
// eslint-disable-next-line @typescript-eslint/naming-convention
|
79
|
+
Vector4LineComponent.defaultProps = {
|
80
|
+
step: 0.001, // cm
|
81
|
+
};
|
82
82
|
//# sourceMappingURL=vector4LineComponent.js.map
|
@@ -1,5 +1,5 @@
|
|
1
|
-
export declare class DisplayLedger {
|
2
|
-
static RegisteredControls: {
|
3
|
-
[key: string]: any;
|
4
|
-
};
|
5
|
-
}
|
1
|
+
export declare class DisplayLedger {
|
2
|
+
static RegisteredControls: {
|
3
|
+
[key: string]: any;
|
4
|
+
};
|
5
|
+
}
|
@@ -1,4 +1,4 @@
|
|
1
|
-
export class DisplayLedger {
|
2
|
-
}
|
3
|
-
DisplayLedger.RegisteredControls = {};
|
1
|
+
export class DisplayLedger {
|
2
|
+
}
|
3
|
+
DisplayLedger.RegisteredControls = {};
|
4
4
|
//# sourceMappingURL=displayLedger.js.map
|