@babylonjs/gui-editor 5.21.0 → 5.23.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.
|
@@ -255,15 +255,15 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
255
255
|
|
|
256
256
|
var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
|
|
257
257
|
// Module
|
|
258
|
-
___CSS_LOADER_EXPORT___.push([module.id, "
|
|
258
|
+
___CSS_LOADER_EXPORT___.push([module.id, ".\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-container {\n position: absolute;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.6);\n display: grid;\n font-family: \"acumin-pro\";\n top: 0; }\n .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-container .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog {\n align-self: center;\n justify-self: center;\n min-height: 140px;\n max-width: 400px;\n border-radius: 10px;\n background: white;\n padding: 10px;\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: 1fr 50px; }\n .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-container .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-message {\n grid-row: 1;\n grid-column: 1;\n margin-top: 20px;\n padding: 10px;\n font-size: 18px;\n color: black; }\n .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-container .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-buttons {\n grid-row: 2;\n grid-column: 1;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%;\n color: white; }\n .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-container .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-buttons .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-button-ok {\n cursor: pointer;\n justify-self: center;\n background: green;\n min-width: 80px;\n justify-content: center;\n display: grid;\n align-content: center;\n align-self: center;\n height: 35px;\n border-radius: 10px; }\n .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-container .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-buttons .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-button-ok:hover {\n opacity: 0.8; }\n .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-container .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-buttons .\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-button-ok.\\---------dev-sharedUiComponents-dist-components-MessageDialog-modules__error {\n background: red; }\n", "",{"version":3,"sources":["webpack://./../../../dev/sharedUiComponents/dist/components/MessageDialog.modules.scss"],"names":[],"mappings":"AAAA;EACI,kBAAkB;EAClB,WAAW;EACX,YAAY;EACZ,8BAAoC;EACpC,aAAa;EACb,yBAAyB;EACzB,MAAM,EAAA;EAPV;IAUQ,kBAAkB;IAClB,oBAAoB;IACpB,iBAAiB;IACjB,gBAAgB;IAChB,mBAAmB;IACnB,iBAAiB;IACjB,aAAa;IAEb,aAAa;IACb,2BAA2B;IAC3B,4BAA4B,EAAA;IApBpC;MAuBY,WAAW;MACX,cAAc;MACd,gBAAgB;MAChB,aAAa;MACb,eAAe;MACf,YAAY,EAAA;IA5BxB;MAgCY,WAAW;MACX,cAAc;MACd,aAAa;MACb,wBAAwB;MACxB,2BAA2B;MAC3B,YAAY,EAAA;MArCxB;QAwCgB,eAAe;QACf,oBAAoB;QACpB,iBAAiB;QACjB,eAAe;QACf,uBAAuB;QACvB,aAAa;QACb,qBAAqB;QACrB,kBAAkB;QAClB,YAAY;QACZ,mBAAmB,EAAA;QAjDnC;UAoDoB,YAAY,EAAA;QApDhC;UAwDoB,eAAe,EAAA","sourcesContent":[":local .dialog-container {\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n background: rgba(0.1, 0.1, 0.1, 0.6);\r\n display: grid;\r\n font-family: \"acumin-pro\";\r\n top: 0;\r\n\r\n .dialog {\r\n align-self: center;\r\n justify-self: center;\r\n min-height: 140px;\r\n max-width: 400px;\r\n border-radius: 10px;\r\n background: white;\r\n padding: 10px;\r\n\r\n display: grid;\r\n grid-template-columns: 100%;\r\n grid-template-rows: 1fr 50px;\r\n\r\n .dialog-message {\r\n grid-row: 1;\r\n grid-column: 1;\r\n margin-top: 20px;\r\n padding: 10px;\r\n font-size: 18px;\r\n color: black;\r\n }\r\n\r\n .dialog-buttons {\r\n grid-row: 2;\r\n grid-column: 1;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 100%;\r\n color: white;\r\n\r\n .dialog-button-ok {\r\n cursor: pointer;\r\n justify-self: center;\r\n background: green;\r\n min-width: 80px;\r\n justify-content: center;\r\n display: grid;\r\n align-content: center;\r\n align-self: center;\r\n height: 35px;\r\n border-radius: 10px;\r\n\r\n &:hover {\r\n opacity: 0.8;\r\n }\r\n\r\n &.error {\r\n background: red;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
|
|
259
259
|
// Exports
|
|
260
260
|
___CSS_LOADER_EXPORT___.locals = {
|
|
261
|
-
"dialog-container": "
|
|
262
|
-
"dialog": "
|
|
263
|
-
"dialog-message": "
|
|
264
|
-
"dialog-buttons": "
|
|
265
|
-
"dialog-button-ok": "
|
|
266
|
-
"error": "
|
|
261
|
+
"dialog-container": "---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-container",
|
|
262
|
+
"dialog": "---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog",
|
|
263
|
+
"dialog-message": "---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-message",
|
|
264
|
+
"dialog-buttons": "---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-buttons",
|
|
265
|
+
"dialog-button-ok": "---------dev-sharedUiComponents-dist-components-MessageDialog-modules__dialog-button-ok",
|
|
266
|
+
"error": "---------dev-sharedUiComponents-dist-components-MessageDialog-modules__error"
|
|
267
267
|
};
|
|
268
268
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
|
|
269
269
|
|
|
@@ -49559,7 +49559,7 @@ class ColorComponentEntry extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
49559
49559
|
}
|
|
49560
49560
|
}
|
|
49561
49561
|
render() {
|
|
49562
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
49562
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "color-picker-component", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-component-value", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "number", step: 1, className: "numeric-input", value: this.props.value, onBlur: () => this.unlock(), onFocus: () => this.lock(), onChange: (evt) => this.updateValue(evt.target.value), disabled: this.props.disabled }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-component-label", children: this.props.label })] }));
|
|
49563
49563
|
}
|
|
49564
49564
|
}
|
|
49565
49565
|
|
|
@@ -49687,29 +49687,29 @@ class ColorPicker extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
49687
49687
|
core_Maths_math_color__WEBPACK_IMPORTED_MODULE_2__.Color3.HSVtoRGBToRef(hsv.r, 1, 1, colorRef);
|
|
49688
49688
|
const colorHexRef = colorRef.toHexString();
|
|
49689
49689
|
const hasAlpha = this.props.color instanceof core_Maths_math_color__WEBPACK_IMPORTED_MODULE_2__.Color4;
|
|
49690
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
49690
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "color-picker-container" + (this.props.linearhint ? " with-hints" : ""), children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "color-picker-saturation", onPointerMove: (e) => this.onSaturationPointerMove(e), onPointerDown: (e) => this.onSaturationPointerDown(e), onPointerUp: (e) => this.onSaturationPointerUp(e), ref: this._saturationRef, style: {
|
|
49691
49691
|
background: colorHexRef,
|
|
49692
|
-
}
|
|
49692
|
+
}, children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-saturation-white" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-saturation-black" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-saturation-cursor", style: {
|
|
49693
49693
|
top: `${-(hsv.b * 100) + 100}%`,
|
|
49694
49694
|
left: `${hsv.g * 100}%`,
|
|
49695
|
-
} })] })
|
|
49695
|
+
} })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "color-picker-hue", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-hue-color", style: {
|
|
49696
49696
|
background: colorHex,
|
|
49697
|
-
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
49697
|
+
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-hue-slider", ref: this._hueRef, onPointerMove: (e) => this.onHuePointerMove(e), onPointerDown: (e) => this.onHuePointerDown(e), onPointerUp: (e) => this.onHuePointerUp(e), children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-hue-cursor", style: {
|
|
49698
49698
|
left: `${(hsv.r / 360.0) * 100}%`,
|
|
49699
49699
|
border: `1px solid ` + colorHexRef,
|
|
49700
|
-
} }) })
|
|
49700
|
+
} }) })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-alpha" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "color-picker-rgb", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "red", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorComponentEntry__WEBPACK_IMPORTED_MODULE_3__.ColorComponentEntry, { lockObject: this.props.lockObject, label: "R", min: 0, max: 255, value: Math.round(this.state.color.r * 255), onChange: (value) => {
|
|
49701
49701
|
this.state.color.r = value / 255.0;
|
|
49702
49702
|
this.forceUpdate();
|
|
49703
|
-
} }) })
|
|
49703
|
+
} }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "green", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorComponentEntry__WEBPACK_IMPORTED_MODULE_3__.ColorComponentEntry, { lockObject: this.props.lockObject, label: "G", min: 0, max: 255, value: Math.round(this.state.color.g * 255), onChange: (value) => {
|
|
49704
49704
|
this.state.color.g = value / 255.0;
|
|
49705
49705
|
this.forceUpdate();
|
|
49706
|
-
} }) })
|
|
49706
|
+
} }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "blue", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorComponentEntry__WEBPACK_IMPORTED_MODULE_3__.ColorComponentEntry, { lockObject: this.props.lockObject, label: "B", min: 0, max: 255, value: Math.round(this.state.color.b * 255), onChange: (value) => {
|
|
49707
49707
|
this.state.color.b = value / 255.0;
|
|
49708
49708
|
this.forceUpdate();
|
|
49709
|
-
} }) })
|
|
49709
|
+
} }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "alpha" + (hasAlpha ? "" : " grayed"), children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorComponentEntry__WEBPACK_IMPORTED_MODULE_3__.ColorComponentEntry, { lockObject: this.props.lockObject, label: "A", min: 0, max: 255, value: Math.round(this.state.alpha * 255), onChange: (value) => {
|
|
49710
49710
|
this.setState({ alpha: value / 255.0 });
|
|
49711
49711
|
this.forceUpdate();
|
|
49712
|
-
} }) })
|
|
49712
|
+
} }) })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "color-picker-hex", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-hex-label", children: "Hex" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-hex-value", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_hexColor__WEBPACK_IMPORTED_MODULE_4__.HexColor, { lockObject: this.props.lockObject, expectedLength: hasAlpha ? 8 : 6, value: colorHex, onChange: (value) => {
|
|
49713
49713
|
if (hasAlpha) {
|
|
49714
49714
|
const color4 = core_Maths_math_color__WEBPACK_IMPORTED_MODULE_2__.Color4.FromHexString(value);
|
|
49715
49715
|
this.setState({ color: new core_Maths_math_color__WEBPACK_IMPORTED_MODULE_2__.Color3(color4.r, color4.g, color4.b), alpha: color4.a });
|
|
@@ -49717,7 +49717,7 @@ class ColorPicker extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
49717
49717
|
else {
|
|
49718
49718
|
this.setState({ color: core_Maths_math_color__WEBPACK_IMPORTED_MODULE_2__.Color3.FromHexString(value) });
|
|
49719
49719
|
}
|
|
49720
|
-
} }) })
|
|
49720
|
+
} }) })] }), this.props.linearhint && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-warning", children: "(Note: color is stored in linear mode and was converted to gamma to be displayed here (toGammaSpace() / toLinearSpace()))" }))] }));
|
|
49721
49721
|
}
|
|
49722
49722
|
}
|
|
49723
49723
|
|
|
@@ -49809,10 +49809,16 @@ const MessageDialog = (props) => {
|
|
|
49809
49809
|
setMessage(props.message);
|
|
49810
49810
|
setIsError(props.isError);
|
|
49811
49811
|
}, [props]);
|
|
49812
|
+
const onClick = () => {
|
|
49813
|
+
setMessage("");
|
|
49814
|
+
if (props.onClose) {
|
|
49815
|
+
props.onClose();
|
|
49816
|
+
}
|
|
49817
|
+
};
|
|
49812
49818
|
if (!message) {
|
|
49813
49819
|
return null;
|
|
49814
49820
|
}
|
|
49815
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
49821
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: _MessageDialog_modules_scss__WEBPACK_IMPORTED_MODULE_3__["default"]["dialog-container"], children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: _MessageDialog_modules_scss__WEBPACK_IMPORTED_MODULE_3__["default"].dialog, children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: _MessageDialog_modules_scss__WEBPACK_IMPORTED_MODULE_3__["default"]["dialog-message"], children: message }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: _MessageDialog_modules_scss__WEBPACK_IMPORTED_MODULE_3__["default"]["dialog-buttons"], children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: (0,_classNames__WEBPACK_IMPORTED_MODULE_2__.ClassNames)({ "dialog-button-ok": true, error: isError }, _MessageDialog_modules_scss__WEBPACK_IMPORTED_MODULE_3__["default"]), onClick: onClick, children: "OK" }) })] }) }));
|
|
49816
49822
|
};
|
|
49817
49823
|
|
|
49818
49824
|
|
|
@@ -49897,7 +49903,7 @@ class CheckBoxLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
49897
49903
|
};
|
|
49898
49904
|
}
|
|
49899
49905
|
if (this.props.disabled) {
|
|
49900
|
-
this.state =
|
|
49906
|
+
this.state = { ...this.state, isDisabled: this.props.disabled };
|
|
49901
49907
|
}
|
|
49902
49908
|
}
|
|
49903
49909
|
shouldComponentUpdate(nextProps, nextState) {
|
|
@@ -49947,7 +49953,7 @@ class CheckBoxLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
49947
49953
|
render() {
|
|
49948
49954
|
const icons = this.props.large ? Icons.size40 : Icons.size30;
|
|
49949
49955
|
const icon = this.state.isConflict ? icons.mixed : this.state.isSelected ? icons.on : icons.off;
|
|
49950
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
49956
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "checkBoxLine", children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), this.props.label && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "label", title: this.props.iconLabel, children: this.props.label })), this.props.faIcons && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_2__.FontAwesomeIcon, { className: `cbx ${this.props.disabled ? "disabled" : ""}`, icon: this.state.isSelected ? this.props.faIcons.enabled : this.props.faIcons.disabled, onClick: () => !this.props.disabled && this.onChange() })), !this.props.faIcons && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "checkBox", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("label", { className: `container lbl${this.props.disabled ? " disabled" : ""} ${this.state.isSelected ? "checked" : ""}`, children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "checkbox", className: `cbx hidden ${this.state.isConflict ? "conflict" : ""}`, checked: this.state.isSelected, onChange: () => this.onChange(), disabled: !!this.props.disabled }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { className: "icon", src: icon, alt: this.props.label })] }) }))] }));
|
|
49951
49957
|
}
|
|
49952
49958
|
}
|
|
49953
49959
|
|
|
@@ -50114,9 +50120,9 @@ class ColorLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
50114
50120
|
}
|
|
50115
50121
|
render() {
|
|
50116
50122
|
const chevron = this.state.isExpanded ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_4__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_5__.faMinus }) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_4__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_5__.faPlus });
|
|
50117
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
50123
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "color3Line", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "firstLine", children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "label", title: this.props.label, children: this.props.label }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color3", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorPickerComponent__WEBPACK_IMPORTED_MODULE_6__.ColorPickerLineComponent, { lockObject: this.props.lockObject, linearHint: this.props.isLinear, value: this.props.disableAlpha ? this._toColor3(this.state.color) : this.state.color, onColorChanged: (colorString) => {
|
|
50118
50124
|
this.setColorFromString(colorString);
|
|
50119
|
-
} }) })
|
|
50125
|
+
} }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "copy hoverIcon", onClick: () => this.copyToClipboard(), title: "Copy to clipboard", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _copy_svg__WEBPACK_IMPORTED_MODULE_8__, alt: "Copy" }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand", children: chevron })] }), this.state.isExpanded && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "secondLine", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "r", value: this.state.color.r, onChange: (value) => this.updateStateR(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "g", value: this.state.color.g, onChange: (value) => this.updateStateG(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "b", value: this.state.color.b, onChange: (value) => this.updateStateB(value) }), this.props.disableAlpha || ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "a", value: this.state.color.a, onChange: (value) => this.updateStateA(value) }))] }))] }));
|
|
50120
50126
|
}
|
|
50121
50127
|
}
|
|
50122
50128
|
|
|
@@ -50184,17 +50190,16 @@ class ColorPickerLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compon
|
|
|
50184
50190
|
this.syncPositions();
|
|
50185
50191
|
}
|
|
50186
50192
|
render() {
|
|
50187
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
50188
|
-
|
|
50189
|
-
if (evt.target !== ((_b = (_a = this._floatRef.current) === null || _a === void 0 ? void 0 : _a.ownerDocument) === null || _b === void 0 ? void 0 : _b.querySelector(".color-picker-cover"))) {
|
|
50193
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "color-picker", children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-rect-background", ref: this._floatHostRef, onClick: () => this.setState({ pickerEnabled: true }), children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-rect", style: { background: this.state.hex } }) }), this.state.pickerEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-cover", onClick: (evt) => {
|
|
50194
|
+
if (evt.target !== this._floatRef.current?.ownerDocument?.querySelector(".color-picker-cover")) {
|
|
50190
50195
|
return;
|
|
50191
50196
|
}
|
|
50192
50197
|
this.setState({ pickerEnabled: false });
|
|
50193
|
-
}
|
|
50198
|
+
}, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-picker-float", ref: this._floatRef, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorPicker_colorPicker__WEBPACK_IMPORTED_MODULE_2__.ColorPicker, { lockObject: this.props.lockObject || {}, color: this.state.color, linearhint: this.props.linearHint, onColorChanged: (color) => {
|
|
50194
50199
|
const hex = color.toHexString();
|
|
50195
50200
|
this.setState({ hex, color });
|
|
50196
50201
|
this.props.onColorChanged(hex);
|
|
50197
|
-
} }) })
|
|
50202
|
+
} }) }) }) }))] }));
|
|
50198
50203
|
}
|
|
50199
50204
|
}
|
|
50200
50205
|
|
|
@@ -50230,7 +50235,7 @@ class FileButtonLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compone
|
|
|
50230
50235
|
evt.target.value = "";
|
|
50231
50236
|
}
|
|
50232
50237
|
render() {
|
|
50233
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
50238
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "buttonLine", children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("label", { htmlFor: "file-upload" + this._id, className: "file-upload", children: this.props.label }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { ref: this._uploadInputRef, id: "file-upload" + this._id, type: "file", accept: this.props.accept, onChange: (evt) => this.onChange(evt) })] }));
|
|
50234
50239
|
}
|
|
50235
50240
|
}
|
|
50236
50241
|
FileButtonLineComponent._IDGenerator = 0;
|
|
@@ -50413,7 +50418,7 @@ class FloatLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
50413
50418
|
}
|
|
50414
50419
|
const value = this.state.value === _targetsProxy__WEBPACK_IMPORTED_MODULE_4__.conflictingValuesPlaceholder ? "" : this.state.value;
|
|
50415
50420
|
const placeholder = this.state.value === _targetsProxy__WEBPACK_IMPORTED_MODULE_4__.conflictingValuesPlaceholder ? _targetsProxy__WEBPACK_IMPORTED_MODULE_4__.conflictingValuesPlaceholder : "";
|
|
50416
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [!this.props.useEuler && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
50421
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [!this.props.useEuler && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: this.props.additionalClass ? this.props.additionalClass + " floatLine" : "floatLine", children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (!this.props.icon || this.props.label != "") && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "label", title: this.props.label, children: this.props.label })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: className, children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "number", step: this.props.step || this.props.isInteger ? "1" : "0.01", className: "numeric-input", onKeyDown: (evt) => this.onKeyDown(evt), value: value, onBlur: () => {
|
|
50417
50422
|
this.unlock();
|
|
50418
50423
|
if (this.props.onEnter) {
|
|
50419
50424
|
this.props.onEnter(this._store);
|
|
@@ -50428,7 +50433,7 @@ class FloatLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
50428
50433
|
this.props.onDragStop(valueAsNumber);
|
|
50429
50434
|
}
|
|
50430
50435
|
this.setState({ dragging: newDragging });
|
|
50431
|
-
} }))] })
|
|
50436
|
+
} }))] }), this.props.unit] })), this.props.useEuler && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sliderLineComponent__WEBPACK_IMPORTED_MODULE_2__.SliderLineComponent, { lockObject: this.props.lockObject, label: this.props.label, minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Tools.ToDegrees(valueAsNumber), onChange: (value) => this.updateValue(core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Tools.ToRadians(value).toString()) }))] }));
|
|
50432
50437
|
}
|
|
50433
50438
|
}
|
|
50434
50439
|
|
|
@@ -50486,29 +50491,26 @@ class InputArrowsComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
50486
50491
|
this.props.incrementValue(-event.movementY);
|
|
50487
50492
|
};
|
|
50488
50493
|
this._releaseListener = () => {
|
|
50489
|
-
var _a, _b, _c, _d;
|
|
50490
50494
|
this.props.setDragging(false);
|
|
50491
|
-
|
|
50492
|
-
|
|
50493
|
-
|
|
50494
|
-
|
|
50495
|
+
this._arrowsRef.current?.ownerDocument.exitPointerLock();
|
|
50496
|
+
this._arrowsRef.current?.ownerDocument.defaultView.removeEventListener("pointerup", this._releaseListener);
|
|
50497
|
+
this._arrowsRef.current?.ownerDocument.removeEventListener("pointerlockchange", this._lockChangeListener);
|
|
50498
|
+
this._arrowsRef.current?.ownerDocument.defaultView.removeEventListener("mousemove", this._drag);
|
|
50495
50499
|
};
|
|
50496
50500
|
this._lockChangeListener = () => {
|
|
50497
|
-
|
|
50498
|
-
if (((_a = this._arrowsRef.current) === null || _a === void 0 ? void 0 : _a.ownerDocument.pointerLockElement) !== this._arrowsRef.current) {
|
|
50501
|
+
if (this._arrowsRef.current?.ownerDocument.pointerLockElement !== this._arrowsRef.current) {
|
|
50499
50502
|
this._releaseListener();
|
|
50500
50503
|
}
|
|
50501
50504
|
};
|
|
50502
50505
|
}
|
|
50503
50506
|
render() {
|
|
50504
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
50505
|
-
|
|
50506
|
-
|
|
50507
|
-
|
|
50508
|
-
(_c = this._arrowsRef.current) === null || _c === void 0 ? void 0 : _c.ownerDocument.defaultView.addEventListener("mousemove", this._drag);
|
|
50507
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "arrows", ref: this._arrowsRef, onPointerDown: () => {
|
|
50508
|
+
this._arrowsRef.current?.ownerDocument.addEventListener("pointerlockchange", this._lockChangeListener);
|
|
50509
|
+
this._arrowsRef.current?.ownerDocument.defaultView.addEventListener("pointerup", this._releaseListener);
|
|
50510
|
+
this._arrowsRef.current?.ownerDocument.defaultView.addEventListener("mousemove", this._drag);
|
|
50509
50511
|
this.props.setDragging(true);
|
|
50510
|
-
|
|
50511
|
-
}, onDragStart: (evt) => evt.preventDefault()
|
|
50512
|
+
this._arrowsRef.current?.requestPointerLock();
|
|
50513
|
+
}, onDragStart: (evt) => evt.preventDefault(), children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { className: "upArrowIcon", src: _valueUpArrowIcon_svg__WEBPACK_IMPORTED_MODULE_2__, alt: "Increase Value" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { className: "downArrowIcon", src: _valueDownArrowIcon_svg__WEBPACK_IMPORTED_MODULE_3__, alt: "Increase Value" })] }));
|
|
50512
50514
|
}
|
|
50513
50515
|
}
|
|
50514
50516
|
|
|
@@ -50602,11 +50604,11 @@ class NumericInputComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
50602
50604
|
}
|
|
50603
50605
|
}
|
|
50604
50606
|
render() {
|
|
50605
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
50607
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "numeric", children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), this.props.label && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "numeric-label", title: this.props.label, children: `${this.props.label}: ` })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "number", step: this.props.step, className: "numeric-input", value: this.state.value, onChange: (evt) => this.updateValue(evt.target.value), onKeyDown: (evt) => this.onKeyDown(evt), onFocus: () => {
|
|
50606
50608
|
if (this.props.lockObject) {
|
|
50607
50609
|
this.props.lockObject.lock = true;
|
|
50608
50610
|
}
|
|
50609
|
-
}, onBlur: () => this.onBlur() })] }))
|
|
50611
|
+
}, onBlur: () => this.onBlur() })] }));
|
|
50610
50612
|
}
|
|
50611
50613
|
}
|
|
50612
50614
|
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
@@ -50695,10 +50697,9 @@ class OptionsLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
50695
50697
|
this.raiseOnPropertyChanged(newValue, store);
|
|
50696
50698
|
}
|
|
50697
50699
|
render() {
|
|
50698
|
-
|
|
50699
|
-
|
|
50700
|
-
|
|
50701
|
-
}) })) }))] })));
|
|
50700
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "listLine" + (this.props.className ? " " + this.props.className : ""), children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, color: "black", className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "label", title: this.props.label, children: this.props.label }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "options", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("select", { onChange: (evt) => this.updateValue(evt.target.value), value: this.state.value ?? "", children: this.props.options.map((option, i) => {
|
|
50701
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("option", { selected: option.selected, value: option.value, title: option.label, children: option.label }, option.label + i));
|
|
50702
|
+
}) }) })] }));
|
|
50702
50703
|
}
|
|
50703
50704
|
}
|
|
50704
50705
|
|
|
@@ -50883,13 +50884,13 @@ class SliderLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
50883
50884
|
return value;
|
|
50884
50885
|
}
|
|
50885
50886
|
render() {
|
|
50886
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
50887
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "sliderLine", children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (!this.props.icon || this.props.label != "") && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: this.props.margin ? "label withMargins" : "label", title: this.props.label, children: this.props.label })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: this.props.lockObject, isInteger: this.props.decimalCount === 0, smallUI: true, label: "", target: this.state, digits: this.props.decimalCount === undefined ? 4 : this.props.decimalCount, propertyName: "value", min: this.props.minimum, max: this.props.maximum, onEnter: () => {
|
|
50887
50888
|
const changed = this.prepareDataToRead(this.state.value);
|
|
50888
50889
|
this.onChange(changed);
|
|
50889
50890
|
}, onChange: () => {
|
|
50890
50891
|
const changed = this.prepareDataToRead(this.state.value);
|
|
50891
50892
|
this.onChange(changed);
|
|
50892
|
-
}, onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: this.props.unit }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
50893
|
+
}, onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: this.props.unit }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "slider", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { className: "range", type: "range", step: this.props.step, min: this.prepareDataToRead(this.props.minimum), max: this.prepareDataToRead(this.props.maximum), value: this.prepareDataToRead(this.state.value), onInput: (evt) => this.onInput(evt.target.value), onChange: (evt) => this.onChange(evt.target.value) }) })] }));
|
|
50893
50894
|
}
|
|
50894
50895
|
}
|
|
50895
50896
|
|
|
@@ -51097,7 +51098,7 @@ class TextInputLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
51097
51098
|
const value = this.state.value === _targetsProxy__WEBPACK_IMPORTED_MODULE_2__.conflictingValuesPlaceholder ? "" : this.state.value;
|
|
51098
51099
|
const placeholder = this.state.value === _targetsProxy__WEBPACK_IMPORTED_MODULE_2__.conflictingValuesPlaceholder ? _targetsProxy__WEBPACK_IMPORTED_MODULE_2__.conflictingValuesPlaceholder : this.props.placeholder || "";
|
|
51099
51100
|
const step = this.props.step || (this.props.roundValues ? 1 : 0.01);
|
|
51100
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
51101
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: this.props.multilines ? "textInputArea" : this.props.unit !== undefined ? "textInputLine withUnits" : "textInputLine", children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, color: "black", className: "icon" }), this.props.label !== undefined && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "label", title: this.props.label, children: this.props.label })), this.props.multilines && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("textarea", { value: this.state.value, onFocus: () => {
|
|
51101
51102
|
if (this.props.lockObject) {
|
|
51102
51103
|
this.props.lockObject.lock = true;
|
|
51103
51104
|
}
|
|
@@ -51111,7 +51112,7 @@ class TextInputLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
51111
51112
|
if (this.props.lockObject) {
|
|
51112
51113
|
this.props.lockObject.lock = false;
|
|
51113
51114
|
}
|
|
51114
|
-
} }) })), !this.props.multilines && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
51115
|
+
} }) })), !this.props.multilines && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: `value${this.props.noUnderline === true ? " noUnderline" : ""}${this.props.arrows ? " hasArrows" : ""}${this.state.dragging ? " dragging" : ""}`, children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { value: value, onBlur: (evt) => {
|
|
51115
51116
|
if (this.props.lockObject) {
|
|
51116
51117
|
this.props.lockObject.lock = false;
|
|
51117
51118
|
}
|
|
@@ -51120,7 +51121,7 @@ class TextInputLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
51120
51121
|
if (this.props.lockObject) {
|
|
51121
51122
|
this.props.lockObject.lock = true;
|
|
51122
51123
|
}
|
|
51123
|
-
}, onChange: (evt) => this.updateValue(evt.target.value), onKeyDown: (evt) => this.onKeyDown(evt), placeholder: placeholder, type: this.props.numeric ? "number" : "text", step: step }), this.props.arrows && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_inputArrowsComponent__WEBPACK_IMPORTED_MODULE_3__.InputArrowsComponent, { incrementValue: (amount) => this.incrementValue(amount), setDragging: (dragging) => this.setState({ dragging }) }))] }))
|
|
51124
|
+
}, onChange: (evt) => this.updateValue(evt.target.value), onKeyDown: (evt) => this.onKeyDown(evt), placeholder: placeholder, type: this.props.numeric ? "number" : "text", step: step }), this.props.arrows && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_inputArrowsComponent__WEBPACK_IMPORTED_MODULE_3__.InputArrowsComponent, { incrementValue: (amount) => this.incrementValue(amount), setDragging: (dragging) => this.setState({ dragging }) }))] })), this.props.unit] }));
|
|
51124
51125
|
}
|
|
51125
51126
|
}
|
|
51126
51127
|
|
|
@@ -51161,13 +51162,12 @@ class TextLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
51161
51162
|
return null;
|
|
51162
51163
|
}
|
|
51163
51164
|
if (this.props.onLink || this.props.url) {
|
|
51164
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
51165
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "link-value", title: this.props.value, onClick: () => this.onLink(), children: this.props.url ? "doc" : this.props.value || "no name" }));
|
|
51165
51166
|
}
|
|
51166
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
51167
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "value", title: this.props.value, style: { color: this.props.color ? this.props.color : "" }, children: this.props.value || "no name" }));
|
|
51167
51168
|
}
|
|
51168
51169
|
render() {
|
|
51169
|
-
|
|
51170
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: this.props.underline ? "textLine underline" : "textLine" + (this.props.additionalClass ? " " + this.props.additionalClass : "") }, { children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "label", title: (_b = (_a = this.props.tooltip) !== null && _a !== void 0 ? _a : this.props.label) !== null && _b !== void 0 ? _b : "" }, { children: (_c = this.props.label) !== null && _c !== void 0 ? _c : "" })), this.renderContent()] })));
|
|
51170
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: this.props.underline ? "textLine underline" : "textLine" + (this.props.additionalClass ? " " + this.props.additionalClass : ""), children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "label", title: this.props.tooltip ?? this.props.label ?? "", children: this.props.label ?? "" }), this.renderContent()] }));
|
|
51171
51171
|
}
|
|
51172
51172
|
}
|
|
51173
51173
|
|
|
@@ -51188,10 +51188,10 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
51188
51188
|
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "../../../../node_modules/react/jsx-runtime.js");
|
|
51189
51189
|
|
|
51190
51190
|
function UnitButton(props) {
|
|
51191
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("button",
|
|
51191
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("button", { className: "unit", onClick: () => {
|
|
51192
51192
|
if (props.onClick && !props.locked)
|
|
51193
51193
|
props.onClick(props.unit || "");
|
|
51194
|
-
}, disabled: props.locked
|
|
51194
|
+
}, disabled: props.locked, children: props.unit }));
|
|
51195
51195
|
}
|
|
51196
51196
|
|
|
51197
51197
|
|
|
@@ -51444,7 +51444,7 @@ class CommandBarComponent extends react__WEBPACK_IMPORTED_MODULE_2__.Component {
|
|
|
51444
51444
|
}
|
|
51445
51445
|
render() {
|
|
51446
51446
|
const isPasteDisabled = this.props.globalState.workbench ? this.props.globalState.workbench.pasteDisabled : true;
|
|
51447
|
-
const size = this.props.globalState.workbench ?
|
|
51447
|
+
const size = this.props.globalState.workbench ? { ...this.props.globalState.workbench.guiSize } : { width: 0, height: 0 };
|
|
51448
51448
|
const copyyIcon = this.props.globalState.selectedControls.length === 0 ? _imgs_buttonbar_copyIcon_disabled_svg__WEBPACK_IMPORTED_MODULE_22__ : _imgs_buttonbar_copyIcon_svg__WEBPACK_IMPORTED_MODULE_19__;
|
|
51449
51449
|
const deleteeIcon = this.props.globalState.selectedControls.length === 0 ? _imgs_buttonBar_deleteIcon_disabled_svg__WEBPACK_IMPORTED_MODULE_24__ : _imgs_buttonBar_deleteIcon_svg__WEBPACK_IMPORTED_MODULE_21__;
|
|
51450
51450
|
const pasteeIcon = isPasteDisabled ? _imgs_buttonbar_pasteIcon_disabled_svg__WEBPACK_IMPORTED_MODULE_23__ : _imgs_buttonbar_pasteIcon_svg__WEBPACK_IMPORTED_MODULE_20__;
|
|
@@ -51454,7 +51454,7 @@ class CommandBarComponent extends react__WEBPACK_IMPORTED_MODULE_2__.Component {
|
|
|
51454
51454
|
this.props.globalState.onResponsiveChangeObservable.notifyObservers(false);
|
|
51455
51455
|
core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_1__.DataStorage.WriteBoolean("Responsive", false);
|
|
51456
51456
|
}
|
|
51457
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
51457
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-commands", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "commands-left", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _imgs_babylonLogo_svg__WEBPACK_IMPORTED_MODULE_16__, color: "white", className: "active", draggable: false }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandDropdownComponent__WEBPACK_IMPORTED_MODULE_8__.CommandDropdownComponent, { globalState: this.props.globalState, toRight: true, icon: _imgs_hamburgerIcon_svg__WEBPACK_IMPORTED_MODULE_11__, tooltip: "Options", items: [
|
|
51458
51458
|
{
|
|
51459
51459
|
label: "Save",
|
|
51460
51460
|
onClick: () => {
|
|
@@ -51495,24 +51495,23 @@ class CommandBarComponent extends react__WEBPACK_IMPORTED_MODULE_2__.Component {
|
|
|
51495
51495
|
this.props.globalState.tool = _globalState__WEBPACK_IMPORTED_MODULE_3__.GUIEditorTool.PAN;
|
|
51496
51496
|
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_7__.CommandButtonComponent, { tooltip: "Zoom", shortcut: "Z", icon: _imgs_zoomIcon_svg__WEBPACK_IMPORTED_MODULE_14__, isActive: this.props.globalState.tool === _globalState__WEBPACK_IMPORTED_MODULE_3__.GUIEditorTool.ZOOM, onClick: () => {
|
|
51497
51497
|
this.props.globalState.tool = _globalState__WEBPACK_IMPORTED_MODULE_3__.GUIEditorTool.ZOOM;
|
|
51498
|
-
} })] })
|
|
51498
|
+
} })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_7__.CommandButtonComponent, { tooltip: "Copy Selcted", shortcut: "Ctrl + C", icon: copyyIcon, isActive: false, copyDeleteDisabled: this.props.globalState.selectedControls.length === 0, onClick: () => {
|
|
51499
51499
|
this.props.globalState.onCopyObservable.notifyObservers((content) => this.props.globalState.hostWindow.navigator.clipboard.writeText(content));
|
|
51500
51500
|
this.forceUpdate();
|
|
51501
51501
|
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_7__.CommandButtonComponent, { tooltip: "Paste", shortcut: "Ctrl + V", icon: pasteeIcon, isActive: false, pasteDisabled: isPasteDisabled, onClick: async () => {
|
|
51502
51502
|
this.props.globalState.onPasteObservable.notifyObservers(await this.props.globalState.hostWindow.navigator.clipboard.readText());
|
|
51503
51503
|
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_7__.CommandButtonComponent, { tooltip: "Delete", shortcut: "Delete", icon: deleteeIcon, isActive: false, copyDeleteDisabled: this.props.globalState.selectedControls.length === 0, onClick: () => {
|
|
51504
51504
|
this.props.globalState.selectedControls.forEach((guiNode) => {
|
|
51505
|
-
var _a;
|
|
51506
51505
|
if (guiNode != this.props.globalState.guiTexture.getChildren()[0]) {
|
|
51507
51506
|
this.props.globalState.guiTexture.removeControl(guiNode);
|
|
51508
|
-
|
|
51507
|
+
this.props.globalState.liveGuiTexture?.removeControl(guiNode);
|
|
51509
51508
|
guiNode.dispose();
|
|
51510
51509
|
}
|
|
51511
51510
|
});
|
|
51512
51511
|
this.props.globalState.setSelection([]);
|
|
51513
|
-
} })] })
|
|
51512
|
+
} })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_7__.CommandButtonComponent, { tooltip: "Fit to Window", shortcut: "F", icon: _imgs_canvasFitIcon_svg__WEBPACK_IMPORTED_MODULE_17__, isActive: false, onClick: () => {
|
|
51514
51513
|
this.props.globalState.onFitControlsToWindowObservable.notifyObservers();
|
|
51515
|
-
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_7__.CommandButtonComponent, { tooltip: "Toggle Guides", shortcut: "G", icon: _imgs_guidesIcon_svg__WEBPACK_IMPORTED_MODULE_15__, isActive: this.props.globalState.outlines, onClick: () => (this.props.globalState.outlines = !this.props.globalState.outlines) })] })
|
|
51514
|
+
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_7__.CommandButtonComponent, { tooltip: "Toggle Guides", shortcut: "G", icon: _imgs_guidesIcon_svg__WEBPACK_IMPORTED_MODULE_15__, isActive: this.props.globalState.outlines, onClick: () => (this.props.globalState.outlines = !this.props.globalState.outlines) })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "divider padded", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_9__.ColorLineComponent, { lockObject: this._lockObject, label: "Artboard:", target: this.props.globalState, propertyName: "backgroundColor", disableAlpha: true }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "divider padded", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Responsive:", iconLabel: "Responsive GUIs will resize the UI layout and reflow controls to accommodate different device screen sizes", isSelected: () => core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_1__.DataStorage.ReadBoolean("Responsive", true), onSelect: (value) => {
|
|
51516
51515
|
this.props.globalState.onResponsiveChangeObservable.notifyObservers(value);
|
|
51517
51516
|
core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_1__.DataStorage.WriteBoolean("Responsive", value);
|
|
51518
51517
|
core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_1__.DataStorage.WriteBoolean("responsiveUI", value);
|
|
@@ -51555,7 +51554,7 @@ class CommandBarComponent extends react__WEBPACK_IMPORTED_MODULE_2__.Component {
|
|
|
51555
51554
|
this._stopUpdating = false;
|
|
51556
51555
|
this.props.globalState.workbench.guiSize = { width: size.width, height: newValue };
|
|
51557
51556
|
core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_1__.DataStorage.WriteNumber("height", this.props.globalState.workbench.guiSize.width);
|
|
51558
|
-
}, arrows: true, isInteger: true })] }))] })
|
|
51557
|
+
}, arrows: true, isInteger: true })] }))] })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "commands-right", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _imgs_betaFlag_svg__WEBPACK_IMPORTED_MODULE_18__, className: "beta-flag", draggable: false }) })] }));
|
|
51559
51558
|
}
|
|
51560
51559
|
}
|
|
51561
51560
|
|
|
@@ -51597,7 +51596,7 @@ class CommandButtonComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
51597
51596
|
else if (this.props.pasteDisabled) {
|
|
51598
51597
|
divClassName += " pasteDisabled";
|
|
51599
51598
|
}
|
|
51600
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
51599
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: divClassName, onClick: this.props.onClick, title: `${this.props.tooltip} ${this.props.shortcut ? " (" + this.props.shortcut + ")" : ""}`, children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: iconClassName, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: this.props.isActive ? "active" : "", draggable: false }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "command-label", children: this.props.tooltip }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "command-label", children: this.props.tooltip })] }));
|
|
51601
51600
|
}
|
|
51602
51601
|
}
|
|
51603
51602
|
|
|
@@ -51629,7 +51628,7 @@ class CommandDropdownComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compon
|
|
|
51629
51628
|
render() {
|
|
51630
51629
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [this.state.isExpanded && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "command-dropdown-blocker", onClick: () => {
|
|
51631
51630
|
this.setState({ isExpanded: false });
|
|
51632
|
-
} })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
51631
|
+
} })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "command-dropdown-root", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "command-dropdown" + (this.state.isExpanded ? " activated" : ""), title: this.props.tooltip, onClick: () => {
|
|
51633
51632
|
this.setState({ isExpanded: false });
|
|
51634
51633
|
const newState = !this.state.isExpanded;
|
|
51635
51634
|
const pgHost = document.getElementById("embed-host");
|
|
@@ -51637,9 +51636,9 @@ class CommandDropdownComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compon
|
|
|
51637
51636
|
pgHost.style.zIndex = newState ? "0" : "10";
|
|
51638
51637
|
}
|
|
51639
51638
|
this.setState({ isExpanded: newState });
|
|
51640
|
-
}
|
|
51639
|
+
}, children: [this.props.icon && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "command-dropdown-icon", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon }) })), !this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "command-dropdown-active" })] }), this.state.isExpanded && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "command-dropdown-content sub1" + (this.props.toRight ? " toRight" : ""), children: this.props.items.map((m) => {
|
|
51641
51640
|
if (!m.fileButton) {
|
|
51642
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
51641
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "command-dropdown-label" + (m.isActive ? " active" : ""), onClick: () => {
|
|
51643
51642
|
if (!m.onClick) {
|
|
51644
51643
|
this.forceUpdate();
|
|
51645
51644
|
return;
|
|
@@ -51648,20 +51647,20 @@ class CommandDropdownComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compon
|
|
|
51648
51647
|
m.onClick();
|
|
51649
51648
|
this.setState({ isExpanded: false, activeState: m.label });
|
|
51650
51649
|
}
|
|
51651
|
-
}, title: m.label
|
|
51650
|
+
}, title: m.label, children: [!m.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "command-dropdown-label-text", children: (m.isActive ? "> " : "") + m.label }), m.icon && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "command-dropdown-icon", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: m.icon }) })), m.onCheck && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "checkBox", className: "command-dropdown-label-check", onChange: (evt) => {
|
|
51652
51651
|
this.forceUpdate();
|
|
51653
51652
|
m.onCheck(evt.target.checked);
|
|
51654
|
-
}, checked: false })), m.subItems && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
51655
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
51653
|
+
}, checked: false })), m.subItems && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "command-dropdown-arrow", children: ">" }), m.subItems && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "sub-items ", children: m.subItems.map((s) => {
|
|
51654
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "sub-item", onClick: () => {
|
|
51656
51655
|
m.onClick();
|
|
51657
51656
|
this.setState({ isExpanded: false });
|
|
51658
|
-
}
|
|
51659
|
-
}) }))
|
|
51657
|
+
}, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "sub-item-label", children: s }) }, s));
|
|
51658
|
+
}) }))] }, m.label));
|
|
51660
51659
|
}
|
|
51661
51660
|
else {
|
|
51662
51661
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_fileButtonLineComponent__WEBPACK_IMPORTED_MODULE_2__.FileButtonLineComponent, { label: "Load", onClick: (file) => this.props.globalState.onLoadObservable.notifyObservers(file), accept: ".json" }, m.label));
|
|
51663
51662
|
}
|
|
51664
|
-
}) }))
|
|
51663
|
+
}) }))] })] }));
|
|
51665
51664
|
}
|
|
51666
51665
|
}
|
|
51667
51666
|
|
|
@@ -51718,9 +51717,9 @@ class LogComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
51718
51717
|
const h = today.getHours();
|
|
51719
51718
|
const m = today.getMinutes();
|
|
51720
51719
|
const s = today.getSeconds();
|
|
51721
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
51722
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
51723
|
-
}) }))
|
|
51720
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { id: "log-console", ref: "log-console", children: this.state.logs.map((l, i) => {
|
|
51721
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "log" + (l.isError ? " error" : ""), children: h + ":" + m + ":" + s + ": " + l.message }, i));
|
|
51722
|
+
}) }));
|
|
51724
51723
|
}
|
|
51725
51724
|
}
|
|
51726
51725
|
|
|
@@ -51773,11 +51772,11 @@ class ParentingPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.
|
|
|
51773
51772
|
}
|
|
51774
51773
|
render() {
|
|
51775
51774
|
this.getCellInfo();
|
|
51776
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
51775
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", { className: "ge" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_2__.TextLineComponent, { tooltip: "", label: "GRID PARENTING", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: this.props.lockObject, label: "Row #", target: this, propertyName: "_rowNumber", isInteger: true, min: 0, onChange: () => {
|
|
51777
51776
|
this.updateGridPosition();
|
|
51778
51777
|
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: this.props.lockObject, label: "Column #", target: this, propertyName: "_columnNumber", isInteger: true, min: 0, onChange: () => {
|
|
51779
51778
|
this.updateGridPosition();
|
|
51780
|
-
} })] })
|
|
51779
|
+
} })] })] }));
|
|
51781
51780
|
}
|
|
51782
51781
|
}
|
|
51783
51782
|
|
|
@@ -51830,11 +51829,11 @@ class ButtonPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Com
|
|
|
51830
51829
|
render() {
|
|
51831
51830
|
const { rectangles, lockObject, onPropertyChangedObservable, onAddComponent } = this.props;
|
|
51832
51831
|
const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_7__.makeTargetsProxy)(rectangles, onPropertyChangedObservable);
|
|
51833
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
51832
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: lockObject, controls: rectangles, onPropertyChangedObservable: onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextLineComponent, { label: "BUTTON", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__.CommandButtonComponent, { tooltip: "Add TextBlock", icon: shared_ui_components_imgs_addTextButtonIcon_svg__WEBPACK_IMPORTED_MODULE_10__, shortcut: "", isActive: false, onClick: () => {
|
|
51834
51833
|
onAddComponent("Text");
|
|
51835
51834
|
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__.CommandButtonComponent, { tooltip: "Add Image", icon: shared_ui_components_imgs_addImageButtonIcon_svg__WEBPACK_IMPORTED_MODULE_11__, shortcut: "", isActive: false, onClick: () => {
|
|
51836
51835
|
onAddComponent("ButtonImage");
|
|
51837
|
-
} })] })
|
|
51836
|
+
} })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_9__.IconComponent, { icon: shared_ui_components_imgs_strokeWeightIcon_svg__WEBPACK_IMPORTED_MODULE_12__, label: "Stroke Weight" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "thickness", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_5__.UnitButton, { unit: "PX", locked: true }), min: 0, digits: 2 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_9__.IconComponent, { icon: shared_ui_components_imgs_conerRadiusIcon_svg__WEBPACK_IMPORTED_MODULE_13__, label: "Corner Radius" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "cornerRadius", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_5__.UnitButton, { unit: "PX", locked: true }), arrows: true, min: 0, digits: 2 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_containerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_8__.ContainerPropertyGridComponent, { containers: rectangles, onPropertyChangedObservable: onPropertyChangedObservable })] }));
|
|
51838
51837
|
}
|
|
51839
51838
|
}
|
|
51840
51839
|
|
|
@@ -51882,7 +51881,7 @@ class CheckboxPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.C
|
|
|
51882
51881
|
}
|
|
51883
51882
|
render() {
|
|
51884
51883
|
const checkboxes = this.props.checkboxes;
|
|
51885
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
51884
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, controls: checkboxes, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextLineComponent, { label: "CHECKBOX", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_sizeIcon_svg__WEBPACK_IMPORTED_MODULE_9__, label: "Check Size Ratio" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: this.props.lockObject, label: " ", target: (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__.makeTargetsProxy)(checkboxes, this.props.onPropertyChangedObservable), propertyName: "checkSizeRatio", min: 0, max: 1, arrows: true, step: "0.01", digits: 2 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_checkboxIconDark_svg__WEBPACK_IMPORTED_MODULE_10__, label: "Is Checkbox Checked" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_4__.CheckBoxLineComponent, { label: "CHECKED", target: (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__.makeTargetsProxy)(checkboxes, this.props.onPropertyChangedObservable), propertyName: "isChecked", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_strokeWeightIcon_svg__WEBPACK_IMPORTED_MODULE_11__, label: "Thickness" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: this.props.lockObject, target: (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__.makeTargetsProxy)(checkboxes, this.props.onPropertyChangedObservable), propertyName: "thickness", label: "", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_8__.UnitButton, { unit: "PX", locked: true }), arrows: true, min: 0, digits: 2 })] })] }));
|
|
51886
51885
|
}
|
|
51887
51886
|
}
|
|
51888
51887
|
|
|
@@ -51922,7 +51921,7 @@ class ColorPickerPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1_
|
|
|
51922
51921
|
}
|
|
51923
51922
|
render() {
|
|
51924
51923
|
const colorPickers = this.props.colorPickers;
|
|
51925
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
51924
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, controls: colorPickers }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextLineComponent, { label: "COLOR PICKER", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_6__.IconComponent, { icon: shared_ui_components_imgs_fillColorIcon_svg__WEBPACK_IMPORTED_MODULE_7__, label: "Color Picker Value" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_3__.ColorLineComponent, { label: "", target: (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_5__.makeTargetsProxy)(colorPickers, this.props.onPropertyChangedObservable), propertyName: "value", disableAlpha: true, lockObject: this.props.lockObject })] })] }));
|
|
51926
51925
|
}
|
|
51927
51926
|
}
|
|
51928
51927
|
|
|
@@ -51959,20 +51958,21 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
51959
51958
|
/* harmony import */ var shared_ui_components_imgs_sizeIcon_svg__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! shared-ui-components/imgs/sizeIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/sizeIcon.svg");
|
|
51960
51959
|
/* harmony import */ var shared_ui_components_imgs_verticalMarginIcon_svg__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! shared-ui-components/imgs/verticalMarginIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/verticalMarginIcon.svg");
|
|
51961
51960
|
/* harmony import */ var shared_ui_components_imgs_positionIcon_svg__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! shared-ui-components/imgs/positionIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/positionIcon.svg");
|
|
51962
|
-
/* harmony import */ var
|
|
51963
|
-
/* harmony import */ var
|
|
51964
|
-
/* harmony import */ var
|
|
51965
|
-
/* harmony import */ var
|
|
51966
|
-
/* harmony import */ var
|
|
51967
|
-
/* harmony import */ var
|
|
51968
|
-
/* harmony import */ var
|
|
51969
|
-
/* harmony import */ var
|
|
51970
|
-
/* harmony import */ var
|
|
51961
|
+
/* harmony import */ var shared_ui_components_imgs_fontFamilyIcon_svg__WEBPACK_IMPORTED_MODULE_37__ = __webpack_require__(/*! shared-ui-components/imgs/fontFamilyIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/fontFamilyIcon.svg");
|
|
51962
|
+
/* harmony import */ var shared_ui_components_imgs_alphaIcon_svg__WEBPACK_IMPORTED_MODULE_33__ = __webpack_require__(/*! shared-ui-components/imgs/alphaIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/alphaIcon.svg");
|
|
51963
|
+
/* harmony import */ var shared_ui_components_imgs_fontSizeIcon_svg__WEBPACK_IMPORTED_MODULE_40__ = __webpack_require__(/*! shared-ui-components/imgs/fontSizeIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/fontSizeIcon.svg");
|
|
51964
|
+
/* harmony import */ var shared_ui_components_imgs_fontStyleIcon_svg__WEBPACK_IMPORTED_MODULE_39__ = __webpack_require__(/*! shared-ui-components/imgs/fontStyleIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/fontStyleIcon.svg");
|
|
51965
|
+
/* harmony import */ var shared_ui_components_imgs_fontWeightIcon_svg__WEBPACK_IMPORTED_MODULE_38__ = __webpack_require__(/*! shared-ui-components/imgs/fontWeightIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/fontWeightIcon.svg");
|
|
51966
|
+
/* harmony import */ var shared_ui_components_imgs_rotationIcon_svg__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! shared-ui-components/imgs/rotationIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/rotationIcon.svg");
|
|
51967
|
+
/* harmony import */ var shared_ui_components_imgs_pivotIcon_svg__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! shared-ui-components/imgs/pivotIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/pivotIcon.svg");
|
|
51968
|
+
/* harmony import */ var shared_ui_components_imgs_scaleIcon_svg__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! shared-ui-components/imgs/scaleIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/scaleIcon.svg");
|
|
51969
|
+
/* harmony import */ var shared_ui_components_imgs_shadowBlurIcon_svg__WEBPACK_IMPORTED_MODULE_36__ = __webpack_require__(/*! shared-ui-components/imgs/shadowBlurIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/shadowBlurIcon.svg");
|
|
51971
51970
|
/* harmony import */ var shared_ui_components_imgs_horizontalMarginIcon_svg__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! shared-ui-components/imgs/horizontalMarginIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/horizontalMarginIcon.svg");
|
|
51972
|
-
/* harmony import */ var
|
|
51973
|
-
/* harmony import */ var
|
|
51974
|
-
/* harmony import */ var
|
|
51975
|
-
/* harmony import */ var
|
|
51971
|
+
/* harmony import */ var shared_ui_components_imgs_shadowColorIcon_svg__WEBPACK_IMPORTED_MODULE_34__ = __webpack_require__(/*! shared-ui-components/imgs/shadowColorIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/shadowColorIcon.svg");
|
|
51972
|
+
/* harmony import */ var shared_ui_components_imgs_shadowOffsetXIcon_svg__WEBPACK_IMPORTED_MODULE_35__ = __webpack_require__(/*! shared-ui-components/imgs/shadowOffsetXIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/shadowOffsetXIcon.svg");
|
|
51973
|
+
/* harmony import */ var shared_ui_components_imgs_colorIcon_svg__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! shared-ui-components/imgs/colorIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/colorIcon.svg");
|
|
51974
|
+
/* harmony import */ var shared_ui_components_imgs_fillColorIcon_svg__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! shared-ui-components/imgs/fillColorIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/fillColorIcon.svg");
|
|
51975
|
+
/* harmony import */ var shared_ui_components_imgs_linkedMeshOffsetIcon_svg__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! shared-ui-components/imgs/linkedMeshOffsetIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/linkedMeshOffsetIcon.svg");
|
|
51976
51976
|
/* harmony import */ var shared_ui_components_imgs_hAlignCenterIcon_svg__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! shared-ui-components/imgs/hAlignCenterIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/hAlignCenterIcon.svg");
|
|
51977
51977
|
/* harmony import */ var shared_ui_components_imgs_hAlignLeftIcon_svg__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! shared-ui-components/imgs/hAlignLeftIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/hAlignLeftIcon.svg");
|
|
51978
51978
|
/* harmony import */ var shared_ui_components_imgs_hAlignRightIcon_svg__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! shared-ui-components/imgs/hAlignRightIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/hAlignRightIcon.svg");
|
|
@@ -52022,11 +52022,11 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
52022
52022
|
|
|
52023
52023
|
|
|
52024
52024
|
|
|
52025
|
+
|
|
52025
52026
|
|
|
52026
52027
|
|
|
52027
52028
|
class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
52028
52029
|
constructor(props) {
|
|
52029
|
-
var _a;
|
|
52030
52030
|
super(props);
|
|
52031
52031
|
const controls = this.props.controls;
|
|
52032
52032
|
for (const control of controls) {
|
|
@@ -52036,7 +52036,7 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
|
|
|
52036
52036
|
}
|
|
52037
52037
|
control.metadata._previousCenter = transformed;
|
|
52038
52038
|
}
|
|
52039
|
-
this._onPropertyChangedObserver =
|
|
52039
|
+
this._onPropertyChangedObserver = this.props.onPropertyChangedObservable?.add((event) => {
|
|
52040
52040
|
const isTransformEvent = event.property === "transformCenterX" || event.property === "transformCenterY";
|
|
52041
52041
|
for (const control of controls) {
|
|
52042
52042
|
let transformed = this._getTransformedReferenceCoordinate(control);
|
|
@@ -52073,7 +52073,6 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
|
|
|
52073
52073
|
this.forceUpdate();
|
|
52074
52074
|
}
|
|
52075
52075
|
_checkAndUpdateValues(propertyName, value) {
|
|
52076
|
-
var _a, _b, _c;
|
|
52077
52076
|
for (const control of this.props.controls) {
|
|
52078
52077
|
// checking the previous value unit to see what it was.
|
|
52079
52078
|
const vau = control["_" + propertyName];
|
|
@@ -52086,10 +52085,10 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
|
|
|
52086
52085
|
else if (value.charAt(value.length - 1) === "x" && value.charAt(value.length - 2) === "p") {
|
|
52087
52086
|
percentage = false;
|
|
52088
52087
|
}
|
|
52089
|
-
if (
|
|
52088
|
+
if (control.parent?.typeName === "StackPanel") {
|
|
52090
52089
|
percentage = false;
|
|
52091
52090
|
}
|
|
52092
|
-
let newValue =
|
|
52091
|
+
let newValue = value.match(/([\d.,]+)/g)?.[0];
|
|
52093
52092
|
if (!newValue) {
|
|
52094
52093
|
newValue = "0";
|
|
52095
52094
|
}
|
|
@@ -52097,7 +52096,7 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
|
|
|
52097
52096
|
newValue += percentage ? "%" : "px";
|
|
52098
52097
|
const initialValue = control[propertyName];
|
|
52099
52098
|
control[propertyName] = newValue;
|
|
52100
|
-
|
|
52099
|
+
this.props.onPropertyChangedObservable?.notifyObservers({
|
|
52101
52100
|
object: control,
|
|
52102
52101
|
property: propertyName,
|
|
52103
52102
|
initialValue: initialValue,
|
|
@@ -52114,9 +52113,8 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
|
|
|
52114
52113
|
}
|
|
52115
52114
|
}
|
|
52116
52115
|
componentWillUnmount() {
|
|
52117
|
-
var _a;
|
|
52118
52116
|
if (this._onPropertyChangedObserver) {
|
|
52119
|
-
|
|
52117
|
+
this.props.onPropertyChangedObservable?.remove(this._onPropertyChangedObserver);
|
|
52120
52118
|
}
|
|
52121
52119
|
}
|
|
52122
52120
|
render() {
|
|
@@ -52173,7 +52171,6 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
|
|
|
52173
52171
|
}
|
|
52174
52172
|
};
|
|
52175
52173
|
const increment = (propertyName, amount, minimum, maximum) => {
|
|
52176
|
-
var _a;
|
|
52177
52174
|
for (const control of controls) {
|
|
52178
52175
|
const initialValue = control[propertyName];
|
|
52179
52176
|
const initialUnit = control["_" + propertyName]._unit;
|
|
@@ -52186,7 +52183,7 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
|
|
|
52186
52183
|
if (initialUnit === gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.ValueAndUnit.UNITMODE_PERCENTAGE) {
|
|
52187
52184
|
_diagram_coordinateHelper__WEBPACK_IMPORTED_MODULE_10__.CoordinateHelper.ConvertToPercentage(control, [propertyName]);
|
|
52188
52185
|
}
|
|
52189
|
-
|
|
52186
|
+
this.props.onPropertyChangedObservable?.notifyObservers({
|
|
52190
52187
|
object: control,
|
|
52191
52188
|
property: propertyName,
|
|
52192
52189
|
initialValue: initialValue,
|
|
@@ -52211,7 +52208,7 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
|
|
|
52211
52208
|
];
|
|
52212
52209
|
let horizontalDisabled = false, verticalDisabled = false, widthUnitsLocked = false, heightUnitsLocked = false;
|
|
52213
52210
|
const parent = controls[0].parent;
|
|
52214
|
-
if (
|
|
52211
|
+
if (parent?.getClassName() === "StackPanel" || parent?.getClassName() === "VirtualKeyboard") {
|
|
52215
52212
|
if (parent.isVertical) {
|
|
52216
52213
|
verticalDisabled = true;
|
|
52217
52214
|
heightUnitsLocked = true;
|
|
@@ -52221,7 +52218,7 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
|
|
|
52221
52218
|
widthUnitsLocked = true;
|
|
52222
52219
|
}
|
|
52223
52220
|
}
|
|
52224
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [!this.props.hideDimensions && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
52221
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [!this.props.hideDimensions && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider alignment-bar", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__.CommandButtonComponent, { tooltip: "Left", icon: shared_ui_components_imgs_hAlignLeftIcon_svg__WEBPACK_IMPORTED_MODULE_16__, shortcut: "", isActive: horizontalAlignment === gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.HORIZONTAL_ALIGNMENT_LEFT, onClick: () => {
|
|
52225
52222
|
this._updateAlignment("horizontalAlignment", gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.HORIZONTAL_ALIGNMENT_LEFT);
|
|
52226
52223
|
}, disabled: horizontalDisabled }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__.CommandButtonComponent, { tooltip: "Center", icon: shared_ui_components_imgs_hAlignCenterIcon_svg__WEBPACK_IMPORTED_MODULE_17__, shortcut: "", isActive: horizontalAlignment === gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.HORIZONTAL_ALIGNMENT_CENTER, onClick: () => {
|
|
52227
52224
|
this._updateAlignment("horizontalAlignment", gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.HORIZONTAL_ALIGNMENT_CENTER);
|
|
@@ -52233,7 +52230,7 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
|
|
|
52233
52230
|
this._updateAlignment("verticalAlignment", gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.VERTICAL_ALIGNMENT_CENTER);
|
|
52234
52231
|
}, disabled: verticalDisabled }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__.CommandButtonComponent, { tooltip: "Bottom", icon: shared_ui_components_imgs_vAlignBottomIcon_svg__WEBPACK_IMPORTED_MODULE_21__, shortcut: "", isActive: verticalAlignment === gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.VERTICAL_ALIGNMENT_BOTTOM, onClick: () => {
|
|
52235
52232
|
this._updateAlignment("verticalAlignment", gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.VERTICAL_ALIGNMENT_BOTTOM);
|
|
52236
|
-
}, disabled: verticalDisabled })] })
|
|
52233
|
+
}, disabled: verticalDisabled })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_positionIcon_svg__WEBPACK_IMPORTED_MODULE_22__, label: "Position" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { numbersOnly: true, lockObject: this.props.lockObject, label: "X", delayInput: true, value: getValue("_left"), onChange: (newValue) => this._checkAndUpdateValues("left", newValue), unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: getUnitString("_left"), onClick: (unit) => convertUnits(unit, "left") }), arrows: true, arrowsIncrement: (amount) => increment("left", amount) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { numbersOnly: true, lockObject: this.props.lockObject, label: "Y", delayInput: true, value: getValue("_top"), onChange: (newValue) => this._checkAndUpdateValues("top", newValue), unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: getUnitString("_top"), onClick: (unit) => convertUnits(unit, "top") }), arrows: true, arrowsIncrement: (amount) => increment("top", amount) })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_sizeIcon_svg__WEBPACK_IMPORTED_MODULE_23__, label: "Size" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { numbersOnly: true, lockObject: this.props.lockObject, label: "W", delayInput: true, value: getValue("_width"), onChange: (newValue) => {
|
|
52237
52234
|
for (const control of controls) {
|
|
52238
52235
|
if (control.typeName === "Image") {
|
|
52239
52236
|
control.autoScale = false;
|
|
@@ -52263,19 +52260,19 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
|
|
|
52263
52260
|
}
|
|
52264
52261
|
}
|
|
52265
52262
|
this._checkAndUpdateValues("height", newValue);
|
|
52266
|
-
}, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: getUnitString("_height"), locked: heightUnitsLocked, onClick: (unit) => convertUnits(unit, "height") }), arrows: true, arrowsIncrement: (amount) => increment("height", amount) })] })
|
|
52263
|
+
}, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: getUnitString("_height"), locked: heightUnitsLocked, onClick: (unit) => convertUnits(unit, "height") }), arrows: true, arrowsIncrement: (amount) => increment("height", amount) })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_verticalMarginIcon_svg__WEBPACK_IMPORTED_MODULE_24__, label: "Vertical Padding" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { numbersOnly: true, lockObject: this.props.lockObject, label: "T", delayInput: true, value: getValue("_paddingTop"), onChange: (newValue) => {
|
|
52267
52264
|
this._checkAndUpdateValues("paddingTop", newValue);
|
|
52268
52265
|
this._markChildrenAsDirty();
|
|
52269
52266
|
}, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: getUnitString("_paddingTop"), onClick: (unit) => convertUnits(unit, "paddingTop") }), arrows: true, arrowsIncrement: (amount) => increment("paddingTop", amount, 0) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { numbersOnly: true, lockObject: this.props.lockObject, label: "B", delayInput: true, value: getValue("_paddingBottom"), onChange: (newValue) => {
|
|
52270
52267
|
this._checkAndUpdateValues("paddingBottom", newValue);
|
|
52271
52268
|
this._markChildrenAsDirty();
|
|
52272
|
-
}, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: getUnitString("_paddingBottom"), onClick: (unit) => convertUnits(unit, "paddingBottom") }), arrows: true, arrowsIncrement: (amount) => increment("paddingBottom", amount, 0) })] })
|
|
52269
|
+
}, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: getUnitString("_paddingBottom"), onClick: (unit) => convertUnits(unit, "paddingBottom") }), arrows: true, arrowsIncrement: (amount) => increment("paddingBottom", amount, 0) })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_horizontalMarginIcon_svg__WEBPACK_IMPORTED_MODULE_25__, label: "Horizontal Padding" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { numbersOnly: true, lockObject: this.props.lockObject, label: "L", delayInput: true, value: getValue("_paddingLeft"), onChange: (newValue) => {
|
|
52273
52270
|
this._checkAndUpdateValues("paddingLeft", newValue);
|
|
52274
52271
|
this._markChildrenAsDirty();
|
|
52275
52272
|
}, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: getUnitString("_paddingLeft"), onClick: (unit) => convertUnits(unit, "paddingLeft") }), arrows: true, arrowsIncrement: (amount) => increment("paddingLeft", amount) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { numbersOnly: true, lockObject: this.props.lockObject, label: "R", delayInput: true, value: getValue("_paddingRight"), onChange: (newValue) => {
|
|
52276
52273
|
this._checkAndUpdateValues("paddingRight", newValue);
|
|
52277
52274
|
this._markChildrenAsDirty();
|
|
52278
|
-
}, onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: getUnitString("_paddingRight"), onClick: (unit) => convertUnits(unit, "paddingRight") }), arrows: true, arrowsIncrement: (amount) => increment("paddingRight", amount) })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "ge-divider" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_descendantsOnlyPaddingIcon_svg__WEBPACK_IMPORTED_MODULE_26__, label: "Makes padding affect only the descendants of this control" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__.CheckBoxLineComponent, { label: "ONLY PAD DESCENDANTS", target: proxy, propertyName: "descendentsOnlyPadding" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", { className: "ge" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_2__.TextLineComponent, { tooltip: "", label: "TRANSFORMATION", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "ge-divider double" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_scaleIcon_svg__WEBPACK_IMPORTED_MODULE_27__, label: "Scale" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__.FloatLineComponent, { lockObject: this.props.lockObject, label: "X", target: proxy, propertyName: "scaleX", arrows: true, digits: 2, step: "0.0005" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__.FloatLineComponent, { lockObject: this.props.lockObject, label: "Y", target: proxy, propertyName: "scaleY", arrows: true, digits: 2, step: "0.0005" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "ge-divider double" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_pivotIcon_svg__WEBPACK_IMPORTED_MODULE_28__, label: "Transform Center" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__.FloatLineComponent, { lockObject: this.props.lockObject, label: "X", target: proxy, propertyName: "transformCenterX", arrows: true, digits: 2, step: "0.0005" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__.FloatLineComponent, { lockObject: this.props.lockObject, label: "Y", target: proxy, propertyName: "transformCenterY", arrows: true, digits: 2, step: "0.0005" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "ge-divider" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_rotationIcon_svg__WEBPACK_IMPORTED_MODULE_29__, label: "Rotation" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_4__.SliderLineComponent, { iconLabel: "Rotation", lockObject: this.props.lockObject, label: "", target: proxy, decimalCount: 2, propertyName: "rotation", minimum: 0, maximum: 2 * Math.PI, step: 0.01, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: "RAD", locked: true }) })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", { className: "ge" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_2__.TextLineComponent, { tooltip: "", label: "APPEARANCE", value: " ", color: "grey" }), controls.every((control) => control.color !== undefined && control.typeName !== "Image" && control.typeName !== "ImageBasedSlider" && control.typeName !== "ColorPicker") && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "ge-divider" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_colorIcon_svg__WEBPACK_IMPORTED_MODULE_30__, label: "Outline Color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_8__.ColorLineComponent, { lockObject: this.props.lockObject, label: "Outline Color", target: proxy, propertyName: "color" })] }))), controls.every((control) => control.background !== undefined) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "ge-divider" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_fillColorIcon_svg__WEBPACK_IMPORTED_MODULE_31__, label: "Background Color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_8__.ColorLineComponent, { lockObject: this.props.lockObject, label: "Background Color", target: proxy, propertyName: "background" })] }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "ge-divider" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_alphaIcon_svg__WEBPACK_IMPORTED_MODULE_32__, label: "Alpha" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_4__.SliderLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "alpha", minimum: 0, maximum: 1, step: 0.01 })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "ge-divider" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_shadowColorIcon_svg__WEBPACK_IMPORTED_MODULE_33__, label: "Shadow Color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_8__.ColorLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "shadowColor", disableAlpha: true })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "ge-divider double" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_shadowOffsetXIcon_svg__WEBPACK_IMPORTED_MODULE_34__, label: "Shadow Offset" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__.FloatLineComponent, { lockObject: this.props.lockObject, label: "X", target: proxy, propertyName: "shadowOffsetX", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: "PX", locked: true }), arrows: true, step: "0.1", digits: 2 }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__.FloatLineComponent, { lockObject: this.props.lockObject, label: "Y", target: proxy, propertyName: "shadowOffsetY", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: "PX", locked: true }), arrows: true, step: "0.1", digits: 2 })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "ge-divider double" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_shadowBlurIcon_svg__WEBPACK_IMPORTED_MODULE_35__, label: "Shadow Blur" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__.FloatLineComponent, { lockObject: this.props.lockObject, label: " ", target: proxy, propertyName: "shadowBlur", arrows: true, min: 0, digits: 2 })] })), showTextProperties && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", { className: "ge" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_2__.TextLineComponent, { tooltip: "", label: "FONT STYLE", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "ge-divider" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_fontFamilyIcon_svg__WEBPACK_IMPORTED_MODULE_36__, label: "Font Family" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "fontFamily" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "ge-divider" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_fontWeightIcon_svg__WEBPACK_IMPORTED_MODULE_37__, label: "Font Weight" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "fontWeight" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "ge-divider" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_fontStyleIcon_svg__WEBPACK_IMPORTED_MODULE_38__, label: "Font Style" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_13__.OptionsLineComponent, { label: "", target: proxy, propertyName: "fontStyle", options: fontStyleOptions, onSelect: (newValue) => {
|
|
52275
|
+
}, onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: getUnitString("_paddingRight"), onClick: (unit) => convertUnits(unit, "paddingRight") }), arrows: true, arrowsIncrement: (amount) => increment("paddingRight", amount) })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_descendantsOnlyPaddingIcon_svg__WEBPACK_IMPORTED_MODULE_26__, label: "Makes padding affect only the descendants of this control" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__.CheckBoxLineComponent, { label: "ONLY PAD DESCENDANTS", target: proxy, propertyName: "descendentsOnlyPadding" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", { className: "ge" })] })), parent?.name === "root" && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_2__.TextLineComponent, { label: "LINK OFFSET", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_linkedMeshOffsetIcon_svg__WEBPACK_IMPORTED_MODULE_27__, label: "Link offset" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { numbersOnly: true, lockObject: this.props.lockObject, label: "X", delayInput: true, value: getValue("_linkOffsetX"), onChange: (newValue) => this._checkAndUpdateValues("linkOffsetX", newValue), unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: getUnitString("_linkOffsetX"), onClick: (unit) => convertUnits(unit, "linkOffsetX") }), arrows: true, arrowsIncrement: (amount) => increment("linkOffsetX", amount) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { numbersOnly: true, lockObject: this.props.lockObject, label: "Y", delayInput: true, value: getValue("_linkOffsetY"), onChange: (newValue) => this._checkAndUpdateValues("linkOffsetY", newValue), unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: getUnitString("_linkOffsetY"), onClick: (unit) => convertUnits(unit, "linkOffsetY") }), arrows: true, arrowsIncrement: (amount) => increment("linkOffsetY", amount) })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", { className: "ge" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_2__.TextLineComponent, { tooltip: "", label: "TRANSFORMATION", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_scaleIcon_svg__WEBPACK_IMPORTED_MODULE_28__, label: "Scale" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__.FloatLineComponent, { lockObject: this.props.lockObject, label: "X", target: proxy, propertyName: "scaleX", arrows: true, digits: 2, step: "0.0005" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__.FloatLineComponent, { lockObject: this.props.lockObject, label: "Y", target: proxy, propertyName: "scaleY", arrows: true, digits: 2, step: "0.0005" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_pivotIcon_svg__WEBPACK_IMPORTED_MODULE_29__, label: "Transform Center" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__.FloatLineComponent, { lockObject: this.props.lockObject, label: "X", target: proxy, propertyName: "transformCenterX", arrows: true, digits: 2, step: "0.0005" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__.FloatLineComponent, { lockObject: this.props.lockObject, label: "Y", target: proxy, propertyName: "transformCenterY", arrows: true, digits: 2, step: "0.0005" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_rotationIcon_svg__WEBPACK_IMPORTED_MODULE_30__, label: "Rotation" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_4__.SliderLineComponent, { iconLabel: "Rotation", lockObject: this.props.lockObject, label: "", target: proxy, decimalCount: 2, propertyName: "rotation", minimum: 0, maximum: 2 * Math.PI, step: 0.01, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: "RAD", locked: true }) })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", { className: "ge" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_2__.TextLineComponent, { tooltip: "", label: "APPEARANCE", value: " ", color: "grey" }), controls.every((control) => control.color !== undefined && control.typeName !== "Image" && control.typeName !== "ImageBasedSlider" && control.typeName !== "ColorPicker") && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_colorIcon_svg__WEBPACK_IMPORTED_MODULE_31__, label: "Outline Color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_8__.ColorLineComponent, { lockObject: this.props.lockObject, label: "Outline Color", target: proxy, propertyName: "color" })] })), controls.every((control) => control.background !== undefined) && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_fillColorIcon_svg__WEBPACK_IMPORTED_MODULE_32__, label: "Background Color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_8__.ColorLineComponent, { lockObject: this.props.lockObject, label: "Background Color", target: proxy, propertyName: "background" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_alphaIcon_svg__WEBPACK_IMPORTED_MODULE_33__, label: "Alpha" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_4__.SliderLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "alpha", minimum: 0, maximum: 1, step: 0.01 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_shadowColorIcon_svg__WEBPACK_IMPORTED_MODULE_34__, label: "Shadow Color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_8__.ColorLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "shadowColor", disableAlpha: true })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_shadowOffsetXIcon_svg__WEBPACK_IMPORTED_MODULE_35__, label: "Shadow Offset" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__.FloatLineComponent, { lockObject: this.props.lockObject, label: "X", target: proxy, propertyName: "shadowOffsetX", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: "PX", locked: true }), arrows: true, step: "0.1", digits: 2 }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__.FloatLineComponent, { lockObject: this.props.lockObject, label: "Y", target: proxy, propertyName: "shadowOffsetY", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: "PX", locked: true }), arrows: true, step: "0.1", digits: 2 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_shadowBlurIcon_svg__WEBPACK_IMPORTED_MODULE_36__, label: "Shadow Blur" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__.FloatLineComponent, { lockObject: this.props.lockObject, label: " ", target: proxy, propertyName: "shadowBlur", arrows: true, min: 0, digits: 2 })] }), showTextProperties && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", { className: "ge" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_2__.TextLineComponent, { tooltip: "", label: "FONT STYLE", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_fontFamilyIcon_svg__WEBPACK_IMPORTED_MODULE_37__, label: "Font Family" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "fontFamily" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_fontWeightIcon_svg__WEBPACK_IMPORTED_MODULE_38__, label: "Font Weight" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "fontWeight" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_fontStyleIcon_svg__WEBPACK_IMPORTED_MODULE_39__, label: "Font Style" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_13__.OptionsLineComponent, { label: "", target: proxy, propertyName: "fontStyle", options: fontStyleOptions, onSelect: (newValue) => {
|
|
52279
52276
|
proxy.fontStyle = ["", "italic", "oblique"][newValue];
|
|
52280
52277
|
}, extractValue: () => {
|
|
52281
52278
|
switch (proxy.fontStyle) {
|
|
@@ -52286,7 +52283,7 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
|
|
|
52286
52283
|
default:
|
|
52287
52284
|
return 0;
|
|
52288
52285
|
}
|
|
52289
|
-
} })] })
|
|
52286
|
+
} })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__.IconComponent, { icon: shared_ui_components_imgs_fontSizeIcon_svg__WEBPACK_IMPORTED_MODULE_40__, label: "Font Size" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "", numbersOnly: true, value: getValue("_fontSize"), onChange: (newValue) => this._checkAndUpdateValues("fontSize", newValue), unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__.UnitButton, { unit: getUnitString("_fontSize"), onClick: (unit) => convertUnits(unit, "fontSize") }), arrows: true, arrowsIncrement: (amount) => increment("fontSize", amount, 0) })] })] }))] }));
|
|
52290
52287
|
}
|
|
52291
52288
|
}
|
|
52292
52289
|
|
|
@@ -52326,7 +52323,7 @@ class ContainerPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.
|
|
|
52326
52323
|
render() {
|
|
52327
52324
|
const { containers, onPropertyChangedObservable } = this.props;
|
|
52328
52325
|
const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_3__.makeTargetsProxy)(containers, onPropertyChangedObservable);
|
|
52329
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
52326
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_4__.IconComponent, { icon: shared_ui_components_imgs_clipContentsIcon_svg__WEBPACK_IMPORTED_MODULE_5__, label: "Clips content outside the bounding box of this control" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_2__.CheckBoxLineComponent, { label: "CLIP CONTENT", target: proxy, propertyName: "clipContent" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_4__.IconComponent, { icon: shared_ui_components_imgs_clipChildrenIcon_svg__WEBPACK_IMPORTED_MODULE_6__, label: "Clips child controls to this control's shape" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_2__.CheckBoxLineComponent, { label: "CLIP CHILDREN", target: proxy, propertyName: "clipChildren" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_4__.IconComponent, { icon: shared_ui_components_imgs_autoStretchWidthIcon_svg__WEBPACK_IMPORTED_MODULE_7__, label: "Makes the container's width automatically adapt to its children" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_2__.CheckBoxLineComponent, { label: "ADAPT WIDTH TO CHILDREN", target: proxy, propertyName: "adaptWidthToChildren" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_4__.IconComponent, { icon: shared_ui_components_imgs_autoStretchHeightIcon_svg__WEBPACK_IMPORTED_MODULE_8__, label: "Makes the container's height automatically adapt to its children" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_2__.CheckBoxLineComponent, { label: "ADAPT HEIGHT TO CHILDREN", target: proxy, propertyName: "adaptHeightToChildren" })] })] }));
|
|
52330
52327
|
}
|
|
52331
52328
|
}
|
|
52332
52329
|
|
|
@@ -52356,7 +52353,7 @@ class ControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Co
|
|
|
52356
52353
|
}
|
|
52357
52354
|
render() {
|
|
52358
52355
|
const controls = this.props.controls;
|
|
52359
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
52356
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "pane", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, controls: controls, onPropertyChangedObservable: this.props.onPropertyChangedObservable }) }));
|
|
52360
52357
|
}
|
|
52361
52358
|
}
|
|
52362
52359
|
|
|
@@ -52413,7 +52410,7 @@ class DisplayGridPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1_
|
|
|
52413
52410
|
render() {
|
|
52414
52411
|
const { displayGrids, lockObject, onPropertyChangedObservable } = this.props;
|
|
52415
52412
|
const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__.makeTargetsProxy)(displayGrids, onPropertyChangedObservable);
|
|
52416
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
52413
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: lockObject, controls: displayGrids, onPropertyChangedObservable: onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { label: "DISPLAY GRID", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_sizeIcon_svg__WEBPACK_IMPORTED_MODULE_10__, label: "Cell Size" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_4__.FloatLineComponent, { min: 1, isInteger: true, lockObject: lockObject, label: "W", target: proxy, propertyName: "cellWidth", onPropertyChangedObservable: onPropertyChangedObservable, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_8__.UnitButton, { locked: true, unit: "PX" }), arrows: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_4__.FloatLineComponent, { min: 1, isInteger: true, lockObject: lockObject, label: "H", target: proxy, propertyName: "cellHeight", onPropertyChangedObservable: onPropertyChangedObservable, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_8__.UnitButton, { locked: true, unit: "PX" }), arrows: true })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_displayGridLine1Icon_svg__WEBPACK_IMPORTED_MODULE_11__, label: "Show Minor Lines" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_9__.CheckBoxLineComponent, { label: "SHOW MINOR LINES", onValueChanged: () => this.forceUpdate(), target: proxy, propertyName: "_displayMinorLines" })] }), proxy._displayMinorLines && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_strokeWeightIcon_svg__WEBPACK_IMPORTED_MODULE_12__, label: "Minor Line Tickness" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_4__.FloatLineComponent, { min: 1, isInteger: true, lockObject: lockObject, label: "", target: proxy, propertyName: "minorLineTickness", onPropertyChangedObservable: onPropertyChangedObservable, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_8__.UnitButton, { locked: true, unit: "PX" }), arrows: true })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_colorIcon_svg__WEBPACK_IMPORTED_MODULE_13__, label: "Minor Line Color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_5__.ColorLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "minorLineColor", onPropertyChangedObservable: onPropertyChangedObservable })] })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_displayGridLine2Icon_svg__WEBPACK_IMPORTED_MODULE_14__, label: "Show Major Lines" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_9__.CheckBoxLineComponent, { label: "SHOW MAJOR LINES", onValueChanged: () => this.forceUpdate(), target: proxy, propertyName: "_displayMajorLines" })] }), proxy._displayMajorLines && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_strokeWeightIcon_svg__WEBPACK_IMPORTED_MODULE_12__, label: "Major Line Tickness" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_4__.FloatLineComponent, { min: 1, isInteger: true, lockObject: lockObject, label: "", target: proxy, propertyName: "majorLineTickness", onPropertyChangedObservable: onPropertyChangedObservable, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_8__.UnitButton, { locked: true, unit: "PX" }), arrows: true })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_colorIcon_svg__WEBPACK_IMPORTED_MODULE_13__, label: "Major Line Color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_5__.ColorLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "majorLineColor", onPropertyChangedObservable: onPropertyChangedObservable })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_frequencyIcon_svg__WEBPACK_IMPORTED_MODULE_15__, label: "Major Line Frequency" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_4__.FloatLineComponent, { min: 1, isInteger: true, lockObject: lockObject, label: "", target: proxy, propertyName: "majorLineFrequency", onPropertyChangedObservable: onPropertyChangedObservable, arrows: true })] })] }))] }));
|
|
52417
52414
|
}
|
|
52418
52415
|
}
|
|
52419
52416
|
|
|
@@ -52458,7 +52455,7 @@ class EllipsePropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Co
|
|
|
52458
52455
|
render() {
|
|
52459
52456
|
const { ellipses, onPropertyChangedObservable, lockObject } = this.props;
|
|
52460
52457
|
const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_5__.makeTargetsProxy)(ellipses, onPropertyChangedObservable);
|
|
52461
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
52458
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: lockObject, controls: ellipses, onPropertyChangedObservable: onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextLineComponent, { label: "ELLIPSE", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_strokeWeightIcon_svg__WEBPACK_IMPORTED_MODULE_9__, label: "Stroke Weight" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "thickness", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_8__.UnitButton, { unit: "PX", locked: true }), arrows: true, min: 0, digits: 2 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_containerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_6__.ContainerPropertyGridComponent, { containers: ellipses, onPropertyChangedObservable: onPropertyChangedObservable })] }));
|
|
52462
52459
|
}
|
|
52463
52460
|
}
|
|
52464
52461
|
|
|
@@ -52521,14 +52518,14 @@ class GridPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
52521
52518
|
}
|
|
52522
52519
|
renderRows() {
|
|
52523
52520
|
return this._rowDefinitions.map((rd, i) => {
|
|
52524
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
52521
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: this._removingRow && i === this._rowEditFlags.length - 1 ? "ge-grid-remove" : this._rowEditFlags[i] ? "ge-grid-edit" : "ge-grid", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-grid-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "", icon: shared_ui_components_imgs_gridColumnIconDark_svg__WEBPACK_IMPORTED_MODULE_6__, iconLabel: `Row ${i}`, value: rd, numbersOnly: true, onChange: (newValue) => {
|
|
52525
52522
|
this._rowDefinitions[i] = newValue;
|
|
52526
52523
|
this._rowEditFlags[i] = true;
|
|
52527
52524
|
this._editedRow = true;
|
|
52528
52525
|
this._removingRow = false;
|
|
52529
52526
|
this._rowChild = false;
|
|
52530
52527
|
this.forceUpdate();
|
|
52531
|
-
} }, `rText${i}`), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { tooltip: "", label: `[${i}]`, value: "", color: "grey" }), this._removingRow && i === this._rowEditFlags.length - 1 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { icon: shared_ui_components_imgs_deleteGridElementDark_svg__WEBPACK_IMPORTED_MODULE_7__, label: " ", value: " ", color: "grey" })), this._rowEditFlags[i] && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { icon: shared_ui_components_imgs_valueChangedGridDark_svg__WEBPACK_IMPORTED_MODULE_8__, label: " ", value: " ", color: "grey" })] })
|
|
52528
|
+
} }, `rText${i}`), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { tooltip: "", label: `[${i}]`, value: "", color: "grey" }), this._removingRow && i === this._rowEditFlags.length - 1 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { icon: shared_ui_components_imgs_deleteGridElementDark_svg__WEBPACK_IMPORTED_MODULE_7__, label: " ", value: " ", color: "grey" })), this._rowEditFlags[i] && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { icon: shared_ui_components_imgs_valueChangedGridDark_svg__WEBPACK_IMPORTED_MODULE_8__, label: " ", value: " ", color: "grey" })] }) }, `r${i}`));
|
|
52532
52529
|
});
|
|
52533
52530
|
}
|
|
52534
52531
|
setRowValues() {
|
|
@@ -52559,14 +52556,14 @@ class GridPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
52559
52556
|
}
|
|
52560
52557
|
renderColumns() {
|
|
52561
52558
|
return this._columnDefinitions.map((cd, i) => {
|
|
52562
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
52559
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: this._removingColumn && i === this._columnEditFlags.length - 1 ? "ge-grid-remove" : this._columnEditFlags[i] ? "ge-grid-edit" : "ge-grid", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-grid-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "", icon: shared_ui_components_imgs_gridRowIconDark_svg__WEBPACK_IMPORTED_MODULE_9__, iconLabel: `Column ${i}`, value: cd, numbersOnly: true, onChange: (newValue) => {
|
|
52563
52560
|
this._columnDefinitions[i] = newValue;
|
|
52564
52561
|
this._columnEditFlags[i] = true;
|
|
52565
52562
|
this._editedColumn = true;
|
|
52566
52563
|
this._removingColumn = false;
|
|
52567
52564
|
this._columnChild = false;
|
|
52568
52565
|
this.forceUpdate();
|
|
52569
|
-
} }, `ctext${i}`), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { tooltip: "", label: `[${i}]`, value: "", color: "grey" }), this._removingColumn && i === this._columnEditFlags.length - 1 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { icon: shared_ui_components_imgs_deleteGridElementDark_svg__WEBPACK_IMPORTED_MODULE_7__, label: " ", value: " ", color: "grey" })), this._columnEditFlags[i] && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { icon: shared_ui_components_imgs_valueChangedGridDark_svg__WEBPACK_IMPORTED_MODULE_8__, label: " ", value: " ", color: "grey" })] })
|
|
52566
|
+
} }, `ctext${i}`), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { tooltip: "", label: `[${i}]`, value: "", color: "grey" }), this._removingColumn && i === this._columnEditFlags.length - 1 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { icon: shared_ui_components_imgs_deleteGridElementDark_svg__WEBPACK_IMPORTED_MODULE_7__, label: " ", value: " ", color: "grey" })), this._columnEditFlags[i] && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { icon: shared_ui_components_imgs_valueChangedGridDark_svg__WEBPACK_IMPORTED_MODULE_8__, label: " ", value: " ", color: "grey" })] }) }, `c${i}`));
|
|
52570
52567
|
});
|
|
52571
52568
|
}
|
|
52572
52569
|
resizeRow() {
|
|
@@ -52688,8 +52685,7 @@ class GridPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
52688
52685
|
this.setColumnValues();
|
|
52689
52686
|
}
|
|
52690
52687
|
checkValue(value, percent) {
|
|
52691
|
-
|
|
52692
|
-
let newValue = (_a = value.match(/([0-9.,]+)/g)) === null || _a === void 0 ? void 0 : _a[0];
|
|
52688
|
+
let newValue = value.match(/([0-9.,]+)/g)?.[0];
|
|
52693
52689
|
if (!newValue) {
|
|
52694
52690
|
newValue = "0";
|
|
52695
52691
|
}
|
|
@@ -52718,13 +52714,13 @@ class GridPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
52718
52714
|
if (grid !== this._previousGrid) {
|
|
52719
52715
|
this.resetValues();
|
|
52720
52716
|
}
|
|
52721
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
52717
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, controls: grids, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", { className: "ge" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { tooltip: "", label: "GRID", value: " ", color: "grey" }), this.renderRows(), this.props.grids.length === 1 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "ge-gridLine", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-grid-button-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_5__.CommandButtonComponent, { altStyle: true, tooltip: "Add Row", icon: shared_ui_components_imgs_addGridElementDark_svg__WEBPACK_IMPORTED_MODULE_10__, shortcut: "", isActive: false, onClick: () => {
|
|
52722
52718
|
let total = 0;
|
|
52723
52719
|
let count = 0;
|
|
52724
52720
|
for (let i = 0; i < grid.rowCount; ++i) {
|
|
52725
52721
|
const rd = grid.getRowDefinition(i);
|
|
52726
|
-
if (rd
|
|
52727
|
-
total += rd
|
|
52722
|
+
if (rd?.isPercentage) {
|
|
52723
|
+
total += rd?.getValue(grid.host);
|
|
52728
52724
|
count++;
|
|
52729
52725
|
}
|
|
52730
52726
|
}
|
|
@@ -52735,7 +52731,7 @@ class GridPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
52735
52731
|
let hasChild = false;
|
|
52736
52732
|
for (let i = 0; i < grid.columnCount; ++i) {
|
|
52737
52733
|
const child = grid.cells[grid.rowCount - 1 + ":" + i];
|
|
52738
|
-
if (child
|
|
52734
|
+
if (child?.children.length) {
|
|
52739
52735
|
hasChild = true;
|
|
52740
52736
|
break;
|
|
52741
52737
|
//(grid.rowCount > 1 && !this._removingRow)
|
|
@@ -52754,25 +52750,24 @@ class GridPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
52754
52750
|
this.resetValues();
|
|
52755
52751
|
this.forceUpdate();
|
|
52756
52752
|
} })] })), this._removingRow && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_5__.CommandButtonComponent, { altStyle: true, tooltip: "Confirm", icon: shared_ui_components_imgs_confirmGridElementDark_svg__WEBPACK_IMPORTED_MODULE_12__, shortcut: "", isActive: false, onClick: () => {
|
|
52757
|
-
var _a;
|
|
52758
52753
|
grid.removeRowDefinition(grid.rowCount - 1);
|
|
52759
52754
|
this.setRowValues();
|
|
52760
52755
|
this.resizeRow();
|
|
52761
52756
|
this.forceUpdate();
|
|
52762
52757
|
this._removingRow = false;
|
|
52763
52758
|
this._rowChild = false;
|
|
52764
|
-
|
|
52759
|
+
this.props.onUpdateRequiredObservable?.notifyObservers();
|
|
52765
52760
|
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_5__.CommandButtonComponent, { altStyle: true, tooltip: "Cancel", icon: shared_ui_components_imgs_cancelGridElementDark_svg__WEBPACK_IMPORTED_MODULE_13__, shortcut: "", isActive: false, onClick: () => {
|
|
52766
52761
|
this._removingRow = false;
|
|
52767
52762
|
this._rowChild = false;
|
|
52768
52763
|
this.forceUpdate();
|
|
52769
|
-
} })] }))] })
|
|
52764
|
+
} })] }))] }) }), this._rowChild && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { tooltip: "", label: "This row is not empty. Removing it will delete all contained controls. Do you want to remove this row and delete all controls within?", value: " ", color: "grey" }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", { className: "ge" }), this.renderColumns(), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-grid-button-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_5__.CommandButtonComponent, { altStyle: true, tooltip: "Add Column", icon: shared_ui_components_imgs_addGridElementDark_svg__WEBPACK_IMPORTED_MODULE_10__, shortcut: "", isActive: false, onClick: () => {
|
|
52770
52765
|
let total = 0;
|
|
52771
52766
|
let count = 0;
|
|
52772
52767
|
for (let i = 0; i < grid.columnCount; ++i) {
|
|
52773
52768
|
const cd = grid.getColumnDefinition(i);
|
|
52774
|
-
if (cd
|
|
52775
|
-
total += cd
|
|
52769
|
+
if (cd?.isPercentage) {
|
|
52770
|
+
total += cd?.getValue(grid.host);
|
|
52776
52771
|
count++;
|
|
52777
52772
|
}
|
|
52778
52773
|
}
|
|
@@ -52783,7 +52778,7 @@ class GridPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
52783
52778
|
let hasChild = false;
|
|
52784
52779
|
for (let i = 0; i < grid.rowCount; ++i) {
|
|
52785
52780
|
const child = grid.cells[i + ":" + (grid.columnCount - 1)];
|
|
52786
|
-
if (child
|
|
52781
|
+
if (child?.children.length) {
|
|
52787
52782
|
hasChild = true;
|
|
52788
52783
|
break;
|
|
52789
52784
|
}
|
|
@@ -52801,19 +52796,18 @@ class GridPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
52801
52796
|
this.resetValues();
|
|
52802
52797
|
this.forceUpdate();
|
|
52803
52798
|
} })] })), this._removingColumn && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_5__.CommandButtonComponent, { altStyle: true, tooltip: "Confirm", icon: shared_ui_components_imgs_confirmGridElementDark_svg__WEBPACK_IMPORTED_MODULE_12__, shortcut: "", isActive: false, onClick: () => {
|
|
52804
|
-
var _a;
|
|
52805
52799
|
grid.removeColumnDefinition(grid.columnCount - 1);
|
|
52806
52800
|
this.setColumnValues();
|
|
52807
52801
|
this.resizeColumn();
|
|
52808
52802
|
this.forceUpdate();
|
|
52809
52803
|
this._removingColumn = false;
|
|
52810
52804
|
this._columnChild = false;
|
|
52811
|
-
|
|
52805
|
+
this.props.onUpdateRequiredObservable?.notifyObservers();
|
|
52812
52806
|
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_5__.CommandButtonComponent, { altStyle: true, tooltip: "Cancel", icon: shared_ui_components_imgs_cancelGridElementDark_svg__WEBPACK_IMPORTED_MODULE_13__, shortcut: "", isActive: false, onClick: () => {
|
|
52813
52807
|
this._removingColumn = false;
|
|
52814
52808
|
this._columnChild = false;
|
|
52815
52809
|
this.forceUpdate();
|
|
52816
|
-
} })] })), " "] })
|
|
52810
|
+
} })] })), " "] }), this._columnChild && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextLineComponent, { tooltip: "", label: "This column is not empty. Removing it will delete all contained controls. Do you want to remove this column and delete all controls within?", value: " ", color: "grey" }) }))] }))] }));
|
|
52817
52811
|
}
|
|
52818
52812
|
}
|
|
52819
52813
|
|
|
@@ -52859,7 +52853,7 @@ class ImageBasedSliderPropertyGridComponent extends react__WEBPACK_IMPORTED_MODU
|
|
|
52859
52853
|
}
|
|
52860
52854
|
render() {
|
|
52861
52855
|
const imageBasedSliders = this.props.imageBasedSliders;
|
|
52862
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
52856
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, controls: imageBasedSliders, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextLineComponent, { label: "IMAGE LINKS", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_thumbImageLinkIcon_svg__WEBPACK_IMPORTED_MODULE_8__, label: "Thumb Image Link" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextInputLineComponent, { lockObject: this.props.lockObject, target: (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__.makeTargetsProxy)(imageBasedSliders.map((slider) => slider.thumbImage), this.props.onPropertyChangedObservable), label: "", propertyName: "source" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_valueBarImageLinkIcon_svg__WEBPACK_IMPORTED_MODULE_9__, label: "Value Bar Image Link" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextInputLineComponent, { lockObject: this.props.lockObject, target: (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__.makeTargetsProxy)(imageBasedSliders.map((slider) => slider.valueBarImage), this.props.onPropertyChangedObservable), label: "", propertyName: "source", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_sliderBackgroundImageIcon_svg__WEBPACK_IMPORTED_MODULE_10__, label: "Background Image Link" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextInputLineComponent, { lockObject: this.props.lockObject, target: (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__.makeTargetsProxy)(imageBasedSliders.map((slider) => slider.backgroundImage), this.props.onPropertyChangedObservable), label: "", propertyName: "source", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sliderPropertyGridComponent__WEBPACK_IMPORTED_MODULE_5__.SliderPropertyGridComponent, { sliders: imageBasedSliders, lockObject: this.props.lockObject, onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }));
|
|
52863
52857
|
}
|
|
52864
52858
|
}
|
|
52865
52859
|
|
|
@@ -52991,25 +52985,25 @@ class ImagePropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Comp
|
|
|
52991
52985
|
const maxCells = this.getMaxCells();
|
|
52992
52986
|
const maxCellWidth = Math.max(...images.map((image) => image.imageWidth));
|
|
52993
52987
|
const maxCellHeight = Math.max(...images.map((image) => image.imageHeight));
|
|
52994
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
52988
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, controls: images, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_8__.TextLineComponent, { label: "IMAGE", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_imageLinkIcon_svg__WEBPACK_IMPORTED_MODULE_12__, label: "Source" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__.TextInputLineComponent, { lockObject: this.props.lockObject, label: " ", target: proxy, propertyName: "source" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_cropIcon_svg__WEBPACK_IMPORTED_MODULE_13__, label: "Crop" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "L", target: proxy, propertyName: "sourceLeft", numeric: true, arrows: true, min: 0, placeholder: "0", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_11__.UnitButton, { unit: "PX", locked: true }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "T", target: proxy, propertyName: "sourceTop", numeric: true, arrows: true, min: 0, placeholder: "0", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_11__.UnitButton, { unit: "PX", locked: true }) })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_cropIcon_svg__WEBPACK_IMPORTED_MODULE_13__, label: "Crop" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "W", target: proxy, propertyName: "sourceWidth", numeric: true, arrows: true, min: 0, placeholder: Math.max(...images.map((image) => image.imageWidth)).toString(), unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_11__.UnitButton, { unit: "PX", locked: true }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "H", target: proxy, propertyName: "sourceHeight", numeric: true, arrows: true, min: 0, placeholder: Math.max(...images.map((image) => image.imageHeight)).toString(), unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_11__.UnitButton, { unit: "PX", locked: true }) })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_autoResizeIcon_svg__WEBPACK_IMPORTED_MODULE_14__, label: "Autoscale" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "AUTOSCALE", target: proxy, propertyName: "autoScale", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_stretchFillIcon_svg__WEBPACK_IMPORTED_MODULE_15__, label: "Stretch" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_6__.OptionsLineComponent, { label: " ", options: stretchOptions, target: proxy, propertyName: "stretch", onSelect: (value) => this.setState({ mode: value }) })] }), images.length === 1 && image.stretch === gui_2D_controls_image__WEBPACK_IMPORTED_MODULE_3__.Image.STRETCH_NINE_PATCH && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_cropIcon_svg__WEBPACK_IMPORTED_MODULE_13__, label: "Slice Horizontal" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_4__.FloatLineComponent, { lockObject: this.props.lockObject, label: "L", target: image, propertyName: "sliceLeft", onChange: () => {
|
|
52995
52989
|
image.populateNinePatchSlicesFromImage = false;
|
|
52996
52990
|
this.forceUpdate();
|
|
52997
52991
|
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_4__.FloatLineComponent, { lockObject: this.props.lockObject, label: "R", target: image, propertyName: "sliceRight", onChange: () => {
|
|
52998
52992
|
image.populateNinePatchSlicesFromImage = false;
|
|
52999
52993
|
this.forceUpdate();
|
|
53000
|
-
} })] })
|
|
52994
|
+
} })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_cropIcon_svg__WEBPACK_IMPORTED_MODULE_13__, label: "Slice Vertical" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_4__.FloatLineComponent, { lockObject: this.props.lockObject, label: "T", target: image, propertyName: "sliceTop", onChange: () => {
|
|
53001
52995
|
image.populateNinePatchSlicesFromImage = false;
|
|
53002
52996
|
this.forceUpdate();
|
|
53003
52997
|
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_4__.FloatLineComponent, { lockObject: this.props.lockObject, label: "B", target: image, propertyName: "sliceBottom", onChange: () => {
|
|
53004
52998
|
image.populateNinePatchSlicesFromImage = false;
|
|
53005
52999
|
this.forceUpdate();
|
|
53006
|
-
} })] })
|
|
53000
|
+
} })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_autoResizeIcon_svg__WEBPACK_IMPORTED_MODULE_14__, label: "Populate Nine Patch Slices From Image" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "SLICE FROM IMAGE", target: image, propertyName: "populateNinePatchSlicesFromImage", onValueChanged: () => {
|
|
53007
53001
|
this.forceUpdate();
|
|
53008
53002
|
image._markAsDirty();
|
|
53009
|
-
} })] })
|
|
53003
|
+
} })] })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { iconLabel: "animationSheet", icon: shared_ui_components_imgs_animationSheetIcon_svg__WEBPACK_IMPORTED_MODULE_16__, label: "ANIMATION SHEET", target: (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_9__.makeTargetsProxy)(images, this.props.onPropertyChangedObservable, (target) => target.cellId !== -1), onValueChanged: () => {
|
|
53010
53004
|
this.toggleAnimations(!animationSheet);
|
|
53011
53005
|
this.forceUpdate();
|
|
53012
|
-
} }), animationSheet && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
53006
|
+
} }), animationSheet && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "ge-divider double", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_4__.FloatLineComponent, { iconLabel: "Cell Id", icon: shared_ui_components_imgs_cellIDIcon_svg__WEBPACK_IMPORTED_MODULE_17__, lockObject: this.props.lockObject, label: "", isInteger: true, target: proxy, propertyName: "cellId", min: 0, max: maxCells }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_4__.FloatLineComponent, { icon: shared_ui_components_imgs_sizeIcon_svg__WEBPACK_IMPORTED_MODULE_18__, lockObject: this.props.lockObject, label: "W", target: proxy, propertyName: "cellWidth", isInteger: true, onChange: () => this.updateCellSize(), min: 1, max: maxCellWidth }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_4__.FloatLineComponent, { lockObject: this.props.lockObject, label: "H", target: proxy, propertyName: "cellHeight", isInteger: true, onChange: () => this.updateCellSize(), min: 1, max: maxCellHeight })] })] }))] }));
|
|
53013
53007
|
}
|
|
53014
53008
|
}
|
|
53015
53009
|
|
|
@@ -53082,7 +53076,7 @@ class InputTextPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.
|
|
|
53082
53076
|
render() {
|
|
53083
53077
|
const { inputTexts, onPropertyChangedObservable, lockObject } = this.props;
|
|
53084
53078
|
const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_8__.makeTargetsProxy)(inputTexts, onPropertyChangedObservable);
|
|
53085
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
53079
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: lockObject, controls: inputTexts, onPropertyChangedObservable: onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_7__.TextLineComponent, { label: "INPUT TEXT", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_textIcon_svg__WEBPACK_IMPORTED_MODULE_12__, label: "Text" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextInputLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "text" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_textInputIcon_svg__WEBPACK_IMPORTED_MODULE_13__, label: "Prompt Text" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextInputLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "promptMessage" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_widthIcon_svg__WEBPACK_IMPORTED_MODULE_14__, label: "Max Width" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextInputLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "maxWidth" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_marginsIcon_svg__WEBPACK_IMPORTED_MODULE_15__, label: "Margins" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextInputLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "margin" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_strokeWeightIcon_svg__WEBPACK_IMPORTED_MODULE_16__, label: "Border Thickness" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_6__.FloatLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "thickness", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_11__.UnitButton, { unit: "PX", locked: true }), arrows: true, min: 0, digits: 2 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_autoStretchWidthIcon_svg__WEBPACK_IMPORTED_MODULE_17__, label: "Automatically Stretch Width" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "AUTO STRETCH", target: proxy, propertyName: "autoStretchWidth" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_selectAllIcon_svg__WEBPACK_IMPORTED_MODULE_18__, label: "When Input is Focus, Select All" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "ON FOCUS, SELECT ALL", target: proxy, propertyName: "onFocusSelectAll" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_highlightIcon_svg__WEBPACK_IMPORTED_MODULE_19__, label: "Highlight Color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_9__.ColorLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "textHighlightColor" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_alphaIcon_svg__WEBPACK_IMPORTED_MODULE_20__, label: "Highlight Opacity" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_4__.SliderLineComponent, { lockObject: lockObject, label: "", minimum: 0, maximum: 1, step: 0.01, target: proxy, propertyName: "highligherOpacity" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_fillColorIcon_svg__WEBPACK_IMPORTED_MODULE_21__, label: "Background Color when Focused" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_9__.ColorLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "focusedBackground" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_textPlaceholderIcon_svg__WEBPACK_IMPORTED_MODULE_22__, label: "Placeholder Text" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_3__.TextInputLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "placeholderText" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_colorIcon_svg__WEBPACK_IMPORTED_MODULE_23__, label: "Placeholder Color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_9__.ColorLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "placeholderColor" })] })] }));
|
|
53086
53080
|
}
|
|
53087
53081
|
}
|
|
53088
53082
|
|
|
@@ -53161,7 +53155,7 @@ class LinePropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
53161
53155
|
});
|
|
53162
53156
|
}
|
|
53163
53157
|
const dashString = dashes.join(",");
|
|
53164
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
53158
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextLineComponent, { label: "LINE", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_linePoint1Icon_svg__WEBPACK_IMPORTED_MODULE_9__, label: "Position 1" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: lockObject, label: "X", target: proxy, propertyName: "x1" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: lockObject, label: "Y", target: proxy, propertyName: "y1" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_linePoint2Icon_svg__WEBPACK_IMPORTED_MODULE_10__, label: "Position 2" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: lockObject, label: "X", target: proxy, propertyName: "x2" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: lockObject, label: "Y", target: proxy, propertyName: "y2" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_strokeWeightIcon_svg__WEBPACK_IMPORTED_MODULE_11__, label: "Line Width" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "lineWidth", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_8__.UnitButton, { unit: "PX", locked: true }), min: 0, arrows: true })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_lineDashIcon_svg__WEBPACK_IMPORTED_MODULE_12__, label: "Dash Pattern" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: lockObject, label: "", target: proxy, value: dashString, onChange: (newValue) => this.onDashChange(newValue) })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { hideDimensions: true, lockObject: lockObject, controls: lines, onPropertyChangedObservable: onPropertyChangedObservable })] }));
|
|
53165
53159
|
}
|
|
53166
53160
|
}
|
|
53167
53161
|
|
|
@@ -53211,7 +53205,7 @@ class RadioButtonPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1_
|
|
|
53211
53205
|
}
|
|
53212
53206
|
render() {
|
|
53213
53207
|
const radioButtons = this.props.radioButtons;
|
|
53214
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
53208
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, controls: radioButtons, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_6__.TextLineComponent, { label: "RADIO BUTTON", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_8__.IconComponent, { icon: shared_ui_components_imgs_strokeWeightIcon_svg__WEBPACK_IMPORTED_MODULE_10__, label: "Stroke Weight" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: this.props.lockObject, label: "", target: (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_7__.makeTargetsProxy)(radioButtons, this.props.onPropertyChangedObservable), propertyName: "thickness", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_9__.UnitButton, { unit: "PX", locked: true }), arrows: true, min: 0, digits: 2 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_8__.IconComponent, { icon: shared_ui_components_imgs_scaleIcon_svg__WEBPACK_IMPORTED_MODULE_11__, label: "Check Size Ratio" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: this.props.lockObject, label: "", target: (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_7__.makeTargetsProxy)(radioButtons, this.props.onPropertyChangedObservable), propertyName: "checkSizeRatio", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_9__.UnitButton, { unit: "PX", locked: true }), arrows: true, min: 0, digits: 2 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_8__.IconComponent, { icon: shared_ui_components_imgs_strokeWeightIcon_svg__WEBPACK_IMPORTED_MODULE_10__, label: "Name of Group" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "", target: (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_7__.makeTargetsProxy)(radioButtons, this.props.onPropertyChangedObservable), propertyName: "group" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_8__.IconComponent, { icon: shared_ui_components_imgs_checkboxIconDark_svg__WEBPACK_IMPORTED_MODULE_12__, label: "Is Checked" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "CHECKED", target: (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_7__.makeTargetsProxy)(radioButtons, this.props.onPropertyChangedObservable), propertyName: "isChecked" })] })] }));
|
|
53215
53209
|
}
|
|
53216
53210
|
}
|
|
53217
53211
|
|
|
@@ -53258,7 +53252,7 @@ class RectanglePropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.
|
|
|
53258
53252
|
render() {
|
|
53259
53253
|
const { rectangles, lockObject, onPropertyChangedObservable } = this.props;
|
|
53260
53254
|
const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_5__.makeTargetsProxy)(rectangles, onPropertyChangedObservable);
|
|
53261
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
53255
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: lockObject, controls: rectangles, onPropertyChangedObservable: onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextLineComponent, { label: "RECTANGLE", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_strokeWeightIcon_svg__WEBPACK_IMPORTED_MODULE_9__, label: "Stroke Weight" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "thickness", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_8__.UnitButton, { unit: "PX", locked: true }), arrows: true, min: 0, digits: 2 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_conerRadiusIcon_svg__WEBPACK_IMPORTED_MODULE_10__, label: "Corner Radius" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: lockObject, label: "", target: proxy, propertyName: "cornerRadius", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_8__.UnitButton, { unit: "PX", locked: true }), arrows: true, min: 0, digits: 2 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_containerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_6__.ContainerPropertyGridComponent, { containers: rectangles, onPropertyChangedObservable: onPropertyChangedObservable })] }));
|
|
53262
53256
|
}
|
|
53263
53257
|
}
|
|
53264
53258
|
|
|
@@ -53313,7 +53307,7 @@ class ScrollViewerPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1
|
|
|
53313
53307
|
render() {
|
|
53314
53308
|
const { scrollViewers, onPropertyChangedObservable, lockObject } = this.props;
|
|
53315
53309
|
const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__.makeTargetsProxy)(scrollViewers, onPropertyChangedObservable);
|
|
53316
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
53310
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: lockObject, controls: scrollViewers, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextLineComponent, { label: "SCROLLVIEWER", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_scrollViewerPrecisionIcon_svg__WEBPACK_IMPORTED_MODULE_9__, label: "Wheel Precision" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "wheelPrecision", arrows: true, min: 0, digits: 2 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_widthIcon_svg__WEBPACK_IMPORTED_MODULE_10__, label: "Bar Size" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "barSize", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_8__.UnitButton, { unit: "PX", locked: true }), arrows: true, min: 0, digits: 2 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "e-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_colorIcon_svg__WEBPACK_IMPORTED_MODULE_11__, label: "Bar Color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_5__.ColorLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "barColor" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_fillColorIcon_svg__WEBPACK_IMPORTED_MODULE_12__, label: "Bar Background Color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_5__.ColorLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "barBackground" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_strokeWeightIcon_svg__WEBPACK_IMPORTED_MODULE_13__, label: "Stroke Weight" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "thickness", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_8__.UnitButton, { unit: "PX", locked: true }), arrows: true, min: 0, digits: 2 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_7__.IconComponent, { icon: shared_ui_components_imgs_conerRadiusIcon_svg__WEBPACK_IMPORTED_MODULE_14__, label: "Corner Radius" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__.FloatLineComponent, { lockObject: lockObject, label: "", target: (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__.makeTargetsProxy)(scrollViewers, onPropertyChangedObservable), propertyName: "cornerRadius", unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_8__.UnitButton, { unit: "PX", locked: true }), arrows: true, min: 0, digits: 2 })] })] }));
|
|
53317
53311
|
}
|
|
53318
53312
|
}
|
|
53319
53313
|
|
|
@@ -53345,7 +53339,7 @@ class SliderGenericPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
|
|
|
53345
53339
|
}
|
|
53346
53340
|
render() {
|
|
53347
53341
|
const sliders = this.props.sliders;
|
|
53348
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
53342
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, controls: sliders, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sliderPropertyGridComponent__WEBPACK_IMPORTED_MODULE_3__.SliderPropertyGridComponent, { sliders: sliders, lockObject: this.props.lockObject, onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }));
|
|
53349
53343
|
}
|
|
53350
53344
|
}
|
|
53351
53345
|
|
|
@@ -53408,7 +53402,7 @@ class SliderPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Com
|
|
|
53408
53402
|
render() {
|
|
53409
53403
|
const { sliders, onPropertyChangedObservable } = this.props;
|
|
53410
53404
|
const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_7__.makeTargetsProxy)(sliders, onPropertyChangedObservable);
|
|
53411
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
53405
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextLineComponent, { label: "SLIDER", value: " ", color: "grey" }), sliders.every((slider) => slider.typeName === "Slider") && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_8__.IconComponent, { icon: shared_ui_components_imgs_colorIcon_svg__WEBPACK_IMPORTED_MODULE_9__, label: "Border Color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_6__.ColorLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "borderColor" })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_8__.IconComponent, { icon: shared_ui_components_imgs_verticalSliderIcon_svg__WEBPACK_IMPORTED_MODULE_10__, label: "Vertical" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_3__.CheckBoxLineComponent, { label: "VERTICAL", target: proxy, propertyName: "isVertical" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_8__.IconComponent, { icon: shared_ui_components_imgs_barOffsetIcon_svg__WEBPACK_IMPORTED_MODULE_11__, label: "Bar Offset" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "barOffset" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_8__.IconComponent, { icon: shared_ui_components_imgs_sliderValueMinimumIcon_svg__WEBPACK_IMPORTED_MODULE_12__, label: "Minimum Value" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_2__.FloatLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "minimum", arrows: true })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_8__.IconComponent, { icon: shared_ui_components_imgs_sliderValueMaximumIcon_svg__WEBPACK_IMPORTED_MODULE_13__, label: "Maximum Value" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_2__.FloatLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "maximum", arrows: true })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_8__.IconComponent, { icon: shared_ui_components_imgs_sliderValueIcon_svg__WEBPACK_IMPORTED_MODULE_14__, label: "Initial Value" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_2__.FloatLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "value", arrows: true })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_5__.TextLineComponent, { label: "THUMB", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_8__.IconComponent, { icon: shared_ui_components_imgs_showThumbIcon_svg__WEBPACK_IMPORTED_MODULE_15__, label: "Display Thumb" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_3__.CheckBoxLineComponent, { label: "DISPLAY THUMB", target: proxy, propertyName: "displayThumb", onValueChanged: () => this.forceUpdate() })] }), proxy.displayThumb && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_8__.IconComponent, { icon: shared_ui_components_imgs_thumbCircleIcon_svg__WEBPACK_IMPORTED_MODULE_16__, label: "Thumb Circular" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_3__.CheckBoxLineComponent, { label: "CIRCULAR", target: proxy, propertyName: "isThumbCircle" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_8__.IconComponent, { icon: shared_ui_components_imgs_clampSliderValueIcon_svg__WEBPACK_IMPORTED_MODULE_17__, label: "Thumb Clamped to Edges" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_3__.CheckBoxLineComponent, { label: "CLAMPED", target: proxy, propertyName: "isThumbClamped" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_8__.IconComponent, { icon: shared_ui_components_imgs_widthIcon_svg__WEBPACK_IMPORTED_MODULE_18__, label: "Width" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "thumbWidth" })] })] }))] }));
|
|
53412
53406
|
}
|
|
53413
53407
|
}
|
|
53414
53408
|
|
|
@@ -53463,7 +53457,7 @@ class StackPanelPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__
|
|
|
53463
53457
|
render() {
|
|
53464
53458
|
const { stackPanels, lockObject, onPropertyChangedObservable } = this.props;
|
|
53465
53459
|
const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_7__.makeTargetsProxy)(stackPanels, onPropertyChangedObservable);
|
|
53466
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
53460
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: lockObject, controls: stackPanels, onPropertyChangedObservable: onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_6__.TextLineComponent, { label: "STACKPANEL", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_9__.IconComponent, { icon: shared_ui_components_imgs_alignVerticalIcon_svg__WEBPACK_IMPORTED_MODULE_12__, label: "Determines if children are stacked horizontally or vertically" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_4__.CheckBoxLineComponent, { label: proxy.isVertical ? "ALIGNMENT: VERTICAL" : "ALIGNMENT: HORIZONTAL", target: proxy, propertyName: "isVertical", onValueChanged: () => {
|
|
53467
53461
|
for (const panel of stackPanels) {
|
|
53468
53462
|
for (const child of panel.children) {
|
|
53469
53463
|
if (proxy.isVertical) {
|
|
@@ -53483,7 +53477,7 @@ class StackPanelPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__
|
|
|
53483
53477
|
}
|
|
53484
53478
|
}
|
|
53485
53479
|
this.forceUpdate();
|
|
53486
|
-
} })] })
|
|
53480
|
+
} })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_9__.IconComponent, { icon: shared_ui_components_imgs_stackPanelSpacingIcon_svg__WEBPACK_IMPORTED_MODULE_13__, label: "Spacing between children" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_5__.FloatLineComponent, { lockObject: lockObject, label: " ", target: proxy, propertyName: "spacing", onChange: () => stackPanels.forEach((panel) => panel._markAsDirty()), unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_11__.UnitButton, { unit: "PX", locked: true }), arrows: true, min: 0 })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_containerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_8__.ContainerPropertyGridComponent, { containers: stackPanels, onPropertyChangedObservable: onPropertyChangedObservable })] }));
|
|
53487
53481
|
}
|
|
53488
53482
|
}
|
|
53489
53483
|
|
|
@@ -53553,7 +53547,7 @@ class TextBlockPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.
|
|
|
53553
53547
|
{ label: "Ellipsis", value: gui_2D_controls_textBlock__WEBPACK_IMPORTED_MODULE_3__.TextWrapping.Ellipsis },
|
|
53554
53548
|
{ label: "Word wrap", value: gui_2D_controls_textBlock__WEBPACK_IMPORTED_MODULE_3__.TextWrapping.WordWrap },
|
|
53555
53549
|
];
|
|
53556
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
53550
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "pane", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__.CommonControlPropertyGridComponent, { lockObject: this.props.lockObject, controls: textBlocks, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_7__.TextLineComponent, { label: "TEXTBLOCK", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_fontFamilyIcon_svg__WEBPACK_IMPORTED_MODULE_13__, label: "Text" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: this.props.lockObject, label: " ", target: proxy, propertyName: "text" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_resizeToFitIcon_svg__WEBPACK_IMPORTED_MODULE_14__, label: "Automatically resize the text block to fit the size of the text" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_6__.CheckBoxLineComponent, { label: "RESIZE TO FIT", target: proxy, propertyName: "resizeToFit" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_wordWrapIcon_svg__WEBPACK_IMPORTED_MODULE_15__, label: "Text Wrapping" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_5__.OptionsLineComponent, { label: " ", options: wrappingOptions, target: proxy, propertyName: "textWrapping" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_LineSpacingIcon_svg__WEBPACK_IMPORTED_MODULE_16__, label: "Line Spacing" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_4__.TextInputLineComponent, { lockObject: this.props.lockObject, label: " ", target: proxy, propertyName: "lineSpacing" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("hr", {}), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_7__.TextLineComponent, { label: "OUTLINE", value: " ", color: "grey" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider double", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_strokeWeightIcon_svg__WEBPACK_IMPORTED_MODULE_17__, label: "Outline Width" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_11__.FloatLineComponent, { lockObject: this.props.lockObject, label: " ", target: proxy, propertyName: "outlineWidth", arrows: true, min: 0, unit: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_12__.UnitButton, { unit: "PX", locked: true }), step: "0.01" })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "ge-divider", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_10__.IconComponent, { icon: shared_ui_components_imgs_fillColorIcon_svg__WEBPACK_IMPORTED_MODULE_18__, label: "Outline Color" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_8__.ColorLineComponent, { lockObject: this.props.lockObject, label: " ", target: proxy, propertyName: "outlineColor" })] })] }));
|
|
53557
53551
|
}
|
|
53558
53552
|
}
|
|
53559
53553
|
|
|
@@ -53686,10 +53680,9 @@ class PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
53686
53680
|
});
|
|
53687
53681
|
};
|
|
53688
53682
|
this.saveToSnippetServer = async () => {
|
|
53689
|
-
var _a;
|
|
53690
53683
|
const adt = this.props.globalState.guiTexture;
|
|
53691
53684
|
const content = JSON.stringify(adt.serializeContent());
|
|
53692
|
-
const savePromise =
|
|
53685
|
+
const savePromise = this.props.globalState.customSave?.action || this.saveToSnippetServerHelper;
|
|
53693
53686
|
savePromise(content, adt)
|
|
53694
53687
|
.then((snippetId) => {
|
|
53695
53688
|
adt.snippetId = snippetId;
|
|
@@ -53774,9 +53767,8 @@ class PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
53774
53767
|
this.props.globalState.workbench.loadFromSnippet(snippedId);
|
|
53775
53768
|
}
|
|
53776
53769
|
renderNode(nodes) {
|
|
53777
|
-
var _a;
|
|
53778
53770
|
const node = nodes[0];
|
|
53779
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
53771
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { id: "header", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { id: "logo", src: this.renderControlIcon(nodes) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { id: "title", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_21__.TextInputLineComponent, { noUnderline: true, lockObject: this._lockObject, target: (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_26__.makeTargetsProxy)(nodes, this.props.globalState.onPropertyChangedObservable), propertyName: "name", onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }) })] }), this.renderProperties(nodes), node?.parent?.typeName === "Grid" && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_parentingPropertyGridComponent__WEBPACK_IMPORTED_MODULE_22__.ParentingPropertyGridComponent, { control: node, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, lockObject: this._lockObject }))] }));
|
|
53780
53772
|
}
|
|
53781
53773
|
/**
|
|
53782
53774
|
* returns the class name of a list of controls if they share a class, or an empty string if not
|
|
@@ -53888,7 +53880,7 @@ class PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
53888
53880
|
if (this.props.globalState.guiTexture == undefined)
|
|
53889
53881
|
return null;
|
|
53890
53882
|
const nodesToRender = this.props.globalState.selectedControls.length > 0 ? this.props.globalState.selectedControls : [this.props.globalState.workbench.trueRootContainer];
|
|
53891
|
-
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
53883
|
+
return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { id: "ge-propertyTab", children: this.renderNode(nodesToRender) });
|
|
53892
53884
|
}
|
|
53893
53885
|
}
|
|
53894
53886
|
|
|
@@ -53950,15 +53942,14 @@ class ControlTreeItemComponent extends react__WEBPACK_IMPORTED_MODULE_3__.Compon
|
|
|
53950
53942
|
this.props.globalState.onPropertyGridUpdateRequiredObservable.notifyObservers();
|
|
53951
53943
|
}
|
|
53952
53944
|
render() {
|
|
53953
|
-
var _a;
|
|
53954
53945
|
const control = this.props.control;
|
|
53955
53946
|
let bracket = "";
|
|
53956
|
-
if (
|
|
53947
|
+
if (control.parent?.typeName === "Grid") {
|
|
53957
53948
|
bracket = control.parent.getChildCellInfo(this.props.control);
|
|
53958
53949
|
}
|
|
53959
53950
|
const draggingSelf = this.props.globalState.draggedControl === control;
|
|
53960
53951
|
const controlType = _controlTypes__WEBPACK_IMPORTED_MODULE_6__.ControlTypes.find((type) => type.className === control.getClassName());
|
|
53961
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
53952
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "controlTools", children: [controlType && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "controlType icon", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: controlType.icon, alt: controlType.className }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_treeItemLabelComponent__WEBPACK_IMPORTED_MODULE_1__.TreeItemLabelComponent, { label: control.name, bracket: bracket, onClick: () => this.props.onClick(), onChange: (name) => this.onRename(name), setRenaming: (renaming) => this.setState({ isRenaming: renaming }), renaming: this.state.isRenaming }), !draggingSelf && this.props.isDragOver && this.props.dragOverLocation == _globalState__WEBPACK_IMPORTED_MODULE_4__.DragOverLocation.CENTER && control instanceof gui_2D_controls_container__WEBPACK_IMPORTED_MODULE_5__.Container && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "makeChild icon", onClick: () => this.highlight(), title: "Make Child", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _imgs_makeChildOfContainerIcon_svg__WEBPACK_IMPORTED_MODULE_10__ }) }) })), !this.state.isRenaming && this.props.isHovered && this.props.globalState.draggedControl === null && this.props.dragOverLocation == _globalState__WEBPACK_IMPORTED_MODULE_4__.DragOverLocation.NONE && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "addComponent icon", onClick: () => this.highlight(), title: "Add component (Not Implemented)", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _imgs_makeComponentIcon_svg__WEBPACK_IMPORTED_MODULE_9__ }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "visibility icon", onClick: () => this.switchVisibility(), title: "Show/Hide control", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.state.isVisible ? _imgs_visibilityActiveIcon_svg__WEBPACK_IMPORTED_MODULE_8__ : _imgs_visibilityNotActiveIcon_svg__WEBPACK_IMPORTED_MODULE_7__ }) })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_extensionsComponent__WEBPACK_IMPORTED_MODULE_2__.ExtensionsComponent, { target: control, extensibilityGroups: this.props.extensibilityGroups })] }));
|
|
53962
53953
|
}
|
|
53963
53954
|
}
|
|
53964
53955
|
|
|
@@ -54018,11 +54009,11 @@ class ExtensionsComponent extends react__WEBPACK_IMPORTED_MODULE_3__.Component {
|
|
|
54018
54009
|
if (options.length === 0) {
|
|
54019
54010
|
return null;
|
|
54020
54011
|
}
|
|
54021
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
54012
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { ref: this._extensionRef, className: "extensions", onClick: () => this.showPopup(), children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { title: "Additional options", className: "icon", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_1__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_2__.faEllipsisH }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { ref: (input) => {
|
|
54022
54013
|
this._popup = input;
|
|
54023
|
-
}, tabIndex: -1, className: this.state.popupVisible ? "popup show" : "popup", onBlur: () => this.setState({ popupVisible: false })
|
|
54024
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
54025
|
-
}) })
|
|
54014
|
+
}, tabIndex: -1, className: this.state.popupVisible ? "popup show" : "popup", onBlur: () => this.setState({ popupVisible: false }), children: options.map((extensibility) => {
|
|
54015
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "popupMenu", onClick: () => extensibility.action(this.props.target), children: extensibility.label }, extensibility.label));
|
|
54016
|
+
}) })] }));
|
|
54026
54017
|
}
|
|
54027
54018
|
}
|
|
54028
54019
|
|
|
@@ -54056,7 +54047,7 @@ class SceneExplorerFilterComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Co
|
|
|
54056
54047
|
super(props);
|
|
54057
54048
|
}
|
|
54058
54049
|
render() {
|
|
54059
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
54050
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "filter", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "text", placeholder: "Filter", onChange: (evt) => this.props.onFilter(evt.target.value) }) }));
|
|
54060
54051
|
}
|
|
54061
54052
|
}
|
|
54062
54053
|
class SceneExplorerComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
@@ -54207,7 +54198,7 @@ class SceneExplorerComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
54207
54198
|
return null;
|
|
54208
54199
|
}
|
|
54209
54200
|
const guiElements = scene.textures.filter((t) => t.getClassName() === "AdvancedDynamicTexture");
|
|
54210
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
54201
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { id: "tree", onDrop: () => {
|
|
54211
54202
|
this.props.globalState.onDropObservable.notifyObservers();
|
|
54212
54203
|
this.props.globalState.onParentingChangeObservable.notifyObservers(null);
|
|
54213
54204
|
}, onDragOver: (event) => {
|
|
@@ -54219,7 +54210,7 @@ class SceneExplorerComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
54219
54210
|
else {
|
|
54220
54211
|
this.props.globalState.selectionLock = false;
|
|
54221
54212
|
}
|
|
54222
|
-
}, onContextMenu: (ev) => ev.preventDefault()
|
|
54213
|
+
}, onContextMenu: (ev) => ev.preventDefault(), children: guiElements && guiElements.length > 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_treeItemComponent__WEBPACK_IMPORTED_MODULE_2__.TreeItemComponent, { globalState: this.props.globalState, extensibilityGroups: this.props.extensibilityGroups, selectedEntities: this.props.globalState.selectedControls, items: guiElements, label: "GUI", offset: 1, filter: this.state.filter })) }));
|
|
54223
54214
|
}
|
|
54224
54215
|
onClose() {
|
|
54225
54216
|
if (!this.props.onClose) {
|
|
@@ -54234,7 +54225,7 @@ class SceneExplorerComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
54234
54225
|
this.props.onPopup();
|
|
54235
54226
|
}
|
|
54236
54227
|
render() {
|
|
54237
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
54228
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { id: "ge-sceneExplorer", tabIndex: 0, onKeyDown: (keyEvent) => this.processKeys(keyEvent), children: [this.props.children, this.renderContent()] }));
|
|
54238
54229
|
}
|
|
54239
54230
|
}
|
|
54240
54231
|
|
|
@@ -54279,7 +54270,7 @@ class TreeItemExpandableHeaderComponent extends react__WEBPACK_IMPORTED_MODULE_1
|
|
|
54279
54270
|
}
|
|
54280
54271
|
render() {
|
|
54281
54272
|
const chevron = this.props.isExpanded ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _imgs_expandedIcon_svg__WEBPACK_IMPORTED_MODULE_7__, className: "icon" }) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _imgs_collapsedIcon_svg__WEBPACK_IMPORTED_MODULE_8__, className: "icon" });
|
|
54282
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
54273
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "expandableHeader", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "text", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "arrow icon", onClick: () => this.props.onClick(), children: chevron }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "text-value", children: this.props.label })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "expandAll icon", onClick: () => this.expandAll(), title: this.props.isExpanded ? "Collapse all" : "Expand all", children: chevron })] }));
|
|
54283
54274
|
}
|
|
54284
54275
|
}
|
|
54285
54276
|
class TreeItemRootHeaderComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
@@ -54287,7 +54278,7 @@ class TreeItemRootHeaderComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Com
|
|
|
54287
54278
|
super(props);
|
|
54288
54279
|
}
|
|
54289
54280
|
render() {
|
|
54290
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
54281
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "expandableHeader", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "text", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "arrow icon", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_2__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_3__.faBan }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "text-value", children: this.props.label })] }) }));
|
|
54291
54282
|
}
|
|
54292
54283
|
}
|
|
54293
54284
|
class TreeItemComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
@@ -54321,9 +54312,9 @@ class TreeItemComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
54321
54312
|
TreeItemComponent._ContextMenuUniqueIdGenerator++;
|
|
54322
54313
|
return null;
|
|
54323
54314
|
}
|
|
54324
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_contextmenu__WEBPACK_IMPORTED_MODULE_6__.ContextMenu,
|
|
54325
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_contextmenu__WEBPACK_IMPORTED_MODULE_6__.MenuItem,
|
|
54326
|
-
}) }))
|
|
54315
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_contextmenu__WEBPACK_IMPORTED_MODULE_6__.ContextMenu, { id: "contextmenu#" + TreeItemComponent._ContextMenuUniqueIdGenerator++, className: "context-menu", children: this.props.contextMenuItems.map((c) => {
|
|
54316
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_contextmenu__WEBPACK_IMPORTED_MODULE_6__.MenuItem, { onClick: () => c.action(), children: c.label }, c.label));
|
|
54317
|
+
}) }));
|
|
54327
54318
|
}
|
|
54328
54319
|
render() {
|
|
54329
54320
|
let items = this.props.items;
|
|
@@ -54335,14 +54326,14 @@ class TreeItemComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
54335
54326
|
items = [];
|
|
54336
54327
|
}
|
|
54337
54328
|
else {
|
|
54338
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
54329
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "groupContainer", style: marginStyle, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { children: this.props.label }) }));
|
|
54339
54330
|
}
|
|
54340
54331
|
}
|
|
54341
54332
|
if (!items.length) {
|
|
54342
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
54333
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "groupContainer", style: marginStyle, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_contextmenu__WEBPACK_IMPORTED_MODULE_6__.ContextMenuTrigger, { id: "contextmenu#" + TreeItemComponent._ContextMenuUniqueIdGenerator, children: [this.renderContextMenu(), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(TreeItemRootHeaderComponent, { label: this.props.label })] }) }));
|
|
54343
54334
|
}
|
|
54344
54335
|
if (!this.state.isExpanded) {
|
|
54345
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
54336
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "groupContainer", style: marginStyle, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_contextmenu__WEBPACK_IMPORTED_MODULE_6__.ContextMenuTrigger, { id: "contextmenu#" + TreeItemComponent._ContextMenuUniqueIdGenerator, children: [this.renderContextMenu(), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(TreeItemExpandableHeaderComponent, { isExpanded: false, label: this.props.label, onClick: () => this.switchExpandedState(), onExpandAll: (expand) => this.expandAll(expand) })] }) }));
|
|
54346
54337
|
}
|
|
54347
54338
|
const sortedItems = _tools__WEBPACK_IMPORTED_MODULE_5__.Tools.SortAndFilter(null, items)[0].getChildren();
|
|
54348
54339
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { children: sortedItems.map((item) => {
|
|
@@ -54389,16 +54380,16 @@ class TreeItemLabelComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
54389
54380
|
render() {
|
|
54390
54381
|
// if editing, overwrite string with local value
|
|
54391
54382
|
const label = this.props.renaming ? this.state.value : this.props.label || "No Name";
|
|
54392
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
54383
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "title", onClick: () => this.onClick(), children: this.props.renaming ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "text", onBlur: () => this.onBlur(), autoFocus: true, value: label, onChange: (ev) => {
|
|
54393
54384
|
this.props.onChange(ev.target.value);
|
|
54394
54385
|
this.setState({ value: ev.target.value });
|
|
54395
54386
|
}, onKeyDown: (ev) => {
|
|
54396
54387
|
if (ev.key === "Enter")
|
|
54397
54388
|
this.onBlur();
|
|
54398
|
-
}, className: "titleText" })) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
54389
|
+
}, className: "titleText" })) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "titleText", onDoubleClick: () => {
|
|
54399
54390
|
this.props.setRenaming(true);
|
|
54400
54391
|
this.setState({ value: label });
|
|
54401
|
-
}
|
|
54392
|
+
}, children: label })) }));
|
|
54402
54393
|
}
|
|
54403
54394
|
}
|
|
54404
54395
|
|
|
@@ -54560,7 +54551,7 @@ class TreeItemSelectableComponent extends react__WEBPACK_IMPORTED_MODULE_3__.Com
|
|
|
54560
54551
|
className += this.state.dragOver && this.state.dragOverLocation == _globalState__WEBPACK_IMPORTED_MODULE_4__.DragOverLocation.ABOVE && entity.parent ? " seAbove" : "";
|
|
54561
54552
|
className += this.state.dragOver && this.state.dragOverLocation == _globalState__WEBPACK_IMPORTED_MODULE_4__.DragOverLocation.BELOW && entity.parent ? " seBelow" : "";
|
|
54562
54553
|
const styleName = className === "itemContainer seAbove" || className === "itemContainer seBelow" ? lineMarginStyle : marginStyle;
|
|
54563
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
54554
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: className, style: styleName, onPointerUp: () => {
|
|
54564
54555
|
this.onSelect();
|
|
54565
54556
|
}, onPointerEnter: () => this.setState({ isHovered: true }), onPointerLeave: () => this.setState({ isHovered: false }), onDragStart: () => {
|
|
54566
54557
|
this.props.globalState.draggedControl = this.props.entity;
|
|
@@ -54581,7 +54572,7 @@ class TreeItemSelectableComponent extends react__WEBPACK_IMPORTED_MODULE_3__.Com
|
|
|
54581
54572
|
else {
|
|
54582
54573
|
this.setState({ dragOver: false });
|
|
54583
54574
|
}
|
|
54584
|
-
}
|
|
54575
|
+
}, children: [hasChildren && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "arrow icon", onClick: (event) => {
|
|
54585
54576
|
this.switchExpandedState();
|
|
54586
54577
|
if (event.shiftKey) {
|
|
54587
54578
|
while (hasChildren) {
|
|
@@ -54595,7 +54586,7 @@ class TreeItemSelectableComponent extends react__WEBPACK_IMPORTED_MODULE_3__.Com
|
|
|
54595
54586
|
entity.reservedDataStore.isExpanded = true;
|
|
54596
54587
|
}
|
|
54597
54588
|
}
|
|
54598
|
-
}
|
|
54589
|
+
}, children: chevron })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_entities_gui_controlTreeItemComponent__WEBPACK_IMPORTED_MODULE_5__.ControlTreeItemComponent, { globalState: this.props.globalState, extensibilityGroups: this.props.extensibilityGroups, control: entity, onClick: () => { }, isHovered: this.state.isHovered, isDragOver: this.state.dragOver, dragOverLocation: this.state.dragOverLocation })] }), this.renderChildren(isExpanded)] }));
|
|
54599
54590
|
}
|
|
54600
54591
|
dragOver(event) {
|
|
54601
54592
|
this.updateDragOverLocation(event);
|
|
@@ -55064,7 +55055,7 @@ class CoordinateHelper {
|
|
|
55064
55055
|
const ratio = property === "left" || property === "width" || property === "paddingLeft" || property === "paddingRight" ? ratioX : ratioY;
|
|
55065
55056
|
const newValue = (guiControl[`${property}InPixels`] * 100) / ratio;
|
|
55066
55057
|
guiControl[property] = `${newValue.toFixed(2)}%`;
|
|
55067
|
-
onPropertyChangedObservable
|
|
55058
|
+
onPropertyChangedObservable?.notifyObservers({
|
|
55068
55059
|
object: guiControl,
|
|
55069
55060
|
initialValue,
|
|
55070
55061
|
value: guiControl[property],
|
|
@@ -55076,13 +55067,12 @@ class CoordinateHelper {
|
|
|
55076
55067
|
return Math.floor(value * 100) / 100;
|
|
55077
55068
|
}
|
|
55078
55069
|
static ConvertToPixels(guiControl, properties = ["left", "top", "width", "height"], onPropertyChangedObservable) {
|
|
55079
|
-
var _a;
|
|
55080
55070
|
// make sure we are using the latest measures for the control
|
|
55081
|
-
guiControl._processMeasures(
|
|
55071
|
+
guiControl._processMeasures(guiControl.parent?._currentMeasure, guiControl.host);
|
|
55082
55072
|
for (const property of properties) {
|
|
55083
55073
|
const initialValue = guiControl[property];
|
|
55084
55074
|
guiControl[`_${property}`] = new gui_2D_valueAndUnit__WEBPACK_IMPORTED_MODULE_0__.ValueAndUnit(this.Round(guiControl[`${property}InPixels`]), gui_2D_valueAndUnit__WEBPACK_IMPORTED_MODULE_0__.ValueAndUnit.UNITMODE_PIXEL);
|
|
55085
|
-
onPropertyChangedObservable
|
|
55075
|
+
onPropertyChangedObservable?.notifyObservers({
|
|
55086
55076
|
object: guiControl,
|
|
55087
55077
|
initialValue,
|
|
55088
55078
|
value: guiControl[property],
|
|
@@ -55426,7 +55416,7 @@ class GizmoGeneric extends react__WEBPACK_IMPORTED_MODULE_3__.Component {
|
|
|
55426
55416
|
}
|
|
55427
55417
|
}
|
|
55428
55418
|
render() {
|
|
55429
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
55419
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "gizmo", children: [lines.map((line, index) => {
|
|
55430
55420
|
const start = this.state.scalePoints[line[0]];
|
|
55431
55421
|
const end = this.state.scalePoints[line[1]];
|
|
55432
55422
|
// the vector between start and end
|
|
@@ -55439,7 +55429,7 @@ class GizmoGeneric extends react__WEBPACK_IMPORTED_MODULE_3__.Component {
|
|
|
55439
55429
|
width: `${length}px`,
|
|
55440
55430
|
transform: `translate(-50%, -50%) rotate(${angle}rad)`,
|
|
55441
55431
|
} }, index));
|
|
55442
|
-
}), this.state.scalePoints.map((scalePoint, index) => ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gizmoScalePoint__WEBPACK_IMPORTED_MODULE_5__.GizmoScalePoint, { clickable: this.state.scalePointDragging === -1 && !scalePoint.isPivot && !this.state.isRotating, scalePoint: scalePoint, onDrag: () => this._beginDraggingScalePoint(index), onRotate: () => this._beginRotate(), onUp: () => this._onUp(), canRotate: true }, index)))] }))
|
|
55432
|
+
}), this.state.scalePoints.map((scalePoint, index) => ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gizmoScalePoint__WEBPACK_IMPORTED_MODULE_5__.GizmoScalePoint, { clickable: this.state.scalePointDragging === -1 && !scalePoint.isPivot && !this.state.isRotating, scalePoint: scalePoint, onDrag: () => this._beginDraggingScalePoint(index), onRotate: () => this._beginRotate(), onUp: () => this._onUp(), canRotate: true }, index)))] }));
|
|
55443
55433
|
}
|
|
55444
55434
|
}
|
|
55445
55435
|
|
|
@@ -55502,10 +55492,14 @@ function GizmoLine(props) {
|
|
|
55502
55492
|
const position = positions[index];
|
|
55503
55493
|
const rtt = _coordinateHelper__WEBPACK_IMPORTED_MODULE_3__.CoordinateHelper.NodeToRTTSpace(control, position.x, position.y);
|
|
55504
55494
|
const canvas = _coordinateHelper__WEBPACK_IMPORTED_MODULE_3__.CoordinateHelper.RttToCanvasSpace(rtt.x, rtt.y);
|
|
55505
|
-
return
|
|
55495
|
+
return {
|
|
55496
|
+
...point,
|
|
55497
|
+
position: canvas,
|
|
55498
|
+
rotation: control.rotation,
|
|
55499
|
+
};
|
|
55506
55500
|
}));
|
|
55507
55501
|
};
|
|
55508
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
55502
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "gizmo", children: scalePoints.map((point, index) => ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_gizmoScalePoint__WEBPACK_IMPORTED_MODULE_2__.GizmoScalePoint, { scalePoint: point, clickable: true, onDrag: () => { }, onRotate: () => { }, onUp: () => { }, overrideCursor: "not-allowed", canRotate: false }, index))) }));
|
|
55509
55503
|
}
|
|
55510
55504
|
|
|
55511
55505
|
|
|
@@ -55610,7 +55604,7 @@ function GizmoScalePoint(props) {
|
|
|
55610
55604
|
left: (scalePointContainerSize - scaleClickAreaSize) / 2 - scaleClickAreaOffset * scalePoint.horizontalPosition,
|
|
55611
55605
|
cursor,
|
|
55612
55606
|
};
|
|
55613
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
55607
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { style: style, className: "scale-point-container", children: [canRotate && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "rotate-click-area", onPointerDown: onRotate, style: rotateClickAreaStyle }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "scale-click-area", draggable: true, onDragStart: (evt) => evt.preventDefault(), onPointerDown: (event) => {
|
|
55614
55608
|
// if left mouse button down
|
|
55615
55609
|
if (event.buttons & 1) {
|
|
55616
55610
|
onDrag();
|
|
@@ -55619,7 +55613,7 @@ function GizmoScalePoint(props) {
|
|
|
55619
55613
|
if (event.buttons & 1) {
|
|
55620
55614
|
onDrag();
|
|
55621
55615
|
}
|
|
55622
|
-
}, onPointerUp: onUp, style: { cursor } })] }))
|
|
55616
|
+
}, onPointerUp: onUp, style: { cursor } })] }));
|
|
55623
55617
|
}
|
|
55624
55618
|
|
|
55625
55619
|
|
|
@@ -55875,7 +55869,7 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
55875
55869
|
}
|
|
55876
55870
|
// sets the size of the GUI and makes all necessary adjustments
|
|
55877
55871
|
set guiSize(value) {
|
|
55878
|
-
this._guiSize =
|
|
55872
|
+
this._guiSize = { ...value };
|
|
55879
55873
|
this._visibleRegionContainer.widthInPixels = this._guiSize.width;
|
|
55880
55874
|
this._visibleRegionContainer.heightInPixels = this._guiSize.height;
|
|
55881
55875
|
this.props.globalState.onResizeObservable.notifyObservers(this._guiSize);
|
|
@@ -55933,7 +55927,6 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
55933
55927
|
this.props.globalState.deleteSelectedNodes();
|
|
55934
55928
|
}
|
|
55935
55929
|
pasteFromClipboard(clipboardContents) {
|
|
55936
|
-
var _a;
|
|
55937
55930
|
try {
|
|
55938
55931
|
const parsed = JSON.parse(clipboardContents);
|
|
55939
55932
|
if (parsed.GUIClipboard) {
|
|
@@ -55941,7 +55934,7 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
55941
55934
|
for (const control of parsed.controls) {
|
|
55942
55935
|
newSelection.push(gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.Parse(control, this.props.globalState.guiTexture));
|
|
55943
55936
|
}
|
|
55944
|
-
if (
|
|
55937
|
+
if (newSelection[0].parent?.typeName != "StackPanel") {
|
|
55945
55938
|
this._currLeft += CONTROL_OFFSET;
|
|
55946
55939
|
this._currTop += CONTROL_OFFSET;
|
|
55947
55940
|
}
|
|
@@ -55952,14 +55945,13 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
55952
55945
|
return true;
|
|
55953
55946
|
}
|
|
55954
55947
|
}
|
|
55955
|
-
catch
|
|
55948
|
+
catch {
|
|
55956
55949
|
// don't need an error message
|
|
55957
55950
|
}
|
|
55958
55951
|
core_Maths_math_vector__WEBPACK_IMPORTED_MODULE_4__.Logger.Warn("Paste attempted, but clipboard content was invalid.");
|
|
55959
55952
|
return false;
|
|
55960
55953
|
}
|
|
55961
55954
|
CopyGUIControl(original) {
|
|
55962
|
-
var _a, _b;
|
|
55963
55955
|
const serializationObject = {};
|
|
55964
55956
|
original.serialize(serializationObject);
|
|
55965
55957
|
const newControl = gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.Parse(serializationObject, this.props.globalState.guiTexture);
|
|
@@ -55967,12 +55959,12 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
55967
55959
|
//insert the new control into the adt or parent container
|
|
55968
55960
|
this.props.globalState.workbench.appendBlock(newControl);
|
|
55969
55961
|
this.props.globalState.guiTexture.removeControl(newControl);
|
|
55970
|
-
if (
|
|
55962
|
+
if (original.parent?.typeName === "Grid") {
|
|
55971
55963
|
const cell = _tools__WEBPACK_IMPORTED_MODULE_5__.Tools.GetCellInfo(original.parent, original);
|
|
55972
55964
|
original.parent.addControl(newControl, cell.x, cell.y);
|
|
55973
55965
|
}
|
|
55974
55966
|
else {
|
|
55975
|
-
|
|
55967
|
+
original.parent?.addControl(newControl);
|
|
55976
55968
|
}
|
|
55977
55969
|
let index = 1;
|
|
55978
55970
|
while (this.props.globalState.guiTexture.getDescendants(false).filter(
|
|
@@ -56096,11 +56088,10 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
56096
56088
|
this._engine.dispose();
|
|
56097
56089
|
}
|
|
56098
56090
|
loadFromJson(serializationObject) {
|
|
56099
|
-
var _a;
|
|
56100
56091
|
this.removeEditorTransformation();
|
|
56101
56092
|
this.props.globalState.setSelection([]);
|
|
56102
56093
|
if (this.props.globalState.liveGuiTexture) {
|
|
56103
|
-
|
|
56094
|
+
this.props.globalState.liveGuiTexture?.parseContent(serializationObject, true);
|
|
56104
56095
|
this.synchronizeLiveGUI();
|
|
56105
56096
|
}
|
|
56106
56097
|
else {
|
|
@@ -56111,11 +56102,10 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
56111
56102
|
this.loadToEditor();
|
|
56112
56103
|
}
|
|
56113
56104
|
async loadFromSnippet(snippetId) {
|
|
56114
|
-
var _a;
|
|
56115
56105
|
this.removeEditorTransformation();
|
|
56116
56106
|
this.props.globalState.setSelection([]);
|
|
56117
56107
|
if (this.props.globalState.liveGuiTexture) {
|
|
56118
|
-
await
|
|
56108
|
+
await this.props.globalState.liveGuiTexture?.parseFromSnippetAsync(snippetId, true);
|
|
56119
56109
|
this.synchronizeLiveGUI();
|
|
56120
56110
|
}
|
|
56121
56111
|
else {
|
|
@@ -56145,14 +56135,13 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
56145
56135
|
}
|
|
56146
56136
|
}
|
|
56147
56137
|
appendBlock(guiElement) {
|
|
56148
|
-
var _a;
|
|
56149
56138
|
if (this.props.globalState.liveGuiTexture) {
|
|
56150
56139
|
this.props.globalState.liveGuiTexture.addControl(guiElement);
|
|
56151
56140
|
}
|
|
56152
56141
|
this.addEditorBehavior(guiElement);
|
|
56153
56142
|
guiElement.getDescendants(true).forEach((desc) => this.addEditorBehavior(desc));
|
|
56154
56143
|
if (this.props.globalState.selectedControls.length != 0) {
|
|
56155
|
-
|
|
56144
|
+
this.props.globalState.selectedControls[0].parent?.addControl(guiElement);
|
|
56156
56145
|
}
|
|
56157
56146
|
else {
|
|
56158
56147
|
this.trueRootContainer.addControl(guiElement);
|
|
@@ -56161,7 +56150,7 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
56161
56150
|
}
|
|
56162
56151
|
parent(dropLocationControl) {
|
|
56163
56152
|
const draggedControl = this.props.globalState.draggedControl;
|
|
56164
|
-
const draggedControlParent = draggedControl
|
|
56153
|
+
const draggedControlParent = draggedControl?.parent;
|
|
56165
56154
|
if (draggedControlParent && draggedControl) {
|
|
56166
56155
|
if (this._isNotChildInsert(dropLocationControl, draggedControl)) {
|
|
56167
56156
|
//checking to make sure the element is not being inserted into a child
|
|
@@ -56240,7 +56229,7 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
56240
56229
|
_tools__WEBPACK_IMPORTED_MODULE_5__.Tools.ReorderGrid(grid, index, draggedControl, cellInfo);
|
|
56241
56230
|
}
|
|
56242
56231
|
_isNotChildInsert(control, draggedControl) {
|
|
56243
|
-
while (control
|
|
56232
|
+
while (control?.parent) {
|
|
56244
56233
|
if (control.parent == draggedControl) {
|
|
56245
56234
|
return false;
|
|
56246
56235
|
}
|
|
@@ -56382,9 +56371,8 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
56382
56371
|
}
|
|
56383
56372
|
}
|
|
56384
56373
|
onDown(evt) {
|
|
56385
|
-
var _a;
|
|
56386
56374
|
this._pointerTravelDistance = 0;
|
|
56387
|
-
|
|
56375
|
+
this._rootContainer.current?.setPointerCapture(evt.pointerId);
|
|
56388
56376
|
if (this.props.globalState.tool === _globalState__WEBPACK_IMPORTED_MODULE_2__.GUIEditorTool.SELECT) {
|
|
56389
56377
|
this._mouseStartPoint = this.getScaledPointerPosition();
|
|
56390
56378
|
}
|
|
@@ -56411,10 +56399,9 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
56411
56399
|
}
|
|
56412
56400
|
}
|
|
56413
56401
|
onUp(evt) {
|
|
56414
|
-
var _a;
|
|
56415
56402
|
this._mouseStartPoint = null;
|
|
56416
56403
|
this._constraintDirection = ConstraintDirection.NONE;
|
|
56417
|
-
|
|
56404
|
+
this._rootContainer.current?.releasePointerCapture(evt.pointerId);
|
|
56418
56405
|
this._panning = false;
|
|
56419
56406
|
if (this._processSelectionOnUp) {
|
|
56420
56407
|
if (Math.sqrt(this._pointerTravelDistance) <= MAX_POINTER_TRAVEL_DISTANCE) {
|
|
@@ -56487,16 +56474,14 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
56487
56474
|
this._liveGuiTextureRerender = true;
|
|
56488
56475
|
});
|
|
56489
56476
|
this._liveRenderObserver = this.props.globalState.liveGuiTexture.onEndRenderObservable.add(() => {
|
|
56490
|
-
var _a;
|
|
56491
56477
|
// return the GUI to the editor mode
|
|
56492
|
-
|
|
56478
|
+
this.props.globalState.guiTexture?.markAsDirty();
|
|
56493
56479
|
this._liveGuiTextureRerender = false;
|
|
56494
56480
|
});
|
|
56495
56481
|
this._scene.onAfterRenderObservable.add(() => {
|
|
56496
|
-
var _a;
|
|
56497
56482
|
if (this._nextLiveGuiRender > 0 && Date.now() > this._nextLiveGuiRender) {
|
|
56498
56483
|
this._nextLiveGuiRender = -1;
|
|
56499
|
-
|
|
56484
|
+
this.props.globalState.liveGuiTexture?.markAsDirty();
|
|
56500
56485
|
}
|
|
56501
56486
|
});
|
|
56502
56487
|
}
|
|
@@ -56512,8 +56497,7 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
56512
56497
|
if (this.props.globalState.liveGuiTexture) {
|
|
56513
56498
|
this._trueRootContainer.getDescendants().forEach((desc) => desc.dispose());
|
|
56514
56499
|
this.props.globalState.liveGuiTexture.rootContainer.getDescendants(true).forEach((desc) => {
|
|
56515
|
-
|
|
56516
|
-
(_a = this.props.globalState.liveGuiTexture) === null || _a === void 0 ? void 0 : _a.removeControl(desc);
|
|
56500
|
+
this.props.globalState.liveGuiTexture?.removeControl(desc);
|
|
56517
56501
|
this.appendBlock(desc);
|
|
56518
56502
|
});
|
|
56519
56503
|
this.props.globalState.guiTexture.snippetId = this.props.globalState.liveGuiTexture.snippetId;
|
|
@@ -56768,20 +56752,19 @@ class GlobalState {
|
|
|
56768
56752
|
};
|
|
56769
56753
|
this.hostDocument.addEventListener("copy", (event) => {
|
|
56770
56754
|
if (!isElementEditable(event.target)) {
|
|
56771
|
-
this.onCopyObservable.notifyObservers((content) =>
|
|
56755
|
+
this.onCopyObservable.notifyObservers((content) => event.clipboardData?.setData("text/plain", content));
|
|
56772
56756
|
event.preventDefault();
|
|
56773
56757
|
}
|
|
56774
56758
|
});
|
|
56775
56759
|
this.hostDocument.addEventListener("cut", (event) => {
|
|
56776
56760
|
if (!isElementEditable(event.target)) {
|
|
56777
|
-
this.onCutObservable.notifyObservers((content) =>
|
|
56761
|
+
this.onCutObservable.notifyObservers((content) => event.clipboardData?.setData("text/plain", content));
|
|
56778
56762
|
event.preventDefault();
|
|
56779
56763
|
}
|
|
56780
56764
|
});
|
|
56781
56765
|
this.hostDocument.addEventListener("paste", (event) => {
|
|
56782
|
-
var _a;
|
|
56783
56766
|
if (!isElementEditable(event.target)) {
|
|
56784
|
-
this.onPasteObservable.notifyObservers(
|
|
56767
|
+
this.onPasteObservable.notifyObservers(event.clipboardData?.getData("text") || "");
|
|
56785
56768
|
event.preventDefault();
|
|
56786
56769
|
}
|
|
56787
56770
|
});
|
|
@@ -56852,16 +56835,16 @@ class GlobalState {
|
|
|
56852
56835
|
deleteSelectedNodes() {
|
|
56853
56836
|
for (const control of this.selectedControls) {
|
|
56854
56837
|
const guiTextureParent = this._findParentControlInTexture(this.guiTexture, control);
|
|
56855
|
-
guiTextureParent
|
|
56838
|
+
guiTextureParent?.removeControl(control);
|
|
56856
56839
|
if (this.liveGuiTexture) {
|
|
56857
56840
|
const allDescendants = control.getDescendants();
|
|
56858
56841
|
for (const descendant of allDescendants) {
|
|
56859
56842
|
const liveGuiTextureDescendantParent = this._findParentControlInTexture(this.liveGuiTexture, descendant);
|
|
56860
|
-
liveGuiTextureDescendantParent
|
|
56843
|
+
liveGuiTextureDescendantParent?.removeControl(descendant);
|
|
56861
56844
|
descendant.dispose();
|
|
56862
56845
|
}
|
|
56863
56846
|
const liveGuiTextureParent = this._findParentControlInTexture(this.liveGuiTexture, control);
|
|
56864
|
-
liveGuiTextureParent
|
|
56847
|
+
liveGuiTextureParent?.removeControl(control);
|
|
56865
56848
|
}
|
|
56866
56849
|
control.dispose();
|
|
56867
56850
|
}
|
|
@@ -57603,12 +57586,10 @@ class WorkbenchEditor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
57603
57586
|
}
|
|
57604
57587
|
}
|
|
57605
57588
|
showWaitScreen() {
|
|
57606
|
-
|
|
57607
|
-
(_a = this.props.globalState.hostDocument.querySelector(".wait-screen")) === null || _a === void 0 ? void 0 : _a.classList.remove("hidden");
|
|
57589
|
+
this.props.globalState.hostDocument.querySelector(".wait-screen")?.classList.remove("hidden");
|
|
57608
57590
|
}
|
|
57609
57591
|
hideWaitScreen() {
|
|
57610
|
-
|
|
57611
|
-
(_a = this.props.globalState.hostDocument.querySelector(".wait-screen")) === null || _a === void 0 ? void 0 : _a.classList.add("hidden");
|
|
57592
|
+
this.props.globalState.hostDocument.querySelector(".wait-screen")?.classList.add("hidden");
|
|
57612
57593
|
}
|
|
57613
57594
|
onPointerDown(evt) {
|
|
57614
57595
|
if (evt.button !== 0)
|
|
@@ -57653,13 +57634,13 @@ class WorkbenchEditor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
57653
57634
|
}
|
|
57654
57635
|
render() {
|
|
57655
57636
|
const classForElement = this.state.toolbarExpand ? "left-panel" : "left-panel expand";
|
|
57656
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_portal__WEBPACK_IMPORTED_MODULE_4__.Portal,
|
|
57637
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_portal__WEBPACK_IMPORTED_MODULE_4__.Portal, { globalState: this.props.globalState, children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { id: "ge-header", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "command-bar", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_commandBarComponent__WEBPACK_IMPORTED_MODULE_11__.CommandBarComponent, { globalState: this.props.globalState }) }) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { id: "gui-editor-workbench-root", style: {
|
|
57657
57638
|
gridTemplateColumns: this.buildColumnLayout(),
|
|
57658
57639
|
}, onMouseDown: (evt) => {
|
|
57659
57640
|
if (evt.target.nodeName === "INPUT") {
|
|
57660
57641
|
return;
|
|
57661
57642
|
}
|
|
57662
|
-
}, ref: this._rootRef, onPointerUp: (evt) => this.onPointerUp(evt)
|
|
57643
|
+
}, ref: this._rootRef, onPointerUp: (evt) => this.onPointerUp(evt), children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: classForElement, children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_sceneExplorer_sceneExplorerComponent__WEBPACK_IMPORTED_MODULE_10__.SceneExplorerComponent, { globalState: this.props.globalState, noExpand: true }), this.createToolbar(), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { id: "leftGrab", onPointerDown: (evt) => this.onPointerDown(evt), onPointerMove: (evt) => this.resizeColumns(evt) })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_sceneExplorer_sceneExplorerComponent__WEBPACK_IMPORTED_MODULE_10__.SceneExplorerComponent, { globalState: this.props.globalState, noExpand: true }), this.createToolbar(), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "diagram-container", onDrop: (event) => {
|
|
57663
57644
|
event.preventDefault();
|
|
57664
57645
|
this.props.globalState.onDropObservable.notifyObservers();
|
|
57665
57646
|
this.props.globalState.onParentingChangeObservable.notifyObservers(null);
|
|
@@ -57667,7 +57648,7 @@ class WorkbenchEditor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
57667
57648
|
event.preventDefault();
|
|
57668
57649
|
}, style: {
|
|
57669
57650
|
backgroundColor: this.props.globalState.backgroundColor.toHexString(),
|
|
57670
|
-
}
|
|
57651
|
+
}, children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_diagram_artBoard__WEBPACK_IMPORTED_MODULE_13__.ArtBoardComponent, { globalState: this.props.globalState }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_diagram_workbench__WEBPACK_IMPORTED_MODULE_8__.WorkbenchComponent, { ref: "workbenchCanvas", globalState: this.props.globalState }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_diagram_gizmoWrapper__WEBPACK_IMPORTED_MODULE_12__.GizmoWrapper, { globalState: this.props.globalState })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "right-panel", children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { id: "rightGrab", onPointerDown: (evt) => this.onPointerDown(evt), onPointerMove: (evt) => this.resizeColumns(evt, false) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_propertyTab_propertyTabComponent__WEBPACK_IMPORTED_MODULE_3__.PropertyTabComponent, { globalState: this.props.globalState })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_log_logComponent__WEBPACK_IMPORTED_MODULE_5__.LogComponent, { globalState: this.props.globalState })] }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_components_MessageDialog__WEBPACK_IMPORTED_MODULE_9__.MessageDialog, { message: this.state.message, isError: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "blocker", children: "GUI Editor runs only on desktop" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "wait-screen hidden", children: "Processing...please wait" })] }));
|
|
57671
57652
|
}
|
|
57672
57653
|
onCreate(value) {
|
|
57673
57654
|
const guiElement = _guiNodeTools__WEBPACK_IMPORTED_MODULE_7__.GUINodeTools.CreateControlFromString(value);
|
|
@@ -57679,23 +57660,23 @@ class WorkbenchEditor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
57679
57660
|
}
|
|
57680
57661
|
createBlackLine() {
|
|
57681
57662
|
const icon = this.state.toolbarExpand ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _imgs_toolbarExpandIcon_svg__WEBPACK_IMPORTED_MODULE_17__, className: "icon" }) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _imgs_toolbarCollapseIcon_svg__WEBPACK_IMPORTED_MODULE_18__, className: "icon" });
|
|
57682
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
57663
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "blackLine", children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "arrow", onClick: () => this.switchExpandedState(), children: icon }) }));
|
|
57683
57664
|
}
|
|
57684
57665
|
createToolbarHelper(ct) {
|
|
57685
57666
|
return ct.map((type) => {
|
|
57686
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div",
|
|
57667
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "toolbar-label", onDragStart: () => {
|
|
57687
57668
|
this._draggedItem = type.className;
|
|
57688
57669
|
}, onClick: () => {
|
|
57689
57670
|
this.onCreate(type.className);
|
|
57690
|
-
}, title: type.className
|
|
57671
|
+
}, title: type.className, children: type.icon && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "toolbar-icon", draggable: true, children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: type.icon, alt: type.className, width: "40px", height: "40px" }) })) }, type.className));
|
|
57691
57672
|
});
|
|
57692
57673
|
}
|
|
57693
57674
|
createToolbar() {
|
|
57694
57675
|
if (this.state.toolbarExpand) {
|
|
57695
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
57676
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "toolbarGrab", children: [this.createBlackLine(), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "toolbar-content-sub1", children: this.createToolbarHelper(_controlTypes__WEBPACK_IMPORTED_MODULE_14__.ControlTypes) })] }) }));
|
|
57696
57677
|
}
|
|
57697
57678
|
else {
|
|
57698
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div",
|
|
57679
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "toolbarGrab expanded", children: [this.createBlackLine(), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: "toolbar-content-sub1", children: [this.createToolbarHelper(_controlTypes__WEBPACK_IMPORTED_MODULE_14__.ControlTypes.slice(0, Math.ceil(_controlTypes__WEBPACK_IMPORTED_MODULE_14__.ControlTypes.length / 2))), this.createToolbarHelper(_controlTypes__WEBPACK_IMPORTED_MODULE_14__.ControlTypes.slice(Math.ceil(_controlTypes__WEBPACK_IMPORTED_MODULE_14__.ControlTypes.length / 2)))] })] }) }));
|
|
57699
57680
|
}
|
|
57700
57681
|
}
|
|
57701
57682
|
}
|
|
@@ -58660,6 +58641,17 @@ module.exports = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGlu
|
|
|
58660
58641
|
|
|
58661
58642
|
/***/ }),
|
|
58662
58643
|
|
|
58644
|
+
/***/ "../../../dev/sharedUiComponents/dist/imgs/linkedMeshOffsetIcon.svg":
|
|
58645
|
+
/*!**************************************************************************!*\
|
|
58646
|
+
!*** ../../../dev/sharedUiComponents/dist/imgs/linkedMeshOffsetIcon.svg ***!
|
|
58647
|
+
\**************************************************************************/
|
|
58648
|
+
/***/ ((module) => {
|
|
58649
|
+
|
|
58650
|
+
"use strict";
|
|
58651
|
+
module.exports = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIGlkPSJpY29ucyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMzAiIGhlaWdodD0iMzAiIHZpZXdCb3g9IjAgMCAzMCAzMCI+PGRlZnM+PHN0eWxlPi5jbHMtMXtmaWxsOiMzMzM7fTwvc3R5bGU+PC9kZWZzPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTE4LjE3LDE4LjUxYy0xLjIxLDAtMi4xOSwuOTgtMi4xOSwyLjE5cy45OCwyLjE5LDIuMTksMi4xOWguNDRjLjI0LDAsLjQ0LS4yLC40NC0uNDRzLS4yLS40NC0uNDQtLjQ0aC0uNDRjLS43MywwLTEuMzItLjU5LTEuMzItMS4zMnMuNTktMS4zMiwxLjMyLTEuMzJoLjQ0Yy4yNCwwLC40NC0uMiwuNDQtLjQ0cy0uMi0uNDQtLjQ0LS40NGgtLjQ0Wm0zLjA3LDBjLS4yNCwwLS40NCwuMi0uNDQsLjQ0cy4yLC40NCwuNDQsLjQ0aC40NGMuNzMsMCwxLjMyLC41OSwxLjMyLDEuMzJzLS41OSwxLjMyLTEuMzIsMS4zMmgtLjQ0Yy0uMjQsMC0uNDQsLjItLjQ0LC40NHMuMiwuNDQsLjQ0LC40NGguNDRjMS4yMSwwLDIuMTktLjk4LDIuMTktMi4xOXMtLjk4LTIuMTktMi4xOS0yLjE5aC0uNDRabS0zLjA3LDEuNzZjLS4yNCwwLS40NCwuMi0uNDQsLjQ0cy4yLC40NCwuNDQsLjQ0aDMuNTFjLjI0LDAsLjQ0LS4yLC40NC0uNDRzLS4yLS40NC0uNDQtLjQ0aC0zLjUxWiIvPjxnPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTIxLjYxLDE0LjRoLTQuNTljLS4zMywwLS42MSwuMjctLjYxLC42MXMuMjcsLjYxLC42MSwuNjFoNC41OWwtLjU4LC41OGMtLjI0LC4yNC0uMjQsLjYyLDAsLjg2LC4yNCwuMjQsLjYyLC4yNCwuODYsMGwxLjYxLTEuNjFjLjI0LS4yNCwuMjQtLjYyLDAtLjg2bC0xLjYxLTEuNjFjLS4yNC0uMjQtLjYyLS4yNC0uODYsMC0uMjQsLjI0LS4yNCwuNjIsMCwuODZsLjU4LC41OFoiLz48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0xNS4wMSwyMC43MWMwLS41NywuMTgtMS4wOSwuNDctMS41NHYtMi4wNWMwLS4zMy0uMjctLjYxLS42MS0uNjFzLS42LC4yNy0uNiwuNjF2NC41OWwtLjU4LS41OGMtLjI0LS4yNC0uNjItLjI0LS44NiwwLS4yNCwuMjQtLjI0LC42MiwwLC44NmwxLjYxLDEuNjFjLjI0LC4yNCwuNjIsLjI0LC44NiwwbC43Mi0uNzJjLS42Mi0uNTQtMS4wMS0xLjMxLTEuMDEtMi4xN1oiLz48cGF0aCBjbGFzcz0iY2xzLTEiIGQ9Ik0xMy42OCw4Ljg3bC41OC0uNTh2NC41OWMwLC4zMywuMjcsLjYxLC42LC42MXMuNjEtLjI3LC42MS0uNjF2LTQuNTlsLjU4LC41OGMuMjQsLjI0LC42MiwuMjQsLjg2LDAsLjI0LS4yNCwuMjQtLjYyLDAtLjg2bC0xLjYxLTEuNjFjLS4yNC0uMjQtLjYyLS4yNC0uODYsMGwtMS42MSwxLjYxYy0uMjQsLjI0LS4yNCwuNjIsMCwuODYsLjI0LC4yNCwuNjIsLjI0LC44NiwwWiIvPjxwYXRoIGNsYXNzPSJjbHMtMSIgZD0iTTguMTksMTUuNjFoNC41OWMuMzMsMCwuNjEtLjI3LC42MS0uNjFzLS4yNy0uNjEtLjYxLS42MWgtNC41OWwuNTgtLjU4Yy4yNC0uMjQsLjI0LS42MiwwLS44Ni0uMjQtLjI0LS42Mi0uMjQtLjg2LDBsLTEuNjEsMS42MWMtLjI0LC4yNC0uMjQsLjYyLDAsLjg2bDEuNjEsMS42MWMuMjQsLjI0LC42MiwuMjQsLjg2LDAsLjI0LS4yNCwuMjQtLjYyLDAtLjg2bC0uNTgtLjU4WiIvPjwvZz48L3N2Zz4=";
|
|
58652
|
+
|
|
58653
|
+
/***/ }),
|
|
58654
|
+
|
|
58663
58655
|
/***/ "../../../dev/sharedUiComponents/dist/imgs/marginsIcon.svg":
|
|
58664
58656
|
/*!*****************************************************************!*\
|
|
58665
58657
|
!*** ../../../dev/sharedUiComponents/dist/imgs/marginsIcon.svg ***!
|