@babylonjs/node-editor 5.14.0 → 5.15.1
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.
|
@@ -59,7 +59,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
59
59
|
|
|
60
60
|
var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
|
|
61
61
|
// Module
|
|
62
|
-
___CSS_LOADER_EXPORT___.push([module.id, "#graph-canvas {\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n font: 14px \"acumin-pro\";\n user-select: none;\n overflow: hidden;\n cursor: move;\n background-image: linear-gradient(to right, #4f4e4f 1px, transparent 1px), linear-gradient(to bottom, #4f4e4f 1px, transparent 1px); }\n #graph-canvas #selection-container {\n pointer-events: none; }\n #graph-canvas #selection-container .selection-box {\n z-index: 10;\n position: absolute;\n background: rgba(72, 72, 196, 0.5);\n border: blue solid 2px; }\n #graph-canvas .port {\n border-radius: 20px;\n width: 20px;\n height: 20px;\n align-self: center; }\n #graph-canvas .port .img {\n width: 100%; }\n #graph-canvas .port img.selected {\n box-shadow: 0 0 0 2px;\n border-radius: 50%; }\n #graph-canvas .port:hover, #graph-canvas .port.selected {\n filter: brightness(2); }\n #graph-canvas .portLine {\n height: 24px;\n display: grid;\n grid-template-rows: 100%; }\n #graph-canvas .port-label {\n align-items: center; }\n #graph-canvas .inputsContainer {\n grid-row: 1;\n grid-column: 1; }\n #graph-canvas .inputsContainer .portLine {\n grid-template-columns: 12px calc(100% - 15px); }\n #graph-canvas .inputsContainer .portLine .port-label {\n grid-row: 1;\n grid-column: 2; }\n #graph-canvas .inputsContainer .portLine .port {\n grid-row: 1;\n grid-column: 1;\n transform: translateX(-12px); }\n #graph-canvas .outputsContainer {\n grid-row: 1;\n grid-column: 2; }\n #graph-canvas .outputsContainer .portLine {\n grid-template-columns: calc(100% - 10px) 12px; }\n #graph-canvas .outputsContainer .portLine .port-label {\n grid-row: 1;\n grid-column: 1;\n text-align: right; }\n #graph-canvas .outputsContainer .portLine .port {\n grid-row: 1;\n grid-column: 2;\n transform: translateX(2px); }\n #graph-canvas #graph-container {\n width: 100%;\n height: 100%;\n left: 0;\n top: 0;\n transform-origin: left top;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%; }\n #graph-canvas #graph-container #frame-container {\n overflow: visible;\n grid-row: 1;\n grid-column: 1;\n position: relative;\n width: 100%;\n height: 100%; }\n #graph-canvas #graph-container .frame-box {\n position: absolute;\n background: rgba(72, 72, 72, 0.7);\n display: grid;\n grid-template-rows: 40px calc(100% - 40px);\n grid-template-columns: 100%;\n box-sizing: border-box; }\n #graph-canvas #graph-container .frame-box.collapsed {\n height: auto !important;\n width: 200px !important;\n z-index: 3; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-box-header {\n font-size: 16px;\n grid-template-columns: calc(100% - 37px) 30px 7px; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-box-header .frame-box-header-collapse {\n margin-top: -2px; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-box-header .frame-box-header-close {\n display: none; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-comments.has-comments .frame-comment-span {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden; }\n #graph-canvas #graph-container .frame-box .frame-box-border {\n grid-row: 1 / span 2;\n grid-column: 1;\n width: 100%;\n height: 100%;\n border: transparent solid 4px;\n pointer-events: none;\n box-sizing: border-box; }\n #graph-canvas #graph-container .frame-box .frame-box-header {\n grid-row: 1;\n grid-column: 1;\n background: #484848;\n color: white;\n font-size: 24px;\n text-align: center;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: calc(100% - 74px) 30px 7px 30px 7px;\n align-content: center;\n overflow: hidden; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-button {\n cursor: pointer;\n align-self: center;\n transform-origin: 50% 50%;\n transform: scale(1);\n stroke: transparent;\n fill: white;\n display: grid; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-button.down {\n transform: scale(0.9); }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-collapse {\n grid-column: 2;\n grid-row: 1; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-close {\n grid-column: 4;\n grid-row: 1; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-title {\n grid-column: 1;\n grid-row: 1;\n display: grid;\n height: 100%;\n width: 100%;\n align-self: stretch;\n align-items: center;\n margin-top: -2px; }\n #graph-canvas #graph-container .frame-box .port-container {\n margin-top: 6px;\n margin-bottom: 6px;\n margin-left: 4px;\n margin-right: 4px;\n color: white;\n grid-row: 2;\n grid-column: 1;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 50% 50%;\n z-index: 2; }\n #graph-canvas #graph-container .frame-box .frame-comments.has-comments {\n display: grid;\n grid-row: 2;\n grid-column: 1;\n padding: 0 10px;\n font-style: italic;\n word-wrap: break-word; }\n #graph-canvas #graph-container .frame-box.selected .frame-box-border {\n border-color: white; }\n #graph-canvas #graph-container .frame-box .right-handle {\n grid-area: 1 / 2 / 3 / 2;\n width: 4px;\n background-color: transparent;\n cursor: ew-resize; }\n #graph-canvas #graph-container .frame-box .right-handle::after {\n content: \"\";\n width: 8px;\n position: absolute;\n top: 0;\n bottom: 0;\n margin-left: -4px;\n cursor: ew-resize; }\n #graph-canvas #graph-container .frame-box .right-handle.collapsed {\n cursor: pointer; }\n #graph-canvas #graph-container .frame-box .top-right-corner-handle {\n background-color: transparent;\n height: 4px;\n z-index: 21;\n cursor: ne-resize;\n width: 4px;\n margin-left: -6px; }\n #graph-canvas #graph-container .frame-box .top-right-corner-handle::after {\n background-color: transparent;\n cursor: ne-resize;\n margin-left: unset;\n top: -4px;\n height: 10px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .bottom-right-corner-handle {\n background-color: transparent;\n height: 0px;\n z-index: 21;\n cursor: nw-resize;\n grid-area: 4 / 2 / 4 / 2;\n margin-left: -2px; }\n #graph-canvas #graph-container .frame-box .bottom-right-corner-handle::after {\n background-color: transparent;\n height: 10px;\n cursor: nw-resize;\n top: unset;\n bottom: -4px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .left-handle {\n grid-area: 1 / 1 / 3 / 1;\n width: 4px;\n background-color: transparent;\n cursor: ew-resize; }\n #graph-canvas #graph-container .frame-box .left-handle::before {\n content: \"\";\n width: 8px;\n position: absolute;\n top: 0;\n bottom: 0;\n margin-left: -4px; }\n #graph-canvas #graph-container .frame-box .top-left-corner-handle {\n background-color: transparent;\n height: 4px;\n z-index: 21;\n cursor: nw-resize;\n width: 4px;\n margin-left: -4px; }\n #graph-canvas #graph-container .frame-box .top-left-corner-handle::before {\n background-color: transparent;\n cursor: nw-resize;\n margin-left: unset;\n top: -4px;\n height: 10px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .bottom-left-corner-handle {\n background-color: transparent;\n height: 0px;\n z-index: 21;\n cursor: sw-resize;\n grid-area: 4 / 1 / 4 / 1; }\n #graph-canvas #graph-container .frame-box .bottom-left-corner-handle::before {\n background-color: transparent;\n height: 10px;\n cursor: sw-resize;\n top: unset;\n bottom: -4px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .top-handle {\n grid-area: 1 / 1 / 1 / 1;\n background-color: transparent;\n height: 4px;\n cursor: ns-resize; }\n #graph-canvas #graph-container .frame-box .top-handle::before {\n content: \"\";\n width: 100%;\n position: absolute;\n top: -4px;\n bottom: 100%;\n right: 0;\n left: 0;\n margin-bottom: -8px;\n cursor: ns-resize;\n height: 8px; }\n #graph-canvas #graph-container .frame-box .bottom-handle {\n grid-area: 3 / 1 / 3 / 1;\n background-color: transparent;\n height: 4px;\n cursor: ns-resize; }\n #graph-canvas #graph-container .frame-box .bottom-handle::after {\n content: \"\";\n width: 100%;\n position: absolute;\n top: 100%;\n bottom: 0;\n right: 0;\n left: 0;\n margin-top: -8px;\n cursor: ns-resize;\n height: 12px; }\n #graph-canvas #graph-container .frame-box.collapsed .top-handle,\n #graph-canvas #graph-container .frame-box.collapsed .top-right-corner-handle,\n #graph-canvas #graph-container .frame-box.collapsed .right-handle,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-right-corner-handle,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-handle,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-left-corner-handle,\n #graph-canvas #graph-container .frame-box.collapsed .left-handle,\n #graph-canvas #graph-container .frame-box.collapsed .top-left-corner-handle {\n cursor: default; }\n #graph-canvas #graph-container .frame-box.collapsed .right-handle::after,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-handle::after,\n #graph-canvas #graph-container .frame-box.collapsed .top-right-corner-handle::after,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-right-corner-handle::after {\n cursor: default; }\n #graph-canvas #graph-container .frame-box.collapsed .left-handle::before,\n #graph-canvas #graph-container .frame-box.collapsed .top-handle::before,\n #graph-canvas #graph-container .frame-box.collapsed .top-left-corner-handle::before,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-left-corner-handle::before {\n cursor: default; }\n #graph-canvas #graph-container #graph-svg-container {\n grid-row: 1;\n grid-column: 1;\n position: relative;\n width: 100%;\n height: 100%;\n overflow: visible;\n pointer-events: none;\n z-index: 2; }\n #graph-canvas #graph-container #graph-svg-container .link {\n stroke-width: 4px; }\n #graph-canvas #graph-container #graph-svg-container .link.selected {\n stroke: white !important;\n stroke-dasharray: 10, 2; }\n #graph-canvas #graph-container #graph-svg-container .link.hidden {\n display: none; }\n #graph-canvas #graph-container #graph-svg-container .selection-link {\n pointer-events: all;\n stroke-width: 16px;\n opacity: 0;\n transition: opacity 75ms;\n stroke: transparent;\n cursor: pointer; }\n #graph-canvas #graph-container #graph-svg-container .selection-link.hidden {\n display: none; }\n #graph-canvas #graph-container #graph-svg-container .selection-link:hover, #graph-canvas #graph-container #graph-svg-container .selection-link.selected {\n stroke: white !important;\n opacity: 0.4; }\n #graph-canvas #graph-container #graph-canvas-container {\n grid-row: 1;\n grid-column: 1;\n position: relative;\n width: 100%;\n height: 100%; }\n #graph-canvas #graph-container #graph-canvas-container .visual {\n z-index: 4;\n width: 200px;\n position: absolute;\n left: 0;\n top: 0;\n background: gray;\n border: 4px solid black;\n border-radius: 12px;\n display: grid;\n grid-template-rows: 30px auto;\n grid-template-columns: 100%;\n color: white; }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block {\n width: 40px;\n grid-template-rows: 0px 40px 0px;\n border: 0;\n border-radius: 40px;\n transform: translateY(-7px); }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .selection-border {\n border-radius: 40px; }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .header-container {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .connections {\n transform: translateY(7px); }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .content {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual.hidden {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .comments {\n position: absolute;\n top: -50px;\n width: 200px;\n height: 45px;\n overflow: hidden;\n font-style: italic;\n opacity: 0.8;\n display: grid;\n align-items: flex-end;\n pointer-events: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .selection-border {\n grid-row: 1 / span 3;\n grid-column: 1;\n margin: -4px;\n transition: border-color 100ms;\n border: 4px solid black;\n border-radius: 12px;\n transform: scale(1); }\n #graph-canvas #graph-container #graph-canvas-container .visual.selected .selection-border {\n border: 4px solid white; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header-container {\n grid-row: 1;\n grid-column: 1;\n display: grid;\n grid-template-columns: 1fr auto;\n grid-template-rows: 100%;\n border: 4px solid black;\n border-top-right-radius: 7px;\n border-top-left-radius: 7px;\n background: black;\n color: white;\n transform: scaleX(1.01) translateY(-0.5px);\n transform-origin: center; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header-container.constant {\n border-color: #464348;\n background: #464348; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header-container.inspector {\n border-color: #66491b;\n background: #66491b; }\n #graph-canvas #graph-container #graph-canvas-container .visual .warning {\n grid-row: 1;\n grid-column: 1;\n display: none;\n z-index: 10;\n justify-self: end;\n align-self: center;\n margin-right: 5px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .warning.visible {\n display: grid;\n width: 20px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header {\n grid-row: 1;\n grid-column: 1;\n font-size: 16px;\n text-align: center;\n margin-top: -1px;\n margin-left: -1px;\n margin-right: -1px;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden; }\n #graph-canvas #graph-container #graph-canvas-container .visual .connections {\n grid-row: 2;\n grid-column: 1;\n display: grid;\n grid-template-columns: 50% 50%;\n transform: scale(1); }\n #graph-canvas #graph-container #graph-canvas-container .visual .content {\n min-height: 20px;\n grid-row: 3;\n grid-column: 1; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.input-block {\n grid-row: 2;\n min-height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px 5px;\n display: grid;\n align-content: center; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.input-block.small-font {\n font-size: 17px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.output-block {\n min-height: 0px;\n height: 5px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.clamp-block {\n grid-row: 2;\n height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.gradient-block {\n grid-row: 2;\n height: 34px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.texture-block {\n grid-row: 2;\n height: 140px;\n width: 140px;\n overflow: hidden;\n border-bottom-left-radius: 7px;\n border: black 4px solid;\n border-left: 0px;\n border-bottom: 0px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.texture-block img {\n width: 100%;\n height: 100%;\n pointer-events: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.texture-block img.empty {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.image-source-block {\n margin-top: 5px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.regular-texture-block {\n margin-top: 60px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.reduced-texture-block {\n margin-top: 30px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.reflection-block {\n grid-row: 3; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.remap-block {\n height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.trigonometry-block {\n grid-row: 2;\n height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px; }\n", "",{"version":3,"sources":["webpack://./../../../dev/sharedUiComponents/dist/nodeGraphSystem/scss/graphCanvas.scss"],"names":[],"mappings":"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","sourcesContent":["#graph-canvas {\r\n width: 100%;\r\n height: 100%;\r\n margin: 0;\r\n padding: 0;\r\n font: 14px \"acumin-pro\";\r\n user-select: none;\r\n overflow: hidden;\r\n cursor: move;\r\n background-image: linear-gradient(to right, #4f4e4f 1px, transparent 1px), linear-gradient(to bottom, #4f4e4f 1px, transparent 1px);\r\n\r\n #selection-container {\r\n pointer-events: none;\r\n\r\n .selection-box {\r\n z-index: 10;\r\n position: absolute;\r\n background: rgba(72, 72, 196, 0.5);\r\n border: blue solid 2px;\r\n }\r\n }\r\n\r\n .port {\r\n border-radius: 20px;\r\n width: 20px;\r\n height: 20px;\r\n align-self: center;\r\n\r\n .img {\r\n width: 100%;\r\n }\r\n\r\n img.selected {\r\n box-shadow: 0 0 0 2px;\r\n border-radius: 50%;\r\n }\r\n\r\n &:hover,\r\n &.selected {\r\n filter: brightness(2);\r\n }\r\n }\r\n\r\n .portLine {\r\n height: 24px;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n }\r\n\r\n .port-label {\r\n align-items: center;\r\n }\r\n\r\n .inputsContainer {\r\n grid-row: 1;\r\n grid-column: 1;\r\n\r\n .portLine {\r\n grid-template-columns: 12px calc(100% - 15px);\r\n\r\n .port-label {\r\n grid-row: 1;\r\n grid-column: 2;\r\n }\r\n\r\n .port {\r\n grid-row: 1;\r\n grid-column: 1;\r\n transform: translateX(-12px);\r\n }\r\n }\r\n }\r\n\r\n .outputsContainer {\r\n grid-row: 1;\r\n grid-column: 2;\r\n\r\n .portLine {\r\n grid-template-columns: calc(100% - 10px) 12px;\r\n\r\n .port-label {\r\n grid-row: 1;\r\n grid-column: 1;\r\n text-align: right;\r\n }\r\n\r\n .port {\r\n grid-row: 1;\r\n grid-column: 2;\r\n transform: translateX(2px);\r\n }\r\n }\r\n }\r\n\r\n #graph-container {\r\n width: 100%;\r\n height: 100%;\r\n left: 0;\r\n top: 0;\r\n transform-origin: left top;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 100%;\r\n\r\n #frame-container {\r\n overflow: visible;\r\n grid-row: 1;\r\n grid-column: 1;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n }\r\n\r\n .frame-box {\r\n position: absolute;\r\n background: rgba(72, 72, 72, 0.7);\r\n display: grid;\r\n grid-template-rows: 40px calc(100% - 40px);\r\n grid-template-columns: 100%;\r\n box-sizing: border-box;\r\n\r\n &.collapsed {\r\n height: auto !important;\r\n width: 200px !important;\r\n z-index: 3;\r\n\r\n .frame-box-header {\r\n font-size: 16px;\r\n grid-template-columns: calc(100% - 37px) 30px 7px;\r\n\r\n .frame-box-header-collapse {\r\n margin-top: -2px;\r\n }\r\n\r\n .frame-box-header-close {\r\n display: none;\r\n }\r\n }\r\n\r\n .frame-comments.has-comments {\r\n .frame-comment-span {\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n }\r\n }\r\n }\r\n\r\n .frame-box-border {\r\n grid-row: 1 / span 2;\r\n grid-column: 1;\r\n width: 100%;\r\n height: 100%;\r\n border: transparent solid 4px;\r\n pointer-events: none;\r\n box-sizing: border-box;\r\n }\r\n\r\n .frame-box-header {\r\n grid-row: 1;\r\n grid-column: 1;\r\n background: rgba(72, 72, 72, 1);\r\n color: white;\r\n font-size: 24px;\r\n text-align: center;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: calc(100% - 74px) 30px 7px 30px 7px;\r\n align-content: center;\r\n overflow: hidden;\r\n\r\n .frame-box-header-button {\r\n cursor: pointer;\r\n align-self: center;\r\n transform-origin: 50% 50%;\r\n transform: scale(1);\r\n stroke: transparent;\r\n fill: white;\r\n display: grid;\r\n\r\n &.down {\r\n transform: scale(0.9);\r\n }\r\n }\r\n\r\n .frame-box-header-collapse {\r\n grid-column: 2;\r\n grid-row: 1;\r\n }\r\n\r\n .frame-box-header-close {\r\n grid-column: 4;\r\n grid-row: 1;\r\n }\r\n\r\n .frame-box-header-title {\r\n grid-column: 1;\r\n grid-row: 1;\r\n display: grid;\r\n height: 100%;\r\n width: 100%;\r\n align-self: stretch;\r\n align-items: center;\r\n margin-top: -2px;\r\n }\r\n }\r\n\r\n .port-container {\r\n margin-top: 6px;\r\n margin-bottom: 6px;\r\n margin-left: 4px;\r\n margin-right: 4px;\r\n color: white;\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: 50% 50%;\r\n z-index: 2;\r\n }\r\n\r\n .frame-comments.has-comments {\r\n display: grid;\r\n grid-row: 2;\r\n grid-column: 1;\r\n padding: 0 10px;\r\n font-style: italic;\r\n word-wrap: break-word;\r\n }\r\n\r\n &.selected {\r\n .frame-box-border {\r\n border-color: white;\r\n }\r\n }\r\n\r\n .right-handle {\r\n grid-area: 1 / 2 / 3 / 2;\r\n width: 4px;\r\n background-color: transparent;\r\n cursor: ew-resize;\r\n\r\n &::after {\r\n content: \"\";\r\n width: 8px;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n margin-left: -4px;\r\n cursor: ew-resize;\r\n }\r\n\r\n &.collapsed {\r\n cursor: pointer;\r\n }\r\n }\r\n\r\n .top-right-corner-handle {\r\n background-color: transparent;\r\n height: 4px;\r\n z-index: 21;\r\n cursor: ne-resize;\r\n width: 4px;\r\n margin-left: -6px;\r\n\r\n &::after {\r\n background-color: transparent;\r\n cursor: ne-resize;\r\n margin-left: unset;\r\n top: -4px;\r\n height: 10px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .bottom-right-corner-handle {\r\n background-color: transparent;\r\n height: 0px;\r\n z-index: 21;\r\n cursor: nw-resize;\r\n grid-area: 4 / 2 / 4 / 2;\r\n margin-left: -2px;\r\n\r\n &::after {\r\n background-color: transparent;\r\n height: 10px;\r\n cursor: nw-resize;\r\n top: unset;\r\n bottom: -4px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .left-handle {\r\n grid-area: 1 / 1 / 3 / 1;\r\n width: 4px;\r\n background-color: transparent;\r\n cursor: ew-resize;\r\n\r\n &::before {\r\n content: \"\";\r\n width: 8px;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n margin-left: -4px;\r\n }\r\n }\r\n\r\n .top-left-corner-handle {\r\n background-color: transparent;\r\n height: 4px;\r\n z-index: 21;\r\n cursor: nw-resize;\r\n width: 4px;\r\n margin-left: -4px;\r\n\r\n &::before {\r\n background-color: transparent;\r\n cursor: nw-resize;\r\n margin-left: unset;\r\n top: -4px;\r\n height: 10px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .bottom-left-corner-handle {\r\n background-color: transparent;\r\n height: 0px;\r\n z-index: 21;\r\n cursor: sw-resize;\r\n grid-area: 4 / 1 / 4 / 1;\r\n\r\n &::before {\r\n background-color: transparent;\r\n height: 10px;\r\n cursor: sw-resize;\r\n top: unset;\r\n bottom: -4px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .top-handle {\r\n grid-area: 1 / 1 / 1 / 1;\r\n background-color: transparent;\r\n height: 4px;\r\n cursor: ns-resize;\r\n\r\n &::before {\r\n content: \"\";\r\n width: 100%;\r\n position: absolute;\r\n top: -4px;\r\n bottom: 100%;\r\n right: 0;\r\n left: 0;\r\n margin-bottom: -8px;\r\n cursor: ns-resize;\r\n height: 8px;\r\n }\r\n }\r\n\r\n .bottom-handle {\r\n grid-area: 3 / 1 / 3 / 1;\r\n background-color: transparent;\r\n height: 4px;\r\n cursor: ns-resize;\r\n\r\n &::after {\r\n content: \"\";\r\n width: 100%;\r\n position: absolute;\r\n top: 100%;\r\n bottom: 0;\r\n right: 0;\r\n left: 0;\r\n margin-top: -8px;\r\n cursor: ns-resize;\r\n height: 12px;\r\n }\r\n }\r\n\r\n &.collapsed {\r\n .top-handle,\r\n .top-right-corner-handle,\r\n .right-handle,\r\n .bottom-right-corner-handle,\r\n .bottom-handle,\r\n .bottom-left-corner-handle,\r\n .left-handle,\r\n .top-left-corner-handle {\r\n cursor: default;\r\n }\r\n\r\n .right-handle,\r\n .bottom-handle,\r\n .top-right-corner-handle,\r\n .bottom-right-corner-handle {\r\n &::after {\r\n cursor: default;\r\n }\r\n }\r\n\r\n .left-handle,\r\n .top-handle,\r\n .top-left-corner-handle,\r\n .bottom-left-corner-handle {\r\n &::before {\r\n cursor: default;\r\n }\r\n }\r\n }\r\n }\r\n\r\n #graph-svg-container {\r\n grid-row: 1;\r\n grid-column: 1;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n overflow: visible;\r\n pointer-events: none;\r\n z-index: 2;\r\n\r\n .link {\r\n stroke-width: 4px;\r\n &.selected {\r\n stroke: white !important;\r\n stroke-dasharray: 10, 2;\r\n }\r\n\r\n &.hidden {\r\n display: none;\r\n }\r\n }\r\n\r\n .selection-link {\r\n pointer-events: all;\r\n stroke-width: 16px;\r\n opacity: 0;\r\n transition: opacity 75ms;\r\n stroke: transparent;\r\n cursor: pointer;\r\n\r\n &.hidden {\r\n display: none;\r\n }\r\n\r\n &:hover,\r\n &.selected {\r\n stroke: white !important;\r\n opacity: 0.4;\r\n }\r\n }\r\n }\r\n\r\n #graph-canvas-container {\r\n grid-row: 1;\r\n grid-column: 1;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n\r\n .visual {\r\n z-index: 4;\r\n width: 200px;\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n background: gray;\r\n border: 4px solid black;\r\n border-radius: 12px;\r\n display: grid;\r\n grid-template-rows: 30px auto;\r\n grid-template-columns: 100%;\r\n color: white;\r\n\r\n &.elbow-block {\r\n width: 40px;\r\n grid-template-rows: 0px 40px 0px;\r\n border: 0;\r\n border-radius: 40px;\r\n transform: translateY(-7px);\r\n\r\n .selection-border {\r\n border-radius: 40px;\r\n }\r\n\r\n .header-container {\r\n display: none;\r\n }\r\n\r\n .connections {\r\n transform: translateY(7px);\r\n }\r\n\r\n .content {\r\n display: none;\r\n }\r\n }\r\n\r\n &.hidden {\r\n display: none;\r\n }\r\n\r\n .comments {\r\n position: absolute;\r\n top: -50px;\r\n width: 200px;\r\n height: 45px;\r\n overflow: hidden;\r\n font-style: italic;\r\n opacity: 0.8;\r\n display: grid;\r\n align-items: flex-end;\r\n pointer-events: none;\r\n }\r\n\r\n .selection-border {\r\n grid-row: 1 / span 3;\r\n grid-column: 1;\r\n margin: -4px;\r\n\r\n transition: border-color 100ms;\r\n\r\n border: 4px solid black;\r\n border-radius: 12px;\r\n transform: scale(1);\r\n }\r\n\r\n &.selected {\r\n .selection-border {\r\n border: 4px solid white;\r\n }\r\n }\r\n\r\n .header-container {\r\n grid-row: 1;\r\n grid-column: 1;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n grid-template-rows: 100%;\r\n border: 4px solid black;\r\n border-top-right-radius: 7px;\r\n border-top-left-radius: 7px;\r\n background: black;\r\n color: white;\r\n transform: scaleX(1.01) translateY(-0.5px);\r\n transform-origin: center;\r\n\r\n &.constant {\r\n border-color: #464348;\r\n background: #464348;\r\n }\r\n\r\n &.inspector {\r\n border-color: #66491b;\r\n background: #66491b;\r\n }\r\n }\r\n\r\n .warning {\r\n grid-row: 1;\r\n grid-column: 1;\r\n display: none;\r\n z-index: 10;\r\n justify-self: end;\r\n align-self: center;\r\n margin-right: 5px;\r\n\r\n &.visible {\r\n display: grid;\r\n width: 20px;\r\n }\r\n }\r\n\r\n .header {\r\n grid-row: 1;\r\n grid-column: 1;\r\n font-size: 16px;\r\n text-align: center;\r\n margin-top: -1px;\r\n margin-left: -1px;\r\n margin-right: -1px;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n }\r\n\r\n .connections {\r\n grid-row: 2;\r\n grid-column: 1;\r\n\r\n display: grid;\r\n grid-template-columns: 50% 50%;\r\n transform: scale(1);\r\n }\r\n\r\n .content {\r\n min-height: 20px;\r\n grid-row: 3;\r\n grid-column: 1;\r\n\r\n &.input-block {\r\n grid-row: 2;\r\n min-height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px 5px;\r\n display: grid;\r\n align-content: center;\r\n\r\n &.small-font {\r\n font-size: 17px;\r\n }\r\n }\r\n\r\n &.output-block {\r\n min-height: 0px;\r\n height: 5px;\r\n }\r\n\r\n &.clamp-block {\r\n grid-row: 2;\r\n height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px;\r\n }\r\n\r\n &.gradient-block {\r\n grid-row: 2;\r\n height: 34px;\r\n }\r\n\r\n &.texture-block {\r\n grid-row: 2;\r\n height: 140px;\r\n width: 140px;\r\n overflow: hidden;\r\n border-bottom-left-radius: 7px;\r\n border: black 4px solid;\r\n border-left: 0px;\r\n border-bottom: 0px;\r\n\r\n img {\r\n width: 100%;\r\n height: 100%;\r\n pointer-events: none;\r\n\r\n &.empty {\r\n display: none;\r\n }\r\n }\r\n }\r\n\r\n &.image-source-block {\r\n margin-top: 5px;\r\n }\r\n\r\n &.regular-texture-block {\r\n margin-top: 60px;\r\n }\r\n\r\n &.reduced-texture-block {\r\n margin-top: 30px;\r\n }\r\n\r\n &.reflection-block {\r\n grid-row: 3;\r\n }\r\n\r\n &.remap-block {\r\n height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px;\r\n }\r\n\r\n &.trigonometry-block {\r\n grid-row: 2;\r\n height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
|
|
62
|
+
___CSS_LOADER_EXPORT___.push([module.id, "#graph-canvas {\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n font: 14px \"acumin-pro\";\n user-select: none;\n overflow: hidden;\n cursor: move;\n background-image: linear-gradient(to right, #4f4e4f 1px, transparent 1px), linear-gradient(to bottom, #4f4e4f 1px, transparent 1px); }\n #graph-canvas #selection-container {\n pointer-events: none; }\n #graph-canvas #selection-container .selection-box {\n z-index: 10;\n position: absolute;\n background: rgba(72, 72, 196, 0.5);\n border: blue solid 2px; }\n #graph-canvas .port {\n border-radius: 20px;\n width: 20px;\n height: 20px;\n align-self: center; }\n #graph-canvas .port .img {\n width: 100%; }\n #graph-canvas .port img.selected {\n box-shadow: 0 0 0 2px;\n border-radius: 50%; }\n #graph-canvas .port:hover, #graph-canvas .port.selected {\n filter: brightness(2); }\n #graph-canvas .portLine {\n height: 24px;\n display: grid;\n grid-template-rows: 100%; }\n #graph-canvas .port-label {\n align-items: center; }\n #graph-canvas .inputsContainer {\n grid-row: 1;\n grid-column: 1; }\n #graph-canvas .inputsContainer .portLine {\n grid-template-columns: 12px calc(100% - 15px); }\n #graph-canvas .inputsContainer .portLine .port-label {\n grid-row: 1;\n grid-column: 2; }\n #graph-canvas .inputsContainer .portLine .port {\n grid-row: 1;\n grid-column: 1;\n transform: translateX(-12px); }\n #graph-canvas .outputsContainer {\n grid-row: 1;\n grid-column: 2; }\n #graph-canvas .outputsContainer .portLine {\n grid-template-columns: calc(100% - 10px) 12px; }\n #graph-canvas .outputsContainer .portLine .port-label {\n grid-row: 1;\n grid-column: 1;\n text-align: right; }\n #graph-canvas .outputsContainer .portLine .port {\n grid-row: 1;\n grid-column: 2;\n transform: translateX(2px); }\n #graph-canvas #graph-container {\n width: 100%;\n height: 100%;\n left: 0;\n top: 0;\n transform-origin: left top;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%; }\n #graph-canvas #graph-container #frame-container {\n overflow: visible;\n grid-row: 1;\n grid-column: 1;\n position: relative;\n width: 100%;\n height: 100%; }\n #graph-canvas #graph-container .frame-box {\n position: absolute;\n background: rgba(72, 72, 72, 0.7);\n display: grid;\n grid-template-rows: 40px calc(100% - 40px);\n grid-template-columns: 100%;\n box-sizing: border-box; }\n #graph-canvas #graph-container .frame-box.collapsed {\n height: auto !important;\n width: 200px !important;\n z-index: 3; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-box-header {\n font-size: 16px;\n grid-template-columns: calc(100% - 37px) 30px 7px; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-box-header .frame-box-header-collapse {\n margin-top: -2px; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-box-header .frame-box-header-close {\n display: none; }\n #graph-canvas #graph-container .frame-box.collapsed .frame-comments.has-comments .frame-comment-span {\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden; }\n #graph-canvas #graph-container .frame-box .frame-box-border {\n grid-row: 1 / span 2;\n grid-column: 1;\n width: 100%;\n height: 100%;\n border: transparent solid 4px;\n pointer-events: none;\n box-sizing: border-box; }\n #graph-canvas #graph-container .frame-box .frame-box-header {\n grid-row: 1;\n grid-column: 1;\n background: #484848;\n color: white;\n font-size: 24px;\n text-align: center;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: calc(100% - 74px) 30px 7px 30px 7px;\n align-content: center;\n overflow: hidden; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-button {\n cursor: pointer;\n align-self: center;\n transform-origin: 50% 50%;\n transform: scale(1);\n stroke: transparent;\n fill: white;\n display: grid; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-button.down {\n transform: scale(0.9); }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-collapse {\n grid-column: 2;\n grid-row: 1; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-close {\n grid-column: 4;\n grid-row: 1; }\n #graph-canvas #graph-container .frame-box .frame-box-header .frame-box-header-title {\n grid-column: 1;\n grid-row: 1;\n display: grid;\n height: 100%;\n width: 100%;\n align-self: stretch;\n align-items: center;\n margin-top: -2px; }\n #graph-canvas #graph-container .frame-box .port-container {\n margin-top: 6px;\n margin-bottom: 6px;\n margin-left: 4px;\n margin-right: 4px;\n color: white;\n grid-row: 2;\n grid-column: 1;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 50% 50%;\n z-index: 2; }\n #graph-canvas #graph-container .frame-box .frame-comments.has-comments {\n display: grid;\n grid-row: 2;\n grid-column: 1;\n padding: 0 10px;\n font-style: italic;\n word-wrap: break-word; }\n #graph-canvas #graph-container .frame-box.selected .frame-box-border {\n border-color: white; }\n #graph-canvas #graph-container .frame-box .right-handle {\n grid-area: 1 / 2 / 3 / 2;\n width: 4px;\n background-color: transparent;\n cursor: ew-resize; }\n #graph-canvas #graph-container .frame-box .right-handle::after {\n content: \"\";\n width: 8px;\n position: absolute;\n top: 0;\n bottom: 0;\n margin-left: -4px;\n cursor: ew-resize; }\n #graph-canvas #graph-container .frame-box .right-handle.collapsed {\n cursor: pointer; }\n #graph-canvas #graph-container .frame-box .top-right-corner-handle {\n background-color: transparent;\n height: 4px;\n z-index: 21;\n cursor: ne-resize;\n width: 4px;\n margin-left: -6px; }\n #graph-canvas #graph-container .frame-box .top-right-corner-handle::after {\n background-color: transparent;\n cursor: ne-resize;\n margin-left: unset;\n top: -4px;\n height: 10px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .bottom-right-corner-handle {\n background-color: transparent;\n height: 0px;\n z-index: 21;\n cursor: nw-resize;\n grid-area: 4 / 2 / 4 / 2;\n margin-left: -2px; }\n #graph-canvas #graph-container .frame-box .bottom-right-corner-handle::after {\n background-color: transparent;\n height: 10px;\n cursor: nw-resize;\n top: unset;\n bottom: -4px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .left-handle {\n grid-area: 1 / 1 / 3 / 1;\n width: 4px;\n background-color: transparent;\n cursor: ew-resize; }\n #graph-canvas #graph-container .frame-box .left-handle::before {\n content: \"\";\n width: 8px;\n position: absolute;\n top: 0;\n bottom: 0;\n margin-left: -4px; }\n #graph-canvas #graph-container .frame-box .top-left-corner-handle {\n background-color: transparent;\n height: 4px;\n z-index: 21;\n cursor: nw-resize;\n width: 4px;\n margin-left: -4px; }\n #graph-canvas #graph-container .frame-box .top-left-corner-handle::before {\n background-color: transparent;\n cursor: nw-resize;\n margin-left: unset;\n top: -4px;\n height: 10px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .bottom-left-corner-handle {\n background-color: transparent;\n height: 0px;\n z-index: 21;\n cursor: sw-resize;\n grid-area: 4 / 1 / 4 / 1; }\n #graph-canvas #graph-container .frame-box .bottom-left-corner-handle::before {\n background-color: transparent;\n height: 10px;\n cursor: sw-resize;\n top: unset;\n bottom: -4px;\n width: 10px; }\n #graph-canvas #graph-container .frame-box .top-handle {\n grid-area: 1 / 1 / 1 / 1;\n background-color: transparent;\n height: 4px;\n cursor: ns-resize; }\n #graph-canvas #graph-container .frame-box .top-handle::before {\n content: \"\";\n width: 100%;\n position: absolute;\n top: -4px;\n bottom: 100%;\n right: 0;\n left: 0;\n margin-bottom: -8px;\n cursor: ns-resize;\n height: 8px; }\n #graph-canvas #graph-container .frame-box .bottom-handle {\n grid-area: 3 / 1 / 3 / 1;\n background-color: transparent;\n height: 4px;\n cursor: ns-resize; }\n #graph-canvas #graph-container .frame-box .bottom-handle::after {\n content: \"\";\n width: 100%;\n position: absolute;\n top: 100%;\n bottom: 0;\n right: 0;\n left: 0;\n margin-top: -8px;\n cursor: ns-resize;\n height: 12px; }\n #graph-canvas #graph-container .frame-box.collapsed .top-handle,\n #graph-canvas #graph-container .frame-box.collapsed .top-right-corner-handle,\n #graph-canvas #graph-container .frame-box.collapsed .right-handle,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-right-corner-handle,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-handle,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-left-corner-handle,\n #graph-canvas #graph-container .frame-box.collapsed .left-handle,\n #graph-canvas #graph-container .frame-box.collapsed .top-left-corner-handle {\n cursor: default; }\n #graph-canvas #graph-container .frame-box.collapsed .right-handle::after,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-handle::after,\n #graph-canvas #graph-container .frame-box.collapsed .top-right-corner-handle::after,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-right-corner-handle::after {\n cursor: default; }\n #graph-canvas #graph-container .frame-box.collapsed .left-handle::before,\n #graph-canvas #graph-container .frame-box.collapsed .top-handle::before,\n #graph-canvas #graph-container .frame-box.collapsed .top-left-corner-handle::before,\n #graph-canvas #graph-container .frame-box.collapsed .bottom-left-corner-handle::before {\n cursor: default; }\n #graph-canvas #graph-container #graph-svg-container {\n grid-row: 1;\n grid-column: 1;\n position: relative;\n width: 100%;\n height: 100%;\n overflow: visible;\n pointer-events: none;\n z-index: 2;\n filter: drop-shadow(7px 6px 2px rgba(0, 0, 0, 0.2)); }\n #graph-canvas #graph-container #graph-svg-container .link {\n stroke-width: 4px; }\n #graph-canvas #graph-container #graph-svg-container .link.selected {\n stroke: white !important;\n stroke-dasharray: 10, 2; }\n #graph-canvas #graph-container #graph-svg-container .link.hidden {\n display: none; }\n #graph-canvas #graph-container #graph-svg-container .selection-link {\n pointer-events: all;\n stroke-width: 16px;\n opacity: 0;\n transition: opacity 75ms;\n stroke: transparent;\n cursor: pointer; }\n #graph-canvas #graph-container #graph-svg-container .selection-link.hidden {\n display: none; }\n #graph-canvas #graph-container #graph-svg-container .selection-link:hover, #graph-canvas #graph-container #graph-svg-container .selection-link.selected {\n stroke: white !important;\n opacity: 0.4; }\n #graph-canvas #graph-container #graph-canvas-container {\n grid-row: 1;\n grid-column: 1;\n position: relative;\n width: 100%;\n height: 100%; }\n #graph-canvas #graph-container #graph-canvas-container .visual {\n z-index: 4;\n width: 200px;\n position: absolute;\n left: 0;\n top: 0;\n background: gray;\n border: 4px solid black;\n border-radius: 12px;\n display: grid;\n grid-template-rows: 30px auto;\n grid-template-columns: 100%;\n color: white;\n box-shadow: 7px 6px 2px rgba(0, 0, 0, 0.2); }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block {\n width: 40px;\n grid-template-rows: 0px 40px 0px;\n border: 0;\n border-radius: 40px;\n transform: translateY(-7px); }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .selection-border {\n border-radius: 40px; }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .header-container {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .connections {\n transform: translateY(7px); }\n #graph-canvas #graph-container #graph-canvas-container .visual.elbow-block .content {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual.hidden {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .comments {\n position: absolute;\n top: -50px;\n width: 200px;\n height: 45px;\n overflow: hidden;\n font-style: italic;\n opacity: 0.8;\n display: grid;\n align-items: flex-end;\n pointer-events: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .selection-border {\n grid-row: 1 / span 3;\n grid-column: 1;\n margin: -4px;\n transition: border-color 100ms;\n border: 4px solid black;\n border-radius: 12px;\n transform: scale(1); }\n #graph-canvas #graph-container #graph-canvas-container .visual.selected .selection-border {\n border: 4px solid white; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header-container {\n grid-row: 1;\n grid-column: 1;\n display: grid;\n grid-template-columns: 1fr auto;\n grid-template-rows: 100%;\n border: 4px solid black;\n border-top-right-radius: 7px;\n border-top-left-radius: 7px;\n background: black;\n color: white;\n transform: scaleX(1.01) translateY(-0.5px);\n transform-origin: center; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header-container.constant {\n border-color: #464348;\n background: #464348; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header-container.inspector {\n border-color: #66491b;\n background: #66491b; }\n #graph-canvas #graph-container #graph-canvas-container .visual .headerIcon {\n grid-row: 1;\n grid-column: 1;\n display: none;\n z-index: 10;\n justify-self: end;\n align-self: center;\n margin-right: 5px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .headerIcon.visible {\n display: grid;\n width: 20px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .header {\n grid-row: 1;\n grid-column: 1;\n font-size: 16px;\n text-align: center;\n margin-top: -1px;\n margin-left: -1px;\n margin-right: 20px;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden; }\n #graph-canvas #graph-container #graph-canvas-container .visual .connections {\n grid-row: 2;\n grid-column: 1;\n display: grid;\n grid-template-columns: 50% 50%;\n transform: scale(1); }\n #graph-canvas #graph-container #graph-canvas-container .visual .content {\n min-height: 20px;\n grid-row: 3;\n grid-column: 1; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.input-block {\n grid-row: 2;\n min-height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px 5px;\n display: grid;\n align-content: center; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.input-block.small-font {\n font-size: 17px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.output-block {\n min-height: 0px;\n height: 5px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.clamp-block {\n grid-row: 2;\n height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.gradient-block {\n grid-row: 2;\n height: 34px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.texture-block {\n grid-row: 2;\n height: 140px;\n width: 140px;\n overflow: hidden;\n border-bottom-left-radius: 7px;\n border: black 4px solid;\n border-left: 0px;\n border-bottom: 0px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.texture-block img {\n width: 100%;\n height: 100%;\n pointer-events: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.texture-block img.empty {\n display: none; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.image-source-block {\n margin-top: 5px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.regular-texture-block {\n margin-top: 60px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.reduced-texture-block {\n margin-top: 30px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.reflection-block {\n grid-row: 3; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.remap-block {\n height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px; }\n #graph-canvas #graph-container #graph-canvas-container .visual .content.trigonometry-block {\n grid-row: 2;\n height: 34px;\n text-align: center;\n font-size: 18px;\n font-weight: bold;\n margin: 0 10px; }\n", "",{"version":3,"sources":["webpack://./../../../dev/sharedUiComponents/dist/nodeGraphSystem/scss/graphCanvas.scss"],"names":[],"mappings":"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","sourcesContent":["#graph-canvas {\r\n width: 100%;\r\n height: 100%;\r\n margin: 0;\r\n padding: 0;\r\n font: 14px \"acumin-pro\";\r\n user-select: none;\r\n overflow: hidden;\r\n cursor: move;\r\n background-image: linear-gradient(to right, #4f4e4f 1px, transparent 1px), linear-gradient(to bottom, #4f4e4f 1px, transparent 1px);\r\n\r\n #selection-container {\r\n pointer-events: none;\r\n\r\n .selection-box {\r\n z-index: 10;\r\n position: absolute;\r\n background: rgba(72, 72, 196, 0.5);\r\n border: blue solid 2px;\r\n }\r\n }\r\n\r\n .port {\r\n border-radius: 20px;\r\n width: 20px;\r\n height: 20px;\r\n align-self: center;\r\n\r\n .img {\r\n width: 100%;\r\n }\r\n\r\n img.selected {\r\n box-shadow: 0 0 0 2px;\r\n border-radius: 50%;\r\n }\r\n\r\n &:hover,\r\n &.selected {\r\n filter: brightness(2);\r\n }\r\n }\r\n\r\n .portLine {\r\n height: 24px;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n }\r\n\r\n .port-label {\r\n align-items: center;\r\n }\r\n\r\n .inputsContainer {\r\n grid-row: 1;\r\n grid-column: 1;\r\n\r\n .portLine {\r\n grid-template-columns: 12px calc(100% - 15px);\r\n\r\n .port-label {\r\n grid-row: 1;\r\n grid-column: 2;\r\n }\r\n\r\n .port {\r\n grid-row: 1;\r\n grid-column: 1;\r\n transform: translateX(-12px);\r\n }\r\n }\r\n }\r\n\r\n .outputsContainer {\r\n grid-row: 1;\r\n grid-column: 2;\r\n\r\n .portLine {\r\n grid-template-columns: calc(100% - 10px) 12px;\r\n\r\n .port-label {\r\n grid-row: 1;\r\n grid-column: 1;\r\n text-align: right;\r\n }\r\n\r\n .port {\r\n grid-row: 1;\r\n grid-column: 2;\r\n transform: translateX(2px);\r\n }\r\n }\r\n }\r\n\r\n #graph-container {\r\n width: 100%;\r\n height: 100%;\r\n left: 0;\r\n top: 0;\r\n transform-origin: left top;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 100%;\r\n\r\n #frame-container {\r\n overflow: visible;\r\n grid-row: 1;\r\n grid-column: 1;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n }\r\n\r\n .frame-box {\r\n position: absolute;\r\n background: rgba(72, 72, 72, 0.7);\r\n display: grid;\r\n grid-template-rows: 40px calc(100% - 40px);\r\n grid-template-columns: 100%;\r\n box-sizing: border-box;\r\n\r\n &.collapsed {\r\n height: auto !important;\r\n width: 200px !important;\r\n z-index: 3;\r\n\r\n .frame-box-header {\r\n font-size: 16px;\r\n grid-template-columns: calc(100% - 37px) 30px 7px;\r\n\r\n .frame-box-header-collapse {\r\n margin-top: -2px;\r\n }\r\n\r\n .frame-box-header-close {\r\n display: none;\r\n }\r\n }\r\n\r\n .frame-comments.has-comments {\r\n .frame-comment-span {\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n }\r\n }\r\n }\r\n\r\n .frame-box-border {\r\n grid-row: 1 / span 2;\r\n grid-column: 1;\r\n width: 100%;\r\n height: 100%;\r\n border: transparent solid 4px;\r\n pointer-events: none;\r\n box-sizing: border-box;\r\n }\r\n\r\n .frame-box-header {\r\n grid-row: 1;\r\n grid-column: 1;\r\n background: rgba(72, 72, 72, 1);\r\n color: white;\r\n font-size: 24px;\r\n text-align: center;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: calc(100% - 74px) 30px 7px 30px 7px;\r\n align-content: center;\r\n overflow: hidden;\r\n\r\n .frame-box-header-button {\r\n cursor: pointer;\r\n align-self: center;\r\n transform-origin: 50% 50%;\r\n transform: scale(1);\r\n stroke: transparent;\r\n fill: white;\r\n display: grid;\r\n\r\n &.down {\r\n transform: scale(0.9);\r\n }\r\n }\r\n\r\n .frame-box-header-collapse {\r\n grid-column: 2;\r\n grid-row: 1;\r\n }\r\n\r\n .frame-box-header-close {\r\n grid-column: 4;\r\n grid-row: 1;\r\n }\r\n\r\n .frame-box-header-title {\r\n grid-column: 1;\r\n grid-row: 1;\r\n display: grid;\r\n height: 100%;\r\n width: 100%;\r\n align-self: stretch;\r\n align-items: center;\r\n margin-top: -2px;\r\n }\r\n }\r\n\r\n .port-container {\r\n margin-top: 6px;\r\n margin-bottom: 6px;\r\n margin-left: 4px;\r\n margin-right: 4px;\r\n color: white;\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: 50% 50%;\r\n z-index: 2;\r\n }\r\n\r\n .frame-comments.has-comments {\r\n display: grid;\r\n grid-row: 2;\r\n grid-column: 1;\r\n padding: 0 10px;\r\n font-style: italic;\r\n word-wrap: break-word;\r\n }\r\n\r\n &.selected {\r\n .frame-box-border {\r\n border-color: white;\r\n }\r\n }\r\n\r\n .right-handle {\r\n grid-area: 1 / 2 / 3 / 2;\r\n width: 4px;\r\n background-color: transparent;\r\n cursor: ew-resize;\r\n\r\n &::after {\r\n content: \"\";\r\n width: 8px;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n margin-left: -4px;\r\n cursor: ew-resize;\r\n }\r\n\r\n &.collapsed {\r\n cursor: pointer;\r\n }\r\n }\r\n\r\n .top-right-corner-handle {\r\n background-color: transparent;\r\n height: 4px;\r\n z-index: 21;\r\n cursor: ne-resize;\r\n width: 4px;\r\n margin-left: -6px;\r\n\r\n &::after {\r\n background-color: transparent;\r\n cursor: ne-resize;\r\n margin-left: unset;\r\n top: -4px;\r\n height: 10px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .bottom-right-corner-handle {\r\n background-color: transparent;\r\n height: 0px;\r\n z-index: 21;\r\n cursor: nw-resize;\r\n grid-area: 4 / 2 / 4 / 2;\r\n margin-left: -2px;\r\n\r\n &::after {\r\n background-color: transparent;\r\n height: 10px;\r\n cursor: nw-resize;\r\n top: unset;\r\n bottom: -4px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .left-handle {\r\n grid-area: 1 / 1 / 3 / 1;\r\n width: 4px;\r\n background-color: transparent;\r\n cursor: ew-resize;\r\n\r\n &::before {\r\n content: \"\";\r\n width: 8px;\r\n position: absolute;\r\n top: 0;\r\n bottom: 0;\r\n margin-left: -4px;\r\n }\r\n }\r\n\r\n .top-left-corner-handle {\r\n background-color: transparent;\r\n height: 4px;\r\n z-index: 21;\r\n cursor: nw-resize;\r\n width: 4px;\r\n margin-left: -4px;\r\n\r\n &::before {\r\n background-color: transparent;\r\n cursor: nw-resize;\r\n margin-left: unset;\r\n top: -4px;\r\n height: 10px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .bottom-left-corner-handle {\r\n background-color: transparent;\r\n height: 0px;\r\n z-index: 21;\r\n cursor: sw-resize;\r\n grid-area: 4 / 1 / 4 / 1;\r\n\r\n &::before {\r\n background-color: transparent;\r\n height: 10px;\r\n cursor: sw-resize;\r\n top: unset;\r\n bottom: -4px;\r\n width: 10px;\r\n }\r\n }\r\n\r\n .top-handle {\r\n grid-area: 1 / 1 / 1 / 1;\r\n background-color: transparent;\r\n height: 4px;\r\n cursor: ns-resize;\r\n\r\n &::before {\r\n content: \"\";\r\n width: 100%;\r\n position: absolute;\r\n top: -4px;\r\n bottom: 100%;\r\n right: 0;\r\n left: 0;\r\n margin-bottom: -8px;\r\n cursor: ns-resize;\r\n height: 8px;\r\n }\r\n }\r\n\r\n .bottom-handle {\r\n grid-area: 3 / 1 / 3 / 1;\r\n background-color: transparent;\r\n height: 4px;\r\n cursor: ns-resize;\r\n\r\n &::after {\r\n content: \"\";\r\n width: 100%;\r\n position: absolute;\r\n top: 100%;\r\n bottom: 0;\r\n right: 0;\r\n left: 0;\r\n margin-top: -8px;\r\n cursor: ns-resize;\r\n height: 12px;\r\n }\r\n }\r\n\r\n &.collapsed {\r\n .top-handle,\r\n .top-right-corner-handle,\r\n .right-handle,\r\n .bottom-right-corner-handle,\r\n .bottom-handle,\r\n .bottom-left-corner-handle,\r\n .left-handle,\r\n .top-left-corner-handle {\r\n cursor: default;\r\n }\r\n\r\n .right-handle,\r\n .bottom-handle,\r\n .top-right-corner-handle,\r\n .bottom-right-corner-handle {\r\n &::after {\r\n cursor: default;\r\n }\r\n }\r\n\r\n .left-handle,\r\n .top-handle,\r\n .top-left-corner-handle,\r\n .bottom-left-corner-handle {\r\n &::before {\r\n cursor: default;\r\n }\r\n }\r\n }\r\n }\r\n\r\n #graph-svg-container {\r\n grid-row: 1;\r\n grid-column: 1;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n overflow: visible;\r\n pointer-events: none;\r\n z-index: 2;\r\n filter: drop-shadow(7px 6px 2px rgba(0, 0, 0, 0.2));\r\n\r\n .link {\r\n stroke-width: 4px;\r\n &.selected {\r\n stroke: white !important;\r\n stroke-dasharray: 10, 2;\r\n }\r\n\r\n &.hidden {\r\n display: none;\r\n }\r\n }\r\n\r\n .selection-link {\r\n pointer-events: all;\r\n stroke-width: 16px;\r\n opacity: 0;\r\n transition: opacity 75ms;\r\n stroke: transparent;\r\n cursor: pointer;\r\n\r\n &.hidden {\r\n display: none;\r\n }\r\n\r\n &:hover,\r\n &.selected {\r\n stroke: white !important;\r\n opacity: 0.4;\r\n }\r\n }\r\n }\r\n\r\n #graph-canvas-container {\r\n grid-row: 1;\r\n grid-column: 1;\r\n position: relative;\r\n width: 100%;\r\n height: 100%;\r\n\r\n .visual {\r\n z-index: 4;\r\n width: 200px;\r\n position: absolute;\r\n left: 0;\r\n top: 0;\r\n background: gray;\r\n border: 4px solid black;\r\n border-radius: 12px;\r\n display: grid;\r\n grid-template-rows: 30px auto;\r\n grid-template-columns: 100%;\r\n color: white;\r\n box-shadow: 7px 6px 2px rgba(0, 0, 0, 0.2);\r\n\r\n &.elbow-block {\r\n width: 40px;\r\n grid-template-rows: 0px 40px 0px;\r\n border: 0;\r\n border-radius: 40px;\r\n transform: translateY(-7px);\r\n\r\n .selection-border {\r\n border-radius: 40px;\r\n }\r\n\r\n .header-container {\r\n display: none;\r\n }\r\n\r\n .connections {\r\n transform: translateY(7px);\r\n }\r\n\r\n .content {\r\n display: none;\r\n }\r\n }\r\n\r\n &.hidden {\r\n display: none;\r\n }\r\n\r\n .comments {\r\n position: absolute;\r\n top: -50px;\r\n width: 200px;\r\n height: 45px;\r\n overflow: hidden;\r\n font-style: italic;\r\n opacity: 0.8;\r\n display: grid;\r\n align-items: flex-end;\r\n pointer-events: none;\r\n }\r\n\r\n .selection-border {\r\n grid-row: 1 / span 3;\r\n grid-column: 1;\r\n margin: -4px;\r\n\r\n transition: border-color 100ms;\r\n\r\n border: 4px solid black;\r\n border-radius: 12px;\r\n transform: scale(1);\r\n }\r\n\r\n &.selected {\r\n .selection-border {\r\n border: 4px solid white;\r\n }\r\n }\r\n\r\n .header-container {\r\n grid-row: 1;\r\n grid-column: 1;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\r\n grid-template-rows: 100%;\r\n border: 4px solid black;\r\n border-top-right-radius: 7px;\r\n border-top-left-radius: 7px;\r\n background: black;\r\n color: white;\r\n transform: scaleX(1.01) translateY(-0.5px);\r\n transform-origin: center;\r\n\r\n &.constant {\r\n border-color: #464348;\r\n background: #464348;\r\n }\r\n\r\n &.inspector {\r\n border-color: #66491b;\r\n background: #66491b;\r\n }\r\n }\r\n\r\n .headerIcon {\r\n grid-row: 1;\r\n grid-column: 1;\r\n display: none;\r\n z-index: 10;\r\n justify-self: end;\r\n align-self: center;\r\n margin-right: 5px;\r\n\r\n &.visible {\r\n display: grid;\r\n width: 20px;\r\n }\r\n }\r\n\r\n .header {\r\n grid-row: 1;\r\n grid-column: 1;\r\n font-size: 16px;\r\n text-align: center;\r\n margin-top: -1px;\r\n margin-left: -1px;\r\n margin-right: 20px;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n }\r\n\r\n .connections {\r\n grid-row: 2;\r\n grid-column: 1;\r\n\r\n display: grid;\r\n grid-template-columns: 50% 50%;\r\n transform: scale(1);\r\n }\r\n\r\n .content {\r\n min-height: 20px;\r\n grid-row: 3;\r\n grid-column: 1;\r\n\r\n &.input-block {\r\n grid-row: 2;\r\n min-height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px 5px;\r\n display: grid;\r\n align-content: center;\r\n\r\n &.small-font {\r\n font-size: 17px;\r\n }\r\n }\r\n\r\n &.output-block {\r\n min-height: 0px;\r\n height: 5px;\r\n }\r\n\r\n &.clamp-block {\r\n grid-row: 2;\r\n height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px;\r\n }\r\n\r\n &.gradient-block {\r\n grid-row: 2;\r\n height: 34px;\r\n }\r\n\r\n &.texture-block {\r\n grid-row: 2;\r\n height: 140px;\r\n width: 140px;\r\n overflow: hidden;\r\n border-bottom-left-radius: 7px;\r\n border: black 4px solid;\r\n border-left: 0px;\r\n border-bottom: 0px;\r\n\r\n img {\r\n width: 100%;\r\n height: 100%;\r\n pointer-events: none;\r\n\r\n &.empty {\r\n display: none;\r\n }\r\n }\r\n }\r\n\r\n &.image-source-block {\r\n margin-top: 5px;\r\n }\r\n\r\n &.regular-texture-block {\r\n margin-top: 60px;\r\n }\r\n\r\n &.reduced-texture-block {\r\n margin-top: 30px;\r\n }\r\n\r\n &.reflection-block {\r\n grid-row: 3;\r\n }\r\n\r\n &.remap-block {\r\n height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px;\r\n }\r\n\r\n &.trigonometry-block {\r\n grid-row: 2;\r\n height: 34px;\r\n text-align: center;\r\n font-size: 18px;\r\n font-weight: bold;\r\n margin: 0 10px;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
|
|
63
63
|
// Exports
|
|
64
64
|
___CSS_LOADER_EXPORT___.locals = {};
|
|
65
65
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
|
|
@@ -143,7 +143,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
143
143
|
|
|
144
144
|
var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_sourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
|
|
145
145
|
// Module
|
|
146
|
-
___CSS_LOADER_EXPORT___.push([module.id, ".right-panel #propertyTab {\n color: white;\n background: #333333; }\n .right-panel #propertyTab #header {\n height: 30px;\n font-size: 16px;\n color: white;\n background: #222222;\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 .right-panel #propertyTab #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 .right-panel #propertyTab #header #title {\n grid-column: 2;\n display: grid;\n align-items: center;\n text-align: center; }\n .right-panel #propertyTab .range {\n -webkit-appearance: none;\n width: 120px;\n height: 6px;\n background: #d3d3d3;\n border-radius: 5px;\n outline: none;\n opacity: 0.7;\n -webkit-transition: 0.2s;\n transition: opacity 0.2s; }\n .right-panel #propertyTab .range:hover {\n opacity: 1; }\n .right-panel #propertyTab .range::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: #337ab7;\n cursor: pointer; }\n .right-panel #propertyTab .range::-moz-range-thumb {\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: #337ab7;\n cursor: pointer; }\n .right-panel #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 .right-panel #propertyTab input[type=\"color\"]::-webkit-color-swatch-wrapper {\n padding: 0; }\n .right-panel #propertyTab input[type=\"color\"]::-webkit-color-swatch {\n border: none; }\n .right-panel #propertyTab .sliderLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 1fr 50px auto; }\n .right-panel #propertyTab .sliderLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .slider {\n grid-column: 3;\n grid-row: 1;\n margin-right: 5px;\n width: 90%;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .floatLine {\n grid-column: 2;\n padding-left: 5px; }\n .right-panel #propertyTab .sliderLine .floatLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .floatLine .short {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .floatLine .short input {\n width: 35px; }\n .right-panel #propertyTab .sliderLine .floatLine .short input::-webkit-outer-spin-button,\n .right-panel #propertyTab .sliderLine .floatLine .short input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n .right-panel #propertyTab .sliderLine .floatLine .short input[type=\"number\"] {\n -moz-appearance: textfield; }\n .right-panel #propertyTab .textInputLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr 120px auto; }\n .right-panel #propertyTab .textInputLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .textInputLine .value {\n display: flex;\n align-items: center;\n grid-column: 2; }\n .right-panel #propertyTab .textInputLine .value input {\n width: calc(100% - 5px); }\n .right-panel #propertyTab .textInputArea {\n padding-left: 5px;\n height: 50px;\n display: grid;\n grid-template-columns: 1fr 120px; }\n .right-panel #propertyTab .textInputArea .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .textInputArea textarea {\n width: calc(150% - 5px);\n margin-left: -50%;\n height: 40px;\n resize: none; }\n .right-panel #propertyTab .textInputArea .value {\n display: flex;\n align-items: center;\n grid-column: 2; }\n .right-panel #propertyTab .paneContainer {\n margin-top: 3px;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%; }\n .right-panel #propertyTab .paneContainer .paneList {\n border-left: 3px solid transparent; }\n .right-panel #propertyTab .paneContainer:hover .paneList {\n border-left: 3px solid rgba(51, 122, 183, 0.8); }\n .right-panel #propertyTab .paneContainer:hover .paneContainer-content .header .title {\n border-left: 3px solid #337ab7; }\n .right-panel #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 .right-panel #propertyTab .paneContainer .paneContainer-highlight-border.transparent {\n opacity: 0; }\n .right-panel #propertyTab .paneContainer .paneContainer-content {\n grid-row: 1;\n grid-column: 1; }\n .right-panel #propertyTab .paneContainer .paneContainer-content .header {\n display: grid;\n grid-template-columns: 1fr auto;\n background: #555555;\n height: 30px;\n padding-right: 5px;\n cursor: pointer; }\n .right-panel #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 .right-panel #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 .right-panel #propertyTab .paneContainer .paneContainer-content .header .collapse.closed {\n transform: rotate(180deg); }\n .right-panel #propertyTab .paneContainer .paneContainer-content .paneList > div:not(:last-child) {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1); }\n .right-panel #propertyTab .paneContainer .paneContainer-content .fragment > div:not(:last-child) {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1); }\n .right-panel #propertyTab .color-picker {\n height: calc(100% - 8px);\n margin: 4px;\n width: calc(100% - 8px); }\n .right-panel #propertyTab .color-picker .color-rect {\n height: calc(100% - 4px);\n border: 2px white solid;\n cursor: pointer;\n min-height: 18px; }\n .right-panel #propertyTab .color-picker .color-picker-cover {\n position: fixed;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n z-index: 1; }\n .right-panel #propertyTab .color-picker .color-picker-float {\n z-index: 2;\n position: absolute; }\n .right-panel #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 .right-panel #propertyTab .gradient-step .step {\n grid-row: 1;\n grid-column: 1; }\n .right-panel #propertyTab .gradient-step .color {\n grid-row: 1;\n grid-column: 2;\n cursor: pointer; }\n .right-panel #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 .right-panel #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 .right-panel #propertyTab .gradient-step .step-slider input {\n width: 90%; }\n .right-panel #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 .right-panel #propertyTab .gradient-step .gradient-copy .img {\n height: 20px;\n width: 20px; }\n .right-panel #propertyTab .gradient-step .gradient-copy .img:hover {\n cursor: pointer; }\n .right-panel #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 .right-panel #propertyTab .gradient-step .gradient-delete .img {\n height: 20px;\n width: 20px; }\n .right-panel #propertyTab .gradient-step .gradient-delete .img:hover {\n cursor: pointer; }\n .right-panel #propertyTab .floatLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr 120px; }\n .right-panel #propertyTab .floatLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .floatLine .value {\n grid-column: 2;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .floatLine .value input {\n width: 110px; }\n .right-panel #propertyTab .floatLine .short {\n grid-column: 2;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .floatLine .short input {\n width: 27px; }\n .right-panel #propertyTab .floatLine .short input::-webkit-outer-spin-button,\n .right-panel #propertyTab .floatLine .short input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n .right-panel #propertyTab .floatLine .short input[type=\"number\"] {\n -moz-appearance: textfield; }\n .right-panel #propertyTab .vector3Line {\n padding-left: 5px;\n display: grid; }\n .right-panel #propertyTab .vector3Line .firstLine {\n display: grid;\n grid-template-columns: 1fr auto 20px;\n height: 30px; }\n .right-panel #propertyTab .vector3Line .firstLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .vector3Line .firstLine .vector {\n grid-column: 2;\n display: flex;\n align-items: center;\n text-align: right;\n opacity: 0.8; }\n .right-panel #propertyTab .vector3Line .firstLine .expand {\n grid-column: 3;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n .right-panel #propertyTab .vector3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n .right-panel #propertyTab .vector3Line .secondLine .no-right-margin {\n margin-right: 0; }\n .right-panel #propertyTab .vector3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #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 .right-panel #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 .right-panel #propertyTab .buttonLine {\n height: 30px;\n display: grid;\n align-items: center;\n justify-items: stretch;\n padding-bottom: 5px; }\n .right-panel #propertyTab .buttonLine.disabled {\n opacity: 0.3; }\n .right-panel #propertyTab .buttonLine input[type=\"file\"] {\n display: none; }\n .right-panel #propertyTab .buttonLine .file-upload {\n background: #222222;\n border: 1px solid #337ab7;\n margin: 5px 10px;\n color: white;\n padding: 4px 5px;\n padding-top: 0px;\n opacity: 0.9;\n cursor: pointer;\n text-align: center; }\n .right-panel #propertyTab .buttonLine .file-upload:hover {\n opacity: 1; }\n .right-panel #propertyTab .buttonLine .file-upload:active {\n transform: scale(0.98);\n transform-origin: 0.5 0.5; }\n .right-panel #propertyTab .buttonLine button {\n background: #222222;\n border: 1px solid #337ab7;\n margin: 5px 10px 5px 10px;\n color: white;\n padding: 4px 5px;\n opacity: 0.9; }\n .right-panel #propertyTab .buttonLine button:hover {\n opacity: 1; }\n .right-panel #propertyTab .buttonLine button:active {\n background: #282828; }\n .right-panel #propertyTab .buttonLine button:focus {\n border: 1px solid #337ab7;\n outline: 0px; }\n .right-panel #propertyTab .checkBoxLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .checkBoxLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .checkBoxLine .checkBox {\n grid-column: 2;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .checkBoxLine .checkBox .lbl {\n position: relative;\n display: block;\n height: 14px;\n width: 34px;\n margin-right: 5px;\n background: #898989;\n border-radius: 100px;\n cursor: pointer;\n transition: all 0.3s ease; }\n .right-panel #propertyTab .checkBoxLine .checkBox .lbl:after {\n position: absolute;\n left: 3px;\n top: 2px;\n display: block;\n width: 10px;\n height: 10px;\n border-radius: 100px;\n background: #fff;\n box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.05);\n content: \"\";\n transition: all 0.15s ease; }\n .right-panel #propertyTab .checkBoxLine .checkBox .lbl:active:after {\n transform: scale(1.15, 0.85); }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label {\n background: #337ab7; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label:after {\n left: 20px;\n background: #164975; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label.disabled {\n background: #164975;\n cursor: pointer; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label.disabled:after {\n left: 20px;\n background: #555555;\n cursor: pointer; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx ~ label.disabled {\n background: #555555;\n cursor: pointer; }\n .right-panel #propertyTab .checkBoxLine .checkBox .hidden {\n display: none; }\n .right-panel #propertyTab .listLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .listLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .listLine .options {\n grid-column: 2;\n display: flex;\n align-items: center;\n margin-right: 5px; }\n .right-panel #propertyTab .listLine .options select {\n width: 115px; }\n .right-panel #propertyTab .color3Line {\n padding-left: 5px;\n display: grid; }\n .right-panel #propertyTab .color3Line .firstLine {\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto 20px 20px; }\n .right-panel #propertyTab .color3Line .firstLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .color3Line .firstLine .color3 {\n grid-column: 2;\n width: 50px;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .color3Line .firstLine .color3 input {\n margin-right: 5px; }\n .right-panel #propertyTab .color3Line .firstLine .copy {\n grid-column: 3;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n .right-panel #propertyTab .color3Line .firstLine .copy img {\n height: 100%;\n width: 20px; }\n .right-panel #propertyTab .color3Line .firstLine .expand {\n grid-column: 4;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n .right-panel #propertyTab .color3Line .firstLine .expand img {\n height: 100%;\n width: 20px; }\n .right-panel #propertyTab .color3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n .right-panel #propertyTab .color3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #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 .right-panel #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 .right-panel #propertyTab .textLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .textLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #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 .right-panel #propertyTab .textLine .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: 200px;\n -webkit-user-select: text;\n -moz-user-select: text;\n -ms-user-select: text;\n user-select: text; }\n .right-panel #propertyTab .textLine .value.check {\n color: green; }\n .right-panel #propertyTab .textLine .value.uncheck {\n color: red; }\n", "",{"version":3,"sources":["webpack://./../../../tools/nodeEditor/dist/components/propertyTab/propertyTab.scss"],"names":[],"mappings":"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","sourcesContent":[".right-panel {\r\n #propertyTab {\r\n $line-padding-left: 5px;\r\n color: white;\r\n background: #333333;\r\n\r\n #header {\r\n height: 30px;\r\n font-size: 16px;\r\n color: white;\r\n background: #222222;\r\n grid-row: 1;\r\n text-align: center;\r\n display: grid;\r\n grid-template-columns: 30px 1fr;\r\n -webkit-user-select: none;\r\n -moz-user-select: none;\r\n -ms-user-select: none;\r\n user-select: none;\r\n\r\n #logo {\r\n position: relative;\r\n grid-column: 1;\r\n width: 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\r\n .range {\r\n -webkit-appearance: none;\r\n width: 120px;\r\n height: 6px;\r\n background: #d3d3d3;\r\n border-radius: 5px;\r\n outline: none;\r\n opacity: 0.7;\r\n -webkit-transition: 0.2s;\r\n transition: opacity 0.2s;\r\n }\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: rgb(51, 122, 183);\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(51, 122, 183);\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 .sliderLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 1fr 50px auto;\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 .slider {\r\n grid-column: 3;\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 }\r\n\r\n .floatLine {\r\n grid-column: 2;\r\n padding-left: $line-padding-left;\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 .short {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n width: 35px;\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\r\n .textInputLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr 120px auto;\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 input {\r\n width: calc(100% - 5px);\r\n }\r\n }\r\n }\r\n\r\n .textInputArea {\r\n padding-left: $line-padding-left;\r\n height: 50px;\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 textarea {\r\n width: calc(150% - 5px);\r\n margin-left: -50%;\r\n height: 40px;\r\n resize: none;\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 }\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: #555555;\r\n height: 30px;\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: calc(100% - 8px);\r\n margin: 4px;\r\n width: calc(100% - 8px);\r\n\r\n .color-rect {\r\n height: calc(100% - 4px);\r\n border: 2px white solid;\r\n cursor: pointer;\r\n min-height: 18px;\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: 1;\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 .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 .floatLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\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 grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n width: 110px;\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 display: grid;\r\n\r\n .firstLine {\r\n display: grid;\r\n grid-template-columns: 1fr auto 20px;\r\n height: 30px;\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: 30px;\r\n display: grid;\r\n align-items: center;\r\n justify-items: stretch;\r\n padding-bottom: 5px;\r\n\r\n &.disabled {\r\n opacity: 0.3;\r\n }\r\n\r\n input[type=\"file\"] {\r\n display: none;\r\n }\r\n\r\n .file-upload {\r\n background: #222222;\r\n border: 1px solid rgb(51, 122, 183);\r\n margin: 5px 10px;\r\n color: white;\r\n padding: 4px 5px;\r\n padding-top: 0px;\r\n opacity: 0.9;\r\n cursor: pointer;\r\n text-align: center;\r\n }\r\n\r\n .file-upload:hover {\r\n opacity: 1;\r\n }\r\n\r\n .file-upload:active {\r\n transform: scale(0.98);\r\n transform-origin: 0.5 0.5;\r\n }\r\n\r\n button {\r\n background: #222222;\r\n border: 1px solid rgb(51, 122, 183);\r\n margin: 5px 10px 5px 10px;\r\n color: white;\r\n padding: 4px 5px;\r\n opacity: 0.9;\r\n }\r\n\r\n button:hover {\r\n opacity: 1;\r\n }\r\n\r\n button:active {\r\n background: #282828;\r\n }\r\n\r\n button:focus {\r\n border: 1px solid rgb(51, 122, 183);\r\n outline: 0px;\r\n }\r\n }\r\n\r\n .checkBoxLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\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 .checkBox {\r\n grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n .lbl {\r\n position: relative;\r\n display: block;\r\n height: 14px;\r\n width: 34px;\r\n margin-right: 5px;\r\n background: #898989;\r\n border-radius: 100px;\r\n cursor: pointer;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .lbl:after {\r\n position: absolute;\r\n left: 3px;\r\n top: 2px;\r\n display: block;\r\n width: 10px;\r\n height: 10px;\r\n border-radius: 100px;\r\n background: #fff;\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 }\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: rgb(51, 122, 183);\r\n }\r\n\r\n .cbx:checked ~ label:after {\r\n left: 20px;\r\n background: rgb(22, 73, 117);\r\n }\r\n\r\n .cbx:checked ~ label.disabled {\r\n background: rgb(22, 73, 117);\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 height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\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 .options {\r\n grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n margin-right: 5px;\r\n\r\n select {\r\n width: 115px;\r\n }\r\n }\r\n }\r\n\r\n .color3Line {\r\n padding-left: $line-padding-left;\r\n display: grid;\r\n\r\n .firstLine {\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto 20px 20px;\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 .color3 {\r\n grid-column: 2;\r\n width: 50px;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n margin-right: 5px;\r\n }\r\n }\r\n\r\n .copy {\r\n grid-column: 3;\r\n display: grid;\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 .expand {\r\n grid-column: 4;\r\n display: grid;\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 height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\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 .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 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: 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}\r\n"],"sourceRoot":""}]);
|
|
146
|
+
___CSS_LOADER_EXPORT___.push([module.id, ".right-panel #propertyTab {\n color: white;\n background: #333333; }\n .right-panel #propertyTab #header {\n height: 30px;\n font-size: 16px;\n color: white;\n background: #222222;\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 .right-panel #propertyTab #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 .right-panel #propertyTab #header #title {\n grid-column: 2;\n display: grid;\n align-items: center;\n text-align: center; }\n .right-panel #propertyTab .range {\n -webkit-appearance: none;\n width: 120px;\n height: 6px;\n background: #d3d3d3;\n border-radius: 5px;\n outline: none;\n opacity: 0.7;\n -webkit-transition: 0.2s;\n transition: opacity 0.2s; }\n .right-panel #propertyTab .range:hover {\n opacity: 1; }\n .right-panel #propertyTab .range::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: #337ab7;\n cursor: pointer; }\n .right-panel #propertyTab .range::-moz-range-thumb {\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: #337ab7;\n cursor: pointer; }\n .right-panel #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 .right-panel #propertyTab input[type=\"color\"]::-webkit-color-swatch-wrapper {\n padding: 0; }\n .right-panel #propertyTab input[type=\"color\"]::-webkit-color-swatch {\n border: none; }\n .right-panel #propertyTab .sliderLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 1fr 50px auto; }\n .right-panel #propertyTab .sliderLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .slider {\n grid-column: 3;\n grid-row: 1;\n margin-right: 5px;\n width: 90%;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .floatLine {\n grid-column: 2;\n padding-left: 5px; }\n .right-panel #propertyTab .sliderLine .floatLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .floatLine .short {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .sliderLine .floatLine .short input {\n width: 35px; }\n .right-panel #propertyTab .sliderLine .floatLine .short input::-webkit-outer-spin-button,\n .right-panel #propertyTab .sliderLine .floatLine .short input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n .right-panel #propertyTab .sliderLine .floatLine .short input[type=\"number\"] {\n -moz-appearance: textfield; }\n .right-panel #propertyTab .textInputLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr 120px auto; }\n .right-panel #propertyTab .textInputLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .textInputLine .value {\n display: flex;\n align-items: center;\n grid-column: 2; }\n .right-panel #propertyTab .textInputLine .value input {\n width: calc(100% - 5px);\n margin-right: 5px; }\n .right-panel #propertyTab .textInputArea {\n padding-left: 5px;\n height: 50px;\n display: grid;\n grid-template-columns: 1fr 120px; }\n .right-panel #propertyTab .textInputArea .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .textInputArea textarea {\n margin-right: 5px;\n margin-left: -50%;\n height: 40px;\n resize: none; }\n .right-panel #propertyTab .textInputArea .value {\n display: flex;\n align-items: center;\n grid-column: 2; }\n .right-panel #propertyTab .paneContainer {\n margin-top: 3px;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%; }\n .right-panel #propertyTab .paneContainer .paneList {\n border-left: 3px solid transparent; }\n .right-panel #propertyTab .paneContainer:hover .paneList {\n border-left: 3px solid rgba(51, 122, 183, 0.8); }\n .right-panel #propertyTab .paneContainer:hover .paneContainer-content .header .title {\n border-left: 3px solid #337ab7; }\n .right-panel #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 .right-panel #propertyTab .paneContainer .paneContainer-highlight-border.transparent {\n opacity: 0; }\n .right-panel #propertyTab .paneContainer .paneContainer-content {\n grid-row: 1;\n grid-column: 1; }\n .right-panel #propertyTab .paneContainer .paneContainer-content .header {\n display: grid;\n grid-template-columns: 1fr auto;\n background: #555555;\n height: 30px;\n padding-right: 5px;\n cursor: pointer; }\n .right-panel #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 .right-panel #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 .right-panel #propertyTab .paneContainer .paneContainer-content .header .collapse.closed {\n transform: rotate(180deg); }\n .right-panel #propertyTab .paneContainer .paneContainer-content .paneList > div:not(:last-child) {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1); }\n .right-panel #propertyTab .paneContainer .paneContainer-content .fragment > div:not(:last-child) {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1); }\n .right-panel #propertyTab .color-picker {\n height: calc(100% - 8px);\n margin: 4px;\n width: calc(100% - 8px); }\n .right-panel #propertyTab .color-picker .color-rect {\n height: calc(100% - 4px);\n border: 2px white solid;\n cursor: pointer;\n min-height: 18px; }\n .right-panel #propertyTab .color-picker .color-picker-cover {\n position: fixed;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n z-index: 1; }\n .right-panel #propertyTab .color-picker .color-picker-float {\n z-index: 2;\n position: absolute; }\n .right-panel #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 .right-panel #propertyTab .gradient-step .step {\n grid-row: 1;\n grid-column: 1; }\n .right-panel #propertyTab .gradient-step .color {\n grid-row: 1;\n grid-column: 2;\n cursor: pointer; }\n .right-panel #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 .right-panel #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 .right-panel #propertyTab .gradient-step .step-slider input {\n width: 90%; }\n .right-panel #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 .right-panel #propertyTab .gradient-step .gradient-copy .img {\n height: 20px;\n width: 20px; }\n .right-panel #propertyTab .gradient-step .gradient-copy .img:hover {\n cursor: pointer; }\n .right-panel #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 .right-panel #propertyTab .gradient-step .gradient-delete .img {\n height: 20px;\n width: 20px; }\n .right-panel #propertyTab .gradient-step .gradient-delete .img:hover {\n cursor: pointer; }\n .right-panel #propertyTab .floatLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr 120px; }\n .right-panel #propertyTab .floatLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .floatLine .value {\n grid-column: 2;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .floatLine .value input {\n width: 110px; }\n .right-panel #propertyTab .floatLine .short {\n grid-column: 2;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .floatLine .short input {\n width: 27px; }\n .right-panel #propertyTab .floatLine .short input::-webkit-outer-spin-button,\n .right-panel #propertyTab .floatLine .short input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n .right-panel #propertyTab .floatLine .short input[type=\"number\"] {\n -moz-appearance: textfield; }\n .right-panel #propertyTab .vector3Line {\n padding-left: 5px;\n display: grid; }\n .right-panel #propertyTab .vector3Line .firstLine {\n display: grid;\n grid-template-columns: 1fr auto 20px;\n height: 30px; }\n .right-panel #propertyTab .vector3Line .firstLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .vector3Line .firstLine .vector {\n grid-column: 2;\n display: flex;\n align-items: center;\n text-align: right;\n opacity: 0.8; }\n .right-panel #propertyTab .vector3Line .firstLine .expand {\n grid-column: 3;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n .right-panel #propertyTab .vector3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n .right-panel #propertyTab .vector3Line .secondLine .no-right-margin {\n margin-right: 0; }\n .right-panel #propertyTab .vector3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #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 .right-panel #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 .right-panel #propertyTab .buttonLine {\n height: 30px;\n display: grid;\n align-items: center;\n justify-items: stretch;\n padding-bottom: 5px; }\n .right-panel #propertyTab .buttonLine.disabled {\n opacity: 0.3; }\n .right-panel #propertyTab .buttonLine input[type=\"file\"] {\n display: none; }\n .right-panel #propertyTab .buttonLine .file-upload {\n background: #222222;\n border: 1px solid #337ab7;\n margin: 5px 10px;\n color: white;\n padding: 4px 5px;\n padding-top: 0px;\n opacity: 0.9;\n cursor: pointer;\n text-align: center; }\n .right-panel #propertyTab .buttonLine .file-upload:hover {\n opacity: 1; }\n .right-panel #propertyTab .buttonLine .file-upload:active {\n transform: scale(0.98);\n transform-origin: 0.5 0.5; }\n .right-panel #propertyTab .buttonLine button {\n background: #222222;\n border: 1px solid #337ab7;\n margin: 5px 10px 5px 10px;\n color: white;\n padding: 4px 5px;\n opacity: 0.9; }\n .right-panel #propertyTab .buttonLine button:hover {\n opacity: 1; }\n .right-panel #propertyTab .buttonLine button:active {\n background: #282828; }\n .right-panel #propertyTab .buttonLine button:focus {\n border: 1px solid #337ab7;\n outline: 0px; }\n .right-panel #propertyTab .checkBoxLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .checkBoxLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .checkBoxLine .checkBox {\n grid-column: 2;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .checkBoxLine .checkBox .lbl {\n position: relative;\n display: block;\n height: 14px;\n width: 34px;\n margin-right: 5px;\n background: #898989;\n border-radius: 100px;\n cursor: pointer;\n transition: all 0.3s ease; }\n .right-panel #propertyTab .checkBoxLine .checkBox .lbl:after {\n position: absolute;\n left: 3px;\n top: 2px;\n display: block;\n width: 10px;\n height: 10px;\n border-radius: 100px;\n background: #fff;\n box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.05);\n content: \"\";\n transition: all 0.15s ease; }\n .right-panel #propertyTab .checkBoxLine .checkBox .lbl:active:after {\n transform: scale(1.15, 0.85); }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label {\n background: #337ab7; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label:after {\n left: 20px;\n background: #164975; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label.disabled {\n background: #164975;\n cursor: pointer; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx:checked ~ label.disabled:after {\n left: 20px;\n background: #555555;\n cursor: pointer; }\n .right-panel #propertyTab .checkBoxLine .checkBox .cbx ~ label.disabled {\n background: #555555;\n cursor: pointer; }\n .right-panel #propertyTab .checkBoxLine .checkBox .hidden {\n display: none; }\n .right-panel #propertyTab .listLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .listLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .listLine .options {\n grid-column: 2;\n display: flex;\n align-items: center;\n margin-right: 5px; }\n .right-panel #propertyTab .listLine .options select {\n width: 115px; }\n .right-panel #propertyTab .color3Line {\n padding-left: 5px;\n display: grid; }\n .right-panel #propertyTab .color3Line .firstLine {\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto 0px 20px 20px; }\n .right-panel #propertyTab .color3Line .firstLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .color3Line .firstLine .textInputLine {\n display: none; }\n .right-panel #propertyTab .color3Line .firstLine .color3 {\n grid-column: 2;\n width: 50px;\n display: flex;\n align-items: center; }\n .right-panel #propertyTab .color3Line .firstLine .color3 input {\n margin-right: 5px; }\n .right-panel #propertyTab .color3Line .firstLine .copy {\n grid-column: 4;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n .right-panel #propertyTab .color3Line .firstLine .copy img {\n height: 100%;\n width: 24px; }\n .right-panel #propertyTab .color3Line .firstLine .expand {\n grid-column: 5;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n .right-panel #propertyTab .color3Line .firstLine .expand img {\n height: 100%;\n width: 20px; }\n .right-panel #propertyTab .color3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n .right-panel #propertyTab .color3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #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 .right-panel #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 .right-panel #propertyTab .textLine {\n padding-left: 5px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n .right-panel #propertyTab .textLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n .right-panel #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 .right-panel #propertyTab .textLine .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: 200px;\n -webkit-user-select: text;\n -moz-user-select: text;\n -ms-user-select: text;\n user-select: text; }\n .right-panel #propertyTab .textLine .value.check {\n color: green; }\n .right-panel #propertyTab .textLine .value.uncheck {\n color: red; }\n", "",{"version":3,"sources":["webpack://./../../../tools/nodeEditor/dist/components/propertyTab/propertyTab.scss"],"names":[],"mappings":"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","sourcesContent":[".right-panel {\r\n #propertyTab {\r\n $line-padding-left: 5px;\r\n color: white;\r\n background: #333333;\r\n\r\n #header {\r\n height: 30px;\r\n font-size: 16px;\r\n color: white;\r\n background: #222222;\r\n grid-row: 1;\r\n text-align: center;\r\n display: grid;\r\n grid-template-columns: 30px 1fr;\r\n -webkit-user-select: none;\r\n -moz-user-select: none;\r\n -ms-user-select: none;\r\n user-select: none;\r\n\r\n #logo {\r\n position: relative;\r\n grid-column: 1;\r\n width: 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\r\n .range {\r\n -webkit-appearance: none;\r\n width: 120px;\r\n height: 6px;\r\n background: #d3d3d3;\r\n border-radius: 5px;\r\n outline: none;\r\n opacity: 0.7;\r\n -webkit-transition: 0.2s;\r\n transition: opacity 0.2s;\r\n }\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: rgb(51, 122, 183);\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(51, 122, 183);\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 .sliderLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 1fr 50px auto;\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 .slider {\r\n grid-column: 3;\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 }\r\n\r\n .floatLine {\r\n grid-column: 2;\r\n padding-left: $line-padding-left;\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 .short {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n width: 35px;\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\r\n .textInputLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr 120px auto;\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 input {\r\n width: calc(100% - 5px);\r\n margin-right: 5px;\r\n }\r\n }\r\n }\r\n\r\n .textInputArea {\r\n padding-left: $line-padding-left;\r\n height: 50px;\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 textarea {\r\n margin-right: 5px;\r\n margin-left: -50%;\r\n height: 40px;\r\n resize: none;\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 }\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: #555555;\r\n height: 30px;\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: calc(100% - 8px);\r\n margin: 4px;\r\n width: calc(100% - 8px);\r\n\r\n .color-rect {\r\n height: calc(100% - 4px);\r\n border: 2px white solid;\r\n cursor: pointer;\r\n min-height: 18px;\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: 1;\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 .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 .floatLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\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 grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n width: 110px;\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 display: grid;\r\n\r\n .firstLine {\r\n display: grid;\r\n grid-template-columns: 1fr auto 20px;\r\n height: 30px;\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: 30px;\r\n display: grid;\r\n align-items: center;\r\n justify-items: stretch;\r\n padding-bottom: 5px;\r\n\r\n &.disabled {\r\n opacity: 0.3;\r\n }\r\n\r\n input[type=\"file\"] {\r\n display: none;\r\n }\r\n\r\n .file-upload {\r\n background: #222222;\r\n border: 1px solid rgb(51, 122, 183);\r\n margin: 5px 10px;\r\n color: white;\r\n padding: 4px 5px;\r\n padding-top: 0px;\r\n opacity: 0.9;\r\n cursor: pointer;\r\n text-align: center;\r\n }\r\n\r\n .file-upload:hover {\r\n opacity: 1;\r\n }\r\n\r\n .file-upload:active {\r\n transform: scale(0.98);\r\n transform-origin: 0.5 0.5;\r\n }\r\n\r\n button {\r\n background: #222222;\r\n border: 1px solid rgb(51, 122, 183);\r\n margin: 5px 10px 5px 10px;\r\n color: white;\r\n padding: 4px 5px;\r\n opacity: 0.9;\r\n }\r\n\r\n button:hover {\r\n opacity: 1;\r\n }\r\n\r\n button:active {\r\n background: #282828;\r\n }\r\n\r\n button:focus {\r\n border: 1px solid rgb(51, 122, 183);\r\n outline: 0px;\r\n }\r\n }\r\n\r\n .checkBoxLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\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 .checkBox {\r\n grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n .lbl {\r\n position: relative;\r\n display: block;\r\n height: 14px;\r\n width: 34px;\r\n margin-right: 5px;\r\n background: #898989;\r\n border-radius: 100px;\r\n cursor: pointer;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .lbl:after {\r\n position: absolute;\r\n left: 3px;\r\n top: 2px;\r\n display: block;\r\n width: 10px;\r\n height: 10px;\r\n border-radius: 100px;\r\n background: #fff;\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 }\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: rgb(51, 122, 183);\r\n }\r\n\r\n .cbx:checked ~ label:after {\r\n left: 20px;\r\n background: rgb(22, 73, 117);\r\n }\r\n\r\n .cbx:checked ~ label.disabled {\r\n background: rgb(22, 73, 117);\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 height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\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 .options {\r\n grid-column: 2;\r\n\r\n display: flex;\r\n align-items: center;\r\n margin-right: 5px;\r\n\r\n select {\r\n width: 115px;\r\n }\r\n }\r\n }\r\n\r\n .color3Line {\r\n padding-left: $line-padding-left;\r\n display: grid;\r\n\r\n .firstLine {\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto 0px 20px 20px;\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 .textInputLine {\r\n display: none;\r\n }\r\n\r\n .color3 {\r\n grid-column: 2;\r\n width: 50px;\r\n\r\n display: flex;\r\n align-items: center;\r\n\r\n input {\r\n margin-right: 5px;\r\n }\r\n }\r\n\r\n .copy {\r\n grid-column: 4;\r\n display: grid;\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: 24px;\r\n }\r\n }\r\n\r\n .expand {\r\n grid-column: 5;\r\n display: grid;\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 height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto;\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 .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 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: 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}\r\n"],"sourceRoot":""}]);
|
|
147
147
|
// Exports
|
|
148
148
|
___CSS_LOADER_EXPORT___.locals = {};
|
|
149
149
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
|
|
@@ -61676,7 +61676,12 @@ class HexColor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
61676
61676
|
}
|
|
61677
61677
|
this.setState({ hex: valueString });
|
|
61678
61678
|
if (valueString.length !== this.props.expectedLength) {
|
|
61679
|
-
|
|
61679
|
+
if (this.props.expectedLength === 8 && valueString.length === 6) {
|
|
61680
|
+
valueString = valueString + "FF";
|
|
61681
|
+
}
|
|
61682
|
+
else {
|
|
61683
|
+
return;
|
|
61684
|
+
}
|
|
61680
61685
|
}
|
|
61681
61686
|
this.props.onChange("#" + valueString);
|
|
61682
61687
|
}
|
|
@@ -61788,10 +61793,8 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
61788
61793
|
/* harmony import */ var _fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @fortawesome/react-fontawesome */ "../../../../node_modules/@fortawesome/react-fontawesome/index.es.js");
|
|
61789
61794
|
/* harmony import */ var _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @fortawesome/free-solid-svg-icons */ "../../../../node_modules/@fortawesome/free-solid-svg-icons/index.es.js");
|
|
61790
61795
|
/* harmony import */ var _colorPickerComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./colorPickerComponent */ "../../../dev/sharedUiComponents/dist/lines/colorPickerComponent.js");
|
|
61791
|
-
/* harmony import */ var
|
|
61792
|
-
/* harmony import */ var
|
|
61793
|
-
/* harmony import */ var _copy_svg__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./copy.svg */ "../../../dev/sharedUiComponents/dist/lines/copy.svg");
|
|
61794
|
-
|
|
61796
|
+
/* harmony import */ var _targetsProxy__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./targetsProxy */ "../../../dev/sharedUiComponents/dist/lines/targetsProxy.js");
|
|
61797
|
+
/* harmony import */ var _copy_svg__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./copy.svg */ "../../../dev/sharedUiComponents/dist/lines/copy.svg");
|
|
61795
61798
|
|
|
61796
61799
|
|
|
61797
61800
|
|
|
@@ -61831,7 +61834,7 @@ class ColorLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
61831
61834
|
if (!property)
|
|
61832
61835
|
return emptyColor;
|
|
61833
61836
|
if (typeof property === "string") {
|
|
61834
|
-
if (property ===
|
|
61837
|
+
if (property === _targetsProxy__WEBPACK_IMPORTED_MODULE_7__.conflictingValuesPlaceholder) {
|
|
61835
61838
|
return emptyColor;
|
|
61836
61839
|
}
|
|
61837
61840
|
return this._convertToColor(property);
|
|
@@ -61933,9 +61936,7 @@ class ColorLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
61933
61936
|
const chevron = this.state.isExpanded ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_4__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_5__.faMinus }) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_4__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_5__.faPlus });
|
|
61934
61937
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "color3Line" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "firstLine" }, { children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "label", title: this.props.label }, { children: this.props.label })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color3" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_colorPickerComponent__WEBPACK_IMPORTED_MODULE_6__.ColorPickerLineComponent, { lockObject: this.props.lockObject, linearHint: this.props.isLinear, value: this.props.disableAlpha ? this._toColor3(this.state.color) : this.state.color, onColorChanged: (colorString) => {
|
|
61935
61938
|
this.setColorFromString(colorString);
|
|
61936
|
-
} }) })), this.props.lockObject
|
|
61937
|
-
this.setColorFromString(newValue);
|
|
61938
|
-
}, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "copy hoverIcon", onClick: () => this.copyToClipboard(), title: "Copy to clipboard" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _copy_svg__WEBPACK_IMPORTED_MODULE_9__, alt: "Copy" }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand" }, { children: chevron }))] })), this.state.isExpanded && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "r", value: this.state.color.r, onChange: (value) => this.updateStateR(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "g", value: this.state.color.g, onChange: (value) => this.updateStateG(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "b", value: this.state.color.b, onChange: (value) => this.updateStateB(value) }), this.props.disableAlpha || ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "a", value: this.state.color.a, onChange: (value) => this.updateStateA(value) }))] })))] })));
|
|
61939
|
+
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "copy hoverIcon", onClick: () => this.copyToClipboard(), title: "Copy to clipboard" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _copy_svg__WEBPACK_IMPORTED_MODULE_8__, alt: "Copy" }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand" }, { children: chevron }))] })), this.state.isExpanded && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "r", value: this.state.color.r, onChange: (value) => this.updateStateR(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "g", value: this.state.color.g, onChange: (value) => this.updateStateG(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "b", value: this.state.color.b, onChange: (value) => this.updateStateB(value) }), this.props.disableAlpha || ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_numericInputComponent__WEBPACK_IMPORTED_MODULE_3__.NumericInputComponent, { lockObject: this.props.lockObject, label: "a", value: this.state.color.a, onChange: (value) => this.updateStateA(value) }))] })))] })));
|
|
61939
61940
|
}
|
|
61940
61941
|
}
|
|
61941
61942
|
|
|
@@ -62203,7 +62204,7 @@ class FloatLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
62203
62204
|
this.props.onDragStop(valueAsNumber);
|
|
62204
62205
|
}
|
|
62205
62206
|
this.setState({ dragging: newDragging });
|
|
62206
|
-
} }))] })), this.props.unit] }))), this.props.useEuler && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sliderLineComponent__WEBPACK_IMPORTED_MODULE_2__.SliderLineComponent, { label: this.props.label, minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Tools.ToDegrees(valueAsNumber), onChange: (value) => this.updateValue(core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Tools.ToRadians(value).toString()) }))] }));
|
|
62207
|
+
} }))] })), this.props.unit] }))), this.props.useEuler && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sliderLineComponent__WEBPACK_IMPORTED_MODULE_2__.SliderLineComponent, { lockObject: this.props.lockObject, label: this.props.label, minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Tools.ToDegrees(valueAsNumber), onChange: (value) => this.updateValue(core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Tools.ToRadians(value).toString()) }))] }));
|
|
62207
62208
|
}
|
|
62208
62209
|
}
|
|
62209
62210
|
|
|
@@ -62383,7 +62384,7 @@ class MatrixLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
62383
62384
|
if (this.props.onModeChange) {
|
|
62384
62385
|
this.props.onModeChange(value);
|
|
62385
62386
|
}
|
|
62386
|
-
} }) })), this.state.mode === 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #0", value: this.state.value.getRow(0), onChange: (value) => this.updateRow(value, 0) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #1", value: this.state.value.getRow(1), onChange: (value) => this.updateRow(value, 1) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #2", value: this.state.value.getRow(2), onChange: (value) => this.updateRow(value, 2) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #3", value: this.state.value.getRow(3), onChange: (value) => this.updateRow(value, 3) })] }))), this.state.mode !== 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "secondLine" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { label: "Angle", minimum: 0, maximum: 2 * Math.PI, useEuler: true, step: 0.1, directValue: this.state.angle, onChange: (value) => this.updateBasedOnMode(value) }) })))] })));
|
|
62387
|
+
} }) })), this.state.mode === 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #0", value: this.state.value.getRow(0), onChange: (value) => this.updateRow(value, 0) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #1", value: this.state.value.getRow(1), onChange: (value) => this.updateRow(value, 1) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #2", value: this.state.value.getRow(2), onChange: (value) => this.updateRow(value, 2) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_vector4LineComponent__WEBPACK_IMPORTED_MODULE_3__.Vector4LineComponent, { lockObject: this.props.lockObject, label: "Row #3", value: this.state.value.getRow(3), onChange: (value) => this.updateRow(value, 3) })] }))), this.state.mode !== 0 && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "secondLine" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { label: "Angle", lockObject: this.props.lockObject, minimum: 0, maximum: 2 * Math.PI, useEuler: true, step: 0.1, directValue: this.state.angle, onChange: (value) => this.updateBasedOnMode(value) }) })))] })));
|
|
62387
62388
|
}
|
|
62388
62389
|
}
|
|
62389
62390
|
|
|
@@ -62799,7 +62800,7 @@ class TextInputLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
62799
62800
|
}
|
|
62800
62801
|
return 0;
|
|
62801
62802
|
}
|
|
62802
|
-
updateValue(value) {
|
|
62803
|
+
updateValue(value, valueToValidate) {
|
|
62803
62804
|
if (this.props.numbersOnly) {
|
|
62804
62805
|
if (/[^0-9.\p\x%-]/g.test(value)) {
|
|
62805
62806
|
return;
|
|
@@ -62827,8 +62828,8 @@ class TextInputLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
62827
62828
|
}
|
|
62828
62829
|
this._localChange = true;
|
|
62829
62830
|
const store = this.props.value !== undefined ? this.props.value : this.props.target[this.props.propertyName];
|
|
62830
|
-
if (this.props.validator) {
|
|
62831
|
-
if (this.props.validator(
|
|
62831
|
+
if (this.props.validator && valueToValidate) {
|
|
62832
|
+
if (this.props.validator(valueToValidate) == false) {
|
|
62832
62833
|
value = store;
|
|
62833
62834
|
}
|
|
62834
62835
|
}
|
|
@@ -62875,15 +62876,15 @@ class TextInputLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Componen
|
|
|
62875
62876
|
}
|
|
62876
62877
|
this.updateValue(this.state.value);
|
|
62877
62878
|
}, onBlur: (evt) => {
|
|
62878
|
-
this.updateValue(evt.target.value);
|
|
62879
|
+
this.updateValue(evt.target.value, evt.target.value);
|
|
62879
62880
|
if (this.props.lockObject) {
|
|
62880
62881
|
this.props.lockObject.lock = false;
|
|
62881
62882
|
}
|
|
62882
|
-
} }) })), !this.props.multilines && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: `value${this.props.noUnderline === true ? " noUnderline" : ""}${this.props.arrows ? " hasArrows" : ""}${this.state.dragging ? " dragging" : ""}` }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { value: value, onBlur: () => {
|
|
62883
|
+
} }) })), !this.props.multilines && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: `value${this.props.noUnderline === true ? " noUnderline" : ""}${this.props.arrows ? " hasArrows" : ""}${this.state.dragging ? " dragging" : ""}` }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { value: value, onBlur: (evt) => {
|
|
62883
62884
|
if (this.props.lockObject) {
|
|
62884
62885
|
this.props.lockObject.lock = false;
|
|
62885
62886
|
}
|
|
62886
|
-
this.updateValue((this.props.value !== undefined ? this.props.value : this.props.target[this.props.propertyName]) || "");
|
|
62887
|
+
this.updateValue((this.props.value !== undefined ? this.props.value : this.props.target[this.props.propertyName]) || "", evt.target.value);
|
|
62887
62888
|
}, onFocus: () => {
|
|
62888
62889
|
if (this.props.lockObject) {
|
|
62889
62890
|
this.props.lockObject.lock = true;
|
|
@@ -63111,7 +63112,7 @@ class Vector3LineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
63111
63112
|
render() {
|
|
63112
63113
|
const chevron = this.state.isExpanded ? (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_3__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_4__.faMinus }) : (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_fortawesome_react_fontawesome__WEBPACK_IMPORTED_MODULE_3__.FontAwesomeIcon, { icon: _fortawesome_free_solid_svg_icons__WEBPACK_IMPORTED_MODULE_4__.faPlus });
|
|
63113
63114
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "vector3Line" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "firstLine" }, { children: [this.props.icon && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: this.props.icon, title: this.props.iconLabel, alt: this.props.iconLabel, className: "icon" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "label", title: this.props.label }, { children: this.props.label })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "vector" }, { children: [!this.props.useEuler && `X: ${this.state.value.x.toFixed(2)}, Y: ${this.state.value.y.toFixed(2)}, Z: ${this.state.value.z.toFixed(2)}`, this.props.useEuler &&
|
|
63114
|
-
`X: ${core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.x).toFixed(2)}, Y: ${core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.y).toFixed(2)}, Z: ${core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.z).toFixed(2)}`] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand" }, { children: chevron }))] })), this.state.isExpanded && !this.props.useEuler && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "x", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.x, onChange: (value) => this.updateStateX(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "y", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.y, onChange: (value) => this.updateStateY(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "z", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.z, onChange: (value) => this.updateStateZ(value) })] }))), this.state.isExpanded && this.props.useEuler && !this.props.noSlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { margin: true, label: "x", minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.x), onChange: (value) => this.updateStateX(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { margin: true, label: "y", minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.y), onChange: (value) => this.updateStateY(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { margin: true, label: "z", minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.z), onChange: (value) => this.updateStateZ(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) })] }))), this.state.isExpanded && this.props.useEuler && this.props.noSlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "x", step: this.props.step, value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.x), onChange: (value) => this.updateStateX(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "y", step: this.props.step, value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.y), onChange: (value) => this.updateStateY(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "z", step: this.props.step, value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.z), onChange: (value) => this.updateStateZ(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) })] })))] })));
|
|
63115
|
+
`X: ${core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.x).toFixed(2)}, Y: ${core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.y).toFixed(2)}, Z: ${core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.z).toFixed(2)}`] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "expand hoverIcon", onClick: () => this.switchExpandState(), title: "Expand" }, { children: chevron }))] })), this.state.isExpanded && !this.props.useEuler && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "x", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.x, onChange: (value) => this.updateStateX(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "y", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.y, onChange: (value) => this.updateStateY(value) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { label: "z", lockObject: this.props.lockObject, step: this.props.step, value: this.state.value.z, onChange: (value) => this.updateStateZ(value) })] }))), this.state.isExpanded && this.props.useEuler && !this.props.noSlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { lockObject: this.props.lockObject, margin: true, label: "x", minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.x), onChange: (value) => this.updateStateX(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { lockObject: this.props.lockObject, margin: true, label: "y", minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.y), onChange: (value) => this.updateStateY(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_5__.SliderLineComponent, { lockObject: this.props.lockObject, margin: true, label: "z", minimum: 0, maximum: 360, step: 0.1, directValue: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.z), onChange: (value) => this.updateStateZ(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) })] }))), this.state.isExpanded && this.props.useEuler && this.props.noSlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "secondLine" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "x", step: this.props.step, value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.x), onChange: (value) => this.updateStateX(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "y", step: this.props.step, value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.y), onChange: (value) => this.updateStateY(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_numericInputComponent__WEBPACK_IMPORTED_MODULE_2__.NumericInputComponent, { lockObject: this.props.lockObject, label: "z", step: this.props.step, value: core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToDegrees(this.state.value.z), onChange: (value) => this.updateStateZ(core_Misc_tools__WEBPACK_IMPORTED_MODULE_6__.Tools.ToRadians(value)) })] })))] })));
|
|
63115
63116
|
}
|
|
63116
63117
|
}
|
|
63117
63118
|
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
@@ -63585,14 +63586,45 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
63585
63586
|
}
|
|
63586
63587
|
return false;
|
|
63587
63588
|
}
|
|
63589
|
+
populateConnectedEntriesBeforeRemoval(item, items, inputs, outputs) {
|
|
63590
|
+
inputs.push(...item.content.inputs.filter((i) => i.isConnected && items.every((selected) => { var _a; return selected.content.data !== ((_a = i.connectedPort) === null || _a === void 0 ? void 0 : _a.ownerData); })).map((i) => i.connectedPort));
|
|
63591
|
+
outputs.push(...item.content.outputs
|
|
63592
|
+
.filter((i) => i.isConnected)
|
|
63593
|
+
.map((i) => i.endpoints)
|
|
63594
|
+
.flat()
|
|
63595
|
+
.filter((i) => i && items.every((selected) => selected.content.data !== i.ownerData)));
|
|
63596
|
+
}
|
|
63597
|
+
automaticRewire(inputs, outputs) {
|
|
63598
|
+
if (outputs.length && inputs.length) {
|
|
63599
|
+
inputs.forEach((input) => {
|
|
63600
|
+
if (!input) {
|
|
63601
|
+
return;
|
|
63602
|
+
}
|
|
63603
|
+
const output = outputs[0];
|
|
63604
|
+
if (output && input.canConnectTo(output)) {
|
|
63605
|
+
const nodeInput = this.findNodeFromData(input.ownerData);
|
|
63606
|
+
const nodeOutput = this.findNodeFromData(output.ownerData);
|
|
63607
|
+
this.connectNodes(nodeInput, input, nodeOutput, output);
|
|
63608
|
+
outputs.shift();
|
|
63609
|
+
}
|
|
63610
|
+
});
|
|
63611
|
+
}
|
|
63612
|
+
}
|
|
63588
63613
|
handleKeyDown(evt, onRemove, mouseLocationX, mouseLocationY, dataGenerator, rootElement) {
|
|
63589
63614
|
if ((evt.keyCode === 46 || evt.keyCode === 8) && !this.props.stateManager.lockObject.lock) {
|
|
63590
63615
|
// Delete
|
|
63591
63616
|
const selectedItems = this.selectedNodes;
|
|
63592
|
-
|
|
63593
|
-
|
|
63594
|
-
|
|
63595
|
-
|
|
63617
|
+
const inputs = [];
|
|
63618
|
+
const outputs = [];
|
|
63619
|
+
if (selectedItems.length > 0) {
|
|
63620
|
+
for (const selectedItem of selectedItems) {
|
|
63621
|
+
if (evt.altKey) {
|
|
63622
|
+
this.populateConnectedEntriesBeforeRemoval(selectedItem, selectedItems, inputs, outputs);
|
|
63623
|
+
}
|
|
63624
|
+
selectedItem.dispose();
|
|
63625
|
+
onRemove(selectedItem.content);
|
|
63626
|
+
this.removeDataFromCache(selectedItem.content.data);
|
|
63627
|
+
}
|
|
63596
63628
|
}
|
|
63597
63629
|
if (this.selectedLink) {
|
|
63598
63630
|
this.selectedLink.dispose();
|
|
@@ -63615,6 +63647,8 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
63615
63647
|
frame.dispose();
|
|
63616
63648
|
}
|
|
63617
63649
|
}
|
|
63650
|
+
// Reconnect if required
|
|
63651
|
+
this.automaticRewire(inputs, outputs);
|
|
63618
63652
|
this.props.stateManager.onSelectionChangedObservable.notifyObservers(null);
|
|
63619
63653
|
this.props.stateManager.onRebuildRequiredObservable.notifyObservers(false);
|
|
63620
63654
|
return;
|
|
@@ -63742,7 +63776,7 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
63742
63776
|
continue;
|
|
63743
63777
|
}
|
|
63744
63778
|
const sourceContent = this.findNodeFromData(sourceInput.connectedPort.ownerData).content;
|
|
63745
|
-
const activeNodes = sourceNodes.filter((s) => s.content
|
|
63779
|
+
const activeNodes = sourceNodes.filter((s) => s.content === sourceContent);
|
|
63746
63780
|
if (activeNodes.length > 0) {
|
|
63747
63781
|
const activeNode = activeNodes[0];
|
|
63748
63782
|
const indexInList = sourceNodes.indexOf(activeNode);
|
|
@@ -63751,7 +63785,7 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
63751
63785
|
// Then reconnect
|
|
63752
63786
|
const outputIndex = sourceContent.outputs.indexOf(sourceInput.connectedPort);
|
|
63753
63787
|
const newOutput = newNodes[indexInList].content.data.outputs[outputIndex];
|
|
63754
|
-
newOutput.connectTo(currentInput);
|
|
63788
|
+
newOutput.connectTo(currentInput.data);
|
|
63755
63789
|
}
|
|
63756
63790
|
else {
|
|
63757
63791
|
// Connect with outside nodes
|
|
@@ -63773,6 +63807,14 @@ class GraphCanvasComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
63773
63807
|
}
|
|
63774
63808
|
createNodeFromObject(nodeData, onNodeCreated, recursion = true) {
|
|
63775
63809
|
if (this._nodeDataContentList.indexOf(nodeData.data) !== -1) {
|
|
63810
|
+
// Links
|
|
63811
|
+
if (nodeData.inputs.length && recursion) {
|
|
63812
|
+
for (const input of nodeData.inputs) {
|
|
63813
|
+
if (input.isConnected) {
|
|
63814
|
+
this.connectPorts(input.connectedPort, input);
|
|
63815
|
+
}
|
|
63816
|
+
}
|
|
63817
|
+
}
|
|
63776
63818
|
return this.nodes.filter((n) => n.content.data === nodeData.data)[0];
|
|
63777
63819
|
}
|
|
63778
63820
|
onNodeCreated(nodeData.data);
|
|
@@ -65670,7 +65712,7 @@ class GraphFrame {
|
|
|
65670
65712
|
}
|
|
65671
65713
|
export() {
|
|
65672
65714
|
const state = this._ownerCanvas.stateManager;
|
|
65673
|
-
const json = state.exportData(state.data);
|
|
65715
|
+
const json = state.exportData(state.data, this);
|
|
65674
65716
|
_stringTools__WEBPACK_IMPORTED_MODULE_2__.StringTools.DownloadAsFile(state.hostDocument, json, this._name + ".json");
|
|
65675
65717
|
}
|
|
65676
65718
|
adjustPorts() {
|
|
@@ -65751,14 +65793,12 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
65751
65793
|
/* harmony export */ });
|
|
65752
65794
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
65753
65795
|
/* harmony import */ var _nodePort__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./nodePort */ "../../../dev/sharedUiComponents/dist/nodeGraphSystem/nodePort.js");
|
|
65754
|
-
/* harmony import */ var _imgs_triangle_svg__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../imgs/triangle.svg */ "../../../dev/sharedUiComponents/dist/imgs/triangle.svg");
|
|
65755
65796
|
/* harmony import */ var _propertyLedger__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./propertyLedger */ "../../../dev/sharedUiComponents/dist/nodeGraphSystem/propertyLedger.js");
|
|
65756
65797
|
/* harmony import */ var _displayLedger__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./displayLedger */ "../../../dev/sharedUiComponents/dist/nodeGraphSystem/displayLedger.js");
|
|
65757
65798
|
|
|
65758
65799
|
|
|
65759
65800
|
|
|
65760
65801
|
|
|
65761
|
-
|
|
65762
65802
|
class GraphNode {
|
|
65763
65803
|
constructor(content, stateManager) {
|
|
65764
65804
|
this.content = content;
|
|
@@ -66007,14 +66047,7 @@ class GraphNode {
|
|
|
66007
66047
|
}
|
|
66008
66048
|
this._comments.innerHTML = this.content.comments || "";
|
|
66009
66049
|
this._comments.title = this.content.comments || "";
|
|
66010
|
-
|
|
66011
|
-
if (warningMessage) {
|
|
66012
|
-
this._warning.classList.add("visible");
|
|
66013
|
-
this._warning.title = warningMessage;
|
|
66014
|
-
}
|
|
66015
|
-
else {
|
|
66016
|
-
this._warning.classList.remove("visible");
|
|
66017
|
-
}
|
|
66050
|
+
this.content.prepareHeaderIcon(this._headerIcon, this._headerIconImg);
|
|
66018
66051
|
}
|
|
66019
66052
|
_onDown(evt) {
|
|
66020
66053
|
// Check if this is coming from the port
|
|
@@ -66095,12 +66128,11 @@ class GraphNode {
|
|
|
66095
66128
|
this._header = root.ownerDocument.createElement("div");
|
|
66096
66129
|
this._header.classList.add("header");
|
|
66097
66130
|
this._headerContainer.appendChild(this._header);
|
|
66098
|
-
this.
|
|
66099
|
-
this.
|
|
66100
|
-
|
|
66101
|
-
|
|
66102
|
-
this.
|
|
66103
|
-
this._visual.appendChild(this._warning);
|
|
66131
|
+
this._headerIcon = root.ownerDocument.createElement("div");
|
|
66132
|
+
this._headerIcon.classList.add("headerIcon");
|
|
66133
|
+
this._headerIconImg = root.ownerDocument.createElement("img");
|
|
66134
|
+
this._headerIcon.appendChild(this._headerIconImg);
|
|
66135
|
+
this._visual.appendChild(this._headerIcon);
|
|
66104
66136
|
const selectionBorder = root.ownerDocument.createElement("div");
|
|
66105
66137
|
selectionBorder.classList.add("selection-border");
|
|
66106
66138
|
this._visual.appendChild(selectionBorder);
|
|
@@ -67984,6 +68016,12 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
67984
68016
|
class PreviewAreaComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
67985
68017
|
constructor(props) {
|
|
67986
68018
|
super(props);
|
|
68019
|
+
this._onPointerOverCanvas = () => {
|
|
68020
|
+
this.props.globalState.pointerOverCanvas = true;
|
|
68021
|
+
};
|
|
68022
|
+
this._onPointerOutCanvas = () => {
|
|
68023
|
+
this.props.globalState.pointerOverCanvas = false;
|
|
68024
|
+
};
|
|
67987
68025
|
this.state = { isLoading: true };
|
|
67988
68026
|
this._onIsLoadingChangedObserver = this.props.globalState.onIsLoadingChanged.add((state) => this.setState({ isLoading: state }));
|
|
67989
68027
|
this._onResetRequiredObserver = this.props.globalState.onResetRequiredObservable.add(() => {
|
|
@@ -68023,7 +68061,7 @@ class PreviewAreaComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
68023
68061
|
{ label: "OneOne", value: core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_2__.ParticleSystem.BLENDMODE_ONEONE },
|
|
68024
68062
|
{ label: "Standard", value: core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_2__.ParticleSystem.BLENDMODE_STANDARD },
|
|
68025
68063
|
];
|
|
68026
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "preview", style: { height: this.props.width + "px" } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("canvas", { id: "preview-canvas" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "waitPanel" + (this.state.isLoading ? "" : " hidden") }, { children: "Please wait, loading..." }))] })), this.props.globalState.mode === core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_2__.NodeMaterialModes.Particle && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ id: "preview-config-bar", className: "extended" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_8__.OptionsLineComponent, { label: "Blend mode", options: blendModeOptions, target: this.props.globalState, propertyName: "particleSystemBlendMode", noDirectUpdate: true, onSelect: (value) => {
|
|
68064
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "preview", style: { height: this.props.width + "px" } }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("canvas", { onPointerOver: this._onPointerOverCanvas, onPointerOut: this._onPointerOutCanvas, id: "preview-canvas" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "waitPanel" + (this.state.isLoading ? "" : " hidden") }, { children: "Please wait, loading..." }))] })), this.props.globalState.mode === core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_2__.NodeMaterialModes.Particle && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ id: "preview-config-bar", className: "extended" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_8__.OptionsLineComponent, { label: "Blend mode", options: blendModeOptions, target: this.props.globalState, propertyName: "particleSystemBlendMode", noDirectUpdate: true, onSelect: (value) => {
|
|
68027
68065
|
this.changeParticleSystemBlendMode(value);
|
|
68028
68066
|
} }) }))), this.props.globalState.mode === core_Misc_dataStorage__WEBPACK_IMPORTED_MODULE_2__.NodeMaterialModes.Material && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ id: "preview-config-bar" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ title: "Render without back face culling", onClick: () => this.changeBackFaceCulling(!this.props.globalState.backFaceCulling), className: "button back-face" + (!this.props.globalState.backFaceCulling ? " selected" : "") }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _svgs_doubleSided_svg__WEBPACK_IMPORTED_MODULE_3__, alt: "" }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ title: "Render with depth pre-pass", onClick: () => this.changeDepthPrePass(!this.props.globalState.depthPrePass), className: "button depth-pass" + (this.props.globalState.depthPrePass ? " selected" : "") }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { src: _svgs_depthPass_svg__WEBPACK_IMPORTED_MODULE_4__, alt: "" }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ title: "Turn on/off hemispheric light", onClick: () => {
|
|
68029
68067
|
this.props.globalState.hemisphericLight = !this.props.globalState.hemisphericLight;
|
|
@@ -68745,7 +68783,7 @@ class InputsPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Comp
|
|
|
68745
68783
|
const cantDisplaySlider = isNaN(block.min) || isNaN(block.max) || block.min === block.max;
|
|
68746
68784
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [block.isBoolean && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_3__.CheckBoxLineComponent, { label: block.name, target: block, propertyName: "value", onValueChanged: () => {
|
|
68747
68785
|
this.processInputBlockUpdate(block);
|
|
68748
|
-
} }, block.uniqueId)), !block.isBoolean && cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_11__.FloatLineComponent, { label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId)), !block.isBoolean && !cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_12__.SliderLineComponent, { label: block.name, target: block, propertyName: "value", step: (block.max - block.min) / 100.0, minimum: block.min, maximum: block.max, onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId))] }, block.uniqueId));
|
|
68786
|
+
} }, block.uniqueId)), !block.isBoolean && cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_11__.FloatLineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId)), !block.isBoolean && !cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_12__.SliderLineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", step: (block.max - block.min) / 100.0, minimum: block.min, maximum: block.max, onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId))] }, block.uniqueId));
|
|
68749
68787
|
}
|
|
68750
68788
|
case core_Materials_Node_Enums_nodeMaterialBlockConnectionPointTypes__WEBPACK_IMPORTED_MODULE_4__.NodeMaterialBlockConnectionPointTypes.Color3:
|
|
68751
68789
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_9__.Color3LineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId));
|
|
@@ -68848,7 +68886,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
68848
68886
|
|
|
68849
68887
|
class FloatPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
68850
68888
|
render() {
|
|
68851
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_2__.FloatLineComponent, { label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
68889
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_2__.FloatLineComponent, { lockObject: this.props.globalState.lockObject, label: "Value", target: this.props.inputBlock, propertyName: "value", onChange: () => {
|
|
68852
68890
|
if (this.props.inputBlock.isConstant) {
|
|
68853
68891
|
this.props.globalState.stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
68854
68892
|
}
|
|
@@ -69096,7 +69134,7 @@ class PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
69096
69134
|
const cantDisplaySlider = isNaN(block.min) || isNaN(block.max) || block.min === block.max;
|
|
69097
69135
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", { children: [block.isBoolean && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__.CheckBoxLineComponent, { label: block.name, target: block, propertyName: "value", onValueChanged: () => {
|
|
69098
69136
|
this.processInputBlockUpdate(block);
|
|
69099
|
-
} }, block.uniqueId)), !block.isBoolean && cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_28__.FloatLineComponent, { label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId)), !block.isBoolean && !cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_29__.SliderLineComponent, { label: block.name, target: block, propertyName: "value", step: (block.max - block.min) / 100.0, minimum: block.min, maximum: block.max, onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId))] }, block.uniqueId));
|
|
69137
|
+
} }, block.uniqueId)), !block.isBoolean && cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_28__.FloatLineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId)), !block.isBoolean && !cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_29__.SliderLineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", step: (block.max - block.min) / 100.0, minimum: block.min, maximum: block.max, onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId))] }, block.uniqueId));
|
|
69100
69138
|
}
|
|
69101
69139
|
case core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.NodeMaterialBlockConnectionPointTypes.Color3:
|
|
69102
69140
|
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_23__.Color3LineComponent, { lockObject: this.props.lockObject, label: block.name, target: block, propertyName: "value", onChange: () => this.processInputBlockUpdate(block) }, block.uniqueId));
|
|
@@ -69304,7 +69342,7 @@ class PropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
69304
69342
|
this.props.globalState.onReOrganizedRequiredObservable.notifyObservers();
|
|
69305
69343
|
} })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_2__.LineContainerComponent, Object.assign({ title: "OPTIONS" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_7__.CheckBoxLineComponent, { label: "Embed textures when saving", isSelected: () => core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.DataStorage.ReadBoolean("EmbedTextures", true), onSelect: (value) => {
|
|
69306
69344
|
core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.DataStorage.WriteBoolean("EmbedTextures", value);
|
|
69307
|
-
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_29__.SliderLineComponent, { label: "Grid size", minimum: 0, maximum: 100, step: 5, decimalCount: 0, directValue: gridSize, onChange: (value) => {
|
|
69345
|
+
} }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_29__.SliderLineComponent, { lockObject: this.props.lockObject, label: "Grid size", minimum: 0, maximum: 100, step: 5, decimalCount: 0, directValue: gridSize, onChange: (value) => {
|
|
69308
69346
|
core_Misc_tools__WEBPACK_IMPORTED_MODULE_5__.DataStorage.WriteNumber("GridSize", value);
|
|
69309
69347
|
this.props.globalState.stateManager.onGridSizeChanged.notifyObservers();
|
|
69310
69348
|
this.forceUpdate();
|
|
@@ -69380,6 +69418,7 @@ class GlobalState {
|
|
|
69380
69418
|
this.particleSystemBlendMode = core_Misc_observable__WEBPACK_IMPORTED_MODULE_0__.ParticleSystem.BLENDMODE_ONEONE;
|
|
69381
69419
|
this.listOfCustomPreviewFiles = [];
|
|
69382
69420
|
this.lockObject = new shared_ui_components_tabs_propertyGrids_lockObject__WEBPACK_IMPORTED_MODULE_4__.LockObject();
|
|
69421
|
+
this.pointerOverCanvas = false;
|
|
69383
69422
|
this.previewType = core_Misc_observable__WEBPACK_IMPORTED_MODULE_0__.DataStorage.ReadNumber("PreviewType", _components_preview_previewType__WEBPACK_IMPORTED_MODULE_1__.PreviewType.Box);
|
|
69384
69423
|
this.backFaceCulling = core_Misc_observable__WEBPACK_IMPORTED_MODULE_0__.DataStorage.ReadBoolean("BackFaceCulling", true);
|
|
69385
69424
|
this.depthPrePass = core_Misc_observable__WEBPACK_IMPORTED_MODULE_0__.DataStorage.ReadBoolean("DepthPrePass", false);
|
|
@@ -69476,6 +69515,22 @@ class GraphEditor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
69476
69515
|
this._rightWidth = core_Materials_Node_nodeMaterialBlock__WEBPACK_IMPORTED_MODULE_2__.DataStorage.ReadNumber("RightWidth", 300);
|
|
69477
69516
|
this._mouseLocationX = 0;
|
|
69478
69517
|
this._mouseLocationY = 0;
|
|
69518
|
+
this.onWheel = (evt) => {
|
|
69519
|
+
if (this.props.globalState.pointerOverCanvas) {
|
|
69520
|
+
return evt.preventDefault();
|
|
69521
|
+
}
|
|
69522
|
+
if (evt.ctrlKey) {
|
|
69523
|
+
return evt.preventDefault();
|
|
69524
|
+
}
|
|
69525
|
+
if (Math.abs(evt.deltaX) < Math.abs(evt.deltaY)) {
|
|
69526
|
+
return;
|
|
69527
|
+
}
|
|
69528
|
+
const targetElem = evt.currentTarget;
|
|
69529
|
+
const scrollLeftMax = targetElem.scrollWidth - targetElem.offsetWidth;
|
|
69530
|
+
if (targetElem.scrollLeft + evt.deltaX < 0 || targetElem.scrollLeft + evt.deltaX > scrollLeftMax) {
|
|
69531
|
+
return evt.preventDefault();
|
|
69532
|
+
}
|
|
69533
|
+
};
|
|
69479
69534
|
this.handlePopUp = () => {
|
|
69480
69535
|
this.setState({
|
|
69481
69536
|
showPreviewPopUp: true,
|
|
@@ -69799,18 +69854,6 @@ class GraphEditor extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
|
69799
69854
|
this._moveInProgress = false;
|
|
69800
69855
|
evt.currentTarget.releasePointerCapture(evt.pointerId);
|
|
69801
69856
|
}
|
|
69802
|
-
onWheel(evt) {
|
|
69803
|
-
if (evt.ctrlKey) {
|
|
69804
|
-
return evt.preventDefault();
|
|
69805
|
-
}
|
|
69806
|
-
if (Math.abs(evt.deltaX) < Math.abs(evt.deltaY)) {
|
|
69807
|
-
return;
|
|
69808
|
-
}
|
|
69809
|
-
const scrollLeftMax = this.scrollWidth - this.offsetWidth;
|
|
69810
|
-
if (this.scrollLeft + evt.deltaX < 0 || this.scrollLeft + evt.deltaX > scrollLeftMax) {
|
|
69811
|
-
return evt.preventDefault();
|
|
69812
|
-
}
|
|
69813
|
-
}
|
|
69814
69857
|
resizeColumns(evt, forLeft = true) {
|
|
69815
69858
|
if (!this._moveInProgress) {
|
|
69816
69859
|
return;
|
|
@@ -69944,7 +69987,14 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
69944
69987
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
69945
69988
|
/* harmony export */ "BlockNodeData": () => (/* binding */ BlockNodeData)
|
|
69946
69989
|
/* harmony export */ });
|
|
69947
|
-
/* harmony import */ var
|
|
69990
|
+
/* harmony import */ var core_Materials_Node_Enums_nodeMaterialBlockTargets__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! core/Materials/Node/Enums/nodeMaterialBlockTargets */ "core/Misc/dataStorage");
|
|
69991
|
+
/* harmony import */ var core_Materials_Node_Enums_nodeMaterialBlockTargets__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(core_Materials_Node_Enums_nodeMaterialBlockTargets__WEBPACK_IMPORTED_MODULE_0__);
|
|
69992
|
+
/* harmony import */ var _connectionPointPortData__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./connectionPointPortData */ "../../../tools/nodeEditor/dist/graphSystem/connectionPointPortData.js");
|
|
69993
|
+
/* harmony import */ var _imgs_triangle_svg__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../imgs/triangle.svg */ "../../../tools/nodeEditor/dist/imgs/triangle.svg");
|
|
69994
|
+
/* harmony import */ var _imgs_square_svg__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../imgs/square.svg */ "../../../tools/nodeEditor/dist/imgs/square.svg");
|
|
69995
|
+
|
|
69996
|
+
|
|
69997
|
+
|
|
69948
69998
|
|
|
69949
69999
|
class BlockNodeData {
|
|
69950
70000
|
constructor(data, nodeContainer) {
|
|
@@ -69953,12 +70003,12 @@ class BlockNodeData {
|
|
|
69953
70003
|
this._outputs = [];
|
|
69954
70004
|
if (data.inputs) {
|
|
69955
70005
|
this.data.inputs.forEach((input) => {
|
|
69956
|
-
this._inputs.push(new
|
|
70006
|
+
this._inputs.push(new _connectionPointPortData__WEBPACK_IMPORTED_MODULE_1__.ConnectionPointPortData(input, nodeContainer));
|
|
69957
70007
|
});
|
|
69958
70008
|
}
|
|
69959
70009
|
if (data.outputs) {
|
|
69960
70010
|
this.data.outputs.forEach((output) => {
|
|
69961
|
-
this._outputs.push(new
|
|
70011
|
+
this._outputs.push(new _connectionPointPortData__WEBPACK_IMPORTED_MODULE_1__.ConnectionPointPortData(output, nodeContainer));
|
|
69962
70012
|
});
|
|
69963
70013
|
}
|
|
69964
70014
|
}
|
|
@@ -70002,11 +70052,24 @@ class BlockNodeData {
|
|
|
70002
70052
|
dispose() {
|
|
70003
70053
|
this.data.dispose();
|
|
70004
70054
|
}
|
|
70005
|
-
|
|
70006
|
-
if (this.data.getClassName()
|
|
70007
|
-
|
|
70055
|
+
prepareHeaderIcon(iconDiv, img) {
|
|
70056
|
+
if (this.data.getClassName() === "ElbowBlock") {
|
|
70057
|
+
iconDiv.classList.remove("visible");
|
|
70058
|
+
return;
|
|
70008
70059
|
}
|
|
70009
|
-
|
|
70060
|
+
if (this.data.target === core_Materials_Node_Enums_nodeMaterialBlockTargets__WEBPACK_IMPORTED_MODULE_0__.NodeMaterialBlockTargets.Fragment) {
|
|
70061
|
+
iconDiv.classList.add("visible");
|
|
70062
|
+
iconDiv.title = "In the fragment shader";
|
|
70063
|
+
img.src = _imgs_square_svg__WEBPACK_IMPORTED_MODULE_3__;
|
|
70064
|
+
return;
|
|
70065
|
+
}
|
|
70066
|
+
if (this.data.target === core_Materials_Node_Enums_nodeMaterialBlockTargets__WEBPACK_IMPORTED_MODULE_0__.NodeMaterialBlockTargets.Vertex) {
|
|
70067
|
+
iconDiv.classList.add("visible");
|
|
70068
|
+
iconDiv.title = "In the vertex shader";
|
|
70069
|
+
img.src = _imgs_triangle_svg__WEBPACK_IMPORTED_MODULE_2__;
|
|
70070
|
+
return;
|
|
70071
|
+
}
|
|
70072
|
+
iconDiv.classList.remove("visible");
|
|
70010
70073
|
}
|
|
70011
70074
|
}
|
|
70012
70075
|
|
|
@@ -70113,6 +70176,9 @@ class ConnectionPointPortData {
|
|
|
70113
70176
|
this.data.connectTo(port.data);
|
|
70114
70177
|
this._connectedPort = port;
|
|
70115
70178
|
}
|
|
70179
|
+
canConnectTo(port) {
|
|
70180
|
+
return this.data.canConnectTo(port.data);
|
|
70181
|
+
}
|
|
70116
70182
|
disconnectFrom(port) {
|
|
70117
70183
|
this.data.disconnectFrom(port.data);
|
|
70118
70184
|
port.connectedPort = null;
|
|
@@ -71131,15 +71197,15 @@ class GenericPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Com
|
|
|
71131
71197
|
case core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4__.PropertyTypeForEdition.Float: {
|
|
71132
71198
|
const cantDisplaySlider = isNaN(options.min) || isNaN(options.max) || options.min === options.max;
|
|
71133
71199
|
if (cantDisplaySlider) {
|
|
71134
|
-
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_9__.FloatLineComponent, { label: displayName, propertyName: propertyName, target: block, onChange: () => this.forceRebuild(options.notifiers) }));
|
|
71200
|
+
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_9__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: displayName, propertyName: propertyName, target: block, onChange: () => this.forceRebuild(options.notifiers) }));
|
|
71135
71201
|
}
|
|
71136
71202
|
else {
|
|
71137
|
-
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_10__.SliderLineComponent, { label: displayName, target: block, propertyName: propertyName, step: Math.abs(options.max - options.min) / 100.0, minimum: Math.min(options.min, options.max), maximum: options.max, onChange: () => this.forceRebuild(options.notifiers) }));
|
|
71203
|
+
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_10__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: displayName, target: block, propertyName: propertyName, step: Math.abs(options.max - options.min) / 100.0, minimum: Math.min(options.min, options.max), maximum: options.max, onChange: () => this.forceRebuild(options.notifiers) }));
|
|
71138
71204
|
}
|
|
71139
71205
|
break;
|
|
71140
71206
|
}
|
|
71141
71207
|
case core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4__.PropertyTypeForEdition.Int: {
|
|
71142
|
-
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_9__.FloatLineComponent, { digits: 0, step: "1", isInteger: true, label: displayName, propertyName: propertyName, target: block, onChange: () => this.forceRebuild(options.notifiers) }));
|
|
71208
|
+
components.push((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_9__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, digits: 0, step: "1", isInteger: true, label: displayName, propertyName: propertyName, target: block, onChange: () => this.forceRebuild(options.notifiers) }));
|
|
71143
71209
|
break;
|
|
71144
71210
|
}
|
|
71145
71211
|
case core_Materials_Node_nodeMaterialDecorator__WEBPACK_IMPORTED_MODULE_4__.PropertyTypeForEdition.Vector2: {
|
|
@@ -71301,10 +71367,10 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
71301
71367
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
71302
71368
|
/* harmony import */ var core_Maths_math_color__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! core/Maths/math.color */ "core/Misc/dataStorage");
|
|
71303
71369
|
/* harmony import */ var core_Maths_math_color__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(core_Maths_math_color__WEBPACK_IMPORTED_MODULE_2__);
|
|
71304
|
-
/* harmony import */ var
|
|
71305
|
-
/* harmony import */ var
|
|
71306
|
-
/* harmony import */ var
|
|
71307
|
-
/* harmony import */ var
|
|
71370
|
+
/* harmony import */ var _imgs_delete_svg__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../imgs/delete.svg */ "../../../tools/nodeEditor/dist/imgs/delete.svg");
|
|
71371
|
+
/* harmony import */ var _sharedComponents_copy_svg__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../sharedComponents/copy.svg */ "../../../tools/nodeEditor/dist/sharedComponents/copy.svg");
|
|
71372
|
+
/* harmony import */ var shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! shared-ui-components/lines/floatLineComponent */ "../../../dev/sharedUiComponents/dist/lines/floatLineComponent.js");
|
|
71373
|
+
/* harmony import */ var shared_ui_components_lines_colorPickerComponent__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! shared-ui-components/lines/colorPickerComponent */ "../../../dev/sharedUiComponents/dist/lines/colorPickerComponent.js");
|
|
71308
71374
|
|
|
71309
71375
|
|
|
71310
71376
|
|
|
@@ -71332,16 +71398,16 @@ class GradientStepComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
71332
71398
|
}
|
|
71333
71399
|
render() {
|
|
71334
71400
|
const step = this.props.step;
|
|
71335
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "gradient-step" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "step" }, { children: `#${this.props.lineIndex}` })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71401
|
+
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "gradient-step" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "step" }, { children: `#${this.props.lineIndex}` })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_colorPickerComponent__WEBPACK_IMPORTED_MODULE_6__.ColorPickerLineComponent, { lockObject: this.props.stateManager.lockObject, value: step.color, onColorChanged: (color) => {
|
|
71336
71402
|
this.updateColor(color);
|
|
71337
|
-
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "step-value" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(
|
|
71403
|
+
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "step-value" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_5__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, smallUI: true, label: "", target: step, propertyName: "step", min: 0, max: 1, onEnter: () => {
|
|
71338
71404
|
this.props.onUpdateStep();
|
|
71339
71405
|
this.props.onCheckForReOrder();
|
|
71340
71406
|
this.forceUpdate();
|
|
71341
71407
|
} }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "step-slider" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("input", { className: "range", type: "range", step: 0.01, min: 0, max: 1.0, value: step.step, onPointerUp: () => this.onPointerUp(), onChange: (evt) => this.updateStep(parseFloat(evt.target.value)) }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "gradient-copy", onClick: () => {
|
|
71342
71408
|
if (this.props.onCopy)
|
|
71343
71409
|
this.props.onCopy();
|
|
71344
|
-
}, title: "Copy Step" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { className: "img", src:
|
|
71410
|
+
}, title: "Copy Step" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { className: "img", src: _sharedComponents_copy_svg__WEBPACK_IMPORTED_MODULE_4__ }) })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "gradient-delete", onClick: () => this.props.onDelete(), title: "Delete Step" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("img", { className: "img", src: _imgs_delete_svg__WEBPACK_IMPORTED_MODULE_3__ }) }))] })));
|
|
71345
71411
|
}
|
|
71346
71412
|
}
|
|
71347
71413
|
|
|
@@ -71494,19 +71560,19 @@ class ImageSourcePropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__
|
|
|
71494
71560
|
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Clamp V", isSelected: () => texture.wrapV === core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.CLAMP_ADDRESSMODE, onSelect: (value) => {
|
|
71495
71561
|
texture.wrapV = value ? core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.CLAMP_ADDRESSMODE : core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.WRAP_ADDRESSMODE;
|
|
71496
71562
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71497
|
-
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { label: "Offset U", target: texture, propertyName: "uOffset", onChange: () => {
|
|
71563
|
+
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Offset U", target: texture, propertyName: "uOffset", onChange: () => {
|
|
71498
71564
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71499
|
-
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { label: "Offset V", target: texture, propertyName: "vOffset", onChange: () => {
|
|
71565
|
+
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Offset V", target: texture, propertyName: "vOffset", onChange: () => {
|
|
71500
71566
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71501
|
-
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { label: "Scale U", target: texture, propertyName: "uScale", onChange: () => {
|
|
71567
|
+
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Scale U", target: texture, propertyName: "uScale", onChange: () => {
|
|
71502
71568
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71503
|
-
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { label: "Scale V", target: texture, propertyName: "vScale", onChange: () => {
|
|
71569
|
+
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Scale V", target: texture, propertyName: "vScale", onChange: () => {
|
|
71504
71570
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71505
|
-
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { label: "Rotation U", target: texture, propertyName: "uAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
71571
|
+
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Rotation U", target: texture, propertyName: "uAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
71506
71572
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71507
|
-
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { label: "Rotation V", target: texture, propertyName: "vAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
71573
|
+
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Rotation V", target: texture, propertyName: "vAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
71508
71574
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71509
|
-
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { label: "Rotation W", target: texture, propertyName: "wAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
71575
|
+
} })), texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Rotation W", target: texture, propertyName: "wAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
71510
71576
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
71511
71577
|
} }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_4__.LineContainerComponent, Object.assign({ title: "SOURCE" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Embed static texture", isSelected: () => this.state.isEmbedded, onSelect: (value) => {
|
|
71512
71578
|
this.setState({ isEmbedded: value });
|
|
@@ -71598,7 +71664,7 @@ class InputPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
71598
71664
|
this.props.stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
71599
71665
|
}
|
|
71600
71666
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(inputBlock);
|
|
71601
|
-
} })), !inputBlock.isBoolean && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_15__.FloatLineComponent, { label: "Min", target: inputBlock, propertyName: "min", onChange: () => {
|
|
71667
|
+
} })), !inputBlock.isBoolean && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_15__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Min", target: inputBlock, propertyName: "min", onChange: () => {
|
|
71602
71668
|
if (inputBlock.value < inputBlock.min) {
|
|
71603
71669
|
inputBlock.value = inputBlock.min;
|
|
71604
71670
|
if (inputBlock.isConstant) {
|
|
@@ -71606,7 +71672,7 @@ class InputPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
71606
71672
|
}
|
|
71607
71673
|
}
|
|
71608
71674
|
this.forceUpdate();
|
|
71609
|
-
} })), !inputBlock.isBoolean && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_15__.FloatLineComponent, { label: "Max", target: inputBlock, propertyName: "max", onChange: () => {
|
|
71675
|
+
} })), !inputBlock.isBoolean && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_15__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Max", target: inputBlock, propertyName: "max", onChange: () => {
|
|
71610
71676
|
if (inputBlock.value > inputBlock.max) {
|
|
71611
71677
|
inputBlock.value = inputBlock.max;
|
|
71612
71678
|
if (inputBlock.isConstant) {
|
|
@@ -71614,7 +71680,7 @@ class InputPropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Compo
|
|
|
71614
71680
|
}
|
|
71615
71681
|
}
|
|
71616
71682
|
this.forceUpdate();
|
|
71617
|
-
} })), !inputBlock.isBoolean && cantDisplaySlider && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_propertyTab_properties_floatPropertyTabComponent__WEBPACK_IMPORTED_MODULE_2__.FloatPropertyTabComponent, { globalState: globalState, inputBlock: inputBlock }), !inputBlock.isBoolean && !cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_16__.SliderLineComponent, { label: "Value", target: inputBlock, propertyName: "value", step: Math.abs(inputBlock.max - inputBlock.min) / 100.0, minimum: Math.min(inputBlock.min, inputBlock.max), maximum: inputBlock.max, onChange: () => {
|
|
71683
|
+
} })), !inputBlock.isBoolean && cantDisplaySlider && (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_components_propertyTab_properties_floatPropertyTabComponent__WEBPACK_IMPORTED_MODULE_2__.FloatPropertyTabComponent, { globalState: globalState, inputBlock: inputBlock }), !inputBlock.isBoolean && !cantDisplaySlider && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_16__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Value", target: inputBlock, propertyName: "value", step: Math.abs(inputBlock.max - inputBlock.min) / 100.0, minimum: Math.min(inputBlock.min, inputBlock.max), maximum: inputBlock.max, onChange: () => {
|
|
71618
71684
|
if (inputBlock.isConstant) {
|
|
71619
71685
|
this.props.stateManager.onRebuildRequiredObservable.notifyObservers(true);
|
|
71620
71686
|
}
|
|
@@ -72167,19 +72233,19 @@ class TexturePropertyTabComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Com
|
|
|
72167
72233
|
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Clamp V", isSelected: () => texture.wrapV === core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.CLAMP_ADDRESSMODE, onSelect: (value) => {
|
|
72168
72234
|
texture.wrapV = value ? core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.CLAMP_ADDRESSMODE : core_Misc_tools__WEBPACK_IMPORTED_MODULE_3__.Texture.WRAP_ADDRESSMODE;
|
|
72169
72235
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72170
|
-
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { label: "Offset U", target: texture, propertyName: "uOffset", onChange: () => {
|
|
72236
|
+
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Offset U", target: texture, propertyName: "uOffset", onChange: () => {
|
|
72171
72237
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72172
|
-
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { label: "Offset V", target: texture, propertyName: "vOffset", onChange: () => {
|
|
72238
|
+
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Offset V", target: texture, propertyName: "vOffset", onChange: () => {
|
|
72173
72239
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72174
|
-
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { label: "Scale U", target: texture, propertyName: "uScale", onChange: () => {
|
|
72240
|
+
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Scale U", target: texture, propertyName: "uScale", onChange: () => {
|
|
72175
72241
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72176
|
-
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { label: "Scale V", target: texture, propertyName: "vScale", onChange: () => {
|
|
72242
|
+
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_floatLineComponent__WEBPACK_IMPORTED_MODULE_10__.FloatLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Scale V", target: texture, propertyName: "vScale", onChange: () => {
|
|
72177
72243
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72178
|
-
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { label: "Rotation U", target: texture, propertyName: "uAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
72244
|
+
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Rotation U", target: texture, propertyName: "uAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
72179
72245
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72180
|
-
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { label: "Rotation V", target: texture, propertyName: "vAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
72246
|
+
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Rotation V", target: texture, propertyName: "vAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
72181
72247
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72182
|
-
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { label: "Rotation W", target: texture, propertyName: "wAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
72248
|
+
} })), texture && !isInReflectionMode && !isFrozenTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_11__.SliderLineComponent, { lockObject: this.props.stateManager.lockObject, label: "Rotation W", target: texture, propertyName: "wAng", minimum: 0, maximum: Math.PI * 2, useEuler: true, step: 0.1, onChange: () => {
|
|
72183
72249
|
this.props.stateManager.onUpdateRequiredObservable.notifyObservers(block);
|
|
72184
72250
|
} }))] })), !this.textureBlock.hasImageSource && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(_sharedComponents_lineContainerComponent__WEBPACK_IMPORTED_MODULE_4__.LineContainerComponent, Object.assign({ title: "SOURCE" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_sharedComponents_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Embed static texture", isSelected: () => this.state.isEmbedded, onSelect: (value) => {
|
|
72185
72251
|
this.setState({ isEmbedded: value });
|
|
@@ -72440,9 +72506,9 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
72440
72506
|
/* harmony import */ var _serializationTools__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../serializationTools */ "../../../tools/nodeEditor/dist/serializationTools.js");
|
|
72441
72507
|
|
|
72442
72508
|
const RegisterExportData = (stateManager) => {
|
|
72443
|
-
stateManager.exportData = (data) => {
|
|
72509
|
+
stateManager.exportData = (data, frame) => {
|
|
72444
72510
|
const nodeMaterial = data.nodeMaterial;
|
|
72445
|
-
return _serializationTools__WEBPACK_IMPORTED_MODULE_0__.SerializationTools.Serialize(nodeMaterial, stateManager.data,
|
|
72511
|
+
return _serializationTools__WEBPACK_IMPORTED_MODULE_0__.SerializationTools.Serialize(nodeMaterial, stateManager.data, frame);
|
|
72446
72512
|
};
|
|
72447
72513
|
stateManager.getEditorDataMap = () => {
|
|
72448
72514
|
return stateManager.data.nodeMaterial.editorData.map;
|
|
@@ -72968,73 +73034,6 @@ class CheckBoxLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component
|
|
|
72968
73034
|
CheckBoxLineComponent._UniqueIdSeed = 0;
|
|
72969
73035
|
|
|
72970
73036
|
|
|
72971
|
-
/***/ }),
|
|
72972
|
-
|
|
72973
|
-
/***/ "../../../tools/nodeEditor/dist/sharedComponents/colorPickerComponent.js":
|
|
72974
|
-
/*!*******************************************************************************!*\
|
|
72975
|
-
!*** ../../../tools/nodeEditor/dist/sharedComponents/colorPickerComponent.js ***!
|
|
72976
|
-
\*******************************************************************************/
|
|
72977
|
-
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
|
72978
|
-
|
|
72979
|
-
"use strict";
|
|
72980
|
-
__webpack_require__.r(__webpack_exports__);
|
|
72981
|
-
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
|
72982
|
-
/* harmony export */ "ColorPickerLineComponent": () => (/* binding */ ColorPickerLineComponent)
|
|
72983
|
-
/* harmony export */ });
|
|
72984
|
-
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react/jsx-runtime */ "../../../../node_modules/react/jsx-runtime.js");
|
|
72985
|
-
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "../../../../node_modules/react/index.js");
|
|
72986
|
-
/* harmony import */ var shared_ui_components_colorPicker_colorPicker__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! shared-ui-components/colorPicker/colorPicker */ "../../../dev/sharedUiComponents/dist/colorPicker/colorPicker.js");
|
|
72987
|
-
|
|
72988
|
-
|
|
72989
|
-
|
|
72990
|
-
class ColorPickerLineComponent extends react__WEBPACK_IMPORTED_MODULE_1__.Component {
|
|
72991
|
-
constructor(props) {
|
|
72992
|
-
super(props);
|
|
72993
|
-
this.state = { pickerEnabled: false, color: this.props.value, hex: this.props.value.toHexString() };
|
|
72994
|
-
this._floatRef = react__WEBPACK_IMPORTED_MODULE_1__.createRef();
|
|
72995
|
-
this._floatHostRef = react__WEBPACK_IMPORTED_MODULE_1__.createRef();
|
|
72996
|
-
}
|
|
72997
|
-
syncPositions() {
|
|
72998
|
-
const div = this._floatRef.current;
|
|
72999
|
-
const host = this._floatHostRef.current;
|
|
73000
|
-
if (!div || !host) {
|
|
73001
|
-
return;
|
|
73002
|
-
}
|
|
73003
|
-
let top = host.getBoundingClientRect().top;
|
|
73004
|
-
const height = div.getBoundingClientRect().height;
|
|
73005
|
-
if (top + height + 10 > window.innerHeight) {
|
|
73006
|
-
top = window.innerHeight - height - 10;
|
|
73007
|
-
}
|
|
73008
|
-
div.style.top = top + "px";
|
|
73009
|
-
div.style.left = host.getBoundingClientRect().left - div.getBoundingClientRect().width + "px";
|
|
73010
|
-
}
|
|
73011
|
-
shouldComponentUpdate(nextProps, nextState) {
|
|
73012
|
-
if (nextProps.value.toHexString() !== this.props.value.toHexString()) {
|
|
73013
|
-
nextState.color = nextProps.value;
|
|
73014
|
-
nextState.hex = nextProps.value.toHexString();
|
|
73015
|
-
}
|
|
73016
|
-
return true;
|
|
73017
|
-
}
|
|
73018
|
-
componentDidUpdate() {
|
|
73019
|
-
this.syncPositions();
|
|
73020
|
-
}
|
|
73021
|
-
componentDidMount() {
|
|
73022
|
-
this.syncPositions();
|
|
73023
|
-
}
|
|
73024
|
-
setPickerState(enabled) {
|
|
73025
|
-
this.setState({ pickerEnabled: enabled });
|
|
73026
|
-
}
|
|
73027
|
-
render() {
|
|
73028
|
-
const color = this.state.color;
|
|
73029
|
-
this.props.globalState.lockObject.lock = this.state.pickerEnabled;
|
|
73030
|
-
return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "color-picker" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", { className: "color-rect", ref: this._floatHostRef, style: { background: this.state.hex }, onClick: () => this.setPickerState(true) }), this.state.pickerEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-cover", onClick: () => this.setPickerState(false) }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "color-picker-float", onClick: (ev) => ev.stopPropagation(), ref: this._floatRef }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_colorPicker_colorPicker__WEBPACK_IMPORTED_MODULE_2__.ColorPicker, { lockObject: this.props.globalState.lockObject, color: color, onColorChanged: (color) => {
|
|
73031
|
-
const hex = color.toHexString();
|
|
73032
|
-
this.props.onColorChanged(hex);
|
|
73033
|
-
} }) })) })) }))] })));
|
|
73034
|
-
}
|
|
73035
|
-
}
|
|
73036
|
-
|
|
73037
|
-
|
|
73038
73037
|
/***/ }),
|
|
73039
73038
|
|
|
73040
73039
|
/***/ "../../../tools/nodeEditor/dist/sharedComponents/draggableLineComponent.js":
|
|
@@ -73821,17 +73820,6 @@ var update = _node_modules_style_loader_dist_runtime_injectStylesIntoStyleTag_js
|
|
|
73821
73820
|
/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_sass_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_main_scss__WEBPACK_IMPORTED_MODULE_6__["default"] && _node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_sass_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_main_scss__WEBPACK_IMPORTED_MODULE_6__["default"].locals ? _node_modules_css_loader_dist_cjs_js_ruleSet_1_rules_3_use_1_node_modules_sass_loader_dist_cjs_js_ruleSet_1_rules_3_use_2_main_scss__WEBPACK_IMPORTED_MODULE_6__["default"].locals : undefined);
|
|
73822
73821
|
|
|
73823
73822
|
|
|
73824
|
-
/***/ }),
|
|
73825
|
-
|
|
73826
|
-
/***/ "../../../dev/sharedUiComponents/dist/imgs/triangle.svg":
|
|
73827
|
-
/*!**************************************************************!*\
|
|
73828
|
-
!*** ../../../dev/sharedUiComponents/dist/imgs/triangle.svg ***!
|
|
73829
|
-
\**************************************************************/
|
|
73830
|
-
/***/ ((module) => {
|
|
73831
|
-
|
|
73832
|
-
"use strict";
|
|
73833
|
-
module.exports = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyNS40LjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQoJIHZpZXdCb3g9IjAgMCAzMiAzMiIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgMzIgMzI7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+DQoJLnN0MHtmaWxsOiNGRkZGRkY7fQ0KPC9zdHlsZT4NCjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0xOC44LDQuN2MtMS4yLTIuMi00LjUtMi4yLTUuNywwTDIuNCwyNC4yQzEuMiwyNi4zLDIuOCwyOSw1LjIsMjloMjEuNWMyLjUsMCw0LTIuNywyLjgtNC44TDE4LjgsNC43eiIvPg0KPC9zdmc+DQo=";
|
|
73834
|
-
|
|
73835
73823
|
/***/ }),
|
|
73836
73824
|
|
|
73837
73825
|
/***/ "../../../dev/sharedUiComponents/dist/lines/copy.svg":
|
|
@@ -73999,6 +73987,28 @@ module.exports = "data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiIGZp
|
|
|
73999
73987
|
|
|
74000
73988
|
/***/ }),
|
|
74001
73989
|
|
|
73990
|
+
/***/ "../../../tools/nodeEditor/dist/imgs/square.svg":
|
|
73991
|
+
/*!******************************************************!*\
|
|
73992
|
+
!*** ../../../tools/nodeEditor/dist/imgs/square.svg ***!
|
|
73993
|
+
\******************************************************/
|
|
73994
|
+
/***/ ((module) => {
|
|
73995
|
+
|
|
73996
|
+
"use strict";
|
|
73997
|
+
module.exports = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIGlkPSJMYXllcl81IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDIwIDIwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9PC9zdHlsZT48L2RlZnM+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMy4xMiw1LjYxYzAtMS4zNywxLjExLTIuNDgsMi40OC0yLjQ4SDE0LjM5YzEuMzcsMCwyLjQ4LDEuMTEsMi40OCwyLjQ4VjE0LjM5YzAsMS4zNy0xLjExLDIuNDgtMi40OCwyLjQ4SDUuNjFjLTEuMzcsMC0yLjQ4LTEuMTEtMi40OC0yLjQ4VjUuNjFaIi8+PC9zdmc+";
|
|
73998
|
+
|
|
73999
|
+
/***/ }),
|
|
74000
|
+
|
|
74001
|
+
/***/ "../../../tools/nodeEditor/dist/imgs/triangle.svg":
|
|
74002
|
+
/*!********************************************************!*\
|
|
74003
|
+
!*** ../../../tools/nodeEditor/dist/imgs/triangle.svg ***!
|
|
74004
|
+
\********************************************************/
|
|
74005
|
+
/***/ ((module) => {
|
|
74006
|
+
|
|
74007
|
+
"use strict";
|
|
74008
|
+
module.exports = "data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz48c3ZnIGlkPSJMYXllcl81IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMCIgdmlld0JveD0iMCAwIDIwIDIwIj48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6I2ZmZjt9PC9zdHlsZT48L2RlZnM+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMi42MywxNS4yNmMtLjQ0LC44MywuMTYsMS44NCwxLjExLDEuODRoMTIuNTJjLjk1LDAsMS41NS0xLjAyLDEuMS0xLjg1TDExLjAyLDMuNTZjLS40OC0uODgtMS43NC0uODctMi4yMSwuMDFMMi42MywxNS4yNloiLz48L3N2Zz4=";
|
|
74009
|
+
|
|
74010
|
+
/***/ }),
|
|
74011
|
+
|
|
74002
74012
|
/***/ "../../../tools/nodeEditor/dist/sharedComponents/copy.svg":
|
|
74003
74013
|
/*!****************************************************************!*\
|
|
74004
74014
|
!*** ../../../tools/nodeEditor/dist/sharedComponents/copy.svg ***!
|