@babylonjs/gui-editor 5.24.0 → 5.26.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.
@@ -87,7 +87,7 @@ __webpack_require__.r(__webpack_exports__);
87
87
 
88
88
  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()));
89
89
  // Module
90
- ___CSS_LOADER_EXPORT___.push([module.id, ":root {\n --backgroundGrey: #aaaaaa;\n --spacingHeight: 30px;\n --button: #333333;\n --buttonBackground: #ffffff;\n --buttonDisabledBackground: #c8c8c8;\n --buttonPressed: #ffffff;\n --buttonPressedBackground: #606060;\n --buttonHoverBackground: #afafaf; }\n\n#ge-propertyTab {\n user-select: none;\n color: black;\n background: #e2e2e2; }\n #ge-propertyTab * {\n font-family: \"acumin-pro-condensed\", sans-serif;\n font-size: 12px; }\n #ge-propertyTab #header {\n height: 32px;\n font-size: 16px;\n color: white;\n background: white;\n grid-row: 1;\n text-align: center;\n display: grid;\n grid-template-columns: 30px 1fr;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none; }\n #ge-propertyTab #header #logo {\n position: relative;\n grid-column: 1;\n width: 32px;\n height: 32px;\n left: 0;\n display: flex;\n align-self: center;\n justify-self: center;\n filter: invert(1); }\n #ge-propertyTab #header #title {\n background: white;\n color: black;\n grid-column: 2;\n display: grid;\n align-items: center;\n text-align: center; }\n #ge-propertyTab .range {\n -webkit-appearance: none;\n width: 100%;\n height: 2px;\n background: #bcbcbc;\n border-radius: 5px;\n outline: none;\n opacity: 0.7;\n -webkit-transition: 0.2s;\n transition: opacity 0.2s;\n padding: 0; }\n #ge-propertyTab .range:hover {\n opacity: 1; }\n #ge-propertyTab .range::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: #e2e2e2;\n border: solid;\n border-width: thin;\n cursor: pointer; }\n #ge-propertyTab .range::-moz-range-thumb {\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: black;\n cursor: pointer; }\n #ge-propertyTab input[type=\"color\"] {\n -webkit-appearance: none;\n border: 1px solid rgba(255, 255, 255, 0.5);\n padding: 0;\n width: 30px;\n height: 20px; }\n #ge-propertyTab input[type=\"color\"]::-webkit-color-swatch-wrapper {\n padding: 0; }\n #ge-propertyTab input[type=\"color\"]::-webkit-color-swatch {\n border: none; }\n #ge-propertyTab hr {\n border: 1px solid #d0cece; }\n #ge-propertyTab .icon {\n width: 30px;\n height: 30px; }\n #ge-propertyTab .unit {\n width: 26px;\n height: 26px;\n color: var(--button);\n background-color: var(--buttonBackground);\n border: none;\n margin-top: 2px;\n cursor: pointer;\n margin-left: 2px;\n font-family: \"atten-round-new\", sans-serif;\n font-weight: 500;\n font-style: normal;\n display: flex;\n justify-content: center;\n align-items: center; }\n #ge-propertyTab .unit:disabled {\n background-color: var(--buttonDisabledBackground);\n cursor: not-allowed; }\n #ge-propertyTab .unit:not(:disabled):hover {\n background-color: var(--buttonHoverBackground); }\n #ge-propertyTab .unit:not(:disabled):active {\n color: var(--buttonPressed);\n background-color: var(--buttonPressedBackground); }\n #ge-propertyTab input,\n #ge-propertyTab select {\n outline-style: solid;\n outline-width: 0px;\n outline-color: transparent;\n outline-offset: -1px;\n outline-width: 1px;\n transition: outline-color 0.2s;\n border: transparent;\n padding-left: 5px; }\n #ge-propertyTab input:focus,\n #ge-propertyTab select:focus {\n outline-width: 1px;\n outline-color: black; }\n #ge-propertyTab .hasArrows input::-webkit-outer-spin-button,\n #ge-propertyTab .hasArrows input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n #ge-propertyTab .hasArrows input[type=\"number\"] {\n -moz-appearance: textfield; }\n #ge-propertyTab .sliderLine {\n height: var(--spacingHeight);\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: auto 1fr 20px 1fr;\n flex-grow: 1; }\n #ge-propertyTab .sliderLine .label {\n grid-column: 1;\n display: flex;\n align-items: center;\n min-width: 15px;\n font-weight: 600; }\n #ge-propertyTab .sliderLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .sliderLine .slider {\n grid-column: 4;\n grid-row: 1;\n margin-right: 5px;\n display: flex;\n align-items: center;\n padding-left: 5px; }\n #ge-propertyTab .sliderLine .floatLine {\n grid-column: 2;\n padding-left: 0px;\n grid-template-columns: 1fr auto; }\n #ge-propertyTab .sliderLine .floatLine .label {\n grid-column: 1;\n display: none;\n align-items: center;\n font-weight: 600; }\n #ge-propertyTab .sliderLine .floatLine .short {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .sliderLine .floatLine .short input {\n width: 100%;\n background-color: white;\n height: 24px; }\n #ge-propertyTab .sliderLine .floatLine .short input::-webkit-outer-spin-button,\n #ge-propertyTab .sliderLine .floatLine .short input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n #ge-propertyTab .sliderLine .floatLine .short input[type=\"number\"] {\n -webkit-appearance: textfield;\n -moz-appearance: textfield;\n appearance: textfield; }\n #ge-propertyTab .ge-divider {\n padding-right: 18px;\n padding-left: 5px;\n display: grid;\n grid-template-columns: auto 1fr;\n padding-top: 1px;\n padding-bottom: 1px; }\n #ge-propertyTab .ge-divider.double {\n display: grid;\n grid-template-columns: auto 1fr 5px 1fr; }\n #ge-propertyTab .ge-divider.double > .textInputLine:first-of-type,\n #ge-propertyTab .ge-divider.double > .floatLine:first-of-type {\n grid-column: 2; }\n #ge-propertyTab .ge-divider.double > .textInputLine:nth-of-type(2),\n #ge-propertyTab .ge-divider.double > .floatLine:nth-of-type(2) {\n grid-column: 4; }\n #ge-propertyTab .ge-grid-divider {\n display: grid;\n grid-template-columns: 150px 1fr auto; }\n #ge-propertyTab .ge-grid-divider .textLine {\n grid-column: auto; }\n #ge-propertyTab .ge-grid-button-divider {\n display: grid;\n grid-template-columns: 60px 60px 60px 60px; }\n #ge-propertyTab .ge-grid-remove {\n display: grid;\n background-color: #c2c2c2;\n margin-bottom: 5px;\n filter: invert(1); }\n #ge-propertyTab .ge-grid-edit {\n display: grid;\n background-color: #878787;\n margin-bottom: 5px;\n filter: invert(1); }\n #ge-propertyTab .ge-grid {\n display: grid;\n margin-bottom: 5px; }\n #ge-propertyTab .ge-divider.double .textInputLine {\n grid-template-columns: auto auto 1fr auto; }\n #ge-propertyTab .textInputLine,\n #ge-propertyTab .floatLine {\n user-select: none;\n padding-bottom: 0px;\n padding-top: 0px;\n height: var(--spacingHeight);\n display: grid;\n grid-template-columns: auto auto 1fr;\n flex-grow: 1; }\n #ge-propertyTab .textInputLine .label,\n #ge-propertyTab .floatLine .label {\n grid-column: 2;\n display: flex;\n align-items: center;\n min-width: 15px;\n font-weight: 600; }\n #ge-propertyTab .textInputLine img,\n #ge-propertyTab .floatLine img {\n width: 30px; }\n #ge-propertyTab .textInputLine .img,\n #ge-propertyTab .floatLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .textInputLine .value,\n #ge-propertyTab .floatLine .value {\n display: flex;\n align-items: center;\n grid-column: 3;\n background: transparent;\n height: 26px;\n position: relative;\n background-color: white;\n margin-top: 2px;\n overflow-y: hidden; }\n #ge-propertyTab .textInputLine .value input,\n #ge-propertyTab .floatLine .value input {\n width: 100%;\n height: 24px;\n color: #333333; }\n #ge-propertyTab .textInputLine .value input.hasArrows,\n #ge-propertyTab .floatLine .value input.hasArrows {\n padding-right: 15px; }\n #ge-propertyTab .textInputLine .value .arrows,\n #ge-propertyTab .floatLine .value .arrows {\n display: none;\n position: absolute;\n right: 0;\n flex-direction: column;\n cursor: grab; }\n #ge-propertyTab .textInputLine .value .arrows .downArrowIcon,\n #ge-propertyTab .textInputLine .value .arrows .upArrowIcon,\n #ge-propertyTab .floatLine .value .arrows .downArrowIcon,\n #ge-propertyTab .floatLine .value .arrows .upArrowIcon {\n width: 13px;\n height: 13px; }\n #ge-propertyTab .textInputLine .value:hover .arrows,\n #ge-propertyTab .textInputLine .value:focus .arrows,\n #ge-propertyTab .textInputLine .value.dragging .arrows,\n #ge-propertyTab .floatLine .value:hover .arrows,\n #ge-propertyTab .floatLine .value:focus .arrows,\n #ge-propertyTab .floatLine .value.dragging .arrows {\n display: flex; }\n #ge-propertyTab .textInputLine .value .arrows:hover,\n #ge-propertyTab .floatLine .value .arrows:hover {\n background-color: var(--buttonHoverBackground); }\n #ge-propertyTab .textInputLine .value.dragging .arrows,\n #ge-propertyTab .floatLine .value.dragging .arrows {\n background-color: var(--buttonPressedBackground); }\n #ge-propertyTab .textInputLine .value.dragging .arrows .downArrowIcon,\n #ge-propertyTab .textInputLine .value.dragging .arrows .upArrowIcon,\n #ge-propertyTab .floatLine .value.dragging .arrows .downArrowIcon,\n #ge-propertyTab .floatLine .value.dragging .arrows .upArrowIcon {\n filter: brightness(10); }\n #ge-propertyTab .textInputLine.withUnits {\n grid-template-columns: auto auto 1fr auto; }\n #ge-propertyTab .textInputArea {\n height: 100%;\n display: grid;\n grid-template-columns: 1fr 120px; }\n #ge-propertyTab .textInputArea .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .textInputArea .value {\n display: flex;\n align-items: center;\n grid-column: 2; }\n #ge-propertyTab .textInputArea .value textarea {\n width: calc(150% - 5px);\n margin-left: -50%;\n height: 40px; }\n #ge-propertyTab .paneContainer {\n margin-top: 3px;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%; }\n #ge-propertyTab .paneContainer .paneList {\n border-left: 3px solid transparent; }\n #ge-propertyTab .paneContainer:hover .paneList {\n border-left: 3px solid rgba(51, 122, 183, 0.8); }\n #ge-propertyTab .paneContainer:hover .paneContainer-content .header .title {\n border-left: 3px solid #337ab7; }\n #ge-propertyTab .paneContainer .paneContainer-highlight-border {\n grid-row: 1;\n grid-column: 1;\n opacity: 1;\n border: 3px solid red;\n transition: opacity 250ms;\n pointer-events: none; }\n #ge-propertyTab .paneContainer .paneContainer-highlight-border.transparent {\n opacity: 0; }\n #ge-propertyTab .paneContainer .paneContainer-content {\n grid-row: 1;\n grid-column: 1; }\n #ge-propertyTab .paneContainer .paneContainer-content .header {\n display: grid;\n grid-template-columns: 1fr auto;\n background: #cccccc;\n height: var(--spacingHeight);\n padding-bottom: 0px;\n padding-top: 0px;\n padding-right: 5px;\n cursor: pointer; }\n #ge-propertyTab .paneContainer .paneContainer-content .header .title {\n border-left: 3px solid transparent;\n padding-left: 5px;\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .paneContainer .paneContainer-content .header .collapse {\n grid-column: 2;\n display: flex;\n align-items: center;\n justify-items: center;\n transform-origin: center; }\n #ge-propertyTab .paneContainer .paneContainer-content .header .collapse.closed {\n transform: rotate(180deg); }\n #ge-propertyTab .paneContainer .paneContainer-content .paneList > div:not(:last-child) {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1); }\n #ge-propertyTab .paneContainer .paneContainer-content .fragment > div:not(:last-child) {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1); }\n #ge-propertyTab .color-picker {\n height: 26px;\n width: 26px; }\n #ge-propertyTab .color-picker .color-rect-background {\n width: calc(100% - 2px);\n height: calc(100% - 2px);\n border: 1px black solid;\n cursor: pointer;\n background: repeating-conic-gradient(#e2e2e2 0% 25%, white 0% 50%) 50%/100% 100%; }\n #ge-propertyTab .color-picker .color-rect-background .color-rect {\n height: 100%; }\n #ge-propertyTab .color-picker .color-picker-cover {\n z-index: 2;\n position: fixed;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px; }\n #ge-propertyTab .color-picker .color-picker-float {\n position: absolute;\n outline: 1px solid black; }\n #ge-propertyTab .color-picker .color-picker-container {\n background-color: #e2e2e2; }\n #ge-propertyTab .gradient-step {\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 20px 30px 40px auto 20px 30px;\n padding-top: 5px;\n padding-left: 5px;\n padding-bottom: 5px; }\n #ge-propertyTab .gradient-step .step {\n grid-row: 1;\n grid-column: 1; }\n #ge-propertyTab .gradient-step .color {\n grid-row: 1;\n grid-column: 2;\n cursor: pointer; }\n #ge-propertyTab .gradient-step .step-value {\n margin-left: 5px;\n grid-row: 1;\n grid-column: 3;\n text-align: right;\n margin-right: 5px; }\n #ge-propertyTab .gradient-step .step-slider {\n grid-row: 1;\n grid-column: 4;\n display: grid;\n justify-content: stretch;\n align-content: center;\n margin-right: -5px;\n padding-left: 12px; }\n #ge-propertyTab .gradient-step .step-slider input {\n width: 90%; }\n #ge-propertyTab .gradient-step .gradient-copy {\n grid-row: 1;\n grid-column: 5;\n display: grid;\n align-content: center;\n justify-content: center; }\n #ge-propertyTab .gradient-step .gradient-copy .img {\n height: 20px;\n width: 20px; }\n #ge-propertyTab .gradient-step .gradient-copy .img:hover {\n cursor: pointer; }\n #ge-propertyTab .gradient-step .gradient-delete {\n grid-row: 1;\n grid-column: 6;\n display: grid;\n align-content: center;\n justify-content: center; }\n #ge-propertyTab .gradient-step .gradient-delete .img {\n height: 20px;\n width: 20px; }\n #ge-propertyTab .gradient-step .gradient-delete .img:hover {\n cursor: pointer; }\n #ge-propertyTab .alignment-bar {\n display: flex;\n justify-content: center;\n padding-right: 5px; }\n #ge-propertyTab .command-button {\n cursor: pointer;\n width: 30px; }\n #ge-propertyTab .command-button .command-label {\n display: none; }\n #ge-propertyTab .command-button .command-button-icon {\n height: 100%;\n width: 100%;\n display: grid;\n color: white;\n align-content: center;\n justify-content: center; }\n #ge-propertyTab .command-button:hover {\n background-color: white; }\n #ge-propertyTab .command-button .active {\n transform-origin: center;\n background-color: white; }\n #ge-propertyTab .command-button img.active {\n background-color: white; }\n #ge-propertyTab .command-button.disabled {\n background-color: var(--buttonDisabledBackground);\n pointer-events: none; }\n #ge-propertyTab .command-button-alt {\n cursor: pointer;\n width: 40px;\n margin-left: 5px;\n margin-right: 5px;\n background-color: white; }\n #ge-propertyTab .command-button-alt .command-label {\n display: none; }\n #ge-propertyTab .command-button-alt .command-button-icon {\n height: 100%;\n width: 100%;\n display: grid;\n align-content: center;\n justify-content: center; }\n #ge-propertyTab .command-button-alt:hover {\n background-color: #c2c2c2;\n filter: invert(1); }\n #ge-propertyTab .command-button-alt-disabled {\n cursor: pointer;\n pointer-events: none;\n width: 40px;\n margin-left: 5px;\n margin-right: 5px;\n background-color: white; }\n #ge-propertyTab .command-button-alt-disabled .command-label {\n display: none; }\n #ge-propertyTab .command-button-alt-disabled .command-button-icon {\n height: 100%;\n width: 100%;\n display: grid;\n align-content: center;\n justify-content: center; }\n #ge-propertyTab .command-button-alt-disabled img {\n filter: invert(1); }\n #ge-propertyTab .command-button-alt-active {\n cursor: pointer;\n pointer-events: none;\n width: 40px;\n margin-left: 5px;\n margin-right: 5px;\n background-color: #c2c2c2;\n filter: invert(1); }\n #ge-propertyTab .command-button-alt-active .command-label {\n display: none; }\n #ge-propertyTab .command-button-alt-active .command-button-icon {\n height: 100%;\n width: 100%;\n display: grid;\n align-content: center;\n justify-content: center; }\n #ge-propertyTab .floatLine {\n user-select: none;\n height: var(--spacingHeight);\n padding-bottom: 0px;\n padding-top: 0px;\n display: grid;\n grid-template-columns: auto auto 2fr auto;\n flex-grow: 1; }\n #ge-propertyTab .floatLine .label {\n grid-column: 2;\n display: flex;\n align-items: center;\n min-width: 15px;\n font-weight: 600; }\n #ge-propertyTab .floatLine img {\n width: 30px; }\n #ge-propertyTab .floatLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .floatLine .value {\n display: flex;\n align-items: center;\n grid-column: 3;\n background: transparent;\n height: 26px; }\n #ge-propertyTab .floatLine .value input {\n width: 100%;\n background-color: white;\n height: 24px; }\n #ge-propertyTab .floatLine .short {\n grid-column: 2;\n display: flex;\n align-items: center; }\n #ge-propertyTab .floatLine .short input {\n width: 100%; }\n #ge-propertyTab .floatLine .short input::-webkit-outer-spin-button,\n #ge-propertyTab .floatLine .short input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n #ge-propertyTab .floatLine .short input[type=\"number\"] {\n -moz-appearance: textfield; }\n #ge-propertyTab .vector3Line {\n padding-bottom: 0px;\n padding-top: 0px;\n display: grid; }\n #ge-propertyTab .vector3Line .firstLine {\n display: grid;\n grid-template-columns: 1fr auto 20px;\n height: var(--spacingHeight); }\n #ge-propertyTab .vector3Line .firstLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .vector3Line .firstLine .vector {\n grid-column: 2;\n display: flex;\n align-items: center;\n text-align: right;\n opacity: 0.8; }\n #ge-propertyTab .vector3Line .firstLine .expand {\n grid-column: 3;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #ge-propertyTab .vector3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n #ge-propertyTab .vector3Line .secondLine .no-right-margin {\n margin-right: 0; }\n #ge-propertyTab .vector3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n #ge-propertyTab .vector3Line .secondLine .numeric-label {\n text-align: right;\n grid-column: 1;\n display: flex;\n align-items: center;\n justify-self: right;\n margin-right: 10px; }\n #ge-propertyTab .vector3Line .secondLine .numeric-value {\n width: 120px;\n grid-column: 2;\n display: flex;\n align-items: center;\n border: 1px solid #337ab7; }\n #ge-propertyTab .buttonLine {\n height: var(--spacingHeight);\n padding-bottom: 0px;\n padding-top: 0px;\n display: grid;\n align-items: center;\n justify-items: stretch;\n padding-bottom: 5px; }\n #ge-propertyTab .buttonLine input[type=\"file\"] {\n display: none; }\n #ge-propertyTab .buttonLine .file-upload {\n background: var(--backgroundGrey);\n border: 1px solid #424242;\n margin: 5px 10px;\n color: white;\n padding: 4px 5px;\n opacity: 0.9;\n cursor: pointer;\n text-align: center;\n border-radius: 4px; }\n #ge-propertyTab .buttonLine .file-upload:hover {\n opacity: 1; }\n #ge-propertyTab .buttonLine .file-upload:active {\n transform: scale(0.98);\n transform-origin: 0.5 0.5; }\n #ge-propertyTab .buttonLine button {\n background: var(--backgroundGrey);\n border: 1px solid #424242;\n margin: 5px 10px 5px 10px;\n color: white;\n padding: 4px 5px;\n opacity: 0.9;\n border-radius: 4px; }\n #ge-propertyTab .buttonLine button:hover {\n opacity: 1; }\n #ge-propertyTab .buttonLine button:active {\n background: #282828; }\n #ge-propertyTab .buttonLine button:focus {\n border: 1px solid #424242;\n outline: 0px; }\n #ge-propertyTab .numeric {\n padding-bottom: 0px;\n padding-top: 0px;\n height: var(--spacingHeight);\n display: grid;\n grid-template-columns: 1fr 120px auto; }\n #ge-propertyTab .numeric .numeric-label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .numeric .number {\n display: flex;\n align-items: center;\n grid-column: 2;\n height: 10px; }\n #ge-propertyTab .numeric .number .input {\n width: calc(100% - 5px);\n height: 10px; }\n #ge-propertyTab .checkBoxLine {\n padding-bottom: 0px;\n padding-top: 0px;\n height: var(--spacingHeight);\n display: grid;\n grid-template-columns: auto 1fr auto;\n flex-grow: 1; }\n #ge-propertyTab .checkBoxLine .label {\n grid-column: 2;\n display: flex;\n align-items: center;\n min-width: 100px;\n margin-left: 15px;\n height: var(--spacingHeight);\n font-weight: 600; }\n #ge-propertyTab .checkBoxLine img {\n width: 30px; }\n #ge-propertyTab .checkBoxLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .checkBoxLine .hidden {\n display: none; }\n #ge-propertyTab .listLine {\n padding-bottom: 0px;\n padding-top: 0px;\n height: var(--spacingHeight);\n display: grid;\n grid-template-columns: auto 1fr auto;\n flex-grow: 1; }\n #ge-propertyTab .listLine .label {\n grid-column: 2;\n display: none;\n align-items: center; }\n #ge-propertyTab .listLine img {\n width: 30px; }\n #ge-propertyTab .listLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .listLine .options {\n grid-column: 2;\n padding-left: 15px;\n display: flex;\n align-items: center; }\n #ge-propertyTab .listLine .options select {\n width: 100%;\n height: 25px;\n border: transparent; }\n #ge-propertyTab .color3Line {\n padding-left: 15px;\n padding-bottom: 0px;\n padding-top: 0px;\n display: grid;\n flex-grow: 1; }\n #ge-propertyTab .color3Line .firstLine {\n height: var(--spacingHeight);\n display: flex;\n align-items: center; }\n #ge-propertyTab .color3Line .firstLine .label {\n grid-column: 2;\n padding-left: 5px;\n display: none;\n align-items: center;\n min-width: 15px; }\n #ge-propertyTab .color3Line .firstLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .color3Line .firstLine img {\n width: 30px;\n height: 30px; }\n #ge-propertyTab .color3Line .firstLine .textInputLine {\n grid-column: 3;\n padding-left: 2px;\n flex-grow: 1; }\n #ge-propertyTab .color3Line .firstLine .color3 {\n display: flex;\n align-items: center; }\n #ge-propertyTab .color3Line .firstLine .color3 input {\n margin-right: 5px; }\n #ge-propertyTab .color3Line .firstLine .copy {\n grid-column: 4;\n display: none;\n align-items: center;\n justify-items: center;\n cursor: pointer;\n color: black; }\n #ge-propertyTab .color3Line .firstLine .copy img {\n height: 100%;\n width: 20px; }\n #ge-propertyTab .color3Line .firstLine .expand {\n grid-column: 4;\n display: none;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #ge-propertyTab .color3Line .firstLine .expand img {\n height: 100%;\n width: 20px; }\n #ge-propertyTab .color3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n #ge-propertyTab .color3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n #ge-propertyTab .color3Line .secondLine .numeric-label {\n text-align: right;\n grid-column: 1;\n display: flex;\n align-items: center;\n justify-self: right;\n margin-right: 10px; }\n #ge-propertyTab .color3Line .secondLine .numeric-value {\n width: 120px;\n grid-column: 2;\n display: flex;\n align-items: center;\n border: 1px solid #337ab7; }\n #ge-propertyTab .textLine {\n padding-left: 5px;\n padding-bottom: 0px;\n padding-top: 0px;\n padding-right: 18px;\n height: auto;\n display: grid;\n grid-template-columns: auto auto 2fr 1fr; }\n #ge-propertyTab .textLine .label {\n grid-column: 2;\n padding-left: 5px;\n padding-top: 4px;\n display: flex;\n align-items: left;\n min-width: 15px;\n color: #a9a9a9;\n font-size: 10px;\n font-family: \"acumin-pro-semi-condensed\", sans-serif;\n font-weight: 600; }\n #ge-propertyTab .textLine img {\n width: 30px; }\n #ge-propertyTab .textLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .textLine .link-value {\n grid-column: 2;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n text-align: end;\n opacity: 0.8;\n margin: 5px;\n margin-top: 6px;\n max-width: 140px;\n text-decoration: underline;\n cursor: pointer; }\n #ge-propertyTab .textLine .value {\n display: none;\n grid-column: 3;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n text-align: end;\n opacity: 0.8;\n margin: 5px;\n margin-top: 6px;\n max-width: 200px;\n -webkit-user-select: text;\n -moz-user-select: text;\n -ms-user-select: text;\n user-select: text; }\n #ge-propertyTab .textLine .value.check {\n color: green; }\n #ge-propertyTab .textLine .value.uncheck {\n color: red; }\n", "",{"version":3,"sources":["webpack://./../../../tools/guiEditor/dist/components/propertyTab/propertyTab.scss"],"names":[],"mappings":"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","sourcesContent":[":root {\r\n --backgroundGrey: #aaaaaa;\r\n --spacingHeight: 30px;\r\n --button: #333333;\r\n --buttonBackground: #ffffff;\r\n --buttonDisabledBackground: #c8c8c8;\r\n --buttonPressed: #ffffff;\r\n --buttonPressedBackground: #606060;\r\n --buttonHoverBackground: #afafaf;\r\n}\r\n\r\n#ge-propertyTab {\r\n user-select: none;\r\n $line-padding-left: 5px;\r\n $line-padding-bottom: 0px;\r\n $line-padding-top: 0px;\r\n $line-padding-right: 18px;\r\n color: black;\r\n background: #e2e2e2;\r\n * {\r\n font-family: \"acumin-pro-condensed\", sans-serif;\r\n font-size: 12px;\r\n }\r\n #header {\r\n height: 32px;\r\n font-size: 16px;\r\n color: white;\r\n background: white;\r\n grid-row: 1;\r\n text-align: center;\r\n display: grid;\r\n grid-template-columns: 30px 1fr;\r\n -webkit-user-select: none;\r\n -moz-user-select: none;\r\n -ms-user-select: none;\r\n user-select: none;\r\n\r\n #logo {\r\n position: relative;\r\n grid-column: 1;\r\n width: 32px;\r\n height: 32px;\r\n left: 0;\r\n display: flex;\r\n align-self: center;\r\n justify-self: center;\r\n filter: invert(1);\r\n }\r\n\r\n #title {\r\n background: white;\r\n color: black;\r\n grid-column: 2;\r\n display: grid;\r\n align-items: center;\r\n text-align: center;\r\n }\r\n }\r\n\r\n .range {\r\n -webkit-appearance: none;\r\n width: 100%;\r\n height: 2px;\r\n background: #bcbcbc;\r\n border-radius: 5px;\r\n outline: none;\r\n opacity: 0.7;\r\n -webkit-transition: 0.2s;\r\n transition: opacity 0.2s;\r\n padding: 0;\r\n }\r\n\r\n .range:hover {\r\n opacity: 1;\r\n }\r\n\r\n .range::-webkit-slider-thumb {\r\n -webkit-appearance: none;\r\n appearance: none;\r\n width: 14px;\r\n height: 14px;\r\n border-radius: 50%;\r\n background: #e2e2e2;\r\n border: solid;\r\n border-width: thin;\r\n cursor: pointer;\r\n }\r\n\r\n .range::-moz-range-thumb {\r\n width: 14px;\r\n height: 14px;\r\n border-radius: 50%;\r\n background: rgb(0, 0, 0);\r\n cursor: pointer;\r\n }\r\n\r\n input[type=\"color\"] {\r\n -webkit-appearance: none;\r\n border: 1px solid rgba(255, 255, 255, 0.5);\r\n padding: 0;\r\n width: 30px;\r\n height: 20px;\r\n }\r\n input[type=\"color\"]::-webkit-color-swatch-wrapper {\r\n padding: 0;\r\n }\r\n input[type=\"color\"]::-webkit-color-swatch {\r\n border: none;\r\n }\r\n\r\n hr {\r\n border: 1px solid #d0cece;\r\n }\r\n\r\n .icon {\r\n width: 30px;\r\n height: 30px;\r\n }\r\n\r\n .unit {\r\n width: 26px;\r\n height: 26px;\r\n color: var(--button);\r\n background-color: var(--buttonBackground);\r\n border: none;\r\n margin-top: 2px;\r\n cursor: pointer;\r\n margin-left: 2px;\r\n font-family: \"atten-round-new\", sans-serif;\r\n font-weight: 500;\r\n font-style: normal;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n }\r\n\r\n .unit:disabled {\r\n background-color: var(--buttonDisabledBackground);\r\n cursor: not-allowed;\r\n }\r\n\r\n .unit:not(:disabled):hover {\r\n background-color: var(--buttonHoverBackground);\r\n }\r\n\r\n .unit:not(:disabled):active {\r\n color: var(--buttonPressed);\r\n background-color: var(--buttonPressedBackground);\r\n }\r\n\r\n input,\r\n select {\r\n outline-style: solid;\r\n outline-width: 0px;\r\n outline-color: transparent;\r\n outline-offset: -1px;\r\n outline-width: 1px;\r\n transition: outline-color 0.2s;\r\n border: transparent;\r\n padding-left: 5px;\r\n &:focus {\r\n outline-width: 1px;\r\n outline-color: black;\r\n }\r\n }\r\n\r\n .hasArrows input::-webkit-outer-spin-button,\r\n .hasArrows input::-webkit-inner-spin-button {\r\n -webkit-appearance: none;\r\n margin: 0;\r\n }\r\n\r\n .hasArrows input[type=\"number\"] {\r\n -moz-appearance: textfield;\r\n }\r\n\r\n .sliderLine {\r\n height: var(--spacingHeight);\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: auto 1fr 20px 1fr;\r\n flex-grow: 1;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n min-width: 15px;\r\n font-weight: 600;\r\n }\r\n\r\n .img {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .slider {\r\n grid-column: 4;\r\n grid-row: 1;\r\n margin-right: 5px;\r\n display: flex;\r\n align-items: center;\r\n padding-left: 5px;\r\n }\r\n\r\n .floatLine {\r\n grid-column: 2;\r\n padding-left: 0px;\r\n grid-template-columns: 1fr auto;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: none;\r\n align-items: center;\r\n font-weight: 600;\r\n }\r\n\r\n .short {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n width: 100%;\r\n background-color: white;\r\n height: 24px;\r\n }\r\n\r\n input::-webkit-outer-spin-button,\r\n input::-webkit-inner-spin-button {\r\n -webkit-appearance: none;\r\n margin: 0;\r\n }\r\n\r\n input[type=\"number\"] {\r\n -webkit-appearance: textfield;\r\n -moz-appearance: textfield;\r\n appearance: textfield;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .ge-divider {\r\n padding-right: $line-padding-right;\r\n padding-left: 5px;\r\n display: grid;\r\n grid-template-columns: auto 1fr;\r\n padding-top: 1px;\r\n padding-bottom: 1px;\r\n }\r\n .ge-divider.double {\r\n display: grid;\r\n grid-template-columns: auto 1fr 5px 1fr;\r\n > .textInputLine,\r\n > .floatLine {\r\n &:first-of-type {\r\n grid-column: 2;\r\n }\r\n &:nth-of-type(2) {\r\n grid-column: 4;\r\n }\r\n }\r\n }\r\n .ge-grid-divider {\r\n display: grid;\r\n grid-template-columns: 150px 1fr auto;\r\n\r\n .textLine {\r\n grid-column: auto;\r\n }\r\n }\r\n\r\n .ge-grid-button-divider {\r\n display: grid;\r\n grid-template-columns: 60px 60px 60px 60px;\r\n }\r\n\r\n .ge-grid-remove {\r\n display: grid;\r\n background-color: #c2c2c2;\r\n margin-bottom: 5px;\r\n filter: invert(1);\r\n }\r\n\r\n .ge-grid-edit {\r\n display: grid;\r\n background-color: #878787;\r\n margin-bottom: 5px;\r\n filter: invert(1);\r\n }\r\n\r\n .ge-grid {\r\n display: grid;\r\n margin-bottom: 5px;\r\n }\r\n\r\n .ge-divider.double .textInputLine {\r\n grid-template-columns: auto auto 1fr auto;\r\n }\r\n\r\n .textInputLine,\r\n .floatLine {\r\n user-select: none;\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n height: var(--spacingHeight);\r\n display: grid;\r\n grid-template-columns: auto auto 1fr;\r\n flex-grow: 1;\r\n .label {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n min-width: 15px;\r\n font-weight: 600;\r\n }\r\n\r\n img {\r\n width: 30px;\r\n }\r\n\r\n .img {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .value {\r\n display: flex;\r\n align-items: center;\r\n grid-column: 3;\r\n background: transparent;\r\n height: 26px;\r\n position: relative;\r\n background-color: white;\r\n margin-top: 2px;\r\n overflow-y: hidden;\r\n input {\r\n width: 100%;\r\n height: 24px;\r\n color: #333333;\r\n }\r\n input.hasArrows {\r\n padding-right: 15px;\r\n }\r\n .arrows {\r\n display: none;\r\n position: absolute;\r\n right: 0;\r\n flex-direction: column;\r\n cursor: grab;\r\n .downArrowIcon,\r\n .upArrowIcon {\r\n width: 13px;\r\n height: 13px;\r\n }\r\n }\r\n &:hover .arrows,\r\n &:focus .arrows,\r\n &.dragging .arrows {\r\n display: flex;\r\n }\r\n .arrows:hover {\r\n background-color: var(--buttonHoverBackground);\r\n }\r\n &.dragging .arrows {\r\n background-color: var(--buttonPressedBackground);\r\n .downArrowIcon,\r\n .upArrowIcon {\r\n filter: brightness(10);\r\n }\r\n }\r\n }\r\n }\r\n\r\n .textInputLine.withUnits {\r\n grid-template-columns: auto auto 1fr auto;\r\n }\r\n\r\n .textInputArea {\r\n height: 100%;\r\n display: grid;\r\n grid-template-columns: 1fr 120px;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .value {\r\n display: flex;\r\n align-items: center;\r\n grid-column: 2;\r\n\r\n textarea {\r\n width: calc(150% - 5px);\r\n margin-left: -50%;\r\n height: 40px;\r\n }\r\n }\r\n }\r\n\r\n .paneContainer {\r\n margin-top: 3px;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 100%;\r\n\r\n .paneList {\r\n border-left: 3px solid transparent;\r\n }\r\n\r\n &:hover {\r\n .paneList {\r\n border-left: 3px solid rgba(51, 122, 183, 0.8);\r\n }\r\n\r\n .paneContainer-content {\r\n .header {\r\n .title {\r\n border-left: 3px solid rgb(51, 122, 183);\r\n }\r\n }\r\n }\r\n }\r\n\r\n .paneContainer-highlight-border {\r\n grid-row: 1;\r\n grid-column: 1;\r\n opacity: 1;\r\n border: 3px solid red;\r\n transition: opacity 250ms;\r\n pointer-events: none;\r\n\r\n &.transparent {\r\n opacity: 0;\r\n }\r\n }\r\n\r\n .paneContainer-content {\r\n grid-row: 1;\r\n grid-column: 1;\r\n\r\n .header {\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n background: #cccccc;\r\n height: var(--spacingHeight);\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n padding-right: 5px;\r\n cursor: pointer;\r\n\r\n .title {\r\n border-left: 3px solid transparent;\r\n padding-left: 5px;\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .collapse {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n justify-items: center;\r\n transform-origin: center;\r\n\r\n &.closed {\r\n transform: rotate(180deg);\r\n }\r\n }\r\n }\r\n\r\n .paneList > div:not(:last-child) {\r\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1);\r\n }\r\n\r\n .fragment > div:not(:last-child) {\r\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1);\r\n }\r\n }\r\n }\r\n\r\n .color-picker {\r\n height: 26px;\r\n width: 26px;\r\n\r\n .color-rect-background {\r\n width: calc(100% - 2px);\r\n height: calc(100% - 2px);\r\n border: 1px black solid;\r\n cursor: pointer;\r\n background: repeating-conic-gradient(#e2e2e2 0% 25%, white 0% 50%) 50% / 100% 100%;\r\n .color-rect {\r\n height: 100%;\r\n }\r\n }\r\n\r\n .color-picker-cover {\r\n z-index: 2;\r\n position: fixed;\r\n top: 0px;\r\n right: 0px;\r\n bottom: 0px;\r\n left: 0px;\r\n }\r\n\r\n .color-picker-float {\r\n position: absolute;\r\n outline: 1px solid black;\r\n }\r\n\r\n .color-picker-container {\r\n background-color: #e2e2e2;\r\n }\r\n }\r\n\r\n .gradient-step {\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 20px 30px 40px auto 20px 30px;\r\n padding-top: 5px;\r\n padding-left: 5px;\r\n padding-bottom: 5px;\r\n\r\n .step {\r\n grid-row: 1;\r\n grid-column: 1;\r\n }\r\n\r\n .color {\r\n grid-row: 1;\r\n grid-column: 2;\r\n cursor: pointer;\r\n }\r\n\r\n .step-value {\r\n margin-left: 5px;\r\n grid-row: 1;\r\n grid-column: 3;\r\n text-align: right;\r\n margin-right: 5px;\r\n }\r\n\r\n .step-slider {\r\n grid-row: 1;\r\n grid-column: 4;\r\n display: grid;\r\n justify-content: stretch;\r\n align-content: center;\r\n margin-right: -5px;\r\n padding-left: 12px;\r\n\r\n input {\r\n width: 90%;\r\n }\r\n }\r\n\r\n .gradient-copy {\r\n grid-row: 1;\r\n grid-column: 5;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n\r\n .img {\r\n height: 20px;\r\n width: 20px;\r\n }\r\n .img:hover {\r\n cursor: pointer;\r\n }\r\n }\r\n .gradient-delete {\r\n grid-row: 1;\r\n grid-column: 6;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n .img {\r\n height: 20px;\r\n width: 20px;\r\n }\r\n .img:hover {\r\n cursor: pointer;\r\n }\r\n }\r\n }\r\n\r\n .alignment-bar {\r\n display: flex;\r\n justify-content: center;\r\n padding-right: 5px;\r\n }\r\n\r\n .command-button {\r\n cursor: pointer;\r\n width: 30px;\r\n\r\n .command-label {\r\n display: none;\r\n }\r\n\r\n .command-button-icon {\r\n height: 100%;\r\n width: 100%;\r\n display: grid;\r\n color: white;\r\n align-content: center;\r\n justify-content: center;\r\n }\r\n\r\n &:hover {\r\n background-color: white;\r\n }\r\n\r\n .active {\r\n transform-origin: center;\r\n background-color: white;\r\n }\r\n\r\n img {\r\n &.active {\r\n background-color: white;\r\n }\r\n }\r\n\r\n &.disabled {\r\n background-color: var(--buttonDisabledBackground);\r\n pointer-events: none;\r\n }\r\n }\r\n\r\n .command-button-alt {\r\n cursor: pointer;\r\n width: 40px;\r\n margin-left: 5px;\r\n margin-right: 5px;\r\n .command-label {\r\n display: none;\r\n }\r\n\r\n background-color: white;\r\n .command-button-icon {\r\n height: 100%;\r\n width: 100%;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n }\r\n &:hover {\r\n background-color: #c2c2c2;\r\n filter: invert(1);\r\n }\r\n }\r\n\r\n .command-button-alt-disabled {\r\n cursor: pointer;\r\n pointer-events: none;\r\n width: 40px;\r\n margin-left: 5px;\r\n margin-right: 5px;\r\n .command-label {\r\n display: none;\r\n }\r\n\r\n background-color: white;\r\n .command-button-icon {\r\n height: 100%;\r\n width: 100%;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n }\r\n\r\n img {\r\n filter: invert(1);\r\n }\r\n }\r\n\r\n .command-button-alt-active {\r\n cursor: pointer;\r\n pointer-events: none;\r\n width: 40px;\r\n margin-left: 5px;\r\n margin-right: 5px;\r\n .command-label {\r\n display: none;\r\n }\r\n\r\n background-color: #c2c2c2;\r\n filter: invert(1);\r\n .command-button-icon {\r\n height: 100%;\r\n width: 100%;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n }\r\n }\r\n\r\n .floatLine {\r\n user-select: none;\r\n height: var(--spacingHeight);\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n display: grid;\r\n grid-template-columns: auto auto 2fr auto;\r\n flex-grow: 1;\r\n\r\n .label {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n min-width: 15px;\r\n font-weight: 600;\r\n }\r\n\r\n img {\r\n width: 30px;\r\n }\r\n\r\n .img {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .value {\r\n display: flex;\r\n align-items: center;\r\n grid-column: 3;\r\n background: transparent;\r\n height: 26px;\r\n input {\r\n width: 100%;\r\n background-color: white;\r\n height: 24px;\r\n }\r\n }\r\n\r\n .short {\r\n grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n width: 100%;\r\n }\r\n\r\n input::-webkit-outer-spin-button,\r\n input::-webkit-inner-spin-button {\r\n -webkit-appearance: none;\r\n margin: 0;\r\n }\r\n\r\n input[type=\"number\"] {\r\n -moz-appearance: textfield;\r\n }\r\n }\r\n }\r\n\r\n .vector3Line {\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n display: grid;\r\n .firstLine {\r\n display: grid;\r\n grid-template-columns: 1fr auto 20px;\r\n height: var(--spacingHeight);\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .vector {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n text-align: right;\r\n opacity: 0.8;\r\n }\r\n\r\n .expand {\r\n grid-column: 3;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n }\r\n }\r\n\r\n .secondLine {\r\n display: grid;\r\n padding-right: 5px;\r\n border-left: 1px solid rgb(51, 122, 183);\r\n\r\n .no-right-margin {\r\n margin-right: 0;\r\n }\r\n\r\n .numeric {\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n }\r\n\r\n .numeric-label {\r\n text-align: right;\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n justify-self: right;\r\n margin-right: 10px;\r\n }\r\n\r\n .numeric-value {\r\n width: 120px;\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n border: 1px solid rgb(51, 122, 183);\r\n }\r\n }\r\n }\r\n\r\n .buttonLine {\r\n height: var(--spacingHeight);\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n display: grid;\r\n align-items: center;\r\n justify-items: stretch;\r\n padding-bottom: 5px;\r\n input[type=\"file\"] {\r\n display: none;\r\n }\r\n\r\n .file-upload {\r\n background: var(--backgroundGrey);\r\n border: 1px solid #424242;\r\n margin: 5px 10px;\r\n color: white;\r\n padding: 4px 5px;\r\n opacity: 0.9;\r\n cursor: pointer;\r\n text-align: center;\r\n border-radius: 4px;\r\n }\r\n\r\n .file-upload:hover {\r\n opacity: 1;\r\n }\r\n\r\n .file-upload:active {\r\n transform: scale(0.98);\r\n transform-origin: 0.5 0.5;\r\n }\r\n\r\n button {\r\n background: var(--backgroundGrey);\r\n border: 1px solid #424242;\r\n margin: 5px 10px 5px 10px;\r\n color: white;\r\n padding: 4px 5px;\r\n opacity: 0.9;\r\n border-radius: 4px;\r\n }\r\n\r\n button:hover {\r\n opacity: 1;\r\n }\r\n\r\n button:active {\r\n background: #282828;\r\n }\r\n\r\n button:focus {\r\n border: 1px solid #424242;\r\n outline: 0px;\r\n }\r\n }\r\n\r\n .numeric {\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n height: var(--spacingHeight);\r\n display: grid;\r\n grid-template-columns: 1fr 120px auto;\r\n\r\n .numeric-label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .number {\r\n display: flex;\r\n align-items: center;\r\n grid-column: 2;\r\n height: 10px;\r\n .input {\r\n width: calc(100% - 5px);\r\n height: 10px;\r\n }\r\n }\r\n }\r\n\r\n .checkBoxLine {\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n height: var(--spacingHeight);\r\n display: grid;\r\n grid-template-columns: auto 1fr auto;\r\n flex-grow: 1;\r\n\r\n .label {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n min-width: 100px;\r\n margin-left: 15px;\r\n height: var(--spacingHeight);\r\n font-weight: 600;\r\n }\r\n\r\n img {\r\n width: 30px;\r\n }\r\n\r\n .img {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .hidden {\r\n display: none;\r\n }\r\n }\r\n\r\n .listLine {\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n height: var(--spacingHeight);\r\n display: grid;\r\n grid-template-columns: auto 1fr auto;\r\n flex-grow: 1;\r\n\r\n .label {\r\n grid-column: 2;\r\n display: none;\r\n align-items: center;\r\n }\r\n\r\n img {\r\n width: 30px;\r\n }\r\n\r\n .img {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .options {\r\n grid-column: 2;\r\n padding-left: 15px;\r\n display: flex;\r\n align-items: center;\r\n\r\n select {\r\n width: 100%;\r\n height: 25px;\r\n border: transparent;\r\n }\r\n }\r\n }\r\n\r\n .color3Line {\r\n padding-left: 15px;\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n display: grid;\r\n flex-grow: 1;\r\n\r\n .firstLine {\r\n height: var(--spacingHeight);\r\n display: flex;\r\n align-items: center;\r\n\r\n .label {\r\n grid-column: 2;\r\n padding-left: 5px;\r\n display: none;\r\n align-items: center;\r\n min-width: 15px;\r\n }\r\n\r\n .img {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n img {\r\n width: 30px;\r\n height: 30px;\r\n }\r\n\r\n .textInputLine {\r\n grid-column: 3;\r\n padding-left: 2px;\r\n flex-grow: 1;\r\n }\r\n\r\n .color3 {\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n margin-right: 5px;\r\n }\r\n }\r\n\r\n .copy {\r\n grid-column: 4;\r\n display: none;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n color: black;\r\n img {\r\n height: 100%;\r\n width: 20px;\r\n }\r\n }\r\n\r\n .expand {\r\n grid-column: 4;\r\n display: none;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n\r\n img {\r\n height: 100%;\r\n width: 20px;\r\n }\r\n }\r\n }\r\n\r\n .secondLine {\r\n display: grid;\r\n padding-right: 5px;\r\n border-left: 1px solid rgb(51, 122, 183);\r\n\r\n .numeric {\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n }\r\n\r\n .numeric-label {\r\n text-align: right;\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n justify-self: right;\r\n margin-right: 10px;\r\n }\r\n\r\n .numeric-value {\r\n width: 120px;\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n border: 1px solid rgb(51, 122, 183);\r\n }\r\n }\r\n }\r\n\r\n .textLine {\r\n padding-left: $line-padding-left;\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n padding-right: $line-padding-right;\r\n height: auto;\r\n display: grid;\r\n grid-template-columns: auto auto 2fr 1fr;\r\n .label {\r\n grid-column: 2;\r\n padding-left: 5px;\r\n padding-top: 4px;\r\n display: flex;\r\n align-items: left;\r\n min-width: 15px;\r\n color: #a9a9a9;\r\n font-size: 10px;\r\n font-family: \"acumin-pro-semi-condensed\", sans-serif;\r\n font-weight: 600;\r\n }\r\n\r\n img {\r\n width: 30px;\r\n }\r\n\r\n .img {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .link-value {\r\n grid-column: 2;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n text-align: end;\r\n opacity: 0.8;\r\n margin: 5px;\r\n margin-top: 6px;\r\n max-width: 140px;\r\n text-decoration: underline;\r\n cursor: pointer;\r\n }\r\n\r\n .value {\r\n display: none;\r\n grid-column: 3;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n text-align: end;\r\n opacity: 0.8;\r\n margin: 5px;\r\n margin-top: 6px;\r\n max-width: 200px;\r\n -webkit-user-select: text;\r\n -moz-user-select: text;\r\n -ms-user-select: text;\r\n user-select: text;\r\n\r\n &.check {\r\n color: green;\r\n }\r\n\r\n &.uncheck {\r\n color: red;\r\n }\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
90
+ ___CSS_LOADER_EXPORT___.push([module.id, ":root {\n --backgroundGrey: #aaaaaa;\n --spacingHeight: 30px;\n --button: #333333;\n --buttonBackground: #ffffff;\n --buttonDisabledBackground: #c8c8c8;\n --buttonPressed: #ffffff;\n --buttonPressedBackground: #606060;\n --buttonHoverBackground: #afafaf; }\n\n#ge-propertyTab {\n user-select: none;\n color: black;\n background: #e2e2e2; }\n #ge-propertyTab * {\n font-family: \"acumin-pro-condensed\", sans-serif;\n font-size: 12px; }\n #ge-propertyTab #header {\n height: 32px;\n font-size: 16px;\n color: white;\n background: white;\n grid-row: 1;\n text-align: center;\n display: grid;\n grid-template-columns: 30px 1fr;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none; }\n #ge-propertyTab #header #logo {\n position: relative;\n grid-column: 1;\n width: 32px;\n height: 32px;\n left: 0;\n display: flex;\n align-self: center;\n justify-self: center;\n filter: invert(1); }\n #ge-propertyTab #header #title {\n background: white;\n color: black;\n grid-column: 2;\n display: grid;\n align-items: center;\n text-align: center; }\n #ge-propertyTab .range {\n -webkit-appearance: none;\n width: 100%;\n height: 2px;\n background: #bcbcbc;\n border-radius: 5px;\n outline: none;\n opacity: 0.7;\n -webkit-transition: 0.2s;\n transition: opacity 0.2s;\n padding: 0; }\n #ge-propertyTab .range:hover {\n opacity: 1; }\n #ge-propertyTab .range::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: #e2e2e2;\n border: solid;\n border-width: thin;\n cursor: pointer; }\n #ge-propertyTab .range::-moz-range-thumb {\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: black;\n cursor: pointer; }\n #ge-propertyTab input[type=\"color\"] {\n -webkit-appearance: none;\n border: 1px solid rgba(255, 255, 255, 0.5);\n padding: 0;\n width: 30px;\n height: 20px; }\n #ge-propertyTab input[type=\"color\"]::-webkit-color-swatch-wrapper {\n padding: 0; }\n #ge-propertyTab input[type=\"color\"]::-webkit-color-swatch {\n border: none; }\n #ge-propertyTab hr {\n border: 1px solid #d0cece; }\n #ge-propertyTab .icon {\n width: 30px;\n height: 30px; }\n #ge-propertyTab .unit {\n width: 26px;\n height: 26px;\n color: var(--button);\n background-color: var(--buttonBackground);\n border: none;\n margin-top: 2px;\n cursor: pointer;\n margin-left: 2px;\n font-family: \"atten-round-new\", sans-serif;\n font-weight: 500;\n font-style: normal;\n display: flex;\n justify-content: center;\n align-items: center; }\n #ge-propertyTab .unit:disabled {\n background-color: var(--buttonDisabledBackground);\n cursor: not-allowed; }\n #ge-propertyTab .unit:not(:disabled):hover {\n background-color: var(--buttonHoverBackground); }\n #ge-propertyTab .unit:not(:disabled):active {\n color: var(--buttonPressed);\n background-color: var(--buttonPressedBackground); }\n #ge-propertyTab input,\n #ge-propertyTab select {\n outline-style: solid;\n outline-width: 0px;\n outline-color: transparent;\n outline-offset: -1px;\n outline-width: 1px;\n transition: outline-color 0.2s;\n border: transparent;\n padding-left: 5px; }\n #ge-propertyTab input:focus,\n #ge-propertyTab select:focus {\n outline-width: 1px;\n outline-color: black; }\n #ge-propertyTab .hasArrows input::-webkit-outer-spin-button,\n #ge-propertyTab .hasArrows input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n #ge-propertyTab .hasArrows input[type=\"number\"] {\n -moz-appearance: textfield; }\n #ge-propertyTab .sliderLine {\n height: var(--spacingHeight);\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: auto 1fr 20px 1fr;\n flex-grow: 1; }\n #ge-propertyTab .sliderLine .label {\n grid-column: 1;\n display: flex;\n align-items: center;\n min-width: 15px;\n font-weight: 600; }\n #ge-propertyTab .sliderLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .sliderLine .slider {\n grid-column: 4;\n grid-row: 1;\n margin-right: 5px;\n display: flex;\n align-items: center;\n padding-left: 5px; }\n #ge-propertyTab .sliderLine .floatLine {\n grid-column: 2;\n padding-left: 0px;\n grid-template-columns: 1fr auto; }\n #ge-propertyTab .sliderLine .floatLine .label {\n grid-column: 1;\n display: none;\n align-items: center;\n font-weight: 600; }\n #ge-propertyTab .sliderLine .floatLine .short {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .sliderLine .floatLine .short input {\n width: 100%;\n background-color: white;\n height: 24px; }\n #ge-propertyTab .sliderLine .floatLine .short input::-webkit-outer-spin-button,\n #ge-propertyTab .sliderLine .floatLine .short input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n #ge-propertyTab .sliderLine .floatLine .short input[type=\"number\"] {\n -webkit-appearance: textfield;\n -moz-appearance: textfield;\n appearance: textfield; }\n #ge-propertyTab .ge-divider {\n padding-right: 18px;\n padding-left: 5px;\n display: grid;\n grid-template-columns: auto 1fr;\n padding-top: 1px;\n padding-bottom: 1px; }\n #ge-propertyTab .ge-divider.double {\n display: grid;\n grid-template-columns: auto 1fr 5px 1fr; }\n #ge-propertyTab .ge-divider.double > .textInputLine:first-of-type,\n #ge-propertyTab .ge-divider.double > .floatLine:first-of-type {\n grid-column: 2; }\n #ge-propertyTab .ge-divider.double > .textInputLine:nth-of-type(2),\n #ge-propertyTab .ge-divider.double > .floatLine:nth-of-type(2) {\n grid-column: 4; }\n #ge-propertyTab .ge-grid-divider {\n display: grid;\n grid-template-columns: 150px 1fr auto; }\n #ge-propertyTab .ge-grid-divider .textLine {\n grid-column: auto; }\n #ge-propertyTab .ge-grid-button-divider {\n display: grid;\n grid-template-columns: 60px 60px 60px 60px; }\n #ge-propertyTab .ge-grid-remove {\n display: grid;\n background-color: #c2c2c2;\n margin-bottom: 5px;\n filter: invert(1); }\n #ge-propertyTab .ge-grid-edit {\n display: grid;\n background-color: #878787;\n margin-bottom: 5px;\n filter: invert(1); }\n #ge-propertyTab .ge-grid {\n display: grid;\n margin-bottom: 5px; }\n #ge-propertyTab .ge-divider.double .textInputLine {\n grid-template-columns: auto auto 1fr auto; }\n #ge-propertyTab .textInputLine,\n #ge-propertyTab .floatLine {\n user-select: none;\n padding-bottom: 0px;\n padding-top: 0px;\n height: var(--spacingHeight);\n display: grid;\n grid-template-columns: auto auto 1fr;\n flex-grow: 1; }\n #ge-propertyTab .textInputLine .label,\n #ge-propertyTab .floatLine .label {\n grid-column: 2;\n display: flex;\n align-items: center;\n min-width: 15px;\n font-weight: 600; }\n #ge-propertyTab .textInputLine img,\n #ge-propertyTab .floatLine img {\n width: 30px; }\n #ge-propertyTab .textInputLine .img,\n #ge-propertyTab .floatLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .textInputLine .value,\n #ge-propertyTab .floatLine .value {\n display: flex;\n align-items: center;\n grid-column: 3;\n background: transparent;\n height: 26px;\n position: relative;\n background-color: white;\n margin-top: 2px;\n overflow-y: hidden; }\n #ge-propertyTab .textInputLine .value input,\n #ge-propertyTab .floatLine .value input {\n width: 100%;\n height: 24px;\n color: #333333; }\n #ge-propertyTab .textInputLine .value input.hasArrows,\n #ge-propertyTab .floatLine .value input.hasArrows {\n padding-right: 15px; }\n #ge-propertyTab .textInputLine .value .arrows,\n #ge-propertyTab .floatLine .value .arrows {\n display: none;\n position: absolute;\n right: 0;\n flex-direction: column;\n cursor: grab; }\n #ge-propertyTab .textInputLine .value .arrows .downArrowIcon,\n #ge-propertyTab .textInputLine .value .arrows .upArrowIcon,\n #ge-propertyTab .floatLine .value .arrows .downArrowIcon,\n #ge-propertyTab .floatLine .value .arrows .upArrowIcon {\n width: 13px;\n height: 13px; }\n #ge-propertyTab .textInputLine .value:hover .arrows,\n #ge-propertyTab .textInputLine .value:focus .arrows,\n #ge-propertyTab .textInputLine .value.dragging .arrows,\n #ge-propertyTab .floatLine .value:hover .arrows,\n #ge-propertyTab .floatLine .value:focus .arrows,\n #ge-propertyTab .floatLine .value.dragging .arrows {\n display: flex; }\n #ge-propertyTab .textInputLine .value .arrows:hover,\n #ge-propertyTab .floatLine .value .arrows:hover {\n background-color: var(--buttonHoverBackground); }\n #ge-propertyTab .textInputLine .value.dragging .arrows,\n #ge-propertyTab .floatLine .value.dragging .arrows {\n background-color: var(--buttonPressedBackground); }\n #ge-propertyTab .textInputLine .value.dragging .arrows .downArrowIcon,\n #ge-propertyTab .textInputLine .value.dragging .arrows .upArrowIcon,\n #ge-propertyTab .floatLine .value.dragging .arrows .downArrowIcon,\n #ge-propertyTab .floatLine .value.dragging .arrows .upArrowIcon {\n filter: brightness(10); }\n #ge-propertyTab .textInputLine.withUnits {\n grid-template-columns: auto auto 1fr auto; }\n #ge-propertyTab .textInputArea {\n height: 100%;\n display: grid;\n grid-template-columns: 1fr 120px; }\n #ge-propertyTab .textInputArea .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .textInputArea .value {\n display: flex;\n align-items: center;\n grid-column: 2; }\n #ge-propertyTab .textInputArea .value textarea {\n width: calc(150% - 5px);\n margin-left: -50%;\n height: 40px; }\n #ge-propertyTab .paneContainer {\n margin-top: 3px;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%; }\n #ge-propertyTab .paneContainer .paneList {\n border-left: 3px solid transparent; }\n #ge-propertyTab .paneContainer:hover .paneList {\n border-left: 3px solid rgba(51, 122, 183, 0.8); }\n #ge-propertyTab .paneContainer:hover .paneContainer-content .header .title {\n border-left: 3px solid #337ab7; }\n #ge-propertyTab .paneContainer .paneContainer-highlight-border {\n grid-row: 1;\n grid-column: 1;\n opacity: 1;\n border: 3px solid red;\n transition: opacity 250ms;\n pointer-events: none; }\n #ge-propertyTab .paneContainer .paneContainer-highlight-border.transparent {\n opacity: 0; }\n #ge-propertyTab .paneContainer .paneContainer-content {\n grid-row: 1;\n grid-column: 1; }\n #ge-propertyTab .paneContainer .paneContainer-content .header {\n display: grid;\n grid-template-columns: 1fr auto;\n background: #cccccc;\n height: var(--spacingHeight);\n padding-bottom: 0px;\n padding-top: 0px;\n padding-right: 5px;\n cursor: pointer; }\n #ge-propertyTab .paneContainer .paneContainer-content .header .title {\n border-left: 3px solid transparent;\n padding-left: 5px;\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .paneContainer .paneContainer-content .header .collapse {\n grid-column: 2;\n display: flex;\n align-items: center;\n justify-items: center;\n transform-origin: center; }\n #ge-propertyTab .paneContainer .paneContainer-content .header .collapse.closed {\n transform: rotate(180deg); }\n #ge-propertyTab .paneContainer .paneContainer-content .paneList > div:not(:last-child) {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1); }\n #ge-propertyTab .paneContainer .paneContainer-content .fragment > div:not(:last-child) {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1); }\n #ge-propertyTab .color-picker {\n height: 26px;\n width: 26px; }\n #ge-propertyTab .color-picker .color-rect-background {\n width: calc(100% - 2px);\n height: calc(100% - 2px);\n border: 1px black solid;\n cursor: pointer;\n background: repeating-conic-gradient(#e2e2e2 0% 25%, white 0% 50%) 50%/100% 100%; }\n #ge-propertyTab .color-picker .color-rect-background .color-rect {\n height: 100%; }\n #ge-propertyTab .color-picker .color-picker-cover {\n z-index: 2;\n position: fixed;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px; }\n #ge-propertyTab .color-picker .color-picker-float {\n position: absolute;\n outline: 1px solid black; }\n #ge-propertyTab .color-picker .color-picker-container {\n background-color: #e2e2e2; }\n #ge-propertyTab .gradient-step {\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 20px 30px 40px auto 20px 30px;\n padding-top: 5px;\n padding-left: 5px;\n padding-bottom: 5px; }\n #ge-propertyTab .gradient-step .step {\n grid-row: 1;\n grid-column: 1; }\n #ge-propertyTab .gradient-step .color {\n grid-row: 1;\n grid-column: 2;\n cursor: pointer; }\n #ge-propertyTab .gradient-step .step-value {\n margin-left: 5px;\n grid-row: 1;\n grid-column: 3;\n text-align: right;\n margin-right: 5px; }\n #ge-propertyTab .gradient-step .step-slider {\n grid-row: 1;\n grid-column: 4;\n display: grid;\n justify-content: stretch;\n align-content: center;\n margin-right: -5px;\n padding-left: 12px; }\n #ge-propertyTab .gradient-step .step-slider input {\n width: 90%; }\n #ge-propertyTab .gradient-step .gradient-copy {\n grid-row: 1;\n grid-column: 5;\n display: grid;\n align-content: center;\n justify-content: center; }\n #ge-propertyTab .gradient-step .gradient-copy .img {\n height: 20px;\n width: 20px; }\n #ge-propertyTab .gradient-step .gradient-copy .img:hover {\n cursor: pointer; }\n #ge-propertyTab .gradient-step .gradient-delete {\n grid-row: 1;\n grid-column: 6;\n display: grid;\n align-content: center;\n justify-content: center; }\n #ge-propertyTab .gradient-step .gradient-delete .img {\n height: 20px;\n width: 20px; }\n #ge-propertyTab .gradient-step .gradient-delete .img:hover {\n cursor: pointer; }\n #ge-propertyTab .alignment-bar {\n display: flex;\n justify-content: center;\n padding-right: 5px; }\n #ge-propertyTab .command-button {\n cursor: pointer;\n width: 30px; }\n #ge-propertyTab .command-button .command-label {\n display: none; }\n #ge-propertyTab .command-button .command-button-icon {\n height: 100%;\n width: 100%;\n display: grid;\n color: white;\n align-content: center;\n justify-content: center; }\n #ge-propertyTab .command-button:hover {\n background-color: white; }\n #ge-propertyTab .command-button .active {\n transform-origin: center;\n background-color: white; }\n #ge-propertyTab .command-button img.active {\n background-color: white; }\n #ge-propertyTab .command-button.disabled {\n background-color: var(--buttonDisabledBackground);\n pointer-events: none; }\n #ge-propertyTab .command-button-alt {\n cursor: pointer;\n width: 40px;\n margin-left: 5px;\n margin-right: 5px;\n background-color: white; }\n #ge-propertyTab .command-button-alt .command-label {\n display: none; }\n #ge-propertyTab .command-button-alt .command-button-icon {\n height: 100%;\n width: 100%;\n display: grid;\n align-content: center;\n justify-content: center; }\n #ge-propertyTab .command-button-alt:hover {\n background-color: #c2c2c2;\n filter: invert(1); }\n #ge-propertyTab .command-button-alt-disabled {\n cursor: pointer;\n pointer-events: none;\n width: 40px;\n margin-left: 5px;\n margin-right: 5px;\n background-color: white; }\n #ge-propertyTab .command-button-alt-disabled .command-label {\n display: none; }\n #ge-propertyTab .command-button-alt-disabled .command-button-icon {\n height: 100%;\n width: 100%;\n display: grid;\n align-content: center;\n justify-content: center; }\n #ge-propertyTab .command-button-alt-disabled img {\n filter: invert(1); }\n #ge-propertyTab .command-button-alt-active {\n cursor: pointer;\n pointer-events: none;\n width: 40px;\n margin-left: 5px;\n margin-right: 5px;\n background-color: #c2c2c2;\n filter: invert(1); }\n #ge-propertyTab .command-button-alt-active .command-label {\n display: none; }\n #ge-propertyTab .command-button-alt-active .command-button-icon {\n height: 100%;\n width: 100%;\n display: grid;\n align-content: center;\n justify-content: center; }\n #ge-propertyTab .floatLine {\n user-select: none;\n height: var(--spacingHeight);\n padding-bottom: 0px;\n padding-top: 0px;\n display: grid;\n grid-template-columns: auto auto 2fr auto;\n flex-grow: 1; }\n #ge-propertyTab .floatLine .label {\n grid-column: 2;\n display: flex;\n align-items: center;\n min-width: 15px;\n font-weight: 600; }\n #ge-propertyTab .floatLine img {\n width: 30px; }\n #ge-propertyTab .floatLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .floatLine .value {\n display: flex;\n align-items: center;\n grid-column: 3;\n background: transparent;\n height: 26px; }\n #ge-propertyTab .floatLine .value input {\n width: 100%;\n background-color: white;\n height: 24px; }\n #ge-propertyTab .floatLine .short {\n grid-column: 2;\n display: flex;\n align-items: center; }\n #ge-propertyTab .floatLine .short input {\n width: 100%; }\n #ge-propertyTab .floatLine .short input::-webkit-outer-spin-button,\n #ge-propertyTab .floatLine .short input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n #ge-propertyTab .floatLine .short input[type=\"number\"] {\n -moz-appearance: textfield; }\n #ge-propertyTab .vector3Line {\n padding-bottom: 0px;\n padding-top: 0px;\n display: grid; }\n #ge-propertyTab .vector3Line .firstLine {\n display: grid;\n grid-template-columns: 1fr auto 20px;\n height: var(--spacingHeight); }\n #ge-propertyTab .vector3Line .firstLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .vector3Line .firstLine .vector {\n grid-column: 2;\n display: flex;\n align-items: center;\n text-align: right;\n opacity: 0.8; }\n #ge-propertyTab .vector3Line .firstLine .expand {\n grid-column: 3;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #ge-propertyTab .vector3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n #ge-propertyTab .vector3Line .secondLine .no-right-margin {\n margin-right: 0; }\n #ge-propertyTab .vector3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n #ge-propertyTab .vector3Line .secondLine .numeric-label {\n text-align: right;\n grid-column: 1;\n display: flex;\n align-items: center;\n justify-self: right;\n margin-right: 10px; }\n #ge-propertyTab .vector3Line .secondLine .numeric-value {\n width: 120px;\n grid-column: 2;\n display: flex;\n align-items: center;\n border: 1px solid #337ab7; }\n #ge-propertyTab .buttonLine {\n height: var(--spacingHeight);\n padding-bottom: 0px;\n padding-top: 0px;\n display: grid;\n align-items: center;\n justify-items: stretch;\n padding-bottom: 5px; }\n #ge-propertyTab .buttonLine input[type=\"file\"] {\n display: none; }\n #ge-propertyTab .buttonLine .file-upload {\n background: var(--backgroundGrey);\n border: 1px solid #424242;\n margin: 5px 10px;\n color: white;\n padding: 4px 5px;\n opacity: 0.9;\n cursor: pointer;\n text-align: center;\n border-radius: 4px; }\n #ge-propertyTab .buttonLine .file-upload:hover {\n opacity: 1; }\n #ge-propertyTab .buttonLine .file-upload:active {\n transform: scale(0.98);\n transform-origin: 0.5 0.5; }\n #ge-propertyTab .buttonLine button {\n background: var(--backgroundGrey);\n border: 1px solid #424242;\n margin: 5px 10px 5px 10px;\n color: white;\n padding: 4px 5px;\n opacity: 0.9;\n border-radius: 4px; }\n #ge-propertyTab .buttonLine button:hover {\n opacity: 1; }\n #ge-propertyTab .buttonLine button:active {\n background: #282828; }\n #ge-propertyTab .buttonLine button:focus {\n border: 1px solid #424242;\n outline: 0px; }\n #ge-propertyTab .numeric {\n padding-bottom: 0px;\n padding-top: 0px;\n height: var(--spacingHeight);\n display: grid;\n grid-template-columns: 1fr 120px auto; }\n #ge-propertyTab .numeric .numeric-label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .numeric .number {\n display: flex;\n align-items: center;\n grid-column: 2;\n height: 10px; }\n #ge-propertyTab .numeric .number .input {\n width: calc(100% - 5px);\n height: 10px; }\n #ge-propertyTab .checkBoxLine {\n padding-bottom: 0px;\n padding-top: 0px;\n height: var(--spacingHeight);\n display: grid;\n grid-template-columns: auto 1fr auto;\n flex-grow: 1; }\n #ge-propertyTab .checkBoxLine .label {\n grid-column: 2;\n display: flex;\n align-items: center;\n min-width: 100px;\n margin-left: 15px;\n height: var(--spacingHeight);\n font-weight: 600; }\n #ge-propertyTab .checkBoxLine img {\n width: 30px; }\n #ge-propertyTab .checkBoxLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .checkBoxLine .hidden {\n display: none; }\n #ge-propertyTab .listLine {\n padding-bottom: 0px;\n padding-top: 0px;\n height: var(--spacingHeight);\n display: grid;\n grid-template-columns: auto 1fr auto;\n flex-grow: 1; }\n #ge-propertyTab .listLine .label {\n grid-column: 2;\n display: none;\n align-items: center; }\n #ge-propertyTab .listLine img {\n width: 30px; }\n #ge-propertyTab .listLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .listLine .options {\n grid-column: 2;\n padding-left: 15px;\n display: flex;\n align-items: center; }\n #ge-propertyTab .listLine .options select {\n width: 100%;\n height: 25px;\n border: transparent; }\n #ge-propertyTab .listLine .options input {\n width: 100%;\n height: 24px;\n color: #333333; }\n #ge-propertyTab .color3Line {\n padding-left: 15px;\n padding-bottom: 0px;\n padding-top: 0px;\n display: grid;\n flex-grow: 1; }\n #ge-propertyTab .color3Line .firstLine {\n height: var(--spacingHeight);\n display: flex;\n align-items: center; }\n #ge-propertyTab .color3Line .firstLine .label {\n grid-column: 2;\n padding-left: 5px;\n display: none;\n align-items: center;\n min-width: 15px; }\n #ge-propertyTab .color3Line .firstLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .color3Line .firstLine img {\n width: 30px;\n height: 30px; }\n #ge-propertyTab .color3Line .firstLine .textInputLine {\n grid-column: 3;\n padding-left: 2px;\n flex-grow: 1; }\n #ge-propertyTab .color3Line .firstLine .color3 {\n display: flex;\n align-items: center; }\n #ge-propertyTab .color3Line .firstLine .color3 input {\n margin-right: 5px; }\n #ge-propertyTab .color3Line .firstLine .copy {\n grid-column: 4;\n display: none;\n align-items: center;\n justify-items: center;\n cursor: pointer;\n color: black; }\n #ge-propertyTab .color3Line .firstLine .copy img {\n height: 100%;\n width: 20px; }\n #ge-propertyTab .color3Line .firstLine .expand {\n grid-column: 4;\n display: none;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #ge-propertyTab .color3Line .firstLine .expand img {\n height: 100%;\n width: 20px; }\n #ge-propertyTab .color3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n #ge-propertyTab .color3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n #ge-propertyTab .color3Line .secondLine .numeric-label {\n text-align: right;\n grid-column: 1;\n display: flex;\n align-items: center;\n justify-self: right;\n margin-right: 10px; }\n #ge-propertyTab .color3Line .secondLine .numeric-value {\n width: 120px;\n grid-column: 2;\n display: flex;\n align-items: center;\n border: 1px solid #337ab7; }\n #ge-propertyTab .textLine {\n padding-left: 5px;\n padding-bottom: 0px;\n padding-top: 0px;\n padding-right: 18px;\n height: auto;\n display: grid;\n grid-template-columns: auto auto 2fr 1fr; }\n #ge-propertyTab .textLine .label {\n grid-column: 2;\n padding-left: 5px;\n padding-top: 4px;\n display: flex;\n align-items: left;\n min-width: 15px;\n color: #a9a9a9;\n font-size: 10px;\n font-family: \"acumin-pro-semi-condensed\", sans-serif;\n font-weight: 600; }\n #ge-propertyTab .textLine img {\n width: 30px; }\n #ge-propertyTab .textLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .textLine .link-value {\n grid-column: 2;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n text-align: end;\n opacity: 0.8;\n margin: 5px;\n margin-top: 6px;\n max-width: 140px;\n text-decoration: underline;\n cursor: pointer; }\n #ge-propertyTab .textLine .value {\n display: none;\n grid-column: 3;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n text-align: end;\n opacity: 0.8;\n margin: 5px;\n margin-top: 6px;\n max-width: 200px;\n -webkit-user-select: text;\n -moz-user-select: text;\n -ms-user-select: text;\n user-select: text; }\n #ge-propertyTab .textLine .value.check {\n color: green; }\n #ge-propertyTab .textLine .value.uncheck {\n color: red; }\n", "",{"version":3,"sources":["webpack://./../../../tools/guiEditor/dist/components/propertyTab/propertyTab.scss"],"names":[],"mappings":"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","sourcesContent":[":root {\r\n --backgroundGrey: #aaaaaa;\r\n --spacingHeight: 30px;\r\n --button: #333333;\r\n --buttonBackground: #ffffff;\r\n --buttonDisabledBackground: #c8c8c8;\r\n --buttonPressed: #ffffff;\r\n --buttonPressedBackground: #606060;\r\n --buttonHoverBackground: #afafaf;\r\n}\r\n\r\n#ge-propertyTab {\r\n user-select: none;\r\n $line-padding-left: 5px;\r\n $line-padding-bottom: 0px;\r\n $line-padding-top: 0px;\r\n $line-padding-right: 18px;\r\n color: black;\r\n background: #e2e2e2;\r\n * {\r\n font-family: \"acumin-pro-condensed\", sans-serif;\r\n font-size: 12px;\r\n }\r\n #header {\r\n height: 32px;\r\n font-size: 16px;\r\n color: white;\r\n background: white;\r\n grid-row: 1;\r\n text-align: center;\r\n display: grid;\r\n grid-template-columns: 30px 1fr;\r\n -webkit-user-select: none;\r\n -moz-user-select: none;\r\n -ms-user-select: none;\r\n user-select: none;\r\n\r\n #logo {\r\n position: relative;\r\n grid-column: 1;\r\n width: 32px;\r\n height: 32px;\r\n left: 0;\r\n display: flex;\r\n align-self: center;\r\n justify-self: center;\r\n filter: invert(1);\r\n }\r\n\r\n #title {\r\n background: white;\r\n color: black;\r\n grid-column: 2;\r\n display: grid;\r\n align-items: center;\r\n text-align: center;\r\n }\r\n }\r\n\r\n .range {\r\n -webkit-appearance: none;\r\n width: 100%;\r\n height: 2px;\r\n background: #bcbcbc;\r\n border-radius: 5px;\r\n outline: none;\r\n opacity: 0.7;\r\n -webkit-transition: 0.2s;\r\n transition: opacity 0.2s;\r\n padding: 0;\r\n }\r\n\r\n .range:hover {\r\n opacity: 1;\r\n }\r\n\r\n .range::-webkit-slider-thumb {\r\n -webkit-appearance: none;\r\n appearance: none;\r\n width: 14px;\r\n height: 14px;\r\n border-radius: 50%;\r\n background: #e2e2e2;\r\n border: solid;\r\n border-width: thin;\r\n cursor: pointer;\r\n }\r\n\r\n .range::-moz-range-thumb {\r\n width: 14px;\r\n height: 14px;\r\n border-radius: 50%;\r\n background: rgb(0, 0, 0);\r\n cursor: pointer;\r\n }\r\n\r\n input[type=\"color\"] {\r\n -webkit-appearance: none;\r\n border: 1px solid rgba(255, 255, 255, 0.5);\r\n padding: 0;\r\n width: 30px;\r\n height: 20px;\r\n }\r\n input[type=\"color\"]::-webkit-color-swatch-wrapper {\r\n padding: 0;\r\n }\r\n input[type=\"color\"]::-webkit-color-swatch {\r\n border: none;\r\n }\r\n\r\n hr {\r\n border: 1px solid #d0cece;\r\n }\r\n\r\n .icon {\r\n width: 30px;\r\n height: 30px;\r\n }\r\n\r\n .unit {\r\n width: 26px;\r\n height: 26px;\r\n color: var(--button);\r\n background-color: var(--buttonBackground);\r\n border: none;\r\n margin-top: 2px;\r\n cursor: pointer;\r\n margin-left: 2px;\r\n font-family: \"atten-round-new\", sans-serif;\r\n font-weight: 500;\r\n font-style: normal;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n }\r\n\r\n .unit:disabled {\r\n background-color: var(--buttonDisabledBackground);\r\n cursor: not-allowed;\r\n }\r\n\r\n .unit:not(:disabled):hover {\r\n background-color: var(--buttonHoverBackground);\r\n }\r\n\r\n .unit:not(:disabled):active {\r\n color: var(--buttonPressed);\r\n background-color: var(--buttonPressedBackground);\r\n }\r\n\r\n input,\r\n select {\r\n outline-style: solid;\r\n outline-width: 0px;\r\n outline-color: transparent;\r\n outline-offset: -1px;\r\n outline-width: 1px;\r\n transition: outline-color 0.2s;\r\n border: transparent;\r\n padding-left: 5px;\r\n\r\n &:focus {\r\n outline-width: 1px;\r\n outline-color: black;\r\n }\r\n }\r\n\r\n .hasArrows input::-webkit-outer-spin-button,\r\n .hasArrows input::-webkit-inner-spin-button {\r\n -webkit-appearance: none;\r\n margin: 0;\r\n }\r\n\r\n .hasArrows input[type=\"number\"] {\r\n -moz-appearance: textfield;\r\n }\r\n\r\n .sliderLine {\r\n height: var(--spacingHeight);\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: auto 1fr 20px 1fr;\r\n flex-grow: 1;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n min-width: 15px;\r\n font-weight: 600;\r\n }\r\n\r\n .img {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .slider {\r\n grid-column: 4;\r\n grid-row: 1;\r\n margin-right: 5px;\r\n display: flex;\r\n align-items: center;\r\n padding-left: 5px;\r\n }\r\n\r\n .floatLine {\r\n grid-column: 2;\r\n padding-left: 0px;\r\n grid-template-columns: 1fr auto;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: none;\r\n align-items: center;\r\n font-weight: 600;\r\n }\r\n\r\n .short {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n width: 100%;\r\n background-color: white;\r\n height: 24px;\r\n }\r\n\r\n input::-webkit-outer-spin-button,\r\n input::-webkit-inner-spin-button {\r\n -webkit-appearance: none;\r\n margin: 0;\r\n }\r\n\r\n input[type=\"number\"] {\r\n -webkit-appearance: textfield;\r\n -moz-appearance: textfield;\r\n appearance: textfield;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .ge-divider {\r\n padding-right: $line-padding-right;\r\n padding-left: 5px;\r\n display: grid;\r\n grid-template-columns: auto 1fr;\r\n padding-top: 1px;\r\n padding-bottom: 1px;\r\n }\r\n .ge-divider.double {\r\n display: grid;\r\n grid-template-columns: auto 1fr 5px 1fr;\r\n > .textInputLine,\r\n > .floatLine {\r\n &:first-of-type {\r\n grid-column: 2;\r\n }\r\n &:nth-of-type(2) {\r\n grid-column: 4;\r\n }\r\n }\r\n }\r\n .ge-grid-divider {\r\n display: grid;\r\n grid-template-columns: 150px 1fr auto;\r\n\r\n .textLine {\r\n grid-column: auto;\r\n }\r\n }\r\n\r\n .ge-grid-button-divider {\r\n display: grid;\r\n grid-template-columns: 60px 60px 60px 60px;\r\n }\r\n\r\n .ge-grid-remove {\r\n display: grid;\r\n background-color: #c2c2c2;\r\n margin-bottom: 5px;\r\n filter: invert(1);\r\n }\r\n\r\n .ge-grid-edit {\r\n display: grid;\r\n background-color: #878787;\r\n margin-bottom: 5px;\r\n filter: invert(1);\r\n }\r\n\r\n .ge-grid {\r\n display: grid;\r\n margin-bottom: 5px;\r\n }\r\n\r\n .ge-divider.double .textInputLine {\r\n grid-template-columns: auto auto 1fr auto;\r\n }\r\n\r\n .textInputLine,\r\n .floatLine {\r\n user-select: none;\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n height: var(--spacingHeight);\r\n display: grid;\r\n grid-template-columns: auto auto 1fr;\r\n flex-grow: 1;\r\n .label {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n min-width: 15px;\r\n font-weight: 600;\r\n }\r\n\r\n img {\r\n width: 30px;\r\n }\r\n\r\n .img {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .value {\r\n display: flex;\r\n align-items: center;\r\n grid-column: 3;\r\n background: transparent;\r\n height: 26px;\r\n position: relative;\r\n background-color: white;\r\n margin-top: 2px;\r\n overflow-y: hidden;\r\n input {\r\n width: 100%;\r\n height: 24px;\r\n color: #333333;\r\n }\r\n input.hasArrows {\r\n padding-right: 15px;\r\n }\r\n .arrows {\r\n display: none;\r\n position: absolute;\r\n right: 0;\r\n flex-direction: column;\r\n cursor: grab;\r\n .downArrowIcon,\r\n .upArrowIcon {\r\n width: 13px;\r\n height: 13px;\r\n }\r\n }\r\n &:hover .arrows,\r\n &:focus .arrows,\r\n &.dragging .arrows {\r\n display: flex;\r\n }\r\n .arrows:hover {\r\n background-color: var(--buttonHoverBackground);\r\n }\r\n &.dragging .arrows {\r\n background-color: var(--buttonPressedBackground);\r\n .downArrowIcon,\r\n .upArrowIcon {\r\n filter: brightness(10);\r\n }\r\n }\r\n }\r\n }\r\n\r\n .textInputLine.withUnits {\r\n grid-template-columns: auto auto 1fr auto;\r\n }\r\n\r\n .textInputArea {\r\n height: 100%;\r\n display: grid;\r\n grid-template-columns: 1fr 120px;\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .value {\r\n display: flex;\r\n align-items: center;\r\n grid-column: 2;\r\n\r\n textarea {\r\n width: calc(150% - 5px);\r\n margin-left: -50%;\r\n height: 40px;\r\n }\r\n }\r\n }\r\n\r\n .paneContainer {\r\n margin-top: 3px;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 100%;\r\n\r\n .paneList {\r\n border-left: 3px solid transparent;\r\n }\r\n\r\n &:hover {\r\n .paneList {\r\n border-left: 3px solid rgba(51, 122, 183, 0.8);\r\n }\r\n\r\n .paneContainer-content {\r\n .header {\r\n .title {\r\n border-left: 3px solid rgb(51, 122, 183);\r\n }\r\n }\r\n }\r\n }\r\n\r\n .paneContainer-highlight-border {\r\n grid-row: 1;\r\n grid-column: 1;\r\n opacity: 1;\r\n border: 3px solid red;\r\n transition: opacity 250ms;\r\n pointer-events: none;\r\n\r\n &.transparent {\r\n opacity: 0;\r\n }\r\n }\r\n\r\n .paneContainer-content {\r\n grid-row: 1;\r\n grid-column: 1;\r\n\r\n .header {\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n background: #cccccc;\r\n height: var(--spacingHeight);\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n padding-right: 5px;\r\n cursor: pointer;\r\n\r\n .title {\r\n border-left: 3px solid transparent;\r\n padding-left: 5px;\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .collapse {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n justify-items: center;\r\n transform-origin: center;\r\n\r\n &.closed {\r\n transform: rotate(180deg);\r\n }\r\n }\r\n }\r\n\r\n .paneList > div:not(:last-child) {\r\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1);\r\n }\r\n\r\n .fragment > div:not(:last-child) {\r\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1);\r\n }\r\n }\r\n }\r\n\r\n .color-picker {\r\n height: 26px;\r\n width: 26px;\r\n\r\n .color-rect-background {\r\n width: calc(100% - 2px);\r\n height: calc(100% - 2px);\r\n border: 1px black solid;\r\n cursor: pointer;\r\n background: repeating-conic-gradient(#e2e2e2 0% 25%, white 0% 50%) 50% / 100% 100%;\r\n .color-rect {\r\n height: 100%;\r\n }\r\n }\r\n\r\n .color-picker-cover {\r\n z-index: 2;\r\n position: fixed;\r\n top: 0px;\r\n right: 0px;\r\n bottom: 0px;\r\n left: 0px;\r\n }\r\n\r\n .color-picker-float {\r\n position: absolute;\r\n outline: 1px solid black;\r\n }\r\n\r\n .color-picker-container {\r\n background-color: #e2e2e2;\r\n }\r\n }\r\n\r\n .gradient-step {\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 20px 30px 40px auto 20px 30px;\r\n padding-top: 5px;\r\n padding-left: 5px;\r\n padding-bottom: 5px;\r\n\r\n .step {\r\n grid-row: 1;\r\n grid-column: 1;\r\n }\r\n\r\n .color {\r\n grid-row: 1;\r\n grid-column: 2;\r\n cursor: pointer;\r\n }\r\n\r\n .step-value {\r\n margin-left: 5px;\r\n grid-row: 1;\r\n grid-column: 3;\r\n text-align: right;\r\n margin-right: 5px;\r\n }\r\n\r\n .step-slider {\r\n grid-row: 1;\r\n grid-column: 4;\r\n display: grid;\r\n justify-content: stretch;\r\n align-content: center;\r\n margin-right: -5px;\r\n padding-left: 12px;\r\n\r\n input {\r\n width: 90%;\r\n }\r\n }\r\n\r\n .gradient-copy {\r\n grid-row: 1;\r\n grid-column: 5;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n\r\n .img {\r\n height: 20px;\r\n width: 20px;\r\n }\r\n .img:hover {\r\n cursor: pointer;\r\n }\r\n }\r\n .gradient-delete {\r\n grid-row: 1;\r\n grid-column: 6;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n .img {\r\n height: 20px;\r\n width: 20px;\r\n }\r\n .img:hover {\r\n cursor: pointer;\r\n }\r\n }\r\n }\r\n\r\n .alignment-bar {\r\n display: flex;\r\n justify-content: center;\r\n padding-right: 5px;\r\n }\r\n\r\n .command-button {\r\n cursor: pointer;\r\n width: 30px;\r\n\r\n .command-label {\r\n display: none;\r\n }\r\n\r\n .command-button-icon {\r\n height: 100%;\r\n width: 100%;\r\n display: grid;\r\n color: white;\r\n align-content: center;\r\n justify-content: center;\r\n }\r\n\r\n &:hover {\r\n background-color: white;\r\n }\r\n\r\n .active {\r\n transform-origin: center;\r\n background-color: white;\r\n }\r\n\r\n img {\r\n &.active {\r\n background-color: white;\r\n }\r\n }\r\n\r\n &.disabled {\r\n background-color: var(--buttonDisabledBackground);\r\n pointer-events: none;\r\n }\r\n }\r\n\r\n .command-button-alt {\r\n cursor: pointer;\r\n width: 40px;\r\n margin-left: 5px;\r\n margin-right: 5px;\r\n .command-label {\r\n display: none;\r\n }\r\n\r\n background-color: white;\r\n .command-button-icon {\r\n height: 100%;\r\n width: 100%;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n }\r\n &:hover {\r\n background-color: #c2c2c2;\r\n filter: invert(1);\r\n }\r\n }\r\n\r\n .command-button-alt-disabled {\r\n cursor: pointer;\r\n pointer-events: none;\r\n width: 40px;\r\n margin-left: 5px;\r\n margin-right: 5px;\r\n .command-label {\r\n display: none;\r\n }\r\n\r\n background-color: white;\r\n .command-button-icon {\r\n height: 100%;\r\n width: 100%;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n }\r\n\r\n img {\r\n filter: invert(1);\r\n }\r\n }\r\n\r\n .command-button-alt-active {\r\n cursor: pointer;\r\n pointer-events: none;\r\n width: 40px;\r\n margin-left: 5px;\r\n margin-right: 5px;\r\n .command-label {\r\n display: none;\r\n }\r\n\r\n background-color: #c2c2c2;\r\n filter: invert(1);\r\n .command-button-icon {\r\n height: 100%;\r\n width: 100%;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n }\r\n }\r\n\r\n .floatLine {\r\n user-select: none;\r\n height: var(--spacingHeight);\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n display: grid;\r\n grid-template-columns: auto auto 2fr auto;\r\n flex-grow: 1;\r\n\r\n .label {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n min-width: 15px;\r\n font-weight: 600;\r\n }\r\n\r\n img {\r\n width: 30px;\r\n }\r\n\r\n .img {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .value {\r\n display: flex;\r\n align-items: center;\r\n grid-column: 3;\r\n background: transparent;\r\n height: 26px;\r\n input {\r\n width: 100%;\r\n background-color: white;\r\n height: 24px;\r\n }\r\n }\r\n\r\n .short {\r\n grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n width: 100%;\r\n }\r\n\r\n input::-webkit-outer-spin-button,\r\n input::-webkit-inner-spin-button {\r\n -webkit-appearance: none;\r\n margin: 0;\r\n }\r\n\r\n input[type=\"number\"] {\r\n -moz-appearance: textfield;\r\n }\r\n }\r\n }\r\n\r\n .vector3Line {\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n display: grid;\r\n .firstLine {\r\n display: grid;\r\n grid-template-columns: 1fr auto 20px;\r\n height: var(--spacingHeight);\r\n\r\n .label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .vector {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n text-align: right;\r\n opacity: 0.8;\r\n }\r\n\r\n .expand {\r\n grid-column: 3;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n }\r\n }\r\n\r\n .secondLine {\r\n display: grid;\r\n padding-right: 5px;\r\n border-left: 1px solid rgb(51, 122, 183);\r\n\r\n .no-right-margin {\r\n margin-right: 0;\r\n }\r\n\r\n .numeric {\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n }\r\n\r\n .numeric-label {\r\n text-align: right;\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n justify-self: right;\r\n margin-right: 10px;\r\n }\r\n\r\n .numeric-value {\r\n width: 120px;\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n border: 1px solid rgb(51, 122, 183);\r\n }\r\n }\r\n }\r\n\r\n .buttonLine {\r\n height: var(--spacingHeight);\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n display: grid;\r\n align-items: center;\r\n justify-items: stretch;\r\n padding-bottom: 5px;\r\n input[type=\"file\"] {\r\n display: none;\r\n }\r\n\r\n .file-upload {\r\n background: var(--backgroundGrey);\r\n border: 1px solid #424242;\r\n margin: 5px 10px;\r\n color: white;\r\n padding: 4px 5px;\r\n opacity: 0.9;\r\n cursor: pointer;\r\n text-align: center;\r\n border-radius: 4px;\r\n }\r\n\r\n .file-upload:hover {\r\n opacity: 1;\r\n }\r\n\r\n .file-upload:active {\r\n transform: scale(0.98);\r\n transform-origin: 0.5 0.5;\r\n }\r\n\r\n button {\r\n background: var(--backgroundGrey);\r\n border: 1px solid #424242;\r\n margin: 5px 10px 5px 10px;\r\n color: white;\r\n padding: 4px 5px;\r\n opacity: 0.9;\r\n border-radius: 4px;\r\n }\r\n\r\n button:hover {\r\n opacity: 1;\r\n }\r\n\r\n button:active {\r\n background: #282828;\r\n }\r\n\r\n button:focus {\r\n border: 1px solid #424242;\r\n outline: 0px;\r\n }\r\n }\r\n\r\n .numeric {\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n height: var(--spacingHeight);\r\n display: grid;\r\n grid-template-columns: 1fr 120px auto;\r\n\r\n .numeric-label {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .number {\r\n display: flex;\r\n align-items: center;\r\n grid-column: 2;\r\n height: 10px;\r\n .input {\r\n width: calc(100% - 5px);\r\n height: 10px;\r\n }\r\n }\r\n }\r\n\r\n .checkBoxLine {\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n height: var(--spacingHeight);\r\n display: grid;\r\n grid-template-columns: auto 1fr auto;\r\n flex-grow: 1;\r\n\r\n .label {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n min-width: 100px;\r\n margin-left: 15px;\r\n height: var(--spacingHeight);\r\n font-weight: 600;\r\n }\r\n\r\n img {\r\n width: 30px;\r\n }\r\n\r\n .img {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .hidden {\r\n display: none;\r\n }\r\n }\r\n\r\n .listLine {\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n height: var(--spacingHeight);\r\n display: grid;\r\n grid-template-columns: auto 1fr auto;\r\n flex-grow: 1;\r\n\r\n .label {\r\n grid-column: 2;\r\n display: none;\r\n align-items: center;\r\n }\r\n\r\n img {\r\n width: 30px;\r\n }\r\n\r\n .img {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .options {\r\n grid-column: 2;\r\n padding-left: 15px;\r\n display: flex;\r\n align-items: center;\r\n\r\n select {\r\n width: 100%;\r\n height: 25px;\r\n border: transparent;\r\n }\r\n\r\n input {\r\n width: 100%;\r\n height: 24px;\r\n color: #333333;\r\n }\r\n }\r\n }\r\n\r\n .color3Line {\r\n padding-left: 15px;\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n display: grid;\r\n flex-grow: 1;\r\n\r\n .firstLine {\r\n height: var(--spacingHeight);\r\n display: flex;\r\n align-items: center;\r\n\r\n .label {\r\n grid-column: 2;\r\n padding-left: 5px;\r\n display: none;\r\n align-items: center;\r\n min-width: 15px;\r\n }\r\n\r\n .img {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n img {\r\n width: 30px;\r\n height: 30px;\r\n }\r\n\r\n .textInputLine {\r\n grid-column: 3;\r\n padding-left: 2px;\r\n flex-grow: 1;\r\n }\r\n\r\n .color3 {\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n margin-right: 5px;\r\n }\r\n }\r\n\r\n .copy {\r\n grid-column: 4;\r\n display: none;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n color: black;\r\n img {\r\n height: 100%;\r\n width: 20px;\r\n }\r\n }\r\n\r\n .expand {\r\n grid-column: 4;\r\n display: none;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n\r\n img {\r\n height: 100%;\r\n width: 20px;\r\n }\r\n }\r\n }\r\n\r\n .secondLine {\r\n display: grid;\r\n padding-right: 5px;\r\n border-left: 1px solid rgb(51, 122, 183);\r\n\r\n .numeric {\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n }\r\n\r\n .numeric-label {\r\n text-align: right;\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n justify-self: right;\r\n margin-right: 10px;\r\n }\r\n\r\n .numeric-value {\r\n width: 120px;\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n border: 1px solid rgb(51, 122, 183);\r\n }\r\n }\r\n }\r\n\r\n .textLine {\r\n padding-left: $line-padding-left;\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n padding-right: $line-padding-right;\r\n height: auto;\r\n display: grid;\r\n grid-template-columns: auto auto 2fr 1fr;\r\n .label {\r\n grid-column: 2;\r\n padding-left: 5px;\r\n padding-top: 4px;\r\n display: flex;\r\n align-items: left;\r\n min-width: 15px;\r\n color: #a9a9a9;\r\n font-size: 10px;\r\n font-family: \"acumin-pro-semi-condensed\", sans-serif;\r\n font-weight: 600;\r\n }\r\n\r\n img {\r\n width: 30px;\r\n }\r\n\r\n .img {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .link-value {\r\n grid-column: 2;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n text-align: end;\r\n opacity: 0.8;\r\n margin: 5px;\r\n margin-top: 6px;\r\n max-width: 140px;\r\n text-decoration: underline;\r\n cursor: pointer;\r\n }\r\n\r\n .value {\r\n display: none;\r\n grid-column: 3;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n text-align: end;\r\n opacity: 0.8;\r\n margin: 5px;\r\n margin-top: 6px;\r\n max-width: 200px;\r\n -webkit-user-select: text;\r\n -moz-user-select: text;\r\n -ms-user-select: text;\r\n user-select: text;\r\n\r\n &.check {\r\n color: green;\r\n }\r\n\r\n &.uncheck {\r\n color: red;\r\n }\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
91
91
  // Exports
92
92
  ___CSS_LOADER_EXPORT___.locals = {};
93
93
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
@@ -49833,7 +49833,8 @@ const MessageDialog = (props) => {
49833
49833
  "use strict";
49834
49834
  __webpack_require__.r(__webpack_exports__);
49835
49835
  /* harmony export */ __webpack_require__.d(__webpack_exports__, {
49836
- /* harmony export */ "ClassNames": () => (/* binding */ ClassNames)
49836
+ /* harmony export */ "ClassNames": () => (/* binding */ ClassNames),
49837
+ /* harmony export */ "JoinClassNames": () => (/* binding */ JoinClassNames)
49837
49838
  /* harmony export */ });
49838
49839
  function ClassNames(names, styleObject) {
49839
49840
  let string = "";
@@ -49844,6 +49845,15 @@ function ClassNames(names, styleObject) {
49844
49845
  }
49845
49846
  return string;
49846
49847
  }
49848
+ function JoinClassNames(styleObject, ...names) {
49849
+ let string = "";
49850
+ for (const name of names) {
49851
+ if (name && styleObject[name]) {
49852
+ string += styleObject[name] + " ";
49853
+ }
49854
+ }
49855
+ return string;
49856
+ }
49847
49857
 
49848
49858
 
49849
49859
  /***/ }),
@@ -50637,11 +50647,13 @@ __webpack_require__.r(__webpack_exports__);
50637
50647
 
50638
50648
  // eslint-disable-next-line @typescript-eslint/naming-convention
50639
50649
  const Null_Value = Number.MAX_SAFE_INTEGER;
50650
+ const DEFAULT_FALLBACK_VALUE = -1;
50640
50651
  class OptionsLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
50641
50652
  constructor(props) {
50653
+ // Initialize default props
50642
50654
  super(props);
50643
50655
  this._localChange = false;
50644
- this.state = { value: this._remapValueIn(this._getValue(props)) };
50656
+ this.state = { value: this._remapValueIn(this._getValue(props)), addCustom: false };
50645
50657
  }
50646
50658
  _remapValueIn(value) {
50647
50659
  return this.props.allowNullValue && value === null ? Null_Value : value;
@@ -50660,11 +50672,14 @@ class OptionsLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
50660
50672
  this._localChange = false;
50661
50673
  return true;
50662
50674
  }
50663
- const newValue = this._remapValueIn(nextProps.extractValue ? nextProps.extractValue(this.props.target) : nextProps.target[nextProps.propertyName]);
50675
+ const newValue = this._remapValueIn(nextProps.extractValue ? nextProps.extractValue(nextProps.target) : nextProps.target[nextProps.propertyName]);
50664
50676
  if (newValue != null && newValue !== nextState.value) {
50665
50677
  nextState.value = newValue;
50666
50678
  return true;
50667
50679
  }
50680
+ if (this.props.options !== nextProps.options) {
50681
+ return true;
50682
+ }
50668
50683
  return false;
50669
50684
  }
50670
50685
  raiseOnPropertyChanged(newValue, previousValue) {
@@ -50683,23 +50698,65 @@ class OptionsLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
50683
50698
  this.setState({ value: value });
50684
50699
  }
50685
50700
  updateValue(valueString) {
50686
- const value = this.props.valuesAreStrings ? valueString : parseInt(valueString);
50701
+ let value = this.props.valuesAreStrings ? valueString : parseInt(valueString);
50702
+ if (isNaN(Number(value))) {
50703
+ for (let i = 0; i < this.props.options.length; i++) {
50704
+ if (this.props.options.at(i)?.label === valueString) {
50705
+ value = Number(this.props.options.at(i)?.value);
50706
+ }
50707
+ }
50708
+ }
50709
+ if (value === 0 && this.props.fromFontDropdown) {
50710
+ this.setState({ addCustom: true });
50711
+ }
50687
50712
  this._localChange = true;
50688
50713
  const store = this.props.extractValue ? this.props.extractValue(this.props.target) : this.props.target[this.props.propertyName];
50689
50714
  if (!this.props.noDirectUpdate) {
50690
50715
  this.props.target[this.props.propertyName] = this._remapValueOut(value);
50691
50716
  }
50692
- this.setState({ value: value });
50693
- if (this.props.onSelect) {
50694
- this.props.onSelect(value);
50717
+ //selecting a regular option from font dropdown
50718
+ if (value != 0 && this.props.fromFontDropdown) {
50719
+ this.setState({ value: value });
50720
+ if (this.props.onSelect) {
50721
+ this.props.onSelect(value);
50722
+ }
50723
+ //selecting 'custom font' from font dropdown
50724
+ }
50725
+ else if (this.props.fromFontDropdown) {
50726
+ if (this.props.onSelect) {
50727
+ this.props.onSelect(this.state.value);
50728
+ }
50729
+ }
50730
+ //selecting from a dropdown that's not font dropdown
50731
+ else {
50732
+ this.setState({ value: value });
50733
+ if (this.props.onSelect) {
50734
+ this.props.onSelect(value);
50735
+ }
50695
50736
  }
50696
50737
  const newValue = this.props.extractValue ? this.props.extractValue(this.props.target) : this.props.target[this.props.propertyName];
50697
50738
  this.raiseOnPropertyChanged(newValue, store);
50698
50739
  }
50740
+ updateCustomValue() {
50741
+ this.setState({ addCustom: false });
50742
+ }
50699
50743
  render() {
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) => {
50744
+ const fallback = this.props.fallbackValue !== undefined ? this.props.fallbackValue : DEFAULT_FALLBACK_VALUE;
50745
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { className: `listLine ${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: this.state.addCustom ? ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { type: "text", placeholder: "Enter a custom font here", onKeyDown: (event) => {
50746
+ event.key === "Enter" && this.props.addVal != undefined
50747
+ ? (this.props.addVal({ label: event.target.value, value: this.props.options.length + 1 }, Number(this.state.value)),
50748
+ this.updateCustomValue(),
50749
+ this.forceUpdate())
50750
+ : null;
50751
+ }, onBlur: (event) => {
50752
+ this.props.addVal != undefined
50753
+ ? (this.props.addVal({ label: event.target.value, value: this.props.options.length + 1 }, Number(this.state.value)),
50754
+ this.updateCustomValue(),
50755
+ this.forceUpdate())
50756
+ : null;
50757
+ } })) : ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("select", { onChange: (evt) => this.updateValue(evt.target.value), value: this.state.value === null || this.state.value === undefined ? fallback : this.state.value, children: this.props.options.map((option, i) => {
50701
50758
  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
- }) }) })] }));
50759
+ }) })) })] }));
50703
50760
  }
50704
50761
  }
50705
50762
 
@@ -51829,7 +51886,7 @@ class ButtonPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Com
51829
51886
  render() {
51830
51887
  const { rectangles, lockObject, onPropertyChangedObservable, onAddComponent } = this.props;
51831
51888
  const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_7__.makeTargetsProxy)(rectangles, onPropertyChangedObservable);
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: () => {
51889
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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: () => {
51833
51890
  onAddComponent("Text");
51834
51891
  } }), (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: () => {
51835
51892
  onAddComponent("ButtonImage");
@@ -51881,7 +51938,7 @@ class CheckboxPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.C
51881
51938
  }
51882
51939
  render() {
51883
51940
  const checkboxes = this.props.checkboxes;
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 })] })] }));
51941
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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 })] })] }));
51885
51942
  }
51886
51943
  }
51887
51944
 
@@ -51921,7 +51978,7 @@ class ColorPickerPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1_
51921
51978
  }
51922
51979
  render() {
51923
51980
  const colorPickers = this.props.colorPickers;
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 })] })] }));
51981
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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 })] })] }));
51925
51982
  }
51926
51983
  }
51927
51984
 
@@ -51955,33 +52012,35 @@ __webpack_require__.r(__webpack_exports__);
51955
52012
  /* harmony import */ var core_Maths_math__WEBPACK_IMPORTED_MODULE_11___default = /*#__PURE__*/__webpack_require__.n(core_Maths_math__WEBPACK_IMPORTED_MODULE_11__);
51956
52013
  /* harmony import */ var shared_ui_components_lines_iconComponent__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! shared-ui-components/lines/iconComponent */ "../../../dev/sharedUiComponents/dist/lines/iconComponent.js");
51957
52014
  /* harmony import */ var shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! shared-ui-components/lines/optionsLineComponent */ "../../../dev/sharedUiComponents/dist/lines/optionsLineComponent.js");
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");
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");
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");
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");
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");
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
- /* 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
- /* 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
- /* 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");
51979
- /* harmony import */ var shared_ui_components_imgs_vAlignCenterIcon_svg__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! shared-ui-components/imgs/vAlignCenterIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/vAlignCenterIcon.svg");
51980
- /* harmony import */ var shared_ui_components_imgs_vAlignTopIcon_svg__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! shared-ui-components/imgs/vAlignTopIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/vAlignTopIcon.svg");
51981
- /* harmony import */ var shared_ui_components_imgs_vAlignBottomIcon_svg__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! shared-ui-components/imgs/vAlignBottomIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/vAlignBottomIcon.svg");
51982
- /* harmony import */ var shared_ui_components_imgs_descendantsOnlyPaddingIcon_svg__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! shared-ui-components/imgs/descendantsOnlyPaddingIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/descendantsOnlyPaddingIcon.svg");
52015
+ /* harmony import */ var shared_ui_components_imgs_sizeIcon_svg__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! shared-ui-components/imgs/sizeIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/sizeIcon.svg");
52016
+ /* harmony import */ var shared_ui_components_imgs_verticalMarginIcon_svg__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! shared-ui-components/imgs/verticalMarginIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/verticalMarginIcon.svg");
52017
+ /* harmony import */ var shared_ui_components_imgs_positionIcon_svg__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! shared-ui-components/imgs/positionIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/positionIcon.svg");
52018
+ /* harmony import */ var shared_ui_components_imgs_fontFamilyIcon_svg__WEBPACK_IMPORTED_MODULE_38__ = __webpack_require__(/*! shared-ui-components/imgs/fontFamilyIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/fontFamilyIcon.svg");
52019
+ /* harmony import */ var shared_ui_components_imgs_alphaIcon_svg__WEBPACK_IMPORTED_MODULE_34__ = __webpack_require__(/*! shared-ui-components/imgs/alphaIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/alphaIcon.svg");
52020
+ /* harmony import */ var shared_ui_components_imgs_fontSizeIcon_svg__WEBPACK_IMPORTED_MODULE_41__ = __webpack_require__(/*! shared-ui-components/imgs/fontSizeIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/fontSizeIcon.svg");
52021
+ /* harmony import */ var shared_ui_components_imgs_fontStyleIcon_svg__WEBPACK_IMPORTED_MODULE_40__ = __webpack_require__(/*! shared-ui-components/imgs/fontStyleIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/fontStyleIcon.svg");
52022
+ /* harmony import */ var shared_ui_components_imgs_fontWeightIcon_svg__WEBPACK_IMPORTED_MODULE_39__ = __webpack_require__(/*! shared-ui-components/imgs/fontWeightIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/fontWeightIcon.svg");
52023
+ /* harmony import */ var shared_ui_components_imgs_rotationIcon_svg__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! shared-ui-components/imgs/rotationIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/rotationIcon.svg");
52024
+ /* harmony import */ var shared_ui_components_imgs_pivotIcon_svg__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! shared-ui-components/imgs/pivotIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/pivotIcon.svg");
52025
+ /* harmony import */ var shared_ui_components_imgs_scaleIcon_svg__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! shared-ui-components/imgs/scaleIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/scaleIcon.svg");
52026
+ /* harmony import */ var shared_ui_components_imgs_shadowBlurIcon_svg__WEBPACK_IMPORTED_MODULE_37__ = __webpack_require__(/*! shared-ui-components/imgs/shadowBlurIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/shadowBlurIcon.svg");
52027
+ /* harmony import */ var shared_ui_components_imgs_horizontalMarginIcon_svg__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! shared-ui-components/imgs/horizontalMarginIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/horizontalMarginIcon.svg");
52028
+ /* harmony import */ var shared_ui_components_imgs_shadowColorIcon_svg__WEBPACK_IMPORTED_MODULE_35__ = __webpack_require__(/*! shared-ui-components/imgs/shadowColorIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/shadowColorIcon.svg");
52029
+ /* harmony import */ var shared_ui_components_imgs_shadowOffsetXIcon_svg__WEBPACK_IMPORTED_MODULE_36__ = __webpack_require__(/*! shared-ui-components/imgs/shadowOffsetXIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/shadowOffsetXIcon.svg");
52030
+ /* harmony import */ var shared_ui_components_imgs_colorIcon_svg__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! shared-ui-components/imgs/colorIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/colorIcon.svg");
52031
+ /* harmony import */ var shared_ui_components_imgs_fillColorIcon_svg__WEBPACK_IMPORTED_MODULE_33__ = __webpack_require__(/*! shared-ui-components/imgs/fillColorIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/fillColorIcon.svg");
52032
+ /* harmony import */ var shared_ui_components_imgs_linkedMeshOffsetIcon_svg__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! shared-ui-components/imgs/linkedMeshOffsetIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/linkedMeshOffsetIcon.svg");
52033
+ /* harmony import */ var shared_ui_components_imgs_hAlignCenterIcon_svg__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! shared-ui-components/imgs/hAlignCenterIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/hAlignCenterIcon.svg");
52034
+ /* harmony import */ var shared_ui_components_imgs_hAlignLeftIcon_svg__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! shared-ui-components/imgs/hAlignLeftIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/hAlignLeftIcon.svg");
52035
+ /* harmony import */ var shared_ui_components_imgs_hAlignRightIcon_svg__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! shared-ui-components/imgs/hAlignRightIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/hAlignRightIcon.svg");
52036
+ /* harmony import */ var shared_ui_components_imgs_vAlignCenterIcon_svg__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! shared-ui-components/imgs/vAlignCenterIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/vAlignCenterIcon.svg");
52037
+ /* harmony import */ var shared_ui_components_imgs_vAlignTopIcon_svg__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! shared-ui-components/imgs/vAlignTopIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/vAlignTopIcon.svg");
52038
+ /* harmony import */ var shared_ui_components_imgs_vAlignBottomIcon_svg__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! shared-ui-components/imgs/vAlignBottomIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/vAlignBottomIcon.svg");
52039
+ /* harmony import */ var shared_ui_components_imgs_descendantsOnlyPaddingIcon_svg__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! shared-ui-components/imgs/descendantsOnlyPaddingIcon.svg */ "../../../dev/sharedUiComponents/dist/imgs/descendantsOnlyPaddingIcon.svg");
51983
52040
  /* harmony import */ var shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! shared-ui-components/lines/floatLineComponent */ "../../../dev/sharedUiComponents/dist/lines/floatLineComponent.js");
51984
52041
  /* harmony import */ var shared_ui_components_lines_unitButton__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! shared-ui-components/lines/unitButton */ "../../../dev/sharedUiComponents/dist/lines/unitButton.js");
52042
+ /* harmony import */ var _diagram_workbench__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ../../../../diagram/workbench */ "../../../tools/guiEditor/dist/diagram/workbench.js");
52043
+
51985
52044
 
51986
52045
 
51987
52046
 
@@ -52028,6 +52087,69 @@ __webpack_require__.r(__webpack_exports__);
52028
52087
  class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
52029
52088
  constructor(props) {
52030
52089
  super(props);
52090
+ this.addVal = (newVal, prevVal) => {
52091
+ if (newVal.label === "") {
52092
+ return;
52093
+ }
52094
+ if (this.props.globalState) {
52095
+ this.props.globalState.usePrevSelected = true;
52096
+ }
52097
+ (async () => {
52098
+ await document.fonts.ready;
52099
+ let displayVal = false;
52100
+ const fonts = this.state.fontFamilyOptions;
52101
+ if (!(fonts.find((element) => element.label.toLowerCase() === newVal.label.toLowerCase()) === undefined)) {
52102
+ setTimeout(() => {
52103
+ if (this.props.globalState) {
52104
+ this.props.globalState.hostWindow.alert("This font is already available");
52105
+ }
52106
+ }, 100);
52107
+ return;
52108
+ }
52109
+ else {
52110
+ if (!document.fonts.check(`12px "${newVal.label}"`)) {
52111
+ //Settimeout used due to race conditions with other events
52112
+ setTimeout(() => {
52113
+ if (this.props.globalState) {
52114
+ alert("This font is not supported in the browser");
52115
+ }
52116
+ }, 100);
52117
+ return;
52118
+ }
52119
+ else {
52120
+ fonts.push(newVal);
52121
+ this.setState({
52122
+ fontFamilyOptions: [...fonts],
52123
+ });
52124
+ displayVal = true;
52125
+ }
52126
+ }
52127
+ window.sessionStorage.setItem("fonts", JSON.stringify(this.state.fontFamilyOptions));
52128
+ if (displayVal) {
52129
+ this.selectCustomVal();
52130
+ }
52131
+ else {
52132
+ this.keepPrevVal(prevVal);
52133
+ }
52134
+ })();
52135
+ };
52136
+ this.state = {
52137
+ fontFamilyOptions: JSON.parse(String(window.sessionStorage.getItem("fonts")))
52138
+ ? JSON.parse(String(window.sessionStorage.getItem("fonts")))
52139
+ : [
52140
+ { label: "Custom Font", value: 0 },
52141
+ { label: "Arial", value: 1 },
52142
+ { label: "Verdana", value: 2 },
52143
+ { label: "Helvetica", value: 3 },
52144
+ { label: "Trebuchet MS", value: 4 },
52145
+ { label: "Times New Roman", value: 5 },
52146
+ { label: "Georgia", value: 6 },
52147
+ { label: "Garamond", value: 7 },
52148
+ { label: "Courier New", value: 8 },
52149
+ { label: "Brush Script MT", value: 9 },
52150
+ ],
52151
+ value: 0,
52152
+ };
52031
52153
  const controls = this.props.controls;
52032
52154
  for (const control of controls) {
52033
52155
  const transformed = this._getTransformedReferenceCoordinate(control);
@@ -52036,6 +52158,9 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
52036
52158
  }
52037
52159
  control.metadata._previousCenter = transformed;
52038
52160
  }
52161
+ this._onFontsParsedObserver = this.props.onFontsParsedObservable?.add(() => {
52162
+ this._checkFontsInLayout();
52163
+ });
52039
52164
  this._onPropertyChangedObserver = this.props.onPropertyChangedObservable?.add((event) => {
52040
52165
  const isTransformEvent = event.property === "transformCenterX" || event.property === "transformCenterY";
52041
52166
  for (const control of controls) {
@@ -52055,6 +52180,33 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
52055
52180
  }
52056
52181
  });
52057
52182
  }
52183
+ componentWillMount() {
52184
+ this._checkFontsInLayout();
52185
+ }
52186
+ _checkFontsInLayout() {
52187
+ const correctFonts = [];
52188
+ correctFonts.push({ label: "Custom Font", value: 0 });
52189
+ for (const font of this.state.fontFamilyOptions.values()) {
52190
+ if (document.fonts.check(`12px "${font.label}"`) && font.label != "Custom Font") {
52191
+ correctFonts.push(font);
52192
+ }
52193
+ }
52194
+ const correctLabels = correctFonts.map((element) => element.label);
52195
+ const moreFonts = _diagram_workbench__WEBPACK_IMPORTED_MODULE_16__.WorkbenchComponent.addedFonts;
52196
+ for (let i = 0; i < moreFonts.length; i++) {
52197
+ if (!correctLabels.includes(moreFonts[i]) && document.fonts.check(`12px "${moreFonts[i]}"`)) {
52198
+ correctFonts.push({ label: moreFonts[i], value: correctFonts.length + 1 });
52199
+ correctLabels.push(moreFonts[i]);
52200
+ }
52201
+ else if (!document.fonts.check(`12px "${moreFonts[i]}"`)) {
52202
+ alert("The font " + moreFonts[i] + " is unable to load");
52203
+ }
52204
+ }
52205
+ this.setState({
52206
+ fontFamilyOptions: correctFonts,
52207
+ });
52208
+ window.sessionStorage.setItem("fonts", JSON.stringify(correctFonts));
52209
+ }
52058
52210
  _getTransformedReferenceCoordinate(control) {
52059
52211
  const nodeMatrix = _diagram_coordinateHelper__WEBPACK_IMPORTED_MODULE_10__.CoordinateHelper.GetNodeMatrix(control);
52060
52212
  const transformed = new core_Maths_math__WEBPACK_IMPORTED_MODULE_11__.Vector2(1, 1);
@@ -52112,10 +52264,25 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
52112
52264
  });
52113
52265
  }
52114
52266
  }
52267
+ selectCustomVal() {
52268
+ const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_9__.makeTargetsProxy)(this.props.controls, this.props.onPropertyChangedObservable);
52269
+ const fonts = this.state.fontFamilyOptions;
52270
+ proxy.fontFamily = fonts.at(fonts.length - 1)?.label ?? "";
52271
+ this.setState({ value: fonts.length });
52272
+ window.sessionStorage.setItem("fonts", JSON.stringify(this.state.fontFamilyOptions));
52273
+ }
52274
+ keepPrevVal(prevVal) {
52275
+ const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_9__.makeTargetsProxy)(this.props.controls, this.props.onPropertyChangedObservable);
52276
+ proxy.fontFamily = this.state.fontFamilyOptions.filter(({ value }) => value === prevVal).map(({ label }) => label)[0];
52277
+ this.setState({ value: prevVal });
52278
+ }
52115
52279
  componentWillUnmount() {
52116
52280
  if (this._onPropertyChangedObserver) {
52117
52281
  this.props.onPropertyChangedObservable?.remove(this._onPropertyChangedObserver);
52118
52282
  }
52283
+ if (this._onFontsParsedObserver) {
52284
+ this.props.onFontsParsedObservable?.remove(this._onFontsParsedObserver);
52285
+ }
52119
52286
  }
52120
52287
  render() {
52121
52288
  const controls = this.props.controls;
@@ -52208,6 +52375,7 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
52208
52375
  ];
52209
52376
  let horizontalDisabled = false, verticalDisabled = false, widthUnitsLocked = false, heightUnitsLocked = false;
52210
52377
  const parent = controls[0].parent;
52378
+ const fonts = this.state.fontFamilyOptions;
52211
52379
  if (parent?.getClassName() === "StackPanel" || parent?.getClassName() === "VirtualKeyboard") {
52212
52380
  if (parent.isVertical) {
52213
52381
  verticalDisabled = true;
@@ -52218,19 +52386,19 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
52218
52386
  widthUnitsLocked = true;
52219
52387
  }
52220
52388
  }
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: () => {
52389
+ 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_17__, shortcut: "", isActive: horizontalAlignment === gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.HORIZONTAL_ALIGNMENT_LEFT, onClick: () => {
52222
52390
  this._updateAlignment("horizontalAlignment", gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.HORIZONTAL_ALIGNMENT_LEFT);
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: () => {
52391
+ }, 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_18__, shortcut: "", isActive: horizontalAlignment === gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.HORIZONTAL_ALIGNMENT_CENTER, onClick: () => {
52224
52392
  this._updateAlignment("horizontalAlignment", gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.HORIZONTAL_ALIGNMENT_CENTER);
52225
- }, disabled: horizontalDisabled }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__.CommandButtonComponent, { tooltip: "Right", icon: shared_ui_components_imgs_hAlignRightIcon_svg__WEBPACK_IMPORTED_MODULE_18__, shortcut: "", isActive: horizontalAlignment === gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.HORIZONTAL_ALIGNMENT_RIGHT, onClick: () => {
52393
+ }, disabled: horizontalDisabled }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__.CommandButtonComponent, { tooltip: "Right", icon: shared_ui_components_imgs_hAlignRightIcon_svg__WEBPACK_IMPORTED_MODULE_19__, shortcut: "", isActive: horizontalAlignment === gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.HORIZONTAL_ALIGNMENT_RIGHT, onClick: () => {
52226
52394
  this._updateAlignment("horizontalAlignment", gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.HORIZONTAL_ALIGNMENT_RIGHT);
52227
- }, disabled: horizontalDisabled }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__.CommandButtonComponent, { tooltip: "Top", icon: shared_ui_components_imgs_vAlignTopIcon_svg__WEBPACK_IMPORTED_MODULE_19__, shortcut: "", isActive: verticalAlignment === gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.VERTICAL_ALIGNMENT_TOP, onClick: () => {
52395
+ }, disabled: horizontalDisabled }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__.CommandButtonComponent, { tooltip: "Top", icon: shared_ui_components_imgs_vAlignTopIcon_svg__WEBPACK_IMPORTED_MODULE_20__, shortcut: "", isActive: verticalAlignment === gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.VERTICAL_ALIGNMENT_TOP, onClick: () => {
52228
52396
  this._updateAlignment("verticalAlignment", gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.VERTICAL_ALIGNMENT_TOP);
52229
- }, disabled: verticalDisabled }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__.CommandButtonComponent, { tooltip: "Center", icon: shared_ui_components_imgs_vAlignCenterIcon_svg__WEBPACK_IMPORTED_MODULE_20__, shortcut: "", isActive: verticalAlignment === gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.VERTICAL_ALIGNMENT_CENTER, onClick: () => {
52397
+ }, disabled: verticalDisabled }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__.CommandButtonComponent, { tooltip: "Center", icon: shared_ui_components_imgs_vAlignCenterIcon_svg__WEBPACK_IMPORTED_MODULE_21__, shortcut: "", isActive: verticalAlignment === gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.VERTICAL_ALIGNMENT_CENTER, onClick: () => {
52230
52398
  this._updateAlignment("verticalAlignment", gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.VERTICAL_ALIGNMENT_CENTER);
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: () => {
52399
+ }, 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_22__, shortcut: "", isActive: verticalAlignment === gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.VERTICAL_ALIGNMENT_BOTTOM, onClick: () => {
52232
52400
  this._updateAlignment("verticalAlignment", gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__.Control.VERTICAL_ALIGNMENT_BOTTOM);
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) => {
52401
+ }, 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_23__, 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_24__, 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) => {
52234
52402
  for (const control of controls) {
52235
52403
  if (control.typeName === "Image") {
52236
52404
  control.autoScale = false;
@@ -52260,19 +52428,29 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
52260
52428
  }
52261
52429
  }
52262
52430
  this._checkAndUpdateValues("height", newValue);
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) => {
52431
+ }, 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_25__, 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) => {
52264
52432
  this._checkAndUpdateValues("paddingTop", newValue);
52265
52433
  this._markChildrenAsDirty();
52266
52434
  }, 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) => {
52267
52435
  this._checkAndUpdateValues("paddingBottom", newValue);
52268
52436
  this._markChildrenAsDirty();
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) => {
52437
+ }, 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_26__, 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) => {
52270
52438
  this._checkAndUpdateValues("paddingLeft", newValue);
52271
52439
  this._markChildrenAsDirty();
52272
52440
  }, 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) => {
52273
52441
  this._checkAndUpdateValues("paddingRight", newValue);
52274
52442
  this._markChildrenAsDirty();
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) => {
52443
+ }, 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_27__, 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_28__, 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_29__, 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_30__, 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_31__, 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_32__, 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_33__, 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_34__, 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_35__, 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_36__, 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_37__, 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_38__, label: "Font Family" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_13__.OptionsLineComponent, { label: "", target: proxy, propertyName: "fontFamily", valueProp: this.state.value, options: fonts, addVal: this.addVal, fromFontDropdown: true, fallbackValue: 1, onSelect: (newValue) => {
52444
+ const fontFamily = this.state.fontFamilyOptions.filter(({ value }) => value === newValue).map(({ label }) => label);
52445
+ proxy.fontFamily = fontFamily[0];
52446
+ }, extractValue: () => {
52447
+ if (this.state.fontFamilyOptions.filter(({ label }) => label === proxy.fontFamily)[0].label) {
52448
+ return this.state.fontFamilyOptions.filter(({ label }) => label === proxy.fontFamily)[0].value;
52449
+ }
52450
+ else {
52451
+ return -1;
52452
+ }
52453
+ } })] }), (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_39__, 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_40__, 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, fromFontDropdown: false, onSelect: (newValue) => {
52276
52454
  proxy.fontStyle = ["", "italic", "oblique"][newValue];
52277
52455
  }, extractValue: () => {
52278
52456
  switch (proxy.fontStyle) {
@@ -52283,7 +52461,7 @@ class CommonControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
52283
52461
  default:
52284
52462
  return 0;
52285
52463
  }
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) })] })] }))] }));
52464
+ } })] }), (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_41__, 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) })] })] }))] }));
52287
52465
  }
52288
52466
  }
52289
52467
 
@@ -52353,7 +52531,7 @@ class ControlPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Co
52353
52531
  }
52354
52532
  render() {
52355
52533
  const controls = this.props.controls;
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 }) }));
52534
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }) }));
52357
52535
  }
52358
52536
  }
52359
52537
 
@@ -52410,7 +52588,7 @@ class DisplayGridPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1_
52410
52588
  render() {
52411
52589
  const { displayGrids, lockObject, onPropertyChangedObservable } = this.props;
52412
52590
  const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__.makeTargetsProxy)(displayGrids, onPropertyChangedObservable);
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 })] })] }))] }));
52591
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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 })] })] }))] }));
52414
52592
  }
52415
52593
  }
52416
52594
 
@@ -52455,7 +52633,7 @@ class EllipsePropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Co
52455
52633
  render() {
52456
52634
  const { ellipses, onPropertyChangedObservable, lockObject } = this.props;
52457
52635
  const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_5__.makeTargetsProxy)(ellipses, onPropertyChangedObservable);
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 })] }));
52636
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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 })] }));
52459
52637
  }
52460
52638
  }
52461
52639
 
@@ -52714,7 +52892,7 @@ class GridPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
52714
52892
  if (grid !== this._previousGrid) {
52715
52893
  this.resetValues();
52716
52894
  }
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: () => {
52895
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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: () => {
52718
52896
  let total = 0;
52719
52897
  let count = 0;
52720
52898
  for (let i = 0; i < grid.rowCount; ++i) {
@@ -52853,7 +53031,7 @@ class ImageBasedSliderPropertyGridComponent extends react__WEBPACK_IMPORTED_MODU
52853
53031
  }
52854
53032
  render() {
52855
53033
  const imageBasedSliders = this.props.imageBasedSliders;
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 })] }));
53034
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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 })] }));
52857
53035
  }
52858
53036
  }
52859
53037
 
@@ -52985,7 +53163,7 @@ class ImagePropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Comp
52985
53163
  const maxCells = this.getMaxCells();
52986
53164
  const maxCellWidth = Math.max(...images.map((image) => image.imageWidth));
52987
53165
  const maxCellHeight = Math.max(...images.map((image) => image.imageHeight));
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: () => {
53166
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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: () => {
52989
53167
  image.populateNinePatchSlicesFromImage = false;
52990
53168
  this.forceUpdate();
52991
53169
  } }), (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: () => {
@@ -53076,7 +53254,7 @@ class InputTextPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.
53076
53254
  render() {
53077
53255
  const { inputTexts, onPropertyChangedObservable, lockObject } = this.props;
53078
53256
  const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_8__.makeTargetsProxy)(inputTexts, onPropertyChangedObservable);
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" })] })] }));
53257
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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" })] })] }));
53080
53258
  }
53081
53259
  }
53082
53260
 
@@ -53155,7 +53333,7 @@ class LinePropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
53155
53333
  });
53156
53334
  }
53157
53335
  const dashString = dashes.join(",");
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 })] }));
53336
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState })] }));
53159
53337
  }
53160
53338
  }
53161
53339
 
@@ -53205,7 +53383,7 @@ class RadioButtonPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1_
53205
53383
  }
53206
53384
  render() {
53207
53385
  const radioButtons = this.props.radioButtons;
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" })] })] }));
53386
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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" })] })] }));
53209
53387
  }
53210
53388
  }
53211
53389
 
@@ -53252,7 +53430,7 @@ class RectanglePropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.
53252
53430
  render() {
53253
53431
  const { rectangles, lockObject, onPropertyChangedObservable } = this.props;
53254
53432
  const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_5__.makeTargetsProxy)(rectangles, onPropertyChangedObservable);
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 })] }));
53433
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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 })] }));
53256
53434
  }
53257
53435
  }
53258
53436
 
@@ -53307,7 +53485,7 @@ class ScrollViewerPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1
53307
53485
  render() {
53308
53486
  const { scrollViewers, onPropertyChangedObservable, lockObject } = this.props;
53309
53487
  const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__.makeTargetsProxy)(scrollViewers, onPropertyChangedObservable);
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 })] })] }));
53488
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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 })] })] }));
53311
53489
  }
53312
53490
  }
53313
53491
 
@@ -53339,7 +53517,7 @@ class SliderGenericPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_
53339
53517
  }
53340
53518
  render() {
53341
53519
  const sliders = this.props.sliders;
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 })] }));
53520
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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 })] }));
53343
53521
  }
53344
53522
  }
53345
53523
 
@@ -53457,7 +53635,7 @@ class StackPanelPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__
53457
53635
  render() {
53458
53636
  const { stackPanels, lockObject, onPropertyChangedObservable } = this.props;
53459
53637
  const proxy = (0,shared_ui_components_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_7__.makeTargetsProxy)(stackPanels, onPropertyChangedObservable);
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: () => {
53638
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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: () => {
53461
53639
  for (const panel of stackPanels) {
53462
53640
  for (const child of panel.children) {
53463
53641
  if (proxy.isVertical) {
@@ -53547,7 +53725,7 @@ class TextBlockPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1__.
53547
53725
  { label: "Ellipsis", value: gui_2D_controls_textBlock__WEBPACK_IMPORTED_MODULE_3__.TextWrapping.Ellipsis },
53548
53726
  { label: "Word wrap", value: gui_2D_controls_textBlock__WEBPACK_IMPORTED_MODULE_3__.TextWrapping.WordWrap },
53549
53727
  ];
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" })] })] }));
53728
+ 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, onFontsParsedObservable: this.props.onFontsParsedObservable, globalState: this.props.globalState }), (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" })] })] }));
53551
53729
  }
53552
53730
  }
53553
53731
 
@@ -53793,62 +53971,62 @@ class PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
53793
53971
  switch (className) {
53794
53972
  case "TextBlock": {
53795
53973
  const textBlocks = nodes;
53796
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_textBlockPropertyGridComponent__WEBPACK_IMPORTED_MODULE_8__.TextBlockPropertyGridComponent, { textBlocks: textBlocks, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
53974
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_textBlockPropertyGridComponent__WEBPACK_IMPORTED_MODULE_8__.TextBlockPropertyGridComponent, { textBlocks: textBlocks, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53797
53975
  }
53798
53976
  case "InputText": {
53799
53977
  const inputTexts = nodes;
53800
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_inputTextPropertyGridComponent__WEBPACK_IMPORTED_MODULE_9__.InputTextPropertyGridComponent, { inputTexts: inputTexts, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
53978
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_inputTextPropertyGridComponent__WEBPACK_IMPORTED_MODULE_9__.InputTextPropertyGridComponent, { inputTexts: inputTexts, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53801
53979
  }
53802
53980
  case "ColorPicker": {
53803
53981
  const colorPickers = nodes;
53804
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_colorPickerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_10__.ColorPickerPropertyGridComponent, { colorPickers: colorPickers, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
53982
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_colorPickerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_10__.ColorPickerPropertyGridComponent, { colorPickers: colorPickers, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53805
53983
  }
53806
53984
  case "Image": {
53807
53985
  const images = nodes;
53808
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_imagePropertyGridComponent__WEBPACK_IMPORTED_MODULE_11__.ImagePropertyGridComponent, { images: images, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
53986
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_imagePropertyGridComponent__WEBPACK_IMPORTED_MODULE_11__.ImagePropertyGridComponent, { images: images, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53809
53987
  }
53810
53988
  case "Slider": {
53811
53989
  const sliders = nodes;
53812
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_sliderGenericPropertyGridComponent__WEBPACK_IMPORTED_MODULE_5__.SliderGenericPropertyGridComponent, { sliders: sliders, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
53990
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_sliderGenericPropertyGridComponent__WEBPACK_IMPORTED_MODULE_5__.SliderGenericPropertyGridComponent, { sliders: sliders, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53813
53991
  }
53814
53992
  case "ImageBasedSlider": {
53815
53993
  const imageBasedSliders = nodes;
53816
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_imageBasedSliderPropertyGridComponent__WEBPACK_IMPORTED_MODULE_12__.ImageBasedSliderPropertyGridComponent, { imageBasedSliders: imageBasedSliders, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
53994
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_imageBasedSliderPropertyGridComponent__WEBPACK_IMPORTED_MODULE_12__.ImageBasedSliderPropertyGridComponent, { imageBasedSliders: imageBasedSliders, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53817
53995
  }
53818
53996
  case "Rectangle": {
53819
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_rectanglePropertyGridComponent__WEBPACK_IMPORTED_MODULE_13__.RectanglePropertyGridComponent, { rectangles: nodes, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
53997
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_rectanglePropertyGridComponent__WEBPACK_IMPORTED_MODULE_13__.RectanglePropertyGridComponent, { rectangles: nodes, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable }));
53820
53998
  }
53821
53999
  case "StackPanel": {
53822
54000
  const stackPanels = nodes;
53823
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_stackPanelPropertyGridComponent__WEBPACK_IMPORTED_MODULE_14__.StackPanelPropertyGridComponent, { stackPanels: stackPanels, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
54001
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_stackPanelPropertyGridComponent__WEBPACK_IMPORTED_MODULE_14__.StackPanelPropertyGridComponent, { stackPanels: stackPanels, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53824
54002
  }
53825
54003
  case "Grid": {
53826
54004
  const grids = nodes;
53827
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_gridPropertyGridComponent__WEBPACK_IMPORTED_MODULE_15__.GridPropertyGridComponent, { grids: grids, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onUpdateRequiredObservable: this.props.globalState.onUpdateRequiredObservable }));
54005
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_gridPropertyGridComponent__WEBPACK_IMPORTED_MODULE_15__.GridPropertyGridComponent, { grids: grids, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53828
54006
  }
53829
54007
  case "ScrollViewer": {
53830
54008
  const scrollViewers = nodes;
53831
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_scrollViewerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_16__.ScrollViewerPropertyGridComponent, { scrollViewers: scrollViewers, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
54009
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_scrollViewerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_16__.ScrollViewerPropertyGridComponent, { scrollViewers: scrollViewers, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53832
54010
  }
53833
54011
  case "Ellipse": {
53834
54012
  const ellipses = nodes;
53835
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_ellipsePropertyGridComponent__WEBPACK_IMPORTED_MODULE_17__.EllipsePropertyGridComponent, { ellipses: ellipses, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
54013
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_ellipsePropertyGridComponent__WEBPACK_IMPORTED_MODULE_17__.EllipsePropertyGridComponent, { ellipses: ellipses, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53836
54014
  }
53837
54015
  case "Checkbox": {
53838
54016
  const checkboxes = nodes;
53839
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_checkboxPropertyGridComponent__WEBPACK_IMPORTED_MODULE_18__.CheckboxPropertyGridComponent, { checkboxes: checkboxes, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
54017
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_checkboxPropertyGridComponent__WEBPACK_IMPORTED_MODULE_18__.CheckboxPropertyGridComponent, { checkboxes: checkboxes, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53840
54018
  }
53841
54019
  case "RadioButton": {
53842
54020
  const radioButtons = nodes;
53843
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_radioButtonPropertyGridComponent__WEBPACK_IMPORTED_MODULE_7__.RadioButtonPropertyGridComponent, { radioButtons: radioButtons, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
54021
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_radioButtonPropertyGridComponent__WEBPACK_IMPORTED_MODULE_7__.RadioButtonPropertyGridComponent, { radioButtons: radioButtons, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53844
54022
  }
53845
54023
  case "Line": {
53846
54024
  const lines = nodes;
53847
- return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_linePropertyGridComponent__WEBPACK_IMPORTED_MODULE_6__.LinePropertyGridComponent, { lines: lines, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable });
54025
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_linePropertyGridComponent__WEBPACK_IMPORTED_MODULE_6__.LinePropertyGridComponent, { lines: lines, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53848
54026
  }
53849
54027
  case "DisplayGrid": {
53850
54028
  const displayGrids = nodes;
53851
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_displayGridPropertyGridComponent__WEBPACK_IMPORTED_MODULE_23__.DisplayGridPropertyGridComponent, { displayGrids: displayGrids, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
54029
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_displayGridPropertyGridComponent__WEBPACK_IMPORTED_MODULE_23__.DisplayGridPropertyGridComponent, { displayGrids: displayGrids, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53852
54030
  }
53853
54031
  case "Button": {
53854
54032
  const buttons = nodes;
@@ -53859,11 +54037,11 @@ class PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
53859
54037
  button.addControl(guiElement);
53860
54038
  this.props.globalState.select(guiElement);
53861
54039
  }
53862
- } }, "buttonMenu"));
54040
+ }, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }, "buttonMenu"));
53863
54041
  }
53864
54042
  }
53865
54043
  const controls = nodes;
53866
- return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_controlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_19__.ControlPropertyGridComponent, { controls: controls, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable });
54044
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_propertyGrids_gui_controlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_19__.ControlPropertyGridComponent, { controls: controls, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onFontsParsedObservable: this.props.globalState.onFontsParsedObservable, globalState: this.props.globalState }));
53867
54045
  }
53868
54046
  renderControlIcon(nodes) {
53869
54047
  const node = nodes[0];
@@ -55011,7 +55189,7 @@ class CoordinateHelper {
55011
55189
  const engine = this.GlobalState.workbench._scene.getEngine();
55012
55190
  return new core_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__.Vector2(x + engine.getRenderWidth() / 2, y + engine.getRenderHeight() / 2);
55013
55191
  }
55014
- static MousePointerToRTTSpace(node, x, y) {
55192
+ static MousePointerToRTTSpace(_node, x, y) {
55015
55193
  const scene = this.GlobalState.workbench._scene;
55016
55194
  const engine = scene.getEngine();
55017
55195
  return new core_Maths_math_vector__WEBPACK_IMPORTED_MODULE_1__.Vector2((x || scene.pointerX) - engine.getRenderWidth() / 2, (y || scene.pointerY) - engine.getRenderHeight() / 2);
@@ -55718,11 +55896,11 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
55718
55896
  this._isOverGUINode = [];
55719
55897
  this._doubleClick = null;
55720
55898
  this._liveGuiTextureRerender = true;
55899
+ this._currLeft = 0;
55900
+ this._currTop = 0;
55721
55901
  this._controlsHit = [];
55722
55902
  this._pointerTravelDistance = 0;
55723
55903
  this._processSelectionOnUp = false;
55724
- this._currLeft = 0;
55725
- this._currTop = 0;
55726
55904
  this._nextLiveGuiRender = -1;
55727
55905
  this._liveGuiRerenderDelay = 30;
55728
55906
  this._defaultGUISize = { width: 1024, height: 1024 };
@@ -55844,6 +56022,9 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
55844
56022
  this.dispose();
55845
56023
  });
55846
56024
  }
56025
+ static get addedFonts() {
56026
+ return this._addedFonts;
56027
+ }
55847
56028
  get visibleRegionContainer() {
55848
56029
  return this._visibleRegionContainer;
55849
56030
  }
@@ -56122,11 +56303,13 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
56122
56303
  }
56123
56304
  loadToEditor() {
56124
56305
  this.props.globalState.guiTexture.rootContainer.getDescendants().forEach((guiElement) => {
56306
+ WorkbenchComponent._addedFonts.push(guiElement.fontFamily);
56125
56307
  this.addEditorBehavior(guiElement);
56126
56308
  });
56127
56309
  this._isOverGUINode = [];
56128
56310
  this.props.globalState.setSelection([]);
56129
56311
  this.props.globalState.onFitControlsToWindowObservable.notifyObservers();
56312
+ this.props.globalState.onFontsParsedObservable.notifyObservers();
56130
56313
  }
56131
56314
  updateNodeOutlines() {
56132
56315
  for (const guiControl of this._trueRootContainer.getDescendants()) {
@@ -56334,6 +56517,10 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
56334
56517
  }
56335
56518
  processSelection() {
56336
56519
  // if hit nothing, deselect all
56520
+ if (this.props.globalState.usePrevSelected) {
56521
+ this.props.globalState.usePrevSelected = false;
56522
+ return;
56523
+ }
56337
56524
  if (this._controlsHit.length === 0) {
56338
56525
  this.props.globalState.setSelection([]);
56339
56526
  return;
@@ -56586,6 +56773,13 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
56586
56773
  }
56587
56774
  this.zooming(1 + delta / 1000);
56588
56775
  }
56776
+ zoomDrag(event) {
56777
+ let delta = 0;
56778
+ if (event.movementY !== 0) {
56779
+ delta = -event.movementY;
56780
+ }
56781
+ this.zooming(1 + delta / 1000);
56782
+ }
56589
56783
  //Zoom to pointer position. Zoom amount determined by delta
56590
56784
  zooming(delta) {
56591
56785
  this._zoomFactor *= delta;
@@ -56611,16 +56805,29 @@ class WorkbenchComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
56611
56805
  cursor = this.props.globalState.keys.isKeyDown("alt") ? "zoom-out" : "zoom-in";
56612
56806
  }
56613
56807
  return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("canvas", { id: "workbench-canvas", onPointerMove: (evt) => {
56808
+ if (this._mouseDown) {
56809
+ this.zoomDrag(evt);
56810
+ }
56614
56811
  if (this.props.globalState.guiTexture) {
56615
56812
  this.onMove(evt);
56616
56813
  }
56617
56814
  this.props.globalState.onPointerMoveObservable.notifyObservers(evt);
56618
- }, onPointerDown: (evt) => this.onDown(evt), onPointerUp: (evt) => {
56815
+ }, onPointerDown: (evt) => {
56816
+ this.onDown(evt);
56817
+ if (this._controlsHit.length === 0) {
56818
+ this._mouseDown = true;
56819
+ }
56820
+ else {
56821
+ this._mouseDown = false;
56822
+ }
56823
+ }, onPointerUp: (evt) => {
56619
56824
  this.onUp(evt);
56620
56825
  this.props.globalState.onPointerUpObservable.notifyObservers(evt);
56826
+ this._mouseDown = false;
56621
56827
  }, onWheel: (evt) => this.zoomWheel(evt), onContextMenu: (evt) => evt.preventDefault(), ref: this._rootContainer, style: { cursor } }));
56622
56828
  }
56623
56829
  }
56830
+ WorkbenchComponent._addedFonts = [];
56624
56831
 
56625
56832
 
56626
56833
  /***/ }),
@@ -56704,6 +56911,7 @@ class GlobalState {
56704
56911
  this.onGizmoUpdateRequireObservable = new core_Misc_observable__WEBPACK_IMPORTED_MODULE_0__.Observable();
56705
56912
  this.onArtBoardUpdateRequiredObservable = new core_Misc_observable__WEBPACK_IMPORTED_MODULE_0__.Observable();
56706
56913
  this.onBackgroundColorChangeObservable = new core_Misc_observable__WEBPACK_IMPORTED_MODULE_0__.Observable();
56914
+ this.onFontsParsedObservable = new core_Misc_observable__WEBPACK_IMPORTED_MODULE_0__.Observable();
56707
56915
  this.onPointerMoveObservable = new core_Misc_observable__WEBPACK_IMPORTED_MODULE_0__.Observable();
56708
56916
  this.onPointerUpObservable = new core_Misc_observable__WEBPACK_IMPORTED_MODULE_0__.Observable();
56709
56917
  this.draggedControl = null;
@@ -56739,6 +56947,12 @@ class GlobalState {
56739
56947
  this._tool = newTool;
56740
56948
  this.onToolChangeObservable.notifyObservers();
56741
56949
  }
56950
+ get usePrevSelected() {
56951
+ return this._usePrevSelected;
56952
+ }
56953
+ set usePrevSelected(val) {
56954
+ this._usePrevSelected = val;
56955
+ }
56742
56956
  restorePreviousTool() {
56743
56957
  if (this._tool !== this._prevTool) {
56744
56958
  this._tool = this._prevTool;