@babylonjs/gui-editor 5.0.0-rc.0 → 5.0.0-rc.3

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.
Files changed (4) hide show
  1. package/babylon.guiEditor.max.js +648 -600
  2. package/babylon.guiEditor.max.js.map +1 -1
  3. package/babylon.guiEditor.module.d.ts +155 -141
  4. package/package.json +2 -2
package/babylon.guiEditor.max.js CHANGED
@@ -10114,7 +10114,7 @@ __webpack_require__.r(__webpack_exports__);
10114
10114
 
10115
10115
  var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()(_node_modules_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default.a);
10116
10116
  // Module
10117
- ___CSS_LOADER_EXPORT___.push([module.i, ":root {\n --backgroundGrey: #aaaaaa;\n --spacingHeight: 30px;\n --labelFamily: \"acumin-pro-condensed-semibold\";\n --button: #333333;\n --buttonBackground: #ffffff;\n --buttonDisabledBackground: #c8c8c8;\n --buttonPressed: #ffffff;\n --buttonPressedBackground: #606060; }\n\nhr.ge {\n border: 1px solid #d0cece; }\n\n#ge-propertyTab {\n user-select: none;\n color: black;\n background: #e2e2e2; }\n #ge-propertyTab * {\n font-family: \"acumin-pro-semicondensed\";\n font-size: 12px; }\n #ge-propertyTab #header {\n height: 30px;\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 background: white;\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 #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: .2s;\n transition: opacity .2s; }\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 .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 #ge-propertyTab .unit.disabled {\n background-color: var(--buttonDisabledBackground); }\n #ge-propertyTab .unit:active {\n color: var(--buttonPressed);\n background-color: var(--buttonPressedBackground); }\n #ge-propertyTab .sliderLine {\n padding-left: 5px;\n padding-bottom: 0px;\n padding-top: 0px;\n padding-right: 18px;\n height: var(--spacingHeight);\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: auto auto auto 1fr; }\n #ge-propertyTab .sliderLine .label {\n grid-column: 2;\n display: flex;\n align-items: center;\n min-width: 15px;\n font-family: var(--labelFamily); }\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 width: 90%;\n display: flex;\n align-items: center;\n padding-left: 5px; }\n #ge-propertyTab .sliderLine .floatLine {\n grid-column: 3;\n padding-left: 0px; }\n #ge-propertyTab .sliderLine .floatLine .label {\n grid-column: 1;\n display: none;\n align-items: center;\n font-family: var(--labelFamily); }\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: 60px;\n background-color: white;\n outline-color: transparent;\n border: transparent;\n height: 26px;\n outline-width: 0px; }\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 display: grid;\n grid-template-columns: auto auto auto auto auto auto;\n padding-right: 18px; }\n #ge-propertyTab .ge-divider-short {\n display: grid;\n grid-template-columns: 1fr 1fr;\n padding-right: 18px; }\n #ge-propertyTab .ge-divider-single {\n display: block;\n padding-right: 18px; }\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 .textInputLine {\n user-select: none;\n padding-left: 5px;\n padding-bottom: 0px;\n padding-top: 0px;\n padding-right: 18px;\n height: var(--spacingHeight);\n display: grid;\n grid-template-columns: auto auto 1fr; }\n #ge-propertyTab .textInputLine .label {\n grid-column: 2;\n display: flex;\n align-items: center;\n min-width: 15px;\n font-family: var(--labelFamily); }\n #ge-propertyTab .textInputLine img {\n width: 30px; }\n #ge-propertyTab .textInputLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .textInputLine .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 margin-right: 2px; }\n #ge-propertyTab .textInputLine .value input {\n width: 100%;\n outline-color: transparent;\n border: transparent;\n outline-width: 0px;\n height: 24px; }\n #ge-propertyTab .textInputLine .value input.hasArrows {\n padding-right: 15px; }\n #ge-propertyTab .textInputLine .value .arrows {\n display: none; }\n #ge-propertyTab .textInputLine .value:hover .arrows, #ge-propertyTab .textInputLine .value:focus .arrows, #ge-propertyTab .textInputLine .value.dragging .arrows {\n position: absolute;\n right: 0;\n display: flex;\n flex-direction: column;\n background-color: white;\n cursor: grab; }\n #ge-propertyTab .textInputLine .value:hover .arrows .downArrowIcon, #ge-propertyTab .textInputLine .value:hover .arrows .upArrowIcon, #ge-propertyTab .textInputLine .value:focus .arrows .downArrowIcon, #ge-propertyTab .textInputLine .value:focus .arrows .upArrowIcon, #ge-propertyTab .textInputLine .value.dragging .arrows .downArrowIcon, #ge-propertyTab .textInputLine .value.dragging .arrows .upArrowIcon {\n width: 15px;\n height: 15px; }\n #ge-propertyTab .textInputLine .value.dragging .arrows {\n background-color: var(--buttonPressedBackground); }\n #ge-propertyTab .textInputLine .value.dragging .arrows .downArrowIcon, #ge-propertyTab .textInputLine .value.dragging .arrows .upArrowIcon {\n filter: invert(100%) brightness(500%); }\n #ge-propertyTab .textInputLine.withUnits {\n grid-template-columns: auto auto 1fr auto; }\n #ge-propertyTab .textInputArea {\n padding-left: 5px;\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: 150px;\n width: 15px; }\n #ge-propertyTab .color-picker .color-rect-background {\n height: 15px;\n border: 1px black solid;\n cursor: pointer;\n background: repeating-conic-gradient(#E2E2E2 0% 25%, white 0% 50%) 50%/10px 10px; }\n #ge-propertyTab .color-picker .color-rect-background .color-rect {\n height: 100%; }\n #ge-propertyTab .color-picker .color-picker-cover {\n position: fixed;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px; }\n #ge-propertyTab .color-picker .color-picker-float {\n z-index: 2;\n position: absolute; }\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-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 padding-left: 5px;\n height: var(--spacingHeight);\n padding-bottom: 0px;\n padding-top: 0px;\n display: grid;\n grid-template-columns: auto auto 2fr 1fr; }\n #ge-propertyTab .floatLine .label {\n grid-column: 2;\n display: flex;\n align-items: center;\n min-width: 15px;\n font-family: var(--labelFamily); }\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: 30px;\n margin-right: 2px; }\n #ge-propertyTab .floatLine .value input {\n width: 100%;\n background-color: white;\n outline-color: transparent;\n border: none;\n outline-width: 0px;\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: 27px; }\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-left: 5px;\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.0; }\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.0; }\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-left: 5px;\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-left: 5px;\n padding-bottom: 0px;\n padding-top: 0px;\n padding-right: 18px;\n height: var(--spacingHeight);\n display: grid;\n grid-template-columns: auto auto 1fr; }\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 font-family: var(--labelFamily); }\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 .checkBox {\n grid-column: 3;\n display: flex;\n align-items: center;\n margin-left: auto;\n margin-right: 0px; }\n #ge-propertyTab .checkBoxLine .checkBox .lbl {\n position: relative;\n display: block;\n height: 14px;\n width: 34px;\n border-radius: 100px;\n cursor: pointer;\n transition: all 0.3s ease;\n border: solid;\n border-width: thin; }\n #ge-propertyTab .checkBoxLine .checkBox .lbl:after {\n position: absolute;\n left: 3px;\n top: 1px;\n display: block;\n width: 10px;\n height: 10px;\n border-radius: 100px;\n background: #e2e2e2;\n box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.05);\n content: '';\n transition: all 0.15s ease;\n border: solid;\n border-width: thin; }\n #ge-propertyTab .checkBoxLine .checkBox .lbl:active:after {\n transform: scale(1.15, 0.85); }\n #ge-propertyTab .checkBoxLine .checkBox .cbx:checked ~ label {\n background: transparent; }\n #ge-propertyTab .checkBoxLine .checkBox .cbx:checked ~ label:after {\n left: 20px;\n background: black;\n border: solid;\n border-width: thin; }\n #ge-propertyTab .checkBoxLine .checkBox .cbx.conflict ~ label:after {\n left: 10px;\n background: repeating-linear-gradient(45deg, transparent, transparent 5px, black 5px, black 10px); }\n #ge-propertyTab .checkBoxLine .checkBox .cbx:checked ~ label.disabled {\n background: black;\n cursor: pointer; }\n #ge-propertyTab .checkBoxLine .checkBox .cbx:checked ~ label.disabled:after {\n left: 20px;\n background: #555555;\n cursor: pointer; }\n #ge-propertyTab .checkBoxLine .checkBox .cbx ~ label.disabled {\n background: #555555;\n cursor: pointer; }\n #ge-propertyTab .checkBoxLine .checkBox .hidden {\n display: none; }\n #ge-propertyTab .listLine {\n padding-left: 5px;\n padding-bottom: 0px;\n padding-top: 0px;\n height: var(--spacingHeight);\n display: grid;\n grid-template-columns: auto 1fr auto; }\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 margin-right: 5px; }\n #ge-propertyTab .listLine .options select {\n width: 120px;\n height: 25px;\n border: transparent;\n border-radius: 4px; }\n #ge-propertyTab .color3Line {\n padding-left: 5px;\n padding-bottom: 0px;\n padding-top: 0px;\n padding-right: 18px;\n display: grid; }\n #ge-propertyTab .color3Line .firstLine {\n height: var(--spacingHeight);\n display: grid;\n grid-template-columns: auto auto 1fr; }\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: 0px; }\n #ge-propertyTab .color3Line .firstLine .color3 {\n grid-column: 2;\n margin-top: 6px;\n display: flex;\n align-items: center;\n padding-left: 15px; }\n #ge-propertyTab .color3Line .firstLine .color3 input {\n margin-right: 5px; }\n #ge-propertyTab .color3Line .firstLine .textInputLine .value {\n padding-left: 2px; }\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-semicondensed\"; }\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://./components/propertyTab/propertyTab.scss"],"names":[],"mappings":"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","sourcesContent":[":root {\r\n --backgroundGrey: #aaaaaa;\r\n --spacingHeight: 30px;\r\n --labelFamily: \"acumin-pro-condensed-semibold\";\r\n --button: #333333;\r\n --buttonBackground: #ffffff;\r\n --buttonDisabledBackground: #c8c8c8;\r\n --buttonPressed: #ffffff;\r\n --buttonPressedBackground: #606060;\r\n}\r\n\r\nhr.ge {\r\n border: 1px solid #d0cece;\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-semicondensed\";\r\n font-size: 12px;\r\n }\r\n #header {\r\n height: 30px;\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 background: white;\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 } \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: .2s;\r\n transition: opacity .2s;\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 .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 }\r\n\r\n .unit.disabled {\r\n background-color: var(--buttonDisabledBackground);\r\n }\r\n\r\n .unit:active {\r\n color: var(--buttonPressed);\r\n background-color: var(--buttonPressedBackground);\r\n }\r\n\r\n .sliderLine {\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: var(--spacingHeight);;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: auto auto auto 1fr;\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-family: var(--labelFamily);\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\r\n .slider {\r\n grid-column: 4;\r\n grid-row: 1;\r\n margin-right: 5px;\r\n width: 90%;\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: 3;\r\n padding-left: 0px;\r\n \r\n .label {\r\n grid-column: 1;\r\n display: none;\r\n align-items: center;\r\n font-family: var(--labelFamily);\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: 60px;\r\n background-color: white;\r\n outline-color: transparent;\r\n border: transparent;\r\n height: 26px;\r\n outline-width: 0px\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 display: grid;\r\n grid-template-columns: auto auto auto auto auto auto;\r\n padding-right: $line-padding-right;\r\n }\r\n\r\n .ge-divider-short {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n padding-right: $line-padding-right;\r\n }\r\n\r\n .ge-divider-single {\r\n display: block;\r\n padding-right: $line-padding-right;\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\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 \r\n .ge-grid {\r\n display: grid;\r\n margin-bottom: 5px;\r\n }\r\n\r\n\r\n .textInputLine {\r\n user-select: none;\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: var(--spacingHeight);\r\n display: grid;\r\n grid-template-columns: auto auto 1fr;\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-family: var(--labelFamily);\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 margin-right: 2px;\r\n input {\r\n width: 100%;\r\n outline-color: transparent;\r\n border: transparent;\r\n outline-width: 0px;\r\n height: 24px;\r\n }\r\n input.hasArrows {\r\n padding-right: 15px;\r\n }\r\n .arrows {\r\n display: none;\r\n }\r\n &:hover .arrows, &:focus .arrows, &.dragging .arrows {\r\n position: absolute;\r\n right: 0;\r\n display: flex;\r\n flex-direction: column;\r\n background-color: white;\r\n cursor: grab;\r\n .downArrowIcon, .upArrowIcon {\r\n width: 15px;\r\n height: 15px;\r\n }\r\n }\r\n &.dragging .arrows {\r\n background-color: var(--buttonPressedBackground);\r\n .downArrowIcon, .upArrowIcon {\r\n filter: invert(100%) brightness(500%);\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 padding-left: $line-padding-left;\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: 150px;\r\n width: 15px;\r\n\r\n .color-rect-background {\r\n height: 15px;\r\n border: 1px black solid;\r\n cursor: pointer;\r\n background: repeating-conic-gradient(#E2E2E2 0% 25%, white 0% 50%) 50% / 10px 10px;\r\n .color-rect {\r\n height: 100%;\r\n }\r\n }\r\n\r\n .color-picker-cover {\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 z-index: 2;\r\n position: absolute; \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 }\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 }\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\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 \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 padding-left: $line-padding-left;\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 1fr;\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-family: var(--labelFamily);\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: 30px;\r\n margin-right: 2px;\r\n input {\r\n width: 100%;\r\n background-color: white;\r\n outline-color: transparent;\r\n border: none;\r\n outline-width: 0px;\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: 27px;\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-left:$line-padding-left;\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.0;\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.0;\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-left: $line-padding-left;\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-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: var(--spacingHeight);\r\n display: grid;\r\n grid-template-columns: auto auto 1fr ;\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 font-family: var(--labelFamily);\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 .checkBox {\r\n grid-column: 3;\r\n display: flex;\r\n align-items: center;\r\n margin-left: auto;\r\n margin-right: 0px;\r\n \r\n .lbl {\r\n position: relative;\r\n display: block;\r\n height: 14px;\r\n width: 34px;\r\n border-radius: 100px;\r\n cursor: pointer;\r\n transition: all 0.3s ease;\r\n border: solid;\r\n border-width: thin;\r\n }\r\n\r\n .lbl:after {\r\n position: absolute;\r\n left: 3px;\r\n top: 1px;\r\n display: block;\r\n width: 10px;\r\n height: 10px;\r\n border-radius: 100px;\r\n background: #e2e2e2;\r\n box-shadow: 0px 3px 3px rgba(0,0,0,0.05);\r\n content: '';\r\n transition: all 0.15s ease;\r\n border: solid;\r\n border-width: thin;\r\n }\r\n\r\n .lbl:active:after { \r\n transform: scale(1.15, 0.85); \r\n }\r\n\r\n .cbx:checked ~ label { \r\n background: transparent;\r\n \r\n }\r\n\r\n .cbx:checked ~ label:after {\r\n left: 20px;\r\n background: rgb(0, 0, 0);\r\n border: solid;\r\n border-width: thin;\r\n }\r\n\r\n .cbx.conflict ~ label:after {\r\n left: 10px;\r\n background: repeating-linear-gradient(45deg, transparent, transparent 5px, black 5px, black 10px);\r\n }\r\n\r\n .cbx:checked ~ label.disabled { \r\n background: rgb(0, 0, 0);\r\n cursor: pointer;\r\n }\r\n\r\n .cbx:checked ~ label.disabled:after {\r\n left: 20px;\r\n background: rgb(85, 85, 85);\r\n cursor: pointer;\r\n }\r\n\r\n .cbx ~ label.disabled {\r\n background: rgb(85, 85, 85);\r\n cursor: pointer;\r\n }\r\n\r\n .hidden { \r\n display: none; \r\n } \r\n } \r\n } \r\n\r\n .listLine {\r\n padding-left: $line-padding-left;\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\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 margin-right: 5px;\r\n\r\n select {\r\n width: 120px;\r\n height: 25px;\r\n border: transparent;\r\n border-radius: 4px;\r\n }\r\n } \r\n } \r\n \r\n .color3Line {\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 display: grid;\r\n\r\n .firstLine {\r\n height: var(--spacingHeight);\r\n display: grid;\r\n grid-template-columns: auto auto 1fr;\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: 0px;\r\n }\r\n \r\n .color3 {\r\n grid-column: 2; \r\n margin-top: 6px;\r\n display: flex;\r\n align-items: center;\r\n padding-left: 15px;\r\n \r\n input {\r\n margin-right: 5px;\r\n }\r\n }\r\n\r\n .textInputLine {\r\n .value {\r\n padding-left: 2px;\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-semicondensed\";\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":""}]);
10117
+ ___CSS_LOADER_EXPORT___.push([module.i, ":root {\n --backgroundGrey: #aaaaaa;\n --spacingHeight: 30px;\n --labelFamily: \"acumin-pro-condensed-semibold\";\n --button: #333333;\n --buttonBackground: #ffffff;\n --buttonDisabledBackground: #c8c8c8;\n --buttonPressed: #ffffff;\n --buttonPressedBackground: #606060; }\n\nhr.ge {\n border: 1px solid #d0cece; }\n\n#ge-propertyTab {\n user-select: none;\n color: black;\n background: #e2e2e2; }\n #ge-propertyTab * {\n font-family: \"acumin-pro-semicondensed\";\n font-size: 12px; }\n #ge-propertyTab #header {\n height: 30px;\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 background: white;\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 #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: .2s;\n transition: opacity .2s; }\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 .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 #ge-propertyTab .unit.disabled {\n background-color: var(--buttonDisabledBackground); }\n #ge-propertyTab .unit:active {\n color: var(--buttonPressed);\n background-color: var(--buttonPressedBackground); }\n #ge-propertyTab .sliderLine {\n height: var(--spacingHeight);\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: auto auto auto 1fr;\n flex-grow: 1; }\n #ge-propertyTab .sliderLine .label {\n grid-column: 2;\n display: flex;\n align-items: center;\n min-width: 15px;\n font-family: var(--labelFamily);\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: 3;\n padding-left: 0px; }\n #ge-propertyTab .sliderLine .floatLine .label {\n grid-column: 1;\n display: none;\n align-items: center;\n font-family: var(--labelFamily);\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: 60px;\n background-color: white;\n outline-color: transparent;\n border: transparent;\n height: 26px;\n outline-width: 0px; }\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, #ge-propertyTab .ge-divider-short, #ge-propertyTab .ge-divider-single {\n display: flex;\n flex-direction: row;\n padding-right: 18px;\n align-items: center;\n padding-left: 5px; }\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 .textInputLine {\n user-select: none;\n padding-bottom: 0px;\n padding-top: 0px;\n padding-right: 5px;\n height: var(--spacingHeight);\n display: grid;\n grid-template-columns: auto auto 1fr;\n flex-grow: 1; }\n #ge-propertyTab .textInputLine .label {\n grid-column: 2;\n display: flex;\n align-items: center;\n min-width: 15px;\n font-family: var(--labelFamily);\n font-weight: 600; }\n #ge-propertyTab .textInputLine img {\n width: 30px; }\n #ge-propertyTab .textInputLine .img {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #ge-propertyTab .textInputLine .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 margin-right: 2px; }\n #ge-propertyTab .textInputLine .value input {\n width: 100%;\n outline-color: transparent;\n border: transparent;\n outline-width: 0px;\n height: 24px; }\n #ge-propertyTab .textInputLine .value input.hasArrows {\n padding-right: 15px; }\n #ge-propertyTab .textInputLine .value .arrows {\n display: none; }\n #ge-propertyTab .textInputLine .value:hover .arrows, #ge-propertyTab .textInputLine .value:focus .arrows, #ge-propertyTab .textInputLine .value.dragging .arrows {\n position: absolute;\n right: 0;\n display: flex;\n flex-direction: column;\n background-color: white;\n cursor: grab; }\n #ge-propertyTab .textInputLine .value:hover .arrows .downArrowIcon, #ge-propertyTab .textInputLine .value:hover .arrows .upArrowIcon, #ge-propertyTab .textInputLine .value:focus .arrows .downArrowIcon, #ge-propertyTab .textInputLine .value:focus .arrows .upArrowIcon, #ge-propertyTab .textInputLine .value.dragging .arrows .downArrowIcon, #ge-propertyTab .textInputLine .value.dragging .arrows .upArrowIcon {\n width: 15px;\n height: 15px; }\n #ge-propertyTab .textInputLine .value.dragging .arrows {\n background-color: var(--buttonPressedBackground); }\n #ge-propertyTab .textInputLine .value.dragging .arrows .downArrowIcon, #ge-propertyTab .textInputLine .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 padding-left: 5px;\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 #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-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-family: var(--labelFamily);\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: 30px;\n margin-right: 2px; }\n #ge-propertyTab .floatLine .value input {\n width: 100%;\n background-color: white;\n outline-color: transparent;\n border: none;\n outline-width: 0px;\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: 27px; }\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.0; }\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.0; }\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 font-family: var(--labelFamily); }\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 .checkBox {\n grid-column: 3;\n display: flex;\n align-items: center;\n margin-left: auto;\n margin-right: 0px; }\n #ge-propertyTab .checkBoxLine .checkBox .cbx:checked ~ label {\n background: transparent; }\n #ge-propertyTab .checkBoxLine .checkBox .cbx:checked ~ label:after {\n left: 20px;\n background: black;\n border: solid;\n border-width: thin; }\n #ge-propertyTab .checkBoxLine .checkBox .cbx.conflict ~ label:after {\n left: 10px;\n background: repeating-linear-gradient(45deg, transparent, transparent 5px, black 5px, black 10px); }\n #ge-propertyTab .checkBoxLine .checkBox .cbx:checked ~ label.disabled {\n background: black;\n cursor: pointer; }\n #ge-propertyTab .checkBoxLine .checkBox .cbx:checked ~ label.disabled:after {\n left: 20px;\n background: #555555;\n cursor: pointer; }\n #ge-propertyTab .checkBoxLine .checkBox .cbx ~ label.disabled {\n background: #555555;\n cursor: pointer; }\n #ge-propertyTab .checkBoxLine .checkBox .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 margin-right: 5px; }\n #ge-propertyTab .listLine .options select {\n width: 120px;\n height: 25px;\n border: transparent;\n border-radius: 4px; }\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 .textInputLine .value {\n padding-left: 2px; }\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-semicondensed\"; }\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://./components/propertyTab/propertyTab.scss"],"names":[],"mappings":"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","sourcesContent":[":root {\r\n --backgroundGrey: #aaaaaa;\r\n --spacingHeight: 30px;\r\n --labelFamily: \"acumin-pro-condensed-semibold\";\r\n --button: #333333;\r\n --buttonBackground: #ffffff;\r\n --buttonDisabledBackground: #c8c8c8;\r\n --buttonPressed: #ffffff;\r\n --buttonPressedBackground: #606060;\r\n}\r\n\r\nhr.ge {\r\n border: 1px solid #d0cece;\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-semicondensed\";\r\n font-size: 12px;\r\n }\r\n #header {\r\n height: 30px;\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 background: white;\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 } \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: .2s;\r\n transition: opacity .2s;\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 .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 }\r\n\r\n .unit.disabled {\r\n background-color: var(--buttonDisabledBackground);\r\n }\r\n\r\n .unit:active {\r\n color: var(--buttonPressed);\r\n background-color: var(--buttonPressedBackground);\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 auto auto 1fr;\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-family: var(--labelFamily);\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: 3;\r\n padding-left: 0px;\r\n \r\n .label {\r\n grid-column: 1;\r\n display: none;\r\n align-items: center;\r\n font-family: var(--labelFamily);\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: 60px;\r\n background-color: white;\r\n outline-color: transparent;\r\n border: transparent;\r\n height: 26px;\r\n outline-width: 0px\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, .ge-divider-short, .ge-divider-single {\r\n display: flex;\r\n flex-direction: row;\r\n padding-right: $line-padding-right;\r\n align-items: center;\r\n padding-left: 5px;\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\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 \r\n .ge-grid {\r\n display: grid;\r\n margin-bottom: 5px;\r\n }\r\n\r\n\r\n .textInputLine {\r\n user-select: none;\r\n padding-bottom: $line-padding-bottom;\r\n padding-top: $line-padding-top;\r\n padding-right: 5px;\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-family: var(--labelFamily);\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 margin-right: 2px;\r\n input {\r\n width: 100%;\r\n outline-color: transparent;\r\n border: transparent;\r\n outline-width: 0px;\r\n height: 24px;\r\n }\r\n input.hasArrows {\r\n padding-right: 15px;\r\n }\r\n .arrows {\r\n display: none;\r\n }\r\n &:hover .arrows, &:focus .arrows, &.dragging .arrows {\r\n position: absolute;\r\n right: 0;\r\n display: flex;\r\n flex-direction: column;\r\n background-color: white;\r\n cursor: grab;\r\n .downArrowIcon, .upArrowIcon {\r\n width: 15px;\r\n height: 15px;\r\n }\r\n }\r\n &.dragging .arrows {\r\n background-color: var(--buttonPressedBackground);\r\n .downArrowIcon, .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 padding-left: $line-padding-left;\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 } \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 }\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 }\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\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 \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-family: var(--labelFamily);\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: 30px;\r\n margin-right: 2px;\r\n input {\r\n width: 100%;\r\n background-color: white;\r\n outline-color: transparent;\r\n border: none;\r\n outline-width: 0px;\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: 27px;\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.0;\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.0;\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 font-family: var(--labelFamily);\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 .checkBox {\r\n grid-column: 3;\r\n display: flex;\r\n align-items: center;\r\n margin-left: auto;\r\n margin-right: 0px;\r\n\r\n .cbx:checked ~ label { \r\n background: transparent;\r\n \r\n }\r\n\r\n .cbx:checked ~ label:after {\r\n left: 20px;\r\n background: rgb(0, 0, 0);\r\n border: solid;\r\n border-width: thin;\r\n }\r\n\r\n .cbx.conflict ~ label:after {\r\n left: 10px;\r\n background: repeating-linear-gradient(45deg, transparent, transparent 5px, black 5px, black 10px);\r\n }\r\n\r\n .cbx:checked ~ label.disabled { \r\n background: rgb(0, 0, 0);\r\n cursor: pointer;\r\n }\r\n\r\n .cbx:checked ~ label.disabled:after {\r\n left: 20px;\r\n background: rgb(85, 85, 85);\r\n cursor: pointer;\r\n }\r\n\r\n .cbx ~ label.disabled {\r\n background: rgb(85, 85, 85);\r\n cursor: pointer;\r\n }\r\n\r\n .hidden { \r\n display: none; \r\n } \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 margin-right: 5px;\r\n\r\n select {\r\n width: 120px;\r\n height: 25px;\r\n border: transparent;\r\n border-radius: 4px;\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 .textInputLine {\r\n .value {\r\n padding-left: 2px;\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-semicondensed\";\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":""}]);
10118
10118
  // Exports
10119
10119
  /* harmony default export */ __webpack_exports__["default"] = (___CSS_LOADER_EXPORT___);
10120
10120
 
@@ -10139,7 +10139,7 @@ __webpack_require__.r(__webpack_exports__);
10139
10139
 
10140
10140
  var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()(_node_modules_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default.a);
10141
10141
  // Module
10142
- ___CSS_LOADER_EXPORT___.push([module.i, "#ge-scene-explorer-host {\n position: absolute;\n left: 0px;\n top: 0px;\n bottom: 0px; }\n #ge-scene-explorer-host * {\n font-family: \"acumin-pro-condensed\"; }\n #ge-scene-explorer-host:focus {\n outline: none; }\n\n#ge-__resizable_base__ {\n display: none; }\n\n.ge-context-menu {\n background: #e2e2e2; }\n .ge-context-menu .react-contextmenu-item {\n padding: 10px;\n cursor: pointer; }\n .ge-context-menu .react-contextmenu-item:hover {\n background: #e2e2e2; }\n\n.ge-eact-contextmenu.context-menu.react-contextmenu--visible {\n z-index: 99;\n transform: scale(1); }\n\n#ge-sceneExplorer {\n background: #e2e2e2;\n height: 100%;\n margin: 0;\n padding: 0;\n display: grid;\n grid-template-rows: auto 1fr;\n font: 16px \"acumin-pro-condensed\"; }\n #ge-sceneExplorer:focus {\n outline: none; }\n #ge-sceneExplorer #header {\n height: 30px;\n font-size: 16px;\n color: black;\n background: #e2e2e2;\n grid-row: 1;\n text-align: center;\n display: grid;\n grid-template-columns: 30px 1fr 50px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none; }\n #ge-sceneExplorer #header #logo {\n position: relative;\n grid-column: 1;\n width: 24px;\n height: 24px;\n left: 0;\n display: flex;\n align-self: center;\n justify-self: center; }\n #ge-sceneExplorer #header #title {\n grid-column: 2;\n display: grid;\n align-items: center;\n text-align: center; }\n #ge-sceneExplorer #header #commands {\n grid-column: 3;\n display: grid;\n align-items: center;\n grid-template-columns: 1fr 1fr; }\n #ge-sceneExplorer #header #commands .expand {\n grid-column: 1;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #ge-sceneExplorer #header #commands .close {\n grid-column: 2;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #ge-sceneExplorer #tree {\n grid-row: 2;\n overflow-x: hidden;\n overflow-y: auto; }\n #ge-sceneExplorer .filter {\n display: flex;\n align-items: stretch; }\n #ge-sceneExplorer .filter input {\n width: 100%;\n margin: 10px 40px 5px 40px;\n display: block;\n border: none;\n padding: 0;\n border-bottom: solid 1px #337ab7;\n background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 96%, #337ab7 4%);\n background-position: -1000px 0;\n background-size: 1000px 100%;\n background-repeat: no-repeat;\n color: black; }\n #ge-sceneExplorer .filter input::placeholder {\n color: lightgray; }\n #ge-sceneExplorer .filter input:focus {\n box-shadow: none;\n outline: none;\n background-position: 0 0; }\n #ge-sceneExplorer .groupContainer {\n margin-left: 0px;\n color: black;\n margin-top: 0px;\n margin-bottom: 0px;\n height: 24px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n align-self: center;\n display: grid;\n align-items: center; }\n #ge-sceneExplorer .groupContainer:hover {\n background: #bbbbbb; }\n #ge-sceneExplorer .groupContainer .expandableHeader {\n display: grid;\n grid-template-columns: 1fr 20px; }\n #ge-sceneExplorer .groupContainer .expandableHeader .text {\n grid-column: 1;\n display: grid;\n grid-template-columns: 20px 1fr; }\n #ge-sceneExplorer .groupContainer .expandableHeader .text .arrow {\n grid-column: 1;\n margin-left: 0px;\n color: black;\n cursor: pointer;\n display: inline-block;\n margin-right: 6px;\n opacity: 0.5; }\n #ge-sceneExplorer .groupContainer .expandableHeader .text .text-value {\n grid-column: 2;\n display: flex;\n align-items: center; }\n #ge-sceneExplorer .groupContainer .expandableHeader .expandAll {\n opacity: 0.5;\n grid-column: 2;\n margin-right: 10px; }\n #ge-sceneExplorer .icon {\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #ge-sceneExplorer .addComponent {\n display: none; }\n #ge-sceneExplorer .makeChild {\n grid-column: 3; }\n #ge-sceneExplorer .itemContainer {\n margin-left: 0px;\n color: black;\n margin-top: 0px;\n margin-bottom: 0px;\n height: 32px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n display: grid;\n grid-template-columns: 20px 1fr;\n border: 2px solid transparent; }\n #ge-sceneExplorer .itemContainer.hover {\n border: 2px solid #527089;\n cursor: pointer; }\n #ge-sceneExplorer .itemContainer.seAbove {\n border-top: 2px solid #527089;\n cursor: pointer; }\n #ge-sceneExplorer .itemContainer.seBelow {\n border-bottom: 2px solid #527089;\n cursor: pointer; }\n #ge-sceneExplorer .itemContainer.selected {\n background: #bfbebe;\n color: black; }\n #ge-sceneExplorer .itemContainer.dragged {\n background: transparent;\n color: black; }\n #ge-sceneExplorer .itemContainer.parent {\n background: #ffffff;\n color: black; }\n #ge-sceneExplorer .itemContainer .isNotActive {\n opacity: 0.3; }\n #ge-sceneExplorer .itemContainer .arrow {\n grid-column: 1;\n color: black;\n opacity: 0.6; }\n #ge-sceneExplorer .itemContainer .popup {\n width: 200px;\n visibility: hidden;\n background-color: #bbbbbb;\n color: #fff;\n border: 1px solid rgba(255, 255, 255, 0.5);\n position: absolute;\n z-index: 1;\n margin-left: -180px;\n box-sizing: border-box; }\n #ge-sceneExplorer .itemContainer .popup.show {\n visibility: visible; }\n #ge-sceneExplorer .itemContainer .popup:focus {\n outline: none; }\n #ge-sceneExplorer .itemContainer .popup .popupMenu {\n padding: 6px 5px 5px 10px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n height: 18px; }\n #ge-sceneExplorer .itemContainer .popup .popupMenu:hover {\n background: white;\n color: #333333; }\n #ge-sceneExplorer .itemContainer .sceneNode {\n grid-column: 2;\n margin-left: -10px;\n display: grid;\n grid-template-columns: 1fr 20px 20px 20px 20px 10px 20px 20px auto 5px;\n align-items: center;\n cursor: pointer; }\n #ge-sceneExplorer .itemContainer .sceneNode .sceneTitle {\n grid-column: 1;\n margin-right: 5px;\n display: flex;\n align-items: center;\n height: 24px; }\n #ge-sceneExplorer .itemContainer .sceneNode .translation {\n grid-column: 2;\n opacity: 0.6; }\n #ge-sceneExplorer .itemContainer .sceneNode .translation.selected {\n opacity: 1; }\n #ge-sceneExplorer .itemContainer .sceneNode .rotation {\n grid-column: 3;\n opacity: 0.6; }\n #ge-sceneExplorer .itemContainer .sceneNode .rotation.selected {\n opacity: 1; }\n #ge-sceneExplorer .itemContainer .sceneNode .scaling {\n grid-column: 4;\n opacity: 0.6; }\n #ge-sceneExplorer .itemContainer .sceneNode .scaling.selected {\n opacity: 1; }\n #ge-sceneExplorer .itemContainer .sceneNode .bounding {\n grid-column: 5;\n opacity: 0.6; }\n #ge-sceneExplorer .itemContainer .sceneNode .bounding.selected {\n opacity: 1; }\n #ge-sceneExplorer .itemContainer .sceneNode .separator {\n grid-column: 6;\n margin-left: 5px;\n width: 5px;\n display: flex;\n align-items: center;\n height: 18px;\n border-left: solid 1px #337ab7; }\n #ge-sceneExplorer .itemContainer .sceneNode .pickingMode {\n grid-column: 7;\n opacity: 0.6; }\n #ge-sceneExplorer .itemContainer .sceneNode .pickingMode.selected {\n opacity: 1; }\n #ge-sceneExplorer .itemContainer .sceneNode .refresh {\n grid-column: 8; }\n #ge-sceneExplorer .itemContainer .sceneNode .extensions {\n width: 20px;\n grid-column: 9; }\n #ge-sceneExplorer .itemContainer .adtextureTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr 20px auto 5px;\n align-items: center; }\n #ge-sceneExplorer .itemContainer .adtextureTools .pickingMode {\n grid-column: 2;\n opacity: 0.6; }\n #ge-sceneExplorer .itemContainer .adtextureTools .pickingMode.selected {\n opacity: 1; }\n #ge-sceneExplorer .itemContainer .adtextureTools .extensions {\n width: 20px;\n grid-column: 3; }\n #ge-sceneExplorer .itemContainer .controlTools {\n grid-column: 2;\n display: grid;\n align-items: center; }\n #ge-sceneExplorer .itemContainer .controlTools .highlight {\n grid-column: 2; }\n #ge-sceneExplorer .itemContainer .controlTools .visibility {\n grid-column: 3; }\n #ge-sceneExplorer .itemContainer .controlTools .extensions {\n width: 20px;\n grid-column: 4; }\n #ge-sceneExplorer .itemContainer .title {\n background: transparent;\n white-space: nowrap;\n overflow: hidden;\n min-width: 0;\n margin-right: 5px;\n align-items: center;\n height: 24px;\n cursor: pointer; }\n #ge-sceneExplorer .itemContainer .title .titleText {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n outline: none; }\n", "",{"version":3,"sources":["webpack://./components/sceneExplorer/sceneExplorer.scss"],"names":[],"mappings":"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","sourcesContent":["#ge-scene-explorer-host {\r\n position: absolute;\r\n left: 0px;\r\n top:0px;\r\n bottom: 0px;\r\n * {\r\n font-family: \"acumin-pro-condensed\";\r\n }\r\n &:focus {\r\n outline: none;\r\n }\r\n}\r\n\r\n#ge-__resizable_base__ {\r\n display: none;\r\n}\r\n\r\n.ge-context-menu {\r\n background: #e2e2e2;\r\n\r\n .react-contextmenu-item {\r\n padding: 10px;\r\n cursor: pointer;\r\n\r\n &:hover {\r\n background: #e2e2e2;\r\n }\r\n }\r\n}\r\n\r\n.ge-eact-contextmenu.context-menu.react-contextmenu--visible {\r\n z-index: 99;\r\n transform: scale(1);\r\n}\r\n\r\n#ge-sceneExplorer {\r\n background: #e2e2e2;\r\n height: 100%;\r\n margin: 0;\r\n padding: 0;\r\n display: grid;\r\n grid-template-rows: auto 1fr;\r\n font: 16px \"acumin-pro-condensed\";\r\n\r\n &:focus {\r\n outline: none;\r\n }\r\n\r\n #header {\r\n height: 30px;\r\n font-size: 16px;\r\n color: black;\r\n background: #e2e2e2;\r\n grid-row: 1;\r\n text-align: center;\r\n display: grid;\r\n grid-template-columns: 30px 1fr 50px; \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: 24px;\r\n height: 24px;\r\n left:0;\r\n display: flex;\r\n align-self: center; \r\n justify-self: center;\r\n } \r\n\r\n #title {\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 #commands {\r\n grid-column: 3; \r\n display: grid;\r\n align-items: center; \r\n grid-template-columns: 1fr 1fr; \r\n \r\n .expand {\r\n grid-column: 1;\r\n display: grid;\r\n align-items: center; \r\n justify-items: center;\r\n cursor: pointer; \r\n }\r\n\r\n .close {\r\n grid-column: 2;\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\r\n #tree {\r\n grid-row: 2; \r\n\r\n overflow-x: hidden;\r\n overflow-y: auto;\r\n }\r\n\r\n .filter {\r\n display: flex;\r\n align-items: stretch;\r\n\r\n input {\r\n width: 100%;\r\n margin: 10px 40px 5px 40px;\r\n display: block;\r\n border: none;\r\n padding: 0;\r\n border-bottom: solid 1px rgb(51, 122, 183);\r\n background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 96%, rgb(51, 122, 183) 4%);\r\n background-position: -1000px 0;\r\n background-size: 1000px 100%;\r\n background-repeat: no-repeat; \r\n color:black; \r\n }\r\n\r\n input::placeholder {\r\n color: lightgray;\r\n }\r\n\r\n input:focus {\r\n box-shadow: none;\r\n outline: none;\r\n background-position: 0 0;\r\n }\r\n }\r\n\r\n .groupContainer {\r\n margin-left: 0px;\r\n color: black;\r\n margin-top: 0px;\r\n margin-bottom: 0px;\r\n height: 24px; \r\n\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 align-self: center; \r\n display: grid;\r\n align-items: center; \r\n\r\n &:hover {\r\n background: #bbbbbb;\r\n }\r\n\r\n .expandableHeader {\r\n display: grid;\r\n grid-template-columns: 1fr 20px;\r\n\r\n .text {\r\n grid-column: 1;\r\n display: grid;\r\n grid-template-columns: 20px 1fr;\r\n\r\n .arrow {\r\n grid-column: 1;\r\n margin-left: 0px;\r\n color: black;\r\n cursor: pointer;\r\n display: inline-block;\r\n margin-right: 6px;\r\n opacity: 0.5;\r\n }\r\n\r\n .text-value {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n }\r\n }\r\n\r\n .expandAll { \r\n opacity: 0.5;\r\n grid-column: 2;\r\n margin-right: 10px; \r\n }\r\n }\r\n \r\n\r\n }\r\n\r\n .icon {\r\n display: grid;\r\n align-items: center; \r\n justify-items: center;\r\n cursor: pointer;\r\n }\r\n\r\n .addComponent {\r\n display: none;\r\n }\r\n\r\n .makeChild{\r\n grid-column: 3;\r\n }\r\n\r\n .itemContainer {\r\n margin-left: 0px;\r\n color: black;\r\n margin-top: 0px;\r\n margin-bottom: 0px;\r\n height: 32px; \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 display: grid;\r\n grid-template-columns: 20px 1fr;\r\n border: 2px solid transparent;\r\n &.hover {\r\n border: 2px solid #527089;\r\n cursor: pointer;\r\n }\r\n\r\n &.seAbove {\r\n border-top: 2px solid #527089;\r\n cursor: pointer;\r\n }\r\n &.seBelow {\r\n border-bottom: 2px solid #527089;\r\n cursor: pointer;\r\n }\r\n\r\n &.selected {\r\n \r\n background: #bfbebe;\r\n color: black;\r\n }\r\n\r\n &.dragged {\r\n background: transparent;\r\n color: black;\r\n }\r\n\r\n &.parent {\r\n background: #ffffff;\r\n color: black;\r\n }\r\n \r\n .isNotActive {\r\n opacity: 0.3;\r\n }\r\n .arrow {\r\n grid-column: 1;\r\n color: black;\r\n opacity: 0.6;\r\n }\r\n\r\n .popup {\r\n width: 200px;\r\n visibility: hidden;\r\n background-color: #bbbbbb;\r\n color: #fff;\r\n border: 1px solid rgba(255, 255, 255, 0.5);\r\n position: absolute;\r\n z-index: 1;\r\n margin-left: -180px;\r\n box-sizing: border-box;\r\n\r\n &.show {\r\n visibility: visible;\r\n }\r\n\r\n &:focus {\r\n outline: none;\r\n }\r\n\r\n .popupMenu {\r\n padding: 6px 5px 5px 10px;\r\n overflow: hidden;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n height: 18px;\r\n \r\n\r\n &:hover {\r\n background: white;\r\n color: #333333;\r\n }\r\n }\r\n }\r\n\r\n .sceneNode {\r\n grid-column: 2;\r\n margin-left: -10px;\r\n display: grid;\r\n grid-template-columns: 1fr 20px 20px 20px 20px 10px 20px 20px auto 5px;\r\n align-items: center;\r\n cursor: pointer; \r\n\r\n .sceneTitle {\r\n grid-column: 1;\r\n margin-right: 5px; \r\n display: flex;\r\n align-items: center; \r\n height: 24px; \r\n } \r\n\r\n .translation {\r\n grid-column: 2;\r\n opacity: 0.6;\r\n \r\n &.selected {\r\n opacity: 1;\r\n } \r\n }\r\n\r\n .rotation {\r\n grid-column: 3;\r\n opacity: 0.6;\r\n\r\n &.selected {\r\n opacity: 1;\r\n } \r\n }\r\n\r\n .scaling {\r\n grid-column: 4;\r\n opacity: 0.6;\r\n &.selected {\r\n opacity: 1;\r\n } \r\n }\r\n \r\n .bounding {\r\n grid-column: 5;\r\n opacity: 0.6;\r\n &.selected {\r\n opacity: 1;\r\n } \r\n }\r\n\r\n .separator {\r\n grid-column: 6;\r\n margin-left: 5px; \r\n width: 5px;\r\n display: flex;\r\n align-items: center; \r\n height: 18px; \r\n border-left: solid 1px rgb(51, 122, 183);\r\n }\r\n\r\n .pickingMode {\r\n grid-column: 7;\r\n opacity: 0.6;\r\n\r\n &.selected {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n .refresh {\r\n grid-column: 8;\r\n }\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 9;\r\n }\r\n }\r\n \r\n .adtextureTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr 20px auto 5px;\r\n align-items: center;\r\n \r\n .pickingMode {\r\n grid-column: 2;\r\n opacity: 0.6;\r\n\r\n &.selected {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 3;\r\n }\r\n } \r\n\r\n .controlTools {\r\n grid-column: 2;\r\n display: grid;\r\n align-items: center;\r\n\r\n .highlight {\r\n grid-column: 2;\r\n }\r\n\r\n .visibility {\r\n grid-column: 3;\r\n }\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 4;\r\n }\r\n } \r\n \r\n .title {\r\n background: transparent;\r\n white-space: nowrap;\r\n overflow: hidden;\r\n min-width: 0;\r\n margin-right: 5px;\r\n align-items: center; \r\n height: 24px;\r\n cursor: pointer;\r\n\r\n .titleText {\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n outline: none;\r\n } \r\n \r\n }\r\n }\r\n}"],"sourceRoot":""}]);
10142
+ ___CSS_LOADER_EXPORT___.push([module.i, "#ge-scene-explorer-host {\n position: absolute;\n left: 0px;\n top: 0px;\n bottom: 0px; }\n #ge-scene-explorer-host * {\n font-family: \"acumin-pro-condensed\"; }\n #ge-scene-explorer-host:focus {\n outline: none; }\n\n#ge-__resizable_base__ {\n display: none; }\n\n.ge-context-menu {\n background: #e2e2e2; }\n .ge-context-menu .react-contextmenu-item {\n padding: 10px;\n cursor: pointer; }\n .ge-context-menu .react-contextmenu-item:hover {\n background: #e2e2e2; }\n\n.ge-eact-contextmenu.context-menu.react-contextmenu--visible {\n z-index: 99;\n transform: scale(1); }\n\n#ge-sceneExplorer {\n background: #e2e2e2;\n height: 100%;\n margin: 0;\n padding: 0;\n display: grid;\n grid-template-rows: auto 1fr;\n font: 16px \"acumin-pro-condensed\"; }\n #ge-sceneExplorer:focus {\n outline: none; }\n #ge-sceneExplorer #header {\n height: 30px;\n font-size: 16px;\n color: black;\n background: #e2e2e2;\n grid-row: 1;\n text-align: center;\n display: grid;\n grid-template-columns: 30px 1fr 50px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none; }\n #ge-sceneExplorer #header #logo {\n position: relative;\n grid-column: 1;\n width: 24px;\n height: 24px;\n left: 0;\n display: flex;\n align-self: center;\n justify-self: center; }\n #ge-sceneExplorer #header #title {\n grid-column: 2;\n display: grid;\n align-items: center;\n text-align: center; }\n #ge-sceneExplorer #header #commands {\n grid-column: 3;\n display: grid;\n align-items: center;\n grid-template-columns: 1fr 1fr; }\n #ge-sceneExplorer #header #commands .expand {\n grid-column: 1;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #ge-sceneExplorer #header #commands .close {\n grid-column: 2;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #ge-sceneExplorer #tree {\n grid-row: 2;\n overflow-x: hidden;\n overflow-y: auto; }\n #ge-sceneExplorer .filter {\n display: flex;\n align-items: stretch; }\n #ge-sceneExplorer .filter input {\n width: 100%;\n margin: 10px 40px 5px 40px;\n display: block;\n border: none;\n padding: 0;\n border-bottom: solid 1px #337ab7;\n background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 96%, #337ab7 4%);\n background-position: -1000px 0;\n background-size: 1000px 100%;\n background-repeat: no-repeat;\n color: black; }\n #ge-sceneExplorer .filter input::placeholder {\n color: lightgray; }\n #ge-sceneExplorer .filter input:focus {\n box-shadow: none;\n outline: none;\n background-position: 0 0; }\n #ge-sceneExplorer .groupContainer {\n margin-left: 0px;\n color: black;\n margin-top: 0px;\n margin-bottom: 0px;\n height: 24px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n align-self: center;\n display: grid;\n align-items: center; }\n #ge-sceneExplorer .groupContainer:hover {\n background: #bbbbbb; }\n #ge-sceneExplorer .groupContainer .expandableHeader {\n display: grid;\n grid-template-columns: 1fr 20px; }\n #ge-sceneExplorer .groupContainer .expandableHeader .text {\n grid-column: 1;\n display: grid;\n grid-template-columns: 20px 1fr; }\n #ge-sceneExplorer .groupContainer .expandableHeader .text .arrow {\n grid-column: 1;\n margin-left: 0px;\n color: black;\n cursor: pointer;\n display: inline-block;\n margin-right: 6px;\n opacity: 0.5; }\n #ge-sceneExplorer .groupContainer .expandableHeader .text .text-value {\n grid-column: 2;\n display: flex;\n align-items: center; }\n #ge-sceneExplorer .groupContainer .expandableHeader .expandAll {\n opacity: 0.5;\n grid-column: 2;\n margin-right: 10px; }\n #ge-sceneExplorer .icon {\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #ge-sceneExplorer .addComponent {\n display: none; }\n #ge-sceneExplorer .makeChild {\n grid-column: 3; }\n #ge-sceneExplorer .itemContainer {\n margin-left: 0px;\n color: black;\n margin-top: 0px;\n margin-bottom: 0px;\n height: 32px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n display: grid;\n grid-template-columns: 20px 1fr;\n border: 2px solid transparent; }\n #ge-sceneExplorer .itemContainer.hover {\n border: 2px solid #527089;\n cursor: pointer; }\n #ge-sceneExplorer .itemContainer.seAbove {\n border-top: 2px solid #527089;\n cursor: pointer; }\n #ge-sceneExplorer .itemContainer.seBelow {\n border-bottom: 2px solid #527089;\n cursor: pointer; }\n #ge-sceneExplorer .itemContainer.selected {\n background: #bfbebe;\n color: black; }\n #ge-sceneExplorer .itemContainer.dragged {\n background: transparent;\n color: black; }\n #ge-sceneExplorer .itemContainer.parent {\n background: #ffffff;\n color: black; }\n #ge-sceneExplorer .itemContainer .isNotActive {\n opacity: 0.3; }\n #ge-sceneExplorer .itemContainer .arrow {\n grid-column: 1;\n color: black;\n opacity: 0.6; }\n #ge-sceneExplorer .itemContainer .popup {\n width: 200px;\n visibility: hidden;\n background-color: #bbbbbb;\n color: #fff;\n border: 1px solid rgba(255, 255, 255, 0.5);\n position: absolute;\n z-index: 1;\n margin-left: -180px;\n box-sizing: border-box; }\n #ge-sceneExplorer .itemContainer .popup.show {\n visibility: visible; }\n #ge-sceneExplorer .itemContainer .popup:focus {\n outline: none; }\n #ge-sceneExplorer .itemContainer .popup .popupMenu {\n padding: 6px 5px 5px 10px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n height: 18px; }\n #ge-sceneExplorer .itemContainer .popup .popupMenu:hover {\n background: white;\n color: #333333; }\n #ge-sceneExplorer .itemContainer .sceneNode {\n grid-column: 2;\n margin-left: -10px;\n display: grid;\n grid-template-columns: 1fr 20px 20px 20px 20px 10px 20px 20px auto 5px;\n align-items: center;\n cursor: pointer; }\n #ge-sceneExplorer .itemContainer .sceneNode .sceneTitle {\n grid-column: 1;\n margin-right: 5px;\n display: flex;\n align-items: center;\n height: 24px; }\n #ge-sceneExplorer .itemContainer .sceneNode .translation {\n grid-column: 2;\n opacity: 0.6; }\n #ge-sceneExplorer .itemContainer .sceneNode .translation.selected {\n opacity: 1; }\n #ge-sceneExplorer .itemContainer .sceneNode .rotation {\n grid-column: 3;\n opacity: 0.6; }\n #ge-sceneExplorer .itemContainer .sceneNode .rotation.selected {\n opacity: 1; }\n #ge-sceneExplorer .itemContainer .sceneNode .scaling {\n grid-column: 4;\n opacity: 0.6; }\n #ge-sceneExplorer .itemContainer .sceneNode .scaling.selected {\n opacity: 1; }\n #ge-sceneExplorer .itemContainer .sceneNode .bounding {\n grid-column: 5;\n opacity: 0.6; }\n #ge-sceneExplorer .itemContainer .sceneNode .bounding.selected {\n opacity: 1; }\n #ge-sceneExplorer .itemContainer .sceneNode .separator {\n grid-column: 6;\n margin-left: 5px;\n width: 5px;\n display: flex;\n align-items: center;\n height: 18px;\n border-left: solid 1px #337ab7; }\n #ge-sceneExplorer .itemContainer .sceneNode .pickingMode {\n grid-column: 7;\n opacity: 0.6; }\n #ge-sceneExplorer .itemContainer .sceneNode .pickingMode.selected {\n opacity: 1; }\n #ge-sceneExplorer .itemContainer .sceneNode .refresh {\n grid-column: 8; }\n #ge-sceneExplorer .itemContainer .sceneNode .extensions {\n width: 20px;\n grid-column: 9; }\n #ge-sceneExplorer .itemContainer .adtextureTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr 20px auto 5px;\n align-items: center; }\n #ge-sceneExplorer .itemContainer .adtextureTools .pickingMode {\n grid-column: 2;\n opacity: 0.6; }\n #ge-sceneExplorer .itemContainer .adtextureTools .pickingMode.selected {\n opacity: 1; }\n #ge-sceneExplorer .itemContainer .adtextureTools .extensions {\n width: 20px;\n grid-column: 3; }\n #ge-sceneExplorer .itemContainer .controlTools {\n grid-column: 2;\n display: grid;\n align-items: center;\n grid-template-columns: auto 1fr auto auto auto; }\n #ge-sceneExplorer .itemContainer .controlTools .controlType {\n grid-column: 1; }\n #ge-sceneExplorer .itemContainer .controlTools .controlType img {\n width: 32px;\n height: 32px;\n filter: invert(100%); }\n #ge-sceneExplorer .itemContainer .controlTools .highlight {\n grid-column: 3; }\n #ge-sceneExplorer .itemContainer .controlTools .visibility {\n grid-column: 4; }\n #ge-sceneExplorer .itemContainer .controlTools .extensions {\n width: 20px;\n grid-column: 5; }\n #ge-sceneExplorer .itemContainer .title {\n background: transparent;\n white-space: nowrap;\n overflow: hidden;\n min-width: 0;\n margin-right: 5px;\n align-items: center;\n height: 24px;\n cursor: pointer; }\n #ge-sceneExplorer .itemContainer .title .titleText {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n outline: none; }\n", "",{"version":3,"sources":["webpack://./components/sceneExplorer/sceneExplorer.scss"],"names":[],"mappings":"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","sourcesContent":["#ge-scene-explorer-host {\r\n position: absolute;\r\n left: 0px;\r\n top:0px;\r\n bottom: 0px;\r\n * {\r\n font-family: \"acumin-pro-condensed\";\r\n }\r\n &:focus {\r\n outline: none;\r\n }\r\n}\r\n\r\n#ge-__resizable_base__ {\r\n display: none;\r\n}\r\n\r\n.ge-context-menu {\r\n background: #e2e2e2;\r\n\r\n .react-contextmenu-item {\r\n padding: 10px;\r\n cursor: pointer;\r\n\r\n &:hover {\r\n background: #e2e2e2;\r\n }\r\n }\r\n}\r\n\r\n.ge-eact-contextmenu.context-menu.react-contextmenu--visible {\r\n z-index: 99;\r\n transform: scale(1);\r\n}\r\n\r\n#ge-sceneExplorer {\r\n background: #e2e2e2;\r\n height: 100%;\r\n margin: 0;\r\n padding: 0;\r\n display: grid;\r\n grid-template-rows: auto 1fr;\r\n font: 16px \"acumin-pro-condensed\";\r\n\r\n &:focus {\r\n outline: none;\r\n }\r\n\r\n #header {\r\n height: 30px;\r\n font-size: 16px;\r\n color: black;\r\n background: #e2e2e2;\r\n grid-row: 1;\r\n text-align: center;\r\n display: grid;\r\n grid-template-columns: 30px 1fr 50px; \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: 24px;\r\n height: 24px;\r\n left:0;\r\n display: flex;\r\n align-self: center; \r\n justify-self: center;\r\n } \r\n\r\n #title {\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 #commands {\r\n grid-column: 3; \r\n display: grid;\r\n align-items: center; \r\n grid-template-columns: 1fr 1fr; \r\n \r\n .expand {\r\n grid-column: 1;\r\n display: grid;\r\n align-items: center; \r\n justify-items: center;\r\n cursor: pointer; \r\n }\r\n\r\n .close {\r\n grid-column: 2;\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\r\n #tree {\r\n grid-row: 2; \r\n\r\n overflow-x: hidden;\r\n overflow-y: auto;\r\n }\r\n\r\n .filter {\r\n display: flex;\r\n align-items: stretch;\r\n\r\n input {\r\n width: 100%;\r\n margin: 10px 40px 5px 40px;\r\n display: block;\r\n border: none;\r\n padding: 0;\r\n border-bottom: solid 1px rgb(51, 122, 183);\r\n background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 96%, rgb(51, 122, 183) 4%);\r\n background-position: -1000px 0;\r\n background-size: 1000px 100%;\r\n background-repeat: no-repeat; \r\n color:black; \r\n }\r\n\r\n input::placeholder {\r\n color: lightgray;\r\n }\r\n\r\n input:focus {\r\n box-shadow: none;\r\n outline: none;\r\n background-position: 0 0;\r\n }\r\n }\r\n\r\n .groupContainer {\r\n margin-left: 0px;\r\n color: black;\r\n margin-top: 0px;\r\n margin-bottom: 0px;\r\n height: 24px; \r\n\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 align-self: center; \r\n display: grid;\r\n align-items: center; \r\n\r\n &:hover {\r\n background: #bbbbbb;\r\n }\r\n\r\n .expandableHeader {\r\n display: grid;\r\n grid-template-columns: 1fr 20px;\r\n\r\n .text {\r\n grid-column: 1;\r\n display: grid;\r\n grid-template-columns: 20px 1fr;\r\n\r\n .arrow {\r\n grid-column: 1;\r\n margin-left: 0px;\r\n color: black;\r\n cursor: pointer;\r\n display: inline-block;\r\n margin-right: 6px;\r\n opacity: 0.5;\r\n }\r\n\r\n .text-value {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n }\r\n }\r\n\r\n .expandAll { \r\n opacity: 0.5;\r\n grid-column: 2;\r\n margin-right: 10px; \r\n }\r\n }\r\n \r\n\r\n }\r\n\r\n .icon {\r\n display: grid;\r\n align-items: center; \r\n justify-items: center;\r\n cursor: pointer;\r\n }\r\n\r\n .addComponent {\r\n display: none;\r\n }\r\n\r\n .makeChild{\r\n grid-column: 3;\r\n }\r\n\r\n .itemContainer {\r\n margin-left: 0px;\r\n color: black;\r\n margin-top: 0px;\r\n margin-bottom: 0px;\r\n height: 32px; \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 display: grid;\r\n grid-template-columns: 20px 1fr;\r\n border: 2px solid transparent;\r\n &.hover {\r\n border: 2px solid #527089;\r\n cursor: pointer;\r\n }\r\n\r\n &.seAbove {\r\n border-top: 2px solid #527089;\r\n cursor: pointer;\r\n }\r\n &.seBelow {\r\n border-bottom: 2px solid #527089;\r\n cursor: pointer;\r\n }\r\n\r\n &.selected {\r\n \r\n background: #bfbebe;\r\n color: black;\r\n }\r\n\r\n &.dragged {\r\n background: transparent;\r\n color: black;\r\n }\r\n\r\n &.parent {\r\n background: #ffffff;\r\n color: black;\r\n }\r\n \r\n .isNotActive {\r\n opacity: 0.3;\r\n }\r\n .arrow {\r\n grid-column: 1;\r\n color: black;\r\n opacity: 0.6;\r\n }\r\n\r\n .popup {\r\n width: 200px;\r\n visibility: hidden;\r\n background-color: #bbbbbb;\r\n color: #fff;\r\n border: 1px solid rgba(255, 255, 255, 0.5);\r\n position: absolute;\r\n z-index: 1;\r\n margin-left: -180px;\r\n box-sizing: border-box;\r\n\r\n &.show {\r\n visibility: visible;\r\n }\r\n\r\n &:focus {\r\n outline: none;\r\n }\r\n\r\n .popupMenu {\r\n padding: 6px 5px 5px 10px;\r\n overflow: hidden;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n height: 18px;\r\n \r\n\r\n &:hover {\r\n background: white;\r\n color: #333333;\r\n }\r\n }\r\n }\r\n\r\n .sceneNode {\r\n grid-column: 2;\r\n margin-left: -10px;\r\n display: grid;\r\n grid-template-columns: 1fr 20px 20px 20px 20px 10px 20px 20px auto 5px;\r\n align-items: center;\r\n cursor: pointer; \r\n\r\n .sceneTitle {\r\n grid-column: 1;\r\n margin-right: 5px; \r\n display: flex;\r\n align-items: center; \r\n height: 24px; \r\n } \r\n\r\n .translation {\r\n grid-column: 2;\r\n opacity: 0.6;\r\n \r\n &.selected {\r\n opacity: 1;\r\n } \r\n }\r\n\r\n .rotation {\r\n grid-column: 3;\r\n opacity: 0.6;\r\n\r\n &.selected {\r\n opacity: 1;\r\n } \r\n }\r\n\r\n .scaling {\r\n grid-column: 4;\r\n opacity: 0.6;\r\n &.selected {\r\n opacity: 1;\r\n } \r\n }\r\n \r\n .bounding {\r\n grid-column: 5;\r\n opacity: 0.6;\r\n &.selected {\r\n opacity: 1;\r\n } \r\n }\r\n\r\n .separator {\r\n grid-column: 6;\r\n margin-left: 5px; \r\n width: 5px;\r\n display: flex;\r\n align-items: center; \r\n height: 18px; \r\n border-left: solid 1px rgb(51, 122, 183);\r\n }\r\n\r\n .pickingMode {\r\n grid-column: 7;\r\n opacity: 0.6;\r\n\r\n &.selected {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n .refresh {\r\n grid-column: 8;\r\n }\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 9;\r\n }\r\n }\r\n \r\n .adtextureTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr 20px auto 5px;\r\n align-items: center;\r\n \r\n .pickingMode {\r\n grid-column: 2;\r\n opacity: 0.6;\r\n\r\n &.selected {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 3;\r\n }\r\n } \r\n\r\n .controlTools {\r\n grid-column: 2;\r\n display: grid;\r\n align-items: center;\r\n grid-template-columns: auto 1fr auto auto auto;\r\n\r\n .controlType {\r\n grid-column: 1;\r\n img {\r\n width: 32px;\r\n height: 32px;\r\n filter: invert(100%);\r\n }\r\n }\r\n\r\n .highlight {\r\n grid-column: 3;\r\n }\r\n\r\n .visibility {\r\n grid-column: 4;\r\n }\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 5;\r\n }\r\n } \r\n \r\n .title {\r\n background: transparent;\r\n white-space: nowrap;\r\n overflow: hidden;\r\n min-width: 0;\r\n margin-right: 5px;\r\n align-items: center; \r\n height: 24px;\r\n cursor: pointer;\r\n\r\n .titleText {\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n outline: none;\r\n } \r\n \r\n }\r\n }\r\n}"],"sourceRoot":""}]);
10143
10143
  // Exports
10144
10144
  /* harmony default export */ __webpack_exports__["default"] = (___CSS_LOADER_EXPORT___);
10145
10145
 
@@ -10189,7 +10189,7 @@ __webpack_require__.r(__webpack_exports__);
10189
10189
 
10190
10190
  var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()(_node_modules_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default.a);
10191
10191
  // Module
10192
- ___CSS_LOADER_EXPORT___.push([module.i, ":root {\n --blackBarHeight: 55px; }\n\n#gui-editor-workbench-root {\n display: grid;\n grid-template-rows: calc(100% - 55px);\n height: 100%;\n width: 100%;\n background: #e2e2e2;\n font: 14px \"acumin-pro-condensed\"; }\n\n.wait-screen {\n display: grid;\n justify-content: center;\n align-content: center;\n height: 100%;\n width: 100%;\n background: #464646;\n opacity: 0.95;\n color: white;\n font: 24px \"acumin-pro-condensed\";\n position: absolute;\n top: 0;\n left: 0; }\n .wait-screen.hidden {\n visibility: hidden; }\n\n#leftGrab {\n grid-row: 1 / span 2;\n grid-column: 2;\n cursor: ew-resize; }\n\n#rightGrab {\n grid-row: 1 / span 2;\n grid-column: 5;\n cursor: ew-resize; }\n\n#toolbarGrab {\n background: #333333;\n grid-row: 1 / span 3;\n grid-column: 3;\n height: 100%; }\n #toolbarGrab .blackLine {\n height: 5px;\n background: black; }\n #toolbarGrab .toolbar-label {\n color: white;\n font-size: 18px;\n display: grid;\n align-items: center;\n cursor: pointer;\n user-select: none;\n grid-template-columns: 1fr 20px;\n grid-template-rows: 100%;\n position: relative; }\n #toolbarGrab .toolbar-label.active {\n font-weight: bold;\n font-size: 20px; }\n #toolbarGrab .toolbar-label:hover {\n background: var(--selectionGrey); }\n #toolbarGrab .toolbar-label:hover .sub-items {\n display: block; }\n #toolbarGrab .toolbar-icon {\n width: 40px;\n height: 40px; }\n\n.diagram-container {\n position: relative;\n display: grid;\n grid-row: 1;\n grid-column: 4;\n background: #CCCCCC;\n width: 100%;\n height: 100%;\n overflow: hidden; }\n .diagram-container .diagram {\n display: none;\n width: 100%;\n height: 100%; }\n\n.right-panel {\n grid-row: 1 / span 2;\n grid-column: 6;\n display: grid;\n grid-template-rows: 1fr 40px auto 40px;\n grid-template-columns: 100%;\n height: calc(100% - var(--blackBarHeight));\n overflow-y: auto; }\n .right-panel #propertyTab {\n grid-row: 1;\n grid-column: 1; }\n .right-panel .button {\n display: grid;\n justify-content: center;\n align-content: center;\n height: auto;\n width: calc(100% / 7);\n cursor: pointer; }\n .right-panel .button:hover {\n background: #337ab7;\n color: white;\n opacity: 0.8; }\n .right-panel .button.selected {\n background: #337ab7;\n color: white; }\n .right-panel .button.align {\n justify-content: stretch;\n text-align: center; }\n\n.blocker {\n visibility: hidden;\n position: absolute;\n width: calc(100% - 40px);\n height: 100%;\n top: 0;\n left: 0;\n background: rgba(20, 20, 20, 0.95);\n font-family: \"acumin-pro-condensed\";\n color: white;\n font-size: 24px;\n display: grid;\n align-content: center;\n justify-content: center;\n user-select: none;\n padding: 20px;\n text-align: center; }\n\n#log-console {\n grid-row: 2;\n grid-column: 4;\n display: none; }\n\n.dialog-container {\n position: absolute;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.6);\n display: grid;\n font-family: \"acumin-pro-condensed\";\n top: 0; }\n .dialog-container .dialog {\n align-self: center;\n justify-self: center;\n min-height: 140px;\n max-width: 400px;\n border-radius: 10px;\n background: white;\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: calc(100% - 50px) 50px; }\n .dialog-container .dialog .dialog-message {\n grid-row: 1;\n grid-column: 1;\n margin-top: 20px;\n padding: 10px;\n font-size: 18px;\n color: black; }\n .dialog-container .dialog .dialog-buttons {\n grid-row: 2;\n grid-column: 1;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%;\n color: white; }\n .dialog-container .dialog .dialog-buttons .dialog-button-ok {\n cursor: pointer;\n justify-self: center;\n background: green;\n min-width: 80px;\n justify-content: center;\n display: grid;\n align-content: center;\n align-self: center;\n height: 35px;\n border-radius: 10px; }\n .dialog-container .dialog .dialog-buttons .dialog-button-ok:hover {\n opacity: 0.8; }\n .dialog-container .dialog .dialog-buttons .dialog-button-ok.error {\n background: red; }\n\n.gizmo * {\n user-select: none; }\n\n.gizmo .bounding-box-line {\n background-color: black;\n position: absolute;\n line-height: 1px;\n height: 1px;\n pointer-events: none; }\n\n.gizmo .scale-point-container {\n position: absolute;\n width: 30px;\n height: 30px; }\n .gizmo .scale-point-container .scale-point {\n top: 10px;\n left: 10px;\n position: absolute;\n width: 10px;\n height: 10px;\n background: transparent;\n outline: #7d7d7d 2px solid; }\n .gizmo .scale-point-container .rotate-click-area {\n width: 20px;\n height: 20px;\n position: absolute; }\n .gizmo .scale-point-container .scale-click-area {\n width: 20px;\n height: 20px;\n position: absolute; }\n\n.gizmo .pivot-point {\n width: 30px;\n height: 30px;\n background: transparent;\n position: absolute; }\n\n#workbench-canvas {\n position: relative; }\n\n.artboard-stroke {\n outline: 1px solid black;\n position: absolute;\n z-index: 5;\n pointer-events: none; }\n\n.artboard-background {\n position: absolute;\n background: repeating-conic-gradient(#E2E2E2 0% 25%, white 0% 50%) 50%/10px 10px;\n width: 100%;\n height: 100%; }\n", "",{"version":3,"sources":["webpack://./main.scss"],"names":[],"mappings":"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","sourcesContent":[":root {\r\n --blackBarHeight: 55px;\r\n}\r\n\r\n#gui-editor-workbench-root {\r\n display: grid;\r\n grid-template-rows: calc(100% - 55px);\r\n height: 100%;\r\n width: 100%;\r\n background: #e2e2e2;\r\n font: 14px \"acumin-pro-condensed\"; \r\n}\r\n\r\n.wait-screen {\r\n display: grid;\r\n justify-content: center;\r\n align-content: center;\r\n height: 100%;\r\n width: 100%;\r\n background: #464646;\r\n opacity: 0.95;\r\n color:white;\r\n font: 24px \"acumin-pro-condensed\"; \r\n position: absolute;\r\n top: 0;\r\n left: 0; \r\n\r\n &.hidden {\r\n visibility: hidden;\r\n }\r\n}\r\n\r\n#leftGrab {\r\n grid-row: 1 / span 2;\r\n grid-column: 2;\r\n cursor: ew-resize;\r\n}\r\n\r\n#rightGrab {\r\n grid-row: 1 / span 2;\r\n grid-column: 5;\r\n cursor: ew-resize;\r\n}\r\n\r\n\r\n#toolbarGrab {\r\n background: #333333;\r\n grid-row: 1 / span 3;\r\n grid-column: 3;\r\n height: 100%;\r\n\r\n .blackLine {\r\n height: 5px;\r\n background: black;\r\n }\r\n .toolbar-label {\r\n color:white;\r\n font-size: 18px;\r\n display: grid;\r\n align-items: center;\r\n cursor: pointer;\r\n user-select: none;\r\n grid-template-columns: 1fr 20px;\r\n grid-template-rows: 100%;\r\n position: relative;\r\n\r\n &.active {\r\n font-weight: bold;\r\n font-size: 20px;\r\n }\r\n\r\n &:hover {\r\n background: var(--selectionGrey);\r\n .sub-items {\r\n display: block;\r\n }\r\n } \r\n }\r\n .toolbar-icon {\r\n width: 40px;\r\n height: 40px;\r\n }\r\n}\r\n\r\n.diagram-container {\r\n position: relative;\r\n display: grid;\r\n grid-row: 1;\r\n grid-column: 4;\r\n background: #CCCCCC;\r\n width: 100%;\r\n height: 100%;\r\n overflow: hidden;\r\n\r\n .diagram {\r\n display: none;\r\n width: 100%;\r\n height: 100%;\r\n }\r\n}\r\n\r\n.right-panel {\r\n grid-row: 1 / span 2;\r\n grid-column: 6;\r\n display: grid;\r\n grid-template-rows: 1fr 40px auto 40px;\r\n grid-template-columns: 100%;\r\n height: calc(100% - var(--blackBarHeight));\r\n overflow-y: auto;\r\n\r\n #propertyTab {\r\n grid-row: 1;\r\n grid-column: 1;\r\n } \r\n \r\n .button {\r\n display: grid;\r\n justify-content: center;\r\n align-content: center;\r\n height: auto;\r\n width: calc(100% / 7);\r\n cursor: pointer;\r\n\r\n &:hover {\r\n background: rgb(51, 122, 183);\r\n color: white;\r\n opacity: 0.8;\r\n }\r\n\r\n &.selected {\r\n background: rgb(51, 122, 183);\r\n color: white;\r\n }\r\n \r\n &.align {\r\n justify-content: stretch;\r\n text-align: center;\r\n }\r\n } \r\n}\r\n\r\n.blocker {\r\n visibility: hidden;\r\n position: absolute;\r\n width: calc(100% - 40px);\r\n height: 100%;\r\n top: 0;\r\n left: 0;\r\n\r\n background: rgba(20, 20, 20, 0.95); \r\n font-family: \"acumin-pro-condensed\";\r\n color: white;\r\n font-size: 24px;\r\n\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n\r\n user-select: none;\r\n\r\n padding: 20px;\r\n text-align: center;\r\n}\r\n\r\n#log-console {\r\n grid-row: 2;\r\n grid-column: 4;\r\n display: none;\r\n}\r\n\r\n.dialog-container {\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n background: rgba(0.1, 0.1, 0.1, 0.6);\r\n display: grid;\r\n font-family: \"acumin-pro-condensed\";\r\n top:0;\r\n\r\n .dialog {\r\n align-self: center;\r\n justify-self: center;\r\n min-height: 140px;\r\n max-width: 400px;\r\n border-radius: 10px;\r\n background: white;\r\n\r\n display: grid;\r\n grid-template-columns: 100%;\r\n grid-template-rows: calc(100% - 50px) 50px;\r\n\r\n .dialog-message {\r\n grid-row: 1;\r\n grid-column: 1;\r\n margin-top: 20px;\r\n padding: 10px;\r\n font-size: 18px;\r\n color: black;\r\n }\r\n\r\n .dialog-buttons {\r\n grid-row: 2;\r\n grid-column: 1;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 100%;\r\n color: white;\r\n\r\n .dialog-button-ok {\r\n cursor: pointer;\r\n justify-self: center;\r\n background:green;\r\n min-width: 80px;\r\n justify-content: center;\r\n display: grid;\r\n align-content: center;\r\n align-self: center;\r\n height: 35px; \r\n border-radius: 10px;\r\n\r\n &:hover {\r\n opacity: 0.8;\r\n }\r\n\r\n &.error {\r\n background: red;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n.gizmo {\r\n * {\r\n user-select: none;\r\n }\r\n .bounding-box-line {\r\n background-color: black;\r\n position: absolute;\r\n line-height: 1px;\r\n height: 1px;\r\n pointer-events: none;\r\n }\r\n .scale-point-container {\r\n position: absolute;\r\n width: 30px;\r\n height: 30px;\r\n .scale-point {\r\n top: 10px;\r\n left: 10px;\r\n position: absolute;\r\n width: 10px;\r\n height: 10px;\r\n background: transparent;\r\n outline: rgb(125, 125, 125) 2px solid;\r\n }\r\n .rotate-click-area {\r\n width: 20px;\r\n height: 20px;\r\n position: absolute;\r\n }\r\n .scale-click-area {\r\n width: 20px;\r\n height: 20px;\r\n position: absolute;\r\n }\r\n }\r\n .pivot-point {\r\n width: 30px;\r\n height: 30px;\r\n background: transparent;\r\n position: absolute;\r\n }\r\n}\r\n#workbench-canvas {\r\n position: relative;\r\n}\r\n.artboard-stroke {\r\n outline: 1px solid black;\r\n position: absolute;\r\n z-index: 5;\r\n pointer-events: none;\r\n}\r\n.artboard-background {\r\n position: absolute;\r\n background: repeating-conic-gradient(#E2E2E2 0% 25%, white 0% 50%) 50% / 10px 10px;\r\n width: 100%;\r\n height: 100%;\r\n}"],"sourceRoot":""}]);
10192
+ ___CSS_LOADER_EXPORT___.push([module.i, ":root {\n --blackBarHeight: 55px; }\n\n#gui-editor-workbench-root {\n display: grid;\n grid-template-rows: calc(100% - 55px);\n height: 100%;\n width: 100%;\n background: #e2e2e2;\n font: 14px \"acumin-pro-condensed\"; }\n\n.wait-screen {\n display: grid;\n justify-content: center;\n align-content: center;\n height: 100%;\n width: 100%;\n background: #464646;\n opacity: 0.95;\n color: white;\n font: 24px \"acumin-pro-condensed\";\n position: absolute;\n top: 0;\n left: 0; }\n .wait-screen.hidden {\n visibility: hidden; }\n\n#leftGrab {\n grid-row: 1 / span 2;\n grid-column: 2;\n cursor: ew-resize; }\n\n#rightGrab {\n cursor: ew-resize;\n width: 5px;\n height: 1000000px;\n position: absolute;\n top: 0;\n left: 0; }\n\n#toolbarGrab {\n background: #333333;\n grid-row: 1 / span 3;\n grid-column: 3;\n height: 100%; }\n #toolbarGrab .blackLine {\n height: 5px;\n background: black; }\n #toolbarGrab .toolbar-label {\n color: white;\n font-size: 18px;\n display: grid;\n align-items: center;\n cursor: pointer;\n user-select: none;\n grid-template-columns: 1fr 20px;\n grid-template-rows: 100%;\n position: relative; }\n #toolbarGrab .toolbar-label.active {\n font-weight: bold;\n font-size: 20px; }\n #toolbarGrab .toolbar-label:hover {\n background: var(--selectionGrey); }\n #toolbarGrab .toolbar-label:hover .sub-items {\n display: block; }\n #toolbarGrab .toolbar-icon {\n width: 40px;\n height: 40px; }\n\n.diagram-container {\n position: relative;\n display: grid;\n grid-row: 1;\n grid-column: 4;\n background: #CCCCCC;\n width: 100%;\n height: 100%;\n overflow: hidden; }\n .diagram-container .diagram {\n display: none;\n width: 100%;\n height: 100%; }\n\n.right-panel {\n grid-row: 1 / span 2;\n grid-column: 5;\n display: grid;\n grid-template-rows: 1fr 40px auto 40px;\n grid-template-columns: 100%;\n height: calc(100% - var(--blackBarHeight));\n overflow-y: auto;\n position: relative; }\n .right-panel #propertyTab {\n grid-row: 1;\n grid-column: 1; }\n .right-panel .button {\n display: grid;\n justify-content: center;\n align-content: center;\n height: auto;\n width: calc(100% / 7);\n cursor: pointer; }\n .right-panel .button:hover {\n background: #337ab7;\n color: white;\n opacity: 0.8; }\n .right-panel .button.selected {\n background: #337ab7;\n color: white; }\n .right-panel .button.align {\n justify-content: stretch;\n text-align: center; }\n\n.blocker {\n visibility: hidden;\n position: absolute;\n width: calc(100% - 40px);\n height: 100%;\n top: 0;\n left: 0;\n background: rgba(20, 20, 20, 0.95);\n font-family: \"acumin-pro-condensed\";\n color: white;\n font-size: 24px;\n display: grid;\n align-content: center;\n justify-content: center;\n user-select: none;\n padding: 20px;\n text-align: center; }\n\n#log-console {\n grid-row: 2;\n grid-column: 4;\n display: none; }\n\n.dialog-container {\n position: absolute;\n width: 100%;\n height: 100%;\n background: rgba(0, 0, 0, 0.6);\n display: grid;\n font-family: \"acumin-pro-condensed\";\n top: 0; }\n .dialog-container .dialog {\n align-self: center;\n justify-self: center;\n min-height: 140px;\n max-width: 400px;\n border-radius: 10px;\n background: white;\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: calc(100% - 50px) 50px; }\n .dialog-container .dialog .dialog-message {\n grid-row: 1;\n grid-column: 1;\n margin-top: 20px;\n padding: 10px;\n font-size: 18px;\n color: black; }\n .dialog-container .dialog .dialog-buttons {\n grid-row: 2;\n grid-column: 1;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%;\n color: white; }\n .dialog-container .dialog .dialog-buttons .dialog-button-ok {\n cursor: pointer;\n justify-self: center;\n background: green;\n min-width: 80px;\n justify-content: center;\n display: grid;\n align-content: center;\n align-self: center;\n height: 35px;\n border-radius: 10px; }\n .dialog-container .dialog .dialog-buttons .dialog-button-ok:hover {\n opacity: 0.8; }\n .dialog-container .dialog .dialog-buttons .dialog-button-ok.error {\n background: red; }\n\n.gizmo * {\n user-select: none; }\n\n.gizmo .bounding-box-line {\n background-color: black;\n position: absolute;\n line-height: 1px;\n height: 1px;\n pointer-events: none; }\n\n.gizmo .scale-point-container {\n position: absolute;\n width: 30px;\n height: 30px; }\n .gizmo .scale-point-container .scale-point {\n top: 10px;\n left: 10px;\n position: absolute;\n width: 10px;\n height: 10px;\n background: transparent;\n outline: #7d7d7d 2px solid; }\n .gizmo .scale-point-container .rotate-click-area {\n width: 20px;\n height: 20px;\n position: absolute; }\n .gizmo .scale-point-container .scale-click-area {\n width: 20px;\n height: 20px;\n position: absolute; }\n\n.gizmo .pivot-point {\n width: 30px;\n height: 30px;\n background: transparent;\n position: absolute; }\n\n#workbench-canvas {\n position: relative; }\n\n.artboard-stroke {\n outline: 1px solid black;\n position: absolute;\n z-index: 5;\n pointer-events: none; }\n\n.artboard-background {\n position: absolute;\n background: repeating-conic-gradient(#E2E2E2 0% 25%, white 0% 50%) 50%/10px 10px;\n width: 100%;\n height: 100%; }\n", "",{"version":3,"sources":["webpack://./main.scss"],"names":[],"mappings":"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","sourcesContent":[":root {\r\n --blackBarHeight: 55px;\r\n}\r\n\r\n#gui-editor-workbench-root {\r\n display: grid;\r\n grid-template-rows: calc(100% - 55px);\r\n height: 100%;\r\n width: 100%;\r\n background: #e2e2e2;\r\n font: 14px \"acumin-pro-condensed\"; \r\n}\r\n\r\n.wait-screen {\r\n display: grid;\r\n justify-content: center;\r\n align-content: center;\r\n height: 100%;\r\n width: 100%;\r\n background: #464646;\r\n opacity: 0.95;\r\n color:white;\r\n font: 24px \"acumin-pro-condensed\"; \r\n position: absolute;\r\n top: 0;\r\n left: 0; \r\n\r\n &.hidden {\r\n visibility: hidden;\r\n }\r\n}\r\n\r\n#leftGrab {\r\n grid-row: 1 / span 2;\r\n grid-column: 2;\r\n cursor: ew-resize;\r\n}\r\n\r\n#rightGrab {\r\n cursor: ew-resize;\r\n width: 5px;\r\n height: 1000000px;\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n}\r\n\r\n\r\n#toolbarGrab {\r\n background: #333333;\r\n grid-row: 1 / span 3;\r\n grid-column: 3;\r\n height: 100%;\r\n\r\n .blackLine {\r\n height: 5px;\r\n background: black;\r\n }\r\n .toolbar-label {\r\n color:white;\r\n font-size: 18px;\r\n display: grid;\r\n align-items: center;\r\n cursor: pointer;\r\n user-select: none;\r\n grid-template-columns: 1fr 20px;\r\n grid-template-rows: 100%;\r\n position: relative;\r\n\r\n &.active {\r\n font-weight: bold;\r\n font-size: 20px;\r\n }\r\n\r\n &:hover {\r\n background: var(--selectionGrey);\r\n .sub-items {\r\n display: block;\r\n }\r\n } \r\n }\r\n .toolbar-icon {\r\n width: 40px;\r\n height: 40px;\r\n }\r\n}\r\n\r\n.diagram-container {\r\n position: relative;\r\n display: grid;\r\n grid-row: 1;\r\n grid-column: 4;\r\n background: #CCCCCC;\r\n width: 100%;\r\n height: 100%;\r\n overflow: hidden;\r\n\r\n .diagram {\r\n display: none;\r\n width: 100%;\r\n height: 100%;\r\n }\r\n}\r\n\r\n.right-panel {\r\n grid-row: 1 / span 2;\r\n grid-column: 5;\r\n display: grid;\r\n grid-template-rows: 1fr 40px auto 40px;\r\n grid-template-columns: 100%;\r\n height: calc(100% - var(--blackBarHeight));\r\n overflow-y: auto;\r\n position: relative;\r\n\r\n #propertyTab {\r\n grid-row: 1;\r\n grid-column: 1;\r\n } \r\n \r\n .button {\r\n display: grid;\r\n justify-content: center;\r\n align-content: center;\r\n height: auto;\r\n width: calc(100% / 7);\r\n cursor: pointer;\r\n\r\n &:hover {\r\n background: rgb(51, 122, 183);\r\n color: white;\r\n opacity: 0.8;\r\n }\r\n\r\n &.selected {\r\n background: rgb(51, 122, 183);\r\n color: white;\r\n }\r\n \r\n &.align {\r\n justify-content: stretch;\r\n text-align: center;\r\n }\r\n } \r\n}\r\n\r\n.blocker {\r\n visibility: hidden;\r\n position: absolute;\r\n width: calc(100% - 40px);\r\n height: 100%;\r\n top: 0;\r\n left: 0;\r\n\r\n background: rgba(20, 20, 20, 0.95); \r\n font-family: \"acumin-pro-condensed\";\r\n color: white;\r\n font-size: 24px;\r\n\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n\r\n user-select: none;\r\n\r\n padding: 20px;\r\n text-align: center;\r\n}\r\n\r\n#log-console {\r\n grid-row: 2;\r\n grid-column: 4;\r\n display: none;\r\n}\r\n\r\n.dialog-container {\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n background: rgba(0.1, 0.1, 0.1, 0.6);\r\n display: grid;\r\n font-family: \"acumin-pro-condensed\";\r\n top:0;\r\n\r\n .dialog {\r\n align-self: center;\r\n justify-self: center;\r\n min-height: 140px;\r\n max-width: 400px;\r\n border-radius: 10px;\r\n background: white;\r\n\r\n display: grid;\r\n grid-template-columns: 100%;\r\n grid-template-rows: calc(100% - 50px) 50px;\r\n\r\n .dialog-message {\r\n grid-row: 1;\r\n grid-column: 1;\r\n margin-top: 20px;\r\n padding: 10px;\r\n font-size: 18px;\r\n color: black;\r\n }\r\n\r\n .dialog-buttons {\r\n grid-row: 2;\r\n grid-column: 1;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 100%;\r\n color: white;\r\n\r\n .dialog-button-ok {\r\n cursor: pointer;\r\n justify-self: center;\r\n background:green;\r\n min-width: 80px;\r\n justify-content: center;\r\n display: grid;\r\n align-content: center;\r\n align-self: center;\r\n height: 35px; \r\n border-radius: 10px;\r\n\r\n &:hover {\r\n opacity: 0.8;\r\n }\r\n\r\n &.error {\r\n background: red;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n.gizmo {\r\n * {\r\n user-select: none;\r\n }\r\n .bounding-box-line {\r\n background-color: black;\r\n position: absolute;\r\n line-height: 1px;\r\n height: 1px;\r\n pointer-events: none;\r\n }\r\n .scale-point-container {\r\n position: absolute;\r\n width: 30px;\r\n height: 30px;\r\n .scale-point {\r\n top: 10px;\r\n left: 10px;\r\n position: absolute;\r\n width: 10px;\r\n height: 10px;\r\n background: transparent;\r\n outline: rgb(125, 125, 125) 2px solid;\r\n }\r\n .rotate-click-area {\r\n width: 20px;\r\n height: 20px;\r\n position: absolute;\r\n }\r\n .scale-click-area {\r\n width: 20px;\r\n height: 20px;\r\n position: absolute;\r\n }\r\n }\r\n .pivot-point {\r\n width: 30px;\r\n height: 30px;\r\n background: transparent;\r\n position: absolute;\r\n }\r\n}\r\n#workbench-canvas {\r\n position: relative;\r\n}\r\n.artboard-stroke {\r\n outline: 1px solid black;\r\n position: absolute;\r\n z-index: 5;\r\n pointer-events: none;\r\n}\r\n.artboard-background {\r\n position: absolute;\r\n background: repeating-conic-gradient(#E2E2E2 0% 25%, white 0% 50%) 50% / 10px 10px;\r\n width: 100%;\r\n height: 100%;\r\n}"],"sourceRoot":""}]);
10193
10193
  // Exports
10194
10194
  /* harmony default export */ __webpack_exports__["default"] = (___CSS_LOADER_EXPORT___);
10195
10195
 
@@ -10214,7 +10214,7 @@ __webpack_require__.r(__webpack_exports__);
10214
10214
 
10215
10215
  var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()(_node_modules_css_loader_dist_runtime_cssWithMappingToString_js__WEBPACK_IMPORTED_MODULE_0___default.a);
10216
10216
  // Module
10217
- ___CSS_LOADER_EXPORT___.push([module.i, ":root {\n --selectionGrey: #666666; }\n\n.ge-commands {\n grid-row: 1;\n grid-column: 1;\n user-select: none; }\n .ge-commands .commands-left {\n float: left;\n display: flex; }\n .ge-commands .commands-right {\n float: right;\n display: flex; }\n .ge-commands.background-ts .command-button img, .ge-commands.background-ts .command-dropdown img {\n filter: invert(64%) sepia(78%) saturate(940%) hue-rotate(323deg) brightness(105%) contrast(103%); }\n .ge-commands.background-ts .command-button .command-dropdown-active, .ge-commands.background-ts .command-dropdown .command-dropdown-active {\n color: #333333; }\n .ge-commands.background-ts .command-button:hover img, .ge-commands.background-ts .command-button.activated img, .ge-commands.background-ts .command-dropdown:hover img, .ge-commands.background-ts .command-dropdown.activated img {\n filter: invert(34%) sepia(21%) saturate(3832%) hue-rotate(324deg) brightness(88%) contrast(82%) !important; }\n .ge-commands.background-js .command-button img, .ge-commands.background-js .command-dropdown img {\n filter: invert(57%) sepia(80%) saturate(2031%) hue-rotate(215deg); }\n .ge-commands.background-js .command-button .command-dropdown-active, .ge-commands.background-js .command-dropdown .command-dropdown-active {\n color: #333333; }\n .ge-commands.background-js .command-button:hover img, .ge-commands.background-js .command-button.activated img, .ge-commands.background-js .command-dropdown:hover img, .ge-commands.background-js .command-dropdown.activated img {\n filter: invert(17%) !important; }\n .ge-commands .command-button {\n cursor: pointer;\n width: 55px; }\n .ge-commands .command-button .command-label {\n display: none; }\n .ge-commands .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-commands .command-button:hover {\n background-color: var(--selectionGrey); }\n .ge-commands .command-button .active {\n transform-origin: center;\n background-color: var(--selectionGrey); }\n .ge-commands .command-button img.active {\n background-color: var(--selectionGrey); }\n .ge-commands .command-dropdown-root {\n position: relative;\n text-transform: uppercase;\n z-index: 1; }\n .ge-commands .command-dropdown {\n cursor: pointer;\n width: 55px;\n height: 55px; }\n .ge-commands .command-dropdown .command-dropdown-icon {\n height: 100%;\n width: 100%;\n display: grid;\n align-content: center;\n justify-content: center; }\n .ge-commands .command-dropdown .command-dropdown-active {\n height: 100%;\n width: 100%;\n display: grid;\n align-content: center;\n justify-content: center;\n font-size: 14px; }\n .ge-commands .command-dropdown:hover, .ge-commands .command-dropdown.activated {\n background-color: #666666;\n color: black; }\n .ge-commands .command-dropdown:active {\n transform-origin: center;\n transform: scale(0.95); }\n .ge-commands .command-dropdown-blocker {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n transform: scale(1);\n z-index: 1; }\n .ge-commands.background-js .command-dropdown-content {\n background: #333333; }\n .ge-commands.background-js .command-dropdown-content .command-dropdown-label:hover {\n background: #333333; }\n .ge-commands.background-ts .command-dropdown-content .command-dropdown-label:hover {\n background: #333333; }\n .ge-commands .command-dropdown-content {\n background: #333333;\n position: absolute;\n top: 55px;\n width: 55px;\n transform: scale(1); }\n .ge-commands .command-dropdown-content.toRight {\n width: 120px; }\n .ge-commands .command-dropdown-content .command-dropdown-label {\n color: white;\n padding: 5px;\n padding-left: 7px;\n height: 35px;\n font-size: 18px;\n display: grid;\n align-items: center;\n cursor: pointer;\n user-select: none;\n grid-template-columns: 1fr 20px;\n grid-template-rows: 100%;\n position: relative; }\n .ge-commands .command-dropdown-content .command-dropdown-label.active {\n font-weight: bold;\n font-size: 20px; }\n .ge-commands .command-dropdown-content .command-dropdown-label:hover {\n background: var(--selectionGrey); }\n .ge-commands .command-dropdown-content .command-dropdown-label:hover .sub-items {\n display: block; }\n .ge-commands .command-dropdown-content .command-dropdown-label .command-dropdown-label-text {\n font-family: Arial;\n font-size: 12px;\n grid-column: 1;\n grid-row: 1; }\n .ge-commands .command-dropdown-content .command-dropdown-label .command-dropdown-label-check {\n grid-column: 2;\n grid-row: 1; }\n .ge-commands .command-dropdown-content .command-dropdown-label .command-dropdown-arrow {\n grid-column: 2;\n grid-row: 1;\n font-size: 20px;\n font-weight: bold;\n padding-bottom: 10px;\n padding-left: 4px; }\n .ge-commands .command-dropdown-content .command-dropdown-label .sub-items {\n position: absolute;\n left: 200px;\n top: 0;\n width: 150px;\n display: none; }\n .ge-commands .command-dropdown-content .command-dropdown-label .sub-items.background-js {\n background: #bfabff; }\n .ge-commands .command-dropdown-content .command-dropdown-label .sub-items.background-js .sub-item:hover {\n background-color: #333333;\n color: white; }\n .ge-commands .command-dropdown-content .command-dropdown-label .sub-items.background-ts {\n background: #333333; }\n .ge-commands .command-dropdown-content .command-dropdown-label .sub-items.background-ts .sub-item:hover {\n background-color: #333333;\n color: white; }\n .ge-commands .command-dropdown-content .command-dropdown-label .sub-items .sub-item {\n color: white;\n padding: 5px;\n padding-left: 10px;\n height: 35px;\n display: grid; }\n .ge-commands .command-dropdown-content .command-dropdown-label .sub-items .sub-item.checked {\n background: white;\n color: black; }\n .ge-commands .command-dropdown-content .buttonLine {\n color: white;\n padding: 5px;\n padding-left: 7px;\n height: 35px;\n font-size: 18px;\n display: grid;\n align-items: center;\n cursor: pointer;\n user-select: none;\n grid-template-columns: 1fr 20px;\n grid-template-rows: 100%;\n position: relative;\n font-family: Arial;\n font-size: 12px;\n grid-column: 1;\n grid-row: 1; }\n .ge-commands .command-dropdown-content .buttonLine input[type=\"file\"] {\n display: none; }\n .ge-commands .command-dropdown-content .buttonLine.active {\n font-weight: bold;\n font-size: 20px;\n cursor: pointer; }\n .ge-commands .command-dropdown-content .buttonLine:hover {\n background: var(--selectionGrey);\n cursor: pointer; }\n .ge-commands .command-dropdown-content .buttonLine:hover .sub-items {\n display: block; }\n .ge-commands .command-dropdown-content .buttonLine .file-upload {\n cursor: pointer; }\n", "",{"version":3,"sources":["webpack://./scss/commandBar.scss"],"names":[],"mappings":"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","sourcesContent":[":root {\r\n --selectionGrey: #666666;\r\n}\r\n\r\n.ge-commands {\r\n grid-row: 1;\r\n grid-column: 1;\r\n user-select: none;\r\n\r\n .commands-left {\r\n float: left;\r\n display: flex;\r\n }\r\n\r\n .commands-right {\r\n float: right;\r\n display: flex;\r\n }\r\n\r\n &.background-ts {\r\n .command-button, .command-dropdown {\r\n img {\r\n filter: invert(64%) sepia(78%) saturate(940%) hue-rotate(323deg) brightness(105%) contrast(103%);\r\n }\r\n\r\n .command-dropdown-active {\r\n color: #333333;\r\n }\r\n\r\n &:hover, &.activated {\r\n img {\r\n filter: invert(34%) sepia(21%) saturate(3832%) hue-rotate(324deg) brightness(88%) contrast(82%) !important;\r\n }\r\n } \r\n }\r\n }\r\n\r\n &.background-js {\r\n .command-button, .command-dropdown {\r\n img {\r\n filter: invert(57%) sepia(80%) saturate(2031%) hue-rotate(215deg);\r\n }\r\n\r\n .command-dropdown-active {\r\n color: #333333;\r\n }\r\n\r\n &:hover, &.activated {\r\n img {\r\n filter: invert(17%) !important;\r\n }\r\n } \r\n }\r\n }\r\n\r\n .command-button {\r\n cursor: pointer;\r\n width: 55px;\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: var(--selectionGrey);\r\n } \r\n \r\n .active {\r\n transform-origin: center;\r\n background-color: var(--selectionGrey);\r\n }\r\n\r\n img {\r\n &.active {\r\n background-color: var(--selectionGrey);\r\n }\r\n }\r\n }\r\n\r\n .command-dropdown-root {\r\n position: relative;\r\n text-transform: uppercase;\r\n z-index: 1;\r\n }\r\n\r\n .command-dropdown { \r\n cursor: pointer;\r\n width: 55px;\r\n height: 55px;\r\n\r\n .command-dropdown-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 .command-dropdown-active {\r\n height: 100%;\r\n width: 100%;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n font-size: 14px;\r\n }\r\n\r\n &:hover, &.activated {\r\n background-color:#666666;\r\n color: black;\r\n } \r\n \r\n &:active {\r\n transform-origin: center;\r\n transform: scale(0.95);\r\n }\r\n }\r\n\r\n .command-dropdown-blocker {\r\n position: absolute; \r\n top:0;\r\n left:0;\r\n width: 100%;\r\n height: 100%;\r\n transform: scale(1);\r\n z-index: 1;\r\n }\r\n\r\n &.background-js {\r\n .command-dropdown-content {\r\n background: #333333;\r\n .command-dropdown-label {\r\n &:hover {\r\n background: #333333;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.background-ts {\r\n .command-dropdown-content {\r\n .command-dropdown-label {\r\n &:hover {\r\n background: #333333;\r\n }\r\n }\r\n }\r\n }\r\n \r\n .command-dropdown-content {\r\n background: #333333;\r\n position: absolute;\r\n top: 55px;\r\n width: 55px;\r\n transform: scale(1);\r\n\r\n &.toRight {\r\n width: 120px;\r\n } \r\n \r\n .command-dropdown-label {\r\n color:white;\r\n padding: 5px;\r\n padding-left: 7px;\r\n height: 35px;\r\n font-size: 18px;\r\n display: grid;\r\n align-items: center;\r\n cursor: pointer;\r\n user-select: none;\r\n grid-template-columns: 1fr 20px;\r\n grid-template-rows: 100%;\r\n position: relative;\r\n\r\n &.active {\r\n font-weight: bold;\r\n font-size: 20px;\r\n }\r\n\r\n &:hover {\r\n background: var(--selectionGrey);\r\n .sub-items {\r\n display: block;\r\n }\r\n } \r\n\r\n .command-dropdown-label-text {\r\n font-family: Arial;\r\n font-size: 12px;\r\n grid-column: 1;\r\n grid-row: 1;\r\n }\r\n\r\n .command-dropdown-label-check {\r\n grid-column: 2;\r\n grid-row: 1;\r\n }\r\n\r\n .command-dropdown-arrow {\r\n grid-column: 2;\r\n grid-row: 1; \r\n font-size: 20px;\r\n font-weight: bold;\r\n padding-bottom: 10px;\r\n padding-left: 4px;\r\n }\r\n\r\n .sub-items {\r\n position: absolute;\r\n left: 200px;\r\n top: 0;\r\n width: 150px;\r\n display: none; \r\n \r\n &.background-js {\r\n background: #bfabff;\r\n .sub-item { \r\n &:hover {\r\n background-color: #333333;\r\n color: white;\r\n }\r\n }\r\n } \r\n\r\n &.background-ts {\r\n background: #333333;\r\n .sub-item { \r\n &:hover {\r\n background-color: #333333;\r\n color: white;\r\n }\r\n }\r\n } \r\n \r\n .sub-item { \r\n color: white;\r\n padding: 5px;\r\n padding-left: 10px;\r\n height: 35px;\r\n display: grid;\r\n\r\n &.checked {\r\n background: white;\r\n color: black;\r\n }\r\n }\r\n } \r\n }\r\n\r\n .buttonLine {\r\n color:white;\r\n padding: 5px;\r\n padding-left: 7px;\r\n height: 35px;\r\n font-size: 18px;\r\n display: grid;\r\n align-items: center;\r\n cursor: pointer;\r\n user-select: none;\r\n grid-template-columns: 1fr 20px;\r\n grid-template-rows: 100%;\r\n position: relative;\r\n font-family: Arial;\r\n font-size: 12px;\r\n grid-column: 1;\r\n grid-row: 1;\r\n input[type=\"file\"] {\r\n display: none;\r\n }\r\n\r\n &.active {\r\n font-weight: bold;\r\n font-size: 20px;\r\n cursor: pointer;\r\n }\r\n\r\n &:hover {\r\n background: var(--selectionGrey);\r\n .sub-items {\r\n display: block;\r\n }\r\n cursor: pointer;\r\n } \r\n\r\n .file-upload{\r\n cursor: pointer;\r\n }\r\n }\r\n }\r\n\r\n}\r\n"],"sourceRoot":""}]);
10217
+ ___CSS_LOADER_EXPORT___.push([module.i, ":root {\n --selectionGrey: #666666; }\n\n.ge-commands {\n grid-row: 1;\n grid-column: 1;\n user-select: none; }\n .ge-commands * {\n font-family: \"acumin-pro-condensed\";\n font-weight: 600;\n font-size: 12px; }\n .ge-commands .commands-left {\n float: left;\n display: flex; }\n .ge-commands .commands-right {\n float: right;\n display: flex; }\n .ge-commands.background-ts .command-button img, .ge-commands.background-ts .command-dropdown img {\n filter: invert(64%) sepia(78%) saturate(940%) hue-rotate(323deg) brightness(105%) contrast(103%); }\n .ge-commands.background-ts .command-button .command-dropdown-active, .ge-commands.background-ts .command-dropdown .command-dropdown-active {\n color: #333333; }\n .ge-commands.background-ts .command-button:hover img, .ge-commands.background-ts .command-button.activated img, .ge-commands.background-ts .command-dropdown:hover img, .ge-commands.background-ts .command-dropdown.activated img {\n filter: invert(34%) sepia(21%) saturate(3832%) hue-rotate(324deg) brightness(88%) contrast(82%) !important; }\n .ge-commands.background-js .command-button img, .ge-commands.background-js .command-dropdown img {\n filter: invert(57%) sepia(80%) saturate(2031%) hue-rotate(215deg); }\n .ge-commands.background-js .command-button .command-dropdown-active, .ge-commands.background-js .command-dropdown .command-dropdown-active {\n color: #333333; }\n .ge-commands.background-js .command-button:hover img, .ge-commands.background-js .command-button.activated img, .ge-commands.background-js .command-dropdown:hover img, .ge-commands.background-js .command-dropdown.activated img {\n filter: invert(17%) !important; }\n .ge-commands .command-button {\n cursor: pointer;\n width: 55px;\n height: 55px; }\n .ge-commands .command-button .command-label {\n display: none; }\n .ge-commands .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-commands .command-button:hover {\n background-color: var(--selectionGrey); }\n .ge-commands .command-button .active {\n transform-origin: center;\n background-color: var(--selectionGrey); }\n .ge-commands .command-button img.active {\n background-color: var(--selectionGrey); }\n .ge-commands .command-dropdown-root {\n position: relative;\n text-transform: uppercase;\n z-index: 1; }\n .ge-commands .command-dropdown {\n cursor: pointer;\n width: 55px;\n height: 55px; }\n .ge-commands .command-dropdown .command-dropdown-icon {\n height: 100%;\n width: 100%;\n display: grid;\n align-content: center;\n justify-content: center; }\n .ge-commands .command-dropdown .command-dropdown-active {\n height: 100%;\n width: 100%;\n display: grid;\n align-content: center;\n justify-content: center;\n font-size: 14px; }\n .ge-commands .command-dropdown:hover, .ge-commands .command-dropdown.activated {\n background-color: #666666;\n color: black; }\n .ge-commands .command-dropdown:active {\n transform-origin: center;\n transform: scale(0.95); }\n .ge-commands .command-dropdown-blocker {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n transform: scale(1);\n z-index: 1; }\n .ge-commands.background-js .command-dropdown-content {\n background: #333333; }\n .ge-commands.background-js .command-dropdown-content .command-dropdown-label:hover {\n background: #333333; }\n .ge-commands.background-ts .command-dropdown-content .command-dropdown-label:hover {\n background: #333333; }\n .ge-commands .command-dropdown-content {\n background: #333333;\n position: absolute;\n top: 55px;\n width: 55px;\n transform: scale(1); }\n .ge-commands .command-dropdown-content.toRight {\n width: 120px; }\n .ge-commands .command-dropdown-content .command-dropdown-label {\n color: white;\n padding: 5px;\n padding-left: 7px;\n height: 35px;\n font-size: 18px;\n display: grid;\n align-items: center;\n cursor: pointer;\n user-select: none;\n grid-template-columns: 1fr 20px;\n grid-template-rows: 100%;\n position: relative; }\n .ge-commands .command-dropdown-content .command-dropdown-label.active {\n font-weight: bold;\n font-size: 20px; }\n .ge-commands .command-dropdown-content .command-dropdown-label:hover {\n background: var(--selectionGrey); }\n .ge-commands .command-dropdown-content .command-dropdown-label:hover .sub-items {\n display: block; }\n .ge-commands .command-dropdown-content .command-dropdown-label .command-dropdown-label-text {\n font-size: 12px;\n grid-column: 1;\n grid-row: 1; }\n .ge-commands .command-dropdown-content .command-dropdown-label .command-dropdown-label-check {\n grid-column: 2;\n grid-row: 1; }\n .ge-commands .command-dropdown-content .command-dropdown-label .command-dropdown-arrow {\n grid-column: 2;\n grid-row: 1;\n font-size: 20px;\n font-weight: bold;\n padding-bottom: 10px;\n padding-left: 4px; }\n .ge-commands .command-dropdown-content .command-dropdown-label .sub-items {\n position: absolute;\n left: 200px;\n top: 0;\n width: 150px;\n display: none; }\n .ge-commands .command-dropdown-content .command-dropdown-label .sub-items.background-js {\n background: #bfabff; }\n .ge-commands .command-dropdown-content .command-dropdown-label .sub-items.background-js .sub-item:hover {\n background-color: #333333;\n color: white; }\n .ge-commands .command-dropdown-content .command-dropdown-label .sub-items.background-ts {\n background: #333333; }\n .ge-commands .command-dropdown-content .command-dropdown-label .sub-items.background-ts .sub-item:hover {\n background-color: #333333;\n color: white; }\n .ge-commands .command-dropdown-content .command-dropdown-label .sub-items .sub-item {\n color: white;\n padding: 5px;\n padding-left: 10px;\n height: 35px;\n display: grid; }\n .ge-commands .command-dropdown-content .command-dropdown-label .sub-items .sub-item.checked {\n background: white;\n color: black; }\n .ge-commands .command-dropdown-content .buttonLine {\n color: white;\n padding: 5px;\n padding-left: 7px;\n height: 35px;\n font-size: 18px;\n display: grid;\n align-items: center;\n cursor: pointer;\n user-select: none;\n grid-template-columns: 1fr 20px;\n grid-template-rows: 100%;\n position: relative;\n font-size: 12px;\n grid-column: 1;\n grid-row: 1; }\n .ge-commands .command-dropdown-content .buttonLine input[type=\"file\"] {\n display: none; }\n .ge-commands .command-dropdown-content .buttonLine.active {\n font-weight: bold;\n font-size: 20px;\n cursor: pointer; }\n .ge-commands .command-dropdown-content .buttonLine:hover {\n background: var(--selectionGrey);\n cursor: pointer; }\n .ge-commands .command-dropdown-content .buttonLine:hover .sub-items {\n display: block; }\n .ge-commands .command-dropdown-content .buttonLine .file-upload {\n cursor: pointer; }\n .ge-commands .divider {\n display: flex;\n align-items: center;\n border-right: 1px solid black;\n color: white; }\n .ge-commands .divider:last-of-type {\n border-right: none; }\n .ge-commands .divider.padded {\n padding-left: 10px;\n padding-right: 10px; }\n .ge-commands .floatLine, .ge-commands .checkBoxLine {\n display: flex;\n align-items: center; }\n .ge-commands .checkBoxLine .icon {\n filter: brightness(10); }\n .ge-commands .checkBoxLine .hidden {\n display: none; }\n .ge-commands .checkBoxLine .checkBox {\n height: 40px; }\n .ge-commands .color3Line {\n display: grid; }\n .ge-commands .color3Line .firstLine {\n display: flex;\n align-items: center; }\n .ge-commands .color3Line .firstLine .label {\n padding-right: 5px; }\n .ge-commands .color3Line .firstLine .textInputLine .value {\n padding-left: 2px; }\n .ge-commands .color3Line .firstLine .copy {\n display: none; }\n .ge-commands .color3Line .firstLine .expand {\n display: none; }\n .ge-commands .color3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n .ge-commands .color3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n .ge-commands .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-commands .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-commands .color-picker {\n height: 26px;\n width: 26px; }\n .ge-commands .color-picker .color-rect-background {\n width: calc(100% - 2px);\n height: calc(100% - 2px);\n border: 1px solid white;\n cursor: pointer;\n background: repeating-conic-gradient(#E2E2E2 0% 25%, white 0% 50%) 50%/100% 100%; }\n .ge-commands .color-picker .color-rect-background .color-rect {\n height: 100%; }\n .ge-commands .color-picker .color-picker-cover {\n position: fixed;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n z-index: 2; }\n .ge-commands .color-picker .color-picker-float {\n position: absolute; }\n .ge-commands .floatLine input, .ge-commands .listLine select {\n background-color: #000000;\n color: white;\n margin: 5px;\n outline: none;\n padding: 5px;\n border: none; }\n .ge-commands .listLine select {\n width: 150px; }\n", "",{"version":3,"sources":["webpack://./scss/commandBar.scss"],"names":[],"mappings":"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","sourcesContent":[":root {\r\n --selectionGrey: #666666;\r\n}\r\n\r\n.ge-commands {\r\n * {\r\n font-family: \"acumin-pro-condensed\";\r\n font-weight: 600;\r\n font-size: 12px;\r\n }\r\n grid-row: 1;\r\n grid-column: 1;\r\n user-select: none;\r\n\r\n .commands-left {\r\n float: left;\r\n display: flex;\r\n }\r\n\r\n .commands-right {\r\n float: right;\r\n display: flex;\r\n }\r\n\r\n &.background-ts {\r\n .command-button, .command-dropdown {\r\n img {\r\n filter: invert(64%) sepia(78%) saturate(940%) hue-rotate(323deg) brightness(105%) contrast(103%);\r\n }\r\n\r\n .command-dropdown-active {\r\n color: #333333;\r\n }\r\n\r\n &:hover, &.activated {\r\n img {\r\n filter: invert(34%) sepia(21%) saturate(3832%) hue-rotate(324deg) brightness(88%) contrast(82%) !important;\r\n }\r\n } \r\n }\r\n }\r\n\r\n &.background-js {\r\n .command-button, .command-dropdown {\r\n img {\r\n filter: invert(57%) sepia(80%) saturate(2031%) hue-rotate(215deg);\r\n }\r\n\r\n .command-dropdown-active {\r\n color: #333333;\r\n }\r\n\r\n &:hover, &.activated {\r\n img {\r\n filter: invert(17%) !important;\r\n }\r\n } \r\n }\r\n }\r\n\r\n .command-button {\r\n cursor: pointer;\r\n width: 55px;\r\n height: 55px;\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: var(--selectionGrey);\r\n } \r\n \r\n .active {\r\n transform-origin: center;\r\n background-color: var(--selectionGrey);\r\n }\r\n\r\n img {\r\n &.active {\r\n background-color: var(--selectionGrey);\r\n }\r\n }\r\n }\r\n\r\n .command-dropdown-root {\r\n position: relative;\r\n text-transform: uppercase;\r\n z-index: 1;\r\n }\r\n\r\n .command-dropdown { \r\n cursor: pointer;\r\n width: 55px;\r\n height: 55px;\r\n\r\n .command-dropdown-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 .command-dropdown-active {\r\n height: 100%;\r\n width: 100%;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n font-size: 14px;\r\n }\r\n\r\n &:hover, &.activated {\r\n background-color:#666666;\r\n color: black;\r\n } \r\n \r\n &:active {\r\n transform-origin: center;\r\n transform: scale(0.95);\r\n }\r\n }\r\n\r\n .command-dropdown-blocker {\r\n position: absolute; \r\n top:0;\r\n left:0;\r\n width: 100%;\r\n height: 100%;\r\n transform: scale(1);\r\n z-index: 1;\r\n }\r\n\r\n &.background-js {\r\n .command-dropdown-content {\r\n background: #333333;\r\n .command-dropdown-label {\r\n &:hover {\r\n background: #333333;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.background-ts {\r\n .command-dropdown-content {\r\n .command-dropdown-label {\r\n &:hover {\r\n background: #333333;\r\n }\r\n }\r\n }\r\n }\r\n \r\n .command-dropdown-content {\r\n background: #333333;\r\n position: absolute;\r\n top: 55px;\r\n width: 55px;\r\n transform: scale(1);\r\n\r\n &.toRight {\r\n width: 120px;\r\n } \r\n \r\n .command-dropdown-label {\r\n color:white;\r\n padding: 5px;\r\n padding-left: 7px;\r\n height: 35px;\r\n font-size: 18px;\r\n display: grid;\r\n align-items: center;\r\n cursor: pointer;\r\n user-select: none;\r\n grid-template-columns: 1fr 20px;\r\n grid-template-rows: 100%;\r\n position: relative;\r\n\r\n &.active {\r\n font-weight: bold;\r\n font-size: 20px;\r\n }\r\n\r\n &:hover {\r\n background: var(--selectionGrey);\r\n .sub-items {\r\n display: block;\r\n }\r\n } \r\n\r\n .command-dropdown-label-text {\r\n font-size: 12px;\r\n grid-column: 1;\r\n grid-row: 1;\r\n }\r\n\r\n .command-dropdown-label-check {\r\n grid-column: 2;\r\n grid-row: 1;\r\n }\r\n\r\n .command-dropdown-arrow {\r\n grid-column: 2;\r\n grid-row: 1; \r\n font-size: 20px;\r\n font-weight: bold;\r\n padding-bottom: 10px;\r\n padding-left: 4px;\r\n }\r\n\r\n .sub-items {\r\n position: absolute;\r\n left: 200px;\r\n top: 0;\r\n width: 150px;\r\n display: none; \r\n \r\n &.background-js {\r\n background: #bfabff;\r\n .sub-item { \r\n &:hover {\r\n background-color: #333333;\r\n color: white;\r\n }\r\n }\r\n } \r\n\r\n &.background-ts {\r\n background: #333333;\r\n .sub-item { \r\n &:hover {\r\n background-color: #333333;\r\n color: white;\r\n }\r\n }\r\n } \r\n \r\n .sub-item { \r\n color: white;\r\n padding: 5px;\r\n padding-left: 10px;\r\n height: 35px;\r\n display: grid;\r\n\r\n &.checked {\r\n background: white;\r\n color: black;\r\n }\r\n }\r\n } \r\n }\r\n\r\n .buttonLine {\r\n color:white;\r\n padding: 5px;\r\n padding-left: 7px;\r\n height: 35px;\r\n font-size: 18px;\r\n display: grid;\r\n align-items: center;\r\n cursor: pointer;\r\n user-select: none;\r\n grid-template-columns: 1fr 20px;\r\n grid-template-rows: 100%;\r\n position: relative;\r\n font-size: 12px;\r\n grid-column: 1;\r\n grid-row: 1;\r\n input[type=\"file\"] {\r\n display: none;\r\n }\r\n\r\n &.active {\r\n font-weight: bold;\r\n font-size: 20px;\r\n cursor: pointer;\r\n }\r\n\r\n &:hover {\r\n background: var(--selectionGrey);\r\n .sub-items {\r\n display: block;\r\n }\r\n cursor: pointer;\r\n } \r\n\r\n .file-upload{\r\n cursor: pointer;\r\n }\r\n }\r\n }\r\n \r\n .divider {\r\n display: flex;\r\n align-items: center;\r\n border-right: 1px solid black;\r\n color: white;\r\n &:last-of-type {\r\n border-right: none;\r\n }\r\n &.padded {\r\n padding-left: 10px;\r\n padding-right: 10px;\r\n }\r\n }\r\n\r\n .floatLine, .checkBoxLine {\r\n display: flex;\r\n align-items: center;\r\n }\r\n\r\n .checkBoxLine {\r\n .icon {\r\n filter: brightness(10);\r\n }\r\n\r\n .hidden {\r\n display: none;\r\n }\r\n\r\n .checkBox {\r\n height: 40px;\r\n }\r\n }\r\n\r\n .color3Line {\r\n display: grid;\r\n\r\n .firstLine {\r\n display: flex;\r\n align-items: center;\r\n\r\n .label {\r\n padding-right: 5px;\r\n }\r\n\r\n .textInputLine {\r\n .value {\r\n padding-left: 2px;\r\n }\r\n }\r\n\r\n .copy {\r\n display: none;\r\n }\r\n\r\n .expand {\r\n display: none;\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 .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 solid white;\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 position: fixed;\r\n top: 0px;\r\n right: 0px;\r\n bottom: 0px;\r\n left: 0px;\r\n z-index: 2;\r\n }\r\n\r\n .color-picker-float {\r\n position: absolute; \r\n } \r\n }\r\n\r\n .floatLine input, .listLine select {\r\n background-color: #000000;\r\n color: white;\r\n margin: 5px;\r\n outline: none;\r\n padding: 5px;\r\n border: none;\r\n }\r\n\r\n .listLine select {\r\n width: 150px;\r\n }\r\n}\r\n"],"sourceRoot":""}]);
10218
10218
  // Exports
10219
10219
  /* harmony default export */ __webpack_exports__["default"] = (___CSS_LOADER_EXPORT___);
10220
10220
 
@@ -42332,17 +42332,6 @@ try {
42332
42332
  module.exports = g;
42333
42333
 
42334
42334
 
42335
- /***/ }),
42336
-
42337
- /***/ "../../sharedUiComponents/imgs/fillColorIcon.svg":
42338
- /*!**************************************************************************************************************!*\
42339
- !*** C:/Users/raweber/Documents/GitHub/Babylon.js/.temp/sourceES6/sharedUiComponents/imgs/fillColorIcon.svg ***!
42340
- \**************************************************************************************************************/
42341
- /*! no static exports found */
42342
- /***/ (function(module, exports) {
42343
-
42344
- module.exports = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3E%3Cpath d='M7.31,16.54v4.1a2,2,0,0,0,2,2H21.42a2,2,0,0,0,2-2V11.78a2,2,0,0,0-2-2H14.21L15.42,11h6a.8.8,0,0,1,.8.81v8.86a.8.8,0,0,1-.8.81H9.33a.81.81,0,0,1-.81-.81V17.75Z' style='fill:%23333'/%3E%3Cpath d='M10.54,8a.6.6,0,1,1,1.2,0V9a1.57,1.57,0,0,1,1,.46l2.85,2.85a1.61,1.61,0,0,1,0,2.28L12.17,18a1.61,1.61,0,0,1-2.28,0L7,15.13a1.61,1.61,0,0,1,0-2.28l3.42-3.42.08-.07Zm0,3.62v-.5L8.21,13.4h6.64a.34.34,0,0,0-.12-.26l-2.85-2.85a.34.34,0,0,0-.14-.09v1.37a.6.6,0,1,1-1.2,0Zm-2.32,3,2.52,2.52a.42.42,0,0,0,.57,0l2.53-2.52Z' style='fill:%23333'/%3E%3Cpath d='M14.57,17.32a2.76,2.76,0,0,1,.27-1.12,5.33,5.33,0,0,1,.54-.91c.2-.27.39-.49.53-.65l.24-.26h0a.6.6,0,0,1,.86,0l.24.27a6,6,0,0,1,.53.65,5.33,5.33,0,0,1,.54.91,2.76,2.76,0,0,1,.28,1.12,2,2,0,1,1-4,0ZM16.37,16a4.15,4.15,0,0,0-.43.72,1.57,1.57,0,0,0-.17.61.81.81,0,1,0,1.62,0,1.57,1.57,0,0,0-.17-.61,4.15,4.15,0,0,0-.43-.72l-.21-.28Z' style='fill:%23333'/%3E%3C/svg%3E"
42345
-
42346
42335
  /***/ }),
42347
42336
 
42348
42337
  /***/ "../public/imgs sync recursive ^\\.\\/cursor_rotate.*\\.svg$":
@@ -42440,17 +42429,6 @@ module.exports = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' w
42440
42429
 
42441
42430
  /***/ }),
42442
42431
 
42443
- /***/ "../public/imgs/canvasSizeIcon.svg":
42444
- /*!*****************************************!*\
42445
- !*** ../public/imgs/canvasSizeIcon.svg ***!
42446
- \*****************************************/
42447
- /*! no static exports found */
42448
- /***/ (function(module, exports) {
42449
-
42450
- module.exports = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Cpath d='M15,12a3,3,0,0,0-3,3v3.5a.5.5,0,0,0,1,0V15a2,2,0,0,1,2-2h3.5a.5.5,0,0,0,0-1Z' style='fill:%23333'/%3E%3Cpath d='M21.5,12a.5.5,0,0,0,0,1H25a2,2,0,0,1,2,2v3.5a.5.5,0,0,0,1,0V15a3,3,0,0,0-3-3Z' style='fill:%23333'/%3E%3Cpath d='M12.5,21a.5.5,0,0,1,.5.5V25a2,2,0,0,0,2,2h3.5a.5.5,0,0,1,0,1H15a3,3,0,0,1-3-3V21.5A.5.5,0,0,1,12.5,21Z' style='fill:%23333'/%3E%3Cpath d='M28,21.5a.5.5,0,0,0-1,0V25a2,2,0,0,1-2,2H21.5a.5.5,0,0,0,0,1H25a3,3,0,0,0,3-3Z' style='fill:%23333'/%3E%3C/svg%3E"
42451
-
42452
- /***/ }),
42453
-
42454
42432
  /***/ "../public/imgs/checkboxIcon.svg":
42455
42433
  /*!***************************************!*\
42456
42434
  !*** ../public/imgs/checkboxIcon.svg ***!
@@ -42957,17 +42935,6 @@ module.exports = "data:image/svg+xml,%3Csvg id='icons' xmlns='http://www.w3.org/
42957
42935
 
42958
42936
  /***/ }),
42959
42937
 
42960
- /***/ "../public/imgs/responsiveIcon.svg":
42961
- /*!*****************************************!*\
42962
- !*** ../public/imgs/responsiveIcon.svg ***!
42963
- \*****************************************/
42964
- /*! no static exports found */
42965
- /***/ (function(module, exports) {
42966
-
42967
- module.exports = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Cpath d='M23.86,16.14a.62.62,0,0,1,.18.43v2a.61.61,0,0,1-1.21,0V18l-1.39,1.39a.61.61,0,1,1-.86-.86L22,17.17h-.56a.6.6,0,0,1-.6-.6.61.61,0,0,1,.6-.61h2A.62.62,0,0,1,23.86,16.14Z' style='fill:%23333'/%3E%3Cpath d='M16,23.43a.64.64,0,0,0,.18.43.62.62,0,0,0,.43.18h2a.61.61,0,0,0,.6-.61.6.6,0,0,0-.6-.6H18l1.39-1.39a.61.61,0,1,0-.86-.86L17.17,22v-.56a.6.6,0,0,0-.6-.6.61.61,0,0,0-.61.6Z' style='fill:%23333'/%3E%3Cpath d='M11.93,15.76a2.22,2.22,0,0,1,2.22-2.22h11.7a2.22,2.22,0,0,1,2.22,2.22v8.48a2.22,2.22,0,0,1-2.22,2.22H14.15a2.22,2.22,0,0,1-2.22-2.22Zm2.22-1a1,1,0,0,0-1,1v8.48a1,1,0,0,0,1,1h11.7a1,1,0,0,0,1-1V15.76a1,1,0,0,0-1-1Z' style='fill:%23333'/%3E%3C/svg%3E"
42968
-
42969
- /***/ }),
42970
-
42971
42938
  /***/ "../public/imgs/scrollbarIcon.svg":
42972
42939
  /*!****************************************!*\
42973
42940
  !*** ../public/imgs/scrollbarIcon.svg ***!
@@ -43100,10 +43067,21 @@ module.exports = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' w
43100
43067
  __webpack_require__.r(__webpack_exports__);
43101
43068
  /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "CommandBarComponent", function() { return CommandBarComponent; });
43102
43069
  /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../../../node_modules/tslib/tslib.es6.js");
43103
- /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
43104
- /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
43105
- /* harmony import */ var _commandButtonComponent__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./commandButtonComponent */ "./components/commandButtonComponent.tsx");
43106
- /* harmony import */ var _commandDropdownComponent__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./commandDropdownComponent */ "./components/commandDropdownComponent.tsx");
43070
+ /* harmony import */ var _babylonjs_core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @babylonjs/core/Misc/dataStorage */ "@babylonjs/core/Misc/observable");
43071
+ /* harmony import */ var _babylonjs_core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_babylonjs_core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_1__);
43072
+ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
43073
+ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);
43074
+ /* harmony import */ var _sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../sharedUiComponents/lines/floatLineComponent */ "./sharedUiComponents/lines/floatLineComponent.tsx");
43075
+ /* harmony import */ var _sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../sharedUiComponents/lines/checkBoxLineComponent */ "./sharedUiComponents/lines/checkBoxLineComponent.tsx");
43076
+ /* harmony import */ var _sharedUiComponents_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../sharedUiComponents/lines/optionsLineComponent */ "./sharedUiComponents/lines/optionsLineComponent.tsx");
43077
+ /* harmony import */ var _commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./commandButtonComponent */ "./components/commandButtonComponent.tsx");
43078
+ /* harmony import */ var _commandDropdownComponent__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./commandDropdownComponent */ "./components/commandDropdownComponent.tsx");
43079
+ /* harmony import */ var _sharedUiComponents_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../sharedUiComponents/lines/colorLineComponent */ "./sharedUiComponents/lines/colorLineComponent.tsx");
43080
+
43081
+
43082
+
43083
+
43084
+
43107
43085
 
43108
43086
 
43109
43087
 
@@ -43116,6 +43094,35 @@ var guidesIcon = __webpack_require__(/*! ../../public/imgs/guidesIcon.svg */ "..
43116
43094
  var logoIcon = __webpack_require__(/*! ../../public/imgs/babylonLogo.svg */ "../public/imgs/babylonLogo.svg");
43117
43095
  var canvasFitIcon = __webpack_require__(/*! ../../public/imgs/canvasFitIcon.svg */ "../public/imgs/canvasFitIcon.svg");
43118
43096
  __webpack_require__(/*! ../scss/commandBar.scss */ "./scss/commandBar.scss");
43097
+ var _sizeValues = [
43098
+ { width: 1920, height: 1080 },
43099
+ { width: 1366, height: 768 },
43100
+ { width: 1280, height: 800 },
43101
+ { width: 3840, height: 2160 },
43102
+ { width: 750, height: 1334 },
43103
+ { width: 1125, height: 2436 },
43104
+ { width: 1170, height: 2532 },
43105
+ { width: 1284, height: 2778 },
43106
+ { width: 1080, height: 2220 },
43107
+ { width: 1080, height: 2340 },
43108
+ { width: 1024, height: 1024 },
43109
+ { width: 2048, height: 2048 },
43110
+ ];
43111
+ var _sizeOptions = [
43112
+ { label: "Web (1920)", value: 0 },
43113
+ { label: "Web (1366)", value: 1 },
43114
+ { label: "Web (1280)", value: 2 },
43115
+ { label: "Web (3840)", value: 3 },
43116
+ { label: "iPhone 8 (750)", value: 4 },
43117
+ { label: "iPhone X, 11 (1125)", value: 5 },
43118
+ { label: "iPhone 12 (1170)", value: 6 },
43119
+ { label: "iPhone Pro Max (1284)", value: 7 },
43120
+ { label: "Google Pixel 4 (1080)", value: 8 },
43121
+ { label: "Google Pixel 5 (1080)", value: 9 },
43122
+ { label: "Square (1024)", value: 10 },
43123
+ { label: "Square (2048)", value: 11 },
43124
+ ];
43125
+ var MAX_TEXTURE_SIZE = 16384; //2^14
43119
43126
  var CommandBarComponent = /** @class */ (function (_super) {
43120
43127
  Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(CommandBarComponent, _super);
43121
43128
  function CommandBarComponent(props) {
@@ -43123,6 +43130,7 @@ var CommandBarComponent = /** @class */ (function (_super) {
43123
43130
  _this._panning = false;
43124
43131
  _this._zooming = false;
43125
43132
  _this._selecting = true;
43133
+ _this._sizeOption = 0;
43126
43134
  props.globalState.onPanObservable.add(function () {
43127
43135
  _this._panning = !_this._panning;
43128
43136
  _this._zooming = false;
@@ -43144,105 +43152,149 @@ var CommandBarComponent = /** @class */ (function (_super) {
43144
43152
  props.globalState.onOutlineChangedObservable.add(function () {
43145
43153
  _this.forceUpdate();
43146
43154
  });
43155
+ props.globalState.onResizeObservable.add(function (newSize) {
43156
+ _this.forceUpdate();
43157
+ });
43147
43158
  return _this;
43148
43159
  }
43149
43160
  CommandBarComponent.prototype.render = function () {
43150
43161
  var _this = this;
43151
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-commands" },
43152
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "commands-left" },
43153
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("img", { src: logoIcon, color: "white", className: "active" }),
43154
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_commandDropdownComponent__WEBPACK_IMPORTED_MODULE_3__["CommandDropdownComponent"], { globalState: this.props.globalState, toRight: true, icon: hamburgerIcon, tooltip: "Options", items: [
43155
- {
43156
- label: "Save",
43157
- onClick: function () {
43158
- _this.props.globalState.onSaveObservable.notifyObservers();
43162
+ var size = this.props.globalState.workbench ? Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__assign"])({}, this.props.globalState.workbench.guiSize) : { width: 0, height: 0 };
43163
+ this._sizeOption = _sizeValues.findIndex(function (value) { return value.width == size.width && value.height == size.height; });
43164
+ if (this._sizeOption < 0) {
43165
+ this.props.globalState.onResponsiveChangeObservable.notifyObservers(false);
43166
+ _babylonjs_core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_1__["DataStorage"].WriteBoolean("Responsive", false);
43167
+ }
43168
+ return (react__WEBPACK_IMPORTED_MODULE_2__["createElement"]("div", { className: "ge-commands" },
43169
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"]("div", { className: "commands-left" },
43170
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"]("div", { className: "divider" },
43171
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"]("img", { src: logoIcon, color: "white", className: "active" }),
43172
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"](_commandDropdownComponent__WEBPACK_IMPORTED_MODULE_7__["CommandDropdownComponent"], { globalState: this.props.globalState, toRight: true, icon: hamburgerIcon, tooltip: "Options", items: [
43173
+ {
43174
+ label: "Save",
43175
+ onClick: function () {
43176
+ _this.props.globalState.onSaveObservable.notifyObservers();
43177
+ },
43159
43178
  },
43160
- },
43161
- {
43162
- label: "Load",
43163
- fileButton: true,
43164
- },
43165
- {
43166
- label: "Save to snippet",
43167
- onClick: function () {
43168
- _this.props.globalState.onSnippetSaveObservable.notifyObservers();
43179
+ {
43180
+ label: "Load",
43181
+ fileButton: true,
43169
43182
  },
43170
- },
43171
- {
43172
- label: "Load from snippet",
43173
- onClick: function () {
43174
- _this.props.globalState.onSnippetLoadObservable.notifyObservers();
43183
+ {
43184
+ label: "Save to snippet",
43185
+ onClick: function () {
43186
+ _this.props.globalState.onSnippetSaveObservable.notifyObservers();
43187
+ },
43175
43188
  },
43176
- },
43177
- {
43178
- label: "Copy Selected",
43179
- onClick: function () {
43180
- _this.props.globalState.onCopyObservable.notifyObservers(function (content) { return _this.props.globalState.hostWindow.navigator.clipboard.writeText(content); });
43189
+ {
43190
+ label: "Load from snippet",
43191
+ onClick: function () {
43192
+ _this.props.globalState.onSnippetLoadObservable.notifyObservers();
43193
+ },
43181
43194
  },
43182
- },
43183
- {
43184
- label: "Paste",
43185
- onClick: function () { return Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__awaiter"])(_this, void 0, void 0, function () {
43186
- var _a, _b;
43187
- return Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__generator"])(this, function (_c) {
43188
- switch (_c.label) {
43189
- case 0:
43190
- _b = (_a = this.props.globalState.onPasteObservable).notifyObservers;
43191
- return [4 /*yield*/, this.props.globalState.hostWindow.navigator.clipboard.readText()];
43192
- case 1:
43193
- _b.apply(_a, [_c.sent()]);
43194
- return [2 /*return*/];
43195
- }
43196
- });
43197
- }); }
43198
- },
43199
- {
43200
- label: "Delete Selected",
43201
- onClick: function () {
43202
- _this.props.globalState.selectedControls.forEach(function (guiNode) {
43203
- var _a;
43204
- if (guiNode !== _this.props.globalState.guiTexture.getChildren()[0]) {
43205
- _this.props.globalState.guiTexture.removeControl(guiNode);
43206
- (_a = _this.props.globalState.liveGuiTexture) === null || _a === void 0 ? void 0 : _a.removeControl(guiNode);
43207
- guiNode.dispose();
43208
- }
43209
- });
43210
- _this.props.globalState.setSelection([]);
43195
+ {
43196
+ label: "Copy Selected",
43197
+ onClick: function () {
43198
+ _this.props.globalState.onCopyObservable.notifyObservers(function (content) { return _this.props.globalState.hostWindow.navigator.clipboard.writeText(content); });
43199
+ },
43211
43200
  },
43212
- },
43213
- {
43214
- label: "Help",
43215
- onClick: function () {
43216
- window.open("https://doc.babylonjs.com/toolsAndResources/tools/guiEditor", "_blank");
43201
+ {
43202
+ label: "Paste",
43203
+ onClick: function () { return Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__awaiter"])(_this, void 0, void 0, function () {
43204
+ var _a, _b;
43205
+ return Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__generator"])(this, function (_c) {
43206
+ switch (_c.label) {
43207
+ case 0:
43208
+ _b = (_a = this.props.globalState.onPasteObservable).notifyObservers;
43209
+ return [4 /*yield*/, this.props.globalState.hostWindow.navigator.clipboard.readText()];
43210
+ case 1:
43211
+ _b.apply(_a, [_c.sent()]);
43212
+ return [2 /*return*/];
43213
+ }
43214
+ });
43215
+ }); }
43217
43216
  },
43218
- },
43219
- {
43220
- label: "Give feedback",
43221
- onClick: function () {
43222
- window.open("https://forum.babylonjs.com/t/introducing-the-gui-editor-alpha/24578", "_blank");
43217
+ {
43218
+ label: "Delete Selected",
43219
+ onClick: function () {
43220
+ _this.props.globalState.selectedControls.forEach(function (guiNode) {
43221
+ var _a;
43222
+ if (guiNode !== _this.props.globalState.guiTexture.getChildren()[0]) {
43223
+ _this.props.globalState.guiTexture.removeControl(guiNode);
43224
+ (_a = _this.props.globalState.liveGuiTexture) === null || _a === void 0 ? void 0 : _a.removeControl(guiNode);
43225
+ guiNode.dispose();
43226
+ }
43227
+ });
43228
+ _this.props.globalState.setSelection([]);
43229
+ },
43223
43230
  },
43224
- },
43225
- ] }),
43226
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_2__["CommandButtonComponent"], { tooltip: "Select", icon: pointerIcon, shortcut: "S", isActive: this._selecting, onClick: function () {
43227
- if (!_this._selecting)
43228
- _this.props.globalState.onSelectionButtonObservable.notifyObservers();
43229
- } }),
43230
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_2__["CommandButtonComponent"], { tooltip: "Pan", icon: handIcon, shortcut: "P", isActive: this._panning, onClick: function () {
43231
- if (!_this._panning)
43232
- _this.props.globalState.onPanObservable.notifyObservers();
43233
- } }),
43234
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_2__["CommandButtonComponent"], { tooltip: "Zoom", shortcut: "Z", icon: zoomIcon, isActive: this._zooming, onClick: function () {
43235
- if (!_this._zooming)
43236
- _this.props.globalState.onZoomObservable.notifyObservers();
43237
- } }),
43238
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_2__["CommandButtonComponent"], { tooltip: "Fit to Window", shortcut: "F", icon: canvasFitIcon, isActive: false, onClick: function () {
43239
- _this.props.globalState.onFitToWindowObservable.notifyObservers();
43240
- } }),
43241
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_2__["CommandButtonComponent"], { tooltip: "Toggle Guides", shortcut: "G", icon: guidesIcon, isActive: this.props.globalState.outlines, onClick: function () { return _this.props.globalState.outlines = !_this.props.globalState.outlines; } })),
43242
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "commands-right" })));
43231
+ {
43232
+ label: "Help",
43233
+ onClick: function () {
43234
+ window.open("https://doc.babylonjs.com/toolsAndResources/tools/guiEditor", "_blank");
43235
+ },
43236
+ },
43237
+ {
43238
+ label: "Give feedback",
43239
+ onClick: function () {
43240
+ window.open("https://forum.babylonjs.com/t/introducing-the-gui-editor-alpha/24578", "_blank");
43241
+ },
43242
+ },
43243
+ ] }),
43244
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__["CommandButtonComponent"], { tooltip: "Select", icon: pointerIcon, shortcut: "S", isActive: this._selecting, onClick: function () {
43245
+ if (!_this._selecting)
43246
+ _this.props.globalState.onSelectionButtonObservable.notifyObservers();
43247
+ } }),
43248
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__["CommandButtonComponent"], { tooltip: "Pan", icon: handIcon, shortcut: "P", isActive: this._panning, onClick: function () {
43249
+ if (!_this._panning)
43250
+ _this.props.globalState.onPanObservable.notifyObservers();
43251
+ } }),
43252
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__["CommandButtonComponent"], { tooltip: "Zoom", shortcut: "Z", icon: zoomIcon, isActive: this._zooming, onClick: function () {
43253
+ if (!_this._zooming)
43254
+ _this.props.globalState.onZoomObservable.notifyObservers();
43255
+ } })),
43256
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"]("div", { className: "divider" },
43257
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__["CommandButtonComponent"], { tooltip: "Fit to Window", shortcut: "F", icon: canvasFitIcon, isActive: false, onClick: function () {
43258
+ _this.props.globalState.onFitToWindowObservable.notifyObservers();
43259
+ } }),
43260
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__["CommandButtonComponent"], { tooltip: "Toggle Guides", shortcut: "G", icon: guidesIcon, isActive: this.props.globalState.outlines, onClick: function () { return _this.props.globalState.outlines = !_this.props.globalState.outlines; } })),
43261
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"]("div", { className: "divider padded" },
43262
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"](_sharedUiComponents_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_8__["ColorLineComponent"], { label: "Artboard:", target: this.props.globalState, propertyName: "backgroundColor", disableAlpha: true })),
43263
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"]("div", { className: "divider padded" },
43264
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"](_sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_4__["CheckBoxLineComponent"], { label: "Responsive:", iconLabel: "Responsive GUIs will resize the UI layout and reflow controls to accommodate different device screen sizes", isSelected: function () { return _babylonjs_core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_1__["DataStorage"].ReadBoolean("Responsive", true); }, onSelect: function (value) {
43265
+ _this.props.globalState.onResponsiveChangeObservable.notifyObservers(value);
43266
+ _babylonjs_core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_1__["DataStorage"].WriteBoolean("Responsive", value);
43267
+ _this._sizeOption = _sizeOptions.length;
43268
+ if (value) {
43269
+ _this._sizeOption = 0;
43270
+ _this.props.globalState.workbench.guiSize = _sizeValues[_this._sizeOption];
43271
+ }
43272
+ _this.forceUpdate();
43273
+ } }),
43274
+ _babylonjs_core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_1__["DataStorage"].ReadBoolean("Responsive", true) &&
43275
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"](_sharedUiComponents_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_5__["OptionsLineComponent"], { label: "", iconLabel: "Size", options: _sizeOptions, target: this, propertyName: "_sizeOption", noDirectUpdate: true, onSelect: function (value) {
43276
+ _this._sizeOption = value;
43277
+ if (_this._sizeOption !== _sizeOptions.length) {
43278
+ var newSize = _sizeValues[_this._sizeOption];
43279
+ _this.props.globalState.workbench.guiSize = newSize;
43280
+ }
43281
+ _this.forceUpdate();
43282
+ } }),
43283
+ !_babylonjs_core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_1__["DataStorage"].ReadBoolean("Responsive", true) && (react__WEBPACK_IMPORTED_MODULE_2__["createElement"](react__WEBPACK_IMPORTED_MODULE_2__["Fragment"], null,
43284
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__["FloatLineComponent"], { label: "W", target: size, propertyName: "width", isInteger: true, min: 1, max: MAX_TEXTURE_SIZE, onChange: function (newvalue) {
43285
+ if (!isNaN(newvalue)) {
43286
+ _this.props.globalState.workbench.guiSize = { width: newvalue, height: size.height };
43287
+ }
43288
+ } }),
43289
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__["FloatLineComponent"], { label: "H", target: size, propertyName: "height", isInteger: true, min: 1, max: MAX_TEXTURE_SIZE, onChange: function (newvalue) {
43290
+ if (!isNaN(newvalue)) {
43291
+ _this.props.globalState.workbench.guiSize = { width: size.width, height: newvalue };
43292
+ }
43293
+ } }))))),
43294
+ react__WEBPACK_IMPORTED_MODULE_2__["createElement"]("div", { className: "commands-right" })));
43243
43295
  };
43244
43296
  return CommandBarComponent;
43245
- }(react__WEBPACK_IMPORTED_MODULE_1__["Component"]));
43297
+ }(react__WEBPACK_IMPORTED_MODULE_2__["Component"]));
43246
43298
 
43247
43299
 
43248
43300
 
@@ -43549,10 +43601,10 @@ __webpack_require__.r(__webpack_exports__);
43549
43601
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
43550
43602
  /* harmony import */ var _gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../gui/commonControlPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/commonControlPropertyGridComponent.tsx");
43551
43603
  /* harmony import */ var _sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/floatLineComponent */ "./sharedUiComponents/lines/floatLineComponent.tsx");
43552
- /* harmony import */ var _sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/checkBoxLineComponent */ "./sharedUiComponents/lines/checkBoxLineComponent.tsx");
43553
- /* harmony import */ var _sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/textLineComponent */ "./sharedUiComponents/lines/textLineComponent.tsx");
43554
- /* harmony import */ var _commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../commandButtonComponent */ "./components/commandButtonComponent.tsx");
43555
- /* harmony import */ var _sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/targetsProxy */ "./sharedUiComponents/lines/targetsProxy.tsx");
43604
+ /* harmony import */ var _sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/textLineComponent */ "./sharedUiComponents/lines/textLineComponent.tsx");
43605
+ /* harmony import */ var _commandButtonComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../commandButtonComponent */ "./components/commandButtonComponent.tsx");
43606
+ /* harmony import */ var _sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/targetsProxy */ "./sharedUiComponents/lines/targetsProxy.tsx");
43607
+ /* harmony import */ var _containerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./containerPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/containerPropertyGridComponent.tsx");
43556
43608
 
43557
43609
 
43558
43610
 
@@ -43562,7 +43614,6 @@ __webpack_require__.r(__webpack_exports__);
43562
43614
 
43563
43615
 
43564
43616
  var conerRadiusIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/conerRadiusIcon.svg */ "./sharedUiComponents/imgs/conerRadiusIcon.svg");
43565
- var clipContentsIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/clipContentsIcon.svg */ "./sharedUiComponents/imgs/clipContentsIcon.svg");
43566
43617
  var strokeWeightIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/strokeWeightIcon.svg */ "./sharedUiComponents/imgs/strokeWeightIcon.svg");
43567
43618
  var addImageButtonIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/addImageButtonIcon.svg */ "./sharedUiComponents/imgs/addImageButtonIcon.svg");
43568
43619
  var addTextButtonIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/addTextButtonIcon.svg */ "./sharedUiComponents/imgs/addTextButtonIcon.svg");
@@ -43572,24 +43623,23 @@ var ButtonPropertyGridComponent = /** @class */ (function (_super) {
43572
43623
  return _super.call(this, props) || this;
43573
43624
  }
43574
43625
  ButtonPropertyGridComponent.prototype.render = function () {
43575
- var _this = this;
43576
- var rectangles = this.props.rectangles;
43626
+ var _a = this.props, rectangles = _a.rectangles, lockObject = _a.lockObject, onPropertyChangedObservable = _a.onPropertyChangedObservable, onAddComponent = _a.onAddComponent;
43577
43627
  return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "pane" },
43578
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__["CommonControlPropertyGridComponent"], { lockObject: this.props.lockObject, controls: rectangles, onPropertyChangedObservable: this.props.onPropertyChangedObservable }),
43628
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__["CommonControlPropertyGridComponent"], { lockObject: lockObject, controls: rectangles, onPropertyChangedObservable: onPropertyChangedObservable }),
43579
43629
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("hr", null),
43580
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_5__["TextLineComponent"], { label: "RECTANGLE", value: " ", color: "grey" }),
43581
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_4__["CheckBoxLineComponent"], { label: "CLIP CONTENT", iconLabel: "Clip Content", icon: clipContentsIcon, target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_7__["makeTargetsProxy"])(rectangles, this.props.onPropertyChangedObservable), propertyName: "clipChildren", onPropertyChangedObservable: this.props.onPropertyChangedObservable }),
43630
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__["TextLineComponent"], { label: "RECTANGLE", value: " ", color: "grey" }),
43582
43631
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
43583
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__["FloatLineComponent"], { iconLabel: "Stroke Weight", icon: strokeWeightIcon, lockObject: this.props.lockObject, label: "", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_7__["makeTargetsProxy"])(rectangles, this.props.onPropertyChangedObservable), propertyName: "thickness", onPropertyChangedObservable: this.props.onPropertyChangedObservable }),
43584
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__["FloatLineComponent"], { iconLabel: "Corner Radius", icon: conerRadiusIcon, lockObject: this.props.lockObject, label: "", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_7__["makeTargetsProxy"])(rectangles, this.props.onPropertyChangedObservable), propertyName: "cornerRadius", onPropertyChangedObservable: this.props.onPropertyChangedObservable })),
43632
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__["FloatLineComponent"], { iconLabel: "Stroke Weight", icon: strokeWeightIcon, lockObject: lockObject, label: "", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__["makeTargetsProxy"])(rectangles, onPropertyChangedObservable), propertyName: "thickness", onPropertyChangedObservable: onPropertyChangedObservable }),
43633
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__["FloatLineComponent"], { iconLabel: "Corner Radius", icon: conerRadiusIcon, lockObject: lockObject, label: "", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__["makeTargetsProxy"])(rectangles, onPropertyChangedObservable), propertyName: "cornerRadius", onPropertyChangedObservable: onPropertyChangedObservable })),
43634
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_containerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_7__["ContainerPropertyGridComponent"], { containers: rectangles, onPropertyChangedObservable: onPropertyChangedObservable }),
43585
43635
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("hr", null),
43586
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_5__["TextLineComponent"], { label: "BUTTON", value: " ", color: "grey" }),
43636
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__["TextLineComponent"], { label: "BUTTON", value: " ", color: "grey" }),
43587
43637
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
43588
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__["CommandButtonComponent"], { tooltip: "Add TextBlock", icon: addTextButtonIcon, shortcut: "", isActive: false, onClick: function () {
43589
- _this.props.onAddComponent("Text");
43638
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_5__["CommandButtonComponent"], { tooltip: "Add TextBlock", icon: addTextButtonIcon, shortcut: "", isActive: false, onClick: function () {
43639
+ onAddComponent("Text");
43590
43640
  } }),
43591
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_6__["CommandButtonComponent"], { tooltip: "Add Image", icon: addImageButtonIcon, shortcut: "", isActive: false, onClick: function () {
43592
- _this.props.onAddComponent("ButtonImage");
43641
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_5__["CommandButtonComponent"], { tooltip: "Add Image", icon: addImageButtonIcon, shortcut: "", isActive: false, onClick: function () {
43642
+ onAddComponent("ButtonImage");
43593
43643
  } }))));
43594
43644
  };
43595
43645
  return ButtonPropertyGridComponent;
@@ -43716,6 +43766,10 @@ __webpack_require__.r(__webpack_exports__);
43716
43766
  /* harmony import */ var _diagram_coordinateHelper__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../../../diagram/coordinateHelper */ "./diagram/coordinateHelper.tsx");
43717
43767
  /* harmony import */ var _babylonjs_core_Maths_math__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! @babylonjs/core/Maths/math */ "@babylonjs/core/Misc/observable");
43718
43768
  /* harmony import */ var _babylonjs_core_Maths_math__WEBPACK_IMPORTED_MODULE_12___default = /*#__PURE__*/__webpack_require__.n(_babylonjs_core_Maths_math__WEBPACK_IMPORTED_MODULE_12__);
43769
+ /* harmony import */ var _sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/iconComponent */ "./sharedUiComponents/lines/iconComponent.tsx");
43770
+ /* harmony import */ var _sharedUiComponents_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/optionsLineComponent */ "./sharedUiComponents/lines/optionsLineComponent.tsx");
43771
+
43772
+
43719
43773
 
43720
43774
 
43721
43775
 
@@ -43738,7 +43792,9 @@ var fontFamilyIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs
43738
43792
  var alphaIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/alphaIcon.svg */ "./sharedUiComponents/imgs/alphaIcon.svg");
43739
43793
  var fontSizeIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/fontSizeIcon.svg */ "./sharedUiComponents/imgs/fontSizeIcon.svg");
43740
43794
  var fontStyleIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/fontStyleIcon.svg */ "./sharedUiComponents/imgs/fontStyleIcon.svg");
43795
+ var fontWeightIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/fontWeightIcon.svg */ "./sharedUiComponents/imgs/fontWeightIcon.svg");
43741
43796
  var rotationIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/rotationIcon.svg */ "./sharedUiComponents/imgs/rotationIcon.svg");
43797
+ var pivotIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/pivotIcon.svg */ "./sharedUiComponents/imgs/pivotIcon.svg");
43742
43798
  var scaleIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/scaleIcon.svg */ "./sharedUiComponents/imgs/scaleIcon.svg");
43743
43799
  var shadowBlurIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/shadowBlurIcon.svg */ "./sharedUiComponents/imgs/shadowBlurIcon.svg");
43744
43800
  var horizontalMarginIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/horizontalMarginIcon.svg */ "./sharedUiComponents/imgs/horizontalMarginIcon.svg");
@@ -43938,6 +43994,11 @@ var CommonControlPropertyGridComponent = /** @class */ (function (_super) {
43938
43994
  _this.forceUpdate();
43939
43995
  }
43940
43996
  };
43997
+ var fontStyleOptions = [
43998
+ { label: "regular", value: 0 },
43999
+ { label: "italic", value: 1 },
44000
+ { label: "oblique", value: 2 }
44001
+ ];
43941
44002
  return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", null,
43942
44003
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider alignment-bar" },
43943
44004
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_commandButtonComponent__WEBPACK_IMPORTED_MODULE_7__["CommandButtonComponent"], { tooltip: "Left", icon: hAlignLeftIcon, shortcut: "", isActive: horizontalAlignment === _babylonjs_gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__["Control"].HORIZONTAL_ALIGNMENT_LEFT, onClick: function () {
@@ -43959,10 +44020,12 @@ var CommonControlPropertyGridComponent = /** @class */ (function (_super) {
43959
44020
  _this._updateAlignment("verticalAlignment", _babylonjs_gui_2D_controls_control__WEBPACK_IMPORTED_MODULE_3__["Control"].VERTICAL_ALIGNMENT_BOTTOM);
43960
44021
  } })),
43961
44022
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
43962
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { numbersOnly: true, iconLabel: "Position", icon: positionIcon, lockObject: this.props.lockObject, label: "X", delayInput: true, value: getValue("_left"), onChange: function (newValue) { return _this._checkAndUpdateValues("left", newValue); }, unit: getUnitString("_left"), onUnitClicked: function (unit) { return convertUnits(unit, "left"); }, arrows: true, arrowsIncrement: function (amount) { return increment("left", amount); } }),
44023
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: positionIcon, label: "Position" }),
44024
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { numbersOnly: true, lockObject: this.props.lockObject, label: "X", delayInput: true, value: getValue("_left"), onChange: function (newValue) { return _this._checkAndUpdateValues("left", newValue); }, unit: getUnitString("_left"), onUnitClicked: function (unit) { return convertUnits(unit, "left"); }, arrows: true, arrowsIncrement: function (amount) { return increment("left", amount); } }),
43963
44025
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { numbersOnly: true, lockObject: this.props.lockObject, label: "Y", delayInput: true, value: getValue("_top"), onChange: function (newValue) { return _this._checkAndUpdateValues("top", newValue); }, onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: getUnitString("_top"), onUnitClicked: function (unit) { return convertUnits(unit, "top"); }, arrows: true, arrowsIncrement: function (amount) { return increment("top", amount); } })),
43964
44026
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
43965
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { numbersOnly: true, iconLabel: "Scale", icon: sizeIcon, lockObject: this.props.lockObject, label: "W", delayInput: true, value: getValue("_width"), onPropertyChangedObservable: this.props.onPropertyChangedObservable, onChange: function (newValue) {
44027
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: sizeIcon, label: "Size" }),
44028
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { numbersOnly: true, lockObject: this.props.lockObject, label: "W", delayInput: true, value: getValue("_width"), onPropertyChangedObservable: this.props.onPropertyChangedObservable, onChange: function (newValue) {
43966
44029
  for (var _i = 0, controls_6 = controls; _i < controls_6.length; _i++) {
43967
44030
  var control = controls_6[_i];
43968
44031
  if (control.typeName === "Image") {
@@ -43997,7 +44060,8 @@ var CommonControlPropertyGridComponent = /** @class */ (function (_super) {
43997
44060
  _this._checkAndUpdateValues("height", newValue);
43998
44061
  }, unit: getUnitString("_height"), onUnitClicked: function (unit) { return convertUnits(unit, "height"); }, arrows: true, arrowsIncrement: function (amount) { return increment("height", amount); } })),
43999
44062
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44000
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { numbersOnly: true, iconLabel: "Padding", icon: verticalMarginIcon, lockObject: this.props.lockObject, label: "T", delayInput: true, value: getValue("_paddingTop"), onChange: function (newValue) {
44063
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: verticalMarginIcon, label: "Vertical Padding" }),
44064
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { numbersOnly: true, lockObject: this.props.lockObject, label: "T", delayInput: true, value: getValue("_paddingTop"), onChange: function (newValue) {
44001
44065
  _this._checkAndUpdateValues("paddingTop", newValue);
44002
44066
  _this._markChildrenAsDirty();
44003
44067
  }, onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: getUnitString("_paddingTop"), onUnitClicked: function (unit) { return convertUnits(unit, "paddingTop"); }, arrows: true, arrowsIncrement: function (amount) { return increment("paddingTop", amount, 0); } }),
@@ -44006,7 +44070,8 @@ var CommonControlPropertyGridComponent = /** @class */ (function (_super) {
44006
44070
  _this._markChildrenAsDirty();
44007
44071
  }, onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: getUnitString("_paddingBottom"), onUnitClicked: function (unit) { return convertUnits(unit, "paddingBottom"); }, arrows: true, arrowsIncrement: function (amount) { return increment("paddingBottom", amount, 0); } })),
44008
44072
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44009
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { numbersOnly: true, iconLabel: "Horizontal Margins", icon: horizontalMarginIcon, lockObject: this.props.lockObject, label: "L", delayInput: true, value: getValue("_paddingLeft"), onChange: function (newValue) {
44073
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: horizontalMarginIcon, label: "Horizontal Padding" }),
44074
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { numbersOnly: true, lockObject: this.props.lockObject, label: "L", delayInput: true, value: getValue("_paddingLeft"), onChange: function (newValue) {
44010
44075
  _this._checkAndUpdateValues("paddingLeft", newValue);
44011
44076
  _this._markChildrenAsDirty();
44012
44077
  }, onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: getUnitString("_paddingLeft"), onUnitClicked: function (unit) { return convertUnits(unit, "paddingLeft"); }, arrows: true, arrowsIncrement: function (amount) { return increment("paddingLeft", amount); } }),
@@ -44014,44 +44079,115 @@ var CommonControlPropertyGridComponent = /** @class */ (function (_super) {
44014
44079
  _this._checkAndUpdateValues("paddingRight", newValue);
44015
44080
  _this._markChildrenAsDirty();
44016
44081
  }, onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: getUnitString("_paddingRight"), onUnitClicked: function (unit) { return convertUnits(unit, "paddingRight"); }, arrows: true, arrowsIncrement: function (amount) { return increment("paddingRight", amount); } })),
44017
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_8__["CheckBoxLineComponent"], { iconLabel: "Padding does not affect the parameters of this control, only the descendants of this control.", icon: descendantsOnlyPaddingIcon, label: "PAD ONLY DESCENDENTS", target: proxy, propertyName: "descendentsOnlyPadding", onPropertyChangedObservable: this.props.onPropertyChangedObservable }),
44082
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44083
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: descendantsOnlyPaddingIcon, label: "Makes padding affect only the descendants of this control" }),
44084
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_8__["CheckBoxLineComponent"], { label: "ONLY PAD DESCENDANTS", target: proxy, propertyName: "descendentsOnlyPadding" })),
44018
44085
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("hr", { className: "ge" }),
44019
44086
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_2__["TextLineComponent"], { tooltip: "", label: "TRANSFORMATION", value: " ", color: "grey" }),
44020
44087
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44021
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { iconLabel: "Transform Center", icon: positionIcon, lockObject: this.props.lockObject, label: "X", target: proxy, propertyName: "transformCenterX", onPropertyChangedObservable: this.props.onPropertyChangedObservable, arrows: true, step: 0.0005, numbersOnly: true }),
44088
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: scaleIcon, label: "Scale" }),
44089
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { lockObject: this.props.lockObject, label: "X", target: proxy, propertyName: "scaleX", onPropertyChangedObservable: this.props.onPropertyChangedObservable, arrows: true, step: 0.0005, numbersOnly: true }),
44090
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { lockObject: this.props.lockObject, label: "Y", target: proxy, propertyName: "scaleY", onPropertyChangedObservable: this.props.onPropertyChangedObservable, arrows: true, step: 0.0005, numbersOnly: true })),
44091
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44092
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: pivotIcon, label: "Transform Center" }),
44093
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { lockObject: this.props.lockObject, label: "X", target: proxy, propertyName: "transformCenterX", onPropertyChangedObservable: this.props.onPropertyChangedObservable, arrows: true, step: 0.0005, numbersOnly: true }),
44022
44094
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { lockObject: this.props.lockObject, label: "Y", target: proxy, propertyName: "transformCenterY", onPropertyChangedObservable: this.props.onPropertyChangedObservable, arrows: true, step: 0.0005, numbersOnly: true })),
44023
44095
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44024
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { iconLabel: "Scale", icon: scaleIcon, lockObject: this.props.lockObject, label: "X", target: proxy, propertyName: "scaleX", onPropertyChangedObservable: this.props.onPropertyChangedObservable, arrows: true, step: 0.0005, numbersOnly: true }),
44025
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { lockObject: this.props.lockObject, label: "Y", target: proxy, propertyName: "scaleY", onPropertyChangedObservable: this.props.onPropertyChangedObservable, arrows: true, step: 0.0005, numbersOnly: true })),
44026
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_4__["SliderLineComponent"], { iconLabel: "Rotation", lockObject: this.props.lockObject, icon: rotationIcon, label: "R", target: proxy, decimalCount: 2, propertyName: "rotation", minimum: 0, maximum: 2 * Math.PI, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }),
44096
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: rotationIcon, label: "Rotation" }),
44097
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_4__["SliderLineComponent"], { iconLabel: "Rotation", lockObject: this.props.lockObject, label: "R", target: proxy, decimalCount: 2, propertyName: "rotation", minimum: 0, maximum: 2 * Math.PI, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })),
44027
44098
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("hr", { className: "ge" }),
44028
44099
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_2__["TextLineComponent"], { tooltip: "", label: "APPEARANCE", value: " ", color: "grey" }),
44029
- controls.every(function (control) { return control.color !== undefined && control.typeName !== "Image" && control.typeName !== "ImageBasedSlider" && control.typeName !== "ColorPicker"; }) && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_9__["ColorLineComponent"], { iconLabel: "Color", icon: colorIcon, lockObject: this.props.lockObject, label: "Outline Color", target: proxy, propertyName: "color", onPropertyChangedObservable: this.props.onPropertyChangedObservable })),
44030
- controls.every(function (control) { return control.background !== undefined; }) && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_9__["ColorLineComponent"], { iconLabel: "Background", icon: fillColorIcon, lockObject: this.props.lockObject, label: "Background Color", target: proxy, propertyName: "background", onPropertyChangedObservable: this.props.onPropertyChangedObservable })),
44031
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_4__["SliderLineComponent"], { lockObject: this.props.lockObject, iconLabel: "Alpha", icon: alphaIcon, label: " ", target: proxy, propertyName: "alpha", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }),
44032
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_9__["ColorLineComponent"], { iconLabel: "Shadow Color", icon: shadowColorIcon, lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "shadowColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, disableAlpha: true }),
44100
+ controls.every(function (control) { return control.color !== undefined && control.typeName !== "Image" && control.typeName !== "ImageBasedSlider" && control.typeName !== "ColorPicker"; }) && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44101
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: colorIcon, label: "Outline Color" }),
44102
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_9__["ColorLineComponent"], { lockObject: this.props.lockObject, label: "Outline Color", target: proxy, propertyName: "color" }))),
44103
+ controls.every(function (control) { return control.background !== undefined; }) &&
44104
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44105
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: fillColorIcon, label: "Background Color" }),
44106
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_9__["ColorLineComponent"], { lockObject: this.props.lockObject, label: "Background Color", target: proxy, propertyName: "background" })),
44107
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44108
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: alphaIcon, label: "Alpha" }),
44109
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_4__["SliderLineComponent"], { lockObject: this.props.lockObject, label: "A", target: proxy, propertyName: "alpha", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })),
44110
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44111
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: shadowColorIcon, label: "Shadow Color" }),
44112
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_9__["ColorLineComponent"], { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "shadowColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, disableAlpha: true })),
44033
44113
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44034
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_5__["FloatLineComponent"], { iconLabel: "Shadow Offset X", icon: shadowOffsetXIcon, lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "shadowOffsetX", onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: "PX", unitLocked: true }),
44035
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_5__["FloatLineComponent"], { iconLabel: "Shadow Offset Y", icon: shadowOffsetYIcon, lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "shadowOffsetY", onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: "PX", unitLocked: true })),
44114
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: shadowOffsetXIcon, label: "Shadow Offset X" }),
44115
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_5__["FloatLineComponent"], { lockObject: this.props.lockObject, label: "X", target: proxy, propertyName: "shadowOffsetX", onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: "PX", unitLocked: true }),
44116
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: shadowOffsetYIcon, label: "Shadow Offset Y" }),
44117
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_5__["FloatLineComponent"], { lockObject: this.props.lockObject, label: "Y", target: proxy, propertyName: "shadowOffsetY", onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: "PX", unitLocked: true })),
44036
44118
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44037
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_5__["FloatLineComponent"], { iconLabel: "Shadow Blur", icon: shadowBlurIcon, lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "shadowBlur", onPropertyChangedObservable: this.props.onPropertyChangedObservable })),
44119
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: shadowBlurIcon, label: "Shadow Blur" }),
44120
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_5__["FloatLineComponent"], { lockObject: this.props.lockObject, label: " ", target: proxy, propertyName: "shadowBlur", onPropertyChangedObservable: this.props.onPropertyChangedObservable })),
44038
44121
  showTextProperties && react__WEBPACK_IMPORTED_MODULE_1__["createElement"](react__WEBPACK_IMPORTED_MODULE_1__["Fragment"], null,
44039
44122
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("hr", { className: "ge" }),
44040
44123
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_2__["TextLineComponent"], { tooltip: "", label: "FONT STYLE", value: " ", color: "grey" }),
44041
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider-single" },
44042
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { iconLabel: "Font Family", icon: fontFamilyIcon, lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "fontFamily", onPropertyChangedObservable: this.props.onPropertyChangedObservable })),
44043
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider-single" },
44044
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { iconLabel: "Font Size", icon: fontSizeIcon, lockObject: this.props.lockObject, label: "", target: proxy, numbersOnly: true, propertyName: "fontSize", onChange: function (newValue) { return _this._checkAndUpdateValues("fontSize", newValue); }, onPropertyChangedObservable: this.props.onPropertyChangedObservable })),
44045
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider-single" },
44046
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { iconLabel: "Font Weight", icon: shadowBlurIcon, lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "fontWeight", onPropertyChangedObservable: this.props.onPropertyChangedObservable })),
44047
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider-single" },
44048
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { iconLabel: "Font Style", icon: fontStyleIcon, lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "fontStyle", onPropertyChangedObservable: this.props.onPropertyChangedObservable })))));
44124
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44125
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: fontFamilyIcon, label: "Font Family" }),
44126
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "fontFamily", onPropertyChangedObservable: this.props.onPropertyChangedObservable })),
44127
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44128
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: fontWeightIcon, label: "Font Weight" }),
44129
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { lockObject: this.props.lockObject, label: "", target: proxy, propertyName: "fontWeight", onPropertyChangedObservable: this.props.onPropertyChangedObservable })),
44130
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44131
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: fontStyleIcon, label: "Font Style" }),
44132
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_14__["OptionsLineComponent"], { label: "", target: proxy, propertyName: "fontStyle", options: fontStyleOptions, onSelect: function (newValue) {
44133
+ proxy.fontStyle = ["", "italic", "oblique"][newValue];
44134
+ }, extractValue: function () {
44135
+ switch (proxy.fontStyle) {
44136
+ case "italic":
44137
+ return 1;
44138
+ case "oblique":
44139
+ return 2;
44140
+ default:
44141
+ return 0;
44142
+ }
44143
+ } })),
44144
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44145
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_iconComponent__WEBPACK_IMPORTED_MODULE_13__["IconComponent"], { icon: fontSizeIcon, label: "Font Size" }),
44146
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextInputLineComponent"], { lockObject: this.props.lockObject, label: "", numbersOnly: true, value: getValue("_fontSize"), onChange: function (newValue) { return _this._checkAndUpdateValues("fontSize", newValue); }, onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: getUnitString("_fontSize"), onUnitClicked: function (unit) { return convertUnits(unit, "fontSize"); }, arrows: true, arrowsIncrement: function (amount) { return increment("fontSize", amount, 0); } })))));
44049
44147
  };
44050
44148
  return CommonControlPropertyGridComponent;
44051
44149
  }(react__WEBPACK_IMPORTED_MODULE_1__["Component"]));
44052
44150
 
44053
44151
 
44054
44152
 
44153
+ /***/ }),
44154
+
44155
+ /***/ "./components/propertyTab/propertyGrids/gui/containerPropertyGridComponent.tsx":
44156
+ /*!*************************************************************************************!*\
44157
+ !*** ./components/propertyTab/propertyGrids/gui/containerPropertyGridComponent.tsx ***!
44158
+ \*************************************************************************************/
44159
+ /*! exports provided: ContainerPropertyGridComponent */
44160
+ /***/ (function(module, __webpack_exports__, __webpack_require__) {
44161
+
44162
+ "use strict";
44163
+ __webpack_require__.r(__webpack_exports__);
44164
+ /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ContainerPropertyGridComponent", function() { return ContainerPropertyGridComponent; });
44165
+ /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../../../node_modules/tslib/tslib.es6.js");
44166
+ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
44167
+ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
44168
+ /* harmony import */ var _sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/checkBoxLineComponent */ "./sharedUiComponents/lines/checkBoxLineComponent.tsx");
44169
+ /* harmony import */ var _sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/targetsProxy */ "./sharedUiComponents/lines/targetsProxy.tsx");
44170
+
44171
+
44172
+
44173
+
44174
+ var clipContentsIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/clipContentsIcon.svg */ "./sharedUiComponents/imgs/clipContentsIcon.svg");
44175
+ var ContainerPropertyGridComponent = /** @class */ (function (_super) {
44176
+ Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(ContainerPropertyGridComponent, _super);
44177
+ function ContainerPropertyGridComponent() {
44178
+ return _super !== null && _super.apply(this, arguments) || this;
44179
+ }
44180
+ ContainerPropertyGridComponent.prototype.render = function () {
44181
+ var containers = this.props.containers;
44182
+ return react__WEBPACK_IMPORTED_MODULE_1__["createElement"](react__WEBPACK_IMPORTED_MODULE_1__["Fragment"], null,
44183
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_2__["CheckBoxLineComponent"], { label: "CLIP CONTENT", iconLabel: "Clip Content", icon: clipContentsIcon, target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_3__["makeTargetsProxy"])(containers, this.props.onPropertyChangedObservable), propertyName: "clipContent", onPropertyChangedObservable: this.props.onPropertyChangedObservable }),
44184
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_2__["CheckBoxLineComponent"], { label: "CLIP CHILDREN", iconLabel: "Clip Children", icon: clipContentsIcon, target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_3__["makeTargetsProxy"])(containers, this.props.onPropertyChangedObservable), propertyName: "clipChildren", onPropertyChangedObservable: this.props.onPropertyChangedObservable }));
44185
+ };
44186
+ return ContainerPropertyGridComponent;
44187
+ }(react__WEBPACK_IMPORTED_MODULE_1__["Component"]));
44188
+
44189
+
44190
+
44055
44191
  /***/ }),
44056
44192
 
44057
44193
  /***/ "./components/propertyTab/propertyGrids/gui/controlPropertyGridComponent.tsx":
@@ -44159,9 +44295,9 @@ __webpack_require__.r(__webpack_exports__);
44159
44295
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
44160
44296
  /* harmony import */ var _gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../gui/commonControlPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/commonControlPropertyGridComponent.tsx");
44161
44297
  /* harmony import */ var _sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/floatLineComponent */ "./sharedUiComponents/lines/floatLineComponent.tsx");
44162
- /* harmony import */ var _sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/checkBoxLineComponent */ "./sharedUiComponents/lines/checkBoxLineComponent.tsx");
44163
- /* harmony import */ var _sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/textLineComponent */ "./sharedUiComponents/lines/textLineComponent.tsx");
44164
- /* harmony import */ var _sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/targetsProxy */ "./sharedUiComponents/lines/targetsProxy.tsx");
44298
+ /* harmony import */ var _sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/textLineComponent */ "./sharedUiComponents/lines/textLineComponent.tsx");
44299
+ /* harmony import */ var _sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/targetsProxy */ "./sharedUiComponents/lines/targetsProxy.tsx");
44300
+ /* harmony import */ var _containerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./containerPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/containerPropertyGridComponent.tsx");
44165
44301
 
44166
44302
 
44167
44303
 
@@ -44169,7 +44305,6 @@ __webpack_require__.r(__webpack_exports__);
44169
44305
 
44170
44306
 
44171
44307
 
44172
- var clipContentsIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/clipContentsIcon.svg */ "./sharedUiComponents/imgs/clipContentsIcon.svg");
44173
44308
  var strokeWeightIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/strokeWeightIcon.svg */ "./sharedUiComponents/imgs/strokeWeightIcon.svg");
44174
44309
  var EllipsePropertyGridComponent = /** @class */ (function (_super) {
44175
44310
  Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(EllipsePropertyGridComponent, _super);
@@ -44177,14 +44312,14 @@ var EllipsePropertyGridComponent = /** @class */ (function (_super) {
44177
44312
  return _super.call(this, props) || this;
44178
44313
  }
44179
44314
  EllipsePropertyGridComponent.prototype.render = function () {
44180
- var ellipses = this.props.ellipses;
44315
+ var _a = this.props, ellipses = _a.ellipses, onPropertyChangedObservable = _a.onPropertyChangedObservable, lockObject = _a.lockObject;
44181
44316
  return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "pane" },
44182
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__["CommonControlPropertyGridComponent"], { lockObject: this.props.lockObject, controls: ellipses, onPropertyChangedObservable: this.props.onPropertyChangedObservable }),
44317
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__["CommonControlPropertyGridComponent"], { lockObject: lockObject, controls: ellipses, onPropertyChangedObservable: onPropertyChangedObservable }),
44183
44318
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("hr", null),
44184
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_5__["TextLineComponent"], { label: "ELLIPSE", value: " ", color: "grey" }),
44319
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__["TextLineComponent"], { label: "ELLIPSE", value: " ", color: "grey" }),
44185
44320
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
44186
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__["FloatLineComponent"], { iconLabel: "Stroke Weight", icon: strokeWeightIcon, lockObject: this.props.lockObject, label: "", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__["makeTargetsProxy"])(ellipses, this.props.onPropertyChangedObservable), propertyName: "thickness", onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: "PX", unitLocked: true })),
44187
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_4__["CheckBoxLineComponent"], { iconLabel: "Clip Content", icon: clipContentsIcon, label: "CLIP CONTENT", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__["makeTargetsProxy"])(ellipses, this.props.onPropertyChangedObservable), propertyName: "clipChildren", onPropertyChangedObservable: this.props.onPropertyChangedObservable })));
44321
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__["FloatLineComponent"], { iconLabel: "Stroke Weight", icon: strokeWeightIcon, lockObject: lockObject, label: "", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_5__["makeTargetsProxy"])(ellipses, onPropertyChangedObservable), propertyName: "thickness", onPropertyChangedObservable: onPropertyChangedObservable, unit: "PX", unitLocked: true })),
44322
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_containerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_6__["ContainerPropertyGridComponent"], { containers: ellipses, onPropertyChangedObservable: onPropertyChangedObservable })));
44188
44323
  };
44189
44324
  return EllipsePropertyGridComponent;
44190
44325
  }(react__WEBPACK_IMPORTED_MODULE_1__["Component"]));
@@ -45009,9 +45144,9 @@ __webpack_require__.r(__webpack_exports__);
45009
45144
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
45010
45145
  /* harmony import */ var _gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../gui/commonControlPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/commonControlPropertyGridComponent.tsx");
45011
45146
  /* harmony import */ var _sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/floatLineComponent */ "./sharedUiComponents/lines/floatLineComponent.tsx");
45012
- /* harmony import */ var _sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/checkBoxLineComponent */ "./sharedUiComponents/lines/checkBoxLineComponent.tsx");
45013
- /* harmony import */ var _sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/textLineComponent */ "./sharedUiComponents/lines/textLineComponent.tsx");
45014
- /* harmony import */ var _sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/targetsProxy */ "./sharedUiComponents/lines/targetsProxy.tsx");
45147
+ /* harmony import */ var _sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/textLineComponent */ "./sharedUiComponents/lines/textLineComponent.tsx");
45148
+ /* harmony import */ var _sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/targetsProxy */ "./sharedUiComponents/lines/targetsProxy.tsx");
45149
+ /* harmony import */ var _containerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./containerPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/containerPropertyGridComponent.tsx");
45015
45150
 
45016
45151
 
45017
45152
 
@@ -45020,7 +45155,6 @@ __webpack_require__.r(__webpack_exports__);
45020
45155
 
45021
45156
 
45022
45157
  var conerRadiusIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/conerRadiusIcon.svg */ "./sharedUiComponents/imgs/conerRadiusIcon.svg");
45023
- var clipContentsIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/clipContentsIcon.svg */ "./sharedUiComponents/imgs/clipContentsIcon.svg");
45024
45158
  var strokeWeightIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/strokeWeightIcon.svg */ "./sharedUiComponents/imgs/strokeWeightIcon.svg");
45025
45159
  var RectanglePropertyGridComponent = /** @class */ (function (_super) {
45026
45160
  Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(RectanglePropertyGridComponent, _super);
@@ -45028,16 +45162,16 @@ var RectanglePropertyGridComponent = /** @class */ (function (_super) {
45028
45162
  return _super.call(this, props) || this;
45029
45163
  }
45030
45164
  RectanglePropertyGridComponent.prototype.render = function () {
45031
- var rectangles = this.props.rectangles;
45165
+ var _a = this.props, rectangles = _a.rectangles, lockObject = _a.lockObject, onPropertyChangedObservable = _a.onPropertyChangedObservable;
45032
45166
  return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "pane" },
45033
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__["CommonControlPropertyGridComponent"], { lockObject: this.props.lockObject, controls: rectangles, onPropertyChangedObservable: this.props.onPropertyChangedObservable }),
45167
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__["CommonControlPropertyGridComponent"], { lockObject: lockObject, controls: rectangles, onPropertyChangedObservable: onPropertyChangedObservable }),
45034
45168
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("hr", null),
45035
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_5__["TextLineComponent"], { label: "RECTANGLE", value: " ", color: "grey" }),
45169
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__["TextLineComponent"], { label: "RECTANGLE", value: " ", color: "grey" }),
45036
45170
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
45037
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__["FloatLineComponent"], { iconLabel: "Stroke Weight", icon: strokeWeightIcon, lockObject: this.props.lockObject, label: "", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__["makeTargetsProxy"])(rectangles, this.props.onPropertyChangedObservable), propertyName: "thickness", onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: "PX", unitLocked: true })),
45171
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__["FloatLineComponent"], { iconLabel: "Stroke Weight", icon: strokeWeightIcon, lockObject: this.props.lockObject, label: "", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_5__["makeTargetsProxy"])(rectangles, onPropertyChangedObservable), propertyName: "thickness", onPropertyChangedObservable: onPropertyChangedObservable, unit: "PX", unitLocked: true })),
45038
45172
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
45039
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__["FloatLineComponent"], { iconLabel: "Corner Radius", icon: conerRadiusIcon, lockObject: this.props.lockObject, label: "", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__["makeTargetsProxy"])(rectangles, this.props.onPropertyChangedObservable), propertyName: "cornerRadius", onPropertyChangedObservable: this.props.onPropertyChangedObservable, unit: "PX", unitLocked: true })),
45040
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_4__["CheckBoxLineComponent"], { iconLabel: "Clip Content", icon: clipContentsIcon, label: "CLIP CONTENT", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__["makeTargetsProxy"])(rectangles, this.props.onPropertyChangedObservable), propertyName: "clipChildren", onPropertyChangedObservable: this.props.onPropertyChangedObservable })));
45173
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_3__["FloatLineComponent"], { iconLabel: "Corner Radius", icon: conerRadiusIcon, lockObject: lockObject, label: "", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_5__["makeTargetsProxy"])(rectangles, onPropertyChangedObservable), propertyName: "cornerRadius", onPropertyChangedObservable: onPropertyChangedObservable, unit: "PX", unitLocked: true })),
45174
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_containerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_6__["ContainerPropertyGridComponent"], { containers: rectangles, onPropertyChangedObservable: onPropertyChangedObservable })));
45041
45175
  };
45042
45176
  return RectanglePropertyGridComponent;
45043
45177
  }(react__WEBPACK_IMPORTED_MODULE_1__["Component"]));
@@ -45227,6 +45361,8 @@ __webpack_require__.r(__webpack_exports__);
45227
45361
  /* harmony import */ var _sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/textLineComponent */ "./sharedUiComponents/lines/textLineComponent.tsx");
45228
45362
  /* harmony import */ var _sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/floatLineComponent */ "./sharedUiComponents/lines/floatLineComponent.tsx");
45229
45363
  /* harmony import */ var _sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../sharedUiComponents/lines/targetsProxy */ "./sharedUiComponents/lines/targetsProxy.tsx");
45364
+ /* harmony import */ var _containerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./containerPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/containerPropertyGridComponent.tsx");
45365
+
45230
45366
 
45231
45367
 
45232
45368
 
@@ -45235,21 +45371,20 @@ __webpack_require__.r(__webpack_exports__);
45235
45371
 
45236
45372
 
45237
45373
  var verticalMarginIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/verticalMarginIcon.svg */ "./sharedUiComponents/imgs/verticalMarginIcon.svg");
45238
- var clipContentsIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/clipContentsIcon.svg */ "./sharedUiComponents/imgs/clipContentsIcon.svg");
45239
45374
  var StackPanelPropertyGridComponent = /** @class */ (function (_super) {
45240
45375
  Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(StackPanelPropertyGridComponent, _super);
45241
45376
  function StackPanelPropertyGridComponent(props) {
45242
45377
  return _super.call(this, props) || this;
45243
45378
  }
45244
45379
  StackPanelPropertyGridComponent.prototype.render = function () {
45245
- var stackPanels = this.props.stackPanels;
45380
+ var _a = this.props, stackPanels = _a.stackPanels, lockObject = _a.lockObject, onPropertyChangedObservable = _a.onPropertyChangedObservable;
45246
45381
  return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "pane" },
45247
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__["CommonControlPropertyGridComponent"], { lockObject: this.props.lockObject, controls: stackPanels, onPropertyChangedObservable: this.props.onPropertyChangedObservable }),
45382
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_gui_commonControlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_2__["CommonControlPropertyGridComponent"], { lockObject: lockObject, controls: stackPanels, onPropertyChangedObservable: onPropertyChangedObservable }),
45248
45383
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("hr", null),
45249
45384
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_4__["TextLineComponent"], { label: "STACKPANEL", value: " ", color: "grey" }),
45250
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_3__["CheckBoxLineComponent"], { iconLabel: "Clip children", icon: clipContentsIcon, label: "CLIP CHILDREN", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__["makeTargetsProxy"])(stackPanels, this.props.onPropertyChangedObservable), propertyName: "clipChildren", onPropertyChangedObservable: this.props.onPropertyChangedObservable }),
45251
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_3__["CheckBoxLineComponent"], { iconLabel: "Vertical", icon: verticalMarginIcon, label: "VERTICAL", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__["makeTargetsProxy"])(stackPanels, this.props.onPropertyChangedObservable), propertyName: "isVertical", onPropertyChangedObservable: this.props.onPropertyChangedObservable }),
45252
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_5__["FloatLineComponent"], { lockObject: this.props.lockObject, label: "", icon: verticalMarginIcon, iconLabel: "spacing", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__["makeTargetsProxy"])(stackPanels, this.props.onPropertyChangedObservable), propertyName: "spacing", defaultValue: 0, onPropertyChangedObservable: this.props.onPropertyChangedObservable, onChange: function () { return stackPanels.forEach(function (panel) { return panel._markAsDirty(); }); } })));
45385
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_containerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_7__["ContainerPropertyGridComponent"], { containers: stackPanels, onPropertyChangedObservable: onPropertyChangedObservable }),
45386
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_3__["CheckBoxLineComponent"], { iconLabel: "Vertical", icon: verticalMarginIcon, label: "VERTICAL", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__["makeTargetsProxy"])(stackPanels, onPropertyChangedObservable), propertyName: "isVertical", onPropertyChangedObservable: onPropertyChangedObservable }),
45387
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_5__["FloatLineComponent"], { lockObject: lockObject, label: "", icon: verticalMarginIcon, iconLabel: "spacing", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_6__["makeTargetsProxy"])(stackPanels, onPropertyChangedObservable), propertyName: "spacing", defaultValue: 0, onPropertyChangedObservable: onPropertyChangedObservable, onChange: function () { return stackPanels.forEach(function (panel) { return panel._markAsDirty(); }); } })));
45253
45388
  };
45254
45389
  return StackPanelPropertyGridComponent;
45255
45390
  }(react__WEBPACK_IMPORTED_MODULE_1__["Component"]));
@@ -45369,48 +45504,33 @@ __webpack_require__.r(__webpack_exports__);
45369
45504
  /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../../../node_modules/tslib/tslib.es6.js");
45370
45505
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
45371
45506
  /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
45372
- /* harmony import */ var _sharedUiComponents_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../sharedUiComponents/lines/buttonLineComponent */ "./sharedUiComponents/lines/buttonLineComponent.tsx");
45373
- /* harmony import */ var _sharedUiComponents_lines_fileButtonLineComponent__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../sharedUiComponents/lines/fileButtonLineComponent */ "./sharedUiComponents/lines/fileButtonLineComponent.tsx");
45374
- /* harmony import */ var _babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @babylonjs/core/Misc/tools */ "@babylonjs/core/Misc/observable");
45375
- /* harmony import */ var _babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_4___default = /*#__PURE__*/__webpack_require__.n(_babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_4__);
45376
- /* harmony import */ var _sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../sharedUiComponents/lines/checkBoxLineComponent */ "./sharedUiComponents/lines/checkBoxLineComponent.tsx");
45377
- /* harmony import */ var _sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../sharedUiComponents/lines/textLineComponent */ "./sharedUiComponents/lines/textLineComponent.tsx");
45378
- /* harmony import */ var _sharedUiComponents_stringTools__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../sharedUiComponents/stringTools */ "./sharedUiComponents/stringTools.ts");
45379
- /* harmony import */ var _sharedUiComponents_tabs_propertyGrids_lockObject__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../sharedUiComponents/tabs/propertyGrids/lockObject */ "./sharedUiComponents/tabs/propertyGrids/lockObject.ts");
45380
- /* harmony import */ var _propertyGrids_gui_sliderGenericPropertyGridComponent__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./propertyGrids/gui/sliderGenericPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/sliderGenericPropertyGridComponent.tsx");
45381
- /* harmony import */ var _propertyGrids_gui_linePropertyGridComponent__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./propertyGrids/gui/linePropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/linePropertyGridComponent.tsx");
45382
- /* harmony import */ var _propertyGrids_gui_radioButtonPropertyGridComponent__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./propertyGrids/gui/radioButtonPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/radioButtonPropertyGridComponent.tsx");
45383
- /* harmony import */ var _propertyGrids_gui_textBlockPropertyGridComponent__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./propertyGrids/gui/textBlockPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/textBlockPropertyGridComponent.tsx");
45384
- /* harmony import */ var _propertyGrids_gui_inputTextPropertyGridComponent__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./propertyGrids/gui/inputTextPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/inputTextPropertyGridComponent.tsx");
45385
- /* harmony import */ var _propertyGrids_gui_colorPickerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./propertyGrids/gui/colorPickerPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/colorPickerPropertyGridComponent.tsx");
45386
- /* harmony import */ var _propertyGrids_gui_imagePropertyGridComponent__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./propertyGrids/gui/imagePropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/imagePropertyGridComponent.tsx");
45387
- /* harmony import */ var _propertyGrids_gui_imageBasedSliderPropertyGridComponent__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./propertyGrids/gui/imageBasedSliderPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/imageBasedSliderPropertyGridComponent.tsx");
45388
- /* harmony import */ var _propertyGrids_gui_rectanglePropertyGridComponent__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./propertyGrids/gui/rectanglePropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/rectanglePropertyGridComponent.tsx");
45389
- /* harmony import */ var _propertyGrids_gui_stackPanelPropertyGridComponent__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./propertyGrids/gui/stackPanelPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/stackPanelPropertyGridComponent.tsx");
45390
- /* harmony import */ var _propertyGrids_gui_gridPropertyGridComponent__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./propertyGrids/gui/gridPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/gridPropertyGridComponent.tsx");
45391
- /* harmony import */ var _propertyGrids_gui_scrollViewerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! ./propertyGrids/gui/scrollViewerPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/scrollViewerPropertyGridComponent.tsx");
45392
- /* harmony import */ var _propertyGrids_gui_ellipsePropertyGridComponent__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ./propertyGrids/gui/ellipsePropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/ellipsePropertyGridComponent.tsx");
45393
- /* harmony import */ var _propertyGrids_gui_checkboxPropertyGridComponent__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./propertyGrids/gui/checkboxPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/checkboxPropertyGridComponent.tsx");
45394
- /* harmony import */ var _propertyGrids_gui_controlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./propertyGrids/gui/controlPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/controlPropertyGridComponent.tsx");
45395
- /* harmony import */ var _babylonjs_gui_2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! @babylonjs/gui/2D/advancedDynamicTexture */ "@babylonjs/gui/2D/controls/button");
45396
- /* harmony import */ var _babylonjs_gui_2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_24___default = /*#__PURE__*/__webpack_require__.n(_babylonjs_gui_2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_24__);
45397
- /* harmony import */ var _sharedUiComponents_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ../../sharedUiComponents/lines/optionsLineComponent */ "./sharedUiComponents/lines/optionsLineComponent.tsx");
45398
- /* harmony import */ var _sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ../../sharedUiComponents/lines/floatLineComponent */ "./sharedUiComponents/lines/floatLineComponent.tsx");
45399
- /* harmony import */ var _sharedUiComponents_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ../../sharedUiComponents/lines/colorLineComponent */ "./sharedUiComponents/lines/colorLineComponent.tsx");
45400
- /* harmony import */ var _sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! ../../sharedUiComponents/lines/textInputLineComponent */ "./sharedUiComponents/lines/textInputLineComponent.tsx");
45401
- /* harmony import */ var _parentingPropertyGridComponent__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! ../parentingPropertyGridComponent */ "./components/parentingPropertyGridComponent.tsx");
45402
- /* harmony import */ var _propertyGrids_gui_displayGridPropertyGridComponent__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! ./propertyGrids/gui/displayGridPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/displayGridPropertyGridComponent.tsx");
45403
- /* harmony import */ var _propertyGrids_gui_buttonPropertyGridComponent__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! ./propertyGrids/gui/buttonPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/buttonPropertyGridComponent.tsx");
45404
- /* harmony import */ var _guiNodeTools__WEBPACK_IMPORTED_MODULE_32__ = __webpack_require__(/*! ../../guiNodeTools */ "./guiNodeTools.ts");
45405
- /* harmony import */ var _sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_33__ = __webpack_require__(/*! ../../sharedUiComponents/lines/targetsProxy */ "./sharedUiComponents/lines/targetsProxy.tsx");
45406
-
45407
-
45408
-
45409
-
45410
-
45411
-
45412
-
45413
-
45507
+ /* harmony import */ var _babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @babylonjs/core/Misc/tools */ "@babylonjs/core/Misc/observable");
45508
+ /* harmony import */ var _babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_2__);
45509
+ /* harmony import */ var _sharedUiComponents_stringTools__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../sharedUiComponents/stringTools */ "./sharedUiComponents/stringTools.ts");
45510
+ /* harmony import */ var _sharedUiComponents_tabs_propertyGrids_lockObject__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../sharedUiComponents/tabs/propertyGrids/lockObject */ "./sharedUiComponents/tabs/propertyGrids/lockObject.ts");
45511
+ /* harmony import */ var _propertyGrids_gui_sliderGenericPropertyGridComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./propertyGrids/gui/sliderGenericPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/sliderGenericPropertyGridComponent.tsx");
45512
+ /* harmony import */ var _propertyGrids_gui_linePropertyGridComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./propertyGrids/gui/linePropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/linePropertyGridComponent.tsx");
45513
+ /* harmony import */ var _propertyGrids_gui_radioButtonPropertyGridComponent__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./propertyGrids/gui/radioButtonPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/radioButtonPropertyGridComponent.tsx");
45514
+ /* harmony import */ var _propertyGrids_gui_textBlockPropertyGridComponent__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./propertyGrids/gui/textBlockPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/textBlockPropertyGridComponent.tsx");
45515
+ /* harmony import */ var _propertyGrids_gui_inputTextPropertyGridComponent__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./propertyGrids/gui/inputTextPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/inputTextPropertyGridComponent.tsx");
45516
+ /* harmony import */ var _propertyGrids_gui_colorPickerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./propertyGrids/gui/colorPickerPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/colorPickerPropertyGridComponent.tsx");
45517
+ /* harmony import */ var _propertyGrids_gui_imagePropertyGridComponent__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./propertyGrids/gui/imagePropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/imagePropertyGridComponent.tsx");
45518
+ /* harmony import */ var _propertyGrids_gui_imageBasedSliderPropertyGridComponent__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./propertyGrids/gui/imageBasedSliderPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/imageBasedSliderPropertyGridComponent.tsx");
45519
+ /* harmony import */ var _propertyGrids_gui_rectanglePropertyGridComponent__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./propertyGrids/gui/rectanglePropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/rectanglePropertyGridComponent.tsx");
45520
+ /* harmony import */ var _propertyGrids_gui_stackPanelPropertyGridComponent__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! ./propertyGrids/gui/stackPanelPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/stackPanelPropertyGridComponent.tsx");
45521
+ /* harmony import */ var _propertyGrids_gui_gridPropertyGridComponent__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! ./propertyGrids/gui/gridPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/gridPropertyGridComponent.tsx");
45522
+ /* harmony import */ var _propertyGrids_gui_scrollViewerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! ./propertyGrids/gui/scrollViewerPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/scrollViewerPropertyGridComponent.tsx");
45523
+ /* harmony import */ var _propertyGrids_gui_ellipsePropertyGridComponent__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ./propertyGrids/gui/ellipsePropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/ellipsePropertyGridComponent.tsx");
45524
+ /* harmony import */ var _propertyGrids_gui_checkboxPropertyGridComponent__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ./propertyGrids/gui/checkboxPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/checkboxPropertyGridComponent.tsx");
45525
+ /* harmony import */ var _propertyGrids_gui_controlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! ./propertyGrids/gui/controlPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/controlPropertyGridComponent.tsx");
45526
+ /* harmony import */ var _babylonjs_gui_2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! @babylonjs/gui/2D/advancedDynamicTexture */ "@babylonjs/gui/2D/controls/button");
45527
+ /* harmony import */ var _babylonjs_gui_2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_20___default = /*#__PURE__*/__webpack_require__.n(_babylonjs_gui_2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_20__);
45528
+ /* harmony import */ var _sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! ../../sharedUiComponents/lines/textInputLineComponent */ "./sharedUiComponents/lines/textInputLineComponent.tsx");
45529
+ /* harmony import */ var _parentingPropertyGridComponent__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ../parentingPropertyGridComponent */ "./components/parentingPropertyGridComponent.tsx");
45530
+ /* harmony import */ var _propertyGrids_gui_displayGridPropertyGridComponent__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./propertyGrids/gui/displayGridPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/displayGridPropertyGridComponent.tsx");
45531
+ /* harmony import */ var _propertyGrids_gui_buttonPropertyGridComponent__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ./propertyGrids/gui/buttonPropertyGridComponent */ "./components/propertyTab/propertyGrids/gui/buttonPropertyGridComponent.tsx");
45532
+ /* harmony import */ var _guiNodeTools__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ../../guiNodeTools */ "./guiNodeTools.ts");
45533
+ /* harmony import */ var _sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ../../sharedUiComponents/lines/targetsProxy */ "./sharedUiComponents/lines/targetsProxy.tsx");
45414
45534
 
45415
45535
 
45416
45536
 
@@ -45440,9 +45560,6 @@ __webpack_require__.r(__webpack_exports__);
45440
45560
 
45441
45561
  __webpack_require__(/*! ./propertyTab.scss */ "./components/propertyTab/propertyTab.scss");
45442
45562
  var adtIcon = __webpack_require__(/*! ../../../public/imgs/adtIcon.svg */ "../public/imgs/adtIcon.svg");
45443
- var responsiveIcon = __webpack_require__(/*! ../../../public/imgs/responsiveIcon.svg */ "../public/imgs/responsiveIcon.svg");
45444
- var canvasSizeIcon = __webpack_require__(/*! ../../../public/imgs/canvasSizeIcon.svg */ "../public/imgs/canvasSizeIcon.svg");
45445
- var artboardColorIcon = __webpack_require__(/*! ../../../../sharedUiComponents/imgs/fillColorIcon.svg */ "../../sharedUiComponents/imgs/fillColorIcon.svg");
45446
45563
  var rectangleIcon = __webpack_require__(/*! ../../../public/imgs/rectangleIconDark.svg */ "../public/imgs/rectangleIconDark.svg");
45447
45564
  var ellipseIcon = __webpack_require__(/*! ../../../public/imgs/ellipseIconDark.svg */ "../public/imgs/ellipseIconDark.svg");
45448
45565
  var gridIcon = __webpack_require__(/*! ../../../public/imgs/gridIconDark.svg */ "../public/imgs/gridIconDark.svg");
@@ -45460,7 +45577,6 @@ var colorPickerIcon = __webpack_require__(/*! ../../../public/imgs/colorPickerIc
45460
45577
  var scrollbarIcon = __webpack_require__(/*! ../../../public/imgs/scrollbarIconDark.svg */ "../public/imgs/scrollbarIconDark.svg");
45461
45578
  var imageSliderIcon = __webpack_require__(/*! ../../../public/imgs/imageSliderIconDark.svg */ "../public/imgs/imageSliderIconDark.svg");
45462
45579
  var radioButtonIcon = __webpack_require__(/*! ../../../public/imgs/radioButtonIconDark.svg */ "../public/imgs/radioButtonIconDark.svg");
45463
- var MAX_TEXTURE_SIZE = 16384; //2^14
45464
45580
  var PropertyTabComponent = /** @class */ (function (_super) {
45465
45581
  Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(PropertyTabComponent, _super);
45466
45582
  function PropertyTabComponent(props) {
@@ -45468,11 +45584,11 @@ var PropertyTabComponent = /** @class */ (function (_super) {
45468
45584
  _this.saveLocally = function () {
45469
45585
  try {
45470
45586
  var json = JSON.stringify(_this.props.globalState.guiTexture.serializeContent());
45471
- _sharedUiComponents_stringTools__WEBPACK_IMPORTED_MODULE_7__["StringTools"].DownloadAsFile(_this.props.globalState.hostDocument, json, "guiTexture.json");
45587
+ _sharedUiComponents_stringTools__WEBPACK_IMPORTED_MODULE_3__["StringTools"].DownloadAsFile(_this.props.globalState.hostDocument, json, "guiTexture.json");
45472
45588
  }
45473
45589
  catch (error) {
45474
45590
  _this.props.globalState.hostWindow.alert("Unable to save your GUI");
45475
- _babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_4__["Tools"].Error("Unable to save your GUI");
45591
+ _babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_2__["Tools"].Error("Unable to save your GUI");
45476
45592
  }
45477
45593
  };
45478
45594
  _this.saveToSnippetServerHelper = function (content, adt) {
@@ -45501,7 +45617,7 @@ var PropertyTabComponent = /** @class */ (function (_super) {
45501
45617
  }
45502
45618
  }
45503
45619
  };
45504
- xmlHttp.open("POST", _babylonjs_gui_2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_24__["AdvancedDynamicTexture"].SnippetUrl + (adt.snippetId ? "/" + adt.snippetId : ""), true);
45620
+ xmlHttp.open("POST", _babylonjs_gui_2D_advancedDynamicTexture__WEBPACK_IMPORTED_MODULE_20__["AdvancedDynamicTexture"].SnippetUrl + (adt.snippetId ? "/" + adt.snippetId : ""), true);
45505
45621
  xmlHttp.setRequestHeader("Content-Type", "application/json");
45506
45622
  var dataToSend = {
45507
45623
  payload: JSON.stringify({
@@ -45548,7 +45664,7 @@ var PropertyTabComponent = /** @class */ (function (_super) {
45548
45664
  return [2 /*return*/];
45549
45665
  });
45550
45666
  }); };
45551
- _this._lockObject = new _sharedUiComponents_tabs_propertyGrids_lockObject__WEBPACK_IMPORTED_MODULE_8__["LockObject"]();
45667
+ _this._lockObject = new _sharedUiComponents_tabs_propertyGrids_lockObject__WEBPACK_IMPORTED_MODULE_4__["LockObject"]();
45552
45668
  _this.props.globalState.lockObject = _this._lockObject;
45553
45669
  _this.props.globalState.onSaveObservable.add(function () {
45554
45670
  _this.save(_this.saveLocally);
@@ -45583,7 +45699,7 @@ var PropertyTabComponent = /** @class */ (function (_super) {
45583
45699
  };
45584
45700
  PropertyTabComponent.prototype.load = function (file) {
45585
45701
  var _this = this;
45586
- _babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_4__["Tools"].ReadFile(file, function (data) {
45702
+ _babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_2__["Tools"].ReadFile(file, function (data) {
45587
45703
  var decoder = new TextDecoder("utf-8");
45588
45704
  _this.props.globalState.workbench.loadFromJson(JSON.parse(decoder.decode(data)));
45589
45705
  _this.props.globalState.setSelection([]);
@@ -45610,9 +45726,9 @@ var PropertyTabComponent = /** @class */ (function (_super) {
45610
45726
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { id: "header" },
45611
45727
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("img", { id: "logo", src: this.renderControlIcon(nodes) }),
45612
45728
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { id: "title" },
45613
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_28__["TextInputLineComponent"], { noUnderline: true, lockObject: this._lockObject, label: "", target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_33__["makeTargetsProxy"])(nodes, this.props.globalState.onPropertyChangedObservable), propertyName: "name", onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }))),
45729
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textInputLineComponent__WEBPACK_IMPORTED_MODULE_21__["TextInputLineComponent"], { noUnderline: true, lockObject: this._lockObject, target: Object(_sharedUiComponents_lines_targetsProxy__WEBPACK_IMPORTED_MODULE_26__["makeTargetsProxy"])(nodes, this.props.globalState.onPropertyChangedObservable), propertyName: "name", onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }))),
45614
45730
  this.renderProperties(nodes),
45615
- ((_a = node === null || node === void 0 ? void 0 : node.parent) === null || _a === void 0 ? void 0 : _a.typeName) === "Grid" && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_parentingPropertyGridComponent__WEBPACK_IMPORTED_MODULE_29__["ParentingPropertyGridComponent"], { control: node, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, lockObject: this._lockObject })));
45731
+ ((_a = node === null || node === void 0 ? void 0 : node.parent) === null || _a === void 0 ? void 0 : _a.typeName) === "Grid" && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_parentingPropertyGridComponent__WEBPACK_IMPORTED_MODULE_22__["ParentingPropertyGridComponent"], { control: node, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, lockObject: this._lockObject })));
45616
45732
  };
45617
45733
  /**
45618
45734
  * returns the class name of a list of controls if they share a class, or an empty string if not
@@ -45638,69 +45754,69 @@ var PropertyTabComponent = /** @class */ (function (_super) {
45638
45754
  switch (className) {
45639
45755
  case "TextBlock": {
45640
45756
  var textBlocks = nodes;
45641
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_textBlockPropertyGridComponent__WEBPACK_IMPORTED_MODULE_12__["TextBlockPropertyGridComponent"], { textBlocks: textBlocks, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45757
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_textBlockPropertyGridComponent__WEBPACK_IMPORTED_MODULE_8__["TextBlockPropertyGridComponent"], { textBlocks: textBlocks, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45642
45758
  }
45643
45759
  case "InputText": {
45644
45760
  var inputTexts = nodes;
45645
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_inputTextPropertyGridComponent__WEBPACK_IMPORTED_MODULE_13__["InputTextPropertyGridComponent"], { inputTexts: inputTexts, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45761
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_inputTextPropertyGridComponent__WEBPACK_IMPORTED_MODULE_9__["InputTextPropertyGridComponent"], { inputTexts: inputTexts, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45646
45762
  }
45647
45763
  case "ColorPicker": {
45648
45764
  var colorPickers = nodes;
45649
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_colorPickerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_14__["ColorPickerPropertyGridComponent"], { colorPickers: colorPickers, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45765
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_colorPickerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_10__["ColorPickerPropertyGridComponent"], { colorPickers: colorPickers, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45650
45766
  }
45651
45767
  case "Image": {
45652
45768
  var images = nodes;
45653
- return react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_imagePropertyGridComponent__WEBPACK_IMPORTED_MODULE_15__["ImagePropertyGridComponent"], { images: images, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable });
45769
+ return react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_imagePropertyGridComponent__WEBPACK_IMPORTED_MODULE_11__["ImagePropertyGridComponent"], { images: images, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable });
45654
45770
  }
45655
45771
  case "Slider": {
45656
45772
  var sliders = nodes;
45657
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_sliderGenericPropertyGridComponent__WEBPACK_IMPORTED_MODULE_9__["SliderGenericPropertyGridComponent"], { sliders: sliders, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45773
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_sliderGenericPropertyGridComponent__WEBPACK_IMPORTED_MODULE_5__["SliderGenericPropertyGridComponent"], { sliders: sliders, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45658
45774
  }
45659
45775
  case "ImageBasedSlider": {
45660
45776
  var imageBasedSliders = nodes;
45661
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_imageBasedSliderPropertyGridComponent__WEBPACK_IMPORTED_MODULE_16__["ImageBasedSliderPropertyGridComponent"], { imageBasedSliders: imageBasedSliders, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45777
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_imageBasedSliderPropertyGridComponent__WEBPACK_IMPORTED_MODULE_12__["ImageBasedSliderPropertyGridComponent"], { imageBasedSliders: imageBasedSliders, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45662
45778
  }
45663
45779
  case "Rectangle": {
45664
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_rectanglePropertyGridComponent__WEBPACK_IMPORTED_MODULE_17__["RectanglePropertyGridComponent"], { rectangles: nodes, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45780
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_rectanglePropertyGridComponent__WEBPACK_IMPORTED_MODULE_13__["RectanglePropertyGridComponent"], { rectangles: nodes, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45665
45781
  }
45666
45782
  case "StackPanel": {
45667
45783
  var stackPanels = nodes;
45668
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_stackPanelPropertyGridComponent__WEBPACK_IMPORTED_MODULE_18__["StackPanelPropertyGridComponent"], { stackPanels: stackPanels, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45784
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_stackPanelPropertyGridComponent__WEBPACK_IMPORTED_MODULE_14__["StackPanelPropertyGridComponent"], { stackPanels: stackPanels, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45669
45785
  }
45670
45786
  case "Grid": {
45671
45787
  var grids = nodes;
45672
- return react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_gridPropertyGridComponent__WEBPACK_IMPORTED_MODULE_19__["GridPropertyGridComponent"], { grids: grids, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable });
45788
+ return react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_gridPropertyGridComponent__WEBPACK_IMPORTED_MODULE_15__["GridPropertyGridComponent"], { grids: grids, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable });
45673
45789
  }
45674
45790
  case "ScrollViewer": {
45675
45791
  var scrollViewers = nodes;
45676
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_scrollViewerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_20__["ScrollViewerPropertyGridComponent"], { scrollViewers: scrollViewers, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45792
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_scrollViewerPropertyGridComponent__WEBPACK_IMPORTED_MODULE_16__["ScrollViewerPropertyGridComponent"], { scrollViewers: scrollViewers, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45677
45793
  }
45678
45794
  case "Ellipse": {
45679
45795
  var ellipses = nodes;
45680
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_ellipsePropertyGridComponent__WEBPACK_IMPORTED_MODULE_21__["EllipsePropertyGridComponent"], { ellipses: ellipses, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45796
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_ellipsePropertyGridComponent__WEBPACK_IMPORTED_MODULE_17__["EllipsePropertyGridComponent"], { ellipses: ellipses, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45681
45797
  }
45682
45798
  case "Checkbox": {
45683
45799
  var checkboxes = nodes;
45684
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_checkboxPropertyGridComponent__WEBPACK_IMPORTED_MODULE_22__["CheckboxPropertyGridComponent"], { checkboxes: checkboxes, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45800
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_checkboxPropertyGridComponent__WEBPACK_IMPORTED_MODULE_18__["CheckboxPropertyGridComponent"], { checkboxes: checkboxes, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45685
45801
  }
45686
45802
  case "RadioButton": {
45687
45803
  var radioButtons = nodes;
45688
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_radioButtonPropertyGridComponent__WEBPACK_IMPORTED_MODULE_11__["RadioButtonPropertyGridComponent"], { radioButtons: radioButtons, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45804
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_radioButtonPropertyGridComponent__WEBPACK_IMPORTED_MODULE_7__["RadioButtonPropertyGridComponent"], { radioButtons: radioButtons, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45689
45805
  }
45690
45806
  case "Line": {
45691
45807
  var lines = nodes;
45692
- return react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_linePropertyGridComponent__WEBPACK_IMPORTED_MODULE_10__["LinePropertyGridComponent"], { lines: lines, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable });
45808
+ return react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_linePropertyGridComponent__WEBPACK_IMPORTED_MODULE_6__["LinePropertyGridComponent"], { lines: lines, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable });
45693
45809
  }
45694
45810
  case "DisplayGrid": {
45695
45811
  var displayGrids = nodes;
45696
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_displayGridPropertyGridComponent__WEBPACK_IMPORTED_MODULE_30__["DisplayGridPropertyGridComponent"], { displayGrids: displayGrids, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45812
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_displayGridPropertyGridComponent__WEBPACK_IMPORTED_MODULE_23__["DisplayGridPropertyGridComponent"], { displayGrids: displayGrids, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45697
45813
  }
45698
45814
  case "Button": {
45699
45815
  var buttons_1 = nodes;
45700
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_buttonPropertyGridComponent__WEBPACK_IMPORTED_MODULE_31__["ButtonPropertyGridComponent"], { key: "buttonMenu", rectangles: buttons_1, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onAddComponent: function (value) {
45816
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_buttonPropertyGridComponent__WEBPACK_IMPORTED_MODULE_24__["ButtonPropertyGridComponent"], { key: "buttonMenu", rectangles: buttons_1, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable, onAddComponent: function (value) {
45701
45817
  for (var _i = 0, buttons_2 = buttons_1; _i < buttons_2.length; _i++) {
45702
45818
  var button = buttons_2[_i];
45703
- var guiElement = _guiNodeTools__WEBPACK_IMPORTED_MODULE_32__["GUINodeTools"].CreateControlFromString(value);
45819
+ var guiElement = _guiNodeTools__WEBPACK_IMPORTED_MODULE_25__["GUINodeTools"].CreateControlFromString(value);
45704
45820
  var newGuiNode = _this.props.globalState.workbench.createNewGuiNode(guiElement);
45705
45821
  button.addControl(newGuiNode);
45706
45822
  _this.props.globalState.select(newGuiNode);
@@ -45709,7 +45825,7 @@ var PropertyTabComponent = /** @class */ (function (_super) {
45709
45825
  }
45710
45826
  }
45711
45827
  var controls = nodes;
45712
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_controlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_23__["ControlPropertyGridComponent"], { controls: controls, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45828
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_propertyGrids_gui_controlPropertyGridComponent__WEBPACK_IMPORTED_MODULE_19__["ControlPropertyGridComponent"], { controls: controls, lockObject: this._lockObject, onPropertyChangedObservable: this.props.globalState.onPropertyChangedObservable }));
45713
45829
  };
45714
45830
  PropertyTabComponent.prototype.renderControlIcon = function (nodes) {
45715
45831
  var node = nodes[0];
@@ -45773,98 +45889,12 @@ var PropertyTabComponent = /** @class */ (function (_super) {
45773
45889
  return adtIcon;
45774
45890
  };
45775
45891
  PropertyTabComponent.prototype.render = function () {
45776
- var _this = this;
45777
45892
  if (this.props.globalState.guiTexture == undefined)
45778
45893
  return null;
45779
- var _sizeValues = [
45780
- { width: 1920, height: 1080 },
45781
- { width: 1366, height: 768 },
45782
- { width: 1280, height: 800 },
45783
- { width: 3840, height: 2160 },
45784
- { width: 750, height: 1334 },
45785
- { width: 1125, height: 2436 },
45786
- { width: 1170, height: 2532 },
45787
- { width: 1284, height: 2778 },
45788
- { width: 1080, height: 2220 },
45789
- { width: 1080, height: 2340 },
45790
- { width: 1024, height: 1024 },
45791
- { width: 2048, height: 2048 },
45792
- ];
45793
- var _sizeOptions = [
45794
- { label: "Web (1920)", value: 0 },
45795
- { label: "Web (1366)", value: 1 },
45796
- { label: "Web (1280)", value: 2 },
45797
- { label: "Web (3840)", value: 3 },
45798
- { label: "iPhone 8 (750)", value: 4 },
45799
- { label: "iPhone X, 11 (1125)", value: 5 },
45800
- { label: "iPhone 12 (1170)", value: 6 },
45801
- { label: "iPhone Pro Max (1284)", value: 7 },
45802
- { label: "Google Pixel 4 (1080)", value: 8 },
45803
- { label: "Google Pixel 5 (1080)", value: 9 },
45804
- { label: "Square (1024)", value: 10 },
45805
- { label: "Square (2048)", value: 11 },
45806
- ];
45807
- var size = Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__assign"])({}, this.props.globalState.workbench.guiSize);
45808
- this._sizeOption = _sizeValues.findIndex(function (value) { return value.width == size.width && value.height == size.height; });
45809
- if (this._sizeOption < 0) {
45810
- this.props.globalState.onResponsiveChangeObservable.notifyObservers(false);
45811
- _babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_4__["DataStorage"].WriteBoolean("Responsive", false);
45812
- }
45813
- if (this.props.globalState.selectedControls.length > 0) {
45814
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { id: "ge-propertyTab" }, this.renderNode(this.props.globalState.selectedControls)));
45815
- }
45816
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { id: "ge-propertyTab" },
45817
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { id: "header" },
45818
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("img", { id: "logo", src: adtIcon }),
45819
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { id: "title" }, "AdvancedDynamicTexture")),
45820
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", null,
45821
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextLineComponent"], { tooltip: "", label: "ART BOARD", value: " ", color: "grey" }),
45822
- this.props.globalState.workbench._scene !== undefined && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_colorLineComponent__WEBPACK_IMPORTED_MODULE_27__["ColorLineComponent"], { iconLabel: "Background Color", lockObject: this._lockObject, icon: artboardColorIcon, label: "", target: this.props.globalState, propertyName: "backgroundColor", disableAlpha: true })),
45823
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("hr", { className: "ge" }),
45824
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextLineComponent"], { tooltip: "", label: "CANVAS", value: " ", color: "grey" }),
45825
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__["CheckBoxLineComponent"], { label: "RESPONSIVE", iconLabel: "A responsive layout for the AdvancedDynamicTexture will resize the UI layout and reflow controls to accommodate different device screen sizes", icon: responsiveIcon, isSelected: function () { return _babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_4__["DataStorage"].ReadBoolean("Responsive", true); }, onSelect: function (value) {
45826
- _this.props.globalState.onResponsiveChangeObservable.notifyObservers(value);
45827
- _babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_4__["DataStorage"].WriteBoolean("Responsive", value);
45828
- _this._sizeOption = _sizeOptions.length;
45829
- if (value) {
45830
- _this._sizeOption = 0;
45831
- _this.props.globalState.workbench.guiSize = _sizeValues[_this._sizeOption];
45832
- }
45833
- _this.forceUpdate();
45834
- } }),
45835
- _babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_4__["DataStorage"].ReadBoolean("Responsive", true) && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_25__["OptionsLineComponent"], { label: "", iconLabel: "Size", options: _sizeOptions, icon: canvasSizeIcon, target: this, propertyName: "_sizeOption", noDirectUpdate: true, onSelect: function (value) {
45836
- _this._sizeOption = value;
45837
- if (_this._sizeOption !== _sizeOptions.length) {
45838
- var newSize = _sizeValues[_this._sizeOption];
45839
- _this.props.globalState.workbench.guiSize = newSize;
45840
- }
45841
- _this.forceUpdate();
45842
- } })),
45843
- !_babylonjs_core_Misc_tools__WEBPACK_IMPORTED_MODULE_4__["DataStorage"].ReadBoolean("Responsive", true) && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "ge-divider" },
45844
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_26__["FloatLineComponent"], { icon: canvasSizeIcon, iconLabel: "Canvas Size", label: "W", target: size, propertyName: "width", isInteger: true, min: 1, max: MAX_TEXTURE_SIZE, onChange: function (newvalue) {
45845
- if (!isNaN(newvalue)) {
45846
- _this.props.globalState.workbench.guiSize = { width: newvalue, height: size.height };
45847
- }
45848
- } }),
45849
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_26__["FloatLineComponent"], { icon: canvasSizeIcon, label: "H", target: size, propertyName: "height", isInteger: true, min: 1, max: MAX_TEXTURE_SIZE, onChange: function (newvalue) {
45850
- if (!isNaN(newvalue)) {
45851
- _this.props.globalState.workbench.guiSize = { width: size.width, height: newvalue };
45852
- }
45853
- } }))),
45854
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("hr", { className: "ge" }),
45855
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextLineComponent"], { tooltip: "", label: "FILE", value: " ", color: "grey" }),
45856
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_fileButtonLineComponent__WEBPACK_IMPORTED_MODULE_3__["FileButtonLineComponent"], { label: "Load", onClick: function (file) { return _this.load(file); }, accept: ".json" }),
45857
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_2__["ButtonLineComponent"], { label: "Save", onClick: function () {
45858
- _this.props.globalState.onSaveObservable.notifyObservers();
45859
- } }),
45860
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("hr", { className: "ge" }),
45861
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_textLineComponent__WEBPACK_IMPORTED_MODULE_6__["TextLineComponent"], { tooltip: "", label: "SNIPPET", value: " ", color: "grey" }),
45862
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_2__["ButtonLineComponent"], { label: "Load from snippet server", onClick: function () { return _this.loadFromSnippet(); } }),
45863
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedUiComponents_lines_buttonLineComponent__WEBPACK_IMPORTED_MODULE_2__["ButtonLineComponent"], { label: "Save to snippet server", onClick: function () {
45864
- _this.props.globalState.onSnippetSaveObservable.notifyObservers();
45865
- } }),
45866
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("hr", { className: "ge" }),
45867
- this.renderNode([this.props.globalState.workbench.trueRootContainer]))));
45894
+ var nodesToRender = this.props.globalState.selectedControls.length > 0 ?
45895
+ this.props.globalState.selectedControls :
45896
+ [this.props.globalState.workbench.trueRootContainer];
45897
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { id: "ge-propertyTab" }, this.renderNode(nodesToRender)));
45868
45898
  };
45869
45899
  return PropertyTabComponent;
45870
45900
  }(react__WEBPACK_IMPORTED_MODULE_1__["Component"]));
@@ -45891,6 +45921,8 @@ __webpack_require__.r(__webpack_exports__);
45891
45921
  /* harmony import */ var _globalState__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../globalState */ "./globalState.ts");
45892
45922
  /* harmony import */ var _babylonjs_gui_2D_controls_container__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @babylonjs/gui/2D/controls/container */ "@babylonjs/gui/2D/controls/button");
45893
45923
  /* harmony import */ var _babylonjs_gui_2D_controls_container__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(_babylonjs_gui_2D_controls_container__WEBPACK_IMPORTED_MODULE_5__);
45924
+ /* harmony import */ var _controlTypes__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../controlTypes */ "./controlTypes.ts");
45925
+
45894
45926
 
45895
45927
 
45896
45928
 
@@ -45932,7 +45964,10 @@ var ControlTreeItemComponent = /** @class */ (function (_super) {
45932
45964
  bracket = control.parent.getChildCellInfo(this.props.control);
45933
45965
  }
45934
45966
  var draggingSelf = this.props.globalState.draggedControl === control;
45967
+ var controlType = _controlTypes__WEBPACK_IMPORTED_MODULE_6__["ControlTypes"].find(function (type) { return type.className === control.getClassName(); });
45935
45968
  return (react__WEBPACK_IMPORTED_MODULE_3__["createElement"]("div", { className: "controlTools" },
45969
+ controlType && react__WEBPACK_IMPORTED_MODULE_3__["createElement"]("div", { className: "controlType icon" },
45970
+ react__WEBPACK_IMPORTED_MODULE_3__["createElement"]("img", { src: controlType.icon, alt: controlType.className })),
45936
45971
  react__WEBPACK_IMPORTED_MODULE_3__["createElement"](_treeItemLabelComponent__WEBPACK_IMPORTED_MODULE_1__["TreeItemLabelComponent"], { label: control.name, bracket: bracket, onClick: function () { return _this.props.onClick(); }, onChange: function (name) { return _this.onRename(name); }, setRenaming: function (renaming) { return _this.setState({ isRenaming: renaming }); }, renaming: this.state.isRenaming }),
45937
45972
  !draggingSelf && this.props.isDragOver && this.props.dragOverLocation == _globalState__WEBPACK_IMPORTED_MODULE_4__["DragOverLocation"].CENTER && control instanceof _babylonjs_gui_2D_controls_container__WEBPACK_IMPORTED_MODULE_5__["Container"] && (react__WEBPACK_IMPORTED_MODULE_3__["createElement"](react__WEBPACK_IMPORTED_MODULE_3__["Fragment"], null,
45938
45973
  react__WEBPACK_IMPORTED_MODULE_3__["createElement"]("div", { className: "makeChild icon", onClick: function () { return _this.highlight(); }, title: "Make Child" },
@@ -46706,6 +46741,112 @@ var TreeItemSelectableComponent = /** @class */ (function (_super) {
46706
46741
 
46707
46742
 
46708
46743
 
46744
+ /***/ }),
46745
+
46746
+ /***/ "./controlTypes.ts":
46747
+ /*!*************************!*\
46748
+ !*** ./controlTypes.ts ***!
46749
+ \*************************/
46750
+ /*! exports provided: ControlTypes */
46751
+ /***/ (function(module, __webpack_exports__, __webpack_require__) {
46752
+
46753
+ "use strict";
46754
+ __webpack_require__.r(__webpack_exports__);
46755
+ /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ControlTypes", function() { return ControlTypes; });
46756
+ var rectangleIcon = __webpack_require__(/*! ../public/imgs/rectangleIcon.svg */ "../public/imgs/rectangleIcon.svg");
46757
+ var ellipseIcon = __webpack_require__(/*! ../public/imgs/ellipseIcon.svg */ "../public/imgs/ellipseIcon.svg");
46758
+ var gridIcon = __webpack_require__(/*! ../public/imgs/gridIcon.svg */ "../public/imgs/gridIcon.svg");
46759
+ var stackPanelIcon = __webpack_require__(/*! ../public/imgs/stackPanelIcon.svg */ "../public/imgs/stackPanelIcon.svg");
46760
+ var textBoxIcon = __webpack_require__(/*! ../public/imgs/textBoxIcon.svg */ "../public/imgs/textBoxIcon.svg");
46761
+ var sliderIcon = __webpack_require__(/*! ../public/imgs/sliderIcon.svg */ "../public/imgs/sliderIcon.svg");
46762
+ var imageBasedSliderIcon = __webpack_require__(/*! ../public/imgs/imageSliderIcon.svg */ "../public/imgs/imageSliderIcon.svg");
46763
+ var buttonIcon = __webpack_require__(/*! ../public/imgs/buttonIcon.svg */ "../public/imgs/buttonIcon.svg");
46764
+ var passwordFieldIcon = __webpack_require__(/*! ../public/imgs/passwordFieldIcon.svg */ "../public/imgs/passwordFieldIcon.svg");
46765
+ var checkboxIcon = __webpack_require__(/*! ../public/imgs/checkboxIcon.svg */ "../public/imgs/checkboxIcon.svg");
46766
+ var imageIcon = __webpack_require__(/*! ../public/imgs/imageIcon.svg */ "../public/imgs/imageIcon.svg");
46767
+ var keyboardIcon = __webpack_require__(/*! ../public/imgs/keyboardIcon.svg */ "../public/imgs/keyboardIcon.svg");
46768
+ var inputFieldIcon = __webpack_require__(/*! ../public/imgs/inputFieldIcon.svg */ "../public/imgs/inputFieldIcon.svg");
46769
+ var lineIcon = __webpack_require__(/*! ../public/imgs/lineIcon.svg */ "../public/imgs/lineIcon.svg");
46770
+ var displaygridIcon = __webpack_require__(/*! ../public/imgs/displaygridIcon.svg */ "../public/imgs/displaygridIcon.svg");
46771
+ var colorPickerIcon = __webpack_require__(/*! ../public/imgs/colorPickerIcon.svg */ "../public/imgs/colorPickerIcon.svg");
46772
+ var scrollbarIcon = __webpack_require__(/*! ../public/imgs/scrollbarIcon.svg */ "../public/imgs/scrollbarIcon.svg");
46773
+ var radioButtonIcon = __webpack_require__(/*! ../public/imgs/radioButtonIcon.svg */ "../public/imgs/radioButtonIcon.svg");
46774
+ var ControlTypes = [
46775
+ {
46776
+ className: "Rectangle",
46777
+ icon: rectangleIcon,
46778
+ },
46779
+ {
46780
+ className: "Ellipse",
46781
+ icon: ellipseIcon,
46782
+ },
46783
+ {
46784
+ className: "StackPanel",
46785
+ icon: stackPanelIcon,
46786
+ },
46787
+ {
46788
+ className: "Grid",
46789
+ icon: gridIcon,
46790
+ },
46791
+ {
46792
+ className: "ScrollViewer",
46793
+ icon: scrollbarIcon,
46794
+ },
46795
+ {
46796
+ className: "Line",
46797
+ icon: lineIcon,
46798
+ },
46799
+ {
46800
+ className: "Text",
46801
+ icon: textBoxIcon,
46802
+ },
46803
+ {
46804
+ className: "InputText",
46805
+ icon: inputFieldIcon,
46806
+ },
46807
+ {
46808
+ className: "InputPassword",
46809
+ icon: passwordFieldIcon,
46810
+ },
46811
+ {
46812
+ className: "Image",
46813
+ icon: imageIcon,
46814
+ },
46815
+ {
46816
+ className: "DisplayGrid",
46817
+ icon: displaygridIcon,
46818
+ },
46819
+ {
46820
+ className: "TextButton",
46821
+ icon: buttonIcon,
46822
+ },
46823
+ {
46824
+ className: "Checkbox",
46825
+ icon: checkboxIcon,
46826
+ },
46827
+ {
46828
+ className: "RadioButton",
46829
+ icon: radioButtonIcon,
46830
+ },
46831
+ {
46832
+ className: "Slider",
46833
+ icon: sliderIcon,
46834
+ },
46835
+ {
46836
+ className: "ImageBasedSlider",
46837
+ icon: imageBasedSliderIcon,
46838
+ },
46839
+ {
46840
+ className: "VirtualKeyboard",
46841
+ icon: keyboardIcon,
46842
+ },
46843
+ {
46844
+ className: "ColorPicker",
46845
+ icon: colorPickerIcon,
46846
+ },
46847
+ ];
46848
+
46849
+
46709
46850
  /***/ }),
46710
46851
 
46711
46852
  /***/ "./diagram/artBoard.tsx":
@@ -47621,10 +47762,11 @@ var WorkbenchComponent = /** @class */ (function (_super) {
47621
47762
  _this.props.globalState.onPointerUpObservable.notifyObservers(null);
47622
47763
  };
47623
47764
  _this.isUp = true;
47765
+ var globalState = props.globalState;
47624
47766
  _this._rootContainer = react__WEBPACK_IMPORTED_MODULE_1__["createRef"]();
47625
47767
  _this._responsive = _babylonjs_core_Maths_math_vector__WEBPACK_IMPORTED_MODULE_4__["DataStorage"].ReadBoolean("Responsive", true);
47626
- props.globalState.onSelectionChangedObservable.add(function () { return _this.updateNodeOutlines(); });
47627
- props.globalState.onPanObservable.add(function () {
47768
+ globalState.onSelectionChangedObservable.add(function () { return _this.updateNodeOutlines(); });
47769
+ globalState.onPanObservable.add(function () {
47628
47770
  _this._forcePanning = !_this._forcePanning;
47629
47771
  _this._forceSelecting = false;
47630
47772
  _this._forceZooming = false;
@@ -47635,13 +47777,13 @@ var WorkbenchComponent = /** @class */ (function (_super) {
47635
47777
  _this._canvas.style.cursor = "grab";
47636
47778
  }
47637
47779
  });
47638
- props.globalState.onSelectionButtonObservable.add(function () {
47780
+ globalState.onSelectionButtonObservable.add(function () {
47639
47781
  _this._forceSelecting = !_this._forceSelecting;
47640
47782
  _this._forcePanning = false;
47641
47783
  _this._forceZooming = false;
47642
47784
  _this._canvas.style.cursor = "default";
47643
47785
  });
47644
- props.globalState.onZoomObservable.add(function () {
47786
+ globalState.onZoomObservable.add(function () {
47645
47787
  _this._forceZooming = !_this._forceZooming;
47646
47788
  _this._forcePanning = false;
47647
47789
  _this._forceSelecting = false;
@@ -47652,37 +47794,38 @@ var WorkbenchComponent = /** @class */ (function (_super) {
47652
47794
  _this._canvas.style.cursor = "zoom-in";
47653
47795
  }
47654
47796
  });
47655
- props.globalState.onFitToWindowObservable.add(function () {
47797
+ globalState.onFitToWindowObservable.add(function () {
47656
47798
  _this._panningOffset = new _babylonjs_core_Maths_math_vector__WEBPACK_IMPORTED_MODULE_4__["Vector2"](0, 0);
47657
47799
  var xFactor = _this._engine.getRenderWidth() / _this.guiSize.width;
47658
47800
  var yFactor = _this._engine.getRenderHeight() / _this.guiSize.height;
47659
47801
  _this._zoomFactor = Math.min(xFactor, yFactor) * 0.9;
47660
47802
  });
47661
- props.globalState.onOutlineChangedObservable.add(function () {
47803
+ globalState.onOutlineChangedObservable.add(function () {
47662
47804
  _this.updateNodeOutlines();
47663
47805
  });
47664
- props.globalState.onSelectionChangedObservable.add(function () {
47806
+ globalState.onSelectionChangedObservable.add(function () {
47665
47807
  _this.updateNodeOutlines();
47666
47808
  });
47667
- props.globalState.onParentingChangeObservable.add(function (control) {
47809
+ globalState.onParentingChangeObservable.add(function (control) {
47668
47810
  _this.parent(control);
47669
47811
  });
47670
- props.globalState.onResponsiveChangeObservable.add(function (value) {
47812
+ globalState.onResponsiveChangeObservable.add(function (value) {
47671
47813
  _this._responsive = value;
47672
47814
  });
47673
- _this.props.globalState.hostDocument.addEventListener("keyup", _this.keyEvent, false);
47815
+ globalState.hostDocument.addEventListener("keyup", _this.keyEvent, false);
47674
47816
  // Hotkey shortcuts
47675
- _this.props.globalState.hostDocument.addEventListener("keydown", _this.keyEvent, false);
47676
- _this.props.globalState.hostDocument.defaultView.addEventListener("blur", _this.blurEvent, false);
47677
- props.globalState.onWindowResizeObservable.add(function () {
47678
- _this.props.globalState.onGizmoUpdateRequireObservable.notifyObservers();
47679
- _this.props.globalState.onArtBoardUpdateRequiredObservable.notifyObservers();
47817
+ globalState.hostDocument.addEventListener("keydown", _this.keyEvent, false);
47818
+ globalState.hostDocument.defaultView.addEventListener("blur", _this.blurEvent, false);
47819
+ globalState.onWindowResizeObservable.add(function () {
47820
+ globalState.onGizmoUpdateRequireObservable.notifyObservers();
47821
+ globalState.onArtBoardUpdateRequiredObservable.notifyObservers();
47680
47822
  _this._engine.resize();
47681
47823
  });
47682
- props.globalState.onCopyObservable.add(function (copyFn) { return _this.copyToClipboard(copyFn); });
47683
- props.globalState.onCutObservable.add(function (copyFn) { return _this.cutToClipboard(copyFn); });
47684
- props.globalState.onPasteObservable.add(function (content) { return _this.pasteFromClipboard(content); });
47685
- _this.props.globalState.workbench = _this;
47824
+ globalState.onCopyObservable.add(function (copyFn) { return _this.copyToClipboard(copyFn); });
47825
+ globalState.onCutObservable.add(function (copyFn) { return _this.cutToClipboard(copyFn); });
47826
+ globalState.onPasteObservable.add(function (content) { return _this.pasteFromClipboard(content); });
47827
+ globalState.workbench = _this;
47828
+ globalState.onResizeObservable.notifyObservers(_this._guiSize);
47686
47829
  return _this;
47687
47830
  }
47688
47831
  Object.defineProperty(WorkbenchComponent.prototype, "visibleRegionContainer", {
@@ -48182,6 +48325,7 @@ var WorkbenchComponent = /** @class */ (function (_super) {
48182
48325
  else if (this._constraintDirection === ConstraintDirection.Y) {
48183
48326
  newX = 0;
48184
48327
  }
48328
+ var referenceAxis = new _babylonjs_core_Maths_math_vector__WEBPACK_IMPORTED_MODULE_4__["Vector2"](newX, newY);
48185
48329
  if (guiControl.typeName === "Line") {
48186
48330
  var line = guiControl;
48187
48331
  var x1 = line.x1.substr(0, line.x1.length - 2); //removing the 'px'
@@ -48194,8 +48338,21 @@ var WorkbenchComponent = /** @class */ (function (_super) {
48194
48338
  line.y2 = Number(y2) + newY;
48195
48339
  return true;
48196
48340
  }
48197
- guiControl.leftInPixels += newX;
48198
- guiControl.topInPixels += newY;
48341
+ var totalRotation = 0;
48342
+ var currentControl = guiControl;
48343
+ while (currentControl) {
48344
+ totalRotation += currentControl.rotation;
48345
+ currentControl = currentControl.parent;
48346
+ }
48347
+ var rotatedReferenceAxis = new _babylonjs_core_Maths_math_vector__WEBPACK_IMPORTED_MODULE_4__["Vector2"](0, 0);
48348
+ // Rotate the reference axis by the total rotation of the control
48349
+ var sinR = Math.sin(-totalRotation);
48350
+ var cosR = Math.cos(-totalRotation);
48351
+ rotatedReferenceAxis.x = cosR * referenceAxis.x - sinR * referenceAxis.y;
48352
+ rotatedReferenceAxis.y = sinR * referenceAxis.x + cosR * referenceAxis.y;
48353
+ // Apply the amount of change
48354
+ guiControl.leftInPixels += rotatedReferenceAxis.x;
48355
+ guiControl.topInPixels += rotatedReferenceAxis.y;
48199
48356
  //convert to percentage
48200
48357
  if (this._responsive) {
48201
48358
  _coordinateHelper__WEBPACK_IMPORTED_MODULE_6__["CoordinateHelper"].convertToPercentage(guiControl, ["left", "top"]);
@@ -49808,6 +49965,17 @@ module.exports = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' w
49808
49965
 
49809
49966
  /***/ }),
49810
49967
 
49968
+ /***/ "./sharedUiComponents/imgs/fontWeightIcon.svg":
49969
+ /*!****************************************************!*\
49970
+ !*** ./sharedUiComponents/imgs/fontWeightIcon.svg ***!
49971
+ \****************************************************/
49972
+ /*! no static exports found */
49973
+ /***/ (function(module, exports) {
49974
+
49975
+ module.exports = "data:image/svg+xml,%3Csvg id='icons' xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23333;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M24.35,20.45,20.22,8.81l0-.12a1.07,1.07,0,0,0-1.94.15L14.77,18.6,11.2,8.54l0-.09a.61.61,0,0,0-1.1.09L5.62,21.05a.61.61,0,0,0,1.11.48l0-.07,1.29-3.63h5.16l1.29,3.63,0,.07a.61.61,0,0,0,.53.33h0a1.07,1.07,0,0,0,1-.6l1.12-3.14h4.09l1.08,3.07.05.1a1.07,1.07,0,0,0,.95.57,1.12,1.12,0,0,0,.35-.06A1.05,1.05,0,0,0,24.35,20.45ZM8.48,16.61l2.15-6.06,2.15,6.06ZM18,16l1.28-3.63L20.52,16Z'/%3E%3C/svg%3E"
49976
+
49977
+ /***/ }),
49978
+
49811
49979
  /***/ "./sharedUiComponents/imgs/gridColumnIconDark.svg":
49812
49980
  /*!********************************************************!*\
49813
49981
  !*** ./sharedUiComponents/imgs/gridColumnIconDark.svg ***!
@@ -49874,6 +50042,17 @@ module.exports = "data:image/svg+xml,%3Csvg id='icons' xmlns='http://www.w3.org/
49874
50042
 
49875
50043
  /***/ }),
49876
50044
 
50045
+ /***/ "./sharedUiComponents/imgs/pivotIcon.svg":
50046
+ /*!***********************************************!*\
50047
+ !*** ./sharedUiComponents/imgs/pivotIcon.svg ***!
50048
+ \***********************************************/
50049
+ /*! no static exports found */
50050
+ /***/ (function(module, exports) {
50051
+
50052
+ module.exports = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3E%3Cpath d='M15,6.9A8.1,8.1,0,1,0,23.1,15,8.1,8.1,0,0,0,15,6.9Zm6.86,7.49H15.63V8.14A6.89,6.89,0,0,1,21.86,14.39ZM14.41,8.14v6.25H8.14A6.89,6.89,0,0,1,14.41,8.14ZM8.14,15.61h6.27v6.25A6.89,6.89,0,0,1,8.14,15.61Zm7.49,6.25V15.61h6.23A6.89,6.89,0,0,1,15.63,21.86Z' style='fill:%23333'/%3E%3C/svg%3E"
50053
+
50054
+ /***/ }),
50055
+
49877
50056
  /***/ "./sharedUiComponents/imgs/positionIcon.svg":
49878
50057
  /*!**************************************************!*\
49879
50058
  !*** ./sharedUiComponents/imgs/positionIcon.svg ***!
@@ -50083,6 +50262,39 @@ module.exports = "data:image/svg+xml,%3Csvg id='icons' xmlns='http://www.w3.org/
50083
50262
 
50084
50263
  /***/ }),
50085
50264
 
50265
+ /***/ "./sharedUiComponents/imgs/toggleMixedIcon.svg":
50266
+ /*!*****************************************************!*\
50267
+ !*** ./sharedUiComponents/imgs/toggleMixedIcon.svg ***!
50268
+ \*****************************************************/
50269
+ /*! no static exports found */
50270
+ /***/ (function(module, exports) {
50271
+
50272
+ module.exports = "data:image/svg+xml,%3Csvg id='icons' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23333;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M25,25H15a5,5,0,0,1,0-10H25a5,5,0,0,1,0,10ZM15,16.5a3.5,3.5,0,0,0,0,7H25a3.5,3.5,0,0,0,0-7Z'/%3E%3Crect class='cls-1' x='16.03' y='19.25' width='7.94' height='1.5' rx='0.75'/%3E%3C/svg%3E"
50273
+
50274
+ /***/ }),
50275
+
50276
+ /***/ "./sharedUiComponents/imgs/toggleOffIcon.svg":
50277
+ /*!***************************************************!*\
50278
+ !*** ./sharedUiComponents/imgs/toggleOffIcon.svg ***!
50279
+ \***************************************************/
50280
+ /*! no static exports found */
50281
+ /***/ (function(module, exports) {
50282
+
50283
+ module.exports = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Cpath d='M15.25,22.5a2.5,2.5,0,1,1,2.5-2.5A2.5,2.5,0,0,1,15.25,22.5Z' style='fill:%23333'/%3E%3Cpath d='M25,25H15a5,5,0,0,1,0-10H25a5,5,0,0,1,0,10ZM15,16.5a3.5,3.5,0,0,0,0,7H25a3.5,3.5,0,0,0,0-7Z' style='fill:%23333'/%3E%3C/svg%3E"
50284
+
50285
+ /***/ }),
50286
+
50287
+ /***/ "./sharedUiComponents/imgs/toggleOnIcon.svg":
50288
+ /*!**************************************************!*\
50289
+ !*** ./sharedUiComponents/imgs/toggleOnIcon.svg ***!
50290
+ \**************************************************/
50291
+ /*! no static exports found */
50292
+ /***/ (function(module, exports) {
50293
+
50294
+ module.exports = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Cpath d='M24.75,22.5a2.5,2.5,0,1,0-2.5-2.5A2.5,2.5,0,0,0,24.75,22.5Z' style='fill:%23333'/%3E%3Cpath d='M10,20a5,5,0,0,1,5-5H25a5,5,0,0,1,0,10H15A5,5,0,0,1,10,20Zm5-3.5a3.5,3.5,0,0,0,0,7H25a3.5,3.5,0,0,0,0-7Z' style='fill:%23333'/%3E%3C/svg%3E"
50295
+
50296
+ /***/ }),
50297
+
50086
50298
  /***/ "./sharedUiComponents/imgs/vAlignBottomIcon.svg":
50087
50299
  /*!******************************************************!*\
50088
50300
  !*** ./sharedUiComponents/imgs/vAlignBottomIcon.svg ***!
@@ -50158,39 +50370,6 @@ module.exports = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' w
50158
50370
 
50159
50371
  module.exports = "data:image/svg+xml,%3Csvg id='icons' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23333;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M18.08,6.79a1.85,1.85,0,0,1,1.85,1.85V21.36a1.85,1.85,0,0,1-1.85,1.85H11.92a1.85,1.85,0,0,1-1.85-1.85V8.64a1.85,1.85,0,0,1,1.85-1.85Zm0,1.23H11.92a.61.61,0,0,0-.61.62V21.36a.61.61,0,0,0,.61.62h6.16a.61.61,0,0,0,.61-.62V8.64A.61.61,0,0,0,18.08,8Zm-.8,8.18a.62.62,0,0,1,.07.8l-.06.07L15.44,19a.62.62,0,0,1-.81.06L14.56,19l-1.85-1.89a.61.61,0,0,1,.81-.92l.07.06L15,17.65l1.41-1.44A.62.62,0,0,1,17.28,16.2Zm-1.84-5.12L17.29,13a.64.64,0,0,1,0,.88.63.63,0,0,1-.87,0L15,12.39l-1.41,1.44a.62.62,0,1,1-.88-.87l1.85-1.88A.61.61,0,0,1,15.44,11.08Z'/%3E%3C/svg%3E"
50160
50372
 
50161
- /***/ }),
50162
-
50163
- /***/ "./sharedUiComponents/lines/buttonLineComponent.tsx":
50164
- /*!**********************************************************!*\
50165
- !*** ./sharedUiComponents/lines/buttonLineComponent.tsx ***!
50166
- \**********************************************************/
50167
- /*! exports provided: ButtonLineComponent */
50168
- /***/ (function(module, __webpack_exports__, __webpack_require__) {
50169
-
50170
- "use strict";
50171
- __webpack_require__.r(__webpack_exports__);
50172
- /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ButtonLineComponent", function() { return ButtonLineComponent; });
50173
- /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../../../node_modules/tslib/tslib.es6.js");
50174
- /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
50175
- /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
50176
-
50177
-
50178
- var ButtonLineComponent = /** @class */ (function (_super) {
50179
- Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(ButtonLineComponent, _super);
50180
- function ButtonLineComponent(props) {
50181
- return _super.call(this, props) || this;
50182
- }
50183
- ButtonLineComponent.prototype.render = function () {
50184
- var _this = this;
50185
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "buttonLine" },
50186
- this.props.icon && react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }),
50187
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("button", { onClick: function () { return _this.props.onClick(); } }, this.props.label)));
50188
- };
50189
- return ButtonLineComponent;
50190
- }(react__WEBPACK_IMPORTED_MODULE_1__["Component"]));
50191
-
50192
-
50193
-
50194
50373
  /***/ }),
50195
50374
 
50196
50375
  /***/ "./sharedUiComponents/lines/checkBoxLineComponent.tsx":
@@ -50212,12 +50391,14 @@ __webpack_require__.r(__webpack_exports__);
50212
50391
 
50213
50392
 
50214
50393
 
50394
+ var toggleOnIcon = __webpack_require__(/*! ../imgs/toggleOnIcon.svg */ "./sharedUiComponents/imgs/toggleOnIcon.svg");
50395
+ var toggleMixedIcon = __webpack_require__(/*! ../imgs/toggleMixedIcon.svg */ "./sharedUiComponents/imgs/toggleMixedIcon.svg");
50396
+ var toggleOffIcon = __webpack_require__(/*! ../imgs/toggleOffIcon.svg */ "./sharedUiComponents/imgs/toggleOffIcon.svg");
50215
50397
  var CheckBoxLineComponent = /** @class */ (function (_super) {
50216
50398
  Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(CheckBoxLineComponent, _super);
50217
50399
  function CheckBoxLineComponent(props) {
50218
50400
  var _this = _super.call(this, props) || this;
50219
50401
  _this._localChange = false;
50220
- _this._uniqueId = CheckBoxLineComponent._UniqueIdSeed++;
50221
50402
  if (_this.props.isSelected) {
50222
50403
  _this.state = { isSelected: _this.props.isSelected(), isConflict: false };
50223
50404
  }
@@ -50230,18 +50411,18 @@ var CheckBoxLineComponent = /** @class */ (function (_super) {
50230
50411
  return _this;
50231
50412
  }
50232
50413
  CheckBoxLineComponent.prototype.shouldComponentUpdate = function (nextProps, nextState) {
50233
- var currentState;
50414
+ var selected;
50234
50415
  if (nextProps.isSelected) {
50235
- currentState = nextProps.isSelected();
50416
+ selected = nextProps.isSelected();
50236
50417
  }
50237
50418
  else {
50238
- currentState = nextProps.target[nextProps.propertyName] === true;
50419
+ selected = nextProps.target[nextProps.propertyName] === true;
50239
50420
  if (nextProps.target[nextProps.propertyName] === _targetsProxy__WEBPACK_IMPORTED_MODULE_3__["conflictingValuesPlaceholder"]) {
50240
50421
  nextState.isConflict = true;
50241
50422
  }
50242
50423
  }
50243
- if (currentState !== nextState.isSelected || this._localChange) {
50244
- nextState.isSelected = currentState;
50424
+ if (selected !== nextState.isSelected || this._localChange) {
50425
+ nextState.isSelected = selected;
50245
50426
  this._localChange = false;
50246
50427
  return true;
50247
50428
  }
@@ -50275,16 +50456,17 @@ var CheckBoxLineComponent = /** @class */ (function (_super) {
50275
50456
  };
50276
50457
  CheckBoxLineComponent.prototype.render = function () {
50277
50458
  var _this = this;
50459
+ var icon = this.state.isConflict ? toggleMixedIcon : (this.state.isSelected) ? toggleOnIcon : toggleOffIcon;
50278
50460
  return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "checkBoxLine" },
50279
50461
  this.props.icon && react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }),
50280
50462
  this.props.label &&
50281
50463
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "label", title: this.props.iconLabel }, this.props.label),
50282
50464
  this.props.faIcons && react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_2__["FontAwesomeIcon"], { className: "cbx ".concat(this.props.disabled ? "disabled" : ""), icon: this.state.isSelected ? this.props.faIcons.enabled : this.props.faIcons.disabled, onClick: function () { return !_this.props.disabled && _this.onChange(); } }),
50283
50465
  !this.props.faIcons && react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "checkBox" },
50284
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("input", { type: "checkbox", id: "checkbox" + this._uniqueId, className: "cbx hidden ".concat(this.state.isConflict ? "conflict" : ""), checked: this.state.isSelected, onChange: function () { return _this.onChange(); }, disabled: !!this.props.disabled }),
50285
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("label", { htmlFor: "checkbox" + this._uniqueId, className: "lbl".concat(!!this.props.disabled ? " disabled" : "") }))));
50466
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("label", { className: "container lbl".concat(!!this.props.disabled ? " disabled" : "", " ").concat(this.state.isSelected ? 'checked' : '') },
50467
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("input", { type: "checkbox", className: "cbx hidden ".concat(this.state.isConflict ? "conflict" : ""), checked: this.state.isSelected, onChange: function () { return _this.onChange(); }, disabled: !!this.props.disabled }),
50468
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("img", { className: "icon", src: icon, alt: this.props.label })))));
50286
50469
  };
50287
- CheckBoxLineComponent._UniqueIdSeed = 0;
50288
50470
  return CheckBoxLineComponent;
50289
50471
  }(react__WEBPACK_IMPORTED_MODULE_1__["Component"]));
50290
50472
 
@@ -50404,7 +50586,7 @@ var ColorLineComponent = /** @class */ (function (_super) {
50404
50586
  return this.convertToColor(property);
50405
50587
  }
50406
50588
  else {
50407
- return property;
50589
+ return property.clone();
50408
50590
  }
50409
50591
  };
50410
50592
  ColorLineComponent.prototype.getValueAsString = function (props) {
@@ -50535,7 +50717,7 @@ var ColorLineComponent = /** @class */ (function (_super) {
50535
50717
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_colorPickerComponent__WEBPACK_IMPORTED_MODULE_6__["ColorPickerLineComponent"], { linearHint: this.props.isLinear, value: this.props.disableAlpha ? this.toColor3(this.state.color) : this.state.color, onColorChanged: function (color) {
50536
50718
  _this.setColor(_this.convertToColor(color));
50537
50719
  } })),
50538
- this.props.icon && this.props.lockObject && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__["TextInputLineComponent"], { lockObject: this.props.lockObject, label: "", target: this, propertyName: "colorString", onChange: function (newValue) {
50720
+ this.props.lockObject && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_textInputLineComponent__WEBPACK_IMPORTED_MODULE_7__["TextInputLineComponent"], { lockObject: this.props.lockObject, label: "", target: this, propertyName: "colorString", onChange: function (newValue) {
50539
50721
  _this.setColorFromString(newValue);
50540
50722
  }, onPropertyChangedObservable: this.props.onPropertyChangedObservable })),
50541
50723
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "copy hoverIcon", onClick: function () { return _this.copyToClipboard(); }, title: "Copy to clipboard" },
@@ -50863,6 +51045,36 @@ var FloatLineComponent = /** @class */ (function (_super) {
50863
51045
 
50864
51046
 
50865
51047
 
51048
+ /***/ }),
51049
+
51050
+ /***/ "./sharedUiComponents/lines/iconComponent.tsx":
51051
+ /*!****************************************************!*\
51052
+ !*** ./sharedUiComponents/lines/iconComponent.tsx ***!
51053
+ \****************************************************/
51054
+ /*! exports provided: IconComponent */
51055
+ /***/ (function(module, __webpack_exports__, __webpack_require__) {
51056
+
51057
+ "use strict";
51058
+ __webpack_require__.r(__webpack_exports__);
51059
+ /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "IconComponent", function() { return IconComponent; });
51060
+ /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "../../../../node_modules/tslib/tslib.es6.js");
51061
+ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
51062
+ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
51063
+
51064
+
51065
+ var IconComponent = /** @class */ (function (_super) {
51066
+ Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(IconComponent, _super);
51067
+ function IconComponent() {
51068
+ return _super !== null && _super.apply(this, arguments) || this;
51069
+ }
51070
+ IconComponent.prototype.render = function () {
51071
+ return react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("img", { src: this.props.icon, title: this.props.label, alt: this.props.label, color: "black", className: "icon", onDragStart: function (evt) { return evt.preventDefault(); } });
51072
+ };
51073
+ return IconComponent;
51074
+ }(react__WEBPACK_IMPORTED_MODULE_1__["Component"]));
51075
+
51076
+
51077
+
50866
51078
  /***/ }),
50867
51079
 
50868
51080
  /***/ "./sharedUiComponents/lines/inputArrowsComponent.tsx":
@@ -50888,7 +51100,7 @@ var InputArrowsComponent = /** @class */ (function (_super) {
50888
51100
  var _this = _super !== null && _super.apply(this, arguments) || this;
50889
51101
  _this._arrowsRef = react__WEBPACK_IMPORTED_MODULE_1__["createRef"]();
50890
51102
  _this._drag = function (event) {
50891
- _this.props.incrementValue(event.movementY);
51103
+ _this.props.incrementValue(-event.movementY);
50892
51104
  };
50893
51105
  _this._releaseListener = function () {
50894
51106
  var _a, _b;
@@ -51437,11 +51649,11 @@ var TextInputLineComponent = /** @class */ (function (_super) {
51437
51649
  TextInputLineComponent.prototype.onKeyDown = function (event) {
51438
51650
  if (this.props.arrows) {
51439
51651
  if (event.key === "ArrowUp") {
51440
- this.incrementValue(-1);
51652
+ this.incrementValue(1);
51441
51653
  event.preventDefault();
51442
51654
  }
51443
51655
  if (event.key === "ArrowDown") {
51444
- this.incrementValue(1);
51656
+ this.incrementValue(-1);
51445
51657
  event.preventDefault();
51446
51658
  }
51447
51659
  }
@@ -51452,7 +51664,7 @@ var TextInputLineComponent = /** @class */ (function (_super) {
51452
51664
  var placeholder = this.state.value === _targetsProxy__WEBPACK_IMPORTED_MODULE_2__["conflictingValuesPlaceholder"] ? _targetsProxy__WEBPACK_IMPORTED_MODULE_2__["conflictingValuesPlaceholder"] : "";
51453
51665
  return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: this.props.unit !== undefined ? "textInputLine withUnits" : "textInputLine" },
51454
51666
  this.props.icon && react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, color: "black", className: "icon" }),
51455
- (!this.props.icon || (this.props.icon && this.props.label != "")) && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "label", title: this.props.label }, this.props.label)),
51667
+ (this.props.label !== undefined) && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "label", title: this.props.label }, this.props.label)),
51456
51668
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "value".concat(this.props.noUnderline === true ? " noUnderline" : "").concat(this.props.arrows ? " hasArrows" : "").concat(this.state.dragging ? " dragging" : "") },
51457
51669
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("input", { value: value, onBlur: function () {
51458
51670
  _this.props.lockObject.lock = false;
@@ -51792,6 +52004,8 @@ __webpack_require__.r(__webpack_exports__);
51792
52004
  /* harmony import */ var _components_commandBarComponent__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./components/commandBarComponent */ "./components/commandBarComponent.tsx");
51793
52005
  /* harmony import */ var _diagram_guiGizmoWrapper__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./diagram/guiGizmoWrapper */ "./diagram/guiGizmoWrapper.tsx");
51794
52006
  /* harmony import */ var _diagram_artBoard__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./diagram/artBoard */ "./diagram/artBoard.tsx");
52007
+ /* harmony import */ var _controlTypes__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./controlTypes */ "./controlTypes.ts");
52008
+
51795
52009
 
51796
52010
 
51797
52011
 
@@ -51807,24 +52021,6 @@ __webpack_require__.r(__webpack_exports__);
51807
52021
 
51808
52022
  __webpack_require__(/*! ./main.scss */ "./main.scss");
51809
52023
  __webpack_require__(/*! ./scss/header.scss */ "./scss/header.scss");
51810
- var rectangleIcon = __webpack_require__(/*! ../public/imgs/rectangleIcon.svg */ "../public/imgs/rectangleIcon.svg");
51811
- var ellipseIcon = __webpack_require__(/*! ../public/imgs/ellipseIcon.svg */ "../public/imgs/ellipseIcon.svg");
51812
- var gridIcon = __webpack_require__(/*! ../public/imgs/gridIcon.svg */ "../public/imgs/gridIcon.svg");
51813
- var stackPanelIcon = __webpack_require__(/*! ../public/imgs/stackPanelIcon.svg */ "../public/imgs/stackPanelIcon.svg");
51814
- var textBoxIcon = __webpack_require__(/*! ../public/imgs/textBoxIcon.svg */ "../public/imgs/textBoxIcon.svg");
51815
- var sliderIcon = __webpack_require__(/*! ../public/imgs/sliderIcon.svg */ "../public/imgs/sliderIcon.svg");
51816
- var imageBasedSliderIcon = __webpack_require__(/*! ../public/imgs/imageSliderIcon.svg */ "../public/imgs/imageSliderIcon.svg");
51817
- var buttonIcon = __webpack_require__(/*! ../public/imgs/buttonIcon.svg */ "../public/imgs/buttonIcon.svg");
51818
- var passwordFieldIcon = __webpack_require__(/*! ../public/imgs/passwordFieldIcon.svg */ "../public/imgs/passwordFieldIcon.svg");
51819
- var checkboxIcon = __webpack_require__(/*! ../public/imgs/checkboxIcon.svg */ "../public/imgs/checkboxIcon.svg");
51820
- var imageIcon = __webpack_require__(/*! ../public/imgs/imageIcon.svg */ "../public/imgs/imageIcon.svg");
51821
- var keyboardIcon = __webpack_require__(/*! ../public/imgs/keyboardIcon.svg */ "../public/imgs/keyboardIcon.svg");
51822
- var inputFieldIcon = __webpack_require__(/*! ../public/imgs/inputFieldIcon.svg */ "../public/imgs/inputFieldIcon.svg");
51823
- var lineIcon = __webpack_require__(/*! ../public/imgs/lineIcon.svg */ "../public/imgs/lineIcon.svg");
51824
- var displaygridIcon = __webpack_require__(/*! ../public/imgs/displaygridIcon.svg */ "../public/imgs/displaygridIcon.svg");
51825
- var colorPickerIcon = __webpack_require__(/*! ../public/imgs/colorPickerIcon.svg */ "../public/imgs/colorPickerIcon.svg");
51826
- var scrollbarIcon = __webpack_require__(/*! ../public/imgs/scrollbarIcon.svg */ "../public/imgs/scrollbarIcon.svg");
51827
- var radioButtonIcon = __webpack_require__(/*! ../public/imgs/radioButtonIcon.svg */ "../public/imgs/radioButtonIcon.svg");
51828
52024
  var WorkbenchEditor = /** @class */ (function (_super) {
51829
52025
  Object(tslib__WEBPACK_IMPORTED_MODULE_0__["__extends"])(WorkbenchEditor, _super);
51830
52026
  function WorkbenchEditor(props) {
@@ -51907,6 +52103,7 @@ var WorkbenchEditor = /** @class */ (function (_super) {
51907
52103
  }
51908
52104
  }
51909
52105
  };
52106
+ _this._rootRef = react__WEBPACK_IMPORTED_MODULE_1__["createRef"]();
51910
52107
  _this.state = {
51911
52108
  showPreviewPopUp: false,
51912
52109
  };
@@ -51922,7 +52119,6 @@ var WorkbenchEditor = /** @class */ (function (_super) {
51922
52119
  evt.preventDefault();
51923
52120
  }
51924
52121
  }, false);
51925
- _this.createItems();
51926
52122
  _this.props.globalState.onBackgroundColorChangeObservable.add(function () { return _this.forceUpdate(); });
51927
52123
  _this.props.globalState.onDropObservable.add(function () {
51928
52124
  if (_this._draggedItem != null) {
@@ -51946,7 +52142,6 @@ var WorkbenchEditor = /** @class */ (function (_super) {
51946
52142
  (_a = this.props.globalState.hostDocument.querySelector(".wait-screen")) === null || _a === void 0 ? void 0 : _a.classList.add("hidden");
51947
52143
  };
51948
52144
  WorkbenchEditor.prototype.onPointerDown = function (evt) {
51949
- this._startX = evt.clientX;
51950
52145
  this._moveInProgress = true;
51951
52146
  evt.currentTarget.setPointerCapture(evt.pointerId);
51952
52147
  };
@@ -51959,25 +52154,21 @@ var WorkbenchEditor = /** @class */ (function (_super) {
51959
52154
  if (!this._moveInProgress) {
51960
52155
  return;
51961
52156
  }
51962
- var deltaX = evt.clientX - this._startX;
51963
52157
  var rootElement = evt.currentTarget.ownerDocument.getElementById("gui-editor-workbench-root");
51964
52158
  var maxWidth = this.props.globalState.hostWindow.innerWidth - this._toolBarIconSize - 8;
51965
52159
  if (forLeft) {
51966
- this._leftWidth += deltaX;
51967
- this._leftWidth = Math.max(150, Math.min(maxWidth - this._rightWidth, this._leftWidth));
52160
+ this._leftWidth = Math.max(150, Math.min(maxWidth - this._rightWidth, evt.clientX - this._rootRef.current.clientLeft));
51968
52161
  _babylonjs_core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_5__["DataStorage"].WriteNumber("LeftWidth", this._leftWidth);
51969
52162
  }
51970
52163
  else {
51971
- this._rightWidth -= deltaX;
51972
- this._rightWidth = Math.max(250, Math.min(maxWidth - this._leftWidth, this._rightWidth));
52164
+ this._rightWidth = Math.max(250, Math.min(maxWidth - this._leftWidth, (this._rootRef.current.clientLeft + this._rootRef.current.clientWidth) - evt.clientX));
51973
52165
  _babylonjs_core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_5__["DataStorage"].WriteNumber("RightWidth", this._rightWidth);
51974
52166
  }
51975
52167
  rootElement.style.gridTemplateColumns = this.buildColumnLayout();
51976
- this._startX = evt.clientX;
51977
52168
  this.props.globalState.onWindowResizeObservable.notifyObservers();
51978
52169
  };
51979
52170
  WorkbenchEditor.prototype.buildColumnLayout = function () {
51980
- return "".concat(this._leftWidth, "px 4px ").concat(this._toolBarIconSize, "px calc(100% - ").concat(this._leftWidth + this._toolBarIconSize + 8 + this._rightWidth, "px) 4px ").concat(this._rightWidth, "px");
52171
+ return "".concat(this._leftWidth, "px 4px ").concat(this._toolBarIconSize, "px calc(100% - ").concat(this._leftWidth + this._toolBarIconSize + 8 + this._rightWidth, "px) ").concat(this._rightWidth, "px");
51981
52172
  };
51982
52173
  WorkbenchEditor.prototype.render = function () {
51983
52174
  var _this = this;
@@ -51992,7 +52183,7 @@ var WorkbenchEditor = /** @class */ (function (_super) {
51992
52183
  return;
51993
52184
  }
51994
52185
  _this.props.globalState.blockKeyboardEvents = false;
51995
- } },
52186
+ }, ref: this._rootRef },
51996
52187
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { id: "leftGrab", onPointerDown: function (evt) { return _this.onPointerDown(evt); }, onPointerUp: function (evt) { return _this.onPointerUp(evt); }, onPointerMove: function (evt) { return _this.resizeColumns(evt); } }),
51997
52188
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_components_sceneExplorer_sceneExplorerComponent__WEBPACK_IMPORTED_MODULE_9__["SceneExplorerComponent"], { globalState: this.props.globalState, noExpand: true }),
51998
52189
  this.createToolbar(),
@@ -52007,145 +52198,14 @@ var WorkbenchEditor = /** @class */ (function (_super) {
52007
52198
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_diagram_artBoard__WEBPACK_IMPORTED_MODULE_12__["ArtBoardComponent"], { globalState: this.props.globalState }),
52008
52199
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_diagram_workbench__WEBPACK_IMPORTED_MODULE_7__["WorkbenchComponent"], { ref: "workbenchCanvas", globalState: this.props.globalState }),
52009
52200
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_diagram_guiGizmoWrapper__WEBPACK_IMPORTED_MODULE_11__["GizmoWrapper"], { globalState: this.props.globalState })),
52010
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { id: "rightGrab", onPointerDown: function (evt) { return _this.onPointerDown(evt); }, onPointerUp: function (evt) { return _this.onPointerUp(evt); }, onPointerMove: function (evt) { return _this.resizeColumns(evt, false); } }),
52011
52201
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "right-panel" },
52202
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { id: "rightGrab", onPointerDown: function (evt) { return _this.onPointerDown(evt); }, onPointerUp: function (evt) { return _this.onPointerUp(evt); }, onPointerMove: function (evt) { return _this.resizeColumns(evt, false); } }),
52012
52203
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_components_propertyTab_propertyTabComponent__WEBPACK_IMPORTED_MODULE_2__["PropertyTabComponent"], { globalState: this.props.globalState })),
52013
52204
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_components_log_logComponent__WEBPACK_IMPORTED_MODULE_4__["LogComponent"], { globalState: this.props.globalState })),
52014
52205
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"](_sharedComponents_messageDialog__WEBPACK_IMPORTED_MODULE_8__["MessageDialogComponent"], { globalState: this.props.globalState }),
52015
52206
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "blocker" }, "GUI Editor runs only on desktop"),
52016
52207
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "wait-screen hidden" }, "Processing...please wait")));
52017
52208
  };
52018
- WorkbenchEditor.prototype.createItems = function () {
52019
- var _this = this;
52020
- this._items = [
52021
- {
52022
- label: "Rectangle",
52023
- icon: rectangleIcon,
52024
- onClick: function () {
52025
- _this.onCreate("Rectangle");
52026
- },
52027
- },
52028
- {
52029
- label: "Ellipse",
52030
- icon: ellipseIcon,
52031
- onClick: function () {
52032
- _this.onCreate("Ellipse");
52033
- },
52034
- },
52035
- {
52036
- label: "StackPanel",
52037
- icon: stackPanelIcon,
52038
- onClick: function () {
52039
- _this.onCreate("StackPanel");
52040
- },
52041
- },
52042
- {
52043
- label: "Grid",
52044
- icon: gridIcon,
52045
- onClick: function () {
52046
- _this.onCreate("Grid");
52047
- },
52048
- },
52049
- {
52050
- label: "ScrollViewer",
52051
- icon: scrollbarIcon,
52052
- onClick: function () {
52053
- _this.onCreate("ScrollViewer");
52054
- },
52055
- },
52056
- {
52057
- label: "Line",
52058
- icon: lineIcon,
52059
- onClick: function () {
52060
- _this.onCreate("Line");
52061
- },
52062
- },
52063
- {
52064
- label: "Text",
52065
- icon: textBoxIcon,
52066
- onClick: function () {
52067
- _this.onCreate("Text");
52068
- },
52069
- },
52070
- {
52071
- label: "InputText",
52072
- icon: inputFieldIcon,
52073
- onClick: function () {
52074
- _this.onCreate("InputText");
52075
- },
52076
- },
52077
- {
52078
- label: "InputPassword",
52079
- icon: passwordFieldIcon,
52080
- onClick: function () {
52081
- _this.onCreate("InputPassword");
52082
- },
52083
- },
52084
- {
52085
- label: "Image",
52086
- icon: imageIcon,
52087
- onClick: function () {
52088
- _this.onCreate("Image");
52089
- },
52090
- },
52091
- {
52092
- label: "DisplayGrid",
52093
- icon: displaygridIcon,
52094
- onClick: function () {
52095
- _this.onCreate("DisplayGrid");
52096
- },
52097
- },
52098
- {
52099
- label: "TextButton",
52100
- icon: buttonIcon,
52101
- onClick: function () {
52102
- _this.onCreate("TextButton");
52103
- },
52104
- },
52105
- {
52106
- label: "Checkbox",
52107
- icon: checkboxIcon,
52108
- onClick: function () {
52109
- _this.onCreate("Checkbox");
52110
- },
52111
- },
52112
- {
52113
- label: "RadioButton",
52114
- icon: radioButtonIcon,
52115
- onClick: function () {
52116
- _this.onCreate("RadioButton");
52117
- },
52118
- },
52119
- {
52120
- label: "Slider",
52121
- icon: sliderIcon,
52122
- onClick: function () {
52123
- _this.onCreate("Slider");
52124
- },
52125
- },
52126
- {
52127
- label: "ImageBasedSlider",
52128
- icon: imageBasedSliderIcon,
52129
- onClick: function () {
52130
- _this.onCreate("ImageBasedSlider");
52131
- },
52132
- },
52133
- {
52134
- label: "VirtualKeyboard",
52135
- icon: keyboardIcon,
52136
- onClick: function () {
52137
- _this.onCreate("VirtualKeyboard");
52138
- },
52139
- },
52140
- {
52141
- label: "ColorPicker",
52142
- icon: colorPickerIcon,
52143
- onClick: function () {
52144
- _this.onCreate("ColorPicker");
52145
- },
52146
- },
52147
- ];
52148
- };
52149
52209
  WorkbenchEditor.prototype.onCreate = function (value) {
52150
52210
  var guiElement = _guiNodeTools__WEBPACK_IMPORTED_MODULE_6__["GUINodeTools"].CreateControlFromString(value);
52151
52211
  var newGuiNode = this.props.globalState.workbench.appendBlock(guiElement);
@@ -52159,23 +52219,11 @@ var WorkbenchEditor = /** @class */ (function (_super) {
52159
52219
  return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"](react__WEBPACK_IMPORTED_MODULE_1__["Fragment"], null,
52160
52220
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { id: "toolbarGrab" },
52161
52221
  react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "blackLine" }),
52162
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "toolbar-content sub1" }, this._items.map(function (m) {
52163
- return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "toolbar-label" + (m.isActive ? " active" : ""), key: m.label, onDragStart: function (evt) { _this._draggedItem = m.label; }, onClick: function () {
52164
- if (!m.onClick) {
52165
- _this.forceUpdate();
52166
- return;
52167
- }
52168
- if (!m.subItems) {
52169
- m.onClick();
52170
- }
52171
- }, title: m.label },
52172
- !m.icon && react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "toolbar-label-text" }, (m.isActive ? "> " : "") + m.label),
52173
- m.icon && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "toolbar-icon", draggable: true },
52174
- react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("img", { src: m.icon, width: "40px", height: "40px" }))),
52175
- m.onCheck && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("input", { type: "checkBox", className: "toolbar-label-check", onChange: function (evt) {
52176
- _this.forceUpdate();
52177
- m.onCheck(evt.target.checked);
52178
- }, checked: false }))));
52222
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "toolbar-content sub1" }, _controlTypes__WEBPACK_IMPORTED_MODULE_13__["ControlTypes"].map(function (type) {
52223
+ return (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "toolbar-label", key: type.className, onDragStart: function (evt) { _this._draggedItem = type.className; }, onClick: function () {
52224
+ _this.onCreate(type.className);
52225
+ }, title: type.className }, type.icon && (react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("div", { className: "toolbar-icon", draggable: true },
52226
+ react__WEBPACK_IMPORTED_MODULE_1__["createElement"]("img", { src: type.icon, alt: type.className, width: "40px", height: "40px" })))));
52179
52227
  })))));
52180
52228
  };
52181
52229
  return WorkbenchEditor;