@babylonjs/inspector 5.6.1 → 5.8.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.
Files changed (6) hide show
  1. package/dist/babylon.inspector.bundle.js +1 -1
  2. package/dist/babylon.inspector.bundle.js.map +1 -1
  3. package/dist/babylon.inspector.bundle.max.js +12 -1
  4. package/dist/babylon.inspector.bundle.max.js.map +1 -1
  5. package/dist/babylon.inspector.module.d.ts +95 -0
  6. package/package.json +7 -7
package/dist/babylon.inspector.bundle.max.js CHANGED
@@ -38,6 +38,7 @@ var ___CSS_LOADER_URL_REPLACEMENT_0___ = _node_modules_css_loader_dist_runtime_g
38
38
  // Module
39
39
  ___CSS_LOADER_EXPORT___.push([module.id, "#inspector-host {\n position: absolute;\n right: 0px;\n top: 0px;\n bottom: 0px; }\n\n#__resizable_base__ {\n display: none; }\n\n#actionTabs {\n background: #333333;\n height: 100%;\n margin: 0;\n padding: 0;\n display: grid;\n grid-template-rows: auto 1fr;\n font: 14px \"Arial\";\n overflow: hidden; }\n #actionTabs .hoverIcon:hover {\n opacity: 0.8; }\n #actionTabs #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 50px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none; }\n #actionTabs #header #logo {\n grid-column: 1;\n width: 24px;\n height: 24px;\n display: flex;\n align-self: center;\n justify-self: center; }\n #actionTabs #header #back {\n grid-column: 1;\n display: grid;\n align-self: center;\n justify-self: center;\n cursor: pointer; }\n #actionTabs #header #title {\n grid-column: 2;\n display: grid;\n align-items: center;\n text-align: center; }\n #actionTabs #header #commands {\n grid-column: 3;\n display: grid;\n align-items: center;\n grid-template-columns: 1fr 1fr; }\n #actionTabs #header #commands .expand {\n grid-column: 1;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #actionTabs #header #commands .close {\n grid-column: 2;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #actionTabs .tabs {\n display: grid;\n grid-row: 2;\n grid-template-rows: 40px 1fr;\n font: 14px \"Arial\";\n overflow: hidden; }\n #actionTabs .tabs .labels {\n grid-row: 1;\n display: flex;\n align-items: center;\n justify-items: center;\n border-bottom: 1px solid #ffffff;\n margin: 0;\n padding: 0; }\n #actionTabs .tabs .labels .label {\n font-size: 24px;\n color: white;\n width: 40px;\n display: flex;\n align-content: center;\n justify-content: center;\n border: 1px solid transparent;\n border-bottom: none;\n background: #333333;\n padding: 5px;\n height: 28px;\n cursor: pointer; }\n #actionTabs .tabs .labels .label.active {\n border-color: #ffffff;\n border-bottom: 2px solid transparent;\n margin-bottom: -2px; }\n #actionTabs .tabs .panes {\n grid-row: 2;\n display: grid;\n grid-template-rows: 100%;\n overflow: hidden; }\n #actionTabs .tabs .panes .infoMessage {\n opacity: 0.5;\n color: white;\n margin: 15px 5px 0px 5px; }\n #actionTabs .tabs .panes .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 align-items: center; }\n #actionTabs .tabs .panes .gradient-step .step {\n grid-row: 1;\n grid-column: 1; }\n #actionTabs .tabs .panes .gradient-step .color1 {\n height: 100%; }\n #actionTabs .tabs .panes .gradient-step .color2 {\n height: 100%;\n padding-left: 5px; }\n #actionTabs .tabs .panes .gradient-step .factor1 {\n grid-row: 1;\n grid-column: 2;\n cursor: pointer; }\n #actionTabs .tabs .panes .gradient-step .factor2 {\n padding-left: 5px;\n grid-row: 1;\n grid-column: 3;\n cursor: pointer; }\n #actionTabs .tabs .panes .gradient-step .factor2 .grayed {\n background: gray;\n border-color: gray; }\n #actionTabs .tabs .panes .gradient-step .numeric-input {\n width: calc(100% - 5px); }\n #actionTabs .tabs .panes .gradient-step .icon {\n cursor: pointer; }\n #actionTabs .tabs .panes .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 #actionTabs .tabs .panes .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: 12px; }\n #actionTabs .tabs .panes .gradient-step .step-slider input {\n width: 100%; }\n #actionTabs .tabs .panes .gradient-step .step-slider .range:hover {\n opacity: 1; }\n #actionTabs .tabs .panes .gradient-step .step-slider .range {\n -webkit-appearance: none;\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 #actionTabs .tabs .panes .gradient-step .step-slider .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 #actionTabs .tabs .panes .gradient-step .step-slider .range::-moz-range-thumb {\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: #337ab7;\n cursor: pointer; }\n #actionTabs .tabs .panes .gradient-step .gradient-copy {\n grid-row: 1;\n grid-column: 5;\n display: grid;\n align-content: center;\n justify-content: center; }\n #actionTabs .tabs .panes .gradient-step .gradient-copy .img {\n height: 20px;\n width: 20px; }\n #actionTabs .tabs .panes .gradient-step .gradient-copy .img:hover {\n cursor: pointer; }\n #actionTabs .tabs .panes .gradient-step .gradient-delete {\n grid-row: 1;\n grid-column: 6;\n display: grid;\n align-content: center;\n justify-content: center; }\n #actionTabs .tabs .panes .gradient-step .gradient-delete .img {\n height: 20px;\n width: 20px; }\n #actionTabs .tabs .panes .gradient-step .gradient-delete .img:hover {\n cursor: pointer; }\n #actionTabs .tabs .panes .pane {\n color: white;\n overflow-x: hidden;\n overflow-y: auto;\n height: 100%;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none; }\n #actionTabs .tabs .panes .pane .animation-info {\n border-left: greenyellow 3px solid;\n margin-left: 5px;\n padding-left: 5px !important; }\n #actionTabs .tabs .panes .pane .underline {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.5); }\n #actionTabs .tabs .panes .pane .textureLinkLine {\n display: grid;\n grid-template-columns: auto 1fr; }\n #actionTabs .tabs .panes .pane .textureLinkLine .debug {\n grid-column: 1;\n margin-left: 5px;\n margin-right: 5px;\n display: block;\n align-items: center;\n justify-items: center;\n cursor: pointer;\n opacity: 0.5; }\n #actionTabs .tabs .panes .pane .textureLinkLine .debug.selected {\n opacity: 1; }\n #actionTabs .tabs .panes .pane .textureLinkLine .textLine {\n grid-column: 2; }\n #actionTabs .tabs .panes .pane .textureLinkLine .actionIcon {\n display: inline-block;\n margin-top: 6px;\n margin-right: 4px; }\n #actionTabs .tabs .panes .pane .messageLine {\n text-align: center;\n font-size: 12px;\n font-style: italic;\n opacity: 0.6; }\n #actionTabs .tabs .panes .pane .iconMessageLine {\n padding-left: 2px;\n height: 30px;\n display: grid;\n grid-template-columns: 30px 1fr; }\n #actionTabs .tabs .panes .pane .iconMessageLine .icon {\n grid-column: 1;\n display: grid;\n align-items: center;\n justify-items: center; }\n #actionTabs .tabs .panes .pane .iconMessageLine .value {\n grid-column: 2;\n display: flex;\n align-items: center; }\n #actionTabs .tabs .panes .pane .color-picker {\n height: calc(100% - 8px);\n margin: 4px;\n width: 100%; }\n #actionTabs .tabs .panes .pane .color-picker .color-rect {\n height: calc(100% - 4px);\n border: 2px white solid;\n cursor: pointer;\n min-height: 18px; }\n #actionTabs .tabs .panes .pane .color-picker .color-picker-cover {\n position: fixed;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n z-index: 100; }\n #actionTabs .tabs .panes .pane .color-picker .color-picker-float {\n position: absolute; }\n #actionTabs .tabs .panes .pane .linkButtonLine {\n padding-left: 2px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto 20px; }\n #actionTabs .tabs .panes .pane .linkButtonLine .link {\n grid-column: 1;\n display: flex;\n align-items: center;\n text-decoration: underline;\n cursor: pointer; }\n #actionTabs .tabs .panes .pane .linkButtonLine .link-button {\n grid-column: 2; }\n #actionTabs .tabs .panes .pane .linkButtonLine .link-button 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 cursor: pointer; }\n #actionTabs .tabs .panes .pane .linkButtonLine .link-button button:hover {\n opacity: 1; }\n #actionTabs .tabs .panes .pane .linkButtonLine .link-button button:active {\n background: #282828; }\n #actionTabs .tabs .panes .pane .linkButtonLine .link-button button:focus {\n border: 1px solid #337ab7;\n outline: 0px; }\n #actionTabs .tabs .panes .pane .linkButtonLine .link-icon {\n grid-column: 3;\n display: grid;\n align-content: center; }\n #actionTabs .tabs .panes .pane .textLine {\n padding-left: 2px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n #actionTabs .tabs .panes .pane .textLine.indented {\n grid-template-columns: 100%; }\n #actionTabs .tabs .panes .pane .textLine.indented .link-value {\n grid-column: 1;\n text-align: start;\n margin-left: 20px;\n opacity: 0.6;\n max-width: unset; }\n #actionTabs .tabs .panes .pane .textLine.indented .value {\n grid-column: 1;\n text-align: start;\n margin-left: 20px;\n opacity: 0.6;\n max-width: unset; }\n #actionTabs .tabs .panes .pane .textLine.reduced-opacity {\n opacity: 0.6;\n padding-left: 25px; }\n #actionTabs .tabs .panes .pane .textLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #actionTabs .tabs .panes .pane .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: 7px;\n max-width: 140px;\n text-decoration: underline;\n cursor: pointer; }\n #actionTabs .tabs .panes .pane .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: 7px;\n max-width: 200px;\n -webkit-user-select: text;\n -moz-user-select: text;\n -ms-user-select: text;\n user-select: text; }\n #actionTabs .tabs .panes .pane .textLine .value.check {\n color: green; }\n #actionTabs .tabs .panes .pane .textLine .value.uncheck {\n color: red; }\n #actionTabs .tabs .panes .pane .gradient-container {\n margin-top: 3px; }\n #actionTabs .tabs .panes .pane .gradient-container .gradient-label {\n height: 30px;\n display: grid;\n align-content: center; }\n #actionTabs .tabs .panes .pane .gradient-container .gradient-step {\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 25px 50px 55px 40px auto 20px 5px;\n padding-top: 5px;\n padding-left: 5px;\n padding-bottom: 5px;\n align-items: center;\n border-left: orange 3px solid; }\n #actionTabs .tabs .panes .pane .gradient-container .gradient-step .step {\n grid-row: 1;\n grid-column: 1; }\n #actionTabs .tabs .panes .pane .gradient-container .gradient-step .color1 {\n height: 100%; }\n #actionTabs .tabs .panes .pane .gradient-container .gradient-step .color2 {\n height: 100%;\n padding-left: 5px; }\n #actionTabs .tabs .panes .pane .gradient-container .gradient-step .factor1 {\n grid-row: 1;\n grid-column: 2;\n cursor: pointer; }\n #actionTabs .tabs .panes .pane .gradient-container .gradient-step .factor2 {\n padding-left: 5px;\n grid-row: 1;\n grid-column: 3;\n cursor: pointer; }\n #actionTabs .tabs .panes .pane .gradient-container .gradient-step .factor2 .grayed {\n background: gray;\n border-color: gray; }\n #actionTabs .tabs .panes .pane .gradient-container .gradient-step .numeric-input {\n width: calc(100% - 5px); }\n #actionTabs .tabs .panes .pane .gradient-container .gradient-step .step-value {\n margin-left: 5px;\n grid-row: 1;\n grid-column: 4;\n text-align: right;\n margin-right: 5px; }\n #actionTabs .tabs .panes .pane .gradient-container .gradient-step .step-slider {\n grid-row: 1;\n grid-column: 5;\n display: grid;\n justify-content: stretch;\n align-content: center;\n margin-right: 5px; }\n #actionTabs .tabs .panes .pane .gradient-container .gradient-step .step-slider input {\n width: 100%; }\n #actionTabs .tabs .panes .pane .gradient-container .gradient-step .gradient-delete {\n grid-row: 1;\n grid-column: 6;\n display: grid;\n align-content: center;\n justify-content: center; }\n #actionTabs .tabs .panes .pane .textInputLine {\n padding-left: 2px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr 120px; }\n #actionTabs .tabs .panes .pane .textInputLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #actionTabs .tabs .panes .pane .textInputLine .value {\n display: flex;\n align-items: center;\n grid-column: 2; }\n #actionTabs .tabs .panes .pane .textInputLine .value input {\n width: 110px; }\n #actionTabs .tabs .panes .pane .buttonLine {\n height: 30px;\n display: grid;\n align-items: center;\n justify-items: stretch; }\n #actionTabs .tabs .panes .pane .buttonLine input[type=\"file\"] {\n display: none; }\n #actionTabs .tabs .panes .pane .buttonLine .file-upload {\n background: #222222;\n border: 1px solid #337ab7;\n margin: 5px 10px 5px 10px;\n color: white;\n padding: 4px 5px;\n font-size: 13px;\n opacity: 0.9;\n cursor: pointer;\n text-align: center; }\n #actionTabs .tabs .panes .pane .buttonLine .file-upload:hover {\n opacity: 1; }\n #actionTabs .tabs .panes .pane .buttonLine .file-upload:active {\n transform: scale(0.98);\n transform-origin: 0.5 0.5; }\n #actionTabs .tabs .panes .pane .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 cursor: pointer; }\n #actionTabs .tabs .panes .pane .buttonLine button:hover {\n opacity: 1; }\n #actionTabs .tabs .panes .pane .buttonLine button:active {\n background: #282828; }\n #actionTabs .tabs .panes .pane .buttonLine button:focus {\n border: 1px solid #337ab7;\n outline: 0px; }\n #actionTabs .tabs .panes .pane .radioLine {\n padding-left: 2px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr 24px; }\n #actionTabs .tabs .panes .pane .radioLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #actionTabs .tabs .panes .pane .radioLine .radioContainer {\n display: flex;\n align-items: center; }\n #actionTabs .tabs .panes .pane .radioLine .radioContainer .radio {\n grid-column: 2;\n display: none; }\n #actionTabs .tabs .panes .pane .radioLine .radioContainer .radio:checked + label:before {\n border-color: #337ab7; }\n #actionTabs .tabs .panes .pane .radioLine .radioContainer .radio:checked + label:after {\n transform: scale(1); }\n #actionTabs .tabs .panes .pane .radioLine .radioContainer .labelForRadio {\n display: inline-block;\n height: 14px;\n position: relative;\n padding: 0 24px;\n margin-bottom: 0;\n cursor: pointer;\n vertical-align: bottom; }\n #actionTabs .tabs .panes .pane .radioLine .radioContainer .labelForRadio:before, #actionTabs .tabs .panes .pane .radioLine .radioContainer .labelForRadio:after {\n position: absolute;\n content: \"\";\n border-radius: 50%;\n transition: all 0.3s ease;\n transition-property: transform, border-color; }\n #actionTabs .tabs .panes .pane .radioLine .radioContainer .labelForRadio:before {\n left: 0px;\n top: 0;\n width: 16px;\n height: 16px;\n border: 2px solid white; }\n #actionTabs .tabs .panes .pane .radioLine .radioContainer .labelForRadio:after {\n top: 6px;\n left: 6px;\n width: 8px;\n height: 8px;\n transform: scale(0);\n background: #337ab7; }\n #actionTabs .tabs .panes .pane .vector3Line {\n padding-left: 2px;\n display: grid; }\n #actionTabs .tabs .panes .pane .vector3Line .firstLine {\n display: grid;\n grid-template-columns: 1fr auto 20px;\n height: 30px; }\n #actionTabs .tabs .panes .pane .vector3Line .firstLine .label {\n grid-column: 1;\n display: flex;\n align-items: center;\n white-space: nowrap;\n overflow: hidden; }\n #actionTabs .tabs .panes .pane .vector3Line .firstLine .vector {\n grid-column: 2;\n display: flex;\n align-items: center;\n text-align: right;\n opacity: 0.8;\n padding-left: 5px; }\n #actionTabs .tabs .panes .pane .vector3Line .firstLine .expand {\n grid-column: 3;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #actionTabs .tabs .panes .pane .vector3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n #actionTabs .tabs .panes .pane .vector3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n #actionTabs .tabs .panes .pane .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 #actionTabs .tabs .panes .pane .vector3Line .secondLine .numeric-value {\n width: 120px;\n grid-column: 2;\n display: flex;\n align-items: center;\n border: 1px solid #337ab7; }\n #actionTabs .tabs .panes .pane .checkBoxLine {\n padding-left: 2px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n #actionTabs .tabs .panes .pane .checkBoxLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #actionTabs .tabs .panes .pane .checkBoxLine .checkBox {\n grid-column: 2;\n display: flex;\n align-items: center; }\n #actionTabs .tabs .panes .pane .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 #actionTabs .tabs .panes .pane .checkBoxLine .checkBox .lbl.checked {\n background: #337ab7; }\n #actionTabs .tabs .panes .pane .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 #actionTabs .tabs .panes .pane .checkBoxLine .checkBox .lbl:after.checked {\n left: 20px;\n background: #164975; }\n #actionTabs .tabs .panes .pane .checkBoxLine .checkBox .lbl.checked:after {\n position: absolute;\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 left: 20px;\n background: #164975; }\n #actionTabs .tabs .panes .pane .checkBoxLine .checkBox .lbl:active:after {\n transform: scale(1.15, 0.85); }\n #actionTabs .tabs .panes .pane .checkBoxLine .checkBox .hidden {\n display: none; }\n #actionTabs .tabs .panes .pane .checkBoxLine .checkBox .icon {\n display: none; }\n #actionTabs .tabs .panes .pane .textureLine {\n display: grid;\n grid-template-rows: 30px auto; }\n #actionTabs .tabs .panes .pane .textureLine .control {\n margin-top: 2px;\n grid-row: 1;\n display: grid;\n grid-template-columns: 1fr 40px 40px 40px 40px 40px 1fr; }\n #actionTabs .tabs .panes .pane .textureLine .control .red {\n grid-column: 2; }\n #actionTabs .tabs .panes .pane .textureLine .control .green {\n grid-column: 3; }\n #actionTabs .tabs .panes .pane .textureLine .control .blue {\n grid-column: 4; }\n #actionTabs .tabs .panes .pane .textureLine .control .alpha {\n grid-column: 5; }\n #actionTabs .tabs .panes .pane .textureLine .control .all {\n grid-column: 6; }\n #actionTabs .tabs .panes .pane .textureLine .control3D {\n margin-top: 2px;\n grid-row: 1;\n display: grid;\n grid-template-columns: 1fr 40px 40px 40px 40px 40px 40px 1fr; }\n #actionTabs .tabs .panes .pane .textureLine .control3D .px {\n grid-column: 2; }\n #actionTabs .tabs .panes .pane .textureLine .control3D .nx {\n grid-column: 3; }\n #actionTabs .tabs .panes .pane .textureLine .control3D .py {\n grid-column: 4; }\n #actionTabs .tabs .panes .pane .textureLine .control3D .ny {\n grid-column: 5; }\n #actionTabs .tabs .panes .pane .textureLine .control3D .pz {\n grid-column: 6; }\n #actionTabs .tabs .panes .pane .textureLine .control3D .nz {\n grid-column: 7; }\n #actionTabs .tabs .panes .pane .textureLine .command {\n border: 1px solid transparent;\n background: transparent;\n color: white; }\n #actionTabs .tabs .panes .pane .textureLine .selected {\n border: 1px solid #337ab7; }\n #actionTabs .tabs .panes .pane .textureLine .preview {\n grid-row: 2;\n display: grid;\n align-self: center;\n justify-self: center;\n height: 256px;\n width: 256px;\n margin-top: 5px;\n margin-bottom: 5px;\n border: 1px solid white;\n background-size: 32px 32px;\n background-color: white;\n background-image: url(" + ___CSS_LOADER_URL_REPLACEMENT_0___ + "); }\n #actionTabs .tabs .panes .pane .gltf-extension-property {\n margin-left: 30px;\n border-left: 1px solid #337ab7; }\n #actionTabs .tabs .panes .pane .floatLine {\n padding-left: 2px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr 120px; }\n #actionTabs .tabs .panes .pane .floatLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #actionTabs .tabs .panes .pane .floatLine .value {\n grid-column: 2;\n display: flex;\n align-items: center; }\n #actionTabs .tabs .panes .pane .floatLine .value input {\n width: 110px; }\n #actionTabs .tabs .panes .pane .sliderLine {\n padding-left: 2px;\n height: 30px;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 1fr 50px auto; }\n #actionTabs .tabs .panes .pane .sliderLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #actionTabs .tabs .panes .pane .sliderLine .withMargins {\n margin-left: 5px; }\n #actionTabs .tabs .panes .pane .sliderLine .floatLine {\n padding-left: 2px; }\n #actionTabs .tabs .panes .pane .sliderLine .floatLine .short {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #actionTabs .tabs .panes .pane .sliderLine .floatLine .short input {\n width: 35px; }\n #actionTabs .tabs .panes .pane .sliderLine .floatLine .short input::-webkit-outer-spin-button,\n #actionTabs .tabs .panes .pane .sliderLine .floatLine .short input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0; }\n #actionTabs .tabs .panes .pane .sliderLine .floatLine .short input[type=\"number\"] {\n -moz-appearance: textfield; }\n #actionTabs .tabs .panes .pane .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 #actionTabs .tabs .panes .pane .sliderLine .slider .range {\n -webkit-appearance: none;\n width: 100%;\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 #actionTabs .tabs .panes .pane .sliderLine .slider .range:hover {\n opacity: 1; }\n #actionTabs .tabs .panes .pane .sliderLine .slider .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 #actionTabs .tabs .panes .pane .sliderLine .slider .range::-moz-range-thumb {\n width: 14px;\n height: 14px;\n border-radius: 50%;\n background: #337ab7;\n cursor: pointer; }\n #actionTabs .tabs .panes .pane .color3Line {\n padding-left: 2px;\n display: grid; }\n #actionTabs .tabs .panes .pane .color3Line .firstLine {\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto 20px 20px; }\n #actionTabs .tabs .panes .pane .color3Line .firstLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #actionTabs .tabs .panes .pane .color3Line .firstLine .color3 {\n grid-column: 2;\n width: 50px;\n display: flex;\n align-items: center; }\n #actionTabs .tabs .panes .pane .color3Line .firstLine .color3 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 #actionTabs .tabs .panes .pane .color3Line .firstLine .color3 input[type=\"color\"]::-webkit-color-swatch-wrapper {\n padding: 0; }\n #actionTabs .tabs .panes .pane .color3Line .firstLine .color3 input[type=\"color\"]::-webkit-color-swatch {\n border: none; }\n #actionTabs .tabs .panes .pane .color3Line .firstLine .color3 input {\n margin-right: 5px; }\n #actionTabs .tabs .panes .pane .color3Line .firstLine .copy {\n grid-column: 3;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #actionTabs .tabs .panes .pane .color3Line .firstLine .copy img {\n height: 100%; }\n #actionTabs .tabs .panes .pane .color3Line .firstLine .expand {\n grid-column: 4;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #actionTabs .tabs .panes .pane .color3Line .secondLine {\n display: grid;\n padding-right: 5px;\n border-left: 1px solid #337ab7; }\n #actionTabs .tabs .panes .pane .color3Line .secondLine .numeric {\n display: grid;\n grid-template-columns: 1fr auto; }\n #actionTabs .tabs .panes .pane .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 #actionTabs .tabs .panes .pane .color3Line .secondLine .numeric-value {\n width: 120px;\n grid-column: 2;\n display: flex;\n align-items: center;\n border: 1px solid #337ab7; }\n #actionTabs .tabs .panes .pane .listLine {\n padding-left: 2px;\n height: 30px;\n display: grid;\n grid-template-columns: 1fr auto; }\n #actionTabs .tabs .panes .pane .listLine .label {\n grid-column: 1;\n display: flex;\n align-items: center; }\n #actionTabs .tabs .panes .pane .listLine .options {\n grid-column: 2;\n display: flex;\n align-items: center;\n margin-right: 5px; }\n #actionTabs .tabs .panes .pane .listLine .options select {\n width: 115px; }\n #actionTabs .tabs .panes .pane .paneContainer {\n margin-top: 3px;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%; }\n #actionTabs .tabs .panes .pane .paneContainer .paneList {\n border-left: 3px solid transparent; }\n #actionTabs .tabs .panes .pane .paneContainer:hover .paneList {\n border-left: 3px solid rgba(51, 122, 183, 0.8); }\n #actionTabs .tabs .panes .pane .paneContainer:hover .paneContainer-content .header .title {\n border-left: 3px solid #337ab7; }\n #actionTabs .tabs .panes .pane .paneContainer .paneContainer-highlight-border {\n grid-row: 1;\n grid-column: 1;\n opacity: 1;\n border: 3px solid red;\n margin-bottom: -5px;\n z-index: 100;\n transition: opacity 250ms;\n pointer-events: none; }\n #actionTabs .tabs .panes .pane .paneContainer .paneContainer-highlight-border.transparent {\n opacity: 0; }\n #actionTabs .tabs .panes .pane .paneContainer .paneContainer-content {\n grid-row: 1;\n grid-column: 1; }\n #actionTabs .tabs .panes .pane .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 #actionTabs .tabs .panes .pane .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 #actionTabs .tabs .panes .pane .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 #actionTabs .tabs .panes .pane .paneContainer .paneContainer-content .header .collapse.closed {\n transform: rotate(180deg); }\n #actionTabs .tabs .panes .pane .paneContainer .paneContainer-content .paneList > div:not(:last-child) {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1); }\n #actionTabs .tabs .panes .pane .paneContainer .paneContainer-content .fragment > div:not(:last-child) {\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.1); }\n", "",{"version":3,"sources":["webpack://./../../../dev/inspector/dist/components/actionTabs/actionTabs.scss"],"names":[],"mappings":"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","sourcesContent":["$line-padding-left: 2px;\r\n\r\n#inspector-host {\r\n position: absolute;\r\n right: 0px;\r\n top: 0px;\r\n bottom: 0px;\r\n}\r\n\r\n#__resizable_base__ {\r\n display: none;\r\n}\r\n\r\n#actionTabs {\r\n background: #333333;\r\n height: 100%;\r\n margin: 0;\r\n padding: 0;\r\n display: grid;\r\n grid-template-rows: auto 1fr;\r\n font: 14px \"Arial\";\r\n overflow: hidden;\r\n\r\n .hoverIcon:hover {\r\n opacity: 0.8;\r\n }\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 50px;\r\n -webkit-user-select: none;\r\n -moz-user-select: none;\r\n -ms-user-select: none;\r\n user-select: none;\r\n\r\n #logo {\r\n grid-column: 1;\r\n width: 24px;\r\n height: 24px;\r\n display: flex;\r\n align-self: center;\r\n justify-self: center;\r\n }\r\n\r\n #back {\r\n grid-column: 1;\r\n display: grid;\r\n align-self: center;\r\n justify-self: center;\r\n cursor: pointer;\r\n }\r\n\r\n #title {\r\n grid-column: 2;\r\n display: grid;\r\n align-items: center;\r\n text-align: center;\r\n }\r\n\r\n #commands {\r\n grid-column: 3;\r\n display: grid;\r\n align-items: center;\r\n grid-template-columns: 1fr 1fr;\r\n\r\n .expand {\r\n grid-column: 1;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n }\r\n\r\n .close {\r\n grid-column: 2;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n }\r\n }\r\n }\r\n\r\n .tabs {\r\n display: grid;\r\n grid-row: 2;\r\n grid-template-rows: 40px 1fr;\r\n font: 14px \"Arial\";\r\n overflow: hidden;\r\n\r\n .labels {\r\n grid-row: 1;\r\n display: flex;\r\n align-items: center;\r\n justify-items: center;\r\n border-bottom: 1px solid #ffffff;\r\n margin: 0;\r\n padding: 0;\r\n\r\n .label {\r\n font-size: 24px;\r\n color: white;\r\n width: 40px;\r\n display: flex;\r\n align-content: center;\r\n justify-content: center;\r\n border: 1px solid transparent;\r\n border-bottom: none;\r\n background: #333333;\r\n padding: 5px;\r\n height: 28px;\r\n cursor: pointer;\r\n\r\n &.active {\r\n border-color: #ffffff;\r\n border-bottom: 2px solid transparent;\r\n margin-bottom: -2px;\r\n }\r\n }\r\n }\r\n\r\n .panes {\r\n grid-row: 2;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n\r\n overflow: hidden;\r\n\r\n .infoMessage {\r\n opacity: 0.5;\r\n color: white;\r\n margin: 15px 5px 0px 5px;\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 align-items: center;\r\n\r\n .step {\r\n grid-row: 1;\r\n grid-column: 1;\r\n }\r\n\r\n .color1 {\r\n height: 100%;\r\n }\r\n\r\n .color2 {\r\n height: 100%;\r\n padding-left: 5px;\r\n }\r\n\r\n .factor1 {\r\n grid-row: 1;\r\n grid-column: 2;\r\n cursor: pointer;\r\n }\r\n\r\n .factor2 {\r\n padding-left: 5px;\r\n grid-row: 1;\r\n grid-column: 3;\r\n cursor: pointer;\r\n\r\n .grayed {\r\n background: gray;\r\n border-color: gray;\r\n }\r\n }\r\n\r\n .numeric-input {\r\n width: calc(100% - 5px);\r\n }\r\n\r\n .icon {\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: 12px;\r\n\r\n input {\r\n width: 100%;\r\n }\r\n .range:hover {\r\n opacity: 1;\r\n }\r\n\r\n .range {\r\n -webkit-appearance: none;\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 .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\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 .pane {\r\n color: white;\r\n\r\n overflow-x: hidden;\r\n overflow-y: auto;\r\n height: 100%;\r\n\r\n -webkit-user-select: none;\r\n -moz-user-select: none;\r\n -ms-user-select: none;\r\n user-select: none;\r\n\r\n .animation-info {\r\n border-left: greenyellow 3px solid;\r\n margin-left: 5px;\r\n padding-left: 5px !important;\r\n }\r\n\r\n .underline {\r\n border-bottom: 0.5px solid rgba(255, 255, 255, 0.5);\r\n }\r\n\r\n .textureLinkLine {\r\n display: grid;\r\n grid-template-columns: auto 1fr;\r\n\r\n .debug {\r\n grid-column: 1;\r\n margin-left: 5px;\r\n margin-right: 5px;\r\n display: block;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n opacity: 0.5;\r\n\r\n &.selected {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n .textLine {\r\n grid-column: 2;\r\n }\r\n\r\n .actionIcon {\r\n display: inline-block;\r\n margin-top: 6px;\r\n margin-right: 4px;\r\n }\r\n }\r\n\r\n .messageLine {\r\n text-align: center;\r\n font-size: 12px;\r\n font-style: italic;\r\n opacity: 0.6;\r\n }\r\n\r\n .iconMessageLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 30px 1fr;\r\n\r\n .icon {\r\n grid-column: 1;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n }\r\n\r\n .value {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n }\r\n }\r\n\r\n .color-picker {\r\n height: calc(100% - 8px);\r\n margin: 4px;\r\n width: 100%;\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: 100;\r\n }\r\n\r\n .color-picker-float {\r\n position: absolute;\r\n }\r\n }\r\n\r\n .linkButtonLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr auto 20px;\r\n\r\n .link {\r\n grid-column: 1;\r\n display: flex;\r\n align-items: center;\r\n text-decoration: underline;\r\n cursor: pointer;\r\n }\r\n\r\n .link-button {\r\n grid-column: 2;\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 cursor: pointer;\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 .link-icon {\r\n grid-column: 3;\r\n display: grid;\r\n align-content: center;\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 &.indented {\r\n grid-template-columns: 100%;\r\n\r\n .link-value {\r\n grid-column: 1;\r\n text-align: start;\r\n margin-left: 20px;\r\n opacity: 0.6;\r\n max-width: unset;\r\n }\r\n\r\n .value {\r\n grid-column: 1;\r\n text-align: start;\r\n margin-left: 20px;\r\n opacity: 0.6;\r\n max-width: unset;\r\n }\r\n }\r\n\r\n &.reduced-opacity {\r\n opacity: 0.6;\r\n padding-left: 25px;\r\n }\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: 7px;\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: 7px;\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 .gradient-container {\r\n margin-top: 3px;\r\n\r\n .gradient-label {\r\n height: 30px;\r\n display: grid;\r\n align-content: center;\r\n }\r\n\r\n .gradient-step {\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 25px 50px 55px 40px auto 20px 5px;\r\n padding-top: 5px;\r\n padding-left: 5px;\r\n padding-bottom: 5px;\r\n align-items: center;\r\n border-left: orange 3px solid;\r\n\r\n .step {\r\n grid-row: 1;\r\n grid-column: 1;\r\n }\r\n\r\n .color1 {\r\n height: 100%;\r\n }\r\n\r\n .color2 {\r\n height: 100%;\r\n padding-left: 5px;\r\n }\r\n\r\n .factor1 {\r\n grid-row: 1;\r\n grid-column: 2;\r\n cursor: pointer;\r\n }\r\n\r\n .factor2 {\r\n padding-left: 5px;\r\n grid-row: 1;\r\n grid-column: 3;\r\n cursor: pointer;\r\n\r\n .grayed {\r\n background: gray;\r\n border-color: gray;\r\n }\r\n }\r\n\r\n .numeric-input {\r\n width: calc(100% - 5px);\r\n }\r\n\r\n .step-value {\r\n margin-left: 5px;\r\n grid-row: 1;\r\n grid-column: 4;\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: 5;\r\n display: grid;\r\n justify-content: stretch;\r\n align-content: center;\r\n margin-right: 5px;\r\n\r\n input {\r\n width: 100%;\r\n }\r\n }\r\n\r\n .gradient-delete {\r\n grid-row: 1;\r\n grid-column: 6;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n }\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;\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: 110px;\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\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 5px 10px;\r\n color: white;\r\n padding: 4px 5px;\r\n font-size: 13px;\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 cursor: pointer;\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 .radioLine {\r\n padding-left: $line-padding-left;\r\n height: 30px;\r\n display: grid;\r\n grid-template-columns: 1fr 24px;\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 .radioContainer {\r\n display: flex;\r\n align-items: center;\r\n\r\n .radio {\r\n grid-column: 2;\r\n display: none;\r\n\r\n &:checked + label:before {\r\n border-color: rgb(51, 122, 183);\r\n }\r\n &:checked + label:after {\r\n transform: scale(1);\r\n }\r\n }\r\n\r\n .labelForRadio {\r\n display: inline-block;\r\n height: 14px;\r\n position: relative;\r\n padding: 0 24px;\r\n margin-bottom: 0;\r\n cursor: pointer;\r\n vertical-align: bottom;\r\n &:before,\r\n &:after {\r\n position: absolute;\r\n content: \"\";\r\n border-radius: 50%;\r\n transition: all 0.3s ease;\r\n transition-property: transform, border-color;\r\n }\r\n &:before {\r\n left: 0px;\r\n top: 0;\r\n width: 16px;\r\n height: 16px;\r\n border: 2px solid white;\r\n }\r\n &:after {\r\n top: 6px;\r\n left: 6px;\r\n width: 8px;\r\n height: 8px;\r\n transform: scale(0);\r\n background: rgb(51, 122, 183);\r\n }\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 white-space: nowrap;\r\n overflow: hidden;\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 padding-left: 5px;\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 .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 .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 &.checked {\r\n background: rgb(51, 122, 183);\r\n }\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 &.checked {\r\n left: 20px;\r\n background: rgb(22, 73, 117);\r\n }\r\n }\r\n\r\n .lbl.checked:after {\r\n position: absolute;\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 left: 20px;\r\n background: rgb(22, 73, 117);\r\n }\r\n\r\n .lbl:active:after {\r\n transform: scale(1.15, 0.85);\r\n }\r\n\r\n .hidden {\r\n display: none;\r\n }\r\n\r\n .icon {\r\n display: none;\r\n }\r\n }\r\n }\r\n\r\n .textureLine {\r\n display: grid;\r\n grid-template-rows: 30px auto;\r\n\r\n .control {\r\n margin-top: 2px;\r\n grid-row: 1;\r\n display: grid;\r\n grid-template-columns: 1fr 40px 40px 40px 40px 40px 1fr;\r\n\r\n .red {\r\n grid-column: 2;\r\n }\r\n\r\n .green {\r\n grid-column: 3;\r\n }\r\n\r\n .blue {\r\n grid-column: 4;\r\n }\r\n\r\n .alpha {\r\n grid-column: 5;\r\n }\r\n\r\n .all {\r\n grid-column: 6;\r\n }\r\n }\r\n\r\n .control3D {\r\n margin-top: 2px;\r\n grid-row: 1;\r\n display: grid;\r\n grid-template-columns: 1fr 40px 40px 40px 40px 40px 40px 1fr;\r\n\r\n .px {\r\n grid-column: 2;\r\n }\r\n\r\n .nx {\r\n grid-column: 3;\r\n }\r\n\r\n .py {\r\n grid-column: 4;\r\n }\r\n\r\n .ny {\r\n grid-column: 5;\r\n }\r\n\r\n .pz {\r\n grid-column: 6;\r\n }\r\n\r\n .nz {\r\n grid-column: 7;\r\n }\r\n }\r\n\r\n .command {\r\n border: 1px solid transparent;\r\n background: transparent;\r\n color: white;\r\n }\r\n\r\n .selected {\r\n border: 1px solid rgb(51, 122, 183);\r\n }\r\n\r\n .preview {\r\n grid-row: 2;\r\n display: grid;\r\n align-self: center;\r\n justify-self: center;\r\n height: 256px;\r\n width: 256px;\r\n margin-top: 5px;\r\n margin-bottom: 5px;\r\n border: 1px solid white;\r\n background-size: 32px 32px;\r\n background-color: white;\r\n background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2 2'%3E%3Cpath fill='rgba(1.0,1.0,1.0,0.3)' fill-rule='evenodd' d='M0 0h1v1H0V0zm1 1h1v1H1V1z'/%3E%3C/svg%3E\");\r\n }\r\n }\r\n\r\n .gltf-extension-property {\r\n margin-left: 30px;\r\n border-left: 1px solid rgb(51, 122, 183);\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\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 .withMargins {\r\n margin-left: 5px;\r\n }\r\n\r\n .floatLine {\r\n padding-left: $line-padding-left;\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 .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 .range {\r\n -webkit-appearance: none;\r\n width: 100%;\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 }\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[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 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 img {\r\n height: 100%;\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 }\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 .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 .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 margin-bottom: -5px;\r\n z-index: 100;\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 }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
40
40
  // Exports
41
+ ___CSS_LOADER_EXPORT___.locals = {};
41
42
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
42
43
 
43
44
 
@@ -65,6 +66,7 @@ var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBP
65
66
  // Module
66
67
  ___CSS_LOADER_EXPORT___.push([module.id, "#performance-viewer {\n display: grid;\n height: 100%;\n width: 100%;\n grid-template-columns: 300px 1fr;\n font-family: \"acumin-pro\"; }\n #performance-viewer .performancePlayheadButton {\n grid-area: liveButton;\n height: 30px;\n width: 100px;\n justify-self: right;\n background-color: #dcdfe1;\n color: #2e3f47;\n outline: 2px #2e3f47;\n margin: 5px;\n position: absolute;\n top: 10px;\n right: 10px; }\n #performance-viewer #performance-viewer-sidebar {\n display: flex;\n flex-direction: column;\n overflow-y: scroll;\n border: 2px solid gray; }\n #performance-viewer #performance-viewer-sidebar .sidebar-item {\n display: grid;\n width: 100%;\n height: 30px;\n font-size: 14px;\n padding: 2.5px 0px;\n align-items: center; }\n #performance-viewer #performance-viewer-sidebar .header {\n color: white;\n grid-template-columns: 10px 9fr 1fr 10px; }\n #performance-viewer #performance-viewer-sidebar .header .category {\n grid-column: 2; }\n #performance-viewer #performance-viewer-sidebar .header .value {\n grid-column: 3; }\n #performance-viewer #performance-viewer-sidebar .version-header {\n background-color: #2e3f47;\n color: white;\n grid-template-columns: 10px 1fr 1fr 10px;\n font-size: 14px;\n height: 35px; }\n #performance-viewer #performance-viewer-sidebar .version-header .category {\n grid-column: 2; }\n #performance-viewer #performance-viewer-sidebar .version-header .value {\n grid-column: 3;\n display: flex;\n justify-content: end; }\n #performance-viewer #performance-viewer-sidebar .category-header {\n background-color: #4a5960;\n text-transform: uppercase;\n font-size: 14px;\n height: 30px; }\n #performance-viewer #performance-viewer-sidebar .category-header .checkBoxLine {\n color: #dcdfe1; }\n #performance-viewer #performance-viewer-sidebar .measure {\n color: black;\n grid-template-columns: 18px 6fr 1fr;\n font-family: \"acumin-pro-condensed\"; }\n #performance-viewer #performance-viewer-sidebar .measure .category {\n display: grid;\n grid-template-columns: 18px 7px 18px 10px 1fr;\n grid-column: 2;\n align-items: center; }\n #performance-viewer #performance-viewer-sidebar .measure .category .color-picker {\n grid-column: 3; }\n #performance-viewer #performance-viewer-sidebar .measure .category .sidebar-item-label {\n grid-column: 5; }\n #performance-viewer #performance-viewer-sidebar .measure .value {\n grid-column: 3; }\n #performance-viewer #performance-viewer-sidebar .measure:nth-child(odd) {\n background-color: #dcdfe1; }\n #performance-viewer #performance-viewer-sidebar .measure:nth-child(even) {\n background-color: #ebedee; }\n #performance-viewer #performance-viewer-sidebar .checkBoxLine {\n color: #4a5960;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center; }\n #performance-viewer #performance-viewer-sidebar .checkBoxLine .disabled {\n color: lightgray; }\n #performance-viewer #performance-viewer-sidebar .color-picker {\n width: 100%; }\n #performance-viewer #performance-viewer-sidebar .color-picker .color-rect {\n height: 18px;\n width: 18px;\n cursor: pointer; }\n #performance-viewer #performance-viewer-sidebar .color-picker .color-picker-cover {\n position: fixed;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n z-index: 100; }\n #performance-viewer #performance-viewer-sidebar .color-picker .color-picker-float {\n position: absolute; }\n #performance-viewer #performance-viewer-sidebar .color-picker .color-picker-float .color-picker-container {\n width: 200px; }\n", "",{"version":3,"sources":["webpack://./../../../dev/inspector/dist/components/actionTabs/tabs/performanceViewer/scss/performanceViewer.scss"],"names":[],"mappings":"AAGA;EACI,aAAa;EACb,YAAY;EACZ,WAAW;EACX,gCAAgC;EAChC,yBAAyB,EAAA;EAL7B;IAQQ,qBAAqB;IACrB,YAZW;IAaX,YAAY;IACZ,mBAAmB;IACnB,yBAAyB;IACzB,cAAc;IACd,oBAAoB;IACpB,WAAW;IACX,kBAAkB;IAClB,SAAS;IACT,WAAW,EAAA;EAlBnB;IAsBQ,aAAa;IACb,sBAAsB;IACtB,kBAAkB;IAElB,sBAAsB,EAAA;IA1B9B;MA6BY,aAAa;MACb,WAAW;MACX,YAAY;MACZ,eAAe;MACf,kBAAkB;MAClB,mBAAmB,EAAA;IAlC/B;MAsCY,YAAY;MACZ,wCAAwC,EAAA;MAvCpD;QA0CgB,cAAc,EAAA;MA1C9B;QA8CgB,cAAc,EAAA;IA9C9B;MAmDY,yBAAyB;MACzB,YAAY;MACZ,wCAAwC;MACxC,eAAe;MACf,YAAY,EAAA;MAvDxB;QA0DgB,cAAc,EAAA;MA1D9B;QA8DgB,cAAc;QACd,aAAa;QACb,oBAAoB,EAAA;IAhEpC;MAsEY,yBAAyB;MACzB,yBAAyB;MACzB,eAAe;MACf,YAAY,EAAA;MAzExB;QA4EgB,cAAc,EAAA;IA5E9B;MAiFY,YAAY;MACZ,mCAA0C;MAC1C,mCAAmC,EAAA;MAnF/C;QAsFgB,aAAa;QACb,6CAA2D;QAC3D,cAAc;QACd,mBAAmB,EAAA;QAzFnC;UA4FoB,cAAc,EAAA;QA5FlC;UAgGoB,cAAc,EAAA;MAhGlC;QAqGgB,cAAc,EAAA;IArG9B;MA2GY,yBAAyB,EAAA;IA3GrC;MAgHY,yBAAyB,EAAA;IAhHrC;MAoHY,cAAc;MACd,WAAW;MACX,YAAY;MACZ,aAAa;MACb,uBAAuB;MACvB,mBAAmB,EAAA;MAzH/B;QA2HgB,gBAAgB,EAAA;IA3HhC;MAgIY,WAAW,EAAA;MAhIvB;QAmIgB,YArIC;QAsID,WAtIC;QAuID,eAAe,EAAA;MArI/B;QAyIgB,eAAe;QACf,QAAQ;QACR,UAAU;QACV,WAAW;QACX,SAAS;QACT,YAAY,EAAA;MA9I5B;QAkJgB,kBAAkB,EAAA;QAlJlC;UAqJoB,YAAY,EAAA","sourcesContent":["$buttonHeight: 30px;\r\n$squareSize: 18px;\r\n\r\n#performance-viewer {\r\n display: grid;\r\n height: 100%;\r\n width: 100%;\r\n grid-template-columns: 300px 1fr;\r\n font-family: \"acumin-pro\";\r\n\r\n .performancePlayheadButton {\r\n grid-area: liveButton;\r\n height: $buttonHeight;\r\n width: 100px;\r\n justify-self: right;\r\n background-color: #dcdfe1;\r\n color: #2e3f47;\r\n outline: 2px #2e3f47;\r\n margin: 5px;\r\n position: absolute;\r\n top: 10px;\r\n right: 10px;\r\n }\r\n\r\n #performance-viewer-sidebar {\r\n display: flex;\r\n flex-direction: column;\r\n overflow-y: scroll;\r\n\r\n border: 2px solid gray;\r\n\r\n .sidebar-item {\r\n display: grid;\r\n width: 100%;\r\n height: 30px;\r\n font-size: 14px;\r\n padding: 2.5px 0px;\r\n align-items: center;\r\n }\r\n\r\n .header {\r\n color: white;\r\n grid-template-columns: 10px 9fr 1fr 10px;\r\n\r\n .category {\r\n grid-column: 2;\r\n }\r\n\r\n .value {\r\n grid-column: 3;\r\n }\r\n }\r\n\r\n .version-header {\r\n background-color: #2e3f47;\r\n color: white;\r\n grid-template-columns: 10px 1fr 1fr 10px;\r\n font-size: 14px;\r\n height: 35px; // with padding, we get 40px\r\n\r\n .category {\r\n grid-column: 2;\r\n }\r\n\r\n .value {\r\n grid-column: 3;\r\n display: flex;\r\n justify-content: end;\r\n }\r\n }\r\n\r\n // mid-dark color\r\n .category-header {\r\n background-color: #4a5960;\r\n text-transform: uppercase;\r\n font-size: 14px;\r\n height: 30px;\r\n\r\n .checkBoxLine {\r\n color: #dcdfe1;\r\n }\r\n }\r\n\r\n .measure {\r\n color: black;\r\n grid-template-columns: $squareSize 6fr 1fr;\r\n font-family: \"acumin-pro-condensed\";\r\n\r\n .category {\r\n display: grid;\r\n grid-template-columns: $squareSize 7px $squareSize 10px 1fr;\r\n grid-column: 2;\r\n align-items: center;\r\n\r\n .color-picker {\r\n grid-column: 3;\r\n }\r\n\r\n .sidebar-item-label {\r\n grid-column: 5;\r\n }\r\n }\r\n\r\n .value {\r\n grid-column: 3;\r\n }\r\n }\r\n\r\n //darker color\r\n .measure:nth-child(odd) {\r\n background-color: #dcdfe1;\r\n }\r\n\r\n // lighter color\r\n .measure:nth-child(even) {\r\n background-color: #ebedee;\r\n }\r\n\r\n .checkBoxLine {\r\n color: #4a5960;\r\n width: 100%;\r\n height: 100%;\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n .disabled {\r\n color: lightgray;\r\n }\r\n }\r\n\r\n .color-picker {\r\n width: 100%;\r\n\r\n .color-rect {\r\n height: $squareSize;\r\n width: $squareSize;\r\n cursor: pointer;\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: 100;\r\n }\r\n\r\n .color-picker-float {\r\n position: absolute;\r\n\r\n .color-picker-container {\r\n width: 200px;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
67
68
  // Exports
69
+ ___CSS_LOADER_EXPORT___.locals = {};
68
70
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
69
71
 
70
72
 
@@ -92,6 +94,7 @@ var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBP
92
94
  // Module
93
95
  ___CSS_LOADER_EXPORT___.push([module.id, "#bottom-bar {\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 10px 210px 10px 1fr 10px 61px 10px; }\n #bottom-bar #bottom-bar-total {\n grid-row: 1;\n grid-column: 6;\n color: white;\n background: #222222;\n height: 25px;\n align-self: center;\n font-size: 12pt; }\n #bottom-bar #bottom-bar-total #clip-range {\n width: 100%; }\n #bottom-bar .control-button .control-button-image {\n display: unset; }\n #bottom-bar .control-button .control-button-hover-image {\n display: none; }\n #bottom-bar .control-button:hover {\n cursor: pointer; }\n #bottom-bar .control-button:hover .control-button-image {\n display: none; }\n #bottom-bar .control-button:hover .control-button-hover-image {\n display: unset; }\n #bottom-bar .control-button:active {\n transform-origin: 50% 50%;\n transform: scale(0.96); }\n #bottom-bar #media-player {\n grid-row: 1;\n grid-column: 2;\n display: grid;\n align-self: center;\n justify-self: center;\n grid-template-rows: 100%;\n grid-template-columns: 23px 23px 23px 23px 23px 23px 23px; }\n #bottom-bar #media-player #start-key {\n grid-row: 1;\n grid-column: 1; }\n #bottom-bar #media-player #prev-frame {\n grid-row: 1;\n grid-column: 2; }\n #bottom-bar #media-player #first-key {\n grid-row: 1;\n grid-column: 3; }\n #bottom-bar #media-player #rev-key {\n grid-row: 1;\n grid-column: 4; }\n #bottom-bar #media-player #fwd-key {\n grid-row: 1;\n grid-column: 5; }\n #bottom-bar #media-player #next-key {\n grid-row: 1;\n grid-column: 6; }\n #bottom-bar #media-player #next-frame {\n grid-row: 1;\n grid-column: 7; }\n #bottom-bar #media-player #end-key {\n grid-row: 1;\n grid-column: 8; }\n #bottom-bar #range-selector {\n grid-row: 1;\n grid-column: 4;\n background: #222222;\n width: 100%;\n height: calc(100% - 20px);\n margin: 10px 0;\n position: relative; }\n #bottom-bar #range-selector #range-scrollbar {\n position: absolute;\n left: 2px;\n top: 2px;\n right: 2px;\n bottom: 2px;\n background: #666666;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 20px auto 1fr auto 20px;\n color: #222222;\n font-family: \"acumin-pro-condensed\";\n font-size: 14px;\n min-width: 70px; }\n #bottom-bar #range-selector #range-scrollbar #left-handle {\n grid-row: 1;\n grid-column: 1; }\n #bottom-bar #range-selector #range-scrollbar #right-handle {\n grid-row: 1;\n grid-column: 5; }\n #bottom-bar #range-selector #range-scrollbar #from-key {\n grid-row: 1;\n grid-column: 2;\n align-self: center;\n justify-self: center;\n user-select: none;\n pointer-events: none; }\n #bottom-bar #range-selector #range-scrollbar #to-key {\n grid-row: 1;\n grid-column: 4;\n align-self: center;\n justify-self: center;\n user-select: none;\n pointer-events: none; }\n #bottom-bar #range-selector #range-scrollbar .handle {\n width: 20px;\n align-self: center;\n justify-self: center;\n cursor: pointer;\n user-select: none; }\n #bottom-bar #range-selector #range-scrollbar .handle img {\n pointer-events: none; }\n", "",{"version":3,"sources":["webpack://./../../../dev/inspector/dist/components/actionTabs/tabs/propertyGrids/animations/curveEditor/scss/bottomBar.scss"],"names":[],"mappings":"AAAA;EACI,aAAa;EACb,wBAAwB;EACxB,yDAAyD,EAAA;EAH7D;IAMQ,WAAW;IACX,cAAc;IACd,YAAY;IACZ,mBAAmB;IACnB,YAAY;IACZ,kBAAkB;IAClB,eAAe,EAAA;IAZvB;MAeY,WAAW,EAAA;EAfvB;IAqBY,cAAc,EAAA;EArB1B;IAyBY,aAAa,EAAA;EAzBzB;IA6BY,eAAe,EAAA;IA7B3B;MAgCgB,aAAa,EAAA;IAhC7B;MAoCgB,cAAc,EAAA;EApC9B;IAyCY,yBAAyB;IACzB,sBAAsB,EAAA;EA1ClC;IA+CQ,WAAW;IACX,cAAc;IACd,aAAa;IACb,kBAAkB;IAClB,oBAAoB;IACpB,wBAAwB;IACxB,yDAAyD,EAAA;IArDjE;MAwDY,WAAW;MACX,cAAc,EAAA;IAzD1B;MA6DY,WAAW;MACX,cAAc,EAAA;IA9D1B;MAkEY,WAAW;MACX,cAAc,EAAA;IAnE1B;MAuEY,WAAW;MACX,cAAc,EAAA;IAxE1B;MA4EY,WAAW;MACX,cAAc,EAAA;IA7E1B;MAiFY,WAAW;MACX,cAAc,EAAA;IAlF1B;MAsFY,WAAW;MACX,cAAc,EAAA;IAvF1B;MA2FY,WAAW;MACX,cAAc,EAAA;EA5F1B;IAiGQ,WAAW;IACX,cAAc;IACd,mBAAmB;IACnB,WAAW;IACX,yBAAyB;IACzB,cAAc;IACd,kBAAkB,EAAA;IAvG1B;MA0GY,kBAAkB;MAClB,SAAS;MACT,QAAQ;MACR,UAAU;MACV,WAAW;MACX,mBAAmB;MACnB,aAAa;MACb,wBAAwB;MACxB,8CAA8C;MAC9C,cAAc;MACd,mCAAmC;MACnC,eAAe;MACf,eAAe,EAAA;MAtH3B;QAyHgB,WAAW;QACX,cAAc,EAAA;MA1H9B;QA8HgB,WAAW;QACX,cAAc,EAAA;MA/H9B;QAmIgB,WAAW;QACX,cAAc;QACd,kBAAkB;QAClB,oBAAoB;QACpB,iBAAiB;QACjB,oBAAoB,EAAA;MAxIpC;QA4IgB,WAAW;QACX,cAAc;QACd,kBAAkB;QAClB,oBAAoB;QACpB,iBAAiB;QACjB,oBAAoB,EAAA;MAjJpC;QAqJgB,WAAW;QACX,kBAAkB;QAClB,oBAAoB;QACpB,eAAe;QACf,iBAAiB,EAAA;QAzJjC;UA4JoB,oBAAoB,EAAA","sourcesContent":["#bottom-bar {\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 10px 210px 10px 1fr 10px 61px 10px;\r\n\r\n #bottom-bar-total {\r\n grid-row: 1;\r\n grid-column: 6;\r\n color: white;\r\n background: #222222;\r\n height: 25px;\r\n align-self: center;\r\n font-size: 12pt;\r\n\r\n #clip-range {\r\n width: 100%;\r\n }\r\n }\r\n\r\n .control-button {\r\n .control-button-image {\r\n display: unset;\r\n }\r\n\r\n .control-button-hover-image {\r\n display: none;\r\n }\r\n\r\n &:hover {\r\n cursor: pointer;\r\n\r\n .control-button-image {\r\n display: none;\r\n }\r\n\r\n .control-button-hover-image {\r\n display: unset;\r\n }\r\n }\r\n\r\n &:active {\r\n transform-origin: 50% 50%;\r\n transform: scale(0.96);\r\n }\r\n }\r\n\r\n #media-player {\r\n grid-row: 1;\r\n grid-column: 2;\r\n display: grid;\r\n align-self: center;\r\n justify-self: center;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 23px 23px 23px 23px 23px 23px 23px;\r\n\r\n #start-key {\r\n grid-row: 1;\r\n grid-column: 1;\r\n }\r\n\r\n #prev-frame {\r\n grid-row: 1;\r\n grid-column: 2;\r\n }\r\n\r\n #first-key {\r\n grid-row: 1;\r\n grid-column: 3;\r\n }\r\n\r\n #rev-key {\r\n grid-row: 1;\r\n grid-column: 4;\r\n }\r\n\r\n #fwd-key {\r\n grid-row: 1;\r\n grid-column: 5;\r\n }\r\n\r\n #next-key {\r\n grid-row: 1;\r\n grid-column: 6;\r\n }\r\n\r\n #next-frame {\r\n grid-row: 1;\r\n grid-column: 7;\r\n }\r\n\r\n #end-key {\r\n grid-row: 1;\r\n grid-column: 8;\r\n }\r\n }\r\n\r\n #range-selector {\r\n grid-row: 1;\r\n grid-column: 4;\r\n background: #222222;\r\n width: 100%;\r\n height: calc(100% - 20px);\r\n margin: 10px 0;\r\n position: relative;\r\n\r\n #range-scrollbar {\r\n position: absolute;\r\n left: 2px;\r\n top: 2px;\r\n right: 2px;\r\n bottom: 2px;\r\n background: #666666;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 20px auto 1fr auto 20px;\r\n color: #222222;\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 14px;\r\n min-width: 70px;\r\n\r\n #left-handle {\r\n grid-row: 1;\r\n grid-column: 1;\r\n }\r\n\r\n #right-handle {\r\n grid-row: 1;\r\n grid-column: 5;\r\n }\r\n\r\n #from-key {\r\n grid-row: 1;\r\n grid-column: 2;\r\n align-self: center;\r\n justify-self: center;\r\n user-select: none;\r\n pointer-events: none;\r\n }\r\n\r\n #to-key {\r\n grid-row: 1;\r\n grid-column: 4;\r\n align-self: center;\r\n justify-self: center;\r\n user-select: none;\r\n pointer-events: none;\r\n }\r\n\r\n .handle {\r\n width: 20px;\r\n align-self: center;\r\n justify-self: center;\r\n cursor: pointer;\r\n user-select: none;\r\n\r\n img {\r\n pointer-events: none;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
94
96
  // Exports
97
+ ___CSS_LOADER_EXPORT___.locals = {};
95
98
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
96
99
 
97
100
 
@@ -119,6 +122,7 @@ var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBP
119
122
  // Module
120
123
  ___CSS_LOADER_EXPORT___.push([module.id, "#canvas-zone {\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: 1fr 30px 10px 40px;\n overflow: hidden;\n position: relative; }\n #canvas-zone #graph {\n grid-column: 1;\n grid-row: 1;\n width: 100%;\n height: 100%;\n background: #222222;\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: 100%;\n overflow: hidden;\n position: relative; }\n #canvas-zone #graph #svg-graph-grid {\n grid-column: 1;\n grid-row: 1;\n width: 100%;\n height: 100%;\n pointer-events: none;\n z-index: 1; }\n #canvas-zone #graph #svg-graph-grid:focus {\n outline: none; }\n #canvas-zone #graph #svg-graph-horizontal {\n grid-column: 1;\n grid-row: 1;\n margin-left: 40px;\n width: calc(100% - 40px);\n height: 100%;\n pointer-events: none;\n z-index: 1; }\n #canvas-zone #graph #svg-graph-horizontal:focus {\n outline: none; }\n #canvas-zone #graph #dark-rectangle {\n grid-column: 1;\n grid-row: 1;\n margin-left: 40px;\n width: calc(100% - 40px);\n height: 100%;\n background: #111111;\n opacity: 0.2;\n pointer-events: none;\n position: absolute; }\n #canvas-zone #graph #block-rectangle {\n grid-column: 1;\n grid-row: 1;\n width: 40px;\n height: 100%;\n background: #222222;\n z-index: 1; }\n #canvas-zone #graph #svg-graph-curves {\n grid-column: 1;\n grid-row: 1;\n margin-left: 40px;\n width: calc(100% - 40px);\n height: 100%;\n z-index: 2; }\n #canvas-zone #graph #svg-graph-curves:focus {\n outline: none; }\n #canvas-zone #graph #selection-rectangle {\n grid-column: 1;\n grid-row: 1;\n width: calc(100% - 40px);\n height: 100%;\n pointer-events: none;\n position: absolute;\n left: 40px;\n visibility: hidden;\n border: 1px dashed white; }\n #canvas-zone #range-frame-bar {\n grid-column: 1;\n grid-row: 4;\n width: 100%;\n height: 100%;\n background: #222222;\n pointer-events: none;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%;\n pointer-events: none;\n user-select: none; }\n #canvas-zone #range-frame-bar #svg-range-frames {\n grid-column: 1;\n grid-row: 1;\n width: 100%;\n height: 100%; }\n #canvas-zone #frame-bar {\n grid-column: 1;\n grid-row: 2;\n width: 100%;\n height: 100%;\n background: #222222;\n pointer-events: none;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 40px 1fr; }\n #canvas-zone #frame-bar #angle-unit {\n grid-column: 1;\n grid-row: 1;\n background: #111111; }\n #canvas-zone #frame-bar #frames {\n grid-column: 1 / 3;\n grid-row: 1;\n width: 100%;\n height: 100%;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 100%; }\n #canvas-zone #frame-bar #frames #svg-frames {\n margin-left: 40px;\n grid-column: 1;\n grid-row: 1;\n width: calc(100% - 40px);\n height: 100%; }\n #canvas-zone #play-head-control {\n grid-column: 1;\n grid-row: 2;\n position: absolute;\n height: 30px;\n left: 40px;\n width: calc(100% - 40px); }\n #canvas-zone #play-head {\n grid-column: 1;\n grid-row: 1 / 3;\n position: absolute;\n top: 0;\n height: calc(100% - 5px);\n width: 22px;\n margin-left: 40px;\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: 1fr 22px;\n transform: translateX(-50%);\n pointer-events: none;\n z-index: 3; }\n #canvas-zone #play-head #play-head-bar {\n grid-row: 1;\n grid-column: 1;\n justify-self: center;\n width: 1.5px;\n background: #ffffff;\n height: 100%;\n pointer-events: none; }\n #canvas-zone #play-head #play-head-circle {\n grid-row: 2;\n grid-column: 1;\n width: 22px;\n height: 22px;\n border-radius: 50%;\n background: #ffffff;\n font-family: \"acumin-pro-condensed\";\n font-size: 8pt;\n display: grid;\n align-content: center;\n justify-content: center;\n color: #555555;\n cursor: pointer; }\n #canvas-zone #angle-mode {\n grid-column: 1;\n grid-row: 2;\n width: 40px;\n height: 100%;\n z-index: 1;\n background: #222222; }\n", "",{"version":3,"sources":["webpack://./../../../dev/inspector/dist/components/actionTabs/tabs/propertyGrids/animations/curveEditor/scss/canvas.scss"],"names":[],"mappings":"AAAA;EACI,aAAa;EACb,2BAA2B;EAC3B,sCAAsC;EACtC,gBAAgB;EAChB,kBAAkB,EAAA;EALtB;IAQQ,cAAc;IACd,WAAW;IACX,WAAW;IACX,YAAY;IACZ,mBAAmB;IACnB,aAAa;IACb,2BAA2B;IAC3B,wBAAwB;IACxB,gBAAgB;IAChB,kBAAkB,EAAA;IAjB1B;MAoBY,cAAc;MACd,WAAW;MACX,WAAW;MACX,YAAY;MACZ,oBAAoB;MAKpB,UAAU,EAAA;MA7BtB;QA2BgB,aAAa,EAAA;IA3B7B;MAiCY,cAAc;MACd,WAAW;MACX,iBAAiB;MACjB,wBAAwB;MACxB,YAAY;MACZ,oBAAoB;MAKpB,UAAU,EAAA;MA3CtB;QAyCgB,aAAa,EAAA;IAzC7B;MA+CY,cAAc;MACd,WAAW;MACX,iBAAiB;MACjB,wBAAwB;MACxB,YAAY;MACZ,mBAAmB;MACnB,YAAY;MACZ,oBAAoB;MACpB,kBAAkB,EAAA;IAvD9B;MA2DY,cAAc;MACd,WAAW;MACX,WAAW;MACX,YAAY;MACZ,mBAAmB;MACnB,UAAU,EAAA;IAhEtB;MAoEY,cAAc;MACd,WAAW;MACX,iBAAiB;MACjB,wBAAwB;MACxB,YAAY;MACZ,UAAU,EAAA;MAzEtB;QA4EgB,aAAa,EAAA;IA5E7B;MAiFY,cAAc;MACd,WAAW;MACX,wBAAwB;MACxB,YAAY;MACZ,oBAAoB;MACpB,kBAAkB;MAClB,UAAU;MACV,kBAAkB;MAElB,wBAAwB,EAAA;EA1FpC;IA+FQ,cAAc;IACd,WAAW;IACX,WAAW;IACX,YAAY;IACZ,mBAAmB;IACnB,oBAAoB;IACpB,aAAa;IACb,wBAAwB;IACxB,2BAA2B;IAC3B,oBAAoB;IACpB,iBAAiB,EAAA;IAzGzB;MA4GY,cAAc;MACd,WAAW;MACX,WAAW;MACX,YAAY,EAAA;EA/GxB;IAoHQ,cAAc;IACd,WAAW;IACX,WAAW;IACX,YAAY;IACZ,mBAAmB;IACnB,oBAAoB;IAEpB,aAAa;IACb,wBAAwB;IACxB,+BAA+B,EAAA;IA7HvC;MAgIY,cAAc;MACd,WAAW;MACX,mBAAmB,EAAA;IAlI/B;MAsIY,kBAAkB;MAElB,WAAW;MACX,WAAW;MACX,YAAY;MACZ,aAAa;MACb,wBAAwB;MACxB,2BAA2B,EAAA;MA7IvC;QAgJgB,iBAAiB;QACjB,cAAc;QACd,WAAW;QACX,wBAAwB;QACxB,YAAY,EAAA;EApJ5B;IA0JQ,cAAc;IACd,WAAW;IACX,kBAAkB;IAClB,YAAY;IACZ,UAAU;IACV,wBAAwB,EAAA;EA/JhC;IAmKQ,cAAc;IACd,eAAe;IACf,kBAAkB;IAClB,MAAM;IACN,wBAAwB;IACxB,WAAW;IACX,iBAAiB;IACjB,aAAa;IACb,2BAA2B;IAC3B,4BAA4B;IAC5B,2BAA2B;IAC3B,oBAAoB;IACpB,UAAU,EAAA;IA/KlB;MAkLY,WAAW;MACX,cAAc;MACd,oBAAoB;MACpB,YAAY;MACZ,mBAAmB;MACnB,YAAY;MACZ,oBAAoB,EAAA;IAxLhC;MA4LY,WAAW;MACX,cAAc;MACd,WAAW;MACX,YAAY;MACZ,kBAAkB;MAClB,mBAAmB;MACnB,mCAAmC;MACnC,cAAc;MACd,aAAa;MACb,qBAAqB;MACrB,uBAAuB;MACvB,cAAc;MACd,eAAe,EAAA;EAxM3B;IA6MQ,cAAc;IACd,WAAW;IACX,WAAW;IACX,YAAY;IACZ,UAAU;IACV,mBAAmB,EAAA","sourcesContent":["#canvas-zone {\r\n display: grid;\r\n grid-template-columns: 100%;\r\n grid-template-rows: 1fr 30px 10px 40px;\r\n overflow: hidden;\r\n position: relative;\r\n\r\n #graph {\r\n grid-column: 1;\r\n grid-row: 1;\r\n width: 100%;\r\n height: 100%;\r\n background: #222222;\r\n display: grid;\r\n grid-template-columns: 100%;\r\n grid-template-rows: 100%;\r\n overflow: hidden;\r\n position: relative;\r\n\r\n #svg-graph-grid {\r\n grid-column: 1;\r\n grid-row: 1;\r\n width: 100%;\r\n height: 100%;\r\n pointer-events: none;\r\n\r\n &:focus {\r\n outline: none;\r\n }\r\n z-index: 1;\r\n }\r\n\r\n #svg-graph-horizontal {\r\n grid-column: 1;\r\n grid-row: 1;\r\n margin-left: 40px;\r\n width: calc(100% - 40px);\r\n height: 100%;\r\n pointer-events: none;\r\n\r\n &:focus {\r\n outline: none;\r\n }\r\n z-index: 1;\r\n }\r\n\r\n #dark-rectangle {\r\n grid-column: 1;\r\n grid-row: 1;\r\n margin-left: 40px;\r\n width: calc(100% - 40px);\r\n height: 100%;\r\n background: #111111;\r\n opacity: 0.2;\r\n pointer-events: none;\r\n position: absolute;\r\n }\r\n\r\n #block-rectangle {\r\n grid-column: 1;\r\n grid-row: 1;\r\n width: 40px;\r\n height: 100%;\r\n background: #222222;\r\n z-index: 1;\r\n }\r\n\r\n #svg-graph-curves {\r\n grid-column: 1;\r\n grid-row: 1;\r\n margin-left: 40px;\r\n width: calc(100% - 40px);\r\n height: 100%;\r\n z-index: 2;\r\n\r\n &:focus {\r\n outline: none;\r\n }\r\n }\r\n\r\n #selection-rectangle {\r\n grid-column: 1;\r\n grid-row: 1;\r\n width: calc(100% - 40px);\r\n height: 100%;\r\n pointer-events: none;\r\n position: absolute;\r\n left: 40px;\r\n visibility: hidden;\r\n\r\n border: 1px dashed white;\r\n }\r\n }\r\n\r\n #range-frame-bar {\r\n grid-column: 1;\r\n grid-row: 4;\r\n width: 100%;\r\n height: 100%;\r\n background: #222222;\r\n pointer-events: none;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 100%;\r\n pointer-events: none;\r\n user-select: none;\r\n\r\n #svg-range-frames {\r\n grid-column: 1;\r\n grid-row: 1;\r\n width: 100%;\r\n height: 100%;\r\n }\r\n }\r\n\r\n #frame-bar {\r\n grid-column: 1;\r\n grid-row: 2;\r\n width: 100%;\r\n height: 100%;\r\n background: #222222;\r\n pointer-events: none;\r\n\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 40px 1fr;\r\n\r\n #angle-unit {\r\n grid-column: 1;\r\n grid-row: 1;\r\n background: #111111;\r\n }\r\n\r\n #frames {\r\n grid-column: 1 / 3;\r\n\r\n grid-row: 1;\r\n width: 100%;\r\n height: 100%;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 100%;\r\n\r\n #svg-frames {\r\n margin-left: 40px;\r\n grid-column: 1;\r\n grid-row: 1;\r\n width: calc(100% - 40px);\r\n height: 100%;\r\n }\r\n }\r\n }\r\n\r\n #play-head-control {\r\n grid-column: 1;\r\n grid-row: 2;\r\n position: absolute;\r\n height: 30px;\r\n left: 40px;\r\n width: calc(100% - 40px);\r\n }\r\n\r\n #play-head {\r\n grid-column: 1;\r\n grid-row: 1 / 3;\r\n position: absolute;\r\n top: 0;\r\n height: calc(100% - 5px);\r\n width: 22px;\r\n margin-left: 40px;\r\n display: grid;\r\n grid-template-columns: 100%;\r\n grid-template-rows: 1fr 22px;\r\n transform: translateX(-50%);\r\n pointer-events: none;\r\n z-index: 3;\r\n\r\n #play-head-bar {\r\n grid-row: 1;\r\n grid-column: 1;\r\n justify-self: center;\r\n width: 1.5px;\r\n background: #ffffff;\r\n height: 100%;\r\n pointer-events: none;\r\n }\r\n\r\n #play-head-circle {\r\n grid-row: 2;\r\n grid-column: 1;\r\n width: 22px;\r\n height: 22px;\r\n border-radius: 50%;\r\n background: #ffffff;\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 8pt;\r\n display: grid;\r\n align-content: center;\r\n justify-content: center;\r\n color: #555555;\r\n cursor: pointer;\r\n }\r\n }\r\n\r\n #angle-mode {\r\n grid-column: 1;\r\n grid-row: 2;\r\n width: 40px;\r\n height: 100%;\r\n z-index: 1;\r\n background: #222222;\r\n }\r\n}\r\n"],"sourceRoot":""}]);
121
124
  // Exports
125
+ ___CSS_LOADER_EXPORT___.locals = {};
122
126
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
123
127
 
124
128
 
@@ -146,6 +150,7 @@ var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBP
146
150
  // Module
147
151
  ___CSS_LOADER_EXPORT___.push([module.id, "#curve-editor {\n background: #333333;\n width: 100%;\n height: 100%;\n display: grid;\n grid-template-rows: 40px calc(100% - 85px) 45px;\n grid-template-columns: 10px 210px 10px 1fr 10px; }\n #curve-editor #top-bar {\n background: #333333;\n grid-row: 1;\n grid-column: 1 / 6;\n width: 100%;\n height: 100%; }\n #curve-editor #bottom-bar {\n background: #333333;\n grid-row: 3;\n grid-column: 1 / 6;\n width: 100%;\n height: 100%; }\n #curve-editor #canvas-zone {\n grid-row: 2;\n grid-column: 4;\n width: 100%;\n height: 100%;\n background: #333333; }\n #curve-editor #sidebar {\n grid-row: 2;\n grid-column: 2;\n width: 100%;\n height: 100%;\n background: #111111; }\n #curve-editor .action-button:hover {\n background: #666666;\n color: white;\n cursor: pointer; }\n #curve-editor .action-button.active {\n background: #111111; }\n #curve-editor .action-button:active {\n transform-origin: 50% 50%;\n transform: scale(0.96); }\n #curve-editor .push-button {\n cursor: pointer; }\n #curve-editor .push-button.active {\n background: #666666; }\n #curve-editor .text-input {\n color: white;\n background: #000000;\n font-family: \"acumin-pro-condensed\";\n font-size: 11pt;\n border: 0;\n margin: 3px 1px;\n text-align: end;\n padding-right: 4px; }\n #curve-editor .text-input:focus {\n outline: none; }\n", "",{"version":3,"sources":["webpack://./../../../dev/inspector/dist/components/actionTabs/tabs/propertyGrids/animations/curveEditor/scss/curveEditor.scss"],"names":[],"mappings":"AAAA;EACI,mBAAmB;EACnB,WAAW;EACX,YAAY;EACZ,aAAa;EACb,+CAA+C;EAC/C,+CAA+C,EAAA;EANnD;IASQ,mBAAmB;IACnB,WAAW;IACX,kBAAkB;IAClB,WAAW;IACX,YAAY,EAAA;EAbpB;IAiBQ,mBAAmB;IACnB,WAAW;IACX,kBAAkB;IAClB,WAAW;IACX,YAAY,EAAA;EArBpB;IAyBQ,WAAW;IACX,cAAc;IACd,WAAW;IACX,YAAY;IACZ,mBAAmB,EAAA;EA7B3B;IAiCQ,WAAW;IACX,cAAc;IACd,WAAW;IACX,YAAY;IACZ,mBAAmB,EAAA;EArC3B;IA0CY,mBAAmB;IACnB,YAAY;IACZ,eAAe,EAAA;EA5C3B;IAgDY,mBAAmB,EAAA;EAhD/B;IAoDY,yBAAyB;IACzB,sBAAsB,EAAA;EArDlC;IA0DQ,eAAe,EAAA;IA1DvB;MA4DY,mBAAmB,EAAA;EA5D/B;IAiEQ,YAAY;IACZ,mBAAmB;IACnB,mCAAmC;IACnC,eAAe;IACf,SAAS;IACT,eAAe;IACf,eAAe;IACf,kBAAkB,EAAA;IAxE1B;MA2EY,aAAa,EAAA","sourcesContent":["#curve-editor {\r\n background: #333333;\r\n width: 100%;\r\n height: 100%;\r\n display: grid;\r\n grid-template-rows: 40px calc(100% - 85px) 45px;\r\n grid-template-columns: 10px 210px 10px 1fr 10px;\r\n\r\n #top-bar {\r\n background: #333333;\r\n grid-row: 1;\r\n grid-column: 1 / 6;\r\n width: 100%;\r\n height: 100%;\r\n }\r\n\r\n #bottom-bar {\r\n background: #333333;\r\n grid-row: 3;\r\n grid-column: 1 / 6;\r\n width: 100%;\r\n height: 100%;\r\n }\r\n\r\n #canvas-zone {\r\n grid-row: 2;\r\n grid-column: 4;\r\n width: 100%;\r\n height: 100%;\r\n background: #333333;\r\n }\r\n\r\n #sidebar {\r\n grid-row: 2;\r\n grid-column: 2;\r\n width: 100%;\r\n height: 100%;\r\n background: #111111;\r\n }\r\n\r\n .action-button {\r\n &:hover {\r\n background: #666666;\r\n color: white;\r\n cursor: pointer;\r\n }\r\n\r\n &.active {\r\n background: #111111;\r\n }\r\n\r\n &:active {\r\n transform-origin: 50% 50%;\r\n transform: scale(0.96);\r\n }\r\n }\r\n\r\n .push-button {\r\n cursor: pointer;\r\n &.active {\r\n background: #666666;\r\n }\r\n }\r\n\r\n .text-input {\r\n color: white;\r\n background: #000000;\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 11pt;\r\n border: 0;\r\n margin: 3px 1px;\r\n text-align: end;\r\n padding-right: 4px;\r\n\r\n &:focus {\r\n outline: none;\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
148
152
  // Exports
153
+ ___CSS_LOADER_EXPORT___.locals = {};
149
154
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
150
155
 
151
156
 
@@ -173,6 +178,7 @@ var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBP
173
178
  // Module
174
179
  ___CSS_LOADER_EXPORT___.push([module.id, "#sideBar {\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: 30px 1fr; }\n #sideBar #menu-bar {\n background: #252525;\n grid-row: 1;\n grid-column: 1;\n width: 100%;\n height: 100%;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 30px 30px 30px 30px 1fr 52px 3px; }\n #sideBar #menu-bar.small {\n grid-template-columns: 0px 0px 30px 30px 1fr 52px 3px; }\n #sideBar #menu-bar #add-animation {\n grid-row: 1;\n grid-column: 1; }\n #sideBar #menu-bar #load-animation {\n grid-row: 1;\n grid-column: 2; }\n #sideBar #menu-bar #save-animation {\n grid-row: 1;\n grid-column: 3; }\n #sideBar #menu-bar #edit-animation {\n grid-row: 1;\n grid-column: 4; }\n #sideBar #menu-bar #framerate-animation {\n grid-row: 1;\n grid-column: 6; }\n #sideBar .simple-button {\n width: 80px;\n height: 20px;\n color: white;\n font-family: \"acumin-pro-condensed\";\n font-size: 10pt;\n background: #444444;\n border: 0;\n line-height: 12px;\n cursor: pointer;\n align-self: center;\n justify-self: center;\n border-radius: 0; }\n #sideBar .simple-button:active {\n transform-origin: center;\n transform: scale(0.95); }\n #sideBar #save-animation-pane {\n width: 100%;\n height: 100%;\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: 1fr 40px auto; }\n #sideBar #save-animation-pane #save-animation-list {\n grid-row: 1;\n grid-column: 1;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: column;\n padding-top: 5px; }\n #sideBar #save-animation-pane #save-animation-list .save-animation-list-entry {\n height: 20px;\n margin-left: 10px;\n display: flex;\n align-content: center;\n color: white;\n font-family: \"acumin-pro-condensed\";\n font-size: 10pt;\n line-height: 15px; }\n #sideBar #save-animation-pane #save-animation-buttons {\n grid-row: 2;\n grid-column: 1;\n width: 100%;\n height: 100%;\n display: grid;\n grid-template-rows: 100%;\n grid-template-columns: 10px 1fr 10px 1fr 10px;\n align-items: center; }\n #sideBar #save-animation-pane #save-animation-buttons #save-snippet {\n grid-row: 1;\n grid-column: 2; }\n #sideBar #save-animation-pane #save-animation-buttons #save-file {\n grid-row: 1;\n grid-column: 4; }\n #sideBar #save-animation-pane #save-animation-snippet {\n grid-row: 3;\n grid-column: 1;\n width: calc(100% - 31px);\n height: 20px;\n align-content: center;\n color: white;\n font-family: \"acumin-pro-condensed\";\n font-size: 10pt;\n padding-left: 31px;\n background: #252525; }\n #sideBar #load-animation-pane {\n width: 100%;\n height: 100%;\n display: grid;\n grid-template-columns: 75px 1fr;\n grid-template-rows: 10px 20px 10px 20px 10px 20px 1fr auto;\n color: white;\n font-family: \"acumin-pro-condensed\";\n font-size: 10pt; }\n #sideBar #load-animation-pane #load-animation-snippet-id-label {\n grid-row: 2;\n grid-column: 1;\n justify-self: end;\n margin-right: 10px; }\n #sideBar #load-animation-pane #load-animation-local-file-label {\n grid-row: 6;\n grid-column: 1;\n justify-self: end;\n margin-right: 10px; }\n #sideBar #load-animation-pane #load-snippet-id {\n grid-row: 2;\n grid-column: 2;\n margin-right: 10px;\n border: 0;\n background: #252525;\n width: 127px;\n color: white;\n font-family: \"acumin-pro-condensed\";\n font-size: 10pt; }\n #sideBar #load-animation-pane #load-snippet {\n grid-row: 4;\n grid-column: 2;\n width: 60px;\n justify-self: left; }\n #sideBar #load-animation-pane input[type=\"file\"] {\n display: none; }\n #sideBar #load-animation-pane #file-snippet-label {\n grid-row: 6;\n grid-column: 2;\n width: 60px;\n justify-self: left;\n text-align: center;\n line-height: 18px; }\n #sideBar #load-animation-pane #load-animation-snippet {\n grid-row: 8;\n grid-column: 1 / 3;\n width: calc(100% - 31px);\n height: 20px;\n align-content: center;\n color: white;\n font-family: \"acumin-pro-condensed\";\n font-size: 10pt;\n padding-left: 31px;\n background: #252525; }\n #sideBar #add-animation-pane {\n grid-column: 1;\n grid-row: 2;\n width: 100%;\n height: 100%;\n display: grid;\n grid-template-columns: 75px 1fr;\n grid-template-rows: 10px 20px 10px 20px 10px 20px 10px 20px 10px 20px 10px 20px 1fr;\n color: white;\n font-family: \"acumin-pro-condensed\";\n font-size: 10pt; }\n #sideBar #add-animation-pane .input-text {\n border: 0;\n background: #252525;\n width: 127px;\n color: white;\n font-family: \"acumin-pro-condensed\";\n font-size: 10pt; }\n #sideBar #add-animation-pane .option {\n background: #252525;\n color: white;\n border: 0; }\n #sideBar #add-animation-pane #add-animation-display-name-label {\n grid-row: 2;\n grid-column: 1;\n justify-self: end;\n margin-right: 10px; }\n #sideBar #add-animation-pane #add-animation-mode-label {\n grid-row: 4;\n grid-column: 1;\n justify-self: end;\n margin-right: 10px; }\n #sideBar #add-animation-pane #add-animation-property-label {\n grid-row: 6;\n grid-column: 1;\n justify-self: end;\n margin-right: 10px; }\n #sideBar #add-animation-pane #add-animation-type-label {\n grid-row: 8;\n grid-column: 1;\n justify-self: end;\n margin-right: 10px; }\n #sideBar #add-animation-pane #add-animation-loop-mode-label {\n grid-row: 10;\n grid-column: 1;\n justify-self: end;\n margin-right: 10px; }\n #sideBar #add-animation-pane #add-animation-name {\n grid-row: 2;\n grid-column: 2;\n margin-right: 10px; }\n #sideBar #add-animation-pane #add-animation-mode {\n grid-row: 4;\n grid-column: 2;\n margin-right: 10px;\n width: calc(100% - 10px); }\n #sideBar #add-animation-pane #add-animation-property {\n grid-row: 6;\n grid-column: 2;\n margin-right: 10px;\n width: calc(100% - 10px); }\n #sideBar #add-animation-pane #add-animation-type {\n grid-row: 8;\n grid-column: 2;\n margin-right: 10px; }\n #sideBar #add-animation-pane #add-animation-loop-mode {\n grid-row: 10;\n grid-column: 2;\n margin-right: 10px; }\n #sideBar #add-animation-pane #add-animation {\n grid-row: 12;\n grid-column: 2;\n justify-self: left; }\n #sideBar #edit-animation-pane {\n grid-column: 1;\n grid-row: 2;\n width: 100%;\n height: 100%;\n display: grid;\n grid-template-columns: 75px 1fr;\n grid-template-rows: 10px 20px 10px 20px 10px 20px 10px 20px 1fr;\n color: white;\n font-family: \"acumin-pro-condensed\";\n font-size: 10pt;\n background: #111111; }\n #sideBar #edit-animation-pane .input-text {\n border: 0;\n background: #252525;\n width: 127px;\n color: white;\n font-family: \"acumin-pro-condensed\";\n font-size: 10pt; }\n #sideBar #edit-animation-pane .option {\n background: #252525;\n color: white;\n border: 0; }\n #sideBar #edit-animation-pane #edit-animation-display-name-label {\n grid-row: 2;\n grid-column: 1;\n justify-self: end;\n margin-right: 10px; }\n #sideBar #edit-animation-pane #edit-animation-property-label {\n grid-row: 4;\n grid-column: 1;\n justify-self: end;\n margin-right: 10px; }\n #sideBar #edit-animation-pane #edit-animation-loop-mode-label {\n grid-row: 6;\n grid-column: 1;\n justify-self: end;\n margin-right: 10px; }\n #sideBar #edit-animation-pane #edit-animation-name {\n grid-row: 2;\n grid-column: 2;\n margin-right: 10px; }\n #sideBar #edit-animation-pane #edit-animation-property {\n grid-row: 4;\n grid-column: 2;\n margin-right: 10px; }\n #sideBar #edit-animation-pane #edit-animation-loop-mode {\n grid-row: 6;\n grid-column: 2;\n margin-right: 10px; }\n #sideBar #edit-animation-pane #edit-animation {\n grid-row: 8;\n grid-column: 1 / 3;\n display: grid;\n grid-template-columns: 50% 50%;\n grid-template-rows: 100%; }\n #sideBar #edit-animation-pane #edit-animation #edit-animation-ok {\n grid-row: 1;\n grid-column: 1; }\n #sideBar #edit-animation-pane #edit-animation #edit-animation-cancel {\n grid-row: 1;\n grid-column: 2; }\n #sideBar #animation-list {\n background: #111111;\n grid-row: 2;\n grid-column: 1;\n width: 100%;\n height: 100%; }\n #sideBar #animation-list .animation-entry {\n height: 20px;\n display: grid;\n grid-template-columns: 20px 10px 1fr 20px 20px;\n grid-template-rows: 100%; }\n #sideBar #animation-list .animation-entry.isActive {\n background: #444444; }\n #sideBar #animation-list .animation-entry .animation-active-indicator {\n grid-row: 1;\n grid-column: 1;\n display: grid;\n margin: 5px;\n padding-top: 2px; }\n #sideBar #animation-list .animation-entry .animation-chevron {\n grid-row: 1;\n grid-column: 2;\n display: grid;\n align-content: center;\n padding-top: 5px;\n cursor: pointer; }\n #sideBar #animation-list .animation-entry .animation-chevron .animation-chevron-image.collapsed {\n transform-origin: 50% 50%;\n transform: rotateZ(-90deg); }\n #sideBar #animation-list .animation-entry .animation-name {\n cursor: pointer;\n grid-row: 1;\n grid-column: 3;\n font-family: \"acumin-pro-condensed\";\n font-size: 10.5pt;\n color: white;\n display: grid;\n align-self: center;\n margin-left: 5px;\n user-select: none; }\n #sideBar #animation-list .animation-entry .animation-options {\n grid-row: 1;\n grid-column: 4; }\n #sideBar #animation-list .animation-entry .animation-delete {\n grid-row: 1;\n grid-column: 5; }\n", "",{"version":3,"sources":["webpack://./../../../dev/inspector/dist/components/actionTabs/tabs/propertyGrids/animations/curveEditor/scss/sideBar.scss"],"names":[],"mappings":"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","sourcesContent":["#sideBar {\r\n display: grid;\r\n grid-template-columns: 100%;\r\n grid-template-rows: 30px 1fr;\r\n\r\n #menu-bar {\r\n background: #252525;\r\n grid-row: 1;\r\n grid-column: 1;\r\n width: 100%;\r\n height: 100%;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 30px 30px 30px 30px 1fr 52px 3px;\r\n\r\n &.small {\r\n grid-template-columns: 0px 0px 30px 30px 1fr 52px 3px;\r\n }\r\n\r\n #add-animation {\r\n grid-row: 1;\r\n grid-column: 1;\r\n }\r\n\r\n #load-animation {\r\n grid-row: 1;\r\n grid-column: 2;\r\n }\r\n\r\n #save-animation {\r\n grid-row: 1;\r\n grid-column: 3;\r\n }\r\n\r\n #edit-animation {\r\n grid-row: 1;\r\n grid-column: 4;\r\n }\r\n\r\n #framerate-animation {\r\n grid-row: 1;\r\n grid-column: 6;\r\n }\r\n }\r\n\r\n .simple-button {\r\n width: 80px;\r\n height: 20px;\r\n color: white;\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 10pt;\r\n background: #444444;\r\n border: 0;\r\n line-height: 12px;\r\n cursor: pointer;\r\n align-self: center;\r\n justify-self: center;\r\n border-radius: 0;\r\n\r\n &:active {\r\n transform-origin: center;\r\n transform: scale(0.95);\r\n }\r\n }\r\n\r\n #save-animation-pane {\r\n width: 100%;\r\n height: 100%;\r\n display: grid;\r\n grid-template-columns: 100%;\r\n grid-template-rows: 1fr 40px auto;\r\n\r\n #save-animation-list {\r\n grid-row: 1;\r\n grid-column: 1;\r\n width: 100%;\r\n height: 100%;\r\n display: flex;\r\n flex-direction: column;\r\n padding-top: 5px;\r\n\r\n .save-animation-list-entry {\r\n height: 20px;\r\n margin-left: 10px;\r\n display: flex;\r\n align-content: center;\r\n color: white;\r\n\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 10pt;\r\n line-height: 15px;\r\n }\r\n }\r\n\r\n #save-animation-buttons {\r\n grid-row: 2;\r\n grid-column: 1;\r\n width: 100%;\r\n height: 100%;\r\n display: grid;\r\n grid-template-rows: 100%;\r\n grid-template-columns: 10px 1fr 10px 1fr 10px;\r\n align-items: center;\r\n\r\n #save-snippet {\r\n grid-row: 1;\r\n grid-column: 2;\r\n }\r\n\r\n #save-file {\r\n grid-row: 1;\r\n grid-column: 4;\r\n }\r\n }\r\n\r\n #save-animation-snippet {\r\n grid-row: 3;\r\n grid-column: 1;\r\n width: calc(100% - 31px);\r\n height: 20px;\r\n align-content: center;\r\n color: white;\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 10pt;\r\n padding-left: 31px;\r\n background: #252525;\r\n }\r\n }\r\n\r\n #load-animation-pane {\r\n width: 100%;\r\n height: 100%;\r\n display: grid;\r\n grid-template-columns: 75px 1fr;\r\n grid-template-rows: 10px 20px 10px 20px 10px 20px 1fr auto;\r\n color: white;\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 10pt;\r\n\r\n #load-animation-snippet-id-label {\r\n grid-row: 2;\r\n grid-column: 1;\r\n justify-self: end;\r\n margin-right: 10px;\r\n }\r\n\r\n #load-animation-local-file-label {\r\n grid-row: 6;\r\n grid-column: 1;\r\n justify-self: end;\r\n margin-right: 10px;\r\n }\r\n\r\n #load-snippet-id {\r\n grid-row: 2;\r\n grid-column: 2;\r\n margin-right: 10px;\r\n border: 0;\r\n background: #252525;\r\n width: 127px;\r\n color: white;\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 10pt;\r\n }\r\n\r\n #load-snippet {\r\n grid-row: 4;\r\n grid-column: 2;\r\n width: 60px;\r\n justify-self: left;\r\n }\r\n\r\n input[type=\"file\"] {\r\n display: none;\r\n }\r\n\r\n #file-snippet-label {\r\n grid-row: 6;\r\n grid-column: 2;\r\n width: 60px;\r\n justify-self: left;\r\n text-align: center;\r\n line-height: 18px;\r\n }\r\n\r\n #load-animation-snippet {\r\n grid-row: 8;\r\n grid-column: 1 / 3;\r\n width: calc(100% - 31px);\r\n height: 20px;\r\n align-content: center;\r\n color: white;\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 10pt;\r\n padding-left: 31px;\r\n background: #252525;\r\n }\r\n }\r\n\r\n #add-animation-pane {\r\n grid-column: 1;\r\n grid-row: 2;\r\n width: 100%;\r\n height: 100%;\r\n display: grid;\r\n grid-template-columns: 75px 1fr;\r\n grid-template-rows: 10px 20px 10px 20px 10px 20px 10px 20px 10px 20px 10px 20px 1fr;\r\n color: white;\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 10pt;\r\n\r\n .input-text {\r\n border: 0;\r\n background: #252525;\r\n width: 127px;\r\n color: white;\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 10pt;\r\n }\r\n\r\n .option {\r\n background: #252525;\r\n color: white;\r\n border: 0;\r\n }\r\n\r\n #add-animation-display-name-label {\r\n grid-row: 2;\r\n grid-column: 1;\r\n justify-self: end;\r\n margin-right: 10px;\r\n }\r\n\r\n #add-animation-mode-label {\r\n grid-row: 4;\r\n grid-column: 1;\r\n justify-self: end;\r\n margin-right: 10px;\r\n }\r\n\r\n #add-animation-property-label {\r\n grid-row: 6;\r\n grid-column: 1;\r\n justify-self: end;\r\n margin-right: 10px;\r\n }\r\n\r\n #add-animation-type-label {\r\n grid-row: 8;\r\n grid-column: 1;\r\n justify-self: end;\r\n margin-right: 10px;\r\n }\r\n\r\n #add-animation-loop-mode-label {\r\n grid-row: 10;\r\n grid-column: 1;\r\n justify-self: end;\r\n margin-right: 10px;\r\n }\r\n\r\n #add-animation-name {\r\n grid-row: 2;\r\n grid-column: 2;\r\n margin-right: 10px;\r\n }\r\n\r\n #add-animation-mode {\r\n grid-row: 4;\r\n grid-column: 2;\r\n margin-right: 10px;\r\n width: calc(100% - 10px);\r\n }\r\n\r\n #add-animation-property {\r\n grid-row: 6;\r\n grid-column: 2;\r\n margin-right: 10px;\r\n width: calc(100% - 10px);\r\n }\r\n\r\n #add-animation-type {\r\n grid-row: 8;\r\n grid-column: 2;\r\n margin-right: 10px;\r\n }\r\n\r\n #add-animation-loop-mode {\r\n grid-row: 10;\r\n grid-column: 2;\r\n margin-right: 10px;\r\n }\r\n\r\n #add-animation {\r\n grid-row: 12;\r\n grid-column: 2;\r\n justify-self: left;\r\n }\r\n }\r\n\r\n #edit-animation-pane {\r\n grid-column: 1;\r\n grid-row: 2;\r\n\r\n width: 100%;\r\n height: 100%;\r\n display: grid;\r\n grid-template-columns: 75px 1fr;\r\n grid-template-rows: 10px 20px 10px 20px 10px 20px 10px 20px 1fr;\r\n color: white;\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 10pt;\r\n background: #111111;\r\n\r\n .input-text {\r\n border: 0;\r\n background: #252525;\r\n width: 127px;\r\n color: white;\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 10pt;\r\n }\r\n\r\n .option {\r\n background: #252525;\r\n color: white;\r\n border: 0;\r\n }\r\n\r\n #edit-animation-display-name-label {\r\n grid-row: 2;\r\n grid-column: 1;\r\n justify-self: end;\r\n margin-right: 10px;\r\n }\r\n\r\n #edit-animation-property-label {\r\n grid-row: 4;\r\n grid-column: 1;\r\n justify-self: end;\r\n margin-right: 10px;\r\n }\r\n\r\n #edit-animation-loop-mode-label {\r\n grid-row: 6;\r\n grid-column: 1;\r\n justify-self: end;\r\n margin-right: 10px;\r\n }\r\n\r\n #edit-animation-name {\r\n grid-row: 2;\r\n grid-column: 2;\r\n margin-right: 10px;\r\n }\r\n\r\n #edit-animation-property {\r\n grid-row: 4;\r\n grid-column: 2;\r\n margin-right: 10px;\r\n }\r\n\r\n #edit-animation-loop-mode {\r\n grid-row: 6;\r\n grid-column: 2;\r\n margin-right: 10px;\r\n }\r\n\r\n #edit-animation {\r\n grid-row: 8;\r\n grid-column: 1 / 3;\r\n display: grid;\r\n grid-template-columns: 50% 50%;\r\n grid-template-rows: 100%;\r\n\r\n #edit-animation-ok {\r\n grid-row: 1;\r\n grid-column: 1;\r\n }\r\n\r\n #edit-animation-cancel {\r\n grid-row: 1;\r\n grid-column: 2;\r\n }\r\n }\r\n }\r\n\r\n #animation-list {\r\n background: #111111;\r\n grid-row: 2;\r\n grid-column: 1;\r\n width: 100%;\r\n height: 100%;\r\n\r\n .animation-entry {\r\n height: 20px;\r\n display: grid;\r\n grid-template-columns: 20px 10px 1fr 20px 20px;\r\n grid-template-rows: 100%;\r\n\r\n &.isActive {\r\n background: #444444;\r\n }\r\n\r\n .animation-active-indicator {\r\n grid-row: 1;\r\n grid-column: 1;\r\n display: grid;\r\n margin: 5px;\r\n padding-top: 2px;\r\n }\r\n\r\n .animation-chevron {\r\n grid-row: 1;\r\n grid-column: 2;\r\n display: grid;\r\n align-content: center;\r\n padding-top: 5px;\r\n cursor: pointer;\r\n\r\n .animation-chevron-image {\r\n &.collapsed {\r\n transform-origin: 50% 50%;\r\n transform: rotateZ(-90deg);\r\n }\r\n }\r\n }\r\n\r\n .animation-name {\r\n cursor: pointer;\r\n grid-row: 1;\r\n grid-column: 3;\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 10.5pt;\r\n color: white;\r\n display: grid;\r\n align-self: center;\r\n margin-left: 5px;\r\n user-select: none;\r\n }\r\n\r\n .animation-options {\r\n grid-row: 1;\r\n grid-column: 4;\r\n }\r\n\r\n .animation-delete {\r\n grid-row: 1;\r\n grid-column: 5;\r\n }\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
175
180
  // Exports
181
+ ___CSS_LOADER_EXPORT___.locals = {};
176
182
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
177
183
 
178
184
 
@@ -200,6 +206,7 @@ var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBP
200
206
  // Module
201
207
  ___CSS_LOADER_EXPORT___.push([module.id, "#top-bar {\n display: grid;\n grid-template-columns: 40px 200px 75px 8px 75px 8px 40px 40px 40px 40px 40px 40px 40px 40px 1fr 40px;\n grid-template-rows: 100%; }\n #top-bar .disabled {\n opacity: 20%;\n pointer-events: none; }\n #top-bar #top-bar-logo {\n grid-row: 1;\n grid-column: 1; }\n #top-bar #top-bar-parent-name {\n grid-row: 1;\n grid-column: 2;\n font-family: \"acumin-pro-condensed\";\n font-size: 15pt;\n color: white;\n display: grid;\n align-content: center;\n padding-bottom: 5px; }\n #top-bar #key-frame {\n grid-row: 1;\n grid-column: 3;\n height: 24px;\n display: grid;\n align-self: center; }\n #top-bar #key-value {\n grid-row: 1;\n grid-column: 5;\n height: 24px;\n display: grid;\n align-self: center; }\n #top-bar #new-key {\n grid-row: 1;\n grid-column: 7; }\n #top-bar #frame-canvas {\n grid-row: 1;\n grid-column: 8; }\n #top-bar #flatten-tangent {\n grid-row: 1;\n grid-column: 9; }\n #top-bar #linear-tangent {\n grid-row: 1;\n grid-column: 10; }\n #top-bar #break-tangent {\n grid-row: 1;\n grid-column: 11; }\n #top-bar #unify-tangent {\n grid-row: 1;\n grid-column: 12; }\n #top-bar #step-tangent {\n grid-row: 1;\n grid-column: 13; }\n", "",{"version":3,"sources":["webpack://./../../../dev/inspector/dist/components/actionTabs/tabs/propertyGrids/animations/curveEditor/scss/topBar.scss"],"names":[],"mappings":"AAAA;EACI,aAAa;EACb,oGAAoG;EACpG,wBAAwB,EAAA;EAH5B;IAMQ,YAAY;IACZ,oBAAoB,EAAA;EAP5B;IAWQ,WAAW;IACX,cAAc,EAAA;EAZtB;IAgBQ,WAAW;IACX,cAAc;IACd,mCAAmC;IACnC,eAAe;IACf,YAAY;IACZ,aAAa;IACb,qBAAqB;IACrB,mBAAmB,EAAA;EAvB3B;IA2BQ,WAAW;IACX,cAAc;IACd,YAAY;IACZ,aAAa;IACb,kBAAkB,EAAA;EA/B1B;IAmCQ,WAAW;IACX,cAAc;IACd,YAAY;IACZ,aAAa;IACb,kBAAkB,EAAA;EAvC1B;IA2CQ,WAAW;IACX,cAAc,EAAA;EA5CtB;IAgDQ,WAAW;IACX,cAAc,EAAA;EAjDtB;IAqDQ,WAAW;IACX,cAAc,EAAA;EAtDtB;IA0DQ,WAAW;IACX,eAAe,EAAA;EA3DvB;IA+DQ,WAAW;IACX,eAAe,EAAA;EAhEvB;IAoEQ,WAAW;IACX,eAAe,EAAA;EArEvB;IAyEQ,WAAW;IACX,eAAe,EAAA","sourcesContent":["#top-bar {\r\n display: grid;\r\n grid-template-columns: 40px 200px 75px 8px 75px 8px 40px 40px 40px 40px 40px 40px 40px 40px 1fr 40px;\r\n grid-template-rows: 100%;\r\n\r\n .disabled {\r\n opacity: 20%;\r\n pointer-events: none;\r\n }\r\n\r\n #top-bar-logo {\r\n grid-row: 1;\r\n grid-column: 1;\r\n }\r\n\r\n #top-bar-parent-name {\r\n grid-row: 1;\r\n grid-column: 2;\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 15pt;\r\n color: white;\r\n display: grid;\r\n align-content: center;\r\n padding-bottom: 5px;\r\n }\r\n\r\n #key-frame {\r\n grid-row: 1;\r\n grid-column: 3;\r\n height: 24px;\r\n display: grid;\r\n align-self: center;\r\n }\r\n\r\n #key-value {\r\n grid-row: 1;\r\n grid-column: 5;\r\n height: 24px;\r\n display: grid;\r\n align-self: center;\r\n }\r\n\r\n #new-key {\r\n grid-row: 1;\r\n grid-column: 7;\r\n }\r\n\r\n #frame-canvas {\r\n grid-row: 1;\r\n grid-column: 8;\r\n }\r\n\r\n #flatten-tangent {\r\n grid-row: 1;\r\n grid-column: 9;\r\n }\r\n\r\n #linear-tangent {\r\n grid-row: 1;\r\n grid-column: 10;\r\n }\r\n\r\n #break-tangent {\r\n grid-row: 1;\r\n grid-column: 11;\r\n }\r\n\r\n #unify-tangent {\r\n grid-row: 1;\r\n grid-column: 12;\r\n }\r\n\r\n #step-tangent {\r\n grid-row: 1;\r\n grid-column: 13;\r\n }\r\n}\r\n"],"sourceRoot":""}]);
202
208
  // Exports
209
+ ___CSS_LOADER_EXPORT___.locals = {};
203
210
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
204
211
 
205
212
 
@@ -227,6 +234,7 @@ var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBP
227
234
  // Module
228
235
  ___CSS_LOADER_EXPORT___.push([module.id, "#texture-editor {\n height: 100%;\n width: 100%;\n color: white;\n background-color: #1e1e1e;\n font-family: \"acumin-pro-condensed\"; }\n #texture-editor .icon {\n width: 40px;\n height: 40px; }\n #texture-editor .icon.button {\n background-color: #333333; }\n #texture-editor .icon.button:hover {\n background-color: #4a4a4a;\n cursor: pointer; }\n #texture-editor .icon.button.active {\n background-color: #666666; }\n #texture-editor .icon.button:active {\n background-color: #837c7c; }\n #texture-editor .has-tooltip {\n display: inline-block; }\n #texture-editor .has-tooltip .tooltip {\n visibility: hidden;\n background-color: white;\n z-index: 1;\n position: absolute;\n opacity: 0;\n transition: opacity 0.5s;\n line-height: normal;\n font-size: 14px;\n padding: 0px 5px;\n color: black; }\n #texture-editor .has-tooltip:hover .tooltip {\n visibility: visible;\n opacity: 1; }\n #texture-editor #properties {\n width: 100%;\n height: 40px;\n display: flex;\n align-items: center;\n font-size: 12px;\n color: white;\n user-select: none;\n background-color: #333333; }\n #texture-editor #properties .tab {\n display: inline-flex;\n line-height: 40px;\n height: 40px;\n flex-shrink: 0;\n flex-grow: 0;\n border-right: 2px solid #1e1e1e;\n background-color: #333333; }\n #texture-editor #properties #left {\n overflow: hidden;\n height: 40px;\n flex-grow: 1;\n flex-shrink: 1;\n display: flex;\n flex-wrap: wrap; }\n #texture-editor #properties #left #dimensions-tab form {\n display: flex; }\n #texture-editor #properties #left #dimensions-tab label {\n margin-left: 15px;\n font-size: 15px;\n color: #afafaf; }\n #texture-editor #properties #left #dimensions-tab label input {\n width: 40px;\n height: 24px;\n background-color: #000000;\n color: #ffffff;\n border: 0;\n font-size: 12px;\n text-align: \"left\";\n font-family: \"acumin-pro-condensed\";\n font-size: 15px;\n padding-left: 8px; }\n #texture-editor #properties #left #dimensions-tab label:last-of-type {\n margin-right: 8px; }\n #texture-editor #properties #right-tab {\n margin-right: 0;\n flex-grow: 0;\n flex-shrink: 0; }\n #texture-editor #properties #right-tab input[type=\"file\"] {\n display: none; }\n #texture-editor #properties .pixel-data {\n width: 45px;\n color: #afafaf;\n display: flex;\n justify-content: space-between;\n font-size: 15px; }\n #texture-editor #properties .pixel-data:first-of-type {\n margin-left: 15px; }\n #texture-editor #properties .pixel-data:last-of-type {\n padding-right: 15px; }\n #texture-editor #properties .pixel-data .value {\n display: inline-block;\n width: 30px;\n color: white; }\n #texture-editor #toolbar {\n position: absolute;\n top: 60px;\n left: 0;\n width: 40px;\n display: flex;\n flex-direction: column;\n justify-content: left; }\n #texture-editor #toolbar #tools {\n display: flex;\n flex-direction: column; }\n #texture-editor #toolbar #add-tool {\n position: relative; }\n #texture-editor #toolbar #add-tool #add-tool-popup {\n background-color: #333333;\n width: 348px;\n margin-left: 40px;\n position: absolute;\n top: 0px;\n height: 40px;\n padding-left: 4px;\n line-height: 40px;\n user-select: none; }\n #texture-editor #toolbar #add-tool #add-tool-popup 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 cursor: pointer; }\n #texture-editor #toolbar #color {\n margin-top: 8px; }\n #texture-editor #toolbar #color #active-color-bg {\n border-radius: 50%;\n width: 20px;\n height: 20px;\n margin: 10px;\n position: relative;\n background-image: linear-gradient(45deg, #808080 25%, transparent 25%), linear-gradient(-45deg, #808080 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #808080 75%), linear-gradient(-45deg, transparent 75%, #808080 75%);\n background-size: 20px 20px;\n background-position: 0 0, 0 10px, 10px -10px, -10px 0px; }\n #texture-editor #toolbar #color #active-color {\n width: 20px;\n height: 20px;\n position: absolute;\n top: 0;\n left: 0;\n border-radius: 50%; }\n #texture-editor #toolbar #color-picker {\n position: absolute;\n margin-left: 40px; }\n #texture-editor #channels-bar {\n position: absolute;\n top: 60px;\n right: 0;\n width: 80px;\n background: #666666;\n user-select: none; }\n #texture-editor #channels-bar .channel {\n color: white;\n border-bottom: 2px solid #232323;\n width: 80px;\n height: 40px;\n font-size: 16px;\n display: flex;\n align-items: center; }\n #texture-editor #channels-bar .channel.uneditable {\n background: #333333; }\n #texture-editor #channels-bar .channel:hover {\n cursor: pointer; }\n #texture-editor #channels-bar .channel:last-of-type {\n border-bottom: none; }\n #texture-editor #canvas-ui {\n width: 100%;\n height: calc(100% - 70px);\n outline: none; }\n #texture-editor #tool-ui {\n background-color: #333;\n position: absolute;\n right: 0;\n bottom: 30px; }\n #texture-editor #tool-ui label {\n display: flex;\n flex-direction: column;\n align-items: center; }\n #texture-editor #tool-ui input[type=\"range\"] {\n background: #d3d3d3; }\n #texture-editor #bottom-bar {\n height: 30px;\n width: 100%;\n background-color: #333333;\n font-size: 14px;\n user-select: none;\n line-height: 30px;\n position: relative; }\n #texture-editor #bottom-bar #file-url {\n left: 30px;\n position: absolute; }\n #texture-editor #bottom-bar #mip-level {\n right: 30px;\n position: absolute; }\n", "",{"version":3,"sources":["webpack://./../../../dev/inspector/dist/components/actionTabs/tabs/propertyGrids/materials/textures/textureEditor.scss"],"names":[],"mappings":"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","sourcesContent":["#texture-editor {\r\n height: 100%;\r\n width: 100%;\r\n color: white;\r\n background-color: #1e1e1e;\r\n font-family: \"acumin-pro-condensed\";\r\n\r\n .icon {\r\n width: 40px;\r\n height: 40px;\r\n &.button {\r\n background-color: #333333;\r\n &:hover {\r\n background-color: #4a4a4a;\r\n cursor: pointer;\r\n }\r\n // When the button is selected - className='active'\r\n &.active {\r\n background-color: #666666;\r\n }\r\n // When the button is clicked\r\n &:active {\r\n background-color: #837c7c;\r\n }\r\n }\r\n }\r\n\r\n .has-tooltip {\r\n display: inline-block;\r\n .tooltip {\r\n visibility: hidden;\r\n background-color: rgb(255, 255, 255);\r\n z-index: 1;\r\n position: absolute;\r\n opacity: 0;\r\n transition: opacity 0.5s;\r\n line-height: normal;\r\n font-size: 14px;\r\n padding: 0px 5px;\r\n color: black;\r\n }\r\n\r\n &:hover .tooltip {\r\n visibility: visible;\r\n opacity: 1;\r\n }\r\n }\r\n\r\n #properties {\r\n width: 100%;\r\n height: 40px;\r\n\r\n display: flex;\r\n align-items: center;\r\n font-size: 12px;\r\n color: white;\r\n user-select: none;\r\n background-color: #333333;\r\n\r\n .tab {\r\n display: inline-flex;\r\n line-height: 40px;\r\n height: 40px;\r\n flex-shrink: 0;\r\n flex-grow: 0;\r\n border-right: 2px solid #1e1e1e;\r\n background-color: #333333;\r\n }\r\n #left {\r\n overflow: hidden;\r\n height: 40px;\r\n flex-grow: 1;\r\n flex-shrink: 1;\r\n display: flex;\r\n flex-wrap: wrap;\r\n #dimensions-tab {\r\n form {\r\n display: flex;\r\n }\r\n label {\r\n margin-left: 15px;\r\n font-size: 15px;\r\n color: #afafaf;\r\n input {\r\n width: 40px;\r\n height: 24px;\r\n background-color: #000000;\r\n color: #ffffff;\r\n border: 0;\r\n font-size: 12px;\r\n text-align: \"left\";\r\n font-family: \"acumin-pro-condensed\";\r\n font-size: 15px;\r\n padding-left: 8px;\r\n }\r\n\r\n &:last-of-type {\r\n margin-right: 8px;\r\n }\r\n }\r\n }\r\n }\r\n #right-tab {\r\n margin-right: 0;\r\n flex-grow: 0;\r\n flex-shrink: 0;\r\n\r\n input[type=\"file\"] {\r\n display: none;\r\n }\r\n }\r\n\r\n .pixel-data {\r\n &:first-of-type {\r\n margin-left: 15px;\r\n }\r\n &:last-of-type {\r\n padding-right: 15px;\r\n }\r\n width: 45px;\r\n color: #afafaf;\r\n display: flex;\r\n justify-content: space-between;\r\n .value {\r\n display: inline-block;\r\n width: 30px;\r\n color: white;\r\n }\r\n font-size: 15px;\r\n }\r\n }\r\n\r\n #toolbar {\r\n position: absolute;\r\n top: 60px;\r\n left: 0;\r\n width: 40px;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: left;\r\n\r\n #tools {\r\n display: flex;\r\n flex-direction: column;\r\n }\r\n\r\n #add-tool {\r\n position: relative;\r\n #add-tool-popup {\r\n background-color: #333333;\r\n width: 348px;\r\n margin-left: 40px;\r\n position: absolute;\r\n top: 0px;\r\n height: 40px;\r\n padding-left: 4px;\r\n line-height: 40px;\r\n user-select: none;\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 cursor: pointer;\r\n }\r\n }\r\n }\r\n\r\n #color {\r\n margin-top: 8px;\r\n #active-color-bg {\r\n border-radius: 50%;\r\n width: 20px;\r\n height: 20px;\r\n margin: 10px;\r\n position: relative;\r\n background-image: linear-gradient(45deg, #808080 25%, transparent 25%), linear-gradient(-45deg, #808080 25%, transparent 25%),\r\n linear-gradient(45deg, transparent 75%, #808080 75%), linear-gradient(-45deg, transparent 75%, #808080 75%);\r\n background-size: 20px 20px;\r\n background-position: 0 0, 0 10px, 10px -10px, -10px 0px;\r\n }\r\n #active-color {\r\n width: 20px;\r\n height: 20px;\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n border-radius: 50%;\r\n }\r\n }\r\n #color-picker {\r\n position: absolute;\r\n margin-left: 40px;\r\n }\r\n }\r\n\r\n #channels-bar {\r\n position: absolute;\r\n top: 60px;\r\n right: 0;\r\n width: 80px;\r\n background: #666666;\r\n .channel {\r\n color: white;\r\n border-bottom: 2px solid #232323;\r\n width: 80px;\r\n height: 40px;\r\n font-size: 16px;\r\n display: flex;\r\n align-items: center;\r\n\r\n &.uneditable {\r\n background: #333333;\r\n }\r\n\r\n &:hover {\r\n cursor: pointer;\r\n }\r\n\r\n &:last-of-type {\r\n border-bottom: none;\r\n }\r\n }\r\n user-select: none;\r\n }\r\n\r\n #canvas-ui {\r\n width: 100%;\r\n height: calc(100% - 70px);\r\n outline: none;\r\n }\r\n\r\n #tool-ui {\r\n background-color: #333;\r\n position: absolute;\r\n right: 0;\r\n bottom: 30px;\r\n\r\n label {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n }\r\n\r\n input[type=\"range\"] {\r\n background: #d3d3d3;\r\n }\r\n }\r\n\r\n #bottom-bar {\r\n height: 30px;\r\n width: 100%;\r\n background-color: #333333;\r\n font-size: 14px;\r\n user-select: none;\r\n line-height: 30px;\r\n position: relative;\r\n #file-url {\r\n left: 30px;\r\n position: absolute;\r\n }\r\n #mip-level {\r\n right: 30px;\r\n position: absolute;\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
229
236
  // Exports
237
+ ___CSS_LOADER_EXPORT___.locals = {};
230
238
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
231
239
 
232
240
 
@@ -254,6 +262,7 @@ var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBP
254
262
  // Module
255
263
  ___CSS_LOADER_EXPORT___.push([module.id, "#embed-host {\n position: absolute;\n right: 0px;\n top: 0px;\n bottom: 0px;\n z-index: 10; }\n\n#__resizable_base__ {\n display: none; }\n\n#embed {\n background: #333333;\n height: 100%;\n margin: 0;\n padding: 0;\n display: grid;\n grid-template-rows: 30px 1fr;\n font: 14px \"Arial\";\n overflow: hidden; }\n #embed #header {\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 50px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none; }\n #embed #header #logo {\n grid-column: 1;\n width: 24px;\n height: 24px;\n display: flex;\n align-self: center;\n justify-self: center; }\n #embed #header #back {\n grid-column: 1;\n display: grid;\n align-self: center;\n justify-self: center;\n cursor: pointer; }\n #embed #header #title {\n grid-column: 2;\n display: grid;\n align-items: center;\n text-align: center; }\n #embed #header #commands {\n grid-column: 3;\n display: grid;\n align-items: center;\n grid-template-columns: 1fr 1fr; }\n #embed #header #commands .expand {\n grid-column: 1;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #embed #header #commands .close {\n grid-column: 2;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #embed #split {\n grid-row: 2;\n overflow: hidden; }\n #embed #split.splitPopup {\n display: grid;\n grid-template-rows: 300px 2px 1fr; }\n #embed #split.splitPopup .panes {\n margin-bottom: 1px; }\n #embed #split #topPart {\n grid-row: 1;\n overflow: hidden;\n display: grid;\n grid-auto-rows: 100%; }\n #embed #split #separator {\n grid-row: 2;\n background: white;\n opacity: 0.1; }\n #embed #split #bottomPart {\n overflow: hidden;\n grid-row: 3;\n display: grid;\n grid-auto-rows: 100%; }\n #embed #split .gutter.gutter-vertical {\n background-image: none;\n background: #444444;\n cursor: row-resize; }\n", "",{"version":3,"sources":["webpack://./../../../dev/inspector/dist/components/embedHost/embedHost.scss"],"names":[],"mappings":"AAAA;EACI,kBAAkB;EAClB,UAAU;EACV,QAAQ;EACR,WAAW;EACX,WAAW,EAAA;;AAGf;EACI,aAAa,EAAA;;AAGjB;EACI,mBAAmB;EACnB,YAAY;EACZ,SAAS;EACT,UAAU;EACV,aAAa;EACb,4BAA4B;EAC5B,kBAAkB;EAClB,gBAAgB,EAAA;EARpB;IAWQ,eAAe;IACf,YAAY;IACZ,mBAAmB;IACnB,WAAW;IACX,kBAAkB;IAClB,aAAa;IACb,oCAAoC;IACpC,yBAAyB;IACzB,sBAAsB;IACtB,qBAAqB;IACrB,iBAAiB,EAAA;IArBzB;MAwBY,cAAc;MACd,WAAW;MACX,YAAY;MACZ,aAAa;MACb,kBAAkB;MAClB,oBAAoB,EAAA;IA7BhC;MAiCY,cAAc;MACd,aAAa;MACb,kBAAkB;MAClB,oBAAoB;MACpB,eAAe,EAAA;IArC3B;MAyCY,cAAc;MACd,aAAa;MACb,mBAAmB;MACnB,kBAAkB,EAAA;IA5C9B;MAgDY,cAAc;MACd,aAAa;MACb,mBAAmB;MACnB,8BAA8B,EAAA;MAnD1C;QAsDgB,cAAc;QACd,aAAa;QACb,mBAAmB;QACnB,qBAAqB;QACrB,eAAe,EAAA;MA1D/B;QA8DgB,cAAc;QACd,aAAa;QACb,mBAAmB;QACnB,qBAAqB;QACrB,eAAe,EAAA;EAlE/B;IAwEQ,WAAW;IACX,gBAAgB,EAAA;IAzExB;MA4EY,aAAa;MACb,iCAAiC,EAAA;MA7E7C;QAgFgB,kBAAkB,EAAA;IAhFlC;MAqFY,WAAW;MACX,gBAAgB;MAChB,aAAa;MACb,oBAAoB,EAAA;IAxFhC;MA4FY,WAAW;MACX,iBAAiB;MACjB,YAAY,EAAA;IA9FxB;MAkGY,gBAAgB;MAChB,WAAW;MACX,aAAa;MACb,oBAAoB,EAAA;IArGhC;MAyGY,sBAAsB;MACtB,mBAAmB;MACnB,kBAAkB,EAAA","sourcesContent":["#embed-host {\r\n position: absolute;\r\n right: 0px;\r\n top: 0px;\r\n bottom: 0px;\r\n z-index: 10;\r\n}\r\n\r\n#__resizable_base__ {\r\n display: none;\r\n}\r\n\r\n#embed {\r\n background: #333333;\r\n height: 100%;\r\n margin: 0;\r\n padding: 0;\r\n display: grid;\r\n grid-template-rows: 30px 1fr;\r\n font: 14px \"Arial\";\r\n overflow: hidden;\r\n\r\n #header {\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 50px;\r\n -webkit-user-select: none;\r\n -moz-user-select: none;\r\n -ms-user-select: none;\r\n user-select: none;\r\n\r\n #logo {\r\n grid-column: 1;\r\n width: 24px;\r\n height: 24px;\r\n display: flex;\r\n align-self: center;\r\n justify-self: center;\r\n }\r\n\r\n #back {\r\n grid-column: 1;\r\n display: grid;\r\n align-self: center;\r\n justify-self: center;\r\n cursor: pointer;\r\n }\r\n\r\n #title {\r\n grid-column: 2;\r\n display: grid;\r\n align-items: center;\r\n text-align: center;\r\n }\r\n\r\n #commands {\r\n grid-column: 3;\r\n display: grid;\r\n align-items: center;\r\n grid-template-columns: 1fr 1fr;\r\n\r\n .expand {\r\n grid-column: 1;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n }\r\n\r\n .close {\r\n grid-column: 2;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n }\r\n }\r\n }\r\n\r\n #split {\r\n grid-row: 2;\r\n overflow: hidden;\r\n\r\n &.splitPopup {\r\n display: grid;\r\n grid-template-rows: 300px 2px 1fr;\r\n\r\n .panes {\r\n margin-bottom: 1px;\r\n }\r\n }\r\n\r\n #topPart {\r\n grid-row: 1;\r\n overflow: hidden;\r\n display: grid;\r\n grid-auto-rows: 100%;\r\n }\r\n\r\n #separator {\r\n grid-row: 2;\r\n background: white;\r\n opacity: 0.1;\r\n }\r\n\r\n #bottomPart {\r\n overflow: hidden;\r\n grid-row: 3;\r\n display: grid;\r\n grid-auto-rows: 100%;\r\n }\r\n\r\n .gutter.gutter-vertical {\r\n background-image: none;\r\n background: #444444;\r\n cursor: row-resize;\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
256
264
  // Exports
265
+ ___CSS_LOADER_EXPORT___.locals = {};
257
266
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
258
267
 
259
268
 
@@ -281,6 +290,7 @@ var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBP
281
290
  // Module
282
291
  ___CSS_LOADER_EXPORT___.push([module.id, "#scene-explorer-host {\n position: absolute;\n left: 0px;\n top: 0px;\n bottom: 0px; }\n #scene-explorer-host:focus {\n outline: none; }\n\n#__resizable_base__ {\n display: none; }\n\n.context-menu {\n background: #222222; }\n .context-menu .react-contextmenu-item {\n padding: 10px;\n cursor: pointer; }\n .context-menu .react-contextmenu-item:hover {\n background: #555555; }\n\n.react-contextmenu.context-menu.react-contextmenu--visible {\n z-index: 99;\n transform: scale(1); }\n\n#sceneExplorer {\n background: #333333;\n height: 100%;\n margin: 0;\n padding: 0;\n display: grid;\n grid-template-rows: auto 1fr;\n font: 14px \"Arial\"; }\n #sceneExplorer:focus {\n outline: none; }\n #sceneExplorer #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 50px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none; }\n #sceneExplorer #header #logo {\n position: relative;\n grid-column: 1;\n width: 24px;\n height: 24px;\n left: 0;\n display: flex;\n align-self: center;\n justify-self: center; }\n #sceneExplorer #header #title {\n grid-column: 2;\n display: grid;\n align-items: center;\n text-align: center; }\n #sceneExplorer #header #commands {\n grid-column: 3;\n display: grid;\n align-items: center;\n grid-template-columns: 1fr 1fr; }\n #sceneExplorer #header #commands .expand {\n grid-column: 1;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #sceneExplorer #header #commands .close {\n grid-column: 2;\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #sceneExplorer #tree {\n grid-row: 2;\n overflow-x: hidden;\n overflow-y: auto; }\n #sceneExplorer .filter {\n display: flex;\n align-items: stretch; }\n #sceneExplorer .filter input {\n width: 100%;\n margin: 10px 40px 5px 40px;\n display: block;\n border: none;\n padding: 0;\n border-bottom: solid 1px #337ab7;\n background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 96%, #337ab7 4%);\n background-position: -1000px 0;\n background-size: 1000px 100%;\n background-repeat: no-repeat;\n color: white; }\n #sceneExplorer .filter input::placeholder {\n color: lightgray; }\n #sceneExplorer .filter input:focus {\n box-shadow: none;\n outline: none;\n background-position: 0 0; }\n #sceneExplorer .groupContainer {\n margin-left: 0px;\n color: white;\n margin-top: 0px;\n margin-bottom: 0px;\n height: 24px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n align-self: center;\n display: grid;\n align-items: center; }\n #sceneExplorer .groupContainer:hover {\n background: #444444; }\n #sceneExplorer .groupContainer .expandableHeader {\n display: grid;\n grid-template-columns: 1fr 20px; }\n #sceneExplorer .groupContainer .expandableHeader .text {\n grid-column: 1;\n display: grid;\n grid-template-columns: 20px 1fr; }\n #sceneExplorer .groupContainer .expandableHeader .text .arrow {\n grid-column: 1;\n margin-left: 0px;\n color: white;\n cursor: pointer;\n display: inline-block;\n margin-right: 6px;\n opacity: 0.5; }\n #sceneExplorer .groupContainer .expandableHeader .text .text-value {\n grid-column: 2;\n display: flex;\n align-items: center; }\n #sceneExplorer .groupContainer .expandableHeader .expandAll {\n opacity: 0.5;\n grid-column: 2;\n margin-right: 10px; }\n #sceneExplorer .icon {\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #sceneExplorer .itemContainer {\n margin-left: 0px;\n color: white;\n margin-top: 0px;\n margin-bottom: 0px;\n height: 24px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n display: grid;\n grid-template-columns: 20px 1fr; }\n #sceneExplorer .itemContainer:hover {\n background: #444444; }\n #sceneExplorer .itemContainer.selected {\n background: #bbbbbb;\n color: black; }\n #sceneExplorer .itemContainer .isNotActive {\n opacity: 0.3; }\n #sceneExplorer .itemContainer .arrow {\n grid-column: 1;\n color: white;\n opacity: 0.6; }\n #sceneExplorer .itemContainer .popup {\n width: 200px;\n visibility: hidden;\n background-color: #444444;\n color: #fff;\n border: 1px solid rgba(255, 255, 255, 0.5);\n position: absolute;\n z-index: 1;\n margin-left: -180px;\n box-sizing: border-box; }\n #sceneExplorer .itemContainer .popup.show {\n visibility: visible; }\n #sceneExplorer .itemContainer .popup:focus {\n outline: none; }\n #sceneExplorer .itemContainer .popup .popupMenu {\n padding: 6px 5px 5px 10px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n height: 18px; }\n #sceneExplorer .itemContainer .popup .popupMenu:hover {\n background: white;\n color: #333333; }\n #sceneExplorer .itemContainer .sceneNode {\n grid-column: 2;\n margin-left: -10px;\n display: grid;\n grid-template-columns: 1fr 20px 20px 20px 20px 10px 20px 20px auto 5px;\n align-items: center;\n cursor: pointer; }\n #sceneExplorer .itemContainer .sceneNode .sceneTitle {\n grid-column: 1;\n margin-right: 5px;\n display: flex;\n align-items: center;\n height: 24px; }\n #sceneExplorer .itemContainer .sceneNode .translation {\n grid-column: 2;\n opacity: 0.6; }\n #sceneExplorer .itemContainer .sceneNode .translation.selected {\n opacity: 1; }\n #sceneExplorer .itemContainer .sceneNode .rotation {\n grid-column: 3;\n opacity: 0.6; }\n #sceneExplorer .itemContainer .sceneNode .rotation.selected {\n opacity: 1; }\n #sceneExplorer .itemContainer .sceneNode .scaling {\n grid-column: 4;\n opacity: 0.6; }\n #sceneExplorer .itemContainer .sceneNode .scaling.selected {\n opacity: 1; }\n #sceneExplorer .itemContainer .sceneNode .bounding {\n grid-column: 5;\n opacity: 0.6; }\n #sceneExplorer .itemContainer .sceneNode .bounding.selected {\n opacity: 1; }\n #sceneExplorer .itemContainer .sceneNode .separator {\n grid-column: 6;\n margin-left: 5px;\n width: 5px;\n display: flex;\n align-items: center;\n height: 18px;\n border-left: solid 1px #337ab7; }\n #sceneExplorer .itemContainer .sceneNode .pickingMode {\n grid-column: 7;\n opacity: 0.6; }\n #sceneExplorer .itemContainer .sceneNode .pickingMode.selected {\n opacity: 1; }\n #sceneExplorer .itemContainer .sceneNode .refresh {\n grid-column: 8; }\n #sceneExplorer .itemContainer .sceneNode .extensions {\n width: 20px;\n grid-column: 9; }\n #sceneExplorer .itemContainer .targetedAnimationTools {\n grid-column: 2;\n width: 100%;\n display: grid;\n grid-template-columns: 1fr auto 5px;\n align-items: center;\n min-width: 0; }\n #sceneExplorer .itemContainer .targetedAnimationTools .extensions {\n width: 20px;\n grid-column: 2; }\n #sceneExplorer .itemContainer .animationGroupTools {\n grid-column: 2;\n width: 100%;\n display: grid;\n grid-template-columns: 1fr auto 5px;\n align-items: center;\n min-width: 0; }\n #sceneExplorer .itemContainer .animationGroupTools .extensions {\n width: 20px;\n grid-column: 2; }\n #sceneExplorer .itemContainer .soundTools {\n grid-column: 2;\n width: 100%;\n display: grid;\n grid-template-columns: 1fr auto 5px;\n align-items: center;\n min-width: 0; }\n #sceneExplorer .itemContainer .soundTools .extensions {\n width: 20px;\n grid-column: 2; }\n #sceneExplorer .itemContainer .meshTools {\n grid-column: 2;\n width: 100%;\n display: grid;\n grid-template-columns: 1fr 20px 20px auto 5px;\n align-items: center;\n min-width: 0; }\n #sceneExplorer .itemContainer .meshTools .bounding-box {\n grid-column: 2;\n opacity: 0.5; }\n #sceneExplorer .itemContainer .meshTools .bounding-box.selected {\n opacity: 1; }\n #sceneExplorer .itemContainer .meshTools .visibility {\n grid-column: 3; }\n #sceneExplorer .itemContainer .meshTools .extensions {\n width: 20px;\n grid-column: 4; }\n #sceneExplorer .itemContainer .cameraTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr 20px 20px auto 5px;\n align-items: center; }\n #sceneExplorer .itemContainer .cameraTools .activeCamera {\n grid-column: 2; }\n #sceneExplorer .itemContainer .cameraTools .enableGizmo {\n grid-column: 3; }\n #sceneExplorer .itemContainer .cameraTools .extensions {\n width: 20px;\n grid-column: 4; }\n #sceneExplorer .itemContainer .lightTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr 20px 20px auto 5px;\n align-items: center; }\n #sceneExplorer .itemContainer .lightTools .enableLight {\n grid-column: 2; }\n #sceneExplorer .itemContainer .lightTools .extensions {\n width: 20px;\n grid-column: 3; }\n #sceneExplorer .itemContainer .spriteTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr auto 5px;\n align-items: center; }\n #sceneExplorer .itemContainer .spriteTools .extensions {\n width: 20px;\n grid-column: 2; }\n #sceneExplorer .itemContainer .spriteManagerTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr auto 5px;\n align-items: center; }\n #sceneExplorer .itemContainer .spriteManagerTools .extensions {\n width: 20px;\n grid-column: 2; }\n #sceneExplorer .itemContainer .materialTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr auto 5px;\n align-items: center; }\n #sceneExplorer .itemContainer .materialTools .extensions {\n width: 20px;\n grid-column: 2; }\n #sceneExplorer .itemContainer .materialTools .icon {\n display: grid;\n align-items: center;\n justify-items: center;\n cursor: pointer; }\n #sceneExplorer .itemContainer .particleSystemTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr auto 5px;\n align-items: center; }\n #sceneExplorer .itemContainer .particleSystemTools .extensions {\n width: 20px;\n grid-column: 2; }\n #sceneExplorer .itemContainer .effectLayerTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr auto 5px;\n align-items: center; }\n #sceneExplorer .itemContainer .effectLayerTools .extensions {\n width: 20px;\n grid-column: 2; }\n #sceneExplorer .itemContainer .postProcessTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr auto 5px;\n align-items: center; }\n #sceneExplorer .itemContainer .postProcessTools .extensions {\n width: 20px;\n grid-column: 2; }\n #sceneExplorer .itemContainer .renderingPipelineTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr auto 5px;\n align-items: center; }\n #sceneExplorer .itemContainer .renderingPipelineTools .extensions {\n width: 20px;\n grid-column: 2; }\n #sceneExplorer .itemContainer .textureTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr auto 5px;\n align-items: center; }\n #sceneExplorer .itemContainer .textureTools .extensions {\n width: 20px;\n grid-column: 2; }\n #sceneExplorer .itemContainer .adtextureTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr 20px 20px auto 5px;\n align-items: center; }\n #sceneExplorer .itemContainer .adtextureTools .edit {\n grid-column: 2; }\n #sceneExplorer .itemContainer .adtextureTools .pickingMode {\n grid-column: 3;\n opacity: 0.6; }\n #sceneExplorer .itemContainer .adtextureTools .pickingMode.selected {\n opacity: 1; }\n #sceneExplorer .itemContainer .adtextureTools .extensions {\n width: 20px;\n grid-column: 3; }\n #sceneExplorer .itemContainer .controlTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr 20px 20px auto 5px;\n align-items: center; }\n #sceneExplorer .itemContainer .controlTools .highlight {\n grid-column: 2; }\n #sceneExplorer .itemContainer .controlTools .visibility {\n grid-column: 3; }\n #sceneExplorer .itemContainer .controlTools .extensions {\n width: 20px;\n grid-column: 4; }\n #sceneExplorer .itemContainer .transformNodeTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr auto 5px;\n align-items: center; }\n #sceneExplorer .itemContainer .transformNodeTools .extensions {\n width: 20px;\n grid-column: 2; }\n #sceneExplorer .itemContainer .skeletonTools {\n grid-column: 2;\n display: grid;\n grid-template-columns: 1fr auto 5px;\n align-items: center; }\n #sceneExplorer .itemContainer .skeletonTools .extensions {\n width: 20px;\n grid-column: 2; }\n #sceneExplorer .itemContainer .title {\n grid-column: 1;\n background: transparent;\n white-space: nowrap;\n overflow: hidden;\n min-width: 0;\n margin-right: 5px;\n display: grid;\n align-items: center;\n grid-template-columns: 25px 1fr;\n height: 24px;\n cursor: pointer; }\n #sceneExplorer .itemContainer .title .titleIcon {\n grid-column: 1;\n display: grid;\n align-items: center;\n justify-items: center; }\n #sceneExplorer .itemContainer .title .titleText {\n grid-column: 2;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden; }\n", "",{"version":3,"sources":["webpack://./../../../dev/inspector/dist/components/sceneExplorer/sceneExplorer.scss"],"names":[],"mappings":"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","sourcesContent":["#scene-explorer-host {\r\n position: absolute;\r\n left: 0px;\r\n top: 0px;\r\n bottom: 0px;\r\n\r\n &:focus {\r\n outline: none;\r\n }\r\n}\r\n\r\n#__resizable_base__ {\r\n display: none;\r\n}\r\n\r\n.context-menu {\r\n background: #222222;\r\n\r\n .react-contextmenu-item {\r\n padding: 10px;\r\n cursor: pointer;\r\n\r\n &:hover {\r\n background: #555555;\r\n }\r\n }\r\n}\r\n\r\n.react-contextmenu.context-menu.react-contextmenu--visible {\r\n z-index: 99;\r\n transform: scale(1);\r\n}\r\n\r\n#sceneExplorer {\r\n background: #333333;\r\n height: 100%;\r\n margin: 0;\r\n padding: 0;\r\n display: grid;\r\n grid-template-rows: auto 1fr;\r\n font: 14px \"Arial\";\r\n\r\n &:focus {\r\n outline: none;\r\n }\r\n\r\n #header {\r\n height: 30px;\r\n font-size: 16px;\r\n color: 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 50px;\r\n -webkit-user-select: none;\r\n -moz-user-select: none;\r\n -ms-user-select: none;\r\n user-select: none;\r\n\r\n #logo {\r\n position: relative;\r\n grid-column: 1;\r\n width: 24px;\r\n height: 24px;\r\n left: 0;\r\n display: flex;\r\n align-self: center;\r\n justify-self: center;\r\n }\r\n\r\n #title {\r\n grid-column: 2;\r\n display: grid;\r\n align-items: center;\r\n text-align: center;\r\n }\r\n\r\n #commands {\r\n grid-column: 3;\r\n display: grid;\r\n align-items: center;\r\n grid-template-columns: 1fr 1fr;\r\n\r\n .expand {\r\n grid-column: 1;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n }\r\n\r\n .close {\r\n grid-column: 2;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n }\r\n }\r\n }\r\n\r\n #tree {\r\n grid-row: 2;\r\n\r\n overflow-x: hidden;\r\n overflow-y: auto;\r\n }\r\n\r\n .filter {\r\n display: flex;\r\n align-items: stretch;\r\n\r\n input {\r\n width: 100%;\r\n margin: 10px 40px 5px 40px;\r\n display: block;\r\n border: none;\r\n padding: 0;\r\n border-bottom: solid 1px rgb(51, 122, 183);\r\n background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 96%, rgb(51, 122, 183) 4%);\r\n background-position: -1000px 0;\r\n background-size: 1000px 100%;\r\n background-repeat: no-repeat;\r\n color: white;\r\n }\r\n\r\n input::placeholder {\r\n color: lightgray;\r\n }\r\n\r\n input:focus {\r\n box-shadow: none;\r\n outline: none;\r\n background-position: 0 0;\r\n }\r\n }\r\n\r\n .groupContainer {\r\n margin-left: 0px;\r\n color: white;\r\n margin-top: 0px;\r\n margin-bottom: 0px;\r\n height: 24px;\r\n\r\n -webkit-user-select: none;\r\n -moz-user-select: none;\r\n -ms-user-select: none;\r\n user-select: none;\r\n\r\n align-self: center;\r\n display: grid;\r\n align-items: center;\r\n\r\n &:hover {\r\n background: #444444;\r\n }\r\n\r\n .expandableHeader {\r\n display: grid;\r\n grid-template-columns: 1fr 20px;\r\n\r\n .text {\r\n grid-column: 1;\r\n display: grid;\r\n grid-template-columns: 20px 1fr;\r\n\r\n .arrow {\r\n grid-column: 1;\r\n margin-left: 0px;\r\n color: white;\r\n cursor: pointer;\r\n display: inline-block;\r\n margin-right: 6px;\r\n opacity: 0.5;\r\n }\r\n\r\n .text-value {\r\n grid-column: 2;\r\n display: flex;\r\n align-items: center;\r\n }\r\n }\r\n\r\n .expandAll {\r\n opacity: 0.5;\r\n grid-column: 2;\r\n margin-right: 10px;\r\n }\r\n }\r\n }\r\n\r\n .icon {\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n }\r\n\r\n .itemContainer {\r\n margin-left: 0px;\r\n color: white;\r\n margin-top: 0px;\r\n margin-bottom: 0px;\r\n height: 24px;\r\n -webkit-user-select: none;\r\n -moz-user-select: none;\r\n -ms-user-select: none;\r\n user-select: none;\r\n display: grid;\r\n grid-template-columns: 20px 1fr;\r\n\r\n &:hover {\r\n background: #444444;\r\n }\r\n\r\n &.selected {\r\n background: #bbbbbb;\r\n color: black;\r\n }\r\n\r\n .isNotActive {\r\n opacity: 0.3;\r\n }\r\n\r\n .arrow {\r\n grid-column: 1;\r\n color: white;\r\n opacity: 0.6;\r\n }\r\n\r\n .popup {\r\n width: 200px;\r\n visibility: hidden;\r\n background-color: #444444;\r\n color: #fff;\r\n border: 1px solid rgba(255, 255, 255, 0.5);\r\n position: absolute;\r\n z-index: 1;\r\n margin-left: -180px;\r\n box-sizing: border-box;\r\n\r\n &.show {\r\n visibility: visible;\r\n }\r\n\r\n &:focus {\r\n outline: none;\r\n }\r\n\r\n .popupMenu {\r\n padding: 6px 5px 5px 10px;\r\n overflow: hidden;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n height: 18px;\r\n\r\n &:hover {\r\n background: white;\r\n color: #333333;\r\n }\r\n }\r\n }\r\n\r\n .sceneNode {\r\n grid-column: 2;\r\n margin-left: -10px;\r\n display: grid;\r\n grid-template-columns: 1fr 20px 20px 20px 20px 10px 20px 20px auto 5px;\r\n align-items: center;\r\n cursor: pointer;\r\n\r\n .sceneTitle {\r\n grid-column: 1;\r\n margin-right: 5px;\r\n display: flex;\r\n align-items: center;\r\n height: 24px;\r\n }\r\n\r\n .translation {\r\n grid-column: 2;\r\n opacity: 0.6;\r\n\r\n &.selected {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n .rotation {\r\n grid-column: 3;\r\n opacity: 0.6;\r\n\r\n &.selected {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n .scaling {\r\n grid-column: 4;\r\n opacity: 0.6;\r\n &.selected {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n .bounding {\r\n grid-column: 5;\r\n opacity: 0.6;\r\n &.selected {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n .separator {\r\n grid-column: 6;\r\n margin-left: 5px;\r\n width: 5px;\r\n display: flex;\r\n align-items: center;\r\n height: 18px;\r\n border-left: solid 1px rgb(51, 122, 183);\r\n }\r\n\r\n .pickingMode {\r\n grid-column: 7;\r\n opacity: 0.6;\r\n\r\n &.selected {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n .refresh {\r\n grid-column: 8;\r\n }\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 9;\r\n }\r\n }\r\n\r\n .targetedAnimationTools {\r\n grid-column: 2;\r\n width: 100%;\r\n display: grid;\r\n grid-template-columns: 1fr auto 5px;\r\n align-items: center;\r\n min-width: 0;\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 2;\r\n }\r\n }\r\n\r\n .animationGroupTools {\r\n grid-column: 2;\r\n width: 100%;\r\n display: grid;\r\n grid-template-columns: 1fr auto 5px;\r\n align-items: center;\r\n min-width: 0;\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 2;\r\n }\r\n }\r\n\r\n .soundTools {\r\n grid-column: 2;\r\n width: 100%;\r\n display: grid;\r\n grid-template-columns: 1fr auto 5px;\r\n align-items: center;\r\n min-width: 0;\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 2;\r\n }\r\n }\r\n\r\n .meshTools {\r\n grid-column: 2;\r\n width: 100%;\r\n display: grid;\r\n grid-template-columns: 1fr 20px 20px auto 5px;\r\n align-items: center;\r\n min-width: 0;\r\n\r\n .bounding-box {\r\n grid-column: 2;\r\n opacity: 0.5;\r\n\r\n &.selected {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n .visibility {\r\n grid-column: 3;\r\n }\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 4;\r\n }\r\n }\r\n\r\n .cameraTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr 20px 20px auto 5px;\r\n align-items: center;\r\n\r\n .activeCamera {\r\n grid-column: 2;\r\n }\r\n\r\n .enableGizmo {\r\n grid-column: 3;\r\n }\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 4;\r\n }\r\n }\r\n\r\n .lightTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr 20px 20px auto 5px;\r\n align-items: center;\r\n\r\n .enableLight {\r\n grid-column: 2;\r\n }\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 3;\r\n }\r\n }\r\n\r\n .spriteTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr auto 5px;\r\n align-items: center;\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 2;\r\n }\r\n }\r\n\r\n .spriteManagerTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr auto 5px;\r\n align-items: center;\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 2;\r\n }\r\n }\r\n\r\n .materialTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr auto 5px;\r\n align-items: center;\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 2;\r\n }\r\n\r\n .icon {\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n cursor: pointer;\r\n }\r\n }\r\n\r\n .particleSystemTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr auto 5px;\r\n align-items: center;\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 2;\r\n }\r\n }\r\n\r\n .effectLayerTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr auto 5px;\r\n align-items: center;\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 2;\r\n }\r\n }\r\n\r\n .postProcessTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr auto 5px;\r\n align-items: center;\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 2;\r\n }\r\n }\r\n\r\n .renderingPipelineTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr auto 5px;\r\n align-items: center;\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 2;\r\n }\r\n }\r\n\r\n .textureTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr auto 5px;\r\n align-items: center;\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 2;\r\n }\r\n }\r\n\r\n .adtextureTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr 20px 20px auto 5px;\r\n align-items: center;\r\n\r\n .edit {\r\n grid-column: 2;\r\n }\r\n\r\n .pickingMode {\r\n grid-column: 3;\r\n opacity: 0.6;\r\n\r\n &.selected {\r\n opacity: 1;\r\n }\r\n }\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 3;\r\n }\r\n }\r\n\r\n .controlTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr 20px 20px auto 5px;\r\n align-items: center;\r\n\r\n .highlight {\r\n grid-column: 2;\r\n }\r\n\r\n .visibility {\r\n grid-column: 3;\r\n }\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 4;\r\n }\r\n }\r\n\r\n .transformNodeTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr auto 5px;\r\n align-items: center;\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 2;\r\n }\r\n }\r\n\r\n .skeletonTools {\r\n grid-column: 2;\r\n display: grid;\r\n grid-template-columns: 1fr auto 5px;\r\n align-items: center;\r\n\r\n .extensions {\r\n width: 20px;\r\n grid-column: 2;\r\n }\r\n }\r\n\r\n .title {\r\n grid-column: 1;\r\n background: transparent;\r\n white-space: nowrap;\r\n overflow: hidden;\r\n min-width: 0;\r\n margin-right: 5px;\r\n display: grid;\r\n align-items: center;\r\n grid-template-columns: 25px 1fr;\r\n height: 24px;\r\n cursor: pointer;\r\n\r\n .titleIcon {\r\n grid-column: 1;\r\n display: grid;\r\n align-items: center;\r\n justify-items: center;\r\n }\r\n\r\n .titleText {\r\n grid-column: 2;\r\n white-space: nowrap;\r\n text-overflow: ellipsis;\r\n overflow: hidden;\r\n }\r\n }\r\n }\r\n}\r\n"],"sourceRoot":""}]);
283
292
  // Exports
293
+ ___CSS_LOADER_EXPORT___.locals = {};
284
294
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
285
295
 
286
296
 
@@ -308,6 +318,7 @@ var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBP
308
318
  // Module
309
319
  ___CSS_LOADER_EXPORT___.push([module.id, ".color-picker-container {\n width: 320px;\n height: 300px;\n background-color: white;\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: 50% 50px 60px 40px 1fr auto;\n font-family: \"acumin-pro-condensed\";\n font-weight: normal;\n font-size: 14px; }\n .color-picker-container.with-hints {\n height: 380px; }\n .color-picker-container .color-picker-saturation {\n grid-row: 1;\n grid-column: 1;\n display: grid;\n grid-template-columns: 100%;\n grid-template-rows: 100%;\n position: relative;\n cursor: pointer; }\n .color-picker-container .color-picker-saturation .color-picker-saturation-white {\n grid-row: 1;\n grid-column: 1;\n background: -webkit-linear-gradient(to right, #fff, rgba(255, 255, 255, 0));\n background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0)); }\n .color-picker-container .color-picker-saturation .color-picker-saturation-black {\n grid-row: 1;\n grid-column: 1;\n background: -webkit-linear-gradient(to top, #000, rgba(0, 0, 0, 0));\n background: linear-gradient(to top, #000, rgba(0, 0, 0, 0)); }\n .color-picker-container .color-picker-saturation .color-picker-saturation-cursor {\n pointer-events: none;\n width: 4px;\n height: 4px;\n box-shadow: 0 0 0 1.5px #fff, inset 0 0 1px 1px rgba(0, 0, 0, 0.3), 0 0 1px 2px rgba(0, 0, 0, 0.4);\n border-radius: 50%;\n transform: translate(-2px, -2px);\n position: absolute; }\n .color-picker-container .color-picker-hue {\n grid-row: 2;\n grid-column: 1;\n display: grid;\n margin: 10px;\n grid-template-columns: 24% 76%;\n grid-template-rows: 100%; }\n .color-picker-container .color-picker-hue .color-picker-hue-color {\n grid-row: 1;\n grid-column: 1;\n align-self: center;\n justify-self: center;\n width: 30px;\n height: 30px;\n border-radius: 15px;\n border: 1px solid black; }\n .color-picker-container .color-picker-hue .color-picker-hue-slider {\n grid-row: 1;\n grid-column: 2;\n align-self: center;\n height: 16px;\n position: relative;\n cursor: pointer;\n background: linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%);\n background: -webkit-linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%); }\n .color-picker-container .color-picker-hue .color-picker-hue-slider .color-picker-hue-cursor {\n pointer-events: none;\n width: 8px;\n height: 18px;\n transform: translate(-4px, -2px);\n background-color: #f8f8f8;\n box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.37);\n position: absolute; }\n .color-picker-container .color-picker-component {\n display: grid;\n margin: 5px;\n grid-template-columns: 100%;\n grid-template-rows: 50% 50%; }\n .color-picker-container .color-picker-component .color-picker-component-value {\n justify-self: center;\n align-self: center;\n grid-row: 1;\n grid-column: 1;\n margin-bottom: 4px; }\n .color-picker-container .color-picker-component .color-picker-component-value input {\n width: 50px; }\n .color-picker-container .color-picker-component .color-picker-component-label {\n justify-self: center;\n align-self: center;\n grid-row: 2;\n grid-column: 1;\n color: black; }\n .color-picker-container .color-picker-rgb {\n grid-row: 3;\n grid-column: 1;\n display: grid;\n margin: 10px;\n grid-template-columns: 20% 6.66% 20% 6.66% 20% 6.66% 20%;\n grid-template-rows: 100%; }\n .color-picker-container .red {\n grid-row: 1;\n grid-column: 1; }\n .color-picker-container .green {\n grid-row: 1;\n grid-column: 3; }\n .color-picker-container .blue {\n grid-row: 1;\n grid-column: 5; }\n .color-picker-container .alpha {\n grid-row: 1;\n grid-column: 7; }\n .color-picker-container .alpha.grayed {\n opacity: 0.5; }\n .color-picker-container .color-picker-hex {\n grid-row: 4;\n grid-column: 1;\n display: grid;\n grid-template-columns: 20% 80%;\n grid-template-rows: 100%; }\n .color-picker-container .color-picker-hex .color-picker-hex-label {\n justify-self: center;\n align-self: center;\n grid-row: 1;\n grid-column: 1;\n margin-left: 10px;\n color: black; }\n .color-picker-container .color-picker-hex .color-picker-hex-value {\n justify-self: left;\n align-self: center;\n grid-row: 1;\n grid-column: 2;\n margin-left: 10px;\n margin-right: 10px; }\n .color-picker-container .color-picker-hex .color-picker-hex-value input {\n width: 70px; }\n .color-picker-container .color-picker-warning {\n color: black;\n font-size: 11px;\n padding: 4px;\n justify-self: left;\n align-self: center;\n grid-row: 6;\n grid-column: 1; }\n", "",{"version":3,"sources":["webpack://./../../../dev/sharedUiComponents/dist/colorPicker/colorPicker.scss"],"names":[],"mappings":"AAAA;EACI,YAAY;EACZ,aAAa;EACb,uBAAuB;EACvB,aAAa;EACb,2BAA2B;EAC3B,+CAA+C;EAC/C,mCAAmC;EACnC,mBAAmB;EACnB,eAAe,EAAA;EATnB;IAYQ,aAAa,EAAA;EAZrB;IAgBQ,WAAW;IACX,cAAc;IACd,aAAa;IACb,2BAA2B;IAC3B,wBAAwB;IACxB,kBAAkB;IAClB,eAAe,EAAA;IAtBvB;MAyBY,WAAW;MACX,cAAc;MAEd,2EAA2E;MAC3E,mEAAmE,EAAA;IA7B/E;MAiCY,WAAW;MACX,cAAc;MAEd,mEAAmE;MACnE,2DAA2D,EAAA;IArCvE;MAyCY,oBAAoB;MACpB,UAAU;MACV,WAAW;MACX,kGAAkG;MAClG,kBAAkB;MAClB,gCAAgC;MAChC,kBAAkB,EAAA;EA/C9B;IAoDQ,WAAW;IACX,cAAc;IACd,aAAa;IACb,YAAY;IACZ,8BAA8B;IAC9B,wBAAwB,EAAA;IAzDhC;MA4DY,WAAW;MACX,cAAc;MACd,kBAAkB;MAClB,oBAAoB;MACpB,WAAW;MACX,YAAY;MACZ,mBAAmB;MACnB,uBAAuB,EAAA;IAnEnC;MAuEY,WAAW;MACX,cAAc;MACd,kBAAkB;MAClB,YAAY;MACZ,kBAAkB;MAClB,eAAe;MAEf,2GAA2G;MAC3G,mHAAmH,EAAA;MA/E/H;QAkFgB,oBAAoB;QACpB,UAAU;QACV,YAAY;QACZ,gCAAgC;QAChC,yBAAoC;QACpC,2CAA2C;QAC3C,kBAAkB,EAAA;EAxFlC;IA8FQ,aAAa;IACb,WAAW;IACX,2BAA2B;IAC3B,2BAA2B,EAAA;IAjGnC;MAoGY,oBAAoB;MACpB,kBAAkB;MAClB,WAAW;MACX,cAAc;MACd,kBAAkB,EAAA;MAxG9B;QA2GgB,WAAW,EAAA;IA3G3B;MAgHY,oBAAoB;MACpB,kBAAkB;MAClB,WAAW;MACX,cAAc;MACd,YAAY,EAAA;EApHxB;IAyHQ,WAAW;IACX,cAAc;IACd,aAAa;IACb,YAAY;IACZ,wDAAwD;IACxD,wBAAwB,EAAA;EA9HhC;IAkIQ,WAAW;IACX,cAAc,EAAA;EAnItB;IAuIQ,WAAW;IACX,cAAc,EAAA;EAxItB;IA4IQ,WAAW;IACX,cAAc,EAAA;EA7ItB;IAiJQ,WAAW;IACX,cAAc,EAAA;IAlJtB;MAqJY,YAAY,EAAA;EArJxB;IA0JQ,WAAW;IACX,cAAc;IACd,aAAa;IACb,8BAA8B;IAC9B,wBAAwB,EAAA;IA9JhC;MAiKY,oBAAoB;MACpB,kBAAkB;MAClB,WAAW;MACX,cAAc;MACd,iBAAiB;MACjB,YAAY,EAAA;IAtKxB;MA0KY,kBAAkB;MAClB,kBAAkB;MAClB,WAAW;MACX,cAAc;MACd,iBAAiB;MACjB,kBAAkB,EAAA;MA/K9B;QAkLgB,WAAW,EAAA;EAlL3B;IAwLQ,YAAY;IACZ,eAAe;IACf,YAAY;IACZ,kBAAkB;IAClB,kBAAkB;IAClB,WAAW;IACX,cAAc,EAAA","sourcesContent":[".color-picker-container {\r\n width: 320px;\r\n height: 300px;\r\n background-color: white;\r\n display: grid;\r\n grid-template-columns: 100%;\r\n grid-template-rows: 50% 50px 60px 40px 1fr auto;\r\n font-family: \"acumin-pro-condensed\";\r\n font-weight: normal;\r\n font-size: 14px;\r\n\r\n &.with-hints {\r\n height: 380px;\r\n }\r\n\r\n .color-picker-saturation {\r\n grid-row: 1;\r\n grid-column: 1;\r\n display: grid;\r\n grid-template-columns: 100%;\r\n grid-template-rows: 100%;\r\n position: relative;\r\n cursor: pointer;\r\n\r\n .color-picker-saturation-white {\r\n grid-row: 1;\r\n grid-column: 1;\r\n\r\n background: -webkit-linear-gradient(to right, #fff, rgba(255, 255, 255, 0));\r\n background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0));\r\n }\r\n\r\n .color-picker-saturation-black {\r\n grid-row: 1;\r\n grid-column: 1;\r\n\r\n background: -webkit-linear-gradient(to top, #000, rgba(0, 0, 0, 0));\r\n background: linear-gradient(to top, #000, rgba(0, 0, 0, 0));\r\n }\r\n\r\n .color-picker-saturation-cursor {\r\n pointer-events: none;\r\n width: 4px;\r\n height: 4px;\r\n box-shadow: 0 0 0 1.5px #fff, inset 0 0 1px 1px rgba(0, 0, 0, 0.3), 0 0 1px 2px rgba(0, 0, 0, 0.4);\r\n border-radius: 50%;\r\n transform: translate(-2px, -2px);\r\n position: absolute;\r\n }\r\n }\r\n\r\n .color-picker-hue {\r\n grid-row: 2;\r\n grid-column: 1;\r\n display: grid;\r\n margin: 10px;\r\n grid-template-columns: 24% 76%;\r\n grid-template-rows: 100%;\r\n\r\n .color-picker-hue-color {\r\n grid-row: 1;\r\n grid-column: 1;\r\n align-self: center;\r\n justify-self: center;\r\n width: 30px;\r\n height: 30px;\r\n border-radius: 15px;\r\n border: 1px solid black;\r\n }\r\n\r\n .color-picker-hue-slider {\r\n grid-row: 1;\r\n grid-column: 2;\r\n align-self: center;\r\n height: 16px;\r\n position: relative;\r\n cursor: pointer;\r\n\r\n background: linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%);\r\n background: -webkit-linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%);\r\n\r\n .color-picker-hue-cursor {\r\n pointer-events: none;\r\n width: 8px;\r\n height: 18px;\r\n transform: translate(-4px, -2px);\r\n background-color: rgb(248, 248, 248);\r\n box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.37);\r\n position: absolute;\r\n }\r\n }\r\n }\r\n\r\n .color-picker-component {\r\n display: grid;\r\n margin: 5px;\r\n grid-template-columns: 100%;\r\n grid-template-rows: 50% 50%;\r\n\r\n .color-picker-component-value {\r\n justify-self: center;\r\n align-self: center;\r\n grid-row: 1;\r\n grid-column: 1;\r\n margin-bottom: 4px;\r\n\r\n input {\r\n width: 50px;\r\n }\r\n }\r\n\r\n .color-picker-component-label {\r\n justify-self: center;\r\n align-self: center;\r\n grid-row: 2;\r\n grid-column: 1;\r\n color: black;\r\n }\r\n }\r\n\r\n .color-picker-rgb {\r\n grid-row: 3;\r\n grid-column: 1;\r\n display: grid;\r\n margin: 10px;\r\n grid-template-columns: 20% 6.66% 20% 6.66% 20% 6.66% 20%;\r\n grid-template-rows: 100%;\r\n }\r\n\r\n .red {\r\n grid-row: 1;\r\n grid-column: 1;\r\n }\r\n\r\n .green {\r\n grid-row: 1;\r\n grid-column: 3;\r\n }\r\n\r\n .blue {\r\n grid-row: 1;\r\n grid-column: 5;\r\n }\r\n\r\n .alpha {\r\n grid-row: 1;\r\n grid-column: 7;\r\n\r\n &.grayed {\r\n opacity: 0.5;\r\n }\r\n }\r\n\r\n .color-picker-hex {\r\n grid-row: 4;\r\n grid-column: 1;\r\n display: grid;\r\n grid-template-columns: 20% 80%;\r\n grid-template-rows: 100%;\r\n\r\n .color-picker-hex-label {\r\n justify-self: center;\r\n align-self: center;\r\n grid-row: 1;\r\n grid-column: 1;\r\n margin-left: 10px;\r\n color: black;\r\n }\r\n\r\n .color-picker-hex-value {\r\n justify-self: left;\r\n align-self: center;\r\n grid-row: 1;\r\n grid-column: 2;\r\n margin-left: 10px;\r\n margin-right: 10px;\r\n\r\n input {\r\n width: 70px;\r\n }\r\n }\r\n }\r\n\r\n .color-picker-warning {\r\n color: black;\r\n font-size: 11px;\r\n padding: 4px;\r\n justify-self: left;\r\n align-self: center;\r\n grid-row: 6;\r\n grid-column: 1;\r\n }\r\n}\r\n"],"sourceRoot":""}]);
310
320
  // Exports
321
+ ___CSS_LOADER_EXPORT___.locals = {};
311
322
  /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);
312
323
 
313
324
 
@@ -59607,7 +59618,7 @@ class PBRMaterialPropertyGridComponent extends react__WEBPACK_IMPORTED_MODULE_1_
59607
59618
  material.sheen._saveRoughness = material.sheen.roughness;
59608
59619
  material.sheen.roughness = null;
59609
59620
  }
59610
- return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "pane" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commonMaterialPropertyGridComponent__WEBPACK_IMPORTED_MODULE_8__.CommonMaterialPropertyGridComponent, { globalState: this.props.globalState, lockObject: this.props.lockObject, material: material, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), this.renderTextures(this._onDebugSelectionChangeObservable), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "LIGHTING & COLORS", selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Albedo", target: material, propertyName: "albedoColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Reflectivity", target: material, propertyName: "reflectivityColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Micro-surface", target: material, propertyName: "microSurface", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Emissive", target: material, propertyName: "emissiveColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Ambient", target: material, propertyName: "ambientColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use physical light falloff", target: material, propertyName: "usePhysicalLightFalloff", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "METALLIC WORKFLOW", selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Metallic", target: material, propertyName: "metallic", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Roughness", target: material, propertyName: "roughness", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Index of Refraction", target: material, propertyName: "indexOfRefraction", minimum: 1, maximum: 3, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "F0 Factor", target: material, propertyName: "metallicF0Factor", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Reflectance Color", target: material, propertyName: "metallicReflectanceColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use only metallic from MetallicReflectance texture", target: material, propertyName: "useOnlyMetallicFromMetallicReflectanceTexture", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "MetallicReflectance Texture", texture: material.metallicReflectanceTexture, onTextureCreated: (texture) => (material.metallicReflectanceTexture = texture), onTextureRemoved: () => (material.metallicReflectanceTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Reflectance Texture", texture: material.reflectanceTexture, onTextureCreated: (texture) => (material.reflectanceTexture = texture), onTextureRemoved: () => (material.reflectanceTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "CLEAR COAT", selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Enabled", target: material.clearCoat, propertyName: "isEnabled", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.clearCoat.isEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "fragment" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Intensity", target: material.clearCoat, propertyName: "intensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Roughness", target: material.clearCoat, propertyName: "roughness", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "IOR", target: material.clearCoat, propertyName: "indexOfRefraction", minimum: 1.0, maximum: 3, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Remap F0", target: material.clearCoat, propertyName: "remapF0OnInterfaceChange", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Clear coat", texture: material.clearCoat.texture, onTextureCreated: (texture) => (material.clearCoat.texture = texture), onTextureRemoved: () => (material.clearCoat.texture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Roughness", texture: material.clearCoat.textureRoughness, onTextureCreated: (texture) => (material.clearCoat.textureRoughness = texture), onTextureRemoved: () => (material.clearCoat.textureRoughness = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Bump", texture: material.clearCoat.bumpTexture, onTextureCreated: (texture) => (material.clearCoat.bumpTexture = texture), onTextureRemoved: () => (material.clearCoat.bumpTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), material.clearCoat.bumpTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Bump strength", target: material.clearCoat.bumpTexture, propertyName: "level", minimum: 0, maximum: 2, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use roughness from main texture", target: material.clearCoat, propertyName: "useRoughnessFromMainTexture", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Tint", target: material.clearCoat, propertyName: "isTintEnabled", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.clearCoat.isEnabled && material.clearCoat.isTintEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Tint Color", target: material.clearCoat, propertyName: "tintColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true })), material.clearCoat.isEnabled && material.clearCoat.isTintEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "At Distance", target: material.clearCoat, propertyName: "tintColorAtDistance", minimum: 0, maximum: 20, step: 0.1, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.clearCoat.isEnabled && material.clearCoat.isTintEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Tint Thickness", target: material.clearCoat, propertyName: "tintThickness", minimum: 0, maximum: 20, step: 0.1, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.clearCoat.isEnabled && material.clearCoat.isTintEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Tint", texture: material.clearCoat.tintTexture, onTextureCreated: (texture) => (material.clearCoat.tintTexture = texture), onTextureRemoved: () => (material.clearCoat.tintTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }))] })))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "IRIDESCENCE", selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Enabled", target: material.iridescence, propertyName: "isEnabled", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.iridescence.isEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "fragment" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Intensity", target: material.iridescence, propertyName: "intensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "IOR", target: material.iridescence, propertyName: "indexOfRefraction", minimum: 1.0, maximum: 3, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Min Thickness", target: material.iridescence, propertyName: "minimumThickness", minimum: 0, maximum: 1000, step: 10, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Max Thickness", target: material.iridescence, propertyName: "maximumThickness", minimum: 0, maximum: 1000, step: 10, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Iridescence", texture: material.iridescence.texture, onTextureCreated: (texture) => (material.iridescence.texture = texture), onTextureRemoved: () => (material.iridescence.texture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Thickness", texture: material.iridescence.thicknessTexture, onTextureCreated: (texture) => (material.iridescence.thicknessTexture = texture), onTextureRemoved: () => (material.iridescence.thicknessTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable })] })))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "ANISOTROPIC", selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Enabled", target: material.anisotropy, propertyName: "isEnabled", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.anisotropy.isEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "fragment" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Intensity", target: material.anisotropy, propertyName: "intensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector2LineComponent__WEBPACK_IMPORTED_MODULE_10__.Vector2LineComponent, { label: "Direction", target: material.anisotropy, propertyName: "direction", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Anisotropic", texture: material.anisotropy.texture, onTextureCreated: (texture) => (material.anisotropy.texture = texture), onTextureRemoved: () => (material.anisotropy.texture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable })] })))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "SHEEN", selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Enabled", target: material.sheen, propertyName: "isEnabled", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.sheen.isEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "fragment" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Link to Albedo", target: material.sheen, propertyName: "linkSheenWithAlbedo", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Intensity", target: material.sheen, propertyName: "intensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Color", target: material.sheen, propertyName: "color", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Sheen", texture: material.sheen.texture, onTextureCreated: (texture) => (material.sheen.texture = texture), onTextureRemoved: () => (material.sheen.texture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Roughness", texture: material.sheen.textureRoughness, onTextureCreated: (texture) => (material.sheen.textureRoughness = texture), onTextureRemoved: () => (material.sheen.textureRoughness = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use roughness", target: material.sheen, propertyName: "_useRoughness" }), material.sheen._useRoughness && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Roughness", target: material.sheen, propertyName: "roughness", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use roughness from main texture", target: material.sheen, propertyName: "useRoughnessFromMainTexture", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Albedo scaling", target: material.sheen, propertyName: "albedoScaling", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "SUBSURFACE", selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Thickness", texture: material.subSurface.thicknessTexture, onTextureCreated: (texture) => (material.subSurface.thicknessTexture = texture), onTextureRemoved: () => (material.subSurface.thicknessTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Min Thickness", target: material.subSurface, propertyName: "minimumThickness", minimum: 0, maximum: 10, step: 0.1, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Max Thickness", target: material.subSurface, propertyName: "maximumThickness", minimum: 0, maximum: 10, step: 0.1, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Mask From Thickness", target: material.subSurface, propertyName: "useMaskFromThicknessTexture", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "glTF-Style Textures", target: material.subSurface, propertyName: "useGltfStyleTextures", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use Thickness as Depth", target: material.subSurface, propertyName: "useThicknessAsDepth", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Tint Color", target: material.subSurface, propertyName: "tintColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Scattering Enabled", target: material.subSurface, propertyName: "isScatteringEnabled", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.subSurface.isScatteringEnabled && material.getScene().prePassRenderer && material.getScene().subSurfaceConfiguration && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "fragment" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Meters per unit", target: material.getScene().subSurfaceConfiguration, propertyName: "metersPerUnit", minimum: 0.01, maximum: 2, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }) }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Refraction Enabled", target: material.subSurface, propertyName: "isRefractionEnabled", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.subSurface.isRefractionEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "fragment" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Intensity", target: material.subSurface, propertyName: "refractionIntensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Refraction", texture: material.subSurface.refractionTexture, onTextureCreated: (texture) => (material.subSurface.refractionTexture = texture), onTextureRemoved: () => (material.subSurface.refractionTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Volume Index of Refraction", target: material.subSurface, propertyName: "volumeIndexOfRefraction", minimum: 1, maximum: 3, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Tint at Distance", target: material.subSurface, propertyName: "tintColorAtDistance", minimum: 0, maximum: 10, step: 0.1, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Link refraction with transparency", target: material.subSurface, propertyName: "linkRefractionWithTransparency", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use albedo to tint surface transparency", target: material.subSurface, propertyName: "useAlbedoToTintRefraction", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Translucency Enabled", target: material.subSurface, propertyName: "isTranslucencyEnabled", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.subSurface.isTranslucencyEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "fragment" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Intensity", target: material.subSurface, propertyName: "translucencyIntensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Diffusion Distance", target: material.subSurface, propertyName: "diffusionDistance", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use albedo to tint surface translucency", target: material.subSurface, propertyName: "useAlbedoToTintTranslucency", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "LEVELS", closed: true, selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Environment", target: material, propertyName: "environmentIntensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Specular", target: material, propertyName: "specularIntensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Emissive", target: material, propertyName: "emissiveIntensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Direct", target: material, propertyName: "directIntensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.bumpTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Bump strength", target: material.bumpTexture, propertyName: "level", minimum: 0, maximum: 2, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.ambientTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Ambient strength", target: material, propertyName: "ambientTextureStrength", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.reflectionTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Reflection strength", target: material.reflectionTexture, propertyName: "level", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.clearCoat.texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Clear coat", target: material.clearCoat.texture, propertyName: "level", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.clearCoat.bumpTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Clear coat bump", target: material.clearCoat.bumpTexture, propertyName: "level", minimum: 0, maximum: 2, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.clearCoat.tintTexture && false /* level is not used for the clear coat tint texture */ && (0), material.anisotropy.texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Anisotropic", target: material.anisotropy.texture, propertyName: "level", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.sheen.texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Sheen", target: material.sheen.texture, propertyName: "level", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.subSurface.thicknessTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Thickness", target: material.subSurface.thicknessTexture, propertyName: "level", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.subSurface.refractionTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Refraction", target: material.subSurface.refractionTexture, propertyName: "level", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.detailMap.isEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Detailmap diffuse", target: material.detailMap, propertyName: "diffuseBlendLevel", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Detailmap bump", target: material.detailMap, propertyName: "bumpLevel", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Detailmap roughness", target: material.detailMap, propertyName: "roughnessBlendLevel", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "RENDERING", closed: true, selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Alpha from albedo", target: material, propertyName: "useAlphaFromAlbedoTexture", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Ambient in grayscale", target: material, propertyName: "useAmbientInGrayScale", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Radiance over alpha", target: material, propertyName: "useRadianceOverAlpha", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Micro-surface from ref. map alpha", target: material, propertyName: "useMicroSurfaceFromReflectivityMapAlpha", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Specular over alpha", target: material, propertyName: "useSpecularOverAlpha", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Specular anti-aliasing", target: material, propertyName: "enableSpecularAntiAliasing", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Realtime Filtering", target: material, propertyName: "realTimeFiltering", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_7__.OptionsLineComponent, { allowNullValue: true, label: "Realtime Filtering quality", options: realTimeFilteringQualityOptions, target: material, propertyName: "realTimeFilteringQuality", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "NORMAL MAP", closed: true, selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Invert X axis", target: material, propertyName: "invertNormalMapX", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Invert Y axis", target: material, propertyName: "invertNormalMapY", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "ADVANCED", closed: true, selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Energy Conservation", target: material.brdf, propertyName: "useEnergyConservation", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Spherical Harmonics", target: material.brdf, propertyName: "useSphericalHarmonics", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Radiance occlusion", target: material, propertyName: "useRadianceOcclusion", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Horizon occlusion ", target: material, propertyName: "useHorizonOcclusion", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Unlit", target: material, propertyName: "unlit", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "DEBUG", closed: true, selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_7__.OptionsLineComponent, { label: "Debug mode", options: debugMode, target: material, propertyName: "debugMode" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Split position", target: material, propertyName: "debugLimit", minimum: -1, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Output factor", target: material, propertyName: "debugFactor", minimum: 0, maximum: 5, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }))] })));
59621
+ return ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "pane" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_commonMaterialPropertyGridComponent__WEBPACK_IMPORTED_MODULE_8__.CommonMaterialPropertyGridComponent, { globalState: this.props.globalState, lockObject: this.props.lockObject, material: material, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), this.renderTextures(this._onDebugSelectionChangeObservable), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "LIGHTING & COLORS", selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Albedo", target: material, propertyName: "albedoColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Reflectivity", target: material, propertyName: "reflectivityColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Micro-surface", target: material, propertyName: "microSurface", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Emissive", target: material, propertyName: "emissiveColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Ambient", target: material, propertyName: "ambientColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use physical light falloff", target: material, propertyName: "usePhysicalLightFalloff", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "METALLIC WORKFLOW", selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Metallic", target: material, propertyName: "metallic", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Roughness", target: material, propertyName: "roughness", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Index of Refraction", target: material, propertyName: "indexOfRefraction", minimum: 1, maximum: 3, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "F0 Factor", target: material, propertyName: "metallicF0Factor", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Reflectance Color", target: material, propertyName: "metallicReflectanceColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use only metallic from MetallicReflectance texture", target: material, propertyName: "useOnlyMetallicFromMetallicReflectanceTexture", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "MetallicReflectance Texture", texture: material.metallicReflectanceTexture, onTextureCreated: (texture) => (material.metallicReflectanceTexture = texture), onTextureRemoved: () => (material.metallicReflectanceTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Reflectance Texture", texture: material.reflectanceTexture, onTextureCreated: (texture) => (material.reflectanceTexture = texture), onTextureRemoved: () => (material.reflectanceTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "CLEAR COAT", selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Enabled", target: material.clearCoat, propertyName: "isEnabled", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.clearCoat.isEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "fragment" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Intensity", target: material.clearCoat, propertyName: "intensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Roughness", target: material.clearCoat, propertyName: "roughness", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "IOR", target: material.clearCoat, propertyName: "indexOfRefraction", minimum: 1.0, maximum: 3, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Remap F0", target: material.clearCoat, propertyName: "remapF0OnInterfaceChange", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Clear coat", texture: material.clearCoat.texture, onTextureCreated: (texture) => (material.clearCoat.texture = texture), onTextureRemoved: () => (material.clearCoat.texture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Roughness", texture: material.clearCoat.textureRoughness, onTextureCreated: (texture) => (material.clearCoat.textureRoughness = texture), onTextureRemoved: () => (material.clearCoat.textureRoughness = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Bump", texture: material.clearCoat.bumpTexture, onTextureCreated: (texture) => (material.clearCoat.bumpTexture = texture), onTextureRemoved: () => (material.clearCoat.bumpTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), material.clearCoat.bumpTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Bump strength", target: material.clearCoat.bumpTexture, propertyName: "level", minimum: 0, maximum: 2, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use roughness from main texture", target: material.clearCoat, propertyName: "useRoughnessFromMainTexture", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Tint", target: material.clearCoat, propertyName: "isTintEnabled", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.clearCoat.isEnabled && material.clearCoat.isTintEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Tint Color", target: material.clearCoat, propertyName: "tintColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true })), material.clearCoat.isEnabled && material.clearCoat.isTintEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "At Distance", target: material.clearCoat, propertyName: "tintColorAtDistance", minimum: 0, maximum: 20, step: 0.1, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.clearCoat.isEnabled && material.clearCoat.isTintEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Tint Thickness", target: material.clearCoat, propertyName: "tintThickness", minimum: 0, maximum: 20, step: 0.1, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.clearCoat.isEnabled && material.clearCoat.isTintEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Tint", texture: material.clearCoat.tintTexture, onTextureCreated: (texture) => (material.clearCoat.tintTexture = texture), onTextureRemoved: () => (material.clearCoat.tintTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }))] })))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "IRIDESCENCE", selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Enabled", target: material.iridescence, propertyName: "isEnabled", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.iridescence.isEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "fragment" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Intensity", target: material.iridescence, propertyName: "intensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "IOR", target: material.iridescence, propertyName: "indexOfRefraction", minimum: 1.0, maximum: 3, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Min Thickness", target: material.iridescence, propertyName: "minimumThickness", minimum: 0, maximum: 1000, step: 10, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Max Thickness", target: material.iridescence, propertyName: "maximumThickness", minimum: 0, maximum: 1000, step: 10, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Iridescence", texture: material.iridescence.texture, onTextureCreated: (texture) => (material.iridescence.texture = texture), onTextureRemoved: () => (material.iridescence.texture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Thickness", texture: material.iridescence.thicknessTexture, onTextureCreated: (texture) => (material.iridescence.thicknessTexture = texture), onTextureRemoved: () => (material.iridescence.thicknessTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable })] })))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "ANISOTROPIC", selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Enabled", target: material.anisotropy, propertyName: "isEnabled", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.anisotropy.isEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "fragment" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Intensity", target: material.anisotropy, propertyName: "intensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_vector2LineComponent__WEBPACK_IMPORTED_MODULE_10__.Vector2LineComponent, { label: "Direction", target: material.anisotropy, propertyName: "direction", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Anisotropic", texture: material.anisotropy.texture, onTextureCreated: (texture) => (material.anisotropy.texture = texture), onTextureRemoved: () => (material.anisotropy.texture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable })] })))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "SHEEN", selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Enabled", target: material.sheen, propertyName: "isEnabled", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.sheen.isEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "fragment" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Link to Albedo", target: material.sheen, propertyName: "linkSheenWithAlbedo", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Intensity", target: material.sheen, propertyName: "intensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Color", target: material.sheen, propertyName: "color", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Sheen", texture: material.sheen.texture, onTextureCreated: (texture) => (material.sheen.texture = texture), onTextureRemoved: () => (material.sheen.texture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Roughness", texture: material.sheen.textureRoughness, onTextureCreated: (texture) => (material.sheen.textureRoughness = texture), onTextureRemoved: () => (material.sheen.textureRoughness = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use roughness", target: material.sheen, propertyName: "_useRoughness" }), material.sheen._useRoughness && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Roughness", target: material.sheen, propertyName: "roughness", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use roughness from main texture", target: material.sheen, propertyName: "useRoughnessFromMainTexture", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Albedo scaling", target: material.sheen, propertyName: "albedoScaling", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "SUBSURFACE", selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Thickness", texture: material.subSurface.thicknessTexture, onTextureCreated: (texture) => (material.subSurface.thicknessTexture = texture), onTextureRemoved: () => (material.subSurface.thicknessTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Min Thickness", target: material.subSurface, propertyName: "minimumThickness", minimum: 0, maximum: 10, step: 0.1, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Max Thickness", target: material.subSurface, propertyName: "maximumThickness", minimum: 0, maximum: 10, step: 0.1, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Mask From Thickness", target: material.subSurface, propertyName: "useMaskFromThicknessTexture", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "glTF-Style Textures", target: material.subSurface, propertyName: "useGltfStyleTextures", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use Thickness as Depth", target: material.subSurface, propertyName: "useThicknessAsDepth", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Tint Color", target: material.subSurface, propertyName: "tintColor", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Scattering Enabled", target: material.subSurface, propertyName: "isScatteringEnabled", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.subSurface.isScatteringEnabled && material.getScene().prePassRenderer && material.getScene().subSurfaceConfiguration && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("div", Object.assign({ className: "fragment" }, { children: (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Meters per unit", target: material.getScene().subSurfaceConfiguration, propertyName: "metersPerUnit", minimum: 0.01, maximum: 2, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }) }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Refraction Enabled", target: material.subSurface, propertyName: "isRefractionEnabled", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.subSurface.isRefractionEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "fragment" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Intensity", target: material.subSurface, propertyName: "refractionIntensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Refraction Intensity", texture: material.subSurface.refractionIntensityTexture, onTextureCreated: (texture) => (material.subSurface.refractionIntensityTexture = texture), onTextureRemoved: () => (material.subSurface.refractionIntensityTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(_lines_textureLinkLineComponent__WEBPACK_IMPORTED_MODULE_9__.TextureLinkLineComponent, { label: "Refraction", texture: material.subSurface.refractionTexture, onTextureCreated: (texture) => (material.subSurface.refractionTexture = texture), onTextureRemoved: () => (material.subSurface.refractionTexture = null), material: material, onSelectionChangedObservable: this.props.onSelectionChangedObservable, onDebugSelectionChangeObservable: this._onDebugSelectionChangeObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Volume Index of Refraction", target: material.subSurface, propertyName: "volumeIndexOfRefraction", minimum: 1, maximum: 3, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Tint at Distance", target: material.subSurface, propertyName: "tintColorAtDistance", minimum: 0, maximum: 10, step: 0.1, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Link refraction with transparency", target: material.subSurface, propertyName: "linkRefractionWithTransparency", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use albedo to tint surface transparency", target: material.subSurface, propertyName: "useAlbedoToTintRefraction", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }))), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Translucency Enabled", target: material.subSurface, propertyName: "isTranslucencyEnabled", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.subSurface.isTranslucencyEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", Object.assign({ className: "fragment" }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Intensity", target: material.subSurface, propertyName: "translucencyIntensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_color3LineComponent__WEBPACK_IMPORTED_MODULE_4__.Color3LineComponent, { label: "Diffusion Distance", target: material.subSurface, propertyName: "diffusionDistance", onPropertyChangedObservable: this.props.onPropertyChangedObservable, isLinear: true }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Use albedo to tint surface translucency", target: material.subSurface, propertyName: "useAlbedoToTintTranslucency", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "LEVELS", closed: true, selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Environment", target: material, propertyName: "environmentIntensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Specular", target: material, propertyName: "specularIntensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Emissive", target: material, propertyName: "emissiveIntensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Direct", target: material, propertyName: "directIntensity", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), material.bumpTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Bump strength", target: material.bumpTexture, propertyName: "level", minimum: 0, maximum: 2, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.ambientTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Ambient strength", target: material, propertyName: "ambientTextureStrength", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.reflectionTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Reflection strength", target: material.reflectionTexture, propertyName: "level", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.clearCoat.texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Clear coat", target: material.clearCoat.texture, propertyName: "level", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.clearCoat.bumpTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Clear coat bump", target: material.clearCoat.bumpTexture, propertyName: "level", minimum: 0, maximum: 2, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.clearCoat.tintTexture && false /* level is not used for the clear coat tint texture */ && (0), material.anisotropy.texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Anisotropic", target: material.anisotropy.texture, propertyName: "level", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.sheen.texture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Sheen", target: material.sheen.texture, propertyName: "level", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.subSurface.thicknessTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Thickness", target: material.subSurface.thicknessTexture, propertyName: "level", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.subSurface.refractionTexture && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Refraction", target: material.subSurface.refractionTexture, propertyName: "level", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })), material.detailMap.isEnabled && ((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Detailmap diffuse", target: material.detailMap, propertyName: "diffuseBlendLevel", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Detailmap bump", target: material.detailMap, propertyName: "bumpLevel", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Detailmap roughness", target: material.detailMap, propertyName: "roughnessBlendLevel", minimum: 0, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }))] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "RENDERING", closed: true, selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Alpha from albedo", target: material, propertyName: "useAlphaFromAlbedoTexture", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Ambient in grayscale", target: material, propertyName: "useAmbientInGrayScale", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Radiance over alpha", target: material, propertyName: "useRadianceOverAlpha", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Micro-surface from ref. map alpha", target: material, propertyName: "useMicroSurfaceFromReflectivityMapAlpha", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Specular over alpha", target: material, propertyName: "useSpecularOverAlpha", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Specular anti-aliasing", target: material, propertyName: "enableSpecularAntiAliasing", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Realtime Filtering", target: material, propertyName: "realTimeFiltering", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_7__.OptionsLineComponent, { allowNullValue: true, label: "Realtime Filtering quality", options: realTimeFilteringQualityOptions, target: material, propertyName: "realTimeFilteringQuality", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "NORMAL MAP", closed: true, selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Invert X axis", target: material, propertyName: "invertNormalMapX", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Invert Y axis", target: material, propertyName: "invertNormalMapY", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "ADVANCED", closed: true, selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Energy Conservation", target: material.brdf, propertyName: "useEnergyConservation", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Spherical Harmonics", target: material.brdf, propertyName: "useSphericalHarmonics", onValueChanged: () => this.forceUpdate(), onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Radiance occlusion", target: material, propertyName: "useRadianceOcclusion", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Horizon occlusion ", target: material, propertyName: "useHorizonOcclusion", onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_checkBoxLineComponent__WEBPACK_IMPORTED_MODULE_5__.CheckBoxLineComponent, { label: "Unlit", target: material, propertyName: "unlit", onPropertyChangedObservable: this.props.onPropertyChangedObservable })] })), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)(shared_ui_components_lines_lineContainerComponent__WEBPACK_IMPORTED_MODULE_3__.LineContainerComponent, Object.assign({ title: "DEBUG", closed: true, selection: this.props.globalState }, { children: [(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_optionsLineComponent__WEBPACK_IMPORTED_MODULE_7__.OptionsLineComponent, { label: "Debug mode", options: debugMode, target: material, propertyName: "debugMode" }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Split position", target: material, propertyName: "debugLimit", minimum: -1, maximum: 1, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable }), (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(shared_ui_components_lines_sliderLineComponent__WEBPACK_IMPORTED_MODULE_6__.SliderLineComponent, { label: "Output factor", target: material, propertyName: "debugFactor", minimum: 0, maximum: 5, step: 0.01, onPropertyChangedObservable: this.props.onPropertyChangedObservable })] }))] })));
59611
59622
  }
59612
59623
  }
59613
59624