diff --git a/dist/css/ueb-style.css b/dist/css/ueb-style.css index d56fa44..9933e69 100644 --- a/dist/css/ueb-style.css +++ b/dist/css/ueb-style.css @@ -266,7 +266,7 @@ ueb-link svg path { } ueb-link[data-dragging=true] svg path, -ueb-link svg g:hover path { +ueb-link .ueb-link-area:hover path { stroke-width: calc(6px / var(--ueb-scale)); transition: stroke-width 0.8s; } diff --git a/dist/css/ueb-style.min.css b/dist/css/ueb-style.min.css index 01022f3..fbf800d 100644 --- a/dist/css/ueb-style.min.css +++ b/dist/css/ueb-style.min.css @@ -1 +1 @@ -@font-face{font-family:"Roboto";font-weight:lighter;src:url("../font/roboto-light.woff2") format("woff2"),url("../font/roboto-light.woff") format("woff")}@font-face{font-family:"Roboto";font-weight:normal;src:url("../font/roboto-regular.woff2") format("woff2"),url("../font/roboto-regular.woff") format("woff")}@font-face{font-family:"Roboto";font-weight:bold;src:url("../font/roboto-bold.woff2") format("woff2"),url("../font/roboto-bold.woff") format("woff")}ueb-blueprint{--ueb-scale: 1;--ueb-grid-actual-size: var(--ueb-grid-size);display:block;position:relative;font-family:Roboto,Noto,Oxygen,Ubuntu,"Open Sans","Helvetica Neue",sans-serif;font-size:var(--ueb-font-size);color:#fff;user-select:none}ueb-blueprint svg{overflow:visible}.ueb-viewport-header{display:flex;position:absolute;top:0;right:0;left:0;height:1.5em;background:rgba(0,0,0,.5);z-index:1}.ueb-viewport-zoom{margin-left:auto;color:rgba(77,77,77,.7176470588);font-size:20px}.ueb-viewport-body{position:relative;height:var(--ueb-height, 30rem);overflow:hidden;scrollbar-width:0}ueb-blueprint[data-focused=true] .ueb-viewport-body{overflow:scroll}.ueb-grid{--ueb-grid-line-actual-width: calc(var(--ueb-grid-line-width) / var(--ueb-scale));position:absolute;min-width:100%;min-height:100%;width:calc((100% + 2*var(--ueb-grid-expand))/var(--ueb-scale));height:calc((100% + 2*var(--ueb-grid-expand))/var(--ueb-scale));background-color:#262626;background-image:linear-gradient(var(--ueb-grid-axis-line-color), var(--ueb-grid-axis-line-color)),linear-gradient(var(--ueb-grid-axis-line-color), var(--ueb-grid-axis-line-color)),linear-gradient(to right, var(--ueb-grid-set-line-color), var(--ueb-grid-set-line-color) var(--ueb-grid-line-actual-width), transparent var(--ueb-grid-line-actual-width), transparent),linear-gradient(to bottom, var(--ueb-grid-set-line-color), var(--ueb-grid-set-line-color) var(--ueb-grid-line-actual-width), transparent var(--ueb-grid-line-actual-width), transparent),linear-gradient(to right, var(--ueb-grid-line-color), var(--ueb-grid-line-color) var(--ueb-grid-line-actual-width), transparent var(--ueb-grid-line-actual-width), transparent),linear-gradient(to bottom, var(--ueb-grid-line-color), var(--ueb-grid-line-color) var(--ueb-grid-line-actual-width), transparent var(--ueb-grid-line-actual-width), transparent);background-size:100% var(--ueb-grid-line-actual-width),var(--ueb-grid-line-actual-width) 100%,calc(var(--ueb-grid-set)*var(--ueb-grid-actual-size)) calc(var(--ueb-grid-set)*var(--ueb-grid-actual-size)),calc(var(--ueb-grid-set)*var(--ueb-grid-actual-size)) calc(var(--ueb-grid-set)*var(--ueb-grid-actual-size)),var(--ueb-grid-actual-size) var(--ueb-grid-actual-size),var(--ueb-grid-actual-size) var(--ueb-grid-actual-size);background-position:calc(var(--ueb-translate-x)*1px) calc(var(--ueb-translate-y)*1px);background-repeat:repeat-x,repeat-y,repeat,repeat,repeat,repeat;transform:scale(var(--ueb-scale), var(--ueb-scale));transform-origin:0 0;overflow:hidden}ueb-blueprint[data-scrolling=true] .ueb-grid{cursor:grabbing}ueb-blueprint[data-scrolling=false] .ueb-grid{cursor:default}ueb-blueprint[data-zoom="7"]{--ueb-scale: 2}ueb-blueprint[data-zoom="6"]{--ueb-scale: 1.875}ueb-blueprint[data-zoom="5"]{--ueb-scale: 1.75}ueb-blueprint[data-zoom="4"]{--ueb-scale: 1.675}ueb-blueprint[data-zoom="3"]{--ueb-scale: 1.5}ueb-blueprint[data-zoom="2"]{--ueb-scale: 1.375}ueb-blueprint[data-zoom="1"]{--ueb-scale: 1.25}ueb-blueprint[data-zoom="-1"]{--ueb-scale: 0.875}ueb-blueprint[data-zoom="-2"]{--ueb-scale: 0.75}ueb-blueprint[data-zoom="-3"]{--ueb-scale: 0.675}ueb-blueprint[data-zoom="-4"]{--ueb-scale: 0.5;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 2)}ueb-blueprint.ueb-zoom--4{--ueb-node-radius: 0 !important}ueb-blueprint[data-zoom="-5"]{--ueb-scale: 0.375;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 2)}ueb-blueprint[data-zoom="-6"]{--ueb-scale: 0.333333;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 3)}ueb-blueprint[data-zoom="-7"]{--ueb-scale: 0.3;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 3)}ueb-blueprint[data-zoom="-8"]{--ueb-scale: 0.266666;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 3)}ueb-blueprint[data-zoom="-9"]{--ueb-scale: 0.233333;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 3)}ueb-blueprint[data-zoom="-10"]{--ueb-scale: 0.2;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 3)}ueb-blueprint[data-zoom="-11"]{--ueb-scale: 0.166666;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 6)}ueb-blueprint[data-zoom="-12"]{--ueb-scale: 0.133333;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 6)}.ueb-grid-content{position:relative;width:0;height:0;transform:translateX(calc(var(--ueb-translate-x) * 1px)) translateY(calc(var(--ueb-translate-y) * 1px))}.ueb-grid-content>div{width:0;height:0}.ueb-positioned,ueb-link,ueb-blueprint[data-selecting=true] ueb-selector{position:absolute}ueb-selector{display:block;position:absolute;visibility:hidden;top:0;left:0;width:0;height:0;background-image:repeating-linear-gradient(90deg, transparent, transparent calc(1px / var(--ueb-scale)), white calc(2px / var(--ueb-scale)), white calc(7px / var(--ueb-scale)), transparent calc(7px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale))),repeating-linear-gradient(90deg, black, black calc(8px / var(--ueb-scale)), transparent calc(9px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale))),repeating-linear-gradient(90deg, transparent, transparent calc(1px / var(--ueb-scale)), white calc(2px / var(--ueb-scale)), white calc(7px / var(--ueb-scale)), transparent calc(7px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale))),repeating-linear-gradient(90deg, black, black calc(8px / var(--ueb-scale)), transparent calc(9px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale))),repeating-linear-gradient(180deg, transparent, transparent calc(1px / var(--ueb-scale)), white calc(1px / var(--ueb-scale)), white calc(7px / var(--ueb-scale)), transparent calc(7px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale))),repeating-linear-gradient(180deg, black, black calc(8px / var(--ueb-scale)), transparent calc(9px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale))),repeating-linear-gradient(0deg, transparent, transparent calc(1px / var(--ueb-scale)), white calc(2px / var(--ueb-scale)), white calc(7px / var(--ueb-scale)), transparent calc(7px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale))),repeating-linear-gradient(0deg, black, black calc(8px / var(--ueb-scale)), transparent calc(9px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale)));background-size:100% calc(1px/var(--ueb-scale)),100% calc(3px/var(--ueb-scale)),100% calc(1px/var(--ueb-scale)),100% calc(3px/var(--ueb-scale)),calc(1px/var(--ueb-scale)) 100%,calc(3px/var(--ueb-scale)) 100%,calc(1px/var(--ueb-scale)) 100%,calc(3px/var(--ueb-scale)) 100%;background-position:0 calc(1px/var(--ueb-scale)),0 0,0 calc(100% - 1px/var(--ueb-scale)),0 100%,calc(1px/var(--ueb-scale)) 0,0 0,calc(100% - 1px/var(--ueb-scale)) 0,100% 0;background-repeat:no-repeat}ueb-blueprint[data-selecting=true] ueb-selector{visibility:visible}ueb-selector>*{visibility:visible}.ueb-ellipsis-nowrap-text{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}ueb-node[data-type="/Script/BlueprintGraph.K2Node_Knot"]{box-shadow:none}ueb-node[data-type="/Script/BlueprintGraph.K2Node_Knot"] ueb-pin{min-height:0}ueb-node[data-type="/Script/BlueprintGraph.K2Node_Knot"] ueb-pin[data-direction=input]{display:none}ueb-node[data-type="/Script/BlueprintGraph.K2Node_Knot"] .ueb-node-border{padding:8px 18px;background:none !important}ueb-node[data-type="/Script/BlueprintGraph.K2Node_Knot"][data-selected=true] .ueb-node-border{box-shadow:inset 0 0 0px 6px #d29e07}ueb-link{--ueb-link-color: rgb(var(--ueb-link-color-rgb));--ueb-from-input-coefficient: calc(2 * var(--ueb-from-input) - 1);--ueb-y-reflected: clamp(0, var(--ueb-from-y) - var(--ueb-to-y) - 1, 1);display:block;margin-left:calc(var(--ueb-link-start)*-1px);min-width:calc(var(--ueb-link-min-width)*1px);visibility:hidden}ueb-link svg{--ueb-y-reflected-coefficient: calc(2 * var(--ueb-y-reflected) - 1);position:absolute;width:100%;height:100%;min-height:1px;transform:scaleY(calc(var(--ueb-y-reflected-coefficient) * var(--ueb-from-input-coefficient)))}ueb-link svg path{visibility:visible;stroke:var(--ueb-link-color);stroke-width:calc(3px/var(--ueb-scale))}ueb-link[data-dragging=true] svg path,ueb-link svg g:hover path{stroke-width:calc(6px/var(--ueb-scale));transition:stroke-width .8s}.ueb-link-message{display:block;visibility:visible;position:absolute;top:calc(100%*(1 - var(--ueb-y-reflected)) + 22px);left:calc((1 - var(--ueb-from-input))*100% + (var(--ueb-from-input-coefficient))*var(--ueb-start-percentage) + 15px);border:1px solid #000;padding:4px 8px;border-radius:2px;background:linear-gradient(to bottom, #2a2a2a 0, #151515 50%, #2a2a2a 100%);color:var(--ueb-pin-dim-color);white-space:nowrap;z-index:1000000}ueb-node{display:block;position:absolute;border-radius:var(--ueb-node-radius);box-shadow:0 0 1px 0 #000,1px 4px 6px 0 rgba(0,0,0,.3);font-weight:lighter}.ueb-zoom--2 ueb-node{box-shadow:none}ueb-blueprint[data-scrolling=false][data-selecting=false] ueb-node{cursor:move}.ueb-node-border{margin:-3px;padding:3px;border-radius:calc(var(--ueb-node-radius)*1.4)}.ueb-zoom--2 .ueb-node-border{margin:0;padding:0}ueb-node[data-selected=true]>.ueb-node-border{background-image:linear-gradient(to right, #f1b000 0%, #f1b000 100%),linear-gradient(to bottom, #f1b000 0%, #cc6700 100%),linear-gradient(to right, #cc6700 0%, #cc6700 100%),linear-gradient(to bottom, #f1b000 0%, #cc6700 100%);background-size:100% 7px,7px 100%,100% 7px,7px 100%;background-position:top,right,bottom,left;background-repeat:repeat-x,repeat-y,repeat-x,repeat-y}.ueb-zoom--2 ueb-node[data-selected=true]>.ueb-node-border{background:none !important;outline:3px solid #ff8d00}.ueb-zoom--10 ueb-node[data-selected=true]>.ueb-node-border{outline-width:8px}.ueb-node-wrapper{position:relative;padding:1px;box-shadow:inset 0 0 2px 0 #000;border-radius:var(--ueb-node-radius);background:rgba(10,10,10,.8);overflow:hidden}.ueb-zoom--2 .ueb-node-wrapper{box-shadow:none;padding:0;background:#101010}.ueb-node-top{padding:.2em .7em;box-shadow:inset 5px 1px 5px -3px #7ba1b3,inset 0 1px 0 0 #111213,inset 0 2px 0 0 #7b9eb3;border-radius:var(--ueb-node-radius) var(--ueb-node-radius) 0 0;background:linear-gradient(170deg, #5ca1dd 0%, #466980 50%, transparent 100%);color:silver;font-weight:900;white-space:nowrap}.ueb-zoom--2 .ueb-node-top{box-shadow:none;background:#345469}.ueb-zoom--2 ueb-node[data-pure-function=true] .ueb-node-top{background:#5f815a}ueb-node[data-pure-function=true] .ueb-node-top{background:linear-gradient(170deg, #5f815a 0%, #5f815a 50%, transparent 100%)}.ueb-node-name{background:radial-gradient(ellipse 100% 100% at 35% 50%, rgba(0, 0, 0, 0.35) 20%, transparent 50%);margin:-0.1em -1.6em;padding:.1em 1.6em}.ueb-zoom--2 .ueb-node-name{background:none}.ueb-zoom--8 .ueb-node-name{visibility:hidden}.ueb-node-name-symbol{color:#74bff2}.ueb-node-name-symbol svg{vertical-align:middle}ueb-node[data-pure-function=true] .ueb-node-name-symbol{color:#aaeda0}.ueb-node-name-symbol path{vertical-align:middle}.ueb-node-name-text{vertical-align:baseline}.ueb-node-content{display:flex;padding:1px 0;font-weight:100;white-space:nowrap}.ueb-node-inputs{margin-right:20px;padding-left:8px}.ueb-node-outputs{margin-left:auto;padding-right:8px}.ueb-node-developmentonly{display:none;margin-top:4px;padding:2px;background:repeating-linear-gradient(-45deg, transparent 0, #57590a 1px, #57590a 11px, transparent 12px, transparent 24px);background:repeating-linear-gradient(-45deg, transparent 0, #57590a 1px, #57590a 11px, transparent 12px, transparent 24px);text-align:center}.ueb-node-developmentonly-text{letter-spacing:.04em;text-shadow:1px 1px 1px #000}.ueb-zoom--6 .ueb-node-developmentonly-text{visibility:hidden}ueb-node[data-enabled-state=DevelopmentOnly] .ueb-node-developmentonly{display:block}.ueb-node-expansion{display:none;text-align:center}.ueb-zoom--8 .ueb-node-expansion{visibility:hidden}.ueb-node-expansion-icon{vertical-align:middle}ueb-blueprint[data-scrolling=false][data-selecting=false] .ueb-node-expansion:hover{background-color:#656765;cursor:pointer}ueb-node[data-advanced-display] .ueb-node-expansion{display:block}ueb-node[data-advanced-display=Shown] .ueb-node-expansion-icon{transform:scaleY(-1)}ueb-blueprint{--ueb-pin-color-dim: #afafaf}ueb-pin{--ueb-pin-background: linear-gradient(90deg, rgba(var(--ueb-pin-color-rgb), 0.15), rgba(var(--ueb-pin-color-rgb), 0.8) 15%, rgba(var(--ueb-pin-color-rgb), 0.5) 60%, rgba(var(--ueb-pin-color-rgb), 0.35) 95%, transparent);--ueb-pin-color: rgb(var(--ueb-pin-color-rgb))}ueb-pin{display:block;min-height:30px}.ueb-zoom--10 ueb-pin{visibility:hidden}ueb-node[data-advanced-display=Hidden] ueb-pin[data-advanced-view=true]{display:none}.ueb-pin-wrapper{display:inline-block;margin:4px 0 0 0;padding:2px 2px}.ueb-pin-wrapper>*{display:inline-block;vertical-align:middle}ueb-blueprint[data-scrolling=false][data-selecting=false] .ueb-pin-wrapper:hover{background:var(--ueb-pin-background);cursor:crosshair}.ueb-zoom--8 .ueb-pin-wrapper:hover{background:none !important}.ueb-node-outputs ueb-pin{text-align:right}ueb-pin[data-type=exec] .ueb-pin-icon-exec{--ueb-pin-color: white;width:15px;height:15px}.ueb-pin-icon{width:11px;height:11px;margin-right:.5em;color:var(--ueb-pin-color)}ueb-pin[data-linked=true] .ueb-pin-tofill{fill:currentColor}.ueb-pin-name{display:inline-block;vertical-align:middle}.ueb-zoom--6 .ueb-pin-content{visibility:hidden}.ueb-pin-input-wrapper{padding-left:8px}.ueb-pin-input{display:inline-block;vertical-align:middle;margin-left:3px;border:1px solid #a0a0a0;border-radius:3px;padding:0 3px 0 3px;color:#e0e0e0}.ueb-pin-input:hover,.ueb-pin-input:active,.ueb-pin-input:focus,.ueb-pin-input:focus-within{background:rgba(255,255,255,.2745098039);outline:none}ueb-pin[data-linked=true] .ueb-pin-input{display:none}ueb-pin[data-type=bool] .ueb-pin-input{appearance:none;padding:0;height:18px;width:18px;background-color:#0f0f0f;color:var(--ueb-pin-color)}ueb-pin[data-type=bool] .ueb-pin-input:checked{background-image:url('data:image/svg+xml,')}ueb-pin[data-type="/Script/CoreUObject.LinearColor"] .ueb-pin-input{padding:0;width:18px;height:18px;border-color:#505050;border-radius:0;background-color:var(--ueb-linear-color)}.ueb-pin-input-label~.ueb-pin-input{margin-left:0}.ueb-pin-input-label{vertical-align:middle;margin-left:3px;color:#777}.ueb-pin-input-content{display:block;outline:none;border:none;padding:0;min-width:10px;max-width:400px;max-height:16em;line-height:calc(1em + 1px);background:none;color:inherit;cursor:text;overflow:auto}.ueb-pin-input-content::-webkit-scrollbar{width:10px;height:10px}.ueb-pin-input-content::-webkit-scrollbar-thumb{background:#575757;border-radius:10px;margin:4px}.ueb-button{min-width:60px;border:1px solid #0f0f0f;padding:2px 10px;background:#383838;text-align:center;cursor:pointer}.ueb-button:hover{background:#575757}.ueb-buttons{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.ueb-vertical-slider>ueb-ui-slider{position:relative;padding-bottom:10px}.ueb-vertical-slider>ueb-ui-slider::before,.ueb-vertical-slider>ueb-ui-slider::after{content:"";display:block;position:absolute;width:0;height:0;border:5px solid rgba(0,0,0,0)}.ueb-vertical-slider>ueb-ui-slider::before{left:-4px;border-left-color:#e0e0e0}.ueb-vertical-slider>ueb-ui-slider::after{right:-4px;border-right-color:#e0e0e0}.ueb-horizontal-slider,.ueb-text-input{position:relative;border:1px solid #383838;border-radius:6px;background:#0f0f0f}.ueb-horizontal-slider{position:relative;padding:1px}.ueb-horizontal-slider:hover{cursor:ew-resize}ueb-window .ueb-pin-input-content{padding:1px 10px}.ueb-horizontal-slider>ueb-ui-slider{display:block;position:relative;height:20px;border-radius:5px;background:#383838}.ueb-horizontal-slider-text{position:absolute;padding:0 5px;line-height:20px;z-index:1}.ueb-toggle-control::before{content:"";display:inline-block;border-top:5px solid #e0e0e0;border-left:5px solid rgba(0,0,0,0);border-right:5px solid rgba(0,0,0,0);vertical-align:middle}.ueb-toggle-control:hover{cursor:pointer}ueb-window{display:block;position:absolute;border:2px solid #000;top:0;left:0;transform:translateX(calc(var(--ueb-position-x) * 1px)) translateY(calc(var(--ueb-position-y) * 1px));background:#242424;box-shadow:0 0 2px 0 rgba(0,0,0,.6274509804);z-index:1000}.ueb-window-top{display:flex;flex-direction:row;align-items:center;padding:4px 8px;height:30px;background:#1a1a1a}.ueb-window-content{padding:10px;border:1px solid #303030}.ueb-window-name{flex-grow:1;padding-left:28px;text-align:center}.ueb-window-close{padding:8px;height:12px;width:12px;cursor:pointer}.ueb-color-picker-theme,.ueb-color-picker-srgb{display:inline-block;vertical-align:middle}.ueb-color-picker-main{display:grid;grid-template:1fr/auto min-content min-content min-content}.ueb-color-picker-wheel{position:relative;padding-top:100%;min-width:200px;border-radius:100%;background:radial-gradient(white 5%, transparent 85%),conic-gradient(from 90deg, #FF0000 0deg, #FFFF00 60deg, #00FF00 120deg, #00FFFF 180deg, #0000FF 240deg, #FF00FF 300deg, #FF0000 360deg)}ueb-color-handler{display:block;position:absolute;margin-top:-3px;margin-left:-3px;width:4px;height:4px;border:1px solid #000;border-radius:4px}.ueb-color-picker-wheel ueb-color-handler{left:var(--ueb-color-wheel-x);top:var(--ueb-color-wheel-y)}.ueb-color-picker-saturation,.ueb-color-picker-value{margin:0 6px;padding-bottom:10px;width:25px}.ueb-color-picker-saturation{margin-left:25px;background-image:linear-gradient(to bottom, transparent 10px, #FFFFFF 100%)}.ueb-color-picker-value{margin-right:25px;background-image:linear-gradient(to bottom, transparent 10px, #000000 100%)}ueb-ui-slider{display:block}.ueb-color-picker-saturation ueb-ui-slider{top:calc(100% - var(--ueb-color-s)*100%)}.ueb-color-picker-value ueb-ui-slider{top:calc(100% - var(--ueb-color-v)*100%)}.ueb-color-picker-preview{position:relative;align-self:flex-start}.ueb-color-picker-preview::before,.ueb-color-picker-preview::after{content:"";display:block;position:absolute;top:calc(50% - 1px);width:5px;border-top:2px solid #000}.ueb-color-picker-preview::after{right:0}.ueb-color-picker-preview-old,.ueb-color-picker-preview-new{width:100px;height:40px}.ueb-color-picker-preview-new{display:flex}.ueb-color-picker-preview-1,.ueb-color-picker-preview-2{width:50%}.ueb-color-picker-advanced{display:flex;column-gap:10px;padding-top:5px}.ueb-color-picker-advanced .ueb-color-picker-column{display:flex;flex-direction:column;justify-content:space-between;flex-grow:1;width:50%}.ueb-color-picker-advanced .ueb-color-picker-column>div{display:flex;align-items:center;margin-bottom:8px}.ueb-color-picker-advanced .ueb-color-picker-column>div>div{flex-grow:1}.ueb-color-picker-advanced .ueb-horizontal-slider{flex-grow:1}.ueb-color-picker-r .ueb-horizontal-slider>ueb-ui-slider{width:calc(var(--ueb-color-r)*100%)}.ueb-color-picker-g .ueb-horizontal-slider>ueb-ui-slider{width:calc(var(--ueb-color-g)*100%)}.ueb-color-picker-b .ueb-horizontal-slider>ueb-ui-slider{width:calc(var(--ueb-color-b)*100%)}.ueb-color-picker-a .ueb-horizontal-slider>ueb-ui-slider{width:calc(var(--ueb-color-a)*100%)}.ueb-color-picker-h .ueb-horizontal-slider>ueb-ui-slider{width:calc(var(--ueb-color-h)*100%)}.ueb-color-picker-s .ueb-horizontal-slider>ueb-ui-slider{width:calc(var(--ueb-color-s)*100%)}.ueb-color-picker-v .ueb-horizontal-slider>ueb-ui-slider{width:calc(var(--ueb-color-v)*100%)}.ueb-color-picker-gradient{height:6px}.ueb-color-control{align-self:flex-end}.ueb-color-control-label{margin-right:5px;color:silver}.ueb-color-control .ueb-pin-input-content{width:8ch;line-height:20px;font-family:monospace;color:silver}/*# sourceMappingURL=ueb-style.min.css.map */ +@font-face{font-family:"Roboto";font-weight:lighter;src:url("../font/roboto-light.woff2") format("woff2"),url("../font/roboto-light.woff") format("woff")}@font-face{font-family:"Roboto";font-weight:normal;src:url("../font/roboto-regular.woff2") format("woff2"),url("../font/roboto-regular.woff") format("woff")}@font-face{font-family:"Roboto";font-weight:bold;src:url("../font/roboto-bold.woff2") format("woff2"),url("../font/roboto-bold.woff") format("woff")}ueb-blueprint{--ueb-scale: 1;--ueb-grid-actual-size: var(--ueb-grid-size);display:block;position:relative;font-family:Roboto,Noto,Oxygen,Ubuntu,"Open Sans","Helvetica Neue",sans-serif;font-size:var(--ueb-font-size);color:#fff;user-select:none}ueb-blueprint svg{overflow:visible}.ueb-viewport-header{display:flex;position:absolute;top:0;right:0;left:0;height:1.5em;background:rgba(0,0,0,.5);z-index:1}.ueb-viewport-zoom{margin-left:auto;color:rgba(77,77,77,.7176470588);font-size:20px}.ueb-viewport-body{position:relative;height:var(--ueb-height, 30rem);overflow:hidden;scrollbar-width:0}ueb-blueprint[data-focused=true] .ueb-viewport-body{overflow:scroll}.ueb-grid{--ueb-grid-line-actual-width: calc(var(--ueb-grid-line-width) / var(--ueb-scale));position:absolute;min-width:100%;min-height:100%;width:calc((100% + 2*var(--ueb-grid-expand))/var(--ueb-scale));height:calc((100% + 2*var(--ueb-grid-expand))/var(--ueb-scale));background-color:#262626;background-image:linear-gradient(var(--ueb-grid-axis-line-color), var(--ueb-grid-axis-line-color)),linear-gradient(var(--ueb-grid-axis-line-color), var(--ueb-grid-axis-line-color)),linear-gradient(to right, var(--ueb-grid-set-line-color), var(--ueb-grid-set-line-color) var(--ueb-grid-line-actual-width), transparent var(--ueb-grid-line-actual-width), transparent),linear-gradient(to bottom, var(--ueb-grid-set-line-color), var(--ueb-grid-set-line-color) var(--ueb-grid-line-actual-width), transparent var(--ueb-grid-line-actual-width), transparent),linear-gradient(to right, var(--ueb-grid-line-color), var(--ueb-grid-line-color) var(--ueb-grid-line-actual-width), transparent var(--ueb-grid-line-actual-width), transparent),linear-gradient(to bottom, var(--ueb-grid-line-color), var(--ueb-grid-line-color) var(--ueb-grid-line-actual-width), transparent var(--ueb-grid-line-actual-width), transparent);background-size:100% var(--ueb-grid-line-actual-width),var(--ueb-grid-line-actual-width) 100%,calc(var(--ueb-grid-set)*var(--ueb-grid-actual-size)) calc(var(--ueb-grid-set)*var(--ueb-grid-actual-size)),calc(var(--ueb-grid-set)*var(--ueb-grid-actual-size)) calc(var(--ueb-grid-set)*var(--ueb-grid-actual-size)),var(--ueb-grid-actual-size) var(--ueb-grid-actual-size),var(--ueb-grid-actual-size) var(--ueb-grid-actual-size);background-position:calc(var(--ueb-translate-x)*1px) calc(var(--ueb-translate-y)*1px);background-repeat:repeat-x,repeat-y,repeat,repeat,repeat,repeat;transform:scale(var(--ueb-scale), var(--ueb-scale));transform-origin:0 0;overflow:hidden}ueb-blueprint[data-scrolling=true] .ueb-grid{cursor:grabbing}ueb-blueprint[data-scrolling=false] .ueb-grid{cursor:default}ueb-blueprint[data-zoom="7"]{--ueb-scale: 2}ueb-blueprint[data-zoom="6"]{--ueb-scale: 1.875}ueb-blueprint[data-zoom="5"]{--ueb-scale: 1.75}ueb-blueprint[data-zoom="4"]{--ueb-scale: 1.675}ueb-blueprint[data-zoom="3"]{--ueb-scale: 1.5}ueb-blueprint[data-zoom="2"]{--ueb-scale: 1.375}ueb-blueprint[data-zoom="1"]{--ueb-scale: 1.25}ueb-blueprint[data-zoom="-1"]{--ueb-scale: 0.875}ueb-blueprint[data-zoom="-2"]{--ueb-scale: 0.75}ueb-blueprint[data-zoom="-3"]{--ueb-scale: 0.675}ueb-blueprint[data-zoom="-4"]{--ueb-scale: 0.5;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 2)}ueb-blueprint.ueb-zoom--4{--ueb-node-radius: 0 !important}ueb-blueprint[data-zoom="-5"]{--ueb-scale: 0.375;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 2)}ueb-blueprint[data-zoom="-6"]{--ueb-scale: 0.333333;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 3)}ueb-blueprint[data-zoom="-7"]{--ueb-scale: 0.3;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 3)}ueb-blueprint[data-zoom="-8"]{--ueb-scale: 0.266666;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 3)}ueb-blueprint[data-zoom="-9"]{--ueb-scale: 0.233333;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 3)}ueb-blueprint[data-zoom="-10"]{--ueb-scale: 0.2;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 3)}ueb-blueprint[data-zoom="-11"]{--ueb-scale: 0.166666;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 6)}ueb-blueprint[data-zoom="-12"]{--ueb-scale: 0.133333;--ueb-grid-actual-size: calc(var(--ueb-grid-size) * 6)}.ueb-grid-content{position:relative;width:0;height:0;transform:translateX(calc(var(--ueb-translate-x) * 1px)) translateY(calc(var(--ueb-translate-y) * 1px))}.ueb-grid-content>div{width:0;height:0}.ueb-positioned,ueb-link,ueb-blueprint[data-selecting=true] ueb-selector{position:absolute}ueb-selector{display:block;position:absolute;visibility:hidden;top:0;left:0;width:0;height:0;background-image:repeating-linear-gradient(90deg, transparent, transparent calc(1px / var(--ueb-scale)), white calc(2px / var(--ueb-scale)), white calc(7px / var(--ueb-scale)), transparent calc(7px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale))),repeating-linear-gradient(90deg, black, black calc(8px / var(--ueb-scale)), transparent calc(9px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale))),repeating-linear-gradient(90deg, transparent, transparent calc(1px / var(--ueb-scale)), white calc(2px / var(--ueb-scale)), white calc(7px / var(--ueb-scale)), transparent calc(7px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale))),repeating-linear-gradient(90deg, black, black calc(8px / var(--ueb-scale)), transparent calc(9px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale))),repeating-linear-gradient(180deg, transparent, transparent calc(1px / var(--ueb-scale)), white calc(1px / var(--ueb-scale)), white calc(7px / var(--ueb-scale)), transparent calc(7px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale))),repeating-linear-gradient(180deg, black, black calc(8px / var(--ueb-scale)), transparent calc(9px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale))),repeating-linear-gradient(0deg, transparent, transparent calc(1px / var(--ueb-scale)), white calc(2px / var(--ueb-scale)), white calc(7px / var(--ueb-scale)), transparent calc(7px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale))),repeating-linear-gradient(0deg, black, black calc(8px / var(--ueb-scale)), transparent calc(9px / var(--ueb-scale)), transparent calc(11px / var(--ueb-scale)));background-size:100% calc(1px/var(--ueb-scale)),100% calc(3px/var(--ueb-scale)),100% calc(1px/var(--ueb-scale)),100% calc(3px/var(--ueb-scale)),calc(1px/var(--ueb-scale)) 100%,calc(3px/var(--ueb-scale)) 100%,calc(1px/var(--ueb-scale)) 100%,calc(3px/var(--ueb-scale)) 100%;background-position:0 calc(1px/var(--ueb-scale)),0 0,0 calc(100% - 1px/var(--ueb-scale)),0 100%,calc(1px/var(--ueb-scale)) 0,0 0,calc(100% - 1px/var(--ueb-scale)) 0,100% 0;background-repeat:no-repeat}ueb-blueprint[data-selecting=true] ueb-selector{visibility:visible}ueb-selector>*{visibility:visible}.ueb-ellipsis-nowrap-text{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}ueb-node[data-type="/Script/BlueprintGraph.K2Node_Knot"]{box-shadow:none}ueb-node[data-type="/Script/BlueprintGraph.K2Node_Knot"] ueb-pin{min-height:0}ueb-node[data-type="/Script/BlueprintGraph.K2Node_Knot"] ueb-pin[data-direction=input]{display:none}ueb-node[data-type="/Script/BlueprintGraph.K2Node_Knot"] .ueb-node-border{padding:8px 18px;background:none !important}ueb-node[data-type="/Script/BlueprintGraph.K2Node_Knot"][data-selected=true] .ueb-node-border{box-shadow:inset 0 0 0px 6px #d29e07}ueb-link{--ueb-link-color: rgb(var(--ueb-link-color-rgb));--ueb-from-input-coefficient: calc(2 * var(--ueb-from-input) - 1);--ueb-y-reflected: clamp(0, var(--ueb-from-y) - var(--ueb-to-y) - 1, 1);display:block;margin-left:calc(var(--ueb-link-start)*-1px);min-width:calc(var(--ueb-link-min-width)*1px);visibility:hidden}ueb-link svg{--ueb-y-reflected-coefficient: calc(2 * var(--ueb-y-reflected) - 1);position:absolute;width:100%;height:100%;min-height:1px;transform:scaleY(calc(var(--ueb-y-reflected-coefficient) * var(--ueb-from-input-coefficient)))}ueb-link svg path{visibility:visible;stroke:var(--ueb-link-color);stroke-width:calc(3px/var(--ueb-scale))}ueb-link[data-dragging=true] svg path,ueb-link .ueb-link-area:hover path{stroke-width:calc(6px/var(--ueb-scale));transition:stroke-width .8s}.ueb-link-message{display:block;visibility:visible;position:absolute;top:calc(100%*(1 - var(--ueb-y-reflected)) + 22px);left:calc((1 - var(--ueb-from-input))*100% + (var(--ueb-from-input-coefficient))*var(--ueb-start-percentage) + 15px);border:1px solid #000;padding:4px 8px;border-radius:2px;background:linear-gradient(to bottom, #2a2a2a 0, #151515 50%, #2a2a2a 100%);color:var(--ueb-pin-dim-color);white-space:nowrap;z-index:1000000}ueb-node{display:block;position:absolute;border-radius:var(--ueb-node-radius);box-shadow:0 0 1px 0 #000,1px 4px 6px 0 rgba(0,0,0,.3);font-weight:lighter}.ueb-zoom--2 ueb-node{box-shadow:none}ueb-blueprint[data-scrolling=false][data-selecting=false] ueb-node{cursor:move}.ueb-node-border{margin:-3px;padding:3px;border-radius:calc(var(--ueb-node-radius)*1.4)}.ueb-zoom--2 .ueb-node-border{margin:0;padding:0}ueb-node[data-selected=true]>.ueb-node-border{background-image:linear-gradient(to right, #f1b000 0%, #f1b000 100%),linear-gradient(to bottom, #f1b000 0%, #cc6700 100%),linear-gradient(to right, #cc6700 0%, #cc6700 100%),linear-gradient(to bottom, #f1b000 0%, #cc6700 100%);background-size:100% 7px,7px 100%,100% 7px,7px 100%;background-position:top,right,bottom,left;background-repeat:repeat-x,repeat-y,repeat-x,repeat-y}.ueb-zoom--2 ueb-node[data-selected=true]>.ueb-node-border{background:none !important;outline:3px solid #ff8d00}.ueb-zoom--10 ueb-node[data-selected=true]>.ueb-node-border{outline-width:8px}.ueb-node-wrapper{position:relative;padding:1px;box-shadow:inset 0 0 2px 0 #000;border-radius:var(--ueb-node-radius);background:rgba(10,10,10,.8);overflow:hidden}.ueb-zoom--2 .ueb-node-wrapper{box-shadow:none;padding:0;background:#101010}.ueb-node-top{padding:.2em .7em;box-shadow:inset 5px 1px 5px -3px #7ba1b3,inset 0 1px 0 0 #111213,inset 0 2px 0 0 #7b9eb3;border-radius:var(--ueb-node-radius) var(--ueb-node-radius) 0 0;background:linear-gradient(170deg, #5ca1dd 0%, #466980 50%, transparent 100%);color:silver;font-weight:900;white-space:nowrap}.ueb-zoom--2 .ueb-node-top{box-shadow:none;background:#345469}.ueb-zoom--2 ueb-node[data-pure-function=true] .ueb-node-top{background:#5f815a}ueb-node[data-pure-function=true] .ueb-node-top{background:linear-gradient(170deg, #5f815a 0%, #5f815a 50%, transparent 100%)}.ueb-node-name{background:radial-gradient(ellipse 100% 100% at 35% 50%, rgba(0, 0, 0, 0.35) 20%, transparent 50%);margin:-0.1em -1.6em;padding:.1em 1.6em}.ueb-zoom--2 .ueb-node-name{background:none}.ueb-zoom--8 .ueb-node-name{visibility:hidden}.ueb-node-name-symbol{color:#74bff2}.ueb-node-name-symbol svg{vertical-align:middle}ueb-node[data-pure-function=true] .ueb-node-name-symbol{color:#aaeda0}.ueb-node-name-symbol path{vertical-align:middle}.ueb-node-name-text{vertical-align:baseline}.ueb-node-content{display:flex;padding:1px 0;font-weight:100;white-space:nowrap}.ueb-node-inputs{margin-right:20px;padding-left:8px}.ueb-node-outputs{margin-left:auto;padding-right:8px}.ueb-node-developmentonly{display:none;margin-top:4px;padding:2px;background:repeating-linear-gradient(-45deg, transparent 0, #57590a 1px, #57590a 11px, transparent 12px, transparent 24px);background:repeating-linear-gradient(-45deg, transparent 0, #57590a 1px, #57590a 11px, transparent 12px, transparent 24px);text-align:center}.ueb-node-developmentonly-text{letter-spacing:.04em;text-shadow:1px 1px 1px #000}.ueb-zoom--6 .ueb-node-developmentonly-text{visibility:hidden}ueb-node[data-enabled-state=DevelopmentOnly] .ueb-node-developmentonly{display:block}.ueb-node-expansion{display:none;text-align:center}.ueb-zoom--8 .ueb-node-expansion{visibility:hidden}.ueb-node-expansion-icon{vertical-align:middle}ueb-blueprint[data-scrolling=false][data-selecting=false] .ueb-node-expansion:hover{background-color:#656765;cursor:pointer}ueb-node[data-advanced-display] .ueb-node-expansion{display:block}ueb-node[data-advanced-display=Shown] .ueb-node-expansion-icon{transform:scaleY(-1)}ueb-blueprint{--ueb-pin-color-dim: #afafaf}ueb-pin{--ueb-pin-background: linear-gradient(90deg, rgba(var(--ueb-pin-color-rgb), 0.15), rgba(var(--ueb-pin-color-rgb), 0.8) 15%, rgba(var(--ueb-pin-color-rgb), 0.5) 60%, rgba(var(--ueb-pin-color-rgb), 0.35) 95%, transparent);--ueb-pin-color: rgb(var(--ueb-pin-color-rgb))}ueb-pin{display:block;min-height:30px}.ueb-zoom--10 ueb-pin{visibility:hidden}ueb-node[data-advanced-display=Hidden] ueb-pin[data-advanced-view=true]{display:none}.ueb-pin-wrapper{display:inline-block;margin:4px 0 0 0;padding:2px 2px}.ueb-pin-wrapper>*{display:inline-block;vertical-align:middle}ueb-blueprint[data-scrolling=false][data-selecting=false] .ueb-pin-wrapper:hover{background:var(--ueb-pin-background);cursor:crosshair}.ueb-zoom--8 .ueb-pin-wrapper:hover{background:none !important}.ueb-node-outputs ueb-pin{text-align:right}ueb-pin[data-type=exec] .ueb-pin-icon-exec{--ueb-pin-color: white;width:15px;height:15px}.ueb-pin-icon{width:11px;height:11px;margin-right:.5em;color:var(--ueb-pin-color)}ueb-pin[data-linked=true] .ueb-pin-tofill{fill:currentColor}.ueb-pin-name{display:inline-block;vertical-align:middle}.ueb-zoom--6 .ueb-pin-content{visibility:hidden}.ueb-pin-input-wrapper{padding-left:8px}.ueb-pin-input{display:inline-block;vertical-align:middle;margin-left:3px;border:1px solid #a0a0a0;border-radius:3px;padding:0 3px 0 3px;color:#e0e0e0}.ueb-pin-input:hover,.ueb-pin-input:active,.ueb-pin-input:focus,.ueb-pin-input:focus-within{background:rgba(255,255,255,.2745098039);outline:none}ueb-pin[data-linked=true] .ueb-pin-input{display:none}ueb-pin[data-type=bool] .ueb-pin-input{appearance:none;padding:0;height:18px;width:18px;background-color:#0f0f0f;color:var(--ueb-pin-color)}ueb-pin[data-type=bool] .ueb-pin-input:checked{background-image:url('data:image/svg+xml,')}ueb-pin[data-type="/Script/CoreUObject.LinearColor"] .ueb-pin-input{padding:0;width:18px;height:18px;border-color:#505050;border-radius:0;background-color:var(--ueb-linear-color)}.ueb-pin-input-label~.ueb-pin-input{margin-left:0}.ueb-pin-input-label{vertical-align:middle;margin-left:3px;color:#777}.ueb-pin-input-content{display:block;outline:none;border:none;padding:0;min-width:10px;max-width:400px;max-height:16em;line-height:calc(1em + 1px);background:none;color:inherit;cursor:text;overflow:auto}.ueb-pin-input-content::-webkit-scrollbar{width:10px;height:10px}.ueb-pin-input-content::-webkit-scrollbar-thumb{background:#575757;border-radius:10px;margin:4px}.ueb-button{min-width:60px;border:1px solid #0f0f0f;padding:2px 10px;background:#383838;text-align:center;cursor:pointer}.ueb-button:hover{background:#575757}.ueb-buttons{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}.ueb-vertical-slider>ueb-ui-slider{position:relative;padding-bottom:10px}.ueb-vertical-slider>ueb-ui-slider::before,.ueb-vertical-slider>ueb-ui-slider::after{content:"";display:block;position:absolute;width:0;height:0;border:5px solid rgba(0,0,0,0)}.ueb-vertical-slider>ueb-ui-slider::before{left:-4px;border-left-color:#e0e0e0}.ueb-vertical-slider>ueb-ui-slider::after{right:-4px;border-right-color:#e0e0e0}.ueb-horizontal-slider,.ueb-text-input{position:relative;border:1px solid #383838;border-radius:6px;background:#0f0f0f}.ueb-horizontal-slider{position:relative;padding:1px}.ueb-horizontal-slider:hover{cursor:ew-resize}ueb-window .ueb-pin-input-content{padding:1px 10px}.ueb-horizontal-slider>ueb-ui-slider{display:block;position:relative;height:20px;border-radius:5px;background:#383838}.ueb-horizontal-slider-text{position:absolute;padding:0 5px;line-height:20px;z-index:1}.ueb-toggle-control::before{content:"";display:inline-block;border-top:5px solid #e0e0e0;border-left:5px solid rgba(0,0,0,0);border-right:5px solid rgba(0,0,0,0);vertical-align:middle}.ueb-toggle-control:hover{cursor:pointer}ueb-window{display:block;position:absolute;border:2px solid #000;top:0;left:0;transform:translateX(calc(var(--ueb-position-x) * 1px)) translateY(calc(var(--ueb-position-y) * 1px));background:#242424;box-shadow:0 0 2px 0 rgba(0,0,0,.6274509804);z-index:1000}.ueb-window-top{display:flex;flex-direction:row;align-items:center;padding:4px 8px;height:30px;background:#1a1a1a}.ueb-window-content{padding:10px;border:1px solid #303030}.ueb-window-name{flex-grow:1;padding-left:28px;text-align:center}.ueb-window-close{padding:8px;height:12px;width:12px;cursor:pointer}.ueb-color-picker-theme,.ueb-color-picker-srgb{display:inline-block;vertical-align:middle}.ueb-color-picker-main{display:grid;grid-template:1fr/auto min-content min-content min-content}.ueb-color-picker-wheel{position:relative;padding-top:100%;min-width:200px;border-radius:100%;background:radial-gradient(white 5%, transparent 85%),conic-gradient(from 90deg, #FF0000 0deg, #FFFF00 60deg, #00FF00 120deg, #00FFFF 180deg, #0000FF 240deg, #FF00FF 300deg, #FF0000 360deg)}ueb-color-handler{display:block;position:absolute;margin-top:-3px;margin-left:-3px;width:4px;height:4px;border:1px solid #000;border-radius:4px}.ueb-color-picker-wheel ueb-color-handler{left:var(--ueb-color-wheel-x);top:var(--ueb-color-wheel-y)}.ueb-color-picker-saturation,.ueb-color-picker-value{margin:0 6px;padding-bottom:10px;width:25px}.ueb-color-picker-saturation{margin-left:25px;background-image:linear-gradient(to bottom, transparent 10px, #FFFFFF 100%)}.ueb-color-picker-value{margin-right:25px;background-image:linear-gradient(to bottom, transparent 10px, #000000 100%)}ueb-ui-slider{display:block}.ueb-color-picker-saturation ueb-ui-slider{top:calc(100% - var(--ueb-color-s)*100%)}.ueb-color-picker-value ueb-ui-slider{top:calc(100% - var(--ueb-color-v)*100%)}.ueb-color-picker-preview{position:relative;align-self:flex-start}.ueb-color-picker-preview::before,.ueb-color-picker-preview::after{content:"";display:block;position:absolute;top:calc(50% - 1px);width:5px;border-top:2px solid #000}.ueb-color-picker-preview::after{right:0}.ueb-color-picker-preview-old,.ueb-color-picker-preview-new{width:100px;height:40px}.ueb-color-picker-preview-new{display:flex}.ueb-color-picker-preview-1,.ueb-color-picker-preview-2{width:50%}.ueb-color-picker-advanced{display:flex;column-gap:10px;padding-top:5px}.ueb-color-picker-advanced .ueb-color-picker-column{display:flex;flex-direction:column;justify-content:space-between;flex-grow:1;width:50%}.ueb-color-picker-advanced .ueb-color-picker-column>div{display:flex;align-items:center;margin-bottom:8px}.ueb-color-picker-advanced .ueb-color-picker-column>div>div{flex-grow:1}.ueb-color-picker-advanced .ueb-horizontal-slider{flex-grow:1}.ueb-color-picker-r .ueb-horizontal-slider>ueb-ui-slider{width:calc(var(--ueb-color-r)*100%)}.ueb-color-picker-g .ueb-horizontal-slider>ueb-ui-slider{width:calc(var(--ueb-color-g)*100%)}.ueb-color-picker-b .ueb-horizontal-slider>ueb-ui-slider{width:calc(var(--ueb-color-b)*100%)}.ueb-color-picker-a .ueb-horizontal-slider>ueb-ui-slider{width:calc(var(--ueb-color-a)*100%)}.ueb-color-picker-h .ueb-horizontal-slider>ueb-ui-slider{width:calc(var(--ueb-color-h)*100%)}.ueb-color-picker-s .ueb-horizontal-slider>ueb-ui-slider{width:calc(var(--ueb-color-s)*100%)}.ueb-color-picker-v .ueb-horizontal-slider>ueb-ui-slider{width:calc(var(--ueb-color-v)*100%)}.ueb-color-picker-gradient{height:6px}.ueb-color-control{align-self:flex-end}.ueb-color-control-label{margin-right:5px;color:silver}.ueb-color-control .ueb-pin-input-content{width:8ch;line-height:20px;font-family:monospace;color:silver}/*# sourceMappingURL=ueb-style.min.css.map */ diff --git a/dist/css/ueb-style.min.css.map b/dist/css/ueb-style.min.css.map index f540737..b699787 100644 --- a/dist/css/ueb-style.min.css.map +++ b/dist/css/ueb-style.min.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../../scss/style.scss","../../scss/ueb-knot.scss","../../scss/ueb-link.scss","../../scss/ueb-node.scss","../../scss/ueb-pin.scss","../../scss/ueb-ui-controls.scss","../../scss/ueb-window.scss"],"names":[],"mappings":"AAAA,WACI,qBACA,oBACA,IACI,kGAIR,WACI,qBACA,mBACA,IACI,sGAIR,WACI,qBACA,iBACA,IACI,gGAIR,cACI,eACA,6CACA,cACA,kBACA,8EACA,+BACA,WACA,iBAGJ,kBACI,iBAGJ,qBACI,aACA,kBACA,MACA,QACA,OACA,aACA,0BACA,UAGJ,mBACI,iBACA,iCACA,eAGJ,mBACI,kBACA,gCACA,gBACA,kBAGJ,oDACI,gBAGJ,UACI,kFACA,kBACA,eACA,gBACA,+DACA,gEACA,yBACA,iBAEI,s3BA0BJ,gBAEI,sZAQJ,sFACA,gEACA,oDACA,qBACA,gBAGJ,6CACI,gBAGJ,8CACI,eAGJ,6BACI,eAGJ,6BACI,mBAGJ,6BACI,kBAGJ,6BACI,mBAGJ,6BACI,iBAGJ,6BACI,mBAGJ,6BACI,kBAGJ,8BACI,mBAGJ,8BACI,kBAGJ,8BACI,mBAGJ,8BACI,iBACA,uDAGJ,0BACI,gCAGJ,8BACI,mBACA,uDAGJ,8BACI,sBACA,uDAGJ,8BACI,iBACA,uDAGJ,8BACI,sBACA,uDAGJ,8BACI,sBACA,uDAGJ,+BACI,iBACA,uDAGJ,+BACI,sBACA,uDAGJ,+BACI,sBACA,uDAGJ,kBACI,kBACA,QACA,SACA,wGAGJ,sBACI,QACA,SAGJ,yEACI,kBAGJ,aACI,cACA,kBACA,kBACA,MACA,OACA,QACA,SACA,iBAEI,wlDAmDJ,gBAEI,gQAWJ,oBAEI,wJAOJ,4BAGJ,gDACI,mBAIJ,eACI,mBAGJ,0BACI,mBACA,uBACA,gBC3UJ,yDACI,gBAGJ,iEACI,aAGJ,uFACI,aAGJ,0EACI,iBACA,2BAGJ,8FACI,qCChBJ,SACI,iDACA,kEAEA,wEACA,cACA,6CACA,8CAKA,kBAIJ,aACI,oEACA,kBACA,WACA,YACA,eACA,+FAGJ,kBACI,mBACA,6BACA,wCAGJ,gEAEI,wCACA,4BAGJ,kBACI,cACA,mBACA,kBACA,mDACA,qHAOA,sBACA,gBACA,kBACA,4EACA,+BACA,mBACA,gBCzDJ,SACI,cACA,kBACA,qCACA,uDACA,oBAGJ,sBACI,gBAGJ,mEACI,YAGJ,iBACI,YACA,YACA,+CAGJ,8BACI,SACA,UAGJ,8CACI,iBACI,kNAIJ,oDACA,0CACA,sDAGJ,2DACI,2BACA,0BAGJ,4DACI,kBAGJ,kBACI,kBACA,YACA,gCACA,qCACA,6BACA,gBAGJ,+BACI,gBACA,UACA,mBAGJ,cACI,kBACA,WACI,+EAGJ,gEACA,8EACA,aACA,gBACA,mBAGJ,2BACI,gBACA,mBAGJ,6DACI,mBAGJ,gDACI,8EAIJ,eACI,mGACA,qBACA,mBAGJ,4BACI,gBAGJ,4BACI,kBAGJ,sBACI,cAGJ,0BACI,sBAGJ,wDACI,cAGJ,2BACI,sBAGJ,oBACI,wBAGJ,kBACI,aACA,cACA,gBACA,mBAGJ,iBACI,kBACA,iBAGJ,kBACI,iBACA,kBAGJ,0BACI,aACA,eACA,YACA,2HAMA,2HAMA,kBAGJ,+BACI,qBACA,6BAGJ,4CACI,kBAGJ,uEACI,cAGJ,oBACI,aACA,kBAGJ,iCACI,kBAGJ,yBACI,sBAGJ,oFACI,yBACA,eAGJ,oDACI,cAGJ,+DACI,qBCnMJ,cACI,6BAGJ,QACI,4NAMA,+CAGJ,QACI,cACA,gBAGJ,sBACI,kBAGJ,wEACI,aAGJ,iBACI,qBACA,iBACA,gBAEA,mBACI,qBACA,sBAIR,iFACI,qCACA,iBAGJ,oCACI,2BAGJ,0BACI,iBAGJ,2CACI,uBACA,WACA,YAGJ,cACI,WACA,YACA,kBACA,2BAGJ,0CACI,kBAGJ,cACI,qBACA,sBAGJ,8BACI,kBAGJ,uBACI,iBAGJ,eACI,qBACA,sBACA,gBACA,yBACA,kBACA,oBACA,cAEA,4FAII,yCACA,aAIR,yCACI,aAGJ,uCACI,gBACA,UACA,YACA,WACA,yBACA,2BAGJ,+CACI,6OAGJ,oEACI,UACA,WACA,YACA,qBACA,gBACA,yCAGJ,oCACI,cAGJ,qBACI,sBACA,gBACA,WAGJ,uBACI,cACA,aACA,YACA,UACA,eACA,gBACA,gBACA,4BACA,gBACA,cACA,YACA,cAEA,0CACI,WACA,YAGJ,gDACI,mBACA,mBACA,WC7JR,YACI,eACA,yBACA,iBACA,mBACA,kBACA,eAEA,kBACI,mBAIR,aACI,aACA,yBACA,SACA,gBAGJ,mCACI,kBACA,oBAEA,qFAEI,WACA,cACA,kBACA,QACA,SACA,+BAGJ,2CACI,UACA,0BAGJ,0CACI,WACA,2BAIR,uCAEI,kBACA,yBACA,kBACA,mBAGJ,uBACI,kBACA,YAEA,6BACI,iBAIR,kCACI,iBAGJ,qCACI,cACA,kBACA,YACA,kBACA,mBAGJ,4BACI,kBACA,cACA,iBACA,UAKA,4BACI,WACA,qBACA,6BACA,oCACA,qCACA,sBAGJ,0BACI,eC3FR,WACI,cACA,kBACA,sBACA,MACA,OACA,sGACA,mBACA,6CACA,aAGJ,gBACI,aACA,mBACA,mBACA,gBACA,YACA,mBAGJ,oBACI,aACA,yBAGJ,iBACI,YACA,kBACA,kBAGJ,kBACI,YACA,YACA,WACA,eAGJ,+CAEI,qBACA,sBAGJ,uBACI,aACA,2DAGJ,wBACI,kBACA,iBACA,gBACA,mBACA,WACI,mLAWR,kBACI,cACA,kBACA,gBACA,iBACA,UACA,WACA,sBACA,kBAGJ,0CACI,8BACA,6BAGJ,qDAEI,aACA,oBACA,WAGJ,6BACI,iBACA,4EAGJ,wBACI,kBACA,4EAGJ,cACI,cAGJ,2CACI,yCAGJ,sCACI,yCAGJ,0BACI,kBACA,sBAEA,mEAEI,WACA,cACA,kBACA,oBACA,UACA,0BAGJ,iCACI,QAIR,4DAEI,YACA,YAGJ,8BACI,aAGJ,wDAEI,UAGJ,2BACI,aACA,gBACA,gBAGJ,oDACI,aACA,sBACA,8BACA,YACA,UAGJ,wDACI,aACA,mBACA,kBAEA,4DACI,YAIR,kDACI,YAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,2BACI,WAGJ,mBACI,oBAGJ,yBACI,iBACA,aAGJ,0CACI,UACA,iBACA,sBACA","file":"ueb-style.min.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../../scss/style.scss","../../scss/ueb-knot.scss","../../scss/ueb-link.scss","../../scss/ueb-node.scss","../../scss/ueb-pin.scss","../../scss/ueb-ui-controls.scss","../../scss/ueb-window.scss"],"names":[],"mappings":"AAAA,WACI,qBACA,oBACA,IACI,kGAIR,WACI,qBACA,mBACA,IACI,sGAIR,WACI,qBACA,iBACA,IACI,gGAIR,cACI,eACA,6CACA,cACA,kBACA,8EACA,+BACA,WACA,iBAGJ,kBACI,iBAGJ,qBACI,aACA,kBACA,MACA,QACA,OACA,aACA,0BACA,UAGJ,mBACI,iBACA,iCACA,eAGJ,mBACI,kBACA,gCACA,gBACA,kBAGJ,oDACI,gBAGJ,UACI,kFACA,kBACA,eACA,gBACA,+DACA,gEACA,yBACA,iBAEI,s3BA0BJ,gBAEI,sZAQJ,sFACA,gEACA,oDACA,qBACA,gBAGJ,6CACI,gBAGJ,8CACI,eAGJ,6BACI,eAGJ,6BACI,mBAGJ,6BACI,kBAGJ,6BACI,mBAGJ,6BACI,iBAGJ,6BACI,mBAGJ,6BACI,kBAGJ,8BACI,mBAGJ,8BACI,kBAGJ,8BACI,mBAGJ,8BACI,iBACA,uDAGJ,0BACI,gCAGJ,8BACI,mBACA,uDAGJ,8BACI,sBACA,uDAGJ,8BACI,iBACA,uDAGJ,8BACI,sBACA,uDAGJ,8BACI,sBACA,uDAGJ,+BACI,iBACA,uDAGJ,+BACI,sBACA,uDAGJ,+BACI,sBACA,uDAGJ,kBACI,kBACA,QACA,SACA,wGAGJ,sBACI,QACA,SAGJ,yEACI,kBAGJ,aACI,cACA,kBACA,kBACA,MACA,OACA,QACA,SACA,iBAEI,wlDAmDJ,gBAEI,gQAWJ,oBAEI,wJAOJ,4BAGJ,gDACI,mBAIJ,eACI,mBAGJ,0BACI,mBACA,uBACA,gBC3UJ,yDACI,gBAGJ,iEACI,aAGJ,uFACI,aAGJ,0EACI,iBACA,2BAGJ,8FACI,qCChBJ,SACI,iDACA,kEAEA,wEACA,cACA,6CACA,8CAKA,kBAIJ,aACI,oEACA,kBACA,WACA,YACA,eACA,+FAGJ,kBACI,mBACA,6BACA,wCAGJ,yEAEI,wCACA,4BAGJ,kBACI,cACA,mBACA,kBACA,mDACA,qHAOA,sBACA,gBACA,kBACA,4EACA,+BACA,mBACA,gBCzDJ,SACI,cACA,kBACA,qCACA,uDACA,oBAGJ,sBACI,gBAGJ,mEACI,YAGJ,iBACI,YACA,YACA,+CAGJ,8BACI,SACA,UAGJ,8CACI,iBACI,kNAIJ,oDACA,0CACA,sDAGJ,2DACI,2BACA,0BAGJ,4DACI,kBAGJ,kBACI,kBACA,YACA,gCACA,qCACA,6BACA,gBAGJ,+BACI,gBACA,UACA,mBAGJ,cACI,kBACA,WACI,+EAGJ,gEACA,8EACA,aACA,gBACA,mBAGJ,2BACI,gBACA,mBAGJ,6DACI,mBAGJ,gDACI,8EAIJ,eACI,mGACA,qBACA,mBAGJ,4BACI,gBAGJ,4BACI,kBAGJ,sBACI,cAGJ,0BACI,sBAGJ,wDACI,cAGJ,2BACI,sBAGJ,oBACI,wBAGJ,kBACI,aACA,cACA,gBACA,mBAGJ,iBACI,kBACA,iBAGJ,kBACI,iBACA,kBAGJ,0BACI,aACA,eACA,YACA,2HAMA,2HAMA,kBAGJ,+BACI,qBACA,6BAGJ,4CACI,kBAGJ,uEACI,cAGJ,oBACI,aACA,kBAGJ,iCACI,kBAGJ,yBACI,sBAGJ,oFACI,yBACA,eAGJ,oDACI,cAGJ,+DACI,qBCnMJ,cACI,6BAGJ,QACI,4NAMA,+CAGJ,QACI,cACA,gBAGJ,sBACI,kBAGJ,wEACI,aAGJ,iBACI,qBACA,iBACA,gBAEA,mBACI,qBACA,sBAIR,iFACI,qCACA,iBAGJ,oCACI,2BAGJ,0BACI,iBAGJ,2CACI,uBACA,WACA,YAGJ,cACI,WACA,YACA,kBACA,2BAGJ,0CACI,kBAGJ,cACI,qBACA,sBAGJ,8BACI,kBAGJ,uBACI,iBAGJ,eACI,qBACA,sBACA,gBACA,yBACA,kBACA,oBACA,cAEA,4FAII,yCACA,aAIR,yCACI,aAGJ,uCACI,gBACA,UACA,YACA,WACA,yBACA,2BAGJ,+CACI,6OAGJ,oEACI,UACA,WACA,YACA,qBACA,gBACA,yCAGJ,oCACI,cAGJ,qBACI,sBACA,gBACA,WAGJ,uBACI,cACA,aACA,YACA,UACA,eACA,gBACA,gBACA,4BACA,gBACA,cACA,YACA,cAEA,0CACI,WACA,YAGJ,gDACI,mBACA,mBACA,WC7JR,YACI,eACA,yBACA,iBACA,mBACA,kBACA,eAEA,kBACI,mBAIR,aACI,aACA,yBACA,SACA,gBAGJ,mCACI,kBACA,oBAEA,qFAEI,WACA,cACA,kBACA,QACA,SACA,+BAGJ,2CACI,UACA,0BAGJ,0CACI,WACA,2BAIR,uCAEI,kBACA,yBACA,kBACA,mBAGJ,uBACI,kBACA,YAEA,6BACI,iBAIR,kCACI,iBAGJ,qCACI,cACA,kBACA,YACA,kBACA,mBAGJ,4BACI,kBACA,cACA,iBACA,UAKA,4BACI,WACA,qBACA,6BACA,oCACA,qCACA,sBAGJ,0BACI,eC3FR,WACI,cACA,kBACA,sBACA,MACA,OACA,sGACA,mBACA,6CACA,aAGJ,gBACI,aACA,mBACA,mBACA,gBACA,YACA,mBAGJ,oBACI,aACA,yBAGJ,iBACI,YACA,kBACA,kBAGJ,kBACI,YACA,YACA,WACA,eAGJ,+CAEI,qBACA,sBAGJ,uBACI,aACA,2DAGJ,wBACI,kBACA,iBACA,gBACA,mBACA,WACI,mLAWR,kBACI,cACA,kBACA,gBACA,iBACA,UACA,WACA,sBACA,kBAGJ,0CACI,8BACA,6BAGJ,qDAEI,aACA,oBACA,WAGJ,6BACI,iBACA,4EAGJ,wBACI,kBACA,4EAGJ,cACI,cAGJ,2CACI,yCAGJ,sCACI,yCAGJ,0BACI,kBACA,sBAEA,mEAEI,WACA,cACA,kBACA,oBACA,UACA,0BAGJ,iCACI,QAIR,4DAEI,YACA,YAGJ,8BACI,aAGJ,wDAEI,UAGJ,2BACI,aACA,gBACA,gBAGJ,oDACI,aACA,sBACA,8BACA,YACA,UAGJ,wDACI,aACA,mBACA,kBAEA,4DACI,YAIR,kDACI,YAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,yDACI,oCAGJ,2BACI,WAGJ,mBACI,oBAGJ,yBACI,iBACA,aAGJ,0CACI,UACA,iBACA,sBACA","file":"ueb-style.min.css"} \ No newline at end of file diff --git a/dist/ueblueprint.js b/dist/ueblueprint.js index fa84773..66d5a7f 100755 --- a/dist/ueblueprint.js +++ b/dist/ueblueprint.js @@ -887,7 +887,7 @@ class IEntity extends Observable { }; // @ts-expect-error const attributes = this.constructor.attributes; - if (values.constructor !== Object && Object.getOwnPropertyNames(attributes).length == 1) { + if (values.constructor !== Object && Object.getOwnPropertyNames(attributes).length === 1) { // Where there is just one attribute, option can be the value of that attribute values = { [Object.getOwnPropertyNames(attributes)[0]]: values @@ -905,6 +905,11 @@ class ObjectReferenceEntity extends IEntity { } constructor(options = {}) { + if (options.constructor !== Object) { + options = { + path: options + }; + } super(options); /** @type {String} */ this.type; /** @type {String} */ this.path; @@ -1371,7 +1376,7 @@ class PinEntity extends IEntity { PinId: GuidEntity, PinName: "", PinFriendlyName: new TypeInitialization(LocalizedTextEntity, false, null), - PinToolTip: "", + PinToolTip: new TypeInitialization(String, false, ""), Direction: new TypeInitialization(String, false, ""), PinType: { PinCategory: "", @@ -3032,212 +3037,265 @@ class MouseTracking extends IPointing { } /** - * @typedef {import("../template/ISelectableDraggableTemplate").default} ISelectableDraggableTemplate - * @typedef {import("../entity/IEntity").default} IEntity + * @typedef {new (...args) => IElement} ElementConstructor + * @typedef {import("./IElement").default} IElement */ -/** - * @template {IEntity} T - * @template {ISelectableDraggableTemplate} U - * @extends {IDraggableElement} - */ -class ISelectableDraggableElement extends IDraggableElement { +class ElementFactory { - static properties = { - ...super.properties, - selected: { - type: Boolean, - attribute: "data-selected", - reflect: true, - converter: Utility.booleanConverter, - }, + /** @type {Map} */ + static #elementConstructors = new Map() + + /** + * @param {String} tagName + * @param {ElementConstructor} entityConstructor + */ + static registerElement(tagName, entityConstructor) { + ElementFactory.#elementConstructors.set(tagName, entityConstructor); } - constructor(...args) { - // @ts-expect-error - super(...args); - this.selected = false; - this.listeningDrag = false; - let self = this; - this.dragHandler = e => self.addLocation(e.detail.value); - } - - connectedCallback() { - super.connectedCallback(); - this.setSelected(this.selected); - } - - disconnectedCallback() { - super.disconnectedCallback(); - this.blueprint.removeEventListener(Configuration.nodeDragGeneralEventName, this.dragHandler); - } - - setSelected(value = true) { - this.selected = value; - if (this.blueprint) { - if (this.selected) { - this.listeningDrag = true; - this.blueprint.addEventListener(Configuration.nodeDragGeneralEventName, this.dragHandler); - } else { - this.blueprint.removeEventListener(Configuration.nodeDragGeneralEventName, this.dragHandler); - this.listeningDrag = false; - } - } + /** + * @param {String} tagName + */ + static getConstructor(tagName) { + return ElementFactory.#elementConstructors.get(tagName) } } -/** - * @typedef {import("../../Blueprint").default} Blueprint - * @typedef {import("../../element/IDraggableElement").default} IDraggableElement - */ +/** @typedef {import("../../element/NodeElement").default} NodeElement */ -/** - * @template {IDraggableElement} T - * @extends {IMouseClickDrag} - */ -class MouseMoveDraggable extends IMouseClickDrag { +class Paste extends IInput { - clicked(location) { - if (this.options.repositionOnClick) { - this.target.setLocation(this.stepSize > 1 - ? Utility.snapToGrid(location, this.stepSize) - : location - ); - this.clickedOffset = [0, 0]; + static #serializer = new ObjectSerializer() + + /** @type {(e: ClipboardEvent) => void} */ + #pasteHandle + + constructor(target, blueprint, options = {}) { + options.listenOnFocus ??= true; + options.unlistenOnTextEdit ??= true; // No nodes paste if inside a text field, just text (default behavior) + super(target, blueprint, options); + let self = this; + this.#pasteHandle = e => self.pasted(e.clipboardData.getData("Text")); + } + + listenEvents() { + document.body.addEventListener("paste", this.#pasteHandle); + } + + unlistenEvents() { + document.body.removeEventListener("paste", this.#pasteHandle); + } + + pasted(value) { + let top = 0; + let left = 0; + let count = 0; + let nodes = Paste.#serializer.readMultiple(value).map(entity => { + /** @type {NodeElement} */ + // @ts-expect-error + let node = new (ElementFactory.getConstructor("ueb-node"))(entity); + top += node.locationY; + left += node.locationX; + ++count; + return node + }); + top /= count; + left /= count; + if (nodes.length > 0) { + this.blueprint.unselectAll(); } - } - - dragTo(location, offset) { - const targetLocation = [this.target.locationX, this.target.locationY]; - const [adjustedLocation, adjustedTargetLocation] = this.stepSize > 1 - ? [Utility.snapToGrid(location, this.stepSize), Utility.snapToGrid(targetLocation, this.stepSize)] - : [location, targetLocation]; - offset = [ - adjustedLocation[0] - this.mouseLocation[0], - adjustedLocation[1] - this.mouseLocation[1] - ]; - if (offset[0] == 0 && offset[1] == 0) { - return - } - // Make sure it snaps on the grid - offset[0] += adjustedTargetLocation[0] - this.target.locationX; - offset[1] += adjustedTargetLocation[1] - this.target.locationY; - this.dragAction(adjustedLocation, offset); - // Reassign the position of mouse - this.mouseLocation = adjustedLocation; - } - - dragAction(location, offset) { - this.target.setLocation([ - location[0] - this.clickedOffset[0], - location[1] - this.clickedOffset[1] - ]); + let mousePosition = this.blueprint.mousePosition; + nodes.forEach(node => { + const locationOffset = [ + mousePosition[0] - left, + mousePosition[1] - top, + ]; + node.addLocation(locationOffset); + node.snapToGrid(); + node.setSelected(true); + }); + this.blueprint.addGraphElement(...nodes); + return true } } -/** - * @typedef {import("../entity/IEntity").default} IEntity - * @typedef {import("../element/IDraggableElement").default} IDraggableElement - */ +class Select extends IMouseClickDrag { -/** - * @template {IDraggableElement} T - * @extends {ITemplate} - */ -class IDraggableTemplate extends ITemplate { - - getDraggableElement() { - return this.element + constructor(target, blueprint, options) { + super(target, blueprint, options); + this.selectorElement = this.blueprint.selectorElement; } - createDraggableObject() { - return new MouseMoveDraggable(this.element, this.element.blueprint, { - draggableElement: this.getDraggableElement(), - }) - } - - createInputObjects() { - return [ - ...super.createInputObjects(), - this.createDraggableObject(), - ] - } -} - -/** @typedef {import("../element/IDraggableElement").default} IDraggableElement */ - -/** - * @template {IDraggableElement} T - * @extends {IDraggableTemplate} - */ -class IDraggablePositionedTemplate extends IDraggableTemplate { - - /** @param {Map} changedProperties */ - update(changedProperties) { - super.update(changedProperties); - if (changedProperties.has("locationX")) { - this.element.style.left = `${this.element.locationX}px`; - } - if (changedProperties.has("locationY")) { - this.element.style.top = `${this.element.locationY}px`; - } - } -} - -/** - * @typedef {import("../../Blueprint").default} Blueprint - * @typedef {import("../../element/ISelectableDraggableElement").default} ISelectableDraggableElement - */ - -/** @extends {MouseMoveDraggable} */ -class MouseMoveNodes extends MouseMoveDraggable { - startDrag() { - if (!this.target.selected) { - this.blueprint.unselectAll(); - this.target.setSelected(true); - } + this.selectorElement.beginSelect(this.clickedPosition); } - dragAction(location, offset) { - this.target.dispatchDragEvent(offset); + dragTo(location, movement) { + this.selectorElement.selectTo(location); + } + + endDrag() { + if (this.started) { + this.selectorElement.endSelect(); + } } unclicked() { if (!this.started) { this.blueprint.unselectAll(); - this.target.setSelected(true); } } } -/** - * @typedef {import("../element/ISelectableDraggableElement").default} ISelectableDraggableElement - * @typedef {import("../input/mouse/MouseMoveDraggable").default} MouseMoveDraggable - */ +class Unfocus extends IInput { -/** - * @template {ISelectableDraggableElement} T - * @extends {IDraggablePositionedTemplate} - */ -class ISelectableDraggableTemplate extends IDraggablePositionedTemplate { + /** @type {(e: MouseEvent) => void} */ + #clickHandler - getDraggableElement() { - return this.element + constructor(target, blueprint, options = {}) { + options.listenOnFocus = true; + super(target, blueprint, options); + + let self = this; + this.#clickHandler = e => self.clickedSomewhere(/** @type {HTMLElement} */(e.target)); + if (this.blueprint.focus) { + document.addEventListener("click", this.#clickHandler); + } } - createDraggableObject() { - return /** @type {MouseMoveDraggable} */ (new MouseMoveNodes(this.element, this.element.blueprint, { - draggableElement: this.getDraggableElement(), - })) + /** @param {HTMLElement} target */ + clickedSomewhere(target) { + // If target is outside the blueprint grid + if (!target.closest("ueb-blueprint")) { + this.blueprint.setFocused(false); + } + } + + listenEvents() { + document.addEventListener("click", this.#clickHandler); + } + + unlistenEvents() { + document.removeEventListener("click", this.#clickHandler); + } +} + +/** + * @typedef {import("../Blueprint").default} Blueprint + * @typedef {import("../element/PinElement").default} PinElement + * @typedef {import("../element/SelectorElement").default} SelectorElement + * @typedef {import("../entity/PinReferenceEntity").default} PinReferenceEntity + */ + +/** @extends ITemplate */ +class BlueprintTemplate extends ITemplate { + + static styleVariables = { + "--ueb-font-size": `${Configuration.fontSize}`, + "--ueb-grid-axis-line-color": `${Configuration.gridAxisLineColor}`, + "--ueb-grid-expand": `${Configuration.expandGridSize}px`, + "--ueb-grid-line-color": `${Configuration.gridLineColor}`, + "--ueb-grid-line-width": `${Configuration.gridLineWidth}px`, + "--ueb-grid-set-line-color": `${Configuration.gridSetLineColor}`, + "--ueb-grid-set": `${Configuration.gridSet}`, + "--ueb-grid-size": `${Configuration.gridSize}px`, + "--ueb-link-min-width": `${Configuration.linkMinWidth}`, + "--ueb-node-radius": `${Configuration.nodeRadius}px`, + } + + /** @param {Blueprint} element */ + constructed(element) { + super.constructed(element); + this.element.style.cssText = Object.entries(BlueprintTemplate.styleVariables).map(([k, v]) => `${k}:${v};`).join(""); + } + + createInputObjects() { + return [ + ...super.createInputObjects(), + new Copy(this.element.getGridDOMElement(), this.element), + new Paste(this.element.getGridDOMElement(), this.element), + new KeyboardCanc(this.element.getGridDOMElement(), this.element), + new KeyboardSelectAll(this.element.getGridDOMElement(), this.element), + new Zoom(this.element.getGridDOMElement(), this.element), + new Select(this.element.getGridDOMElement(), this.element, { + clickButton: 0, + exitAnyButton: true, + moveEverywhere: true, + }), + new MouseScrollGraph(this.element.getGridDOMElement(), this.element, { + clickButton: 2, + exitAnyButton: false, + moveEverywhere: true, + }), + new Unfocus(this.element.getGridDOMElement(), this.element), + new MouseTracking(this.element.getGridDOMElement(), this.element), + new KeyboardEnableZoom(this.element.getGridDOMElement(), this.element), + ] + } + + render() { + return $` +
+
${this.element.zoom == 0 ? "1:1" : this.element.zoom}
+
+
+
+
+
+
+
+ +
+
+
+ ` } /** @param {Map} changedProperties */ firstUpdated(changedProperties) { super.firstUpdated(changedProperties); - if (this.element.selected && !this.element.listeningDrag) { - this.element.setSelected(true); + this.element.headerElement = /** @type {HTMLElement} */(this.element.querySelector('.ueb-viewport-header')); + this.element.overlayElement = /** @type {HTMLElement} */(this.element.querySelector('.ueb-viewport-overlay')); + this.element.viewportElement = /** @type {HTMLElement} */(this.element.querySelector('.ueb-viewport-body')); + this.element.selectorElement = /** @type {SelectorElement} */(this.element.querySelector('ueb-selector')); + this.element.gridElement = /** @type {HTMLElement} */(this.element.viewportElement.querySelector(".ueb-grid")); + this.element.linksContainerElement = /** @type {HTMLElement} */(this.element.querySelector("[data-links]")); + this.element.linksContainerElement.append(...this.element.getLinks()); + this.element.nodesContainerElement = /** @type {HTMLElement} */(this.element.querySelector("[data-nodes]")); + this.element.nodesContainerElement.append(...this.element.getNodes()); + this.element.viewportElement.scroll(Configuration.expandGridSize, Configuration.expandGridSize); + } + + + /** @param {Map} changedProperties */ + updated(changedProperties) { + super.updated(changedProperties); + if (changedProperties.has("scrollX") || changedProperties.has("scrollY")) { + this.element.viewportElement.scroll(this.element.scrollX, this.element.scrollY); } + if (changedProperties.has("zoom")) { + const previousZoom = changedProperties.get("zoom"); + const minZoom = Math.min(previousZoom, this.element.zoom); + const maxZoom = Math.max(previousZoom, this.element.zoom); + const classes = Utility.range(minZoom, maxZoom); + const getClassName = v => `ueb-zoom-${v}`; + if (previousZoom < this.element.zoom) { + this.element.classList.remove(...classes.filter(v => v < 0).map(getClassName)); + this.element.classList.add(...classes.filter(v => v > 0).map(getClassName)); + } else { + this.element.classList.remove(...classes.filter(v => v > 0).map(getClassName)); + this.element.classList.add(...classes.filter(v => v < 0).map(getClassName)); + } + } + } + + /** @param {PinReferenceEntity} pinReference */ + getPin(pinReference) { + return /** @type {PinElement} */(this.element.querySelector( + `ueb-node[data-name="${pinReference.objectName}"] ueb-pin[data-id="${pinReference.pinGuid}"]` + )) } } @@ -3337,8 +3395,85 @@ class IFromToPositionedTemplate extends ITemplate { } } +class KnotEntity extends ObjectEntity { + + constructor(options = {}) { + super(options); + this.Class = new ObjectReferenceEntity("/Script/BlueprintGraph.K2Node_Knot"); + this.Name = "K2Node_Knot"; + this.CustomProperties = [ + new PinEntity({ + PinName: "InputPin", + }), + new PinEntity({ + PinName: "OutputPin", + Direction: "EGPD_Output", + }) + ]; + } +} + +/** @typedef {import("../../Blueprint").default} Blueprint */ + +/** + * @template {HTMLElement} T + * @extends {IPointing} + */ +class MouseDbClick extends IPointing { + + static ignoreDbClick = + /** @param {Number[]} location */ + location => { } + + #mouseDbClickHandler = + /** @param {MouseEvent} e */ + e => { + if (!this.options.strictTarget || e.target === e.currentTarget) { + if (this.options.consumeEvent) { + e.stopImmediatePropagation(); // Captured, don't call anyone else + } + this.clickedPosition = this.locationFromEvent(e); + this.blueprint.mousePosition[0] = this.clickedPosition[0]; + this.blueprint.mousePosition[1] = this.clickedPosition[1]; + this.dbclicked(this.clickedPosition); + } + } + + #onDbClick + get onDbClick() { + return this.#onDbClick + } + set onDbClick(value) { + this.#onDbClick = value; + } + + clickedPosition = [0, 0] + + constructor(target, blueprint, options = {}, onDbClick = MouseDbClick.ignoreDbClick) { + options.consumeEvent ??= true; + options.strictTarget ??= false; + super(target, blueprint, options); + this.#onDbClick = onDbClick; + this.listenEvents(); + } + + listenEvents() { + this.target.addEventListener("dblclick", this.#mouseDbClickHandler); + } + + unlistenEvents() { + this.target.removeEventListener("dblclick", this.#mouseDbClickHandler); + } + + /* Subclasses will override the following method */ + dbclicked(location) { + this.onDbClick(location); + } +} + /** * @typedef {import("../element/LinkElement").default} LinkElement + * @typedef {import("../element/NodeElement").default} NodeElement * @typedef {import("../template/KnotNodeTemplate").default} KnotNodeTemplate */ @@ -3347,7 +3482,7 @@ class IFromToPositionedTemplate extends ITemplate { class LinkTemplate extends IFromToPositionedTemplate { /** - * Returns a function performing the inverse multiplication y = a / x + q. The value of a and q are calculated using + * Returns a function providing the inverse multiplication y = a / x + q. The value of a and q are calculated using * the derivative of that function y' = -a / x^2 at the point p (x = p[0] and y = p[1]). This means * y'(p[0]) = m => -a / p[0]^2 = m => a = -m * p[0]^2. Now, in order to determine q we can use the starting * function: p[1] = a / p[0] + q => q = p[1] - a / p[0] @@ -3362,11 +3497,9 @@ class LinkTemplate extends IFromToPositionedTemplate { } /** - * Returns a function performing a clamped line passing through two points. It is clamped after and before the - * points. It is easier explained with an example. - * b ______ - * / - * / + * Returns a function providing a clamped line passing through two points. It is clamped after and before the + * points. It is easier explained with the following ascii draw. + * b ______ * / * / * / @@ -3393,6 +3526,31 @@ class LinkTemplate extends IFromToPositionedTemplate { static c2Clamped = LinkTemplate.clampedLine([0, 100], [200, 30]) + #createKnot = + /** @param {Number[]} location */ + location => { + const knot = /** @type {NodeElement} */(new (ElementFactory.getConstructor("ueb-node"))(new KnotEntity())); + knot.setLocation(this.element.blueprint.snapToGrid(location)); + const link = new (ElementFactory.getConstructor("ueb-link"))( + /** @type {KnotNodeTemplate} */(knot.template).outputPin, + this.element.destinationPin + ); + this.element.destinationPin = /** @type {KnotNodeTemplate} */(knot.template).inputPin; + this.element.blueprint.addGraphElement(knot, link); + } + + createInputObjects() { + return [ + ...super.createInputObjects(), + new MouseDbClick( + this.element.querySelector(".ueb-link-area"), + this.element.blueprint, + undefined, + (location) => this.#createKnot(location) + ) + ] + } + /** * @param {Map} changedProperties */ @@ -3446,9 +3604,7 @@ class LinkTemplate extends IFromToPositionedTemplate { this.element.svgPathD = Configuration.linkRightSVGPath(this.element.startPercentage, c1, c2); } - /** - * @param {Map} changedProperties - */ + /** @param {Map} changedProperties */ update(changedProperties) { super.update(changedProperties); if (changedProperties.has("originatesFromInput")) { @@ -3464,19 +3620,19 @@ class LinkTemplate extends IFromToPositionedTemplate { } render() { - const uniqueId = "ueb-id-" + Math.floor(Math.random() * 1E12); + const uniqueId = `ueb-id-${Math.floor(Math.random() * 1E12)}`; return $` - + - + ${this.element.linkMessageIcon != "" || this.element.linkMessageText != "" ? $` -
- - ${this.element.linkMessageText} -
+
+ + ${this.element.linkMessageText} +
` : w} ` } @@ -3727,8 +3883,219 @@ class LinkElement extends IFromToPositionedElement { } } +/** + * @typedef {import("../template/ISelectableDraggableTemplate").default} ISelectableDraggableTemplate + * @typedef {import("../entity/IEntity").default} IEntity + */ + +/** + * @template {IEntity} T + * @template {ISelectableDraggableTemplate} U + * @extends {IDraggableElement} + */ +class ISelectableDraggableElement extends IDraggableElement { + + static properties = { + ...super.properties, + selected: { + type: Boolean, + attribute: "data-selected", + reflect: true, + converter: Utility.booleanConverter, + }, + } + + constructor(...args) { + // @ts-expect-error + super(...args); + this.selected = false; + this.listeningDrag = false; + let self = this; + this.dragHandler = e => self.addLocation(e.detail.value); + } + + connectedCallback() { + super.connectedCallback(); + this.setSelected(this.selected); + } + + disconnectedCallback() { + super.disconnectedCallback(); + this.blueprint.removeEventListener(Configuration.nodeDragGeneralEventName, this.dragHandler); + } + + setSelected(value = true) { + this.selected = value; + if (this.blueprint) { + if (this.selected) { + this.listeningDrag = true; + this.blueprint.addEventListener(Configuration.nodeDragGeneralEventName, this.dragHandler); + } else { + this.blueprint.removeEventListener(Configuration.nodeDragGeneralEventName, this.dragHandler); + this.listeningDrag = false; + } + } + } +} + +/** + * @typedef {import("../../Blueprint").default} Blueprint + * @typedef {import("../../element/IDraggableElement").default} IDraggableElement + */ + +/** + * @template {IDraggableElement} T + * @extends {IMouseClickDrag} + */ +class MouseMoveDraggable extends IMouseClickDrag { + + clicked(location) { + if (this.options.repositionOnClick) { + this.target.setLocation(this.stepSize > 1 + ? Utility.snapToGrid(location, this.stepSize) + : location + ); + this.clickedOffset = [0, 0]; + } + } + + dragTo(location, offset) { + const targetLocation = [this.target.locationX, this.target.locationY]; + const [adjustedLocation, adjustedTargetLocation] = this.stepSize > 1 + ? [Utility.snapToGrid(location, this.stepSize), Utility.snapToGrid(targetLocation, this.stepSize)] + : [location, targetLocation]; + offset = [ + adjustedLocation[0] - this.mouseLocation[0], + adjustedLocation[1] - this.mouseLocation[1] + ]; + if (offset[0] == 0 && offset[1] == 0) { + return + } + // Make sure it snaps on the grid + offset[0] += adjustedTargetLocation[0] - this.target.locationX; + offset[1] += adjustedTargetLocation[1] - this.target.locationY; + this.dragAction(adjustedLocation, offset); + // Reassign the position of mouse + this.mouseLocation = adjustedLocation; + } + + dragAction(location, offset) { + this.target.setLocation([ + location[0] - this.clickedOffset[0], + location[1] - this.clickedOffset[1] + ]); + } +} + +/** + * @typedef {import("../entity/IEntity").default} IEntity + * @typedef {import("../element/IDraggableElement").default} IDraggableElement + */ + +/** + * @template {IDraggableElement} T + * @extends {ITemplate} + */ +class IDraggableTemplate extends ITemplate { + + getDraggableElement() { + return this.element + } + + createDraggableObject() { + return new MouseMoveDraggable(this.element, this.element.blueprint, { + draggableElement: this.getDraggableElement(), + }) + } + + createInputObjects() { + return [ + ...super.createInputObjects(), + this.createDraggableObject(), + ] + } +} + +/** @typedef {import("../element/IDraggableElement").default} IDraggableElement */ + +/** + * @template {IDraggableElement} T + * @extends {IDraggableTemplate} + */ +class IDraggablePositionedTemplate extends IDraggableTemplate { + + /** @param {Map} changedProperties */ + update(changedProperties) { + super.update(changedProperties); + if (changedProperties.has("locationX")) { + this.element.style.left = `${this.element.locationX}px`; + } + if (changedProperties.has("locationY")) { + this.element.style.top = `${this.element.locationY}px`; + } + } +} + +/** + * @typedef {import("../../Blueprint").default} Blueprint + * @typedef {import("../../element/ISelectableDraggableElement").default} ISelectableDraggableElement + */ + +/** @extends {MouseMoveDraggable} */ +class MouseMoveNodes extends MouseMoveDraggable { + + startDrag() { + if (!this.target.selected) { + this.blueprint.unselectAll(); + this.target.setSelected(true); + } + } + + dragAction(location, offset) { + this.target.dispatchDragEvent(offset); + } + + unclicked() { + if (!this.started) { + this.blueprint.unselectAll(); + this.target.setSelected(true); + } + } +} + +/** + * @typedef {import("../element/ISelectableDraggableElement").default} ISelectableDraggableElement + * @typedef {import("../input/mouse/MouseMoveDraggable").default} MouseMoveDraggable + */ + +/** + * @template {ISelectableDraggableElement} T + * @extends {IDraggablePositionedTemplate} + */ +class ISelectableDraggableTemplate extends IDraggablePositionedTemplate { + + getDraggableElement() { + return this.element + } + + createDraggableObject() { + return /** @type {MouseMoveDraggable} */ (new MouseMoveNodes(this.element, this.element.blueprint, { + draggableElement: this.getDraggableElement(), + })) + } + + /** @param {Map} changedProperties */ + firstUpdated(changedProperties) { + super.firstUpdated(changedProperties); + if (this.element.selected && !this.element.listeningDrag) { + this.element.setSelected(true); + } + } +} + /** * @typedef {import("../../element/PinElement").default} PinElement + * @typedef {import("../../element/LinkElement").default} LinkElement * @typedef {import("../../template/KnotNodeTemplate").default} KnotNodeTemplate */ @@ -3794,7 +4161,9 @@ class MouseCreateLink extends IMouseClickDrag { if (this.target.nodeElement.getType() == Configuration.knotNodeTypeName) { this.#knotPin = this.target; } - this.link = new LinkElement(this.target, null); + /** @type {LinkElement} */ + // @ts-expect-error + this.link = new (ElementFactory.getConstructor("ueb-link"))(this.target, null); this.blueprint.linksContainerElement.prepend(this.link); this.link.setMessagePlaceNode(); this.#listenedPins = this.blueprint.querySelectorAll("ueb-pin"); @@ -3824,8 +4193,8 @@ class MouseCreateLink extends IMouseClickDrag { // Knot pin direction correction if (this.#knotPin.isInput() && otherPin.isInput() || this.#knotPin.isOutput() && otherPin.isOutput()) { const oppositePin = this.#knotPin.isInput() - ?/** @type {KnotNodeTemplate} */(this.#knotPin.nodeElement.template).outputPin - :/** @type {KnotNodeTemplate} */(this.#knotPin.nodeElement.template).inputPin; + ? /** @type {KnotNodeTemplate} */(this.#knotPin.nodeElement.template).outputPin + : /** @type {KnotNodeTemplate} */(this.#knotPin.nodeElement.template).inputPin; if (this.#knotPin === this.link.sourcePin) { this.link.sourcePin = oppositePin; } else { @@ -3868,7 +4237,7 @@ class PinTemplate extends ITemplate { /** @param {PinElement} element */ constructed(element) { super.constructed(element); - this.element.dataset.id = this.element.GetPinIdValue(); + this.element.dataset.id = this.element.getPinId().toString(); } connectedCallback() { @@ -3978,6 +4347,1287 @@ class KnotPinTemplate extends PinTemplate { } } +/** + * @typedef {import("../element/NodeElement").default} NodeElement + * @typedef {import("../element/PinElement").default} PinElement + */ + +/** @extends {ISelectableDraggableTemplate} */ +class KnotNodeTemplate extends ISelectableDraggableTemplate { + + /** @type {PinElement} */ + #inputPin + get inputPin() { + return this.#inputPin + } + + /** @type {PinElement} */ + #outputPin + get outputPin() { + return this.#outputPin + } + + render() { + return $` +
+ ` + } + + /** @param {Map} changedProperties */ + firstUpdated(changedProperties) { + super.firstUpdated(changedProperties); + const content = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-border")); + Promise.all(this.element.getPinElements().map(n => n.updateComplete)).then(() => this.element.dispatchReflowEvent()); + this.element.getPinElements().forEach(p => content.appendChild(p)); + } + + /** + * @param {NodeElement} node + * @returns {NodeListOf} + */ + getPinElements(node) { + return node.querySelectorAll("ueb-pin") + } + + createPinElements() { + const entities = this.element.getPinEntities().filter(v => !v.isHidden()); + const inputEntity = entities[entities[0].isInput() ? 0 : 1]; + const outputEntity = entities[entities[0].isOutput() ? 0 : 1]; + const pinElementConstructor = ElementFactory.getConstructor("ueb-pin"); + return [ + this.#inputPin = /** @type {PinElement} */(new pinElementConstructor( + inputEntity, + new KnotPinTemplate(), + this.element + )), + this.#outputPin = /** @type {PinElement} */(new pinElementConstructor( + outputEntity, + new KnotPinTemplate(), + this.element + )), + ] + } +} + +/** + * @typedef {import("../element/NodeElement").default} NodeElement + * @typedef {import("../element/PinElement").default} PinElement + */ + +/** @extends {ISelectableDraggableTemplate} */ +class NodeTemplate extends ISelectableDraggableTemplate { + + toggleAdvancedDisplayHandler = _ => { + this.element.toggleShowAdvancedPinDisplay(); + this.element.addNextUpdatedCallbacks(() => this.element.dispatchReflowEvent(), true); + } + + render() { + return $` +
+
+
+
+ + + + + + + ${this.element.nodeDisplayName} + +
+
+
+
+
+
+ ${this.element.enabledState?.toString() == "DevelopmentOnly" ? $` +
+ Development Only +
+ ` : w} + ${this.element.advancedPinDisplay ? $` +
+ + + +
+ ` : w} +
+
+ ` + } + + /** @param {Map} changedProperties */ + firstUpdated(changedProperties) { + super.firstUpdated(changedProperties); + const inputContainer = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-inputs")); + const outputContainer = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-outputs")); + Promise.all(this.element.getPinElements().map(n => n.updateComplete)).then(() => this.element.dispatchReflowEvent()); + this.element.getPinElements().forEach(p => { + if (p.isInput()) { + inputContainer.appendChild(p); + } else if (p.isOutput()) { + outputContainer.appendChild(p); + } + }); + this.element.nodeNameElement = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-name-text")); + } + + /** + * @param {NodeElement} node + * @returns {NodeListOf} + */ + getPinElements(node) { + return node.querySelectorAll("ueb-pin") + } + + createPinElements() { + return this.element.getPinEntities() + .filter(v => !v.isHidden()) + .map(v => /** @type {PinElement} */( + new (ElementFactory.getConstructor("ueb-pin"))(v, undefined, this.element) + )) + } +} + +/** @typedef {import("./IElement").default} IElement */ + +/** @extends {ISelectableDraggableElement} */ +class NodeElement extends ISelectableDraggableElement { + + static #typeTemplateMap = { + "/Script/BlueprintGraph.K2Node_Knot": KnotNodeTemplate, + } + + static properties = { + ...ISelectableDraggableElement.properties, + nodeClass: { + type: String, + attribute: "data-type", + reflect: true, + }, + name: { + type: String, + attribute: "data-name", + reflect: true, + }, + advancedPinDisplay: { + type: String, + attribute: "data-advanced-display", + converter: IdentifierEntity.attributeConverter, + reflect: true, + }, + enabledState: { + type: String, + attribute: "data-enabled-state", + reflect: true, + }, + nodeDisplayName: { + type: String, + attribute: false, + }, + pureFunction: { + type: Boolean, + converter: Utility.booleanConverter, + attribute: "data-pure-function", + reflect: true, + }, + } + static dragEventName = Configuration.nodeDragEventName + static dragGeneralEventName = Configuration.nodeDragGeneralEventName + + get blueprint() { + return super.blueprint + } + set blueprint(v) { + super.blueprint = v; + this.#pins.forEach(p => p.blueprint = v); + } + + /** @type {HTMLElement} */ + #nodeNameElement + get nodeNameElement() { + return this.#nodeNameElement + } + set nodeNameElement(value) { + this.#nodeNameElement = value; + } + + #pins + + /** + * @param {ObjectEntity} entity + * @param {NodeTemplate} template + */ + constructor(entity, template = undefined) { + super(entity, template ?? new (NodeElement.getTypeTemplate(entity))()); + this.#pins = this.template.createPinElements(); + this.nodeClass = this.entity.getClass(); + this.name = this.entity.getObjectName(); + this.advancedPinDisplay = this.entity.AdvancedPinDisplay?.toString(); + this.enabledState = this.entity.EnabledState; + this.nodeDisplayName = this.entity.getDisplayName(); + this.pureFunction = this.entity.bIsPureFunc; + this.dragLinkObjects = []; + super.setLocation([this.entity.NodePosX.value, this.entity.NodePosY.value]); + this.entity.subscribe("AdvancedPinDisplay", value => this.advancedPinDisplay = value); + this.entity.subscribe("Name", value => this.name = value); + } + + /** + * @param {ObjectEntity} nodeEntity + * @return {new () => NodeTemplate} + */ + static getTypeTemplate(nodeEntity) { + let result = NodeElement.#typeTemplateMap[nodeEntity.getClass()]; + return result ?? NodeTemplate + } + + /** @param {String} str */ + static fromSerializedObject(str) { + str = str.trim(); + let entity = SerializerFactory.getSerializer(ObjectEntity).deserialize(str); + // @ts-expect-error + return new NodeElement(entity) + } + + disconnectedCallback() { + super.disconnectedCallback(); + this.dispatchDeleteEvent(); + } + + getType() { + return this.entity.getClass() + } + + getNodeName() { + return this.entity.getObjectName() + } + + getNodeDisplayName() { + return this.entity.getDisplayName() + } + + /** @param {IElement[]} nodesWhitelist */ + sanitizeLinks(nodesWhitelist = []) { + this.getPinElements().forEach(pin => pin.sanitizeLinks(nodesWhitelist)); + } + + /** @param {String} name */ + rename(name) { + if (this.entity.Name == name) { + return false + } + for (let sourcePinElement of this.getPinElements()) { + for (let targetPinReference of sourcePinElement.getLinks()) { + this.blueprint.getPin(targetPinReference).redirectLink(sourcePinElement, new PinReferenceEntity({ + objectName: name, + pinGuid: sourcePinElement.entity.PinId, + })); + } + } + this.entity.Name = name; + } + + getPinElements() { + return this.#pins + } + + /** @returns {PinEntity[]} */ + getPinEntities() { + return this.entity.CustomProperties.filter(v => v instanceof PinEntity) + } + + setLocation(value = [0, 0]) { + let nodeConstructor = this.entity.NodePosX.constructor; + // @ts-expect-error + this.entity.NodePosX = new nodeConstructor(value[0]); + // @ts-expect-error + this.entity.NodePosY = new nodeConstructor(value[1]); + super.setLocation(value); + } + + dispatchDeleteEvent() { + let deleteEvent = new CustomEvent(Configuration.nodeDeleteEventName); + this.dispatchEvent(deleteEvent); + } + + dispatchReflowEvent() { + let reflowEvent = new CustomEvent(Configuration.nodeReflowEventName); + this.dispatchEvent(reflowEvent); + } + + setShowAdvancedPinDisplay(value) { + this.entity.AdvancedPinDisplay = new IdentifierEntity(value ? "Shown" : "Hidden"); + } + + toggleShowAdvancedPinDisplay() { + this.setShowAdvancedPinDisplay(this.entity.AdvancedPinDisplay?.toString() != "Shown"); + } +} + +class OrderedIndexArray { + + /** + * @param {(arrayElement: number) => number} comparisonValueSupplier + * @param {number} value + */ + constructor(comparisonValueSupplier = v => v, value = null) { + this.array = new Uint32Array(value); + this.comparisonValueSupplier = comparisonValueSupplier; + this.length = 0; + this.currentPosition = 0; + } + + /** @param {number} index */ + get(index) { + if (index >= 0 && index < this.length) { + return this.array[index] + } + return null + } + + getArray() { + return this.array + } + + /** @param {number} value */ + getPosition(value) { + let l = 0; + let r = this.length; + while (l < r) { + let m = Math.floor((l + r) / 2); + if (this.comparisonValueSupplier(this.array[m]) < value) { + l = m + 1; + } else { + r = m; + } + } + return l + } + + reserve(length) { + if (this.array.length < length) { + let newArray = new Uint32Array(length); + newArray.set(this.array); + this.array = newArray; + } + } + + /** @param {number} element */ + insert(element, comparisonValue = null) { + let position = this.getPosition(this.comparisonValueSupplier(element)); + if ( + position < this.currentPosition + || comparisonValue != null && position == this.currentPosition && this.comparisonValueSupplier(element) < comparisonValue) { + ++this.currentPosition; + } + this.shiftRight(position); + this.array[position] = element; + ++this.length; + return position + } + + /** @param {number} element */ + remove(element) { + let position = this.getPosition(this.comparisonValueSupplier(element)); + if (this.array[position] == element) { + this.removeAt(position); + } + } + + /** @param {number} position */ + removeAt(position) { + if (position < this.currentPosition) { + --this.currentPosition; + } + this.shiftLeft(position); + --this.length; + return position + } + + getNext() { + if (this.currentPosition >= 0 && this.currentPosition < this.length) { + return this.get(this.currentPosition) + } + return null + } + + getNextValue() { + if (this.currentPosition >= 0 && this.currentPosition < this.length) { + return this.comparisonValueSupplier(this.get(this.currentPosition)) + } else { + return Number.MAX_SAFE_INTEGER + } + } + + getPrev() { + if (this.currentPosition > 0) { + return this.get(this.currentPosition - 1) + } + return null + } + + getPrevValue() { + if (this.currentPosition > 0) { + return this.comparisonValueSupplier(this.get(this.currentPosition - 1)) + } else { + return Number.MIN_SAFE_INTEGER + } + } + + shiftLeft(leftLimit, steps = 1) { + this.array.set(this.array.subarray(leftLimit + steps), leftLimit); + } + + shiftRight(leftLimit, steps = 1) { + this.array.set(this.array.subarray(leftLimit, -steps), leftLimit + steps); + } +} + +/** + * @typedef {import("../Blueprint").BoundariesInfo} BoundariesInfo + * @typedef {{ + * primaryBoundary: Number, + * secondaryBoundary: Number, + * insertionPosition?: Number, + * rectangle: Number + * onSecondaryAxis: Boolean + * }} Metadata + * @typedef {any} Rectangle + */ +class FastSelectionModel { + + /** + * @param {Number[]} initialPosition + * @param {Rectangle[]} rectangles + * @param {(rect: Rectangle) => BoundariesInfo} boundariesFunc + * @param {(rect: Rectangle, selected: Boolean) => void} selectFunc + */ + constructor(initialPosition, rectangles, boundariesFunc, selectFunc) { + this.initialPosition = initialPosition; + this.finalPosition = initialPosition; + /** @type {Metadata[]} */ + this.metadata = new Array(rectangles.length); + this.primaryOrder = new OrderedIndexArray((element) => this.metadata[element].primaryBoundary); + this.secondaryOrder = new OrderedIndexArray((element) => this.metadata[element].secondaryBoundary); + this.selectFunc = selectFunc; + this.rectangles = rectangles; + this.primaryOrder.reserve(this.rectangles.length); + this.secondaryOrder.reserve(this.rectangles.length); + rectangles.forEach((rect, index) => { + /** @type {Metadata} */ + let rectangleMetadata = { + primaryBoundary: this.initialPosition[0], + secondaryBoundary: this.initialPosition[1], + rectangle: index, // used to move both expandings inside the this.metadata array + onSecondaryAxis: false + }; + this.metadata[index] = rectangleMetadata; + selectFunc(rect, false); // Initially deselected (Eventually) + const rectangleBoundaries = boundariesFunc(rect); + + // Secondary axis first because it may be inserted in this.secondaryOrder during the primary axis check + if (this.initialPosition[1] < rectangleBoundaries.secondaryInf) { // Initial position is before the rectangle + rectangleMetadata.secondaryBoundary = rectangleBoundaries.secondaryInf; + } else if (rectangleBoundaries.secondarySup < this.initialPosition[1]) { // Initial position is after the rectangle + rectangleMetadata.secondaryBoundary = rectangleBoundaries.secondarySup; + } else { + rectangleMetadata.onSecondaryAxis = true; + } + + if (this.initialPosition[0] < rectangleBoundaries.primaryInf) { // Initial position is before the rectangle + rectangleMetadata.primaryBoundary = rectangleBoundaries.primaryInf; + this.primaryOrder.insert(index); + } else if (rectangleBoundaries.primarySup < this.initialPosition[0]) { // Initial position is after the rectangle + rectangleMetadata.primaryBoundary = rectangleBoundaries.primarySup; + this.primaryOrder.insert(index); + } else { // Initial lays inside the rectangle (considering just this axis) + // Secondary order depends on primary order, if primary boundaries are not satisfied, the element is not watched for secondary ones + if (rectangleBoundaries.secondarySup < this.initialPosition[1] || this.initialPosition[1] < rectangleBoundaries.secondaryInf) { + this.secondaryOrder.insert(index); + } else { + selectFunc(rect, true); + } + } + }); + this.primaryOrder.currentPosition = this.primaryOrder.getPosition(this.initialPosition[0]); + this.secondaryOrder.currentPosition = this.secondaryOrder.getPosition(this.initialPosition[1]); + this.computeBoundaries(); + } + + computeBoundaries() { + this.boundaries = { + // Primary axis negative expanding + primaryN: { + v: this.primaryOrder.getPrevValue(), + i: this.primaryOrder.getPrev() + }, + primaryP: { + v: this.primaryOrder.getNextValue(), + i: this.primaryOrder.getNext() + }, + // Secondary axis negative expanding + secondaryN: { + v: this.secondaryOrder.getPrevValue(), + i: this.secondaryOrder.getPrev() + }, + // Secondary axis positive expanding + secondaryP: { + v: this.secondaryOrder.getNextValue(), + i: this.secondaryOrder.getNext() + } + }; + } + + selectTo(finalPosition) { + const direction = [ + Math.sign(finalPosition[0] - this.initialPosition[0]), + Math.sign(finalPosition[1] - this.initialPosition[1]) + ]; + const primaryBoundaryCrossed = (index, added) => { + if (this.metadata[index].onSecondaryAxis) { + this.selectFunc(this.rectangles[index], added); + } else { + if (added) { + this.secondaryOrder.insert(index, finalPosition[1]); + const secondaryBoundary = this.metadata[index].secondaryBoundary; + if ( + // If inserted before the current position + Math.sign(finalPosition[1] - secondaryBoundary) == direction[1] + // And after initial position + && Math.sign(secondaryBoundary - this.initialPosition[1]) == direction[1] + ) { + // Secondary axis is already satisfied then + this.selectFunc(this.rectangles[index], true); + } + } else { + this.selectFunc(this.rectangles[index], false); + this.secondaryOrder.remove(index); + } + } + this.computeBoundaries(); + this.selectTo(finalPosition); + }; + + if (finalPosition[0] < this.boundaries.primaryN.v) { + --this.primaryOrder.currentPosition; + primaryBoundaryCrossed( + this.boundaries.primaryN.i, + this.initialPosition[0] > this.boundaries.primaryN.v && finalPosition[0] < this.initialPosition[0]); + } else if (finalPosition[0] > this.boundaries.primaryP.v) { + ++this.primaryOrder.currentPosition; + primaryBoundaryCrossed( + this.boundaries.primaryP.i, + this.initialPosition[0] < this.boundaries.primaryP.v && this.initialPosition[0] < finalPosition[0]); + } + + const secondaryBoundaryCrossed = (index, added) => { + this.selectFunc(this.rectangles[index], added); + this.computeBoundaries(); + this.selectTo(finalPosition); + }; + + if (finalPosition[1] < this.boundaries.secondaryN.v) { + --this.secondaryOrder.currentPosition; + secondaryBoundaryCrossed( + this.boundaries.secondaryN.i, + this.initialPosition[1] > this.boundaries.secondaryN.v && finalPosition[1] < this.initialPosition[1]); + } else if (finalPosition[1] > this.boundaries.secondaryP.v) { + ++this.secondaryOrder.currentPosition; + secondaryBoundaryCrossed( + this.boundaries.secondaryP.i, + this.initialPosition[1] < this.boundaries.secondaryP.v && this.initialPosition[1] < finalPosition[1]); + } + this.finalPosition = finalPosition; + } +} + +/** @typedef {import("../element/SelectorElement").default} SelectorElement */ + +/** @extends IFromToPositionedTemplate */ +class SelectorTemplate extends IFromToPositionedTemplate { +} + +/** @extends {IFromToPositionedElement} */ +class SelectorElement extends IFromToPositionedElement { + + constructor() { + super({}, new SelectorTemplate()); + this.selectionModel = null; + } + + /** @param {Number[]} initialPosition */ + beginSelect(initialPosition) { + this.blueprint.selecting = true; + this.setBothLocations(initialPosition); + this.selectionModel = new FastSelectionModel( + initialPosition, + this.blueprint.getNodes(), + this.blueprint.nodeBoundariesSupplier, + this.blueprint.nodeSelectToggleFunction + ); + } + + /** @param {Number[]} finalPosition */ + selectTo(finalPosition) { + /** @type {FastSelectionModel} */ (this.selectionModel) + .selectTo(finalPosition); + this.toX = finalPosition[0]; + this.toY = finalPosition[1]; + } + + endSelect() { + this.blueprint.selecting = false; + this.selectionModel = null; + this.fromX = 0; + this.fromY = 0; + this.toX = 0; + this.toY = 0; + } +} + +/** + * @typedef {import("./element/PinElement").default} PinElement + * @typedef {import("./entity/GuidEntity").default} GuidEntity + * @typedef {import("./entity/PinReferenceEntity").default} PinReferenceEntity + * @typedef {{ + * primaryInf: Number, + * primarySup: Number, + * secondaryInf: Number, + * secondarySup: Number, + * }} BoundariesInfo + */ + +/** @extends {IElement} */ +class Blueprint extends IElement { + + static properties = { + selecting: { + type: Boolean, + attribute: "data-selecting", + reflect: true, + converter: Utility.booleanConverter, + }, + scrolling: { + type: Boolean, + attribute: "data-scrolling", + reflect: true, + converter: Utility.booleanConverter, + }, + focused: { + type: Boolean, + attribute: "data-focused", + reflect: true, + converter: Utility.booleanConverter, + }, + zoom: { + type: Number, + attribute: "data-zoom", + reflect: true, + }, + scrollX: { + type: Number, + attribute: false, + }, + scrollY: { + type: Number, + attribute: false, + }, + additionalX: { + type: Number, + attribute: false, + }, + additionalY: { + type: Number, + attribute: false, + }, + translateX: { + type: Number, + attribute: false, + }, + translateY: { + type: Number, + attribute: false, + }, + } + + static styles = BlueprintTemplate.styles + + /** @type {Map} */ + #nodeNameCounter = new Map() + /** @type {NodeElement[]}" */ + nodes = [] + /** @type {LinkElement[]}" */ + links = [] + /** @type {Number[]} */ + mousePosition = [0, 0] + /** @type {HTMLElement} */ + gridElement + /** @type {HTMLElement} */ + viewportElement + /** @type {HTMLElement} */ + overlayElement + /** @type {SelectorElement} */ + selectorElement + /** @type {HTMLElement} */ + linksContainerElement + /** @type {HTMLElement} */ + nodesContainerElement + /** @type {HTMLElement} */ + headerElement + focused = false + waitingExpandUpdate = false + nodeBoundariesSupplier = node => { + let rect = node.getBoundingClientRect(); + let gridRect = this.nodesContainerElement.getBoundingClientRect(); + const scaleCorrection = 1 / this.getScale(); + return /** @type {BoundariesInfo} */ { + primaryInf: (rect.left - gridRect.left) * scaleCorrection, + primarySup: (rect.right - gridRect.right) * scaleCorrection, + // Counter intuitive here: the y (secondary axis is positive towards the bottom, therefore upper bound "sup" is bottom) + secondaryInf: (rect.top - gridRect.top) * scaleCorrection, + secondarySup: (rect.bottom - gridRect.bottom) * scaleCorrection + } + } + /** @type {(node: NodeElement, selected: Boolean) => void}} */ + nodeSelectToggleFunction = (node, selected) => { + node.setSelected(selected); + } + + /** @param {Configuration} settings */ + constructor(settings = new Configuration()) { + super({}, new BlueprintTemplate()); + this.selecting = false; + this.scrolling = false; + this.focused = false; + this.zoom = 0; + this.scrollX = Configuration.expandGridSize; + this.scrollY = Configuration.expandGridSize; + this.translateX = Configuration.expandGridSize; + this.translateY = Configuration.expandGridSize; + } + + getGridDOMElement() { + return this.gridElement + } + + disconnectedCallback() { + super.disconnectedCallback(); + } + + getScroll() { + return [this.scrollX, this.scrollY] + } + + /** @param {Number[]} param0 */ + setScroll([x, y], smooth = false) { + this.scrollX = x; + this.scrollY = y; + } + + /** @param {Number[]} delta */ + scrollDelta(delta, smooth = false) { + const maxScroll = [2 * Configuration.expandGridSize, 2 * Configuration.expandGridSize]; + let currentScroll = this.getScroll(); + let finalScroll = [ + currentScroll[0] + delta[0], + currentScroll[1] + delta[1] + ]; + let expand = [0, 0]; + for (let i = 0; i < 2; ++i) { + if (delta[i] < 0 && finalScroll[i] < Configuration.gridExpandThreshold * Configuration.expandGridSize) { + // Expand left/top + expand[i] = -1; + } else if (delta[i] > 0 && finalScroll[i] + > maxScroll[i] - Configuration.gridExpandThreshold * Configuration.expandGridSize) { + // Expand right/bottom + expand[i] = 1; + } + } + if (expand[0] != 0 || expand[1] != 0) { + this.seamlessExpand(expand); + } + currentScroll = this.getScroll(); + finalScroll = [ + currentScroll[0] + delta[0], + currentScroll[1] + delta[1] + ]; + this.setScroll(finalScroll, smooth); + } + + scrollCenter() { + const scroll = this.getScroll(); + const offset = [ + this.translateX - scroll[0], + this.translateY - scroll[1] + ]; + const targetOffset = this.getViewportSize().map(size => size / 2); + const deltaOffset = [ + offset[0] - targetOffset[0], + offset[1] - targetOffset[1] + ]; + this.scrollDelta(deltaOffset, true); + } + + getViewportSize() { + return [ + this.viewportElement.clientWidth, + this.viewportElement.clientHeight + ] + } + + /** + * Get the scroll limits + * @return {Array} The horizonal and vertical maximum scroll limits + */ + getScrollMax() { + return [ + this.viewportElement.scrollWidth - this.viewportElement.clientWidth, + this.viewportElement.scrollHeight - this.viewportElement.clientHeight + ] + } + + snapToGrid(location) { + return Utility.snapToGrid(location, Configuration.gridSize) + } + + /** @param {Number[]} param0 */ + seamlessExpand([x, y]) { + x = Math.round(x); + y = Math.round(y); + let scale = this.getScale(); + { + // If the expansion is towards the left or top, then scroll back to give the illusion that the content is in the same position and translate it accordingly + [x, y] = [-x * Configuration.expandGridSize, -y * Configuration.expandGridSize]; + if (x != 0) { + this.scrollX += x; + x /= scale; + } + if (y != 0) { + this.scrollY += y; + y /= scale; + } + } + this.translateX += x; + this.translateY += y; + } + + progressiveSnapToGrid(x) { + return Configuration.expandGridSize * Math.round(x / Configuration.expandGridSize + 0.5 * Math.sign(x)) + } + + getZoom() { + return this.zoom + } + + setZoom(zoom, center) { + zoom = Utility.clamp(zoom, Configuration.minZoom, Configuration.maxZoom); + if (zoom == this.zoom) { + return + } + let initialScale = this.getScale(); + this.zoom = zoom; + + if (center) { + requestAnimationFrame(_ => { + center[0] += this.translateX; + center[1] += this.translateY; + let relativeScale = this.getScale() / initialScale; + let newCenter = [ + relativeScale * center[0], + relativeScale * center[1], + ]; + this.scrollDelta([ + (newCenter[0] - center[0]) * initialScale, + (newCenter[1] - center[1]) * initialScale, + ]); + }); + } + } + + getScale() { + return parseFloat(getComputedStyle(this.gridElement).getPropertyValue("--ueb-scale")) + } + + /** @param {Number[]} param0 */ + compensateTranslation([x, y]) { + x -= this.translateX; + y -= this.translateY; + return [x, y] + } + + getNodes(selected = false) { + if (selected) { + return this.nodes.filter( + node => node.selected + ) + } else { + return this.nodes + } + } + + /** @param {PinReferenceEntity} pinReference */ + getPin(pinReference) { + let result = this.template.getPin(pinReference); + if (result + // Make sure it wasn't renamed in the meantime + && result.nodeElement.getNodeName() == pinReference.objectName.toString()) { + return result + } + // Slower fallback + return [... this.nodes + .find(n => pinReference.objectName.toString() == n.getNodeName()) + ?.getPinElements() ?? []] + .find(p => pinReference.pinGuid.toString() == p.getPinId().toString()) + } + + /** + * Returns the list of links in this blueprint. + * @returns {LinkElement[]} Nodes + */ + getLinks([a, b] = []) { + if (a == null != b == null) { + const pin = a ?? b; + return this.links.filter(link => link.sourcePin == pin || link.destinationPin == pin) + } + if (a != null && b != null) { + return this.links.filter(link => + link.sourcePin == a && link.destinationPin == b + || link.sourcePin == b && link.destinationPin == a + ) + } + return this.links + } + + /** + * @param {PinElement} sourcePin + * @param {PinElement} destinationPin + */ + getLink(sourcePin, destinationPin, ignoreDirection = false) { + return this.links.find(link => + link.sourcePin == sourcePin && link.destinationPin == destinationPin + || ignoreDirection && link.sourcePin == destinationPin && link.destinationPin == sourcePin + ) + } + + selectAll() { + this.getNodes().forEach(node => this.nodeSelectToggleFunction(node, true)); + } + + unselectAll() { + this.getNodes().forEach(node => this.nodeSelectToggleFunction(node, false)); + } + + /** @param {...IElement} graphElements */ + addGraphElement(...graphElements) { + for (let element of graphElements) { + element.blueprint = this; + if (element instanceof NodeElement && !this.nodes.includes(element)) { + const nodeName = element.entity.getObjectName(); + const homonymNode = this.nodes.find(node => node.entity.getObjectName() == nodeName); + if (homonymNode) { + // Inserted node keeps tha name and the homonym nodes is renamed + let name = homonymNode.entity.getObjectName(true); + this.#nodeNameCounter[name] = this.#nodeNameCounter[name] ?? -1; + do { + ++this.#nodeNameCounter[name]; + } while (this.nodes.find(node => + node.entity.getObjectName() == Configuration.nodeName(name, this.#nodeNameCounter[name]) + )) + homonymNode.rename(Configuration.nodeName(name, this.#nodeNameCounter[name])); + } + this.nodes.push(element); + this.nodesContainerElement?.appendChild(element); + } else if (element instanceof LinkElement && !this.links.includes(element)) { + this.links.push(element); + if (this.linksContainerElement && !this.linksContainerElement.contains(element)) { + this.linksContainerElement.appendChild(element); + } + } + } + graphElements.filter(element => element instanceof NodeElement).forEach( + node => /** @type {NodeElement} */(node).sanitizeLinks(graphElements) + ); + } + + /** @param {...IElement} graphElements */ + removeGraphElement(...graphElements) { + for (let element of graphElements) { + if (element.closest("ueb-blueprint") == this) { + element.remove(); + let elementsArray = element instanceof NodeElement + ? this.nodes + : element instanceof LinkElement + ? this.links + : null; + elementsArray?.splice( + elementsArray.findIndex(v => v === element), + 1 + ); + } + } + } + + setFocused(value = true) { + if (this.focused == value) { + return + } + let event = new CustomEvent(value ? "blueprint-focus" : "blueprint-unfocus"); + this.focused = value; + if (!this.focused) { + this.unselectAll(); + } + this.dispatchEvent(event); + } + + /** @param {Boolean} begin */ + dispatchEditTextEvent(begin) { + const event = new CustomEvent( + begin + ? Configuration.editTextEventName.begin + : Configuration.editTextEventName.end + ); + this.dispatchEvent(event); + } +} + +customElements.define("ueb-blueprint", Blueprint); + +/** + * @typedef {import("../element/IDraggableElement").default} IDraggableElement + */ + +/** + * @template {IDraggableElement} T + * @extends {IDraggableTemplate} + */ +class IDraggableControlTemplate extends IDraggableTemplate { + + /** @type {(x: Number, y: Number) => void} */ + #locationChangeCallback + get locationChangeCallback() { + return this.#locationChangeCallback + } + set locationChangeCallback(callback) { + this.#locationChangeCallback = callback; + } + + movementSpace + movementSpaceSize = [0, 0] + + connectedCallback() { + super.connectedCallback(); + this.movementSpace = this.element.parentElement; + const bounding = this.movementSpace.getBoundingClientRect(); + this.movementSpaceSize = [bounding.width, bounding.height]; + } + + createDraggableObject() { + return new MouseMoveDraggable(this.element, this.element.blueprint, { + draggableElement: this.movementSpace, + ignoreTranslateCompensate: true, + moveEverywhere: true, + movementSpace: this.movementSpace, + repositionOnClick: true, + stepSize: 1, + }) + } + + /** @param {[Number, Number]} param0 */ + adjustLocation([x, y]) { + this.locationChangeCallback?.(x, y); + return [x, y] + } +} + +/** @typedef {import("../element/ColorHandlerElement").default} ColorHandlerElement */ + +/** @extends {IDraggableControlTemplate} */ +class ColorHandlerTemplate extends IDraggableControlTemplate { + + /** @param {[Number, Number]} param0 */ + adjustLocation([x, y]) { + const radius = Math.round(this.movementSpaceSize[0] / 2); + x = x - radius; + y = -(y - radius); + let [r, theta] = Utility.getPolarCoordinates([x, y]); + r = Math.min(r, radius), [x, y] = Utility.getCartesianCoordinates([r, theta]); + this.locationChangeCallback?.(x / radius, y / radius); + x = Math.round(x + radius); + y = Math.round(-y + radius); + return [x, y] + } +} + +/** + * @typedef {import("../element/WindowElement").default} WindowElement + * @typedef {import("../entity/IEntity").default} IEntity + * @typedef {import("../template/IDraggableControlTemplate").default} IDraggableControlTemplate + */ + +/** + * @template {IEntity} T + * @template {IDraggableControlTemplate} U + * @extends {IDraggableElement} + */ +class IDraggableControlElement extends IDraggableElement { + + /** @type {WindowElement} */ + windowElement + + /** + * @param {T} entity + * @param {U} template + */ + constructor(entity, template) { + super(entity, template); + } + + connectedCallback() { + super.connectedCallback(); + this.windowElement = this.closest("ueb-window"); + } + + /** @param {Number[]} param0 */ + setLocation([x, y]) { + super.setLocation(this.template.adjustLocation([x, y])); + } +} + +/** @typedef {import("../template/ColorPickerWindowTemplate").default} ColorPickerWindowTemplate */ +/** + * @template T + * @typedef {import("./WindowElement").default} WindowElement + */ + +/** @extends {IDraggableControlElement} */ +class ColorHandlerElement extends IDraggableControlElement { + + constructor() { + super({}, new ColorHandlerTemplate()); + } +} + +/** @typedef {import("../element/ColorHandlerElement").default} ColorHandlerElement */ + +/** @extends {IDraggableControlTemplate} */ +class ColorSliderTemplate extends IDraggableControlTemplate { + + /** @param {[Number, Number]} param0 */ + adjustLocation([x, y]) { + x = Utility.clamp(x, 0, this.movementSpaceSize[0]); + y = Utility.clamp(y, 0, this.movementSpaceSize[1]); + this.locationChangeCallback?.(x / this.movementSpaceSize[0], 1 - y / this.movementSpaceSize[1]); + return [x, y] + } +} + +/** @typedef {import("../template/IDraggableControlTemplate").default} IDraggableControlTemplate */ + +/** @extends {IDraggableControlElement} */ +class ColorSliderElement extends IDraggableControlElement { + + constructor() { + super({}, new ColorSliderTemplate()); + } +} + +/** @typedef {import ("../element/InputElement").default} InputElement */ + +/** @extends {ITemplate} */ +class InputTemplate extends ITemplate { + + #focusHandler = () => { + this.element.blueprint.dispatchEditTextEvent(true); + if (this.element.selectOnFocus) { + getSelection().selectAllChildren(this.element); + } + } + #focusoutHandler = () => { + this.element.blueprint.dispatchEditTextEvent(false); + document.getSelection()?.removeAllRanges(); // Deselect eventually selected text inside the input + } + #inputSingleLineHandler = + /** @param {InputEvent} e */ + e => /** @type {HTMLElement} */(e.target).querySelectorAll("br").forEach(br => br.remove()) + #onKeydownBlurOnEnterHandler = + /** @param {KeyboardEvent} e */ + e => { + if (e.code == "Enter" && !e.shiftKey) { + /** @type {HTMLElement} */(e.target).blur(); + } + } + + /** @param {InputElement} element */ + constructed(element) { + super.constructed(element); + this.element.classList.add("ueb-pin-input-content"); + this.element.setAttribute("role", "textbox"); + this.element.contentEditable = "true"; + } + + connectedCallback() { + this.element.addEventListener("focus", this.#focusHandler); + this.element.addEventListener("focusout", this.#focusoutHandler); + if (this.element.singleLine) { + this.element.addEventListener("input", this.#inputSingleLineHandler); + } + if (this.element.blurOnEnter) { + this.element.addEventListener("keydown", this.#onKeydownBlurOnEnterHandler); + } + } + + cleanup() { + this.element.removeEventListener("focus", this.#focusHandler); + this.element.removeEventListener("focusout", this.#focusoutHandler); + if (this.element.singleLine) { + this.element.removeEventListener("input", this.#inputSingleLineHandler); + } + if (this.element.blurOnEnter) { + this.element.removeEventListener("keydown", this.#onKeydownBlurOnEnterHandler); + } + } +} + +class InputElement extends IElement { + + static properties = { + ...super.properties, + singleLine: { + type: Boolean, + attribute: "data-single-line", + converter: Utility.booleanConverter, + reflect: true, + }, + selectOnFocus: { + type: Boolean, + attribute: "data-select-focus", + converter: Utility.booleanConverter, + reflect: true, + }, + blurOnEnter: { + type: Boolean, + attribute: "data-blur-enter", + converter: Utility.booleanConverter, + reflect: true, + }, + } + + constructor() { + super({}, new InputTemplate()); + this.singleLine = false; + this.selectOnFocus = true; + this.blurOnEnter = true; + } +} + /** * @typedef {import("../../element/IDraggableElement").default} IDraggableElement */ @@ -4222,145 +5872,6 @@ const t={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},e * SPDX-License-Identifier: BSD-3-Clause */const i=e(class extends i$1{constructor(t$1){var e;if(super(t$1),t$1.type!==t.ATTRIBUTE||"style"!==t$1.name||(null===(e=t$1.strings)||void 0===e?void 0:e.length)>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(t){return Object.keys(t).reduce(((e,r)=>{const s=t[r];return null==s?e:e+`${r=r.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${s};`}),"")}update(e,[r]){const{style:s}=e.element;if(void 0===this.vt){this.vt=new Set;for(const t in r)this.vt.add(t);return this.render(r)}this.vt.forEach((t=>{null==r[t]&&(this.vt.delete(t),t.includes("-")?s.removeProperty(t):s[t]="");}));for(const t in r){const e=r[t];null!=e&&(this.vt.add(t),t.includes("-")?s.setProperty(t,e):s[t]=e);}return b}}); -/** - * @typedef {import("../element/IDraggableElement").default} IDraggableElement - */ - -/** - * @template {IDraggableElement} T - * @extends {IDraggableTemplate} - */ -class IDraggableControlTemplate extends IDraggableTemplate { - - /** @type {(x: Number, y: Number) => void} */ - #locationChangeCallback - get locationChangeCallback() { - return this.#locationChangeCallback - } - set locationChangeCallback(callback) { - this.#locationChangeCallback = callback; - } - - movementSpace - movementSpaceSize = [0, 0] - - connectedCallback() { - super.connectedCallback(); - this.movementSpace = this.element.parentElement; - const bounding = this.movementSpace.getBoundingClientRect(); - this.movementSpaceSize = [bounding.width, bounding.height]; - } - - createDraggableObject() { - return new MouseMoveDraggable(this.element, this.element.blueprint, { - draggableElement: this.movementSpace, - ignoreTranslateCompensate: true, - moveEverywhere: true, - movementSpace: this.movementSpace, - repositionOnClick: true, - stepSize: 1, - }) - } - - /** @param {[Number, Number]} param0 */ - adjustLocation([x, y]) { - this.locationChangeCallback?.(x, y); - return [x, y] - } -} - -/** @typedef {import("../element/ColorHandlerElement").default} ColorHandlerElement */ - -/** @extends {IDraggableControlTemplate} */ -class ColorHandlerTemplate extends IDraggableControlTemplate { - - /** @param {[Number, Number]} param0 */ - adjustLocation([x, y]) { - const radius = Math.round(this.movementSpaceSize[0] / 2); - x = x - radius; - y = -(y - radius); - let [r, theta] = Utility.getPolarCoordinates([x, y]); - r = Math.min(r, radius), [x, y] = Utility.getCartesianCoordinates([r, theta]); - this.locationChangeCallback?.(x / radius, y / radius); - x = Math.round(x + radius); - y = Math.round(-y + radius); - return [x, y] - } -} - -/** - * @typedef {import("../element/WindowElement").default} WindowElement - * @typedef {import("../entity/IEntity").default} IEntity - * @typedef {import("../template/IDraggableControlTemplate").default} IDraggableControlTemplate - */ - -/** - * @template {IEntity} T - * @template {IDraggableControlTemplate} U - * @extends {IDraggableElement} - */ -class IDraggableControlElement extends IDraggableElement { - - /** @type {WindowElement} */ - windowElement - - /** - * @param {T} entity - * @param {U} template - */ - constructor(entity, template) { - super(entity, template); - } - - connectedCallback() { - super.connectedCallback(); - this.windowElement = this.closest("ueb-window"); - } - - /** @param {Number[]} param0 */ - setLocation([x, y]) { - super.setLocation(this.template.adjustLocation([x, y])); - } -} - -/** @typedef {import("../template/ColorPickerWindowTemplate").default} ColorPickerWindowTemplate */ -/** - * @template T - * @typedef {import("./WindowElement").default} WindowElement - */ - -/** @extends {IDraggableControlElement} */ -class ColorHandlerElement extends IDraggableControlElement { - - constructor() { - super({}, new ColorHandlerTemplate()); - } -} - -/** @typedef {import("../element/ColorHandlerElement").default} ColorHandlerElement */ - -/** @extends {IDraggableControlTemplate} */ -class ColorSliderTemplate extends IDraggableControlTemplate { - - /** @param {[Number, Number]} param0 */ - adjustLocation([x, y]) { - x = Utility.clamp(x, 0, this.movementSpaceSize[0]); - y = Utility.clamp(y, 0, this.movementSpaceSize[1]); - this.locationChangeCallback?.(x / this.movementSpaceSize[0], 1 - y / this.movementSpaceSize[1]); - return [x, y] - } -} - -/** @typedef {import("../template/IDraggableControlTemplate").default} IDraggableControlTemplate */ - -/** @extends {IDraggableControlElement} */ -class ColorSliderElement extends IDraggableControlElement { - - constructor() { - super({}, new ColorSliderTemplate()); - } -} - /** @typedef {import("../element/WindowElement").default} WindowElement */ /** @extends {IDraggablePositionedTemplate} */ @@ -4785,55 +6296,9 @@ class ColorPickerWindowTemplate extends WindowTemplate { } } -/** - * @template {WindowTemplate} T - * @extends {IDraggableElement} - */ -class WindowElement extends IDraggableElement { - - static #typeTemplateMap = { - "window": WindowTemplate, - "color-picker": ColorPickerWindowTemplate, - } - - static properties = { - ...IDraggableElement.properties, - type: { - type: WindowTemplate, - attribute: "data-type", - reflect: true, - converter: { - fromAttribute: (value, type) => WindowElement.#typeTemplateMap[value], - toAttribute: (value, type) => - Object.entries(WindowElement.#typeTemplateMap).find(([k, v]) => value == v)[0] - }, - }, - } - - constructor(options = {}) { - if (options.type.constructor == String) { - options.type = WindowElement.#typeTemplateMap[options.type]; - } - options.type ??= WindowTemplate; - options.windowOptions ??= {}; - super({}, new options.type()); - this.type = options.type; - this.windowOptions = options.windowOptions; - } - - disconnectedCallback() { - super.disconnectedCallback(); - this.dispatchCloseEvent(); - } - - dispatchCloseEvent() { - let deleteEvent = new CustomEvent(Configuration.windowCloseEventName); - this.dispatchEvent(deleteEvent); - } -} - /** * @typedef {import("../element/PinElement").default} PinElement + * @typedef {import("../element/WindowElement").default} WindowElement * @typedef {import("../entity/LinearColorEntity").default} LinearColorEntity */ @@ -4850,15 +6315,17 @@ class LinearColorPinTemplate extends PinTemplate { /** @param {MouseEvent} e */ e => { //e.preventDefault() - this.#window = new WindowElement({ - type: ColorPickerWindowTemplate, - windowOptions: { - // The created window will use the following functions to get and set the color - getPinColor: () => this.element.defaultValue, - /** @param {LinearColorEntity} color */ - setPinColor: color => this.element.setDefaultValue(color), - }, - }); + this.#window = /** @type {WindowElement} */ ( + new (ElementFactory.getConstructor("ueb-window"))({ + type: ColorPickerWindowTemplate, + windowOptions: { + // The created window will use the following functions to get and set the color + getPinColor: () => this.element.defaultValue, + /** @param {LinearColorEntity} color */ + setPinColor: color => this.element.setDefaultValue(color), + }, + }) + ); this.element.blueprint.append(this.#window); const windowApplyHandler = () => { this.element.setDefaultValue( @@ -5106,7 +6573,6 @@ class PinElement extends IElement { /** @type {NodeElement} */ nodeElement - connections = 0 /** @@ -5119,7 +6585,7 @@ class PinElement extends IElement { this.pinType = this.entity.getType(); this.advancedView = this.entity.bAdvancedView; this.defaultValue = this.entity.getDefaultValue(); - this.color = PinElement.properties.color.converter.fromAttribute(Configuration.pinColor[this.pinType]?.toString()); + this.color = PinElement.properties.color.converter.fromAttribute(this.getColor().toString()); this.isLinked = false; this.pinDirection = entity.isInput() ? "input" : entity.isOutput() ? "output" : "hidden"; this.nodeElement = nodeElement; @@ -5135,15 +6601,10 @@ class PinElement extends IElement { } /** @return {GuidEntity} */ - GetPinId() { + getPinId() { return this.entity.PinId } - /** @return {String} */ - GetPinIdValue() { - return this.GetPinId().value - } - /** @returns {String} */ getPinName() { return this.entity.PinName @@ -5161,6 +6622,13 @@ class PinElement extends IElement { return Utility.formatStringName(this.entity.PinName) } + getColor() { + if (!this.pinType) { + return Configuration.pinColor["default"] + } + return Configuration.pinColor[this.pinType] + } + isInput() { return this.entity.isInput() } @@ -5198,7 +6666,7 @@ class PinElement extends IElement { } let link = this.blueprint.getLink(this, pin, true); if (!link) { - this.blueprint.addGraphElement(new LinkElement(this, pin)); + this.blueprint.addGraphElement(new (ElementFactory.getConstructor("ueb-link"))(this, pin)); } } return pin @@ -5234,1372 +6702,70 @@ class PinElement extends IElement { } } -/** @typedef {import("../element/NodeElement").default} NodeElement */ - -/** @extends {ISelectableDraggableTemplate} */ -class KnotNodeTemplate extends ISelectableDraggableTemplate { - - /** @type {PinElement} */ - #inputPin - get inputPin() { - return this.#inputPin - } - - /** @type {PinElement} */ - #outputPin - get outputPin() { - return this.#outputPin - } - - render() { - return $` -
- ` - } - - /** @param {Map} changedProperties */ - firstUpdated(changedProperties) { - super.firstUpdated(changedProperties); - const content = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-border")); - Promise.all(this.element.getPinElements().map(n => n.updateComplete)).then(() => this.element.dispatchReflowEvent()); - this.element.getPinElements().forEach(p => content.appendChild(p)); - } - - /** - * @param {NodeElement} node - * @returns {NodeListOf} - */ - getPinElements(node) { - return node.querySelectorAll("ueb-pin") - } - - createPinElements() { - const entities = this.element.getPinEntities().filter(v => !v.isHidden()); - const inputEntity = entities[entities[0].isInput() ? 0 : 1]; - const outputEntity = entities[entities[0].isOutput() ? 0 : 1]; - return [ - this.#inputPin = new PinElement(inputEntity, new KnotPinTemplate(), this.element), - this.#outputPin = new PinElement(outputEntity, new KnotPinTemplate(), this.element), - ] - } -} - -/** @typedef {import("../element/NodeElement").default} NodeElement */ - -/** @extends {ISelectableDraggableTemplate} */ -class NodeTemplate extends ISelectableDraggableTemplate { - - toggleAdvancedDisplayHandler = _ => { - this.element.toggleShowAdvancedPinDisplay(); - this.element.addNextUpdatedCallbacks(() => this.element.dispatchReflowEvent(), true); - } - - render() { - return $` -
-
-
-
- - - - - - - ${this.element.nodeDisplayName} - -
-
-
-
-
-
- ${this.element.enabledState?.toString() == "DevelopmentOnly" ? $` -
- Development Only -
- ` : w} - ${this.element.advancedPinDisplay ? $` -
- - - -
- ` : w} -
-
- ` - } - - /** @param {Map} changedProperties */ - firstUpdated(changedProperties) { - super.firstUpdated(changedProperties); - const inputContainer = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-inputs")); - const outputContainer = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-outputs")); - Promise.all(this.element.getPinElements().map(n => n.updateComplete)).then(() => this.element.dispatchReflowEvent()); - this.element.getPinElements().forEach(p => { - if (p.isInput()) { - inputContainer.appendChild(p); - } else if (p.isOutput()) { - outputContainer.appendChild(p); - } - }); - this.element.nodeNameElement = /** @type {HTMLElement} */(this.element.querySelector(".ueb-node-name-text")); - } - - /** - * @param {NodeElement} node - * @returns {NodeListOf} - */ - getPinElements(node) { - return node.querySelectorAll("ueb-pin") - } - - createPinElements() { - return this.element.getPinEntities() - .filter(v => !v.isHidden()) - .map(v => new PinElement(v, undefined, this.element)) - } -} - -/** @typedef {import("./IElement").default} IElement */ - -/** @extends {ISelectableDraggableElement} */ -class NodeElement extends ISelectableDraggableElement { +/** + * @template {WindowTemplate} T + * @extends {IDraggableElement} + */ +class WindowElement extends IDraggableElement { static #typeTemplateMap = { - "/Script/BlueprintGraph.K2Node_Knot": KnotNodeTemplate, + "window": WindowTemplate, + "color-picker": ColorPickerWindowTemplate, } static properties = { - ...ISelectableDraggableElement.properties, - nodeClass: { - type: String, + ...IDraggableElement.properties, + type: { + type: WindowTemplate, attribute: "data-type", reflect: true, - }, - name: { - type: String, - attribute: "data-name", - reflect: true, - }, - advancedPinDisplay: { - type: String, - attribute: "data-advanced-display", - converter: IdentifierEntity.attributeConverter, - reflect: true, - }, - enabledState: { - type: String, - attribute: "data-enabled-state", - reflect: true, - }, - nodeDisplayName: { - type: String, - attribute: false, - }, - pureFunction: { - type: Boolean, - converter: Utility.booleanConverter, - attribute: "data-pure-function", - reflect: true, + converter: { + fromAttribute: (value, type) => WindowElement.#typeTemplateMap[value], + toAttribute: (value, type) => + Object.entries(WindowElement.#typeTemplateMap).find(([k, v]) => value == v)[0] + }, }, } - static dragEventName = Configuration.nodeDragEventName - static dragGeneralEventName = Configuration.nodeDragGeneralEventName - get blueprint() { - return super.blueprint - } - set blueprint(v) { - super.blueprint = v; - this.#pins.forEach(p => p.blueprint = v); - } - - /** @type {HTMLElement} */ - #nodeNameElement - get nodeNameElement() { - return this.#nodeNameElement - } - set nodeNameElement(value) { - this.#nodeNameElement = value; - } - - #pins - - /** - * @param {ObjectEntity} entity - * @param {NodeTemplate} template - */ - constructor(entity, template = undefined) { - super(entity, template ?? new (NodeElement.getTypeTemplate(entity))()); - this.#pins = this.template.createPinElements(); - this.nodeClass = this.entity.getClass(); - this.name = this.entity.getObjectName(); - this.advancedPinDisplay = this.entity.AdvancedPinDisplay?.toString(); - this.enabledState = this.entity.EnabledState; - this.nodeDisplayName = this.entity.getDisplayName(); - this.pureFunction = this.entity.bIsPureFunc; - this.dragLinkObjects = []; - super.setLocation([this.entity.NodePosX.value, this.entity.NodePosY.value]); - this.entity.subscribe("AdvancedPinDisplay", value => this.advancedPinDisplay = value); - this.entity.subscribe("Name", value => this.name = value); - } - - /** - * @param {ObjectEntity} nodeEntity - * @return {new () => NodeTemplate} - */ - static getTypeTemplate(nodeEntity) { - let result = NodeElement.#typeTemplateMap[nodeEntity.getClass()]; - return result ?? NodeTemplate - } - - /** @param {String} str */ - static fromSerializedObject(str) { - str = str.trim(); - let entity = SerializerFactory.getSerializer(ObjectEntity).deserialize(str); - // @ts-expect-error - return new NodeElement(entity) + constructor(options = {}) { + if (options.type.constructor == String) { + options.type = WindowElement.#typeTemplateMap[options.type]; + } + options.type ??= WindowTemplate; + options.windowOptions ??= {}; + super({}, new options.type()); + this.type = options.type; + this.windowOptions = options.windowOptions; } disconnectedCallback() { super.disconnectedCallback(); - this.dispatchDeleteEvent(); + this.dispatchCloseEvent(); } - getType() { - return this.entity.getClass() - } - - getNodeName() { - return this.entity.getObjectName() - } - - getNodeDisplayName() { - return this.entity.getDisplayName() - } - - /** @param {IElement[]} nodesWhitelist */ - sanitizeLinks(nodesWhitelist = []) { - this.getPinElements().forEach(pin => pin.sanitizeLinks(nodesWhitelist)); - } - - /** @param {String} name */ - rename(name) { - if (this.entity.Name == name) { - return false - } - for (let sourcePinElement of this.getPinElements()) { - for (let targetPinReference of sourcePinElement.getLinks()) { - this.blueprint.getPin(targetPinReference).redirectLink(sourcePinElement, new PinReferenceEntity({ - objectName: name, - pinGuid: sourcePinElement.entity.PinId, - })); - } - } - this.entity.Name = name; - } - - getPinElements() { - return this.#pins - } - - /** @returns {PinEntity[]} */ - getPinEntities() { - return this.entity.CustomProperties.filter(v => v instanceof PinEntity) - } - - setLocation(value = [0, 0]) { - let nodeConstructor = this.entity.NodePosX.constructor; - // @ts-expect-error - this.entity.NodePosX = new nodeConstructor(value[0]); - // @ts-expect-error - this.entity.NodePosY = new nodeConstructor(value[1]); - super.setLocation(value); - } - - dispatchDeleteEvent() { - let deleteEvent = new CustomEvent(Configuration.nodeDeleteEventName); + dispatchCloseEvent() { + let deleteEvent = new CustomEvent(Configuration.windowCloseEventName); this.dispatchEvent(deleteEvent); } - - dispatchReflowEvent() { - let reflowEvent = new CustomEvent(Configuration.nodeReflowEventName); - this.dispatchEvent(reflowEvent); - } - - setShowAdvancedPinDisplay(value) { - this.entity.AdvancedPinDisplay = new IdentifierEntity(value ? "Shown" : "Hidden"); - } - - toggleShowAdvancedPinDisplay() { - this.setShowAdvancedPinDisplay(this.entity.AdvancedPinDisplay?.toString() != "Shown"); - } -} - -class Paste extends IInput { - - static #serializer = new ObjectSerializer() - - /** @type {(e: ClipboardEvent) => void} */ - #pasteHandle - - constructor(target, blueprint, options = {}) { - options.listenOnFocus ??= true; - options.unlistenOnTextEdit ??= true; // No nodes paste if inside a text field, just text (default behavior) - super(target, blueprint, options); - let self = this; - this.#pasteHandle = e => self.pasted(e.clipboardData.getData("Text")); - } - - listenEvents() { - document.body.addEventListener("paste", this.#pasteHandle); - } - - unlistenEvents() { - document.body.removeEventListener("paste", this.#pasteHandle); - } - - pasted(value) { - let top = 0; - let left = 0; - let count = 0; - let nodes = Paste.#serializer.readMultiple(value).map(entity => { - let node = new NodeElement(entity); - top += node.locationY; - left += node.locationX; - ++count; - return node - }); - top /= count; - left /= count; - if (nodes.length > 0) { - this.blueprint.unselectAll(); - } - let mousePosition = this.blueprint.mousePosition; - nodes.forEach(node => { - const locationOffset = [ - mousePosition[0] - left, - mousePosition[1] - top, - ]; - node.addLocation(locationOffset); - node.snapToGrid(); - node.setSelected(true); - }); - this.blueprint.addGraphElement(...nodes); - return true - } -} - -class Select extends IMouseClickDrag { - - constructor(target, blueprint, options) { - super(target, blueprint, options); - this.selectorElement = this.blueprint.selectorElement; - } - - startDrag() { - this.selectorElement.beginSelect(this.clickedPosition); - } - - dragTo(location, movement) { - this.selectorElement.selectTo(location); - } - - endDrag() { - if (this.started) { - this.selectorElement.endSelect(); - } - } - - unclicked() { - if (!this.started) { - this.blueprint.unselectAll(); - } - } -} - -class OrderedIndexArray { - - /** - * @param {(arrayElement: number) => number} comparisonValueSupplier - * @param {number} value - */ - constructor(comparisonValueSupplier = v => v, value = null) { - this.array = new Uint32Array(value); - this.comparisonValueSupplier = comparisonValueSupplier; - this.length = 0; - this.currentPosition = 0; - } - - /** @param {number} index */ - get(index) { - if (index >= 0 && index < this.length) { - return this.array[index] - } - return null - } - - getArray() { - return this.array - } - - /** @param {number} value */ - getPosition(value) { - let l = 0; - let r = this.length; - while (l < r) { - let m = Math.floor((l + r) / 2); - if (this.comparisonValueSupplier(this.array[m]) < value) { - l = m + 1; - } else { - r = m; - } - } - return l - } - - reserve(length) { - if (this.array.length < length) { - let newArray = new Uint32Array(length); - newArray.set(this.array); - this.array = newArray; - } - } - - /** @param {number} element */ - insert(element, comparisonValue = null) { - let position = this.getPosition(this.comparisonValueSupplier(element)); - if ( - position < this.currentPosition - || comparisonValue != null && position == this.currentPosition && this.comparisonValueSupplier(element) < comparisonValue) { - ++this.currentPosition; - } - this.shiftRight(position); - this.array[position] = element; - ++this.length; - return position - } - - /** @param {number} element */ - remove(element) { - let position = this.getPosition(this.comparisonValueSupplier(element)); - if (this.array[position] == element) { - this.removeAt(position); - } - } - - /** @param {number} position */ - removeAt(position) { - if (position < this.currentPosition) { - --this.currentPosition; - } - this.shiftLeft(position); - --this.length; - return position - } - - getNext() { - if (this.currentPosition >= 0 && this.currentPosition < this.length) { - return this.get(this.currentPosition) - } - return null - } - - getNextValue() { - if (this.currentPosition >= 0 && this.currentPosition < this.length) { - return this.comparisonValueSupplier(this.get(this.currentPosition)) - } else { - return Number.MAX_SAFE_INTEGER - } - } - - getPrev() { - if (this.currentPosition > 0) { - return this.get(this.currentPosition - 1) - } - return null - } - - getPrevValue() { - if (this.currentPosition > 0) { - return this.comparisonValueSupplier(this.get(this.currentPosition - 1)) - } else { - return Number.MIN_SAFE_INTEGER - } - } - - shiftLeft(leftLimit, steps = 1) { - this.array.set(this.array.subarray(leftLimit + steps), leftLimit); - } - - shiftRight(leftLimit, steps = 1) { - this.array.set(this.array.subarray(leftLimit, -steps), leftLimit + steps); - } -} - -/** - * @typedef {import("../Blueprint").BoundariesInfo} BoundariesInfo - * @typedef {{ - * primaryBoundary: Number, - * secondaryBoundary: Number, - * insertionPosition?: Number, - * rectangle: Number - * onSecondaryAxis: Boolean - * }} Metadata - * @typedef {any} Rectangle - */ -class FastSelectionModel { - - /** - * @param {Number[]} initialPosition - * @param {Rectangle[]} rectangles - * @param {(rect: Rectangle) => BoundariesInfo} boundariesFunc - * @param {(rect: Rectangle, selected: Boolean) => void} selectFunc - */ - constructor(initialPosition, rectangles, boundariesFunc, selectFunc) { - this.initialPosition = initialPosition; - this.finalPosition = initialPosition; - /** @type {Metadata[]} */ - this.metadata = new Array(rectangles.length); - this.primaryOrder = new OrderedIndexArray((element) => this.metadata[element].primaryBoundary); - this.secondaryOrder = new OrderedIndexArray((element) => this.metadata[element].secondaryBoundary); - this.selectFunc = selectFunc; - this.rectangles = rectangles; - this.primaryOrder.reserve(this.rectangles.length); - this.secondaryOrder.reserve(this.rectangles.length); - rectangles.forEach((rect, index) => { - /** @type {Metadata} */ - let rectangleMetadata = { - primaryBoundary: this.initialPosition[0], - secondaryBoundary: this.initialPosition[1], - rectangle: index, // used to move both expandings inside the this.metadata array - onSecondaryAxis: false - }; - this.metadata[index] = rectangleMetadata; - selectFunc(rect, false); // Initially deselected (Eventually) - const rectangleBoundaries = boundariesFunc(rect); - - // Secondary axis first because it may be inserted in this.secondaryOrder during the primary axis check - if (this.initialPosition[1] < rectangleBoundaries.secondaryInf) { // Initial position is before the rectangle - rectangleMetadata.secondaryBoundary = rectangleBoundaries.secondaryInf; - } else if (rectangleBoundaries.secondarySup < this.initialPosition[1]) { // Initial position is after the rectangle - rectangleMetadata.secondaryBoundary = rectangleBoundaries.secondarySup; - } else { - rectangleMetadata.onSecondaryAxis = true; - } - - if (this.initialPosition[0] < rectangleBoundaries.primaryInf) { // Initial position is before the rectangle - rectangleMetadata.primaryBoundary = rectangleBoundaries.primaryInf; - this.primaryOrder.insert(index); - } else if (rectangleBoundaries.primarySup < this.initialPosition[0]) { // Initial position is after the rectangle - rectangleMetadata.primaryBoundary = rectangleBoundaries.primarySup; - this.primaryOrder.insert(index); - } else { // Initial lays inside the rectangle (considering just this axis) - // Secondary order depends on primary order, if primary boundaries are not satisfied, the element is not watched for secondary ones - if (rectangleBoundaries.secondarySup < this.initialPosition[1] || this.initialPosition[1] < rectangleBoundaries.secondaryInf) { - this.secondaryOrder.insert(index); - } else { - selectFunc(rect, true); - } - } - }); - this.primaryOrder.currentPosition = this.primaryOrder.getPosition(this.initialPosition[0]); - this.secondaryOrder.currentPosition = this.secondaryOrder.getPosition(this.initialPosition[1]); - this.computeBoundaries(); - } - - computeBoundaries() { - this.boundaries = { - // Primary axis negative expanding - primaryN: { - v: this.primaryOrder.getPrevValue(), - i: this.primaryOrder.getPrev() - }, - primaryP: { - v: this.primaryOrder.getNextValue(), - i: this.primaryOrder.getNext() - }, - // Secondary axis negative expanding - secondaryN: { - v: this.secondaryOrder.getPrevValue(), - i: this.secondaryOrder.getPrev() - }, - // Secondary axis positive expanding - secondaryP: { - v: this.secondaryOrder.getNextValue(), - i: this.secondaryOrder.getNext() - } - }; - } - - selectTo(finalPosition) { - const direction = [ - Math.sign(finalPosition[0] - this.initialPosition[0]), - Math.sign(finalPosition[1] - this.initialPosition[1]) - ]; - const primaryBoundaryCrossed = (index, added) => { - if (this.metadata[index].onSecondaryAxis) { - this.selectFunc(this.rectangles[index], added); - } else { - if (added) { - this.secondaryOrder.insert(index, finalPosition[1]); - const secondaryBoundary = this.metadata[index].secondaryBoundary; - if ( - // If inserted before the current position - Math.sign(finalPosition[1] - secondaryBoundary) == direction[1] - // And after initial position - && Math.sign(secondaryBoundary - this.initialPosition[1]) == direction[1] - ) { - // Secondary axis is already satisfied then - this.selectFunc(this.rectangles[index], true); - } - } else { - this.selectFunc(this.rectangles[index], false); - this.secondaryOrder.remove(index); - } - } - this.computeBoundaries(); - this.selectTo(finalPosition); - }; - - if (finalPosition[0] < this.boundaries.primaryN.v) { - --this.primaryOrder.currentPosition; - primaryBoundaryCrossed( - this.boundaries.primaryN.i, - this.initialPosition[0] > this.boundaries.primaryN.v && finalPosition[0] < this.initialPosition[0]); - } else if (finalPosition[0] > this.boundaries.primaryP.v) { - ++this.primaryOrder.currentPosition; - primaryBoundaryCrossed( - this.boundaries.primaryP.i, - this.initialPosition[0] < this.boundaries.primaryP.v && this.initialPosition[0] < finalPosition[0]); - } - - const secondaryBoundaryCrossed = (index, added) => { - this.selectFunc(this.rectangles[index], added); - this.computeBoundaries(); - this.selectTo(finalPosition); - }; - - if (finalPosition[1] < this.boundaries.secondaryN.v) { - --this.secondaryOrder.currentPosition; - secondaryBoundaryCrossed( - this.boundaries.secondaryN.i, - this.initialPosition[1] > this.boundaries.secondaryN.v && finalPosition[1] < this.initialPosition[1]); - } else if (finalPosition[1] > this.boundaries.secondaryP.v) { - ++this.secondaryOrder.currentPosition; - secondaryBoundaryCrossed( - this.boundaries.secondaryP.i, - this.initialPosition[1] < this.boundaries.secondaryP.v && this.initialPosition[1] < finalPosition[1]); - } - this.finalPosition = finalPosition; - } -} - -/** @typedef {import("../element/SelectorElement").default} SelectorElement */ - -/** @extends IFromToPositionedTemplate */ -class SelectorTemplate extends IFromToPositionedTemplate { -} - -/** @extends {IFromToPositionedElement} */ -class SelectorElement extends IFromToPositionedElement { - - constructor() { - super({}, new SelectorTemplate()); - this.selectionModel = null; - } - - /** @param {Number[]} initialPosition */ - beginSelect(initialPosition) { - this.blueprint.selecting = true; - this.setBothLocations(initialPosition); - this.selectionModel = new FastSelectionModel( - initialPosition, - this.blueprint.getNodes(), - this.blueprint.nodeBoundariesSupplier, - this.blueprint.nodeSelectToggleFunction - ); - } - - /** @param {Number[]} finalPosition */ - selectTo(finalPosition) { - /** @type {FastSelectionModel} */ (this.selectionModel) - .selectTo(finalPosition); - this.toX = finalPosition[0]; - this.toY = finalPosition[1]; - } - - endSelect() { - this.blueprint.selecting = false; - this.selectionModel = null; - this.fromX = 0; - this.fromY = 0; - this.toX = 0; - this.toY = 0; - } -} - -class Unfocus extends IInput { - - /** @type {(e: MouseEvent) => void} */ - #clickHandler - - constructor(target, blueprint, options = {}) { - options.listenOnFocus = true; - super(target, blueprint, options); - - let self = this; - this.#clickHandler = e => self.clickedSomewhere(/** @type {HTMLElement} */(e.target)); - if (this.blueprint.focus) { - document.addEventListener("click", this.#clickHandler); - } - } - - /** @param {HTMLElement} target */ - clickedSomewhere(target) { - // If target is outside the blueprint grid - if (!target.closest("ueb-blueprint")) { - this.blueprint.setFocused(false); - } - } - - listenEvents() { - document.addEventListener("click", this.#clickHandler); - } - - unlistenEvents() { - document.removeEventListener("click", this.#clickHandler); - } -} - -/** - * @typedef {import("../Blueprint").default} Blueprint - * @typedef {import("../element/PinElement").default} PinElement - * @typedef {import("../entity/PinReferenceEntity").default} PinReferenceEntity - */ - -/** @extends ITemplate */ -class BlueprintTemplate extends ITemplate { - - static styleVariables = { - "--ueb-font-size": `${Configuration.fontSize}`, - "--ueb-grid-axis-line-color": `${Configuration.gridAxisLineColor}`, - "--ueb-grid-expand": `${Configuration.expandGridSize}px`, - "--ueb-grid-line-color": `${Configuration.gridLineColor}`, - "--ueb-grid-line-width": `${Configuration.gridLineWidth}px`, - "--ueb-grid-set-line-color": `${Configuration.gridSetLineColor}`, - "--ueb-grid-set": `${Configuration.gridSet}`, - "--ueb-grid-size": `${Configuration.gridSize}px`, - "--ueb-link-min-width": `${Configuration.linkMinWidth}`, - "--ueb-node-radius": `${Configuration.nodeRadius}px`, - } - - /** @param {Blueprint} element */ - constructed(element) { - super.constructed(element); - this.element.style.cssText = Object.entries(BlueprintTemplate.styleVariables).map(([k, v]) => `${k}:${v};`).join(""); - } - - createInputObjects() { - return [ - ...super.createInputObjects(), - new Copy(this.element.getGridDOMElement(), this.element), - new Paste(this.element.getGridDOMElement(), this.element), - new KeyboardCanc(this.element.getGridDOMElement(), this.element), - new KeyboardSelectAll(this.element.getGridDOMElement(), this.element), - new Zoom(this.element.getGridDOMElement(), this.element), - new Select(this.element.getGridDOMElement(), this.element, { - clickButton: 0, - exitAnyButton: true, - moveEverywhere: true, - }), - new MouseScrollGraph(this.element.getGridDOMElement(), this.element, { - clickButton: 2, - exitAnyButton: false, - moveEverywhere: true, - }), - new Unfocus(this.element.getGridDOMElement(), this.element), - new MouseTracking(this.element.getGridDOMElement(), this.element), - new KeyboardEnableZoom(this.element.getGridDOMElement(), this.element), - ] - } - - render() { - return $` -
-
${this.element.zoom == 0 ? "1:1" : this.element.zoom}
-
-
-
-
-
-
-
-
-
-
- ` - } - - /** @param {Map} changedProperties */ - firstUpdated(changedProperties) { - super.firstUpdated(changedProperties); - this.element.headerElement = /** @type {HTMLElement} */(this.element.querySelector('.ueb-viewport-header')); - this.element.overlayElement = /** @type {HTMLElement} */(this.element.querySelector('.ueb-viewport-overlay')); - this.element.viewportElement = /** @type {HTMLElement} */(this.element.querySelector('.ueb-viewport-body')); - this.element.selectorElement = new SelectorElement(); - this.element.querySelector(".ueb-grid-content")?.append(this.element.selectorElement); - this.element.gridElement = /** @type {HTMLElement} */(this.element.viewportElement.querySelector(".ueb-grid")); - this.element.linksContainerElement = /** @type {HTMLElement} */(this.element.querySelector("[data-links]")); - this.element.linksContainerElement.append(...this.element.getLinks()); - this.element.nodesContainerElement = /** @type {HTMLElement} */(this.element.querySelector("[data-nodes]")); - this.element.nodesContainerElement.append(...this.element.getNodes()); - this.element.viewportElement.scroll(Configuration.expandGridSize, Configuration.expandGridSize); - } - - - /** @param {Map} changedProperties */ - updated(changedProperties) { - super.updated(changedProperties); - if (changedProperties.has("scrollX") || changedProperties.has("scrollY")) { - this.element.viewportElement.scroll(this.element.scrollX, this.element.scrollY); - } - if (changedProperties.has("zoom")) { - const previousZoom = changedProperties.get("zoom"); - const minZoom = Math.min(previousZoom, this.element.zoom); - const maxZoom = Math.max(previousZoom, this.element.zoom); - const classes = Utility.range(minZoom, maxZoom); - const getClassName = v => `ueb-zoom-${v}`; - if (previousZoom < this.element.zoom) { - this.element.classList.remove(...classes.filter(v => v < 0).map(getClassName)); - this.element.classList.add(...classes.filter(v => v > 0).map(getClassName)); - } else { - this.element.classList.remove(...classes.filter(v => v > 0).map(getClassName)); - this.element.classList.add(...classes.filter(v => v < 0).map(getClassName)); - } - } - } - - /** @param {PinReferenceEntity} pinReference */ - getPin(pinReference) { - return /** @type {PinElement} */(this.element.querySelector( - `ueb-node[data-name="${pinReference.objectName}"] ueb-pin[data-id="${pinReference.pinGuid}"]` - )) - } -} - -/** - * @typedef {import("./element/PinElement").default} PinElement - * @typedef {import("./entity/GuidEntity").default} GuidEntity - * @typedef {import("./entity/PinReferenceEntity").default} PinReferenceEntity - * @typedef {{ - * primaryInf: Number, - * primarySup: Number, - * secondaryInf: Number, - * secondarySup: Number, - * }} BoundariesInfo - */ - -/** @extends {IElement} */ -class Blueprint extends IElement { - - static properties = { - selecting: { - type: Boolean, - attribute: "data-selecting", - reflect: true, - converter: Utility.booleanConverter, - }, - scrolling: { - type: Boolean, - attribute: "data-scrolling", - reflect: true, - converter: Utility.booleanConverter, - }, - focused: { - type: Boolean, - attribute: "data-focused", - reflect: true, - converter: Utility.booleanConverter, - }, - zoom: { - type: Number, - attribute: "data-zoom", - reflect: true, - }, - scrollX: { - type: Number, - attribute: false, - }, - scrollY: { - type: Number, - attribute: false, - }, - additionalX: { - type: Number, - attribute: false, - }, - additionalY: { - type: Number, - attribute: false, - }, - translateX: { - type: Number, - attribute: false, - }, - translateY: { - type: Number, - attribute: false, - }, - } - - static styles = BlueprintTemplate.styles - - /** @type {Map} */ - #nodeNameCounter = new Map() - /** @type {NodeElement[]}" */ - nodes = [] - /** @type {LinkElement[]}" */ - links = [] - /** @type {Number[]} */ - mousePosition = [0, 0] - /** @type {HTMLElement} */ - gridElement - /** @type {HTMLElement} */ - viewportElement - /** @type {HTMLElement} */ - overlayElement - /** @type {SelectorElement} */ - selectorElement - /** @type {HTMLElement} */ - linksContainerElement - /** @type {HTMLElement} */ - nodesContainerElement - /** @type {HTMLElement} */ - headerElement - focused = false - waitingExpandUpdate = false - nodeBoundariesSupplier = node => { - let rect = node.getBoundingClientRect(); - let gridRect = this.nodesContainerElement.getBoundingClientRect(); - const scaleCorrection = 1 / this.getScale(); - return /** @type {BoundariesInfo} */ { - primaryInf: (rect.left - gridRect.left) * scaleCorrection, - primarySup: (rect.right - gridRect.right) * scaleCorrection, - // Counter intuitive here: the y (secondary axis is positive towards the bottom, therefore upper bound "sup" is bottom) - secondaryInf: (rect.top - gridRect.top) * scaleCorrection, - secondarySup: (rect.bottom - gridRect.bottom) * scaleCorrection - } - } - /** @type {(node: NodeElement, selected: Boolean) => void}} */ - nodeSelectToggleFunction = (node, selected) => { - node.setSelected(selected); - } - - /** @param {Configuration} settings */ - constructor(settings = new Configuration()) { - super({}, new BlueprintTemplate()); - this.selecting = false; - this.scrolling = false; - this.focused = false; - this.zoom = 0; - this.scrollX = Configuration.expandGridSize; - this.scrollY = Configuration.expandGridSize; - this.translateX = Configuration.expandGridSize; - this.translateY = Configuration.expandGridSize; - } - - getGridDOMElement() { - return this.gridElement - } - - disconnectedCallback() { - super.disconnectedCallback(); - } - - getScroll() { - return [this.scrollX, this.scrollY] - } - - /** @param {Number[]} param0 */ - setScroll([x, y], smooth = false) { - this.scrollX = x; - this.scrollY = y; - } - - /** @param {Number[]} delta */ - scrollDelta(delta, smooth = false) { - const maxScroll = [2 * Configuration.expandGridSize, 2 * Configuration.expandGridSize]; - let currentScroll = this.getScroll(); - let finalScroll = [ - currentScroll[0] + delta[0], - currentScroll[1] + delta[1] - ]; - let expand = [0, 0]; - for (let i = 0; i < 2; ++i) { - if (delta[i] < 0 && finalScroll[i] < Configuration.gridExpandThreshold * Configuration.expandGridSize) { - // Expand left/top - expand[i] = -1; - } else if (delta[i] > 0 && finalScroll[i] - > maxScroll[i] - Configuration.gridExpandThreshold * Configuration.expandGridSize) { - // Expand right/bottom - expand[i] = 1; - } - } - if (expand[0] != 0 || expand[1] != 0) { - this.seamlessExpand(expand); - } - currentScroll = this.getScroll(); - finalScroll = [ - currentScroll[0] + delta[0], - currentScroll[1] + delta[1] - ]; - this.setScroll(finalScroll, smooth); - } - - scrollCenter() { - const scroll = this.getScroll(); - const offset = [ - this.translateX - scroll[0], - this.translateY - scroll[1] - ]; - const targetOffset = this.getViewportSize().map(size => size / 2); - const deltaOffset = [ - offset[0] - targetOffset[0], - offset[1] - targetOffset[1] - ]; - this.scrollDelta(deltaOffset, true); - } - - getViewportSize() { - return [ - this.viewportElement.clientWidth, - this.viewportElement.clientHeight - ] - } - - /** - * Get the scroll limits - * @return {Array} The horizonal and vertical maximum scroll limits - */ - getScrollMax() { - return [ - this.viewportElement.scrollWidth - this.viewportElement.clientWidth, - this.viewportElement.scrollHeight - this.viewportElement.clientHeight - ] - } - - snapToGrid(location) { - return Utility.snapToGrid(location, Configuration.gridSize) - } - - /** @param {Number[]} param0 */ - seamlessExpand([x, y]) { - x = Math.round(x); - y = Math.round(y); - let scale = this.getScale(); - { - // If the expansion is towards the left or top, then scroll back to give the illusion that the content is in the same position and translate it accordingly - [x, y] = [-x * Configuration.expandGridSize, -y * Configuration.expandGridSize]; - if (x != 0) { - this.scrollX += x; - x /= scale; - } - if (y != 0) { - this.scrollY += y; - y /= scale; - } - } - this.translateX += x; - this.translateY += y; - } - - progressiveSnapToGrid(x) { - return Configuration.expandGridSize * Math.round(x / Configuration.expandGridSize + 0.5 * Math.sign(x)) - } - - getZoom() { - return this.zoom - } - - setZoom(zoom, center) { - zoom = Utility.clamp(zoom, Configuration.minZoom, Configuration.maxZoom); - if (zoom == this.zoom) { - return - } - let initialScale = this.getScale(); - this.zoom = zoom; - - if (center) { - requestAnimationFrame(_ => { - center[0] += this.translateX; - center[1] += this.translateY; - let relativeScale = this.getScale() / initialScale; - let newCenter = [ - relativeScale * center[0], - relativeScale * center[1], - ]; - this.scrollDelta([ - (newCenter[0] - center[0]) * initialScale, - (newCenter[1] - center[1]) * initialScale, - ]); - }); - } - } - - getScale() { - return parseFloat(getComputedStyle(this.gridElement).getPropertyValue("--ueb-scale")) - } - - /** @param {Number[]} param0 */ - compensateTranslation([x, y]) { - x -= this.translateX; - y -= this.translateY; - return [x, y] - } - - getNodes(selected = false) { - if (selected) { - return this.nodes.filter( - node => node.selected - ) - } else { - return this.nodes - } - } - - /** @param {PinReferenceEntity} pinReference */ - getPin(pinReference) { - let result = this.template.getPin(pinReference); - if (result - // Make sure it wasn't renamed in the meantime - && result.nodeElement.getNodeName() == pinReference.objectName.toString()) { - return result - } - // Slower fallback - return [... this.nodes - .find(n => pinReference.objectName.toString() == n.getNodeName()) - ?.getPinElements() ?? []] - .find(p => pinReference.pinGuid.toString() == p.GetPinIdValue()) - } - - /** - * Returns the list of links in this blueprint. - * @returns {LinkElement[]} Nodes - */ - getLinks([a, b] = []) { - if (a == null != b == null) { - const pin = a ?? b; - return this.links.filter(link => link.sourcePin == pin || link.destinationPin == pin) - } - if (a != null && b != null) { - return this.links.filter(link => - link.sourcePin == a && link.destinationPin == b - || link.sourcePin == b && link.destinationPin == a - ) - } - return this.links - } - - /** - * @param {PinElement} sourcePin - * @param {PinElement} destinationPin - */ - getLink(sourcePin, destinationPin, ignoreDirection = false) { - return this.links.find(link => - link.sourcePin == sourcePin && link.destinationPin == destinationPin - || ignoreDirection && link.sourcePin == destinationPin && link.destinationPin == sourcePin - ) - } - - selectAll() { - this.getNodes().forEach(node => this.nodeSelectToggleFunction(node, true)); - } - - unselectAll() { - this.getNodes().forEach(node => this.nodeSelectToggleFunction(node, false)); - } - - /** @param {...IElement} graphElements */ - addGraphElement(...graphElements) { - for (let element of graphElements) { - element.blueprint = this; - if (element instanceof NodeElement && !this.nodes.includes(element)) { - const nodeName = element.entity.getObjectName(); - const homonymNode = this.nodes.find(node => node.entity.getObjectName() == nodeName); - if (homonymNode) { - // Inserted node keeps tha name and the homonym nodes is renamed - let name = homonymNode.entity.getObjectName(true); - this.#nodeNameCounter[name] = this.#nodeNameCounter[name] ?? -1; - do { - ++this.#nodeNameCounter[name]; - } while (this.nodes.find(node => - node.entity.getObjectName() == Configuration.nodeName(name, this.#nodeNameCounter[name]) - )) - homonymNode.rename(Configuration.nodeName(name, this.#nodeNameCounter[name])); - } - this.nodes.push(element); - this.nodesContainerElement?.appendChild(element); - } else if (element instanceof LinkElement && !this.links.includes(element)) { - this.links.push(element); - if (this.linksContainerElement && !this.linksContainerElement.contains(element)) { - this.linksContainerElement.appendChild(element); - } - } - } - graphElements.filter(element => element instanceof NodeElement).forEach( - node => /** @type {NodeElement} */(node).sanitizeLinks(graphElements) - ); - } - - /** @param {...IElement} graphElements */ - removeGraphElement(...graphElements) { - for (let element of graphElements) { - if (element.closest("ueb-blueprint") == this) { - element.remove(); - let elementsArray = element instanceof NodeElement - ? this.nodes - : element instanceof LinkElement - ? this.links - : null; - elementsArray?.splice( - elementsArray.findIndex(v => v === element), - 1 - ); - } - } - } - - setFocused(value = true) { - if (this.focused == value) { - return - } - let event = new CustomEvent(value ? "blueprint-focus" : "blueprint-unfocus"); - this.focused = value; - if (!this.focused) { - this.unselectAll(); - } - this.dispatchEvent(event); - } - - /** @param {Boolean} begin */ - dispatchEditTextEvent(begin) { - const event = new CustomEvent( - begin - ? Configuration.editTextEventName.begin - : Configuration.editTextEventName.end - ); - this.dispatchEvent(event); - } -} - -customElements.define("ueb-blueprint", Blueprint); - -/** @typedef {import ("../element/InputElement").default} InputElement */ - -/** @extends {ITemplate} */ -class InputTemplate extends ITemplate { - - #focusHandler = () => { - this.element.blueprint.dispatchEditTextEvent(true); - if (this.element.selectOnFocus) { - getSelection().selectAllChildren(this.element); - } - } - #focusoutHandler = () => { - this.element.blueprint.dispatchEditTextEvent(false); - document.getSelection()?.removeAllRanges(); // Deselect eventually selected text inside the input - } - #inputSingleLineHandler = - /** @param {InputEvent} e */ - e => /** @type {HTMLElement} */(e.target).querySelectorAll("br").forEach(br => br.remove()) - #onKeydownBlurOnEnterHandler = - /** @param {KeyboardEvent} e */ - e => { - if (e.code == "Enter" && !e.shiftKey) { - /** @type {HTMLElement} */(e.target).blur(); - } - } - - /** @param {InputElement} element */ - constructed(element) { - super.constructed(element); - this.element.classList.add("ueb-pin-input-content"); - this.element.setAttribute("role", "textbox"); - this.element.contentEditable = "true"; - } - - connectedCallback() { - this.element.addEventListener("focus", this.#focusHandler); - this.element.addEventListener("focusout", this.#focusoutHandler); - if (this.element.singleLine) { - this.element.addEventListener("input", this.#inputSingleLineHandler); - } - if (this.element.blurOnEnter) { - this.element.addEventListener("keydown", this.#onKeydownBlurOnEnterHandler); - } - } - - cleanup() { - this.element.removeEventListener("focus", this.#focusHandler); - this.element.removeEventListener("focusout", this.#focusoutHandler); - if (this.element.singleLine) { - this.element.removeEventListener("input", this.#inputSingleLineHandler); - } - if (this.element.blurOnEnter) { - this.element.removeEventListener("keydown", this.#onKeydownBlurOnEnterHandler); - } - } -} - -class InputElement extends IElement { - - static properties = { - ...super.properties, - singleLine: { - type: Boolean, - attribute: "data-single-line", - converter: Utility.booleanConverter, - reflect: true, - }, - selectOnFocus: { - type: Boolean, - attribute: "data-select-focus", - converter: Utility.booleanConverter, - reflect: true, - }, - blurOnEnter: { - type: Boolean, - attribute: "data-blur-enter", - converter: Utility.booleanConverter, - reflect: true, - }, - } - - constructor() { - super({}, new InputTemplate()); - this.singleLine = false; - this.selectOnFocus = true; - this.blurOnEnter = true; - } } function defineElements() { customElements.define("ueb-color-handler", ColorHandlerElement); + ElementFactory.registerElement("ueb-color-handler", ColorHandlerElement); customElements.define("ueb-input", InputElement); + ElementFactory.registerElement("ueb-input", InputElement); customElements.define("ueb-link", LinkElement); + ElementFactory.registerElement("ueb-link", LinkElement); customElements.define("ueb-node", NodeElement); + ElementFactory.registerElement("ueb-node", NodeElement); customElements.define("ueb-pin", PinElement); + ElementFactory.registerElement("ueb-pin", PinElement); customElements.define("ueb-selector", SelectorElement); + ElementFactory.registerElement("ueb-selector", SelectorElement); customElements.define("ueb-ui-slider", ColorSliderElement); + ElementFactory.registerElement("ueb-ui-slider", ColorSliderElement); customElements.define("ueb-window", WindowElement); + ElementFactory.registerElement("ueb-window", WindowElement); } /** diff --git a/dist/ueblueprint.min.js b/dist/ueblueprint.min.js index 2c3a891..0c2ba91 100644 --- a/dist/ueblueprint.min.js +++ b/dist/ueblueprint.min.js @@ -14,21 +14,21 @@ const e=window.ShadowRoot&&(void 0===window.ShadyCSS||window.ShadyCSS.nativeShad * Copyright 2017 Google LLC * SPDX-License-Identifier: BSD-3-Clause */ -var m;p.finalized=!0,p.elementProperties=new Map,p.elementStyles=[],p.shadowRootOptions={mode:"open"},null==u||u({ReactiveElement:p}),(null!==(o=globalThis.reactiveElementVersions)&&void 0!==o?o:globalThis.reactiveElementVersions=[]).push("1.3.4");const g=globalThis.trustedTypes,v=g?g.createPolicy("lit-html",{createHTML:e=>e}):void 0,b=`lit$${(Math.random()+"").slice(9)}$`,f="?"+b,y=`<${f}>`,E=document,w=(e="")=>E.createComment(e),S=e=>null===e||"object"!=typeof e&&"function"!=typeof e,P=Array.isArray,k=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,C=/-->/g,x=/>/g,N=RegExp(">|[ \t\n\f\r](?:([^\\s\"'>=/]+)([ \t\n\f\r]*=[ \t\n\f\r]*(?:[^ \t\n\f\r\"'`<>=]|(\"|')|))|$)","g"),A=/'/g,$=/"/g,L=/^(?:script|style|textarea|title)$/i,T=(e=>(t,...i)=>({_$litType$:e,strings:t,values:i}))(1),O=Symbol.for("lit-noChange"),M=Symbol.for("lit-nothing"),D=new WeakMap,H=E.createTreeWalker(E,129,null,!1),_=(e,t)=>{const i=e.length-1,n=[];let s,r=2===t?"":"",o=k;for(let t=0;t"===l[0]?(o=null!=s?s:k,u=-1):void 0===l[1]?u=-2:(u=o.lastIndex-l[2].length,a=l[1],o=void 0===l[3]?N:'"'===l[3]?$:A):o===$||o===A?o=N:o===C||o===x?o=k:(o=N,s=void 0);const h=o===N&&e[t+1].startsWith("/>")?" ":"";r+=o===k?i+y:u>=0?(n.push(a),i.slice(0,u)+"$lit$"+i.slice(u)+b+h):i+b+(-2===u?(n.push(void 0),t):h)}const a=r+(e[i]||"")+(2===t?"":"");if(!Array.isArray(e)||!e.hasOwnProperty("raw"))throw Error("invalid template strings array");return[void 0!==v?v.createHTML(a):a,n]};class I{constructor({strings:e,_$litType$:t},i){let n;this.parts=[];let s=0,r=0;const o=e.length-1,a=this.parts,[l,u]=_(e,t);if(this.el=I.createElement(l,i),H.currentNode=this.el.content,2===t){const e=this.el.content,t=e.firstChild;t.remove(),e.append(...t.childNodes)}for(;null!==(n=H.nextNode())&&a.length0){n.textContent=g?g.emptyScript:"";for(let i=0;iP(e)||"function"==typeof(null==e?void 0:e[Symbol.iterator]))(e)?this.S(e):this.T(e)}j(e,t=this._$AB){return this._$AA.parentNode.insertBefore(e,t)}k(e){this._$AH!==e&&(this._$AR(),this._$AH=this.j(e))}T(e){this._$AH!==M&&S(this._$AH)?this._$AA.nextSibling.data=e:this.k(E.createTextNode(e)),this._$AH=e}$(e){var t;const{values:i,_$litType$:n}=e,s="number"==typeof n?this._$AC(e):(void 0===n.el&&(n.el=I.createElement(n.h,this.options)),n);if((null===(t=this._$AH)||void 0===t?void 0:t._$AD)===s)this._$AH.m(i);else{const e=new R(s,this),t=e.p(this.options);e.m(i),this.k(t),this._$AH=e}}_$AC(e){let t=D.get(e.strings);return void 0===t&&D.set(e.strings,t=new I(e)),t}S(e){P(this._$AH)||(this._$AH=[],this._$AR());const t=this._$AH;let i,n=0;for(const s of e)n===t.length?t.push(i=new G(this.j(w()),this.j(w()),this,this.options)):i=t[n],i._$AI(s),n++;n2||""!==i[0]||""!==i[1]?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=M}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(e,t=this,i,n){const s=this.strings;let r=!1;if(void 0===s)e=B(this,e,t,0),r=!S(e)||e!==this._$AH&&e!==O,r&&(this._$AH=e);else{const n=e;let o,a;for(e=s[0],o=0;oe}):void 0,v=`lit$${(Math.random()+"").slice(9)}$`,f="?"+v,y=`<${f}>`,E=document,w=(e="")=>E.createComment(e),S=e=>null===e||"object"!=typeof e&&"function"!=typeof e,P=Array.isArray,k=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,C=/-->/g,x=/>/g,N=RegExp(">|[ \t\n\f\r](?:([^\\s\"'>=/]+)([ \t\n\f\r]*=[ \t\n\f\r]*(?:[^ \t\n\f\r\"'`<>=]|(\"|')|))|$)","g"),A=/'/g,$=/"/g,L=/^(?:script|style|textarea|title)$/i,T=(e=>(t,...i)=>({_$litType$:e,strings:t,values:i}))(1),O=Symbol.for("lit-noChange"),D=Symbol.for("lit-nothing"),M=new WeakMap,H=E.createTreeWalker(E,129,null,!1),_=(e,t)=>{const i=e.length-1,n=[];let s,r=2===t?"":"",o=k;for(let t=0;t"===l[0]?(o=null!=s?s:k,u=-1):void 0===l[1]?u=-2:(u=o.lastIndex-l[2].length,a=l[1],o=void 0===l[3]?N:'"'===l[3]?$:A):o===$||o===A?o=N:o===C||o===x?o=k:(o=N,s=void 0);const h=o===N&&e[t+1].startsWith("/>")?" ":"";r+=o===k?i+y:u>=0?(n.push(a),i.slice(0,u)+"$lit$"+i.slice(u)+v+h):i+v+(-2===u?(n.push(void 0),t):h)}const a=r+(e[i]||"")+(2===t?"":"");if(!Array.isArray(e)||!e.hasOwnProperty("raw"))throw Error("invalid template strings array");return[void 0!==b?b.createHTML(a):a,n]};class I{constructor({strings:e,_$litType$:t},i){let n;this.parts=[];let s=0,r=0;const o=e.length-1,a=this.parts,[l,u]=_(e,t);if(this.el=I.createElement(l,i),H.currentNode=this.el.content,2===t){const e=this.el.content,t=e.firstChild;t.remove(),e.append(...t.childNodes)}for(;null!==(n=H.nextNode())&&a.length0){n.textContent=g?g.emptyScript:"";for(let i=0;iP(e)||"function"==typeof(null==e?void 0:e[Symbol.iterator]))(e)?this.S(e):this.T(e)}j(e,t=this._$AB){return this._$AA.parentNode.insertBefore(e,t)}k(e){this._$AH!==e&&(this._$AR(),this._$AH=this.j(e))}T(e){this._$AH!==D&&S(this._$AH)?this._$AA.nextSibling.data=e:this.k(E.createTextNode(e)),this._$AH=e}$(e){var t;const{values:i,_$litType$:n}=e,s="number"==typeof n?this._$AC(e):(void 0===n.el&&(n.el=I.createElement(n.h,this.options)),n);if((null===(t=this._$AH)||void 0===t?void 0:t._$AD)===s)this._$AH.m(i);else{const e=new R(s,this),t=e.p(this.options);e.m(i),this.k(t),this._$AH=e}}_$AC(e){let t=M.get(e.strings);return void 0===t&&M.set(e.strings,t=new I(e)),t}S(e){P(this._$AH)||(this._$AH=[],this._$AR());const t=this._$AH;let i,n=0;for(const s of e)n===t.length?t.push(i=new G(this.j(w()),this.j(w()),this,this.options)):i=t[n],i._$AI(s),n++;n2||""!==i[0]||""!==i[1]?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=D}get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}_$AI(e,t=this,i,n){const s=this.strings;let r=!1;if(void 0===s)e=B(this,e,t,0),r=!S(e)||e!==this._$AH&&e!==O,r&&(this._$AH=e);else{const n=e;let o,a;for(e=s[0],o=0;o{var n,s;const r=null!==(n=null==i?void 0:i.renderBefore)&&void 0!==n?n:t;let o=r._$litPart$;if(void 0===o){const e=null!==(s=null==i?void 0:i.renderBefore)&&void 0!==s?s:null;r._$litPart$=o=new G(t.insertBefore(w(),e),e,void 0,null!=i?i:{})}return o._$AI(e),o})(t,this.renderRoot,this.renderOptions)}connectedCallback(){var e;super.connectedCallback(),null===(e=this._$Do)||void 0===e||e.setConnected(!0)}disconnectedCallback(){var e;super.disconnectedCallback(),null===(e=this._$Do)||void 0===e||e.setConnected(!1)}render(){return O}}Y.finalized=!0,Y._$litElement$=!0,null===(W=globalThis.litElementHydrateSupport)||void 0===W||W.call(globalThis,{LitElement:Y});const Z=globalThis.litElementPolyfillSupport;null==Z||Z({LitElement:Y}),(null!==(q=globalThis.litElementVersions)&&void 0!==q?q:globalThis.litElementVersions=[]).push("3.2.2");class J{static alphaPattern="repeating-conic-gradient(#7c8184 0% 25%, #c2c3c4 0% 50%) 50% / 10px 10px";static colorDragEventName="ueb-color-drag";static colorPickEventName="ueb-color-pick";static colorWindowEventName="ueb-color-window";static deleteNodesKeyboardKey="Delete";static dragGeneralEventName="ueb-drag-general";static dragEventName="ueb-drag";static editTextEventName={begin:"ueb-edit-text-begin",end:"ueb-edit-text-end"};static enableZoomIn=["LeftControl","RightControl"];static expandGridSize=400;static focusEventName={begin:"blueprint-focus",end:"blueprint-unfocus"};static fontSize=s``;static gridAxisLineColor=s``;static gridExpandThreshold=.25;static gridLineColor=s``;static gridLineWidth=1;static gridSet=8;static gridSetLineColor=s``;static gridShrinkThreshold=4;static gridSize=16;static hexColorRegex=/^\s*#(?[0-9a-fA-F]{2})(?[0-9a-fA-F]{2})(?[0-9a-fA-F]{2})([0-9a-fA-F]{2})?|#(?[0-9a-fA-F])(?[0-9a-fA-F])(?[0-9a-fA-F])\s*$/;static keysSeparator="+";static knotNodeTypeName="/Script/BlueprintGraph.K2Node_Knot";static linkCurveHeight=15;static linkCurveWidth=80;static linkMinWidth=100;static linkRightSVGPath=(e,t,i)=>{let n=100-e;return`M ${e} 0 C ${t} 0, ${i} 0, 50 50 S ${n-t+e} 100, ${n} 100`};static maxZoom=7;static minZoom=-12;static mouseWheelFactor=.2;static nodeDeleteEventName="ueb-node-delete";static nodeDragGeneralEventName="ueb-node-drag-general";static nodeDragEventName="ueb-node-drag";static nodeName=(e,t)=>`${e}_${t}`;static nodeRadius=8;static nodeReflowEventName="ueb-node-reflow";static pinColor={"/Script/CoreUObject.LinearColor":s``,"/Script/CoreUObject.Rotator":s``,"/Script/CoreUObject.Transform":s``,"/Script/CoreUObject.Vector":s``,"/Script/Engine.Actor":s``,bool:s``,default:s``,exec:s``,int:s``,name:s``,real:s``,string:s``};static selectAllKeyboardKey="(bCtrl=True,Key=A)";static distanceThreshold=5;static trackingMouseEventName={begin:"ueb-tracking-mouse-begin",end:"ueb-tracking-mouse-end"};static windowApplyEventName="ueb-window-apply";static windowCancelEventName="ueb-window-cancel";static windowCloseEventName="ueb-window-close";static ModifierKeys=["Ctrl","Shift","Alt","Meta"];static Keys={Backspace:"Backspace",Tab:"Tab",LeftControl:"ControlLeft",RightControl:"ControlRight",LeftShift:"ShiftLeft",RightShift:"ShiftRight",LeftAlt:"AltLeft",RightAlt:"AltRight",Enter:"Enter",Pause:"Pause",CapsLock:"CapsLock",Escape:"Escape",Space:"Space",PageUp:"PageUp",PageDown:"PageDown",End:"End",Home:"Home",ArrowLeft:"Left",ArrowUp:"Up",ArrowRight:"Right",ArrowDown:"Down",PrintScreen:"PrintScreen",Insert:"Insert",Delete:"Delete",Zero:"Digit0",One:"Digit1",Two:"Digit2",Three:"Digit3",Four:"Digit4",Five:"Digit5",Six:"Digit6",Seven:"Digit7",Eight:"Digit8",Nine:"Digit9",A:"KeyA",B:"KeyB",C:"KeyC",D:"KeyD",E:"KeyE",F:"KeyF",G:"KeyG",H:"KeyH",I:"KeyI",K:"KeyK",L:"KeyL",M:"KeyM",N:"KeyN",O:"KeyO",P:"KeyP",Q:"KeyQ",R:"KeyR",S:"KeyS",T:"KeyT",U:"KeyU",V:"KeyV",W:"KeyW",X:"KeyX",Y:"KeyY",Z:"KeyZ",NumPadZero:"Numpad0",NumPadOne:"Numpad1",NumPadTwo:"Numpad2",NumPadThree:"Numpad3",NumPadFour:"Numpad4",NumPadFive:"Numpad5",NumPadSix:"Numpad6",NumPadSeven:"Numpad7",NumPadEight:"Numpad8",NumPadNine:"Numpad9",Multiply:"NumpadMultiply",Add:"NumpadAdd",Subtract:"NumpadSubtract",Decimal:"NumpadDecimal",Divide:"NumpadDivide",F1:"F1",F2:"F2",F3:"F3",F4:"F4",F5:"F5",F6:"F6",F7:"F7",F8:"F8",F9:"F9",F10:"F10",F11:"F11",F12:"F12",NumLock:"NumLock",ScrollLock:"ScrollLock"}}class Q{#e;get target(){return this.#e}#t;get blueprint(){return this.#t}options;constructor(e,t,i={}){i.consumeEvent??=!1,i.listenOnFocus??=!1,i.unlistenOnTextEdit??=!1,this.#e=e,this.#t=t,this.options=i;let n=this;this.listenHandler=e=>n.listenEvents(),this.unlistenHandler=e=>n.unlistenEvents(),this.options.listenOnFocus&&(this.blueprint.addEventListener(J.focusEventName.begin,this.listenHandler),this.blueprint.addEventListener(J.focusEventName.end,this.unlistenHandler)),this.options.unlistenOnTextEdit&&(this.blueprint.addEventListener(J.editTextEventName.begin,this.unlistenHandler),this.blueprint.addEventListener(J.editTextEventName.end,this.listenHandler))}unlistenDOMElement(){this.unlistenEvents(),this.blueprint.removeEventListener(J.focusEventName.begin,this.listenHandler),this.blueprint.removeEventListener(J.focusEventName.end,this.unlistenHandler),this.blueprint.removeEventListener(J.editTextEventName.begin,this.unlistenHandler),this.blueprint.removeEventListener(J.editTextEventName.end,this.listenHandler)}listenEvents(){}unlistenEvents(){}}class ee{#i;constructor(e){this.#i=e}calculate(e){return this.#i(e)}}class te{static#n=new Map;static registerSerializer(e,t){te.#n.set(e,t)}static getSerializer(e){return te.#n.get(e)}}class ie{#s;get type(){return this.#s}set type(e){this.#s=e}#r=!0;get showDefault(){return this.#r}set showDefault(e){this.#r=e}#o;get value(){return this.#o}set value(e){this.#o=e}#a;get serialized(){return this.#a}set serialized(e){this.#a=e}#l;get ignored(){return this.#l}set ignored(e){this.#l=e}static sanitize(e,t){return void 0===t&&(t=e?.constructor),t&&!(e?.constructor===t||e instanceof t)&&(e=new t(e)),(e instanceof Boolean||e instanceof Number||e instanceof String)&&(e=e.valueOf()),e}constructor(e,t=!0,i,n=!1,s=!1){void 0===i&&(i=e instanceof Array?[]:n?"":()=>ie.sanitize(new e)),this.#s=e,this.#r=t,this.#o=i,this.#a=n,this.#l=s}}class ne{static emptyObj={};static booleanConverter={fromAttribute:(e,t)=>{},toAttribute:(e,t)=>!0===e?"true":!1===e?"false":""};static sigmoid(e,t=1.7){return 1/(1+e/(1-e)**-t)}static clamp(e,t,i){return Math.min(Math.max(e,t),i)}static getScale(e){const t=getComputedStyle(e).getPropertyValue("--ueb-scale");return""!=t?parseFloat(t):1}static minDecimals(e,t=1){const i=e*10**t;return Math.abs(i%1)>Number.EPSILON?e.toString():e.toFixed(t)}static roundDecimals(e,t=1){const i=10**t;return Math.round(e*i)/i}static convertLocation(e,t){const i=1/ne.getScale(t),n=t.getBoundingClientRect();return[Math.round((e[0]-n.x)*i),Math.round((e[1]-n.y)*i)]}static isSerialized(e,t,i=ne.objectGet(e.constructor.attributes,t)){return i instanceof ee?ne.isSerialized(e,t,i.calculate(e)):i instanceof ie&&(!!i.serialized||ne.isSerialized(e,t,i.type))}static objectGet(e,t,i){if(void 0!==e){if(!(t instanceof Array))throw new TypeError("Expected keys to be an array.");return 0!=t.length&&t[0]in e&&void 0!==e[t[0]]?1==t.length?e[t[0]]:ne.objectGet(e[t[0]],t.slice(1),i):i}}static objectSet(e,t,i,n=!1,s=Object){if(!(t instanceof Array))throw new TypeError("Expected keys to be an array.");if(1==t.length){if(n||t[0]in e||void 0===e[t[0]])return e[t[0]]=i,!0}else if(t.length>0)return!n||e[t[0]]instanceof Object||(e[t[0]]=new s),ne.objectSet(e[t[0]],t.slice(1),i,n,s);return!1}static equals(e,t){return(e=ie.sanitize(e))===(t=ie.sanitize(t))||(e instanceof Array&&t instanceof Array?e.length==t.length&&!e.find(((e,i)=>!ne.equals(e,t[i]))):void 0)}static getType(e){return null===e?null:e instanceof ie?ne.getType(e.type):e instanceof Function?e:e?.constructor}static snapToGrid(e,t){return 1===t?e:[t*Math.round(e[0]/t),t*Math.round(e[1]/t)]}static mergeArrays(e=[],t=[]){let i=[];for(let n=0;n","\n").replaceAll(/(\)/g,"")}static formatStringName(e){return e.trim().replace(/^b/,"").replaceAll(/(?<=[a-z])(?=[A-Z])|_|\s+/g," ")}static getIdFromReference(e){return e.replace(/(?:.+\.)?([^\.]+)$/,"$1").replaceAll(/(?<=[a-z\d])(?=[A-Z])|(?<=[a-zA-Z])(?=\d)|(?<=[A-Z]{2})(?=[A-Z][a-z])/g,"-").toLocaleLowerCase()}static printLinearColor(e){return`${Math.round(255*e.R.valueOf())}, ${Math.round(255*e.G.valueOf())}, ${Math.round(255*e.B.valueOf())}`}static getPolarCoordinates([e,t],i=!1){let n=Math.atan2(t,e);return i&&n<0&&(n=2*Math.PI+n),[Math.sqrt(e*e+t*t),n]}static getCartesianCoordinates([e,t]){return[e*Math.cos(t),e*Math.sin(t)]}static range(e,t,i=1){return Array.from({length:Math.ceil((t-e)/i)},((t,n)=>e+n*i))}}class se extends class{#u=new Map;subscribe(e,t){let i=this.#u;if(i.has(e)){let n=i.get(e);if(n.includes(t))return!1;n.push(t)}else{let n=!1,s=Object.getOwnPropertyDescriptor(this,e);if(!s&&(n=!0,s=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(this),e)??{},!s))return!1;i.set(e,[t]);const r="value"in s,o="set"in s;if(!r&&!o)throw new Error(`Property ${e} is not a value or a setter`);const a=Symbol.for(e+"Storage"),l=Symbol.for(e+"ValInfo");Object.defineProperties(n?Object.getPrototypeOf(this):this,{[a]:{configurable:!0,enumerable:!1,...r?{value:this[e],writable:!0}:{get:s.get,set:s.set}},[l]:{configurable:!0,enumerable:!1,value:[n,r]},[e]:{configurable:!0,...r&&{get(){return this[a]}},set(t){this[a]=t,i.get(e).forEach((t=>{t(this[e])}))}}})}return!0}unsubscribe(e,t){let i=this.#u.get(e);if(!i?.includes(t))return!1;if(i.splice(i.indexOf(t),1),0==i.length){const t=Symbol.for(e+"Storage"),i=Symbol.for(e+"ValInfo"),n=this[i][0];this[i][1],Object.defineProperty(n?Object.getPrototypeOf(this):this,e,Object.getOwnPropertyDescriptor(n?Object.getPrototypeOf(this):this,t)),delete this[i],delete this[t]}return!0}}{static attributes={};constructor(e){super();const t=(e,i,n={},s="")=>{const r=Object.getOwnPropertyNames(n);for(let o of ne.mergeArrays(Object.getOwnPropertyNames(i),r)){let a=ne.objectGet(n,[o]),l=i[o],u=ne.getType(l);if(l instanceof ee&&(l=l.calculate(this),u=ne.getType(l)),o in i?!(r.length>0)||o in n||void 0===l||l instanceof ie&&(!l.showDefault||l.ignored)||console.warn(`${this.constructor.name} will add attribute ${s}${o} not defined in the serialized data`):console.warn(`Attribute ${s}${o} in the serialized data is not defined in ${this.constructor.name}.attributes`),u!==Object)if(void 0===a){if(l instanceof ie){if(!l.showDefault){e[o]=void 0;continue}l.serialized?l="":(u=l.type,l=l.value,l instanceof Function&&(l=l()))}l instanceof Array&&(l=[]),e[o]=ie.sanitize(l,u)}else a?.constructor===String&&l instanceof ie&&l.serialized&&l.type!==String&&(a=te.getSerializer(l.type).deserialize(a)),e[o]=ie.sanitize(a,ne.getType(l));else e[o]={},t(e[o],i[o],n[o],o+".")}},i=this.constructor.attributes;e.constructor!==Object&&1==Object.getOwnPropertyNames(i).length&&(e={[Object.getOwnPropertyNames(i)[0]]:e}),t(this,i,e)}}class re extends se{static attributes={type:String,path:String};constructor(e={}){super(e),this.type,this.path}}class oe extends se{static attributes={MemberParent:re,MemberName:""};constructor(e={}){super(e),this.MemberParent,this.MemberName}}class ae extends se{static attributes={value:String};static generateGuid(e=!0){let t=new Uint32Array(4);!0===e&&crypto.getRandomValues(t);let i="";return t.forEach((e=>{i+=("0".repeat(8)+e.toString(16).toUpperCase()).slice(-8)})),new ae({value:i})}constructor(e={}){super(e),this.value}valueOf(){return this.value}toString(){return this.value}}class le extends se{static attributes={value:String};static attributeConverter={fromAttribute:(e,t)=>new le(e),toAttribute:(e,t)=>e.toString()};constructor(e={}){super(e),this.value}valueOf(){return this.value}toString(){return this.value}}class ue extends se{static attributes={value:Number};constructor(e=0){super(e),this.value=Math.round(this.value)}valueOf(){return this.value}toString(){return this.value.toString()}}class ce extends se{static lookbehind="INVTEXT";static attributes={value:String};constructor(e={}){super(e),this.value}}class he extends se{static attributes={ActionName:"",bShift:!1,bCtrl:!1,bAlt:!1,bCmd:!1,Key:le};constructor(e={}){e.ActionName=e.ActionName??"",e.bShift=e.bShift??!1,e.bCtrl=e.bCtrl??!1,e.bAlt=e.bAlt??!1,e.bCmd=e.bCmd??!1,super(e),this.ActionName,this.bShift,this.bCtrl,this.bAlt,this.bCmd,this.Key}}class de extends se{static attributes={value:0};constructor(e=0){super(e),this.value=ne.clamp(this.value,0,1)}valueOf(){return this.value}toString(){return this.value.toFixed(6)}}class pe extends se{static attributes={R:de,G:de,B:de,A:new ie(de,!0,(()=>new de(1)),!1,!0),H:new ie(de,!0,void 0,!1,!0),S:new ie(de,!0,void 0,!1,!0),V:new ie(de,!0,void 0,!1,!0)};static linearToSRGB(e){return e<=0?0:e>=1?1:e<.0031308?12.92*e:1.055*Math.pow(e,1/2.4)-.055}static sRGBtoLinear(e){return e<=0?0:e>=1?1:e<.04045?e/12.92:Math.pow((e+.055)/1.055,2.4)}constructor(e){super(e),this.R,this.G,this.B,this.A,this.H,this.S,this.V,this.#c()}#c(){const e=this.R.value,t=this.G.value,i=this.B.value;if(!(Math.abs(e-t)>Number.EPSILON||Math.abs(e-i)>Number.EPSILON||Math.abs(t-i)>Number.EPSILON))return void(this.V.value=0);const n=Math.max(e,t,i),s=Math.min(e,t,i),r=n-s;let o;switch(n){case s:o=0;break;case e:o=(t-i)/r+(te.toString(16).toUpperCase().padStart(2,"0"))).join("")}toSRGBAString(){return this.toSRGBA().map((e=>e.toString(16).toUpperCase().padStart(2,"0"))).join("")}toHSVA(){return[this.H.value,this.S.value,this.V.value,this.A.value]}toNumber(){return(this.R.value<<24)+(this.G.value<<16)+(this.B.value<<8)+this.A.value}setFromRGBANumber(e){this.A.value=(255&e)/255,this.B.value=(e>>8&255)/255,this.G.value=(e>>16&255)/255,this.R.value=(e>>24&255)/255,this.#c()}setFromSRGBANumber(e){this.A.value=(255&e)/255,this.B.value=pe.sRGBtoLinear((e>>8&255)/255),this.G.value=pe.sRGBtoLinear((e>>16&255)/255),this.R.value=pe.sRGBtoLinear((e>>24&255)/255),this.#c()}toString(){return ne.printLinearColor(this)}}class me extends se{static lookbehind="NSLOCTEXT";static attributes={namespace:String,key:String,value:String};constructor(e={}){super(e),this.namespace,this.key,this.value}}class ge extends se{static attributes={value:String};constructor(e={}){super(e),this.value}valueOf(){return this.value}toString(){return this.value}}class ve extends se{static attributes={objectName:ge,pinGuid:ae};constructor(e={}){super(e),this.objectName,this.pinGuid}}class be extends se{static attributes={R:Number,P:Number,Y:Number};constructor(e={}){super(e),this.R,this.P,this.Y}}class fe extends be{}class ye extends se{static attributes={X:Number,Y:Number,Z:Number};constructor(e={}){super(e),this.X,this.Y,this.Z}}class Ee extends ye{}class we extends se{static#h={"/Script/CoreUObject.LinearColor":pe,"/Script/CoreUObject.Rotator":be,"/Script/CoreUObject.Vector":ye,bool:Boolean,exec:String,int:ue,name:String,real:Number,string:String};static#d={"/Script/CoreUObject.Vector":Ee,"/Script/CoreUObject.Rotator":fe};static lookbehind="Pin";static attributes={PinId:ae,PinName:"",PinFriendlyName:new ie(me,!1,null),PinToolTip:"",Direction:new ie(String,!1,""),PinType:{PinCategory:"",PinSubCategory:"",PinSubCategoryObject:re,PinSubCategoryMemberReference:null,PinValueType:null,ContainerType:re,bIsReference:!1,bIsConst:!1,bIsWeakPointer:!1,bIsUObjectWrapper:!1,bSerializeAsSinglePrecisionFloat:!1},LinkedTo:new ie([ve],!1),DefaultValue:new ee((e=>new ie(we.getEntityType(e.getType(),!0)??String,!1,void 0,!0))),AutogeneratedDefaultValue:new ie(String,!1),DefaultObject:new ie(re,!1,null),PersistentGuid:ae,bHidden:!1,bNotConnectable:!1,bDefaultValueIsReadOnly:!1,bDefaultValueIsIgnored:!1,bAdvancedView:!1,bOrphanedPin:!1};static getEntityType(e,t=!1){const[i,n]=[this.#h[e],this.#d[e]];return t&&void 0!==n?n:i}constructor(e={}){super(e),this.PinId,this.PinName,this.PinFriendlyName,this.PinToolTip,this.Direction,this.PinType,this.LinkedTo,this.DefaultValue,this.AutogeneratedDefaultValue,this.DefaultObject,this.PersistentGuid,this.bHidden,this.bNotConnectable,this.bDefaultValueIsReadOnly,this.bDefaultValueIsIgnored,this.bAdvancedView,this.bOrphanedPin}getType(){return"struct"==this.PinType.PinCategory||"object"==this.PinType.PinCategory?this.PinType.PinSubCategoryObject.path:this.PinType.PinCategory}getDefaultValue(){return this.DefaultValue}isHidden(){return this.bHidden}isInput(){return!this.bHidden&&"EGPD_Output"!=this.Direction}isOutput(){return!this.bHidden&&"EGPD_Output"==this.Direction}isLinked(){return this.LinkedTo?.length>0??!1}linkTo(e,t){this.LinkedTo;const i=this.LinkedTo?.find((i=>i.objectName.toString()==e&&i.pinGuid.valueOf()==t.PinId.valueOf()));return!i&&((this.LinkedTo??(this.LinkedTo=[])).push(new ve({objectName:e,pinGuid:t.PinId})),!0)}unlinkFrom(e,t){const i=this.LinkedTo?.findIndex((i=>i.objectName.toString()==e&&i.pinGuid.valueOf()==t.PinId.valueOf()));return i>=0&&(1==this.LinkedTo.length?this.LinkedTo=void 0:this.LinkedTo.splice(i,1),!0)}getSubCategory(){return this.PinType.PinSubCategoryObject.path}}class Se extends se{static attributes={MemberName:String,MemberGuid:ae,bSelfContext:!1}}class Pe extends se{static attributes={Class:re,Name:"",bIsPureFunc:new ie(Boolean,!1,!1),VariableReference:new ie(Se,!1,null),FunctionReference:new ie(oe,!1,null),EventReference:new ie(oe,!1,null),TargetType:new ie(re,!1,null),NodePosX:ue,NodePosY:ue,AdvancedPinDisplay:new ie(le,!1,null),EnabledState:new ie(le,!1,null),NodeGuid:ae,ErrorType:new ie(ue,!1),ErrorMsg:new ie(String,!1,""),CustomProperties:[we]};static nameRegex=/(\w+)_(\d+)/;constructor(e={}){super(e),this.Class,this.Name,this.bIsPureFunc,this.VariableReference,this.FunctionReference,this.EventReference,this.TargetType,this.NodePosX,this.NodePosY,this.AdvancedPinDisplay,this.EnabledState,this.NodeGuid,this.ErrorType,this.ErrorMsg,this.CustomProperties}getClass(){return this.Class.path}getObjectName(e=!1){return e?this.getNameAndCounter()[0]:this.Name}getNameAndCounter(){const e=this.getObjectName(!1).match(Pe.nameRegex);return e&&3==e.length?[e[1],parseInt(e[2])]:["",0]}getDisplayName(){let e=this.FunctionReference?.MemberName;return e?(e=ne.formatStringName(e),e):(e=ne.formatStringName(this.getNameAndCounter()[0]),e)}getCounter(){return this.getNameAndCounter()[1]}}"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self&&self;function ke(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var Ce={exports:{}};"undefined"!=typeof self&&self;var xe=ke(Ce.exports=function(e){var t={};function i(n){if(t[n])return t[n].exports;var s=t[n]={i:n,l:!1,exports:{}};return e[n].call(s.exports,s,s.exports,i),s.l=!0,s.exports}return i.m=e,i.c=t,i.d=function(e,t,n){i.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:n})},i.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=0)}([function(e,t,i){function n(e){if(!(this instanceof n))return new n(e);this._=e}var s=n.prototype;function r(e,t){for(var i=0;i>7),buf:function(e){var t=o((function(e,t,i,n){return e.concat(i===n.length-1?Buffer.from([t,0]).readUInt16BE(0):n.readUInt16BE(i))}),[],e);return Buffer.from(a((function(e){return(e<<1&65535)>>8}),t))}(i.buf)}})),i}function u(){return"undefined"!=typeof Buffer}function c(){if(!u())throw new Error("Buffer global does not exist; please use webpack if you need to parse Buffers in the browser.")}function h(e){c();var t=o((function(e,t){return e+t}),0,e);if(t%8!=0)throw new Error("The bits ["+e.join(", ")+"] add up to "+t+" which is not an even number of bytes; the total should be divisible by 8");var i,s=t/8,r=(i=function(e){return e>48},o((function(e,t){return e||(i(t)?t:e)}),null,e));if(r)throw new Error(r+" bit range requested exceeds 48 bit (6 byte) Number max.");return new n((function(t,i){var n=s+i;return n>t.length?S(i,s.toString()+" bytes"):w(n,o((function(e,t){var i=l(t,e.buf);return{coll:e.coll.concat(i.v),buf:i.buf}}),{coll:[],buf:t.slice(i,n)},e).coll)}))}function d(e,t){return new n((function(i,n){return c(),n+t>i.length?S(n,t+" bytes for "+e):w(n+t,i.slice(n,n+t))}))}function p(e,t){if("number"!=typeof(i=t)||Math.floor(i)!==i||t<0||t>6)throw new Error(e+" requires integer length in range [0, 6].");var i}function m(e){return p("uintBE",e),d("uintBE("+e+")",e).map((function(t){return t.readUIntBE(0,e)}))}function g(e){return p("uintLE",e),d("uintLE("+e+")",e).map((function(t){return t.readUIntLE(0,e)}))}function v(e){return p("intBE",e),d("intBE("+e+")",e).map((function(t){return t.readIntBE(0,e)}))}function b(e){return p("intLE",e),d("intLE("+e+")",e).map((function(t){return t.readIntLE(0,e)}))}function f(e){return e instanceof n}function y(e){return"[object Array]"==={}.toString.call(e)}function E(e){return u()&&Buffer.isBuffer(e)}function w(e,t){return{status:!0,index:e,value:t,furthest:-1,expected:[]}}function S(e,t){return y(t)||(t=[t]),{status:!1,index:-1,value:null,furthest:e,expected:t}}function P(e,t){if(!t)return e;if(e.furthest>t.furthest)return e;var i=e.furthest===t.furthest?function(e,t){if(function(){if(void 0!==n._supportsSet)return n._supportsSet;var e="undefined"!=typeof Set;return n._supportsSet=e,e}()&&Array.from){for(var i=new Set(e),s=0;s=0;){if(o in i){n=i[o].line,0===r&&(r=i[o].lineStart);break}("\n"===e.charAt(o)||"\r"===e.charAt(o)&&"\n"!==e.charAt(o+1))&&(s++,0===r&&(r=o+1)),o--}var a=n+s,l=t-r;return i[t]={line:a,lineStart:r},{offset:t,line:a+1,column:l+1}}function x(e){if(!f(e))throw new Error("not a parser: "+e)}function N(e,t){return"string"==typeof e?e.charAt(t):e[t]}function A(e){if("number"!=typeof e)throw new Error("not a number: "+e)}function $(e){if("function"!=typeof e)throw new Error("not a function: "+e)}function L(e){if("string"!=typeof e)throw new Error("not a string: "+e)}var T=2,O=3,M=8,D=5*M,H=4*M,_=" ";function I(e,t){return new Array(t+1).join(e)}function B(e,t,i){var n=t-e.length;return n<=0?e:I(i,n)+e}function R(e,t,i,n){return{from:e-t>0?e-t:0,to:e+i>n?n:e+i}}function G(e,t){var i,n,s,r,l,u=t.index,c=u.offset,h=1;if(c===e.length)return"Got the end of the input";if(E(e)){var d=c-c%M,p=c-d,m=R(d,D,H+M,e.length),g=a((function(e){return a((function(e){return B(e.toString(16),2,"0")}),e)}),function(e,t){var i=e.length,n=[],s=0;if(i<=t)return[e.slice()];for(var r=0;r=4&&(i+=1),h=2,s=a((function(e){return e.length<=4?e.join(" "):e.slice(0,4).join(" ")+" "+e.slice(4).join(" ")}),g),(l=(8*(r.to>0?r.to-1:r.to)).toString(16).length)<2&&(l=2)}else{var v=e.split(/\r\n|[\n\r\u2028\u2029]/);i=u.column-1,n=u.line-1,r=R(n,T,O,v.length),s=v.slice(r.from,r.to),l=r.to.toString().length}var b=n-r.from;return E(e)&&(l=(8*(r.to>0?r.to-1:r.to)).toString(16).length)<2&&(l=2),o((function(t,n,s){var o,a=s===b,u=a?"> ":_;return o=E(e)?B((8*(r.from+s)).toString(16),l,"0"):B((r.from+s+1).toString(),l," "),[].concat(t,[u+o+" | "+n],a?[_+I(" ",l)+" | "+B("",i," ")+I("^",h)]:[])}),[],s).join("\n")}function F(e,t){return["\n","-- PARSING FAILED "+I("-",50),"\n\n",G(e,t),"\n\n",(i=t.expected,1===i.length?"Expected:\n\n"+i[0]:"Expected one of the following: \n\n"+i.join(", ")),"\n"].join("");var i}function z(e){return void 0!==e.flags?e.flags:[e.global?"g":"",e.ignoreCase?"i":"",e.multiline?"m":"",e.unicode?"u":"",e.sticky?"y":""].join("")}function j(){for(var e=[].slice.call(arguments),t=e.length,i=0;i=2?A(t):t=0;var i=function(e){return RegExp("^(?:"+e.source+")",z(e))}(e),s=""+e;return n((function(e,n){var r=i.exec(e.slice(n));if(r){if(0<=t&&t<=r.length){var o=r[0],a=r[t];return w(n+o.length,a)}return S(n,"valid match group (0 to "+r.length+") in "+s)}return S(n,s)}))}function Y(e){return n((function(t,i){return w(i,e)}))}function Z(e){return n((function(t,i){return S(i,e)}))}function J(e){if(f(e))return n((function(t,i){var n=e._(t,i);return n.index=i,n.value="",n}));if("string"==typeof e)return J(W(e));if(e instanceof RegExp)return J(q(e));throw new Error("not a string, regexp, or parser: "+e)}function Q(e){return x(e),n((function(t,i){var n=e._(t,i),s=t.slice(i,n.index);return n.status?S(i,'not "'+s+'"'):w(i,null)}))}function ee(e){return $(e),n((function(t,i){var n=N(t,i);return i=e.length?S(t,"any character/byte"):w(t+1,N(e,t))})),re=n((function(e,t){return w(e.length,e.slice(t))})),oe=n((function(e,t){return t=0})).desc(t)},n.optWhitespace=he,n.Parser=n,n.range=function(e,t){return ee((function(i){return e<=i&&i<=t})).desc(e+"-"+t)},n.regex=q,n.regexp=q,n.sepBy=K,n.sepBy1=X,n.seq=j,n.seqMap=V,n.seqObj=function(){for(var e,t={},i=0,s=(e=arguments,Array.prototype.slice.call(e)),r=s.length,o=0;o255)throw new Error("Value specified to byte constructor ("+e+"=0x"+e.toString(16)+") is larger in value than a single byte.");var t=(e>15?"0x":"0x0")+e.toString(16);return n((function(i,n){var s=N(i,n);return s===e?w(n+1,s):S(n,t)}))},buffer:function(e){return d("buffer",e).map((function(e){return Buffer.from(e)}))},encodedString:function(e,t){return d("string",t).map((function(t){return t.toString(e)}))},uintBE:m,uint8BE:m(1),uint16BE:m(2),uint32BE:m(4),uintLE:g,uint8LE:g(1),uint16LE:g(2),uint32LE:g(4),intBE:v,int8BE:v(1),int16BE:v(2),int32BE:v(4),intLE:b,int8LE:b(1),int16LE:b(2),int32LE:b(4),floatBE:d("floatBE",4).map((function(e){return e.readFloatBE(0)})),floatLE:d("floatLE",4).map((function(e){return e.readFloatLE(0)})),doubleBE:d("doubleBE",8).map((function(e){return e.readDoubleBE(0)})),doubleLE:d("doubleLE",8).map((function(e){return e.readDoubleLE(0)}))},e.exports=n}]));let Ne=xe;class Ae{static getGrammarForType(e,t,i=e.AttributeAnyValue){if(t instanceof ie){let n=Ae.getGrammarForType(e,t.type,i);return!t.serialized||t.type instanceof String||(n=n.wrap(Ne.string('"'),Ne.string('"'))),n}switch(ne.getType(t)){case Array:return Ne.seqMap(Ne.string("("),t.map((t=>Ae.getGrammarForType(e,ne.getType(t)))).reduce(((t,i)=>i&&t!==e.AttributeAnyValue?t.or(i):e.AttributeAnyValue)).trim(Ne.optWhitespace).sepBy(Ne.string(",")).skip(Ne.regex(/,?\s*/)),Ne.string(")"),((e,t,i)=>t));case Boolean:return e.Boolean;case oe:return e.FunctionReference;case ae:return e.Guid;case le:return e.Identifier;case ue:return e.Integer;case ce:return e.InvariantText;case pe:return e.LinearColor;case me:return e.LocalizedText;case Number:return e.Number;case re:return e.Reference;case we:return e.Pin;case ve:return e.PinReference;case de:return e.RealUnit;case be:return e.Rotator;case fe:return e.SimpleSerializationRotator;case Ee:return e.SimpleSerializationVector;case String:return e.String;case ye:return e.Vector;default:return i}}static createAttributeGrammar=(e,t,i=Ne.string("=").trim(Ne.optWhitespace))=>e.AttributeName.skip(i).chain((i=>{const n=i.split("."),s=ne.objectGet(t.attributes,n);return Ae.getGrammarForType(e,s,e.AttributeAnyValue).map((e=>t=>ne.objectSet(t,n,e,!0)))}));static createEntityGrammar=(e,t)=>Ne.seqMap(t.lookbehind?Ne.seq(Ne.string(t.lookbehind),Ne.optWhitespace,Ne.string("(")):Ne.string("("),Ae.createAttributeGrammar(e,t).trim(Ne.optWhitespace).sepBy(Ne.string(",")).skip(Ne.regex(/,?/).then(Ne.optWhitespace)),Ne.string(")"),((e,i,n)=>{let s={};return i.forEach((e=>e(s))),new t(s)}));InlineWhitespace=e=>Ne.regex(/[^\S\n]+/).desc("inline whitespace");InlineOptWhitespace=e=>Ne.regex(/[^\S\n]*/).desc("inline optional whitespace");MultilineWhitespace=e=>Ne.regex(/[^\S\n]*\n\s*/).desc("whitespace with at least a newline");Null=e=>Ne.seq(Ne.string("("),e.InlineOptWhitespace,Ne.string(")")).map((e=>null)).desc("null: ()");Boolean=e=>Ne.alt(Ne.string("True"),Ne.string("true"),Ne.string("False"),Ne.string("false")).map((e=>"true"===e.toLocaleLowerCase())).desc("either True or False");HexDigit=e=>Ne.regex(/[0-9a-fA-f]/).desc("hexadecimal digit");Number=e=>Ne.regex(/[-\+]?[0-9]+(?:\.[0-9]+)?/).map(Number).desc("a number");RealNumber=e=>Ne.regex(/[-\+]?[0-9]+\.[0-9]+/).map(Number).desc("a number written as real");RealUnit=e=>Ne.regex(/\+?[0-9]+(?:\.[0-9]+)?/).map(Number).assert((e=>e>=0&&e<=1)).desc("a number between 0 and 1");NaturalNumber=e=>Ne.regex(/0|[1-9]\d*/).map(Number).desc("a natural number");ColorNumber=e=>e.NaturalNumber.assert((e=>0<=e&&e<256),"the color must be between 0 and 256 excluded");Word=e=>Ne.regex(/[a-zA-Z]+/).desc("a word");String=e=>Ne.regex(/(?:[^"\\]|\\.)*/).wrap(Ne.string('"'),Ne.string('"')).map(ne.unescapeString).desc('string (with possibility to escape the quote using ")');ReferencePath=e=>Ne.seq(Ne.string("/"),e.PathSymbol.map((e=>e.toString())).sepBy1(Ne.string(".")).tieWith(".")).tie().atLeast(2).tie().desc('a path (words with possibly underscore, separated by ".", separated by "/")');AttributeName=e=>e.Word.sepBy1(Ne.string(".")).tieWith(".").desc('words separated by ""');None=e=>Ne.string("None").map((e=>new re({type:"None",path:""}))).desc("none");Integer=e=>Ne.regex(/[\-\+]?[0-9]+/).map((e=>new ue(e))).desc("an integer");Guid=e=>e.HexDigit.times(32).tie().map((e=>new ae({value:e}))).desc("32 digit hexadecimal value");Identifier=e=>Ne.regex(/\w+/).map((e=>new le(e)));PathSymbol=e=>Ne.regex(/[0-9\w]+/).map((e=>new ge({value:e})));Reference=e=>Ne.alt(e.None,...[e.ReferencePath.map((e=>new re({type:"",path:e})))].flatMap((e=>[e,e.trim(Ne.string('"'))])),Ne.seqMap(e.Word,Ne.optWhitespace,Ne.alt(...[e.ReferencePath].flatMap((e=>[e.wrap(Ne.string('"'),Ne.string('"')),e.wrap(Ne.string("'\""),Ne.string("\"'"))]))),((e,t,i)=>new re({type:e,path:i}))),e.Word.map((e=>new re({type:e,path:""}))));LocalizedText=e=>Ne.seqMap(Ne.string(me.lookbehind).skip(Ne.optWhitespace).skip(Ne.string("(")),e.String.trim(Ne.optWhitespace),Ne.string(","),e.String.trim(Ne.optWhitespace),Ne.string(","),e.String.trim(Ne.optWhitespace),Ne.string(")"),((e,t,i,n,s,r,o)=>new me({namespace:t,key:n,value:r})));InvariantText=e=>e.String.trim(Ne.optWhitespace).wrap(Ne.string(ce.lookbehind).skip(Ne.optWhitespace).skip(Ne.string("(")),Ne.string(")")).map((e=>new ce({value:e})));AttributeAnyValue=e=>Ne.alt(e.Null,e.None,e.Boolean,e.Number,e.Integer,e.String,e.Guid,e.LocalizedText,e.InvariantText,e.Reference,e.Vector,e.LinearColor);PinReference=e=>Ne.seqMap(e.PathSymbol,Ne.whitespace,e.Guid,((e,t,i)=>new ve({objectName:e,pinGuid:i})));Vector=e=>Ae.createEntityGrammar(e,ye);Rotator=e=>Ae.createEntityGrammar(e,be);SimpleSerializationRotator=e=>Ne.seqMap(e.Number,Ne.string(",").trim(Ne.optWhitespace),e.Number,Ne.string(",").trim(Ne.optWhitespace),e.Number,((e,t,i,n,s)=>new fe({R:s,P:e,Y:i})));SimpleSerializationVector=e=>Ne.seqMap(e.Number,Ne.string(",").trim(Ne.optWhitespace),e.Number,Ne.string(",").trim(Ne.optWhitespace),e.Number,((e,t,i,n,s)=>new Ee({X:e,Y:i,Z:s})));LinearColor=e=>Ae.createEntityGrammar(e,pe);FunctionReference=e=>Ae.createEntityGrammar(e,oe);KeyBinding=e=>Ne.alt(e.Identifier.map((e=>new he({Key:e}))),Ae.createEntityGrammar(e,he));Pin=e=>Ae.createEntityGrammar(e,we);CustomProperties=e=>Ne.string("CustomProperties").then(Ne.whitespace).then(e.Pin).map((e=>t=>{let i=ne.objectGet(t,["CustomProperties"],[]);i.push(e),ne.objectSet(t,["CustomProperties"],i,!0)}));Object=e=>Ne.seqMap(Ne.seq(Ne.string("Begin"),Ne.whitespace,Ne.string("Object"),Ne.whitespace),Ne.alt(e.CustomProperties,Ae.createAttributeGrammar(e,Pe)).sepBy1(Ne.whitespace),Ne.seq(e.MultilineWhitespace,Ne.string("End"),Ne.whitespace,Ne.string("Object")),((e,t,i)=>{let n={};return t.forEach((e=>e(n))),new Pe(n)}));MultipleObject=e=>e.Object.sepBy1(Ne.whitespace).trim(Ne.optWhitespace);LinearColorFromHex=e=>Ne.string("#").then(e.HexDigit.times(2).tie().times(3,4)).trim(Ne.optWhitespace).map((([e,t,i,n])=>new pe({R:parseInt(e,16)/255,G:parseInt(t,16)/255,B:parseInt(i,16)/255,A:n?parseInt(n,16)/255:1})));LinearColorFromRGBList=e=>Ne.seqMap(e.ColorNumber,Ne.string(",").skip(Ne.optWhitespace),e.ColorNumber,Ne.string(",").skip(Ne.optWhitespace),e.ColorNumber.map(Number),((e,t,i,n,s)=>new pe({R:e/255,G:i/255,B:s/255,A:1})));LinearColorFromRGB=e=>Ne.string("rgb").then(e.LinearColorFromRGBList.wrap(Ne.regex(/\(\s*/),Ne.regex(/\s*\)/)));LinearColorFromRGBA=e=>Ne.string("rgba").then(Ne.seqMap(e.ColorNumber,Ne.string(",").skip(Ne.optWhitespace),e.ColorNumber,Ne.string(",").skip(Ne.optWhitespace),e.ColorNumber.map(Number),Ne.string(",").skip(Ne.optWhitespace),Ne.regex(/0?\.\d+|[01]/).map(Number),((e,t,i,n,s,r,o)=>new pe({R:e/255,G:i/255,B:s/255,A:o}))).wrap(Ne.regex(/\(\s*/),Ne.regex(/\s*\)/)));LinearColorFromAnyColor=e=>Ne.alt(e.LinearColorFromRGBList,e.LinearColorFromHex,e.LinearColorFromRGB,e.LinearColorFromRGBA)}class $e{static grammar=xe.createLanguage(new Ae);constructor(e,t="",i=",",n=!1,s="=",r=(e=>e.join("."))){this.entityType=e,this.prefix=t,this.separator=i,this.trailingSeparator=n,this.attributeValueConjunctionSign=s,this.attributeKeyPrinter=r}deserialize(e){return this.read(e)}serialize(e,t=!1,i=e){return this.write(i,e,t)}read(e){throw new Error("Not implemented")}write(e,t,i){throw new Error("Not implemented")}writeValue(e,t,i,n){const s=te.getSerializer(ne.getType(t));if(!s)throw new Error("Unknown value type, a serializer must be registered in the SerializerFactory class");return s.write(e,t,n)}subWrite(e,t,i,n){let s="",r=t.concat("");const o=r.length-1;for(const t of Object.getOwnPropertyNames(i)){r[o]=t;const a=i[t];if(a?.constructor===Object)s+=(s.length?this.separator:"")+this.subWrite(e,r,a,n);else if(void 0!==a&&this.showProperty(e,i,r,a)){const t=ne.isSerialized(e,r);s+=(s.length?this.separator:"")+this.prefix+this.attributeKeyPrinter(r)+this.attributeValueConjunctionSign+(t?`"${this.writeValue(e,a,r,!0)}"`:this.writeValue(e,a,r,n))}}return this.trailingSeparator&&s.length&&1===r.length&&(s+=this.separator),s}showProperty(e,t,i,n){const s=this.entityType.attributes,r=ne.objectGet(s,i);return!(r instanceof ie)||!r.ignored&&(!ne.equals(r.value,n)||r.showDefault)}}class Le extends $e{constructor(){super(Pe," ","\n",!1)}showProperty(e,t,i,n){switch(i.toString()){case"Class":case"Name":case"CustomProperties":return!1}return super.showProperty(e,t,i,n)}read(e){const t=$e.grammar.Object.parse(e);if(!t.status)throw new Error("Error when trying to parse the object.");return t.value}readMultiple(e){const t=$e.grammar.MultipleObject.parse(e);if(!t.status)throw new Error("Error when trying to parse the object.");return t.value}write(e,t,i){return`Begin Object Class=${t.Class.path} Name=${this.writeValue(e,t.Name,["Name"],i)}\n${this.subWrite(e,[],t,i)+t.CustomProperties.map((e=>this.separator+this.prefix+"CustomProperties "+te.getSerializer(we).serialize(e))).join("")}\nEnd Object\n`}}class Te extends Q{static#p=new Le;#m;constructor(e,t,i={}){i.listenOnFocus??=!0,i.unlistenOnTextEdit??=!0,super(e,t,i);let n=this;this.#m=e=>n.copied()}listenEvents(){document.body.addEventListener("copy",this.#m)}unlistenEvents(){document.body.removeEventListener("copy",this.#m)}copied(){const e=this.blueprint.getNodes(!0).map((e=>Te.#p.serialize(e.entity,!1))).join("\n\n");navigator.clipboard.writeText(e)}}class Oe{static styles=s``;element;#g=[];get inputObjects(){return this.#g}constructed(e){this.element=e}createInputObjects(){return[]}connectedCallback(){}willUpdate(e){}update(e){}render(){return T``}firstUpdated(e){}updated(e){}inputSetup(){this.#g=this.createInputObjects()}cleanup(){this.#g.forEach((e=>e.unlistenDOMElement()))}}class Me extends Q{#v;constructor(e,t,i={}){i.activateAnyKey??=!1,i.activationKeys??=[],i.listenOnFocus??=!0,i.unlistenOnTextEdit??=!0,i.activationKeys instanceof Array||(i.activationKeys=[i.activationKeys]),i.activationKeys=i.activationKeys.map((e=>{if(e instanceof he)return e;if(e.constructor===String){const t=$e.grammar.KeyBinding.parse(e);if(t.status)return t.value}throw new Error("Unexpected key value")})),super(e,t,i),this.#v=this.options.activationKeys??[];let n=this;this.keyDownHandler=e=>{(this.options.activateAnyKey||n.#v.some((t=>(e=>e.bShift||"LeftShift"==e.Key||"RightShift"==e.Key)(t)==e.shiftKey&&(e=>e.bCtrl||"LeftControl"==e.Key||"RightControl"==e.Key)(t)==e.ctrlKey&&(e=>e.bAlt||"LeftAlt"==e.Key||"RightAlt"==e.Key)(t)==e.altKey&&J.Keys[t.Key]==e.code)))&&(i.consumeEvent&&e.stopImmediatePropagation(),n.fire(),document.removeEventListener("keydown",n.keyDownHandler),document.addEventListener("keyup",n.keyUpHandler))},this.keyUpHandler=e=>{(this.options.activateAnyKey||n.#v.some((t=>t.bShift&&"Shift"==e.key||t.bCtrl&&"Control"==e.key||t.bAlt&&"Alt"==e.key||t.bCmd&&"Meta"==e.key||J.Keys[t.Key]==e.code)))&&(i.consumeEvent&&e.stopImmediatePropagation(),n.unfire(),document.removeEventListener("keyup",this.keyUpHandler),document.addEventListener("keydown",this.keyDownHandler))}}listenEvents(){document.addEventListener("keydown",this.keyDownHandler)}unlistenEvents(){document.removeEventListener("keydown",this.keyDownHandler)}fire(){}unfire(){}}class De extends Me{constructor(e,t,i={}){i.activationKeys=J.deleteNodesKeyboardKey,super(e,t,i)}fire(){this.blueprint.removeGraphElement(...this.blueprint.getNodes(!0))}}class He extends Q{constructor(e,t,i={}){i.ignoreTranslateCompensate??=!1,i.movementSpace??=t.getGridDOMElement()??document.documentElement,super(e,t,i),this.movementSpace=i.movementSpace}locationFromEvent(e){const t=ne.convertLocation([e.clientX,e.clientY],this.movementSpace);return this.options.ignoreTranslateCompensate?t:this.blueprint.compensateTranslation(t)}}class _e extends He{#b=e=>{e.preventDefault();const t=this.locationFromEvent(e);this.wheel(Math.sign(e.deltaY*J.mouseWheelFactor),t)};#f=e=>e.preventDefault();constructor(e,t,i={}){i.listenOnFocus=!0,i.strictTarget??=!1,super(e,t,i),this.strictTarget=i.strictTarget}listenEvents(){this.movementSpace.addEventListener("wheel",this.#b,!1),this.movementSpace.parentElement?.addEventListener("wheel",this.#f)}unlistenEvents(){this.movementSpace.removeEventListener("wheel",this.#b,!1),this.movementSpace.parentElement?.removeEventListener("wheel",this.#f)}wheel(e,t){}}class Ie extends _e{#y=!1;get enableZoonIn(){return this.#y}set enableZoonIn(e){(e=Boolean(e))!=this.#y&&(this.#y=e)}wheel(e,t){let i=this.blueprint.getZoom();e=-e,!this.enableZoonIn&&0==i&&e>0||(i+=e,this.blueprint.setZoom(i,t))}}class Be extends Me{#E;constructor(e,t,i={}){i.activationKeys=J.enableZoomIn,super(e,t,i)}fire(){this.#E=this.blueprint.getInputObject(Ie),this.#E.enableZoonIn=!0}unfire(){this.#E.enableZoonIn=!1}}class Re extends Me{constructor(e,t,i={}){i.activationKeys=J.selectAllKeyboardKey,super(e,t,i)}fire(){this.blueprint.selectAll()}}class Ge extends Y{static properties={};#w=[];#t;get blueprint(){return this.#t}set blueprint(e){this.#t=e}#S;get entity(){return this.#S}set entity(e){this.#S=e}#P;get template(){return this.#P}inputObjects=[];constructor(e,t){super(),this.#S=e,this.#P=t,this.inputObjects=[],this.#P.constructed(this)}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.blueprint=this.closest("ueb-blueprint"),this.template.connectedCallback()}willUpdate(e){super.willUpdate(e),this.template.willUpdate(e)}update(e){super.update(e),this.template.update(e)}render(){return this.template.render()}firstUpdated(e){super.firstUpdated(e),this.template.firstUpdated(e),this.template.inputSetup()}updated(e){super.updated(e),this.template.updated(e),this.#w.forEach((t=>t(e))),this.#w=[]}disconnectedCallback(){super.disconnectedCallback(),this.template.cleanup()}addNextUpdatedCallbacks(e,t=!1){this.#w.push(e),t&&this.requestUpdate()}isSameGraph(e){return this.blueprint&&this.blueprint==e?.blueprint}getInputObject(e){return this.template.inputObjects.find((t=>t.constructor==e))}}class Fe extends Ge{static properties={...super.properties,locationX:{type:Number,attribute:!1},locationY:{type:Number,attribute:!1}};static dragEventName=J.dragEventName;static dragGeneralEventName=J.dragGeneralEventName;constructor(e,t){super(e,t),this.locationX=0,this.locationY=0}setLocation([e,t]){const i=[e-this.locationX,t-this.locationY];if(this.locationX=e,this.locationY=t,this.blueprint){const e=new CustomEvent(this.constructor.dragEventName,{detail:{value:i},bubbles:!1,cancelable:!0});this.dispatchEvent(e)}}addLocation([e,t]){this.setLocation([this.locationX+e,this.locationY+t])}dispatchDragEvent(e){const t=new CustomEvent(this.constructor.dragGeneralEventName,{detail:{value:e},bubbles:!0,cancelable:!0});this.dispatchEvent(t)}snapToGrid(){const e=ne.snapToGrid([this.locationX,this.locationY],J.gridSize);this.locationX==e[0]&&this.locationY==e[1]||this.setLocation(e)}}class ze extends He{#k=e=>{if(this.blueprint.setFocused(!0),e.button===this.options.clickButton)this.options.strictTarget&&e.target!=e.currentTarget||(this.options.consumeEvent&&e.stopImmediatePropagation(),this.#C.addEventListener("mousemove",this.#x),document.addEventListener("mouseup",this.#N),this.clickedPosition=this.locationFromEvent(e),this.blueprint.mousePosition[0]=this.clickedPosition[0],this.blueprint.mousePosition[1]=this.clickedPosition[1],this.target instanceof Fe&&(this.clickedOffset=[this.clickedPosition[0]-this.target.locationX,this.clickedPosition[1]-this.target.locationY]),this.clicked(this.clickedPosition));else this.options.exitAnyButton||this.#N(e)};#x=e=>{this.options.consumeEvent&&e.stopImmediatePropagation(),this.#C.removeEventListener("mousemove",this.#x),this.#C.addEventListener("mousemove",this.#A);const t=this.getEvent(J.trackingMouseEventName.begin);this.#$=0==this.target.dispatchEvent(t);const i=this.locationFromEvent(e);this.mouseLocation=ne.snapToGrid(this.clickedPosition,this.stepSize),this.startDrag(i),this.started=!0};#A=e=>{this.options.consumeEvent&&e.stopImmediatePropagation();const t=this.locationFromEvent(e),i=[e.movementX,e.movementY];this.dragTo(t,i),this.#$&&(this.blueprint.mousePosition=this.locationFromEvent(e))};#N=e=>{if(!this.options.exitAnyButton||e.button==this.options.clickButton){if(this.options.consumeEvent&&e.stopImmediatePropagation(),this.#C.removeEventListener("mousemove",this.#x),this.#C.removeEventListener("mousemove",this.#A),document.removeEventListener("mouseup",this.#N),this.started&&this.endDrag(),this.unclicked(),this.#$){const e=this.getEvent(J.trackingMouseEventName.end);this.target.dispatchEvent(e),this.#$=!1}this.started=!1}};#$=!1;#C;#L;clickedOffset=[0,0];clickedPosition=[0,0];mouseLocation=[0,0];started=!1;stepSize=1;constructor(e,t,i={}){i.clickButton??=0,i.consumeEvent??=!0,i.draggableElement??=e,i.exitAnyButton??=!0,i.moveEverywhere??=!1,i.movementSpace??=t?.getGridDOMElement(),i.repositionOnClick??=!1,i.strictTarget??=!1,super(e,t,i),this.stepSize=parseInt(i?.stepSize??J.gridSize),this.#C=this.options.moveEverywhere?document.documentElement:this.movementSpace,this.#L=this.options.draggableElement,this.listenEvents()}listenEvents(){this.#L.addEventListener("mousedown",this.#k),2==this.options.clickButton&&this.#L.addEventListener("contextmenu",(e=>e.preventDefault()))}unlistenEvents(){this.#L.removeEventListener("mousedown",this.#k)}getEvent(e){return new CustomEvent(e,{detail:{tracker:this},bubbles:!0,cancelable:!0})}clicked(e){}startDrag(e){}dragTo(e,t){}endDrag(){}unclicked(e){}}class je extends ze{startDrag(){this.blueprint.scrolling=!0}dragTo(e,t){this.blueprint.scrollDelta([-t[0],-t[1]])}endDrag(){this.blueprint.scrolling=!1}}class Ve extends He{#T=null;#O;#M;#D;constructor(e,t,i={}){i.listenOnFocus=!0,super(e,t,i);let n=this;this.#O=e=>{e.preventDefault(),n.blueprint.mousePosition=n.locationFromEvent(e)},this.#M=e=>{n.#T||(e.preventDefault(),this.#T=e.detail.tracker,n.unlistenMouseMove())},this.#D=e=>{n.#T==e.detail.tracker&&(e.preventDefault(),n.#T=null,n.listenMouseMove())}}listenMouseMove(){this.target.addEventListener("mousemove",this.#O)}unlistenMouseMove(){this.target.removeEventListener("mousemove",this.#O)}listenEvents(){this.listenMouseMove(),this.blueprint.addEventListener(J.trackingMouseEventName.begin,this.#M),this.blueprint.addEventListener(J.trackingMouseEventName.end,this.#D)}unlistenEvents(){this.unlistenMouseMove(),this.blueprint.removeEventListener(J.trackingMouseEventName.begin,this.#M),this.blueprint.removeEventListener(J.trackingMouseEventName.end,this.#D)}}class Ue extends Fe{static properties={...super.properties,selected:{type:Boolean,attribute:"data-selected",reflect:!0,converter:ne.booleanConverter}};constructor(...e){super(...e),this.selected=!1,this.listeningDrag=!1;let t=this;this.dragHandler=e=>t.addLocation(e.detail.value)}connectedCallback(){super.connectedCallback(),this.setSelected(this.selected)}disconnectedCallback(){super.disconnectedCallback(),this.blueprint.removeEventListener(J.nodeDragGeneralEventName,this.dragHandler)}setSelected(e=!0){this.selected=e,this.blueprint&&(this.selected?(this.listeningDrag=!0,this.blueprint.addEventListener(J.nodeDragGeneralEventName,this.dragHandler)):(this.blueprint.removeEventListener(J.nodeDragGeneralEventName,this.dragHandler),this.listeningDrag=!1))}}class Ke extends ze{clicked(e){this.options.repositionOnClick&&(this.target.setLocation(this.stepSize>1?ne.snapToGrid(e,this.stepSize):e),this.clickedOffset=[0,0])}dragTo(e,t){const i=[this.target.locationX,this.target.locationY],[n,s]=this.stepSize>1?[ne.snapToGrid(e,this.stepSize),ne.snapToGrid(i,this.stepSize)]:[e,i];0==(t=[n[0]-this.mouseLocation[0],n[1]-this.mouseLocation[1]])[0]&&0==t[1]||(t[0]+=s[0]-this.target.locationX,t[1]+=s[1]-this.target.locationY,this.dragAction(n,t),this.mouseLocation=n)}dragAction(e,t){this.target.setLocation([e[0]-this.clickedOffset[0],e[1]-this.clickedOffset[1]])}}class Xe extends Oe{getDraggableElement(){return this.element}createDraggableObject(){return new Ke(this.element,this.element.blueprint,{draggableElement:this.getDraggableElement()})}createInputObjects(){return[...super.createInputObjects(),this.createDraggableObject()]}}class We extends Xe{update(e){super.update(e),e.has("locationX")&&(this.element.style.left=`${this.element.locationX}px`),e.has("locationY")&&(this.element.style.top=`${this.element.locationY}px`)}}class qe extends Ke{startDrag(){this.target.selected||(this.blueprint.unselectAll(),this.target.setSelected(!0))}dragAction(e,t){this.target.dispatchDragEvent(t)}unclicked(){this.started||(this.blueprint.unselectAll(),this.target.setSelected(!0))}}class Ye extends We{getDraggableElement(){return this.element}createDraggableObject(){return new qe(this.element,this.element.blueprint,{draggableElement:this.getDraggableElement()})}firstUpdated(e){super.firstUpdated(e),this.element.selected&&!this.element.listeningDrag&&this.element.setSelected(!0)}}class Ze extends Ge{static properties={...super.properties,fromX:{type:Number,attribute:!1},fromY:{type:Number,attribute:!1},toX:{type:Number,attribute:!1},toY:{type:Number,attribute:!1}};constructor(...e){super(...e),this.fromX=0,this.fromY=0,this.toX=0,this.toY=0}setBothLocations([e,t]){this.fromX=e,this.fromY=t,this.toX=e,this.toY=t}addSourceLocation([e,t]){this.fromX+=e,this.fromY+=t}addDestinationLocation([e,t]){this.toX+=e,this.toY+=t}}class Je extends Oe{update(e){super.update(e);const[t,i,n,s]=[Math.round(this.element.fromX),Math.round(this.element.fromY),Math.round(this.element.toX),Math.round(this.element.toY)],[r,o,a,l]=[Math.min(t,n),Math.min(i,s),Math.abs(t-n),Math.abs(i-s)];(e.has("fromX")||e.has("toX"))&&(this.element.style.left=`${r}px`,this.element.style.width=`${a}px`),(e.has("fromY")||e.has("toY"))&&(this.element.style.top=`${o}px`,this.element.style.height=`${l}px`)}}class Qe extends Je{static decreasingValue(e,t){const i=-e*t[0]**2,n=t[1]-i/t[0];return e=>i/e+n}static clampedLine(e,t){if(e[0]>t[0]){const i=e;e=t,t=i}const i=(t[1]-e[1])/(t[0]-e[0]),n=e[1]-i*e[0];return s=>st[0]?t[1]:i*s+n}static c1DecreasingValue=Qe.decreasingValue(-.15,[100,15]);static c2DecreasingValue=Qe.decreasingValue(-.06,[500,130]);static c2Clamped=Qe.clampedLine([0,100],[200,30]);willUpdate(e){super.willUpdate(e);const t=this.element.sourcePin,i=this.element.destinationPin;if(e.has("fromX")||e.has("toX")){const e=t?.nodeElement.getType()==J.knotNodeTypeName,n=i?.nodeElement.getType()==J.knotNodeTypeName;!e||i&&!n||(t?.isInput()&&this.element.toX>this.element.fromX+J.distanceThreshold?this.element.sourcePin=t.nodeElement.template.outputPin:t?.isOutput()&&this.element.toXthis.element.fromX-J.distanceThreshold&&(this.element.destinationPin=i.nodeElement.template.inputPin))}const n=Math.max(Math.abs(this.element.fromX-this.element.toX),1),s=Math.max(n,J.linkMinWidth),r=n/s,o=this.element.originatesFromInput?this.element.fromXthis.element.toY?1:0)),this.element.style.setProperty("--ueb-start-percentage",`${Math.round(this.element.startPercentage)}%`),this.element.style.setProperty("--ueb-link-start",`${Math.round(this.element.startPixels)}`)}render(){const e="ueb-id-"+Math.floor(1e12*Math.random());return T` ${""!=this.element.linkMessageIcon||""!=this.element.linkMessageText?T`
${this.element.linkMessageText}
`:M}`}}class et extends Ze{static properties={...super.properties,source:{type:String,reflect:!0},destination:{type:String,reflect:!0},dragging:{type:Boolean,attribute:"data-dragging",converter:ne.booleanConverter,reflect:!0},originatesFromInput:{type:Boolean,attribute:!1},svgPathD:{type:String,attribute:!1},linkMessageIcon:{type:String,attribute:!1},linkMessageText:{type:String,attribute:!1}};#H;get sourcePin(){return this.#H}set sourcePin(e){this.#_(e,!1)}#I;get destinationPin(){return this.#I}set destinationPin(e){this.#_(e,!0)}#B;#R;#G;#F;#z;pathElement;constructor(e,t){super({},new Qe);const i=this;this.#B=()=>i.remove(),this.#R=e=>i.addSourceLocation(e.detail.value),this.#G=e=>i.addDestinationLocation(e.detail.value),this.#F=e=>i.setSourceLocation(),this.#z=e=>i.setDestinationLocation(),this.source=null,this.destination=null,this.dragging=!1,this.originatesFromInput=!1,this.startPercentage=0,this.svgPathD="",this.startPixels=0,this.linkMessageIcon="",this.linkMessageText="",e&&(this.sourcePin=e,t||(this.toX=this.fromX,this.toY=this.fromY)),t&&(this.destinationPin=t,e||(this.fromX=this.toX,this.fromY=this.toY)),this.#j()}#_(e,t){const i=()=>t?this.destinationPin:this.sourcePin;if(i()!=e){if(i()){const e=i().getNodeElement();e.removeEventListener(J.nodeDeleteEventName,this.#B),e.removeEventListener(J.nodeDragEventName,t?this.#G:this.#R),e.removeEventListener(J.nodeReflowEventName,t?this.#z:this.#F),this.#V()}if(t?this.#I=e:this.#H=e,i()){const e=i().getNodeElement();e.addEventListener(J.nodeDeleteEventName,this.#B),e.addEventListener(J.nodeDragEventName,t?this.#G:this.#R),e.addEventListener(J.nodeReflowEventName,t?this.#z:this.#F),t?this.setDestinationLocation():(this.setSourceLocation(),this.originatesFromInput=this.sourcePin.isInput()),this.#j()}}}#j(){this.sourcePin&&this.destinationPin&&(this.sourcePin.linkTo(this.destinationPin),this.destinationPin.linkTo(this.sourcePin))}#V(){this.sourcePin&&this.destinationPin&&(this.sourcePin.unlinkFrom(this.destinationPin),this.destinationPin.unlinkFrom(this.sourcePin))}disconnectedCallback(){super.disconnectedCallback(),this.#V(),this.sourcePin=null,this.destinationPin=null}setSourceLocation(e=null){if(null==e){const t=this;if(!this.hasUpdated||!this.sourcePin.hasUpdated)return void Promise.all([this.updateComplete,this.sourcePin.updateComplete]).then((()=>t.setSourceLocation()));e=this.sourcePin.template.getLinkLocation()}const[t,i]=e;this.fromX=t,this.fromY=i}setDestinationLocation(e=null){if(null==e){const t=this;if(!this.hasUpdated||!this.destinationPin.hasUpdated)return void Promise.all([this.updateComplete,this.destinationPin.updateComplete]).then((()=>t.setDestinationLocation()));e=this.destinationPin.template.getLinkLocation()}this.toX=e[0],this.toY=e[1]}startDragging(){this.dragging=!0}finishDragging(){this.dragging=!1}removeMessage(){this.linkMessageIcon="",this.linkMessageText=""}setMessageConvertType(){this.linkMessageIcon="ueb-icon-conver-type",this.linkMessageText=`Convert ${this.sourcePin.pinType} to ${this.destinationPin.pinType}.`}setMessageCorrect(){this.linkMessageIcon="ueb-icon-correct",this.linkMessageText=""}setMessageDirectionsIncompatible(){this.linkMessageIcon="ueb-icon-directions-incompatible",this.linkMessageText="Directions are not compatbile."}setMessagePlaceNode(){this.linkMessageIcon="ueb-icon-place-node",this.linkMessageText="Place a new node."}setMessageReplaceLink(){this.linkMessageIcon="ueb-icon-replace-link",this.linkMessageText="Replace existing input connections."}setMessageSameNode(){this.linkMessageIcon="ueb-icon-same-node",this.linkMessageText="Both are on the same node."}setMEssagetypesIncompatible(){this.linkMessageIcon="ueb-icon-types-incompatible",this.linkMessageText=`${this.sourcePin.pinType} is not compatible with ${this.destinationPin.pinType}.`}}class tt extends ze{#U;#K=null;#X=e=>{if(!this.enteredPin){this.linkValid=!1,this.enteredPin=e.target;const t=this.link.sourcePin??this.target,i=this.enteredPin;t.nodeElement.getType()==J.knotNodeTypeName||i.nodeElement.getType()==J.knotNodeTypeName?(this.link.setMessageCorrect(),this.linkValid=!0):t.getNodeElement()==i.getNodeElement()?this.link.setMessageSameNode():t.isOutput()==i.isOutput()||t.isOutput()==i.isOutput()?this.link.setMessageDirectionsIncompatible():this.blueprint.getLinks([t,i]).length?(this.link.setMessageReplaceLink(),this.linkValid=!0):(this.link.setMessageCorrect(),this.linkValid=!0)}};#W=e=>{this.enteredPin==e.target&&(this.enteredPin=null,this.linkValid=!1,this.link?.setMessagePlaceNode())};link;enteredPin;linkValid=!1;startDrag(e){this.target.nodeElement.getType()==J.knotNodeTypeName&&(this.#K=this.target),this.link=new et(this.target,null),this.blueprint.linksContainerElement.prepend(this.link),this.link.setMessagePlaceNode(),this.#U=this.blueprint.querySelectorAll("ueb-pin"),this.#U.forEach((e=>{if(e!=this.target){const t=e.template.getClickableElement();t.addEventListener("mouseenter",this.#X),t.addEventListener("mouseleave",this.#W)}})),this.link.startDragging(),this.link.setDestinationLocation(e)}dragTo(e,t){this.link.setDestinationLocation(e)}endDrag(){if(this.#U.forEach((e=>{e.removeEventListener("mouseenter",this.#X),e.removeEventListener("mouseleave",this.#W)})),this.enteredPin&&this.linkValid){if(this.#K){const e=this.#K!==this.link.sourcePin?this.link.sourcePin:this.enteredPin;if(this.#K.isInput()&&e.isInput()||this.#K.isOutput()&&e.isOutput()){const e=this.#K.isInput()?this.#K.nodeElement.template.outputPin:this.#K.nodeElement.template.inputPin;this.#K===this.link.sourcePin?this.link.sourcePin=e:this.enteredPin=e}}this.blueprint.addGraphElement(this.link),this.link.destinationPin=this.enteredPin,this.link.removeMessage(),this.link.finishDragging()}else this.link.finishDragging(),this.link.remove();this.enteredPin=null,this.link=null,this.#U=null}}class it extends Oe{#q;get iconElement(){return this.#q}constructed(e){super.constructed(e),this.element.dataset.id=this.element.GetPinIdValue()}connectedCallback(){super.connectedCallback(),this.element.nodeElement=this.element.closest("ueb-node")}createInputObjects(){return[new tt(this.getClickableElement(),this.element.blueprint,{moveEverywhere:!0})]}render(){const e=this.renderIcon(),t=T`
${this.renderName()} ${this.element.isInput()&&!this.element.entity.bDefaultValueIsIgnored?this.renderInput():T``}
`;return T`
${this.element.isInput()?T`${e}${t}`:T`${t}${e}`}
`}renderIcon(){return T``}renderName(){return T`${this.element.getPinDisplayName()}`}renderInput(){return T``}updated(e){if(this.element.isInput()&&e.has("isLinked")){const e=this.element.nodeElement;e.addNextUpdatedCallbacks((()=>e.dispatchReflowEvent())),e.requestUpdate()}}firstUpdated(e){super.firstUpdated(e),this.element.style.setProperty("--ueb-pin-color-rgb",J.pinColor[this.element.pinType]),this.#q=this.element.querySelector(".ueb-pin-icon")??this.element}getLinkLocation(){const e=this.iconElement.getBoundingClientRect(),t=ne.convertLocation([(e.left+e.right)/2,(e.top+e.bottom)/2],this.element.blueprint.gridElement);return this.element.blueprint.compensateTranslation(t)}getClickableElement(){return this.element}}class nt extends it{render(){return this.element.isOutput()?this.renderIcon():T``}getLinkLocation(){const e=(this.element.isInput()?this.element.nodeElement.template.outputPin.template:this).iconElement.getBoundingClientRect(),t=ne.convertLocation([this.element.isInput()?e.left+1:e.right+2,(e.top+e.bottom)/2],this.element.blueprint.gridElement);return this.element.blueprint.compensateTranslation(t)}}class st extends ze{constructor(e,t,i={}){i.consumeEvent=!0,super(e,t,i)}}class rt extends it{#Y;#Z=e=>this.element.setDefaultValue(this.#Y.checked);firstUpdated(e){super.firstUpdated(e),this.#Y=this.element.querySelector(".ueb-pin-input"),this.#Y.addEventListener("change",this.#Z)}cleanup(){super.cleanup(),this.#Y.removeEventListener("change",this.#Z)}createInputObjects(){return[...super.createInputObjects(),new st(this.#Y,this.element.blueprint)]}renderInput(){return T``}}class ot extends it{renderIcon(){return T``}renderName(){return T``}}class at extends it{static singleLineInput=!1;static selectOnFocus=!0;#J;get inputContentElements(){return this.#J}static stringFromInputToUE(e){return e.replace(/(?=\n\s*)\n$/,"").replaceAll("\n","\\r\n")}static stringFromUEToInput(e){return e.replaceAll(/(?:\r|(?<=(?:^|[^\\])(?:\\\\)*)\\r)(?=\n)/g,"").replace(/(?<=\n\s*)$/,"\n")}#Q=()=>this.setInputs(this.getInputs(),!0);firstUpdated(e){super.firstUpdated(e),this.#J=[...this.element.querySelectorAll("ueb-input")],this.#J.length&&this.#J.forEach((e=>{e.addEventListener("focusout",this.#Q)}))}cleanup(){super.cleanup(),this.#J.forEach((e=>{e.removeEventListener("focusout",this.#Q)}))}createInputObjects(){return[...super.createInputObjects(),...this.#J.map((e=>new st(e,this.element.blueprint)))]}getInput(){return this.getInputs().reduce(((e,t)=>e+t),"")}getInputs(){return this.#J.map((e=>ne.clearHTMLWhitespace(e.innerHTML)))}setInputs(e=[],t=!0){this.#J.forEach(this.constructor.singleLineInput?(t,i)=>t.innerText=e[i]:(t,i)=>t.innerText=e[i].replaceAll("\n","")),t&&this.setDefaultValue(e.map((e=>at.stringFromInputToUE(e))),e),this.element.addNextUpdatedCallbacks((()=>this.element.nodeElement.dispatchReflowEvent()))}setDefaultValue(e=[],t=e){this.element.setDefaultValue(e.join(""))}renderInput(){const e=this.constructor.singleLineInput,t=this.constructor.selectOnFocus;return T`
`}}class lt extends at{static singleLineInput=!0;setInputs(e=[],t=!1){e&&0!=e.length||(e=[this.getInput()]);let i=[];for(const t of e){let e=parseFloat(t);isNaN(e)&&(e=0,!1),i.push(e)}super.setInputs(e,!1),this.setDefaultValue(i,e)}setDefaultValue(e=[],t){this.element.setDefaultValue(e[0])}}class ut extends lt{setDefaultValue(e=[],t=e){this.element.setDefaultValue(e[0])}renderInput(){return T`
`}} +var W,q;null==X||X(I,G),(null!==(m=globalThis.litHtmlVersions)&&void 0!==m?m:globalThis.litHtmlVersions=[]).push("2.2.7");class Y extends p{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){var e,t;const i=super.createRenderRoot();return null!==(e=(t=this.renderOptions).renderBefore)&&void 0!==e||(t.renderBefore=i.firstChild),i}update(e){const t=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(e),this._$Do=((e,t,i)=>{var n,s;const r=null!==(n=null==i?void 0:i.renderBefore)&&void 0!==n?n:t;let o=r._$litPart$;if(void 0===o){const e=null!==(s=null==i?void 0:i.renderBefore)&&void 0!==s?s:null;r._$litPart$=o=new G(t.insertBefore(w(),e),e,void 0,null!=i?i:{})}return o._$AI(e),o})(t,this.renderRoot,this.renderOptions)}connectedCallback(){var e;super.connectedCallback(),null===(e=this._$Do)||void 0===e||e.setConnected(!0)}disconnectedCallback(){var e;super.disconnectedCallback(),null===(e=this._$Do)||void 0===e||e.setConnected(!1)}render(){return O}}Y.finalized=!0,Y._$litElement$=!0,null===(W=globalThis.litElementHydrateSupport)||void 0===W||W.call(globalThis,{LitElement:Y});const Z=globalThis.litElementPolyfillSupport;null==Z||Z({LitElement:Y}),(null!==(q=globalThis.litElementVersions)&&void 0!==q?q:globalThis.litElementVersions=[]).push("3.2.2");class J{static alphaPattern="repeating-conic-gradient(#7c8184 0% 25%, #c2c3c4 0% 50%) 50% / 10px 10px";static colorDragEventName="ueb-color-drag";static colorPickEventName="ueb-color-pick";static colorWindowEventName="ueb-color-window";static deleteNodesKeyboardKey="Delete";static dragGeneralEventName="ueb-drag-general";static dragEventName="ueb-drag";static editTextEventName={begin:"ueb-edit-text-begin",end:"ueb-edit-text-end"};static enableZoomIn=["LeftControl","RightControl"];static expandGridSize=400;static focusEventName={begin:"blueprint-focus",end:"blueprint-unfocus"};static fontSize=s``;static gridAxisLineColor=s``;static gridExpandThreshold=.25;static gridLineColor=s``;static gridLineWidth=1;static gridSet=8;static gridSetLineColor=s``;static gridShrinkThreshold=4;static gridSize=16;static hexColorRegex=/^\s*#(?[0-9a-fA-F]{2})(?[0-9a-fA-F]{2})(?[0-9a-fA-F]{2})([0-9a-fA-F]{2})?|#(?[0-9a-fA-F])(?[0-9a-fA-F])(?[0-9a-fA-F])\s*$/;static keysSeparator="+";static knotNodeTypeName="/Script/BlueprintGraph.K2Node_Knot";static linkCurveHeight=15;static linkCurveWidth=80;static linkMinWidth=100;static linkRightSVGPath=(e,t,i)=>{let n=100-e;return`M ${e} 0 C ${t} 0, ${i} 0, 50 50 S ${n-t+e} 100, ${n} 100`};static maxZoom=7;static minZoom=-12;static mouseWheelFactor=.2;static nodeDeleteEventName="ueb-node-delete";static nodeDragGeneralEventName="ueb-node-drag-general";static nodeDragEventName="ueb-node-drag";static nodeName=(e,t)=>`${e}_${t}`;static nodeRadius=8;static nodeReflowEventName="ueb-node-reflow";static pinColor={"/Script/CoreUObject.LinearColor":s``,"/Script/CoreUObject.Rotator":s``,"/Script/CoreUObject.Transform":s``,"/Script/CoreUObject.Vector":s``,"/Script/Engine.Actor":s``,bool:s``,default:s``,exec:s``,int:s``,name:s``,real:s``,string:s``};static selectAllKeyboardKey="(bCtrl=True,Key=A)";static distanceThreshold=5;static trackingMouseEventName={begin:"ueb-tracking-mouse-begin",end:"ueb-tracking-mouse-end"};static windowApplyEventName="ueb-window-apply";static windowCancelEventName="ueb-window-cancel";static windowCloseEventName="ueb-window-close";static ModifierKeys=["Ctrl","Shift","Alt","Meta"];static Keys={Backspace:"Backspace",Tab:"Tab",LeftControl:"ControlLeft",RightControl:"ControlRight",LeftShift:"ShiftLeft",RightShift:"ShiftRight",LeftAlt:"AltLeft",RightAlt:"AltRight",Enter:"Enter",Pause:"Pause",CapsLock:"CapsLock",Escape:"Escape",Space:"Space",PageUp:"PageUp",PageDown:"PageDown",End:"End",Home:"Home",ArrowLeft:"Left",ArrowUp:"Up",ArrowRight:"Right",ArrowDown:"Down",PrintScreen:"PrintScreen",Insert:"Insert",Delete:"Delete",Zero:"Digit0",One:"Digit1",Two:"Digit2",Three:"Digit3",Four:"Digit4",Five:"Digit5",Six:"Digit6",Seven:"Digit7",Eight:"Digit8",Nine:"Digit9",A:"KeyA",B:"KeyB",C:"KeyC",D:"KeyD",E:"KeyE",F:"KeyF",G:"KeyG",H:"KeyH",I:"KeyI",K:"KeyK",L:"KeyL",M:"KeyM",N:"KeyN",O:"KeyO",P:"KeyP",Q:"KeyQ",R:"KeyR",S:"KeyS",T:"KeyT",U:"KeyU",V:"KeyV",W:"KeyW",X:"KeyX",Y:"KeyY",Z:"KeyZ",NumPadZero:"Numpad0",NumPadOne:"Numpad1",NumPadTwo:"Numpad2",NumPadThree:"Numpad3",NumPadFour:"Numpad4",NumPadFive:"Numpad5",NumPadSix:"Numpad6",NumPadSeven:"Numpad7",NumPadEight:"Numpad8",NumPadNine:"Numpad9",Multiply:"NumpadMultiply",Add:"NumpadAdd",Subtract:"NumpadSubtract",Decimal:"NumpadDecimal",Divide:"NumpadDivide",F1:"F1",F2:"F2",F3:"F3",F4:"F4",F5:"F5",F6:"F6",F7:"F7",F8:"F8",F9:"F9",F10:"F10",F11:"F11",F12:"F12",NumLock:"NumLock",ScrollLock:"ScrollLock"}}class Q{#e;get target(){return this.#e}#t;get blueprint(){return this.#t}options;constructor(e,t,i={}){i.consumeEvent??=!1,i.listenOnFocus??=!1,i.unlistenOnTextEdit??=!1,this.#e=e,this.#t=t,this.options=i;let n=this;this.listenHandler=e=>n.listenEvents(),this.unlistenHandler=e=>n.unlistenEvents(),this.options.listenOnFocus&&(this.blueprint.addEventListener(J.focusEventName.begin,this.listenHandler),this.blueprint.addEventListener(J.focusEventName.end,this.unlistenHandler)),this.options.unlistenOnTextEdit&&(this.blueprint.addEventListener(J.editTextEventName.begin,this.unlistenHandler),this.blueprint.addEventListener(J.editTextEventName.end,this.listenHandler))}unlistenDOMElement(){this.unlistenEvents(),this.blueprint.removeEventListener(J.focusEventName.begin,this.listenHandler),this.blueprint.removeEventListener(J.focusEventName.end,this.unlistenHandler),this.blueprint.removeEventListener(J.editTextEventName.begin,this.unlistenHandler),this.blueprint.removeEventListener(J.editTextEventName.end,this.listenHandler)}listenEvents(){}unlistenEvents(){}}class ee{#i;constructor(e){this.#i=e}calculate(e){return this.#i(e)}}class te{static#n=new Map;static registerSerializer(e,t){te.#n.set(e,t)}static getSerializer(e){return te.#n.get(e)}}class ie{#s;get type(){return this.#s}set type(e){this.#s=e}#r=!0;get showDefault(){return this.#r}set showDefault(e){this.#r=e}#o;get value(){return this.#o}set value(e){this.#o=e}#a;get serialized(){return this.#a}set serialized(e){this.#a=e}#l;get ignored(){return this.#l}set ignored(e){this.#l=e}static sanitize(e,t){return void 0===t&&(t=e?.constructor),t&&!(e?.constructor===t||e instanceof t)&&(e=new t(e)),(e instanceof Boolean||e instanceof Number||e instanceof String)&&(e=e.valueOf()),e}constructor(e,t=!0,i,n=!1,s=!1){void 0===i&&(i=e instanceof Array?[]:n?"":()=>ie.sanitize(new e)),this.#s=e,this.#r=t,this.#o=i,this.#a=n,this.#l=s}}class ne{static emptyObj={};static booleanConverter={fromAttribute:(e,t)=>{},toAttribute:(e,t)=>!0===e?"true":!1===e?"false":""};static sigmoid(e,t=1.7){return 1/(1+e/(1-e)**-t)}static clamp(e,t,i){return Math.min(Math.max(e,t),i)}static getScale(e){const t=getComputedStyle(e).getPropertyValue("--ueb-scale");return""!=t?parseFloat(t):1}static minDecimals(e,t=1){const i=e*10**t;return Math.abs(i%1)>Number.EPSILON?e.toString():e.toFixed(t)}static roundDecimals(e,t=1){const i=10**t;return Math.round(e*i)/i}static convertLocation(e,t){const i=1/ne.getScale(t),n=t.getBoundingClientRect();return[Math.round((e[0]-n.x)*i),Math.round((e[1]-n.y)*i)]}static isSerialized(e,t,i=ne.objectGet(e.constructor.attributes,t)){return i instanceof ee?ne.isSerialized(e,t,i.calculate(e)):i instanceof ie&&(!!i.serialized||ne.isSerialized(e,t,i.type))}static objectGet(e,t,i){if(void 0!==e){if(!(t instanceof Array))throw new TypeError("Expected keys to be an array.");return 0!=t.length&&t[0]in e&&void 0!==e[t[0]]?1==t.length?e[t[0]]:ne.objectGet(e[t[0]],t.slice(1),i):i}}static objectSet(e,t,i,n=!1,s=Object){if(!(t instanceof Array))throw new TypeError("Expected keys to be an array.");if(1==t.length){if(n||t[0]in e||void 0===e[t[0]])return e[t[0]]=i,!0}else if(t.length>0)return!n||e[t[0]]instanceof Object||(e[t[0]]=new s),ne.objectSet(e[t[0]],t.slice(1),i,n,s);return!1}static equals(e,t){return(e=ie.sanitize(e))===(t=ie.sanitize(t))||(e instanceof Array&&t instanceof Array?e.length==t.length&&!e.find(((e,i)=>!ne.equals(e,t[i]))):void 0)}static getType(e){return null===e?null:e instanceof ie?ne.getType(e.type):e instanceof Function?e:e?.constructor}static snapToGrid(e,t){return 1===t?e:[t*Math.round(e[0]/t),t*Math.round(e[1]/t)]}static mergeArrays(e=[],t=[]){let i=[];for(let n=0;n","\n").replaceAll(/(\)/g,"")}static formatStringName(e){return e.trim().replace(/^b/,"").replaceAll(/(?<=[a-z])(?=[A-Z])|_|\s+/g," ")}static getIdFromReference(e){return e.replace(/(?:.+\.)?([^\.]+)$/,"$1").replaceAll(/(?<=[a-z\d])(?=[A-Z])|(?<=[a-zA-Z])(?=\d)|(?<=[A-Z]{2})(?=[A-Z][a-z])/g,"-").toLocaleLowerCase()}static printLinearColor(e){return`${Math.round(255*e.R.valueOf())}, ${Math.round(255*e.G.valueOf())}, ${Math.round(255*e.B.valueOf())}`}static getPolarCoordinates([e,t],i=!1){let n=Math.atan2(t,e);return i&&n<0&&(n=2*Math.PI+n),[Math.sqrt(e*e+t*t),n]}static getCartesianCoordinates([e,t]){return[e*Math.cos(t),e*Math.sin(t)]}static range(e,t,i=1){return Array.from({length:Math.ceil((t-e)/i)},((t,n)=>e+n*i))}}class se extends class{#u=new Map;subscribe(e,t){let i=this.#u;if(i.has(e)){let n=i.get(e);if(n.includes(t))return!1;n.push(t)}else{let n=!1,s=Object.getOwnPropertyDescriptor(this,e);if(!s&&(n=!0,s=Object.getOwnPropertyDescriptor(Object.getPrototypeOf(this),e)??{},!s))return!1;i.set(e,[t]);const r="value"in s,o="set"in s;if(!r&&!o)throw new Error(`Property ${e} is not a value or a setter`);const a=Symbol.for(e+"Storage"),l=Symbol.for(e+"ValInfo");Object.defineProperties(n?Object.getPrototypeOf(this):this,{[a]:{configurable:!0,enumerable:!1,...r?{value:this[e],writable:!0}:{get:s.get,set:s.set}},[l]:{configurable:!0,enumerable:!1,value:[n,r]},[e]:{configurable:!0,...r&&{get(){return this[a]}},set(t){this[a]=t,i.get(e).forEach((t=>{t(this[e])}))}}})}return!0}unsubscribe(e,t){let i=this.#u.get(e);if(!i?.includes(t))return!1;if(i.splice(i.indexOf(t),1),0==i.length){const t=Symbol.for(e+"Storage"),i=Symbol.for(e+"ValInfo"),n=this[i][0];this[i][1],Object.defineProperty(n?Object.getPrototypeOf(this):this,e,Object.getOwnPropertyDescriptor(n?Object.getPrototypeOf(this):this,t)),delete this[i],delete this[t]}return!0}}{static attributes={};constructor(e){super();const t=(e,i,n={},s="")=>{const r=Object.getOwnPropertyNames(n);for(let o of ne.mergeArrays(Object.getOwnPropertyNames(i),r)){let a=ne.objectGet(n,[o]),l=i[o],u=ne.getType(l);if(l instanceof ee&&(l=l.calculate(this),u=ne.getType(l)),o in i?!(r.length>0)||o in n||void 0===l||l instanceof ie&&(!l.showDefault||l.ignored)||console.warn(`${this.constructor.name} will add attribute ${s}${o} not defined in the serialized data`):console.warn(`Attribute ${s}${o} in the serialized data is not defined in ${this.constructor.name}.attributes`),u!==Object)if(void 0===a){if(l instanceof ie){if(!l.showDefault){e[o]=void 0;continue}l.serialized?l="":(u=l.type,l=l.value,l instanceof Function&&(l=l()))}l instanceof Array&&(l=[]),e[o]=ie.sanitize(l,u)}else a?.constructor===String&&l instanceof ie&&l.serialized&&l.type!==String&&(a=te.getSerializer(l.type).deserialize(a)),e[o]=ie.sanitize(a,ne.getType(l));else e[o]={},t(e[o],i[o],n[o],o+".")}},i=this.constructor.attributes;e.constructor!==Object&&1===Object.getOwnPropertyNames(i).length&&(e={[Object.getOwnPropertyNames(i)[0]]:e}),t(this,i,e)}}class re extends se{static attributes={type:String,path:String};constructor(e={}){e.constructor!==Object&&(e={path:e}),super(e),this.type,this.path}}class oe extends se{static attributes={MemberParent:re,MemberName:""};constructor(e={}){super(e),this.MemberParent,this.MemberName}}class ae extends se{static attributes={value:String};static generateGuid(e=!0){let t=new Uint32Array(4);!0===e&&crypto.getRandomValues(t);let i="";return t.forEach((e=>{i+=("0".repeat(8)+e.toString(16).toUpperCase()).slice(-8)})),new ae({value:i})}constructor(e={}){super(e),this.value}valueOf(){return this.value}toString(){return this.value}}class le extends se{static attributes={value:String};static attributeConverter={fromAttribute:(e,t)=>new le(e),toAttribute:(e,t)=>e.toString()};constructor(e={}){super(e),this.value}valueOf(){return this.value}toString(){return this.value}}class ue extends se{static attributes={value:Number};constructor(e=0){super(e),this.value=Math.round(this.value)}valueOf(){return this.value}toString(){return this.value.toString()}}class ce extends se{static lookbehind="INVTEXT";static attributes={value:String};constructor(e={}){super(e),this.value}}class he extends se{static attributes={ActionName:"",bShift:!1,bCtrl:!1,bAlt:!1,bCmd:!1,Key:le};constructor(e={}){e.ActionName=e.ActionName??"",e.bShift=e.bShift??!1,e.bCtrl=e.bCtrl??!1,e.bAlt=e.bAlt??!1,e.bCmd=e.bCmd??!1,super(e),this.ActionName,this.bShift,this.bCtrl,this.bAlt,this.bCmd,this.Key}}class de extends se{static attributes={value:0};constructor(e=0){super(e),this.value=ne.clamp(this.value,0,1)}valueOf(){return this.value}toString(){return this.value.toFixed(6)}}class pe extends se{static attributes={R:de,G:de,B:de,A:new ie(de,!0,(()=>new de(1)),!1,!0),H:new ie(de,!0,void 0,!1,!0),S:new ie(de,!0,void 0,!1,!0),V:new ie(de,!0,void 0,!1,!0)};static linearToSRGB(e){return e<=0?0:e>=1?1:e<.0031308?12.92*e:1.055*Math.pow(e,1/2.4)-.055}static sRGBtoLinear(e){return e<=0?0:e>=1?1:e<.04045?e/12.92:Math.pow((e+.055)/1.055,2.4)}constructor(e){super(e),this.R,this.G,this.B,this.A,this.H,this.S,this.V,this.#c()}#c(){const e=this.R.value,t=this.G.value,i=this.B.value;if(!(Math.abs(e-t)>Number.EPSILON||Math.abs(e-i)>Number.EPSILON||Math.abs(t-i)>Number.EPSILON))return void(this.V.value=0);const n=Math.max(e,t,i),s=Math.min(e,t,i),r=n-s;let o;switch(n){case s:o=0;break;case e:o=(t-i)/r+(te.toString(16).toUpperCase().padStart(2,"0"))).join("")}toSRGBAString(){return this.toSRGBA().map((e=>e.toString(16).toUpperCase().padStart(2,"0"))).join("")}toHSVA(){return[this.H.value,this.S.value,this.V.value,this.A.value]}toNumber(){return(this.R.value<<24)+(this.G.value<<16)+(this.B.value<<8)+this.A.value}setFromRGBANumber(e){this.A.value=(255&e)/255,this.B.value=(e>>8&255)/255,this.G.value=(e>>16&255)/255,this.R.value=(e>>24&255)/255,this.#c()}setFromSRGBANumber(e){this.A.value=(255&e)/255,this.B.value=pe.sRGBtoLinear((e>>8&255)/255),this.G.value=pe.sRGBtoLinear((e>>16&255)/255),this.R.value=pe.sRGBtoLinear((e>>24&255)/255),this.#c()}toString(){return ne.printLinearColor(this)}}class me extends se{static lookbehind="NSLOCTEXT";static attributes={namespace:String,key:String,value:String};constructor(e={}){super(e),this.namespace,this.key,this.value}}class ge extends se{static attributes={value:String};constructor(e={}){super(e),this.value}valueOf(){return this.value}toString(){return this.value}}class be extends se{static attributes={objectName:ge,pinGuid:ae};constructor(e={}){super(e),this.objectName,this.pinGuid}}class ve extends se{static attributes={R:Number,P:Number,Y:Number};constructor(e={}){super(e),this.R,this.P,this.Y}}class fe extends ve{}class ye extends se{static attributes={X:Number,Y:Number,Z:Number};constructor(e={}){super(e),this.X,this.Y,this.Z}}class Ee extends ye{}class we extends se{static#h={"/Script/CoreUObject.LinearColor":pe,"/Script/CoreUObject.Rotator":ve,"/Script/CoreUObject.Vector":ye,bool:Boolean,exec:String,int:ue,name:String,real:Number,string:String};static#d={"/Script/CoreUObject.Vector":Ee,"/Script/CoreUObject.Rotator":fe};static lookbehind="Pin";static attributes={PinId:ae,PinName:"",PinFriendlyName:new ie(me,!1,null),PinToolTip:new ie(String,!1,""),Direction:new ie(String,!1,""),PinType:{PinCategory:"",PinSubCategory:"",PinSubCategoryObject:re,PinSubCategoryMemberReference:null,PinValueType:null,ContainerType:re,bIsReference:!1,bIsConst:!1,bIsWeakPointer:!1,bIsUObjectWrapper:!1,bSerializeAsSinglePrecisionFloat:!1},LinkedTo:new ie([be],!1),DefaultValue:new ee((e=>new ie(we.getEntityType(e.getType(),!0)??String,!1,void 0,!0))),AutogeneratedDefaultValue:new ie(String,!1),DefaultObject:new ie(re,!1,null),PersistentGuid:ae,bHidden:!1,bNotConnectable:!1,bDefaultValueIsReadOnly:!1,bDefaultValueIsIgnored:!1,bAdvancedView:!1,bOrphanedPin:!1};static getEntityType(e,t=!1){const[i,n]=[this.#h[e],this.#d[e]];return t&&void 0!==n?n:i}constructor(e={}){super(e),this.PinId,this.PinName,this.PinFriendlyName,this.PinToolTip,this.Direction,this.PinType,this.LinkedTo,this.DefaultValue,this.AutogeneratedDefaultValue,this.DefaultObject,this.PersistentGuid,this.bHidden,this.bNotConnectable,this.bDefaultValueIsReadOnly,this.bDefaultValueIsIgnored,this.bAdvancedView,this.bOrphanedPin}getType(){return"struct"==this.PinType.PinCategory||"object"==this.PinType.PinCategory?this.PinType.PinSubCategoryObject.path:this.PinType.PinCategory}getDefaultValue(){return this.DefaultValue}isHidden(){return this.bHidden}isInput(){return!this.bHidden&&"EGPD_Output"!=this.Direction}isOutput(){return!this.bHidden&&"EGPD_Output"==this.Direction}isLinked(){return this.LinkedTo?.length>0??!1}linkTo(e,t){this.LinkedTo;const i=this.LinkedTo?.find((i=>i.objectName.toString()==e&&i.pinGuid.valueOf()==t.PinId.valueOf()));return!i&&((this.LinkedTo??(this.LinkedTo=[])).push(new be({objectName:e,pinGuid:t.PinId})),!0)}unlinkFrom(e,t){const i=this.LinkedTo?.findIndex((i=>i.objectName.toString()==e&&i.pinGuid.valueOf()==t.PinId.valueOf()));return i>=0&&(1==this.LinkedTo.length?this.LinkedTo=void 0:this.LinkedTo.splice(i,1),!0)}getSubCategory(){return this.PinType.PinSubCategoryObject.path}}class Se extends se{static attributes={MemberName:String,MemberGuid:ae,bSelfContext:!1}}class Pe extends se{static attributes={Class:re,Name:"",bIsPureFunc:new ie(Boolean,!1,!1),VariableReference:new ie(Se,!1,null),FunctionReference:new ie(oe,!1,null),EventReference:new ie(oe,!1,null),TargetType:new ie(re,!1,null),NodePosX:ue,NodePosY:ue,AdvancedPinDisplay:new ie(le,!1,null),EnabledState:new ie(le,!1,null),NodeGuid:ae,ErrorType:new ie(ue,!1),ErrorMsg:new ie(String,!1,""),CustomProperties:[we]};static nameRegex=/(\w+)_(\d+)/;constructor(e={}){super(e),this.Class,this.Name,this.bIsPureFunc,this.VariableReference,this.FunctionReference,this.EventReference,this.TargetType,this.NodePosX,this.NodePosY,this.AdvancedPinDisplay,this.EnabledState,this.NodeGuid,this.ErrorType,this.ErrorMsg,this.CustomProperties}getClass(){return this.Class.path}getObjectName(e=!1){return e?this.getNameAndCounter()[0]:this.Name}getNameAndCounter(){const e=this.getObjectName(!1).match(Pe.nameRegex);return e&&3==e.length?[e[1],parseInt(e[2])]:["",0]}getDisplayName(){let e=this.FunctionReference?.MemberName;return e?(e=ne.formatStringName(e),e):(e=ne.formatStringName(this.getNameAndCounter()[0]),e)}getCounter(){return this.getNameAndCounter()[1]}}"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self&&self;function ke(e){return e&&e.__esModule&&Object.prototype.hasOwnProperty.call(e,"default")?e.default:e}var Ce={exports:{}};"undefined"!=typeof self&&self;var xe=ke(Ce.exports=function(e){var t={};function i(n){if(t[n])return t[n].exports;var s=t[n]={i:n,l:!1,exports:{}};return e[n].call(s.exports,s,s.exports,i),s.l=!0,s.exports}return i.m=e,i.c=t,i.d=function(e,t,n){i.o(e,t)||Object.defineProperty(e,t,{configurable:!1,enumerable:!0,get:n})},i.r=function(e){Object.defineProperty(e,"__esModule",{value:!0})},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=0)}([function(e,t,i){function n(e){if(!(this instanceof n))return new n(e);this._=e}var s=n.prototype;function r(e,t){for(var i=0;i>7),buf:function(e){var t=o((function(e,t,i,n){return e.concat(i===n.length-1?Buffer.from([t,0]).readUInt16BE(0):n.readUInt16BE(i))}),[],e);return Buffer.from(a((function(e){return(e<<1&65535)>>8}),t))}(i.buf)}})),i}function u(){return"undefined"!=typeof Buffer}function c(){if(!u())throw new Error("Buffer global does not exist; please use webpack if you need to parse Buffers in the browser.")}function h(e){c();var t=o((function(e,t){return e+t}),0,e);if(t%8!=0)throw new Error("The bits ["+e.join(", ")+"] add up to "+t+" which is not an even number of bytes; the total should be divisible by 8");var i,s=t/8,r=(i=function(e){return e>48},o((function(e,t){return e||(i(t)?t:e)}),null,e));if(r)throw new Error(r+" bit range requested exceeds 48 bit (6 byte) Number max.");return new n((function(t,i){var n=s+i;return n>t.length?S(i,s.toString()+" bytes"):w(n,o((function(e,t){var i=l(t,e.buf);return{coll:e.coll.concat(i.v),buf:i.buf}}),{coll:[],buf:t.slice(i,n)},e).coll)}))}function d(e,t){return new n((function(i,n){return c(),n+t>i.length?S(n,t+" bytes for "+e):w(n+t,i.slice(n,n+t))}))}function p(e,t){if("number"!=typeof(i=t)||Math.floor(i)!==i||t<0||t>6)throw new Error(e+" requires integer length in range [0, 6].");var i}function m(e){return p("uintBE",e),d("uintBE("+e+")",e).map((function(t){return t.readUIntBE(0,e)}))}function g(e){return p("uintLE",e),d("uintLE("+e+")",e).map((function(t){return t.readUIntLE(0,e)}))}function b(e){return p("intBE",e),d("intBE("+e+")",e).map((function(t){return t.readIntBE(0,e)}))}function v(e){return p("intLE",e),d("intLE("+e+")",e).map((function(t){return t.readIntLE(0,e)}))}function f(e){return e instanceof n}function y(e){return"[object Array]"==={}.toString.call(e)}function E(e){return u()&&Buffer.isBuffer(e)}function w(e,t){return{status:!0,index:e,value:t,furthest:-1,expected:[]}}function S(e,t){return y(t)||(t=[t]),{status:!1,index:-1,value:null,furthest:e,expected:t}}function P(e,t){if(!t)return e;if(e.furthest>t.furthest)return e;var i=e.furthest===t.furthest?function(e,t){if(function(){if(void 0!==n._supportsSet)return n._supportsSet;var e="undefined"!=typeof Set;return n._supportsSet=e,e}()&&Array.from){for(var i=new Set(e),s=0;s=0;){if(o in i){n=i[o].line,0===r&&(r=i[o].lineStart);break}("\n"===e.charAt(o)||"\r"===e.charAt(o)&&"\n"!==e.charAt(o+1))&&(s++,0===r&&(r=o+1)),o--}var a=n+s,l=t-r;return i[t]={line:a,lineStart:r},{offset:t,line:a+1,column:l+1}}function x(e){if(!f(e))throw new Error("not a parser: "+e)}function N(e,t){return"string"==typeof e?e.charAt(t):e[t]}function A(e){if("number"!=typeof e)throw new Error("not a number: "+e)}function $(e){if("function"!=typeof e)throw new Error("not a function: "+e)}function L(e){if("string"!=typeof e)throw new Error("not a string: "+e)}var T=2,O=3,D=8,M=5*D,H=4*D,_=" ";function I(e,t){return new Array(t+1).join(e)}function B(e,t,i){var n=t-e.length;return n<=0?e:I(i,n)+e}function R(e,t,i,n){return{from:e-t>0?e-t:0,to:e+i>n?n:e+i}}function G(e,t){var i,n,s,r,l,u=t.index,c=u.offset,h=1;if(c===e.length)return"Got the end of the input";if(E(e)){var d=c-c%D,p=c-d,m=R(d,M,H+D,e.length),g=a((function(e){return a((function(e){return B(e.toString(16),2,"0")}),e)}),function(e,t){var i=e.length,n=[],s=0;if(i<=t)return[e.slice()];for(var r=0;r=4&&(i+=1),h=2,s=a((function(e){return e.length<=4?e.join(" "):e.slice(0,4).join(" ")+" "+e.slice(4).join(" ")}),g),(l=(8*(r.to>0?r.to-1:r.to)).toString(16).length)<2&&(l=2)}else{var b=e.split(/\r\n|[\n\r\u2028\u2029]/);i=u.column-1,n=u.line-1,r=R(n,T,O,b.length),s=b.slice(r.from,r.to),l=r.to.toString().length}var v=n-r.from;return E(e)&&(l=(8*(r.to>0?r.to-1:r.to)).toString(16).length)<2&&(l=2),o((function(t,n,s){var o,a=s===v,u=a?"> ":_;return o=E(e)?B((8*(r.from+s)).toString(16),l,"0"):B((r.from+s+1).toString(),l," "),[].concat(t,[u+o+" | "+n],a?[_+I(" ",l)+" | "+B("",i," ")+I("^",h)]:[])}),[],s).join("\n")}function F(e,t){return["\n","-- PARSING FAILED "+I("-",50),"\n\n",G(e,t),"\n\n",(i=t.expected,1===i.length?"Expected:\n\n"+i[0]:"Expected one of the following: \n\n"+i.join(", ")),"\n"].join("");var i}function z(e){return void 0!==e.flags?e.flags:[e.global?"g":"",e.ignoreCase?"i":"",e.multiline?"m":"",e.unicode?"u":"",e.sticky?"y":""].join("")}function j(){for(var e=[].slice.call(arguments),t=e.length,i=0;i=2?A(t):t=0;var i=function(e){return RegExp("^(?:"+e.source+")",z(e))}(e),s=""+e;return n((function(e,n){var r=i.exec(e.slice(n));if(r){if(0<=t&&t<=r.length){var o=r[0],a=r[t];return w(n+o.length,a)}return S(n,"valid match group (0 to "+r.length+") in "+s)}return S(n,s)}))}function Y(e){return n((function(t,i){return w(i,e)}))}function Z(e){return n((function(t,i){return S(i,e)}))}function J(e){if(f(e))return n((function(t,i){var n=e._(t,i);return n.index=i,n.value="",n}));if("string"==typeof e)return J(W(e));if(e instanceof RegExp)return J(q(e));throw new Error("not a string, regexp, or parser: "+e)}function Q(e){return x(e),n((function(t,i){var n=e._(t,i),s=t.slice(i,n.index);return n.status?S(i,'not "'+s+'"'):w(i,null)}))}function ee(e){return $(e),n((function(t,i){var n=N(t,i);return i=e.length?S(t,"any character/byte"):w(t+1,N(e,t))})),re=n((function(e,t){return w(e.length,e.slice(t))})),oe=n((function(e,t){return t=0})).desc(t)},n.optWhitespace=he,n.Parser=n,n.range=function(e,t){return ee((function(i){return e<=i&&i<=t})).desc(e+"-"+t)},n.regex=q,n.regexp=q,n.sepBy=K,n.sepBy1=X,n.seq=j,n.seqMap=V,n.seqObj=function(){for(var e,t={},i=0,s=(e=arguments,Array.prototype.slice.call(e)),r=s.length,o=0;o255)throw new Error("Value specified to byte constructor ("+e+"=0x"+e.toString(16)+") is larger in value than a single byte.");var t=(e>15?"0x":"0x0")+e.toString(16);return n((function(i,n){var s=N(i,n);return s===e?w(n+1,s):S(n,t)}))},buffer:function(e){return d("buffer",e).map((function(e){return Buffer.from(e)}))},encodedString:function(e,t){return d("string",t).map((function(t){return t.toString(e)}))},uintBE:m,uint8BE:m(1),uint16BE:m(2),uint32BE:m(4),uintLE:g,uint8LE:g(1),uint16LE:g(2),uint32LE:g(4),intBE:b,int8BE:b(1),int16BE:b(2),int32BE:b(4),intLE:v,int8LE:v(1),int16LE:v(2),int32LE:v(4),floatBE:d("floatBE",4).map((function(e){return e.readFloatBE(0)})),floatLE:d("floatLE",4).map((function(e){return e.readFloatLE(0)})),doubleBE:d("doubleBE",8).map((function(e){return e.readDoubleBE(0)})),doubleLE:d("doubleLE",8).map((function(e){return e.readDoubleLE(0)}))},e.exports=n}]));let Ne=xe;class Ae{static getGrammarForType(e,t,i=e.AttributeAnyValue){if(t instanceof ie){let n=Ae.getGrammarForType(e,t.type,i);return!t.serialized||t.type instanceof String||(n=n.wrap(Ne.string('"'),Ne.string('"'))),n}switch(ne.getType(t)){case Array:return Ne.seqMap(Ne.string("("),t.map((t=>Ae.getGrammarForType(e,ne.getType(t)))).reduce(((t,i)=>i&&t!==e.AttributeAnyValue?t.or(i):e.AttributeAnyValue)).trim(Ne.optWhitespace).sepBy(Ne.string(",")).skip(Ne.regex(/,?\s*/)),Ne.string(")"),((e,t,i)=>t));case Boolean:return e.Boolean;case oe:return e.FunctionReference;case ae:return e.Guid;case le:return e.Identifier;case ue:return e.Integer;case ce:return e.InvariantText;case pe:return e.LinearColor;case me:return e.LocalizedText;case Number:return e.Number;case re:return e.Reference;case we:return e.Pin;case be:return e.PinReference;case de:return e.RealUnit;case ve:return e.Rotator;case fe:return e.SimpleSerializationRotator;case Ee:return e.SimpleSerializationVector;case String:return e.String;case ye:return e.Vector;default:return i}}static createAttributeGrammar=(e,t,i=Ne.string("=").trim(Ne.optWhitespace))=>e.AttributeName.skip(i).chain((i=>{const n=i.split("."),s=ne.objectGet(t.attributes,n);return Ae.getGrammarForType(e,s,e.AttributeAnyValue).map((e=>t=>ne.objectSet(t,n,e,!0)))}));static createEntityGrammar=(e,t)=>Ne.seqMap(t.lookbehind?Ne.seq(Ne.string(t.lookbehind),Ne.optWhitespace,Ne.string("(")):Ne.string("("),Ae.createAttributeGrammar(e,t).trim(Ne.optWhitespace).sepBy(Ne.string(",")).skip(Ne.regex(/,?/).then(Ne.optWhitespace)),Ne.string(")"),((e,i,n)=>{let s={};return i.forEach((e=>e(s))),new t(s)}));InlineWhitespace=e=>Ne.regex(/[^\S\n]+/).desc("inline whitespace");InlineOptWhitespace=e=>Ne.regex(/[^\S\n]*/).desc("inline optional whitespace");MultilineWhitespace=e=>Ne.regex(/[^\S\n]*\n\s*/).desc("whitespace with at least a newline");Null=e=>Ne.seq(Ne.string("("),e.InlineOptWhitespace,Ne.string(")")).map((e=>null)).desc("null: ()");Boolean=e=>Ne.alt(Ne.string("True"),Ne.string("true"),Ne.string("False"),Ne.string("false")).map((e=>"true"===e.toLocaleLowerCase())).desc("either True or False");HexDigit=e=>Ne.regex(/[0-9a-fA-f]/).desc("hexadecimal digit");Number=e=>Ne.regex(/[-\+]?[0-9]+(?:\.[0-9]+)?/).map(Number).desc("a number");RealNumber=e=>Ne.regex(/[-\+]?[0-9]+\.[0-9]+/).map(Number).desc("a number written as real");RealUnit=e=>Ne.regex(/\+?[0-9]+(?:\.[0-9]+)?/).map(Number).assert((e=>e>=0&&e<=1)).desc("a number between 0 and 1");NaturalNumber=e=>Ne.regex(/0|[1-9]\d*/).map(Number).desc("a natural number");ColorNumber=e=>e.NaturalNumber.assert((e=>0<=e&&e<256),"the color must be between 0 and 256 excluded");Word=e=>Ne.regex(/[a-zA-Z]+/).desc("a word");String=e=>Ne.regex(/(?:[^"\\]|\\.)*/).wrap(Ne.string('"'),Ne.string('"')).map(ne.unescapeString).desc('string (with possibility to escape the quote using ")');ReferencePath=e=>Ne.seq(Ne.string("/"),e.PathSymbol.map((e=>e.toString())).sepBy1(Ne.string(".")).tieWith(".")).tie().atLeast(2).tie().desc('a path (words with possibly underscore, separated by ".", separated by "/")');AttributeName=e=>e.Word.sepBy1(Ne.string(".")).tieWith(".").desc('words separated by ""');None=e=>Ne.string("None").map((e=>new re({type:"None",path:""}))).desc("none");Integer=e=>Ne.regex(/[\-\+]?[0-9]+/).map((e=>new ue(e))).desc("an integer");Guid=e=>e.HexDigit.times(32).tie().map((e=>new ae({value:e}))).desc("32 digit hexadecimal value");Identifier=e=>Ne.regex(/\w+/).map((e=>new le(e)));PathSymbol=e=>Ne.regex(/[0-9\w]+/).map((e=>new ge({value:e})));Reference=e=>Ne.alt(e.None,...[e.ReferencePath.map((e=>new re({type:"",path:e})))].flatMap((e=>[e,e.trim(Ne.string('"'))])),Ne.seqMap(e.Word,Ne.optWhitespace,Ne.alt(...[e.ReferencePath].flatMap((e=>[e.wrap(Ne.string('"'),Ne.string('"')),e.wrap(Ne.string("'\""),Ne.string("\"'"))]))),((e,t,i)=>new re({type:e,path:i}))),e.Word.map((e=>new re({type:e,path:""}))));LocalizedText=e=>Ne.seqMap(Ne.string(me.lookbehind).skip(Ne.optWhitespace).skip(Ne.string("(")),e.String.trim(Ne.optWhitespace),Ne.string(","),e.String.trim(Ne.optWhitespace),Ne.string(","),e.String.trim(Ne.optWhitespace),Ne.string(")"),((e,t,i,n,s,r,o)=>new me({namespace:t,key:n,value:r})));InvariantText=e=>e.String.trim(Ne.optWhitespace).wrap(Ne.string(ce.lookbehind).skip(Ne.optWhitespace).skip(Ne.string("(")),Ne.string(")")).map((e=>new ce({value:e})));AttributeAnyValue=e=>Ne.alt(e.Null,e.None,e.Boolean,e.Number,e.Integer,e.String,e.Guid,e.LocalizedText,e.InvariantText,e.Reference,e.Vector,e.LinearColor);PinReference=e=>Ne.seqMap(e.PathSymbol,Ne.whitespace,e.Guid,((e,t,i)=>new be({objectName:e,pinGuid:i})));Vector=e=>Ae.createEntityGrammar(e,ye);Rotator=e=>Ae.createEntityGrammar(e,ve);SimpleSerializationRotator=e=>Ne.seqMap(e.Number,Ne.string(",").trim(Ne.optWhitespace),e.Number,Ne.string(",").trim(Ne.optWhitespace),e.Number,((e,t,i,n,s)=>new fe({R:s,P:e,Y:i})));SimpleSerializationVector=e=>Ne.seqMap(e.Number,Ne.string(",").trim(Ne.optWhitespace),e.Number,Ne.string(",").trim(Ne.optWhitespace),e.Number,((e,t,i,n,s)=>new Ee({X:e,Y:i,Z:s})));LinearColor=e=>Ae.createEntityGrammar(e,pe);FunctionReference=e=>Ae.createEntityGrammar(e,oe);KeyBinding=e=>Ne.alt(e.Identifier.map((e=>new he({Key:e}))),Ae.createEntityGrammar(e,he));Pin=e=>Ae.createEntityGrammar(e,we);CustomProperties=e=>Ne.string("CustomProperties").then(Ne.whitespace).then(e.Pin).map((e=>t=>{let i=ne.objectGet(t,["CustomProperties"],[]);i.push(e),ne.objectSet(t,["CustomProperties"],i,!0)}));Object=e=>Ne.seqMap(Ne.seq(Ne.string("Begin"),Ne.whitespace,Ne.string("Object"),Ne.whitespace),Ne.alt(e.CustomProperties,Ae.createAttributeGrammar(e,Pe)).sepBy1(Ne.whitespace),Ne.seq(e.MultilineWhitespace,Ne.string("End"),Ne.whitespace,Ne.string("Object")),((e,t,i)=>{let n={};return t.forEach((e=>e(n))),new Pe(n)}));MultipleObject=e=>e.Object.sepBy1(Ne.whitespace).trim(Ne.optWhitespace);LinearColorFromHex=e=>Ne.string("#").then(e.HexDigit.times(2).tie().times(3,4)).trim(Ne.optWhitespace).map((([e,t,i,n])=>new pe({R:parseInt(e,16)/255,G:parseInt(t,16)/255,B:parseInt(i,16)/255,A:n?parseInt(n,16)/255:1})));LinearColorFromRGBList=e=>Ne.seqMap(e.ColorNumber,Ne.string(",").skip(Ne.optWhitespace),e.ColorNumber,Ne.string(",").skip(Ne.optWhitespace),e.ColorNumber.map(Number),((e,t,i,n,s)=>new pe({R:e/255,G:i/255,B:s/255,A:1})));LinearColorFromRGB=e=>Ne.string("rgb").then(e.LinearColorFromRGBList.wrap(Ne.regex(/\(\s*/),Ne.regex(/\s*\)/)));LinearColorFromRGBA=e=>Ne.string("rgba").then(Ne.seqMap(e.ColorNumber,Ne.string(",").skip(Ne.optWhitespace),e.ColorNumber,Ne.string(",").skip(Ne.optWhitespace),e.ColorNumber.map(Number),Ne.string(",").skip(Ne.optWhitespace),Ne.regex(/0?\.\d+|[01]/).map(Number),((e,t,i,n,s,r,o)=>new pe({R:e/255,G:i/255,B:s/255,A:o}))).wrap(Ne.regex(/\(\s*/),Ne.regex(/\s*\)/)));LinearColorFromAnyColor=e=>Ne.alt(e.LinearColorFromRGBList,e.LinearColorFromHex,e.LinearColorFromRGB,e.LinearColorFromRGBA)}class $e{static grammar=xe.createLanguage(new Ae);constructor(e,t="",i=",",n=!1,s="=",r=(e=>e.join("."))){this.entityType=e,this.prefix=t,this.separator=i,this.trailingSeparator=n,this.attributeValueConjunctionSign=s,this.attributeKeyPrinter=r}deserialize(e){return this.read(e)}serialize(e,t=!1,i=e){return this.write(i,e,t)}read(e){throw new Error("Not implemented")}write(e,t,i){throw new Error("Not implemented")}writeValue(e,t,i,n){const s=te.getSerializer(ne.getType(t));if(!s)throw new Error("Unknown value type, a serializer must be registered in the SerializerFactory class");return s.write(e,t,n)}subWrite(e,t,i,n){let s="",r=t.concat("");const o=r.length-1;for(const t of Object.getOwnPropertyNames(i)){r[o]=t;const a=i[t];if(a?.constructor===Object)s+=(s.length?this.separator:"")+this.subWrite(e,r,a,n);else if(void 0!==a&&this.showProperty(e,i,r,a)){const t=ne.isSerialized(e,r);s+=(s.length?this.separator:"")+this.prefix+this.attributeKeyPrinter(r)+this.attributeValueConjunctionSign+(t?`"${this.writeValue(e,a,r,!0)}"`:this.writeValue(e,a,r,n))}}return this.trailingSeparator&&s.length&&1===r.length&&(s+=this.separator),s}showProperty(e,t,i,n){const s=this.entityType.attributes,r=ne.objectGet(s,i);return!(r instanceof ie)||!r.ignored&&(!ne.equals(r.value,n)||r.showDefault)}}class Le extends $e{constructor(){super(Pe," ","\n",!1)}showProperty(e,t,i,n){switch(i.toString()){case"Class":case"Name":case"CustomProperties":return!1}return super.showProperty(e,t,i,n)}read(e){const t=$e.grammar.Object.parse(e);if(!t.status)throw new Error("Error when trying to parse the object.");return t.value}readMultiple(e){const t=$e.grammar.MultipleObject.parse(e);if(!t.status)throw new Error("Error when trying to parse the object.");return t.value}write(e,t,i){return`Begin Object Class=${t.Class.path} Name=${this.writeValue(e,t.Name,["Name"],i)}\n${this.subWrite(e,[],t,i)+t.CustomProperties.map((e=>this.separator+this.prefix+"CustomProperties "+te.getSerializer(we).serialize(e))).join("")}\nEnd Object\n`}}class Te extends Q{static#p=new Le;#m;constructor(e,t,i={}){i.listenOnFocus??=!0,i.unlistenOnTextEdit??=!0,super(e,t,i);let n=this;this.#m=e=>n.copied()}listenEvents(){document.body.addEventListener("copy",this.#m)}unlistenEvents(){document.body.removeEventListener("copy",this.#m)}copied(){const e=this.blueprint.getNodes(!0).map((e=>Te.#p.serialize(e.entity,!1))).join("\n\n");navigator.clipboard.writeText(e)}}class Oe{static styles=s``;element;#g=[];get inputObjects(){return this.#g}constructed(e){this.element=e}createInputObjects(){return[]}connectedCallback(){}willUpdate(e){}update(e){}render(){return T``}firstUpdated(e){}updated(e){}inputSetup(){this.#g=this.createInputObjects()}cleanup(){this.#g.forEach((e=>e.unlistenDOMElement()))}}class De extends Q{#b;constructor(e,t,i={}){i.activateAnyKey??=!1,i.activationKeys??=[],i.listenOnFocus??=!0,i.unlistenOnTextEdit??=!0,i.activationKeys instanceof Array||(i.activationKeys=[i.activationKeys]),i.activationKeys=i.activationKeys.map((e=>{if(e instanceof he)return e;if(e.constructor===String){const t=$e.grammar.KeyBinding.parse(e);if(t.status)return t.value}throw new Error("Unexpected key value")})),super(e,t,i),this.#b=this.options.activationKeys??[];let n=this;this.keyDownHandler=e=>{(this.options.activateAnyKey||n.#b.some((t=>(e=>e.bShift||"LeftShift"==e.Key||"RightShift"==e.Key)(t)==e.shiftKey&&(e=>e.bCtrl||"LeftControl"==e.Key||"RightControl"==e.Key)(t)==e.ctrlKey&&(e=>e.bAlt||"LeftAlt"==e.Key||"RightAlt"==e.Key)(t)==e.altKey&&J.Keys[t.Key]==e.code)))&&(i.consumeEvent&&e.stopImmediatePropagation(),n.fire(),document.removeEventListener("keydown",n.keyDownHandler),document.addEventListener("keyup",n.keyUpHandler))},this.keyUpHandler=e=>{(this.options.activateAnyKey||n.#b.some((t=>t.bShift&&"Shift"==e.key||t.bCtrl&&"Control"==e.key||t.bAlt&&"Alt"==e.key||t.bCmd&&"Meta"==e.key||J.Keys[t.Key]==e.code)))&&(i.consumeEvent&&e.stopImmediatePropagation(),n.unfire(),document.removeEventListener("keyup",this.keyUpHandler),document.addEventListener("keydown",this.keyDownHandler))}}listenEvents(){document.addEventListener("keydown",this.keyDownHandler)}unlistenEvents(){document.removeEventListener("keydown",this.keyDownHandler)}fire(){}unfire(){}}class Me extends De{constructor(e,t,i={}){i.activationKeys=J.deleteNodesKeyboardKey,super(e,t,i)}fire(){this.blueprint.removeGraphElement(...this.blueprint.getNodes(!0))}}class He extends Q{constructor(e,t,i={}){i.ignoreTranslateCompensate??=!1,i.movementSpace??=t.getGridDOMElement()??document.documentElement,super(e,t,i),this.movementSpace=i.movementSpace}locationFromEvent(e){const t=ne.convertLocation([e.clientX,e.clientY],this.movementSpace);return this.options.ignoreTranslateCompensate?t:this.blueprint.compensateTranslation(t)}}class _e extends He{#v=e=>{e.preventDefault();const t=this.locationFromEvent(e);this.wheel(Math.sign(e.deltaY*J.mouseWheelFactor),t)};#f=e=>e.preventDefault();constructor(e,t,i={}){i.listenOnFocus=!0,i.strictTarget??=!1,super(e,t,i),this.strictTarget=i.strictTarget}listenEvents(){this.movementSpace.addEventListener("wheel",this.#v,!1),this.movementSpace.parentElement?.addEventListener("wheel",this.#f)}unlistenEvents(){this.movementSpace.removeEventListener("wheel",this.#v,!1),this.movementSpace.parentElement?.removeEventListener("wheel",this.#f)}wheel(e,t){}}class Ie extends _e{#y=!1;get enableZoonIn(){return this.#y}set enableZoonIn(e){(e=Boolean(e))!=this.#y&&(this.#y=e)}wheel(e,t){let i=this.blueprint.getZoom();e=-e,!this.enableZoonIn&&0==i&&e>0||(i+=e,this.blueprint.setZoom(i,t))}}class Be extends De{#E;constructor(e,t,i={}){i.activationKeys=J.enableZoomIn,super(e,t,i)}fire(){this.#E=this.blueprint.getInputObject(Ie),this.#E.enableZoonIn=!0}unfire(){this.#E.enableZoonIn=!1}}class Re extends De{constructor(e,t,i={}){i.activationKeys=J.selectAllKeyboardKey,super(e,t,i)}fire(){this.blueprint.selectAll()}}class Ge extends Y{static properties={};#w=[];#t;get blueprint(){return this.#t}set blueprint(e){this.#t=e}#S;get entity(){return this.#S}set entity(e){this.#S=e}#P;get template(){return this.#P}inputObjects=[];constructor(e,t){super(),this.#S=e,this.#P=t,this.inputObjects=[],this.#P.constructed(this)}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.blueprint=this.closest("ueb-blueprint"),this.template.connectedCallback()}willUpdate(e){super.willUpdate(e),this.template.willUpdate(e)}update(e){super.update(e),this.template.update(e)}render(){return this.template.render()}firstUpdated(e){super.firstUpdated(e),this.template.firstUpdated(e),this.template.inputSetup()}updated(e){super.updated(e),this.template.updated(e),this.#w.forEach((t=>t(e))),this.#w=[]}disconnectedCallback(){super.disconnectedCallback(),this.template.cleanup()}addNextUpdatedCallbacks(e,t=!1){this.#w.push(e),t&&this.requestUpdate()}isSameGraph(e){return this.blueprint&&this.blueprint==e?.blueprint}getInputObject(e){return this.template.inputObjects.find((t=>t.constructor==e))}}class Fe extends Ge{static properties={...super.properties,locationX:{type:Number,attribute:!1},locationY:{type:Number,attribute:!1}};static dragEventName=J.dragEventName;static dragGeneralEventName=J.dragGeneralEventName;constructor(e,t){super(e,t),this.locationX=0,this.locationY=0}setLocation([e,t]){const i=[e-this.locationX,t-this.locationY];if(this.locationX=e,this.locationY=t,this.blueprint){const e=new CustomEvent(this.constructor.dragEventName,{detail:{value:i},bubbles:!1,cancelable:!0});this.dispatchEvent(e)}}addLocation([e,t]){this.setLocation([this.locationX+e,this.locationY+t])}dispatchDragEvent(e){const t=new CustomEvent(this.constructor.dragGeneralEventName,{detail:{value:e},bubbles:!0,cancelable:!0});this.dispatchEvent(t)}snapToGrid(){const e=ne.snapToGrid([this.locationX,this.locationY],J.gridSize);this.locationX==e[0]&&this.locationY==e[1]||this.setLocation(e)}}class ze extends He{#k=e=>{if(this.blueprint.setFocused(!0),e.button===this.options.clickButton)this.options.strictTarget&&e.target!=e.currentTarget||(this.options.consumeEvent&&e.stopImmediatePropagation(),this.#C.addEventListener("mousemove",this.#x),document.addEventListener("mouseup",this.#N),this.clickedPosition=this.locationFromEvent(e),this.blueprint.mousePosition[0]=this.clickedPosition[0],this.blueprint.mousePosition[1]=this.clickedPosition[1],this.target instanceof Fe&&(this.clickedOffset=[this.clickedPosition[0]-this.target.locationX,this.clickedPosition[1]-this.target.locationY]),this.clicked(this.clickedPosition));else this.options.exitAnyButton||this.#N(e)};#x=e=>{this.options.consumeEvent&&e.stopImmediatePropagation(),this.#C.removeEventListener("mousemove",this.#x),this.#C.addEventListener("mousemove",this.#A);const t=this.getEvent(J.trackingMouseEventName.begin);this.#$=0==this.target.dispatchEvent(t);const i=this.locationFromEvent(e);this.mouseLocation=ne.snapToGrid(this.clickedPosition,this.stepSize),this.startDrag(i),this.started=!0};#A=e=>{this.options.consumeEvent&&e.stopImmediatePropagation();const t=this.locationFromEvent(e),i=[e.movementX,e.movementY];this.dragTo(t,i),this.#$&&(this.blueprint.mousePosition=this.locationFromEvent(e))};#N=e=>{if(!this.options.exitAnyButton||e.button==this.options.clickButton){if(this.options.consumeEvent&&e.stopImmediatePropagation(),this.#C.removeEventListener("mousemove",this.#x),this.#C.removeEventListener("mousemove",this.#A),document.removeEventListener("mouseup",this.#N),this.started&&this.endDrag(),this.unclicked(),this.#$){const e=this.getEvent(J.trackingMouseEventName.end);this.target.dispatchEvent(e),this.#$=!1}this.started=!1}};#$=!1;#C;#L;clickedOffset=[0,0];clickedPosition=[0,0];mouseLocation=[0,0];started=!1;stepSize=1;constructor(e,t,i={}){i.clickButton??=0,i.consumeEvent??=!0,i.draggableElement??=e,i.exitAnyButton??=!0,i.moveEverywhere??=!1,i.movementSpace??=t?.getGridDOMElement(),i.repositionOnClick??=!1,i.strictTarget??=!1,super(e,t,i),this.stepSize=parseInt(i?.stepSize??J.gridSize),this.#C=this.options.moveEverywhere?document.documentElement:this.movementSpace,this.#L=this.options.draggableElement,this.listenEvents()}listenEvents(){this.#L.addEventListener("mousedown",this.#k),2==this.options.clickButton&&this.#L.addEventListener("contextmenu",(e=>e.preventDefault()))}unlistenEvents(){this.#L.removeEventListener("mousedown",this.#k)}getEvent(e){return new CustomEvent(e,{detail:{tracker:this},bubbles:!0,cancelable:!0})}clicked(e){}startDrag(e){}dragTo(e,t){}endDrag(){}unclicked(e){}}class je extends ze{startDrag(){this.blueprint.scrolling=!0}dragTo(e,t){this.blueprint.scrollDelta([-t[0],-t[1]])}endDrag(){this.blueprint.scrolling=!1}}class Ve extends He{#T=null;#O;#D;#M;constructor(e,t,i={}){i.listenOnFocus=!0,super(e,t,i);let n=this;this.#O=e=>{e.preventDefault(),n.blueprint.mousePosition=n.locationFromEvent(e)},this.#D=e=>{n.#T||(e.preventDefault(),this.#T=e.detail.tracker,n.unlistenMouseMove())},this.#M=e=>{n.#T==e.detail.tracker&&(e.preventDefault(),n.#T=null,n.listenMouseMove())}}listenMouseMove(){this.target.addEventListener("mousemove",this.#O)}unlistenMouseMove(){this.target.removeEventListener("mousemove",this.#O)}listenEvents(){this.listenMouseMove(),this.blueprint.addEventListener(J.trackingMouseEventName.begin,this.#D),this.blueprint.addEventListener(J.trackingMouseEventName.end,this.#M)}unlistenEvents(){this.unlistenMouseMove(),this.blueprint.removeEventListener(J.trackingMouseEventName.begin,this.#D),this.blueprint.removeEventListener(J.trackingMouseEventName.end,this.#M)}}class Ue{static#H=new Map;static registerElement(e,t){Ue.#H.set(e,t)}static getConstructor(e){return Ue.#H.get(e)}}class Ke extends Q{static#p=new Le;#_;constructor(e,t,i={}){i.listenOnFocus??=!0,i.unlistenOnTextEdit??=!0,super(e,t,i);let n=this;this.#_=e=>n.pasted(e.clipboardData.getData("Text"))}listenEvents(){document.body.addEventListener("paste",this.#_)}unlistenEvents(){document.body.removeEventListener("paste",this.#_)}pasted(e){let t=0,i=0,n=0,s=Ke.#p.readMultiple(e).map((e=>{let s=new(Ue.getConstructor("ueb-node"))(e);return t+=s.locationY,i+=s.locationX,++n,s}));t/=n,i/=n,s.length>0&&this.blueprint.unselectAll();let r=this.blueprint.mousePosition;return s.forEach((e=>{const n=[r[0]-i,r[1]-t];e.addLocation(n),e.snapToGrid(),e.setSelected(!0)})),this.blueprint.addGraphElement(...s),!0}}class Xe extends ze{constructor(e,t,i){super(e,t,i),this.selectorElement=this.blueprint.selectorElement}startDrag(){this.selectorElement.beginSelect(this.clickedPosition)}dragTo(e,t){this.selectorElement.selectTo(e)}endDrag(){this.started&&this.selectorElement.endSelect()}unclicked(){this.started||this.blueprint.unselectAll()}}class We extends Q{#I;constructor(e,t,i={}){i.listenOnFocus=!0,super(e,t,i);let n=this;this.#I=e=>n.clickedSomewhere(e.target),this.blueprint.focus&&document.addEventListener("click",this.#I)}clickedSomewhere(e){e.closest("ueb-blueprint")||this.blueprint.setFocused(!1)}listenEvents(){document.addEventListener("click",this.#I)}unlistenEvents(){document.removeEventListener("click",this.#I)}}class qe extends Oe{static styleVariables={"--ueb-font-size":`${J.fontSize}`,"--ueb-grid-axis-line-color":`${J.gridAxisLineColor}`,"--ueb-grid-expand":`${J.expandGridSize}px`,"--ueb-grid-line-color":`${J.gridLineColor}`,"--ueb-grid-line-width":`${J.gridLineWidth}px`,"--ueb-grid-set-line-color":`${J.gridSetLineColor}`,"--ueb-grid-set":`${J.gridSet}`,"--ueb-grid-size":`${J.gridSize}px`,"--ueb-link-min-width":`${J.linkMinWidth}`,"--ueb-node-radius":`${J.nodeRadius}px`};constructed(e){super.constructed(e),this.element.style.cssText=Object.entries(qe.styleVariables).map((([e,t])=>`${e}:${t};`)).join("")}createInputObjects(){return[...super.createInputObjects(),new Te(this.element.getGridDOMElement(),this.element),new Ke(this.element.getGridDOMElement(),this.element),new Me(this.element.getGridDOMElement(),this.element),new Re(this.element.getGridDOMElement(),this.element),new Ie(this.element.getGridDOMElement(),this.element),new Xe(this.element.getGridDOMElement(),this.element,{clickButton:0,exitAnyButton:!0,moveEverywhere:!0}),new je(this.element.getGridDOMElement(),this.element,{clickButton:2,exitAnyButton:!1,moveEverywhere:!0}),new We(this.element.getGridDOMElement(),this.element),new Ve(this.element.getGridDOMElement(),this.element),new Be(this.element.getGridDOMElement(),this.element)]}render(){return T`
${0==this.element.zoom?"1:1":this.element.zoom}
`}firstUpdated(e){super.firstUpdated(e),this.element.headerElement=this.element.querySelector(".ueb-viewport-header"),this.element.overlayElement=this.element.querySelector(".ueb-viewport-overlay"),this.element.viewportElement=this.element.querySelector(".ueb-viewport-body"),this.element.selectorElement=this.element.querySelector("ueb-selector"),this.element.gridElement=this.element.viewportElement.querySelector(".ueb-grid"),this.element.linksContainerElement=this.element.querySelector("[data-links]"),this.element.linksContainerElement.append(...this.element.getLinks()),this.element.nodesContainerElement=this.element.querySelector("[data-nodes]"),this.element.nodesContainerElement.append(...this.element.getNodes()),this.element.viewportElement.scroll(J.expandGridSize,J.expandGridSize)}updated(e){if(super.updated(e),(e.has("scrollX")||e.has("scrollY"))&&this.element.viewportElement.scroll(this.element.scrollX,this.element.scrollY),e.has("zoom")){const t=e.get("zoom"),i=Math.min(t,this.element.zoom),n=Math.max(t,this.element.zoom),s=ne.range(i,n),r=e=>`ueb-zoom-${e}`;te<0)).map(r)),this.element.classList.add(...s.filter((e=>e>0)).map(r))):(this.element.classList.remove(...s.filter((e=>e>0)).map(r)),this.element.classList.add(...s.filter((e=>e<0)).map(r)))}}getPin(e){return this.element.querySelector(`ueb-node[data-name="${e.objectName}"] ueb-pin[data-id="${e.pinGuid}"]`)}}class Ye extends Ge{static properties={...super.properties,fromX:{type:Number,attribute:!1},fromY:{type:Number,attribute:!1},toX:{type:Number,attribute:!1},toY:{type:Number,attribute:!1}};constructor(...e){super(...e),this.fromX=0,this.fromY=0,this.toX=0,this.toY=0}setBothLocations([e,t]){this.fromX=e,this.fromY=t,this.toX=e,this.toY=t}addSourceLocation([e,t]){this.fromX+=e,this.fromY+=t}addDestinationLocation([e,t]){this.toX+=e,this.toY+=t}}class Ze extends Oe{update(e){super.update(e);const[t,i,n,s]=[Math.round(this.element.fromX),Math.round(this.element.fromY),Math.round(this.element.toX),Math.round(this.element.toY)],[r,o,a,l]=[Math.min(t,n),Math.min(i,s),Math.abs(t-n),Math.abs(i-s)];(e.has("fromX")||e.has("toX"))&&(this.element.style.left=`${r}px`,this.element.style.width=`${a}px`),(e.has("fromY")||e.has("toY"))&&(this.element.style.top=`${o}px`,this.element.style.height=`${l}px`)}}class Je extends Pe{constructor(e={}){super(e),this.Class=new re("/Script/BlueprintGraph.K2Node_Knot"),this.Name="K2Node_Knot",this.CustomProperties=[new we({PinName:"InputPin"}),new we({PinName:"OutputPin",Direction:"EGPD_Output"})]}}class Qe extends He{static ignoreDbClick=e=>{};#B=e=>{this.options.strictTarget&&e.target!==e.currentTarget||(this.options.consumeEvent&&e.stopImmediatePropagation(),this.clickedPosition=this.locationFromEvent(e),this.blueprint.mousePosition[0]=this.clickedPosition[0],this.blueprint.mousePosition[1]=this.clickedPosition[1],this.dbclicked(this.clickedPosition))};#R;get onDbClick(){return this.#R}set onDbClick(e){this.#R=e}clickedPosition=[0,0];constructor(e,t,i={},n=Qe.ignoreDbClick){i.consumeEvent??=!0,i.strictTarget??=!1,super(e,t,i),this.#R=n,this.listenEvents()}listenEvents(){this.target.addEventListener("dblclick",this.#B)}unlistenEvents(){this.target.removeEventListener("dblclick",this.#B)}dbclicked(e){this.onDbClick(e)}}class et extends Ze{static decreasingValue(e,t){const i=-e*t[0]**2,n=t[1]-i/t[0];return e=>i/e+n}static clampedLine(e,t){if(e[0]>t[0]){const i=e;e=t,t=i}const i=(t[1]-e[1])/(t[0]-e[0]),n=e[1]-i*e[0];return s=>st[0]?t[1]:i*s+n}static c1DecreasingValue=et.decreasingValue(-.15,[100,15]);static c2DecreasingValue=et.decreasingValue(-.06,[500,130]);static c2Clamped=et.clampedLine([0,100],[200,30]);#G=e=>{const t=new(Ue.getConstructor("ueb-node"))(new Je);t.setLocation(this.element.blueprint.snapToGrid(e));const i=new(Ue.getConstructor("ueb-link"))(t.template.outputPin,this.element.destinationPin);this.element.destinationPin=t.template.inputPin,this.element.blueprint.addGraphElement(t,i)};createInputObjects(){return[...super.createInputObjects(),new Qe(this.element.querySelector(".ueb-link-area"),this.element.blueprint,void 0,(e=>this.#G(e)))]}willUpdate(e){super.willUpdate(e);const t=this.element.sourcePin,i=this.element.destinationPin;if(e.has("fromX")||e.has("toX")){const e=t?.nodeElement.getType()==J.knotNodeTypeName,n=i?.nodeElement.getType()==J.knotNodeTypeName;!e||i&&!n||(t?.isInput()&&this.element.toX>this.element.fromX+J.distanceThreshold?this.element.sourcePin=t.nodeElement.template.outputPin:t?.isOutput()&&this.element.toXthis.element.fromX-J.distanceThreshold&&(this.element.destinationPin=i.nodeElement.template.inputPin))}const n=Math.max(Math.abs(this.element.fromX-this.element.toX),1),s=Math.max(n,J.linkMinWidth),r=n/s,o=this.element.originatesFromInput?this.element.fromXthis.element.toY?1:0)),this.element.style.setProperty("--ueb-start-percentage",`${Math.round(this.element.startPercentage)}%`),this.element.style.setProperty("--ueb-link-start",`${Math.round(this.element.startPixels)}`)}render(){const e=`ueb-id-${Math.floor(1e12*Math.random())}`;return T` ${""!=this.element.linkMessageIcon||""!=this.element.linkMessageText?T`
${this.element.linkMessageText}
`:D}`}}class tt extends Ye{static properties={...super.properties,source:{type:String,reflect:!0},destination:{type:String,reflect:!0},dragging:{type:Boolean,attribute:"data-dragging",converter:ne.booleanConverter,reflect:!0},originatesFromInput:{type:Boolean,attribute:!1},svgPathD:{type:String,attribute:!1},linkMessageIcon:{type:String,attribute:!1},linkMessageText:{type:String,attribute:!1}};#F;get sourcePin(){return this.#F}set sourcePin(e){this.#z(e,!1)}#j;get destinationPin(){return this.#j}set destinationPin(e){this.#z(e,!0)}#V;#U;#K;#X;#W;pathElement;constructor(e,t){super({},new et);const i=this;this.#V=()=>i.remove(),this.#U=e=>i.addSourceLocation(e.detail.value),this.#K=e=>i.addDestinationLocation(e.detail.value),this.#X=e=>i.setSourceLocation(),this.#W=e=>i.setDestinationLocation(),this.source=null,this.destination=null,this.dragging=!1,this.originatesFromInput=!1,this.startPercentage=0,this.svgPathD="",this.startPixels=0,this.linkMessageIcon="",this.linkMessageText="",e&&(this.sourcePin=e,t||(this.toX=this.fromX,this.toY=this.fromY)),t&&(this.destinationPin=t,e||(this.fromX=this.toX,this.fromY=this.toY)),this.#q()}#z(e,t){const i=()=>t?this.destinationPin:this.sourcePin;if(i()!=e){if(i()){const e=i().getNodeElement();e.removeEventListener(J.nodeDeleteEventName,this.#V),e.removeEventListener(J.nodeDragEventName,t?this.#K:this.#U),e.removeEventListener(J.nodeReflowEventName,t?this.#W:this.#X),this.#Y()}if(t?this.#j=e:this.#F=e,i()){const e=i().getNodeElement();e.addEventListener(J.nodeDeleteEventName,this.#V),e.addEventListener(J.nodeDragEventName,t?this.#K:this.#U),e.addEventListener(J.nodeReflowEventName,t?this.#W:this.#X),t?this.setDestinationLocation():(this.setSourceLocation(),this.originatesFromInput=this.sourcePin.isInput()),this.#q()}}}#q(){this.sourcePin&&this.destinationPin&&(this.sourcePin.linkTo(this.destinationPin),this.destinationPin.linkTo(this.sourcePin))}#Y(){this.sourcePin&&this.destinationPin&&(this.sourcePin.unlinkFrom(this.destinationPin),this.destinationPin.unlinkFrom(this.sourcePin))}disconnectedCallback(){super.disconnectedCallback(),this.#Y(),this.sourcePin=null,this.destinationPin=null}setSourceLocation(e=null){if(null==e){const t=this;if(!this.hasUpdated||!this.sourcePin.hasUpdated)return void Promise.all([this.updateComplete,this.sourcePin.updateComplete]).then((()=>t.setSourceLocation()));e=this.sourcePin.template.getLinkLocation()}const[t,i]=e;this.fromX=t,this.fromY=i}setDestinationLocation(e=null){if(null==e){const t=this;if(!this.hasUpdated||!this.destinationPin.hasUpdated)return void Promise.all([this.updateComplete,this.destinationPin.updateComplete]).then((()=>t.setDestinationLocation()));e=this.destinationPin.template.getLinkLocation()}this.toX=e[0],this.toY=e[1]}startDragging(){this.dragging=!0}finishDragging(){this.dragging=!1}removeMessage(){this.linkMessageIcon="",this.linkMessageText=""}setMessageConvertType(){this.linkMessageIcon="ueb-icon-conver-type",this.linkMessageText=`Convert ${this.sourcePin.pinType} to ${this.destinationPin.pinType}.`}setMessageCorrect(){this.linkMessageIcon="ueb-icon-correct",this.linkMessageText=""}setMessageDirectionsIncompatible(){this.linkMessageIcon="ueb-icon-directions-incompatible",this.linkMessageText="Directions are not compatbile."}setMessagePlaceNode(){this.linkMessageIcon="ueb-icon-place-node",this.linkMessageText="Place a new node."}setMessageReplaceLink(){this.linkMessageIcon="ueb-icon-replace-link",this.linkMessageText="Replace existing input connections."}setMessageSameNode(){this.linkMessageIcon="ueb-icon-same-node",this.linkMessageText="Both are on the same node."}setMEssagetypesIncompatible(){this.linkMessageIcon="ueb-icon-types-incompatible",this.linkMessageText=`${this.sourcePin.pinType} is not compatible with ${this.destinationPin.pinType}.`}}class it extends Fe{static properties={...super.properties,selected:{type:Boolean,attribute:"data-selected",reflect:!0,converter:ne.booleanConverter}};constructor(...e){super(...e),this.selected=!1,this.listeningDrag=!1;let t=this;this.dragHandler=e=>t.addLocation(e.detail.value)}connectedCallback(){super.connectedCallback(),this.setSelected(this.selected)}disconnectedCallback(){super.disconnectedCallback(),this.blueprint.removeEventListener(J.nodeDragGeneralEventName,this.dragHandler)}setSelected(e=!0){this.selected=e,this.blueprint&&(this.selected?(this.listeningDrag=!0,this.blueprint.addEventListener(J.nodeDragGeneralEventName,this.dragHandler)):(this.blueprint.removeEventListener(J.nodeDragGeneralEventName,this.dragHandler),this.listeningDrag=!1))}}class nt extends ze{clicked(e){this.options.repositionOnClick&&(this.target.setLocation(this.stepSize>1?ne.snapToGrid(e,this.stepSize):e),this.clickedOffset=[0,0])}dragTo(e,t){const i=[this.target.locationX,this.target.locationY],[n,s]=this.stepSize>1?[ne.snapToGrid(e,this.stepSize),ne.snapToGrid(i,this.stepSize)]:[e,i];0==(t=[n[0]-this.mouseLocation[0],n[1]-this.mouseLocation[1]])[0]&&0==t[1]||(t[0]+=s[0]-this.target.locationX,t[1]+=s[1]-this.target.locationY,this.dragAction(n,t),this.mouseLocation=n)}dragAction(e,t){this.target.setLocation([e[0]-this.clickedOffset[0],e[1]-this.clickedOffset[1]])}}class st extends Oe{getDraggableElement(){return this.element}createDraggableObject(){return new nt(this.element,this.element.blueprint,{draggableElement:this.getDraggableElement()})}createInputObjects(){return[...super.createInputObjects(),this.createDraggableObject()]}}class rt extends st{update(e){super.update(e),e.has("locationX")&&(this.element.style.left=`${this.element.locationX}px`),e.has("locationY")&&(this.element.style.top=`${this.element.locationY}px`)}}class ot extends nt{startDrag(){this.target.selected||(this.blueprint.unselectAll(),this.target.setSelected(!0))}dragAction(e,t){this.target.dispatchDragEvent(t)}unclicked(){this.started||(this.blueprint.unselectAll(),this.target.setSelected(!0))}}class at extends rt{getDraggableElement(){return this.element}createDraggableObject(){return new ot(this.element,this.element.blueprint,{draggableElement:this.getDraggableElement()})}firstUpdated(e){super.firstUpdated(e),this.element.selected&&!this.element.listeningDrag&&this.element.setSelected(!0)}}class lt extends ze{#Z;#J=null;#Q=e=>{if(!this.enteredPin){this.linkValid=!1,this.enteredPin=e.target;const t=this.link.sourcePin??this.target,i=this.enteredPin;t.nodeElement.getType()==J.knotNodeTypeName||i.nodeElement.getType()==J.knotNodeTypeName?(this.link.setMessageCorrect(),this.linkValid=!0):t.getNodeElement()==i.getNodeElement()?this.link.setMessageSameNode():t.isOutput()==i.isOutput()||t.isOutput()==i.isOutput()?this.link.setMessageDirectionsIncompatible():this.blueprint.getLinks([t,i]).length?(this.link.setMessageReplaceLink(),this.linkValid=!0):(this.link.setMessageCorrect(),this.linkValid=!0)}};#ee=e=>{this.enteredPin==e.target&&(this.enteredPin=null,this.linkValid=!1,this.link?.setMessagePlaceNode())};link;enteredPin;linkValid=!1;startDrag(e){this.target.nodeElement.getType()==J.knotNodeTypeName&&(this.#J=this.target),this.link=new(Ue.getConstructor("ueb-link"))(this.target,null),this.blueprint.linksContainerElement.prepend(this.link),this.link.setMessagePlaceNode(),this.#Z=this.blueprint.querySelectorAll("ueb-pin"),this.#Z.forEach((e=>{if(e!=this.target){const t=e.template.getClickableElement();t.addEventListener("mouseenter",this.#Q),t.addEventListener("mouseleave",this.#ee)}})),this.link.startDragging(),this.link.setDestinationLocation(e)}dragTo(e,t){this.link.setDestinationLocation(e)}endDrag(){if(this.#Z.forEach((e=>{e.removeEventListener("mouseenter",this.#Q),e.removeEventListener("mouseleave",this.#ee)})),this.enteredPin&&this.linkValid){if(this.#J){const e=this.#J!==this.link.sourcePin?this.link.sourcePin:this.enteredPin;if(this.#J.isInput()&&e.isInput()||this.#J.isOutput()&&e.isOutput()){const e=this.#J.isInput()?this.#J.nodeElement.template.outputPin:this.#J.nodeElement.template.inputPin;this.#J===this.link.sourcePin?this.link.sourcePin=e:this.enteredPin=e}}this.blueprint.addGraphElement(this.link),this.link.destinationPin=this.enteredPin,this.link.removeMessage(),this.link.finishDragging()}else this.link.finishDragging(),this.link.remove();this.enteredPin=null,this.link=null,this.#Z=null}}class ut extends Oe{#te;get iconElement(){return this.#te}constructed(e){super.constructed(e),this.element.dataset.id=this.element.getPinId().toString()}connectedCallback(){super.connectedCallback(),this.element.nodeElement=this.element.closest("ueb-node")}createInputObjects(){return[new lt(this.getClickableElement(),this.element.blueprint,{moveEverywhere:!0})]}render(){const e=this.renderIcon(),t=T`
${this.renderName()} ${this.element.isInput()&&!this.element.entity.bDefaultValueIsIgnored?this.renderInput():T``}
`;return T`
${this.element.isInput()?T`${e}${t}`:T`${t}${e}`}
`}renderIcon(){return T``}renderName(){return T`${this.element.getPinDisplayName()}`}renderInput(){return T``}updated(e){if(this.element.isInput()&&e.has("isLinked")){const e=this.element.nodeElement;e.addNextUpdatedCallbacks((()=>e.dispatchReflowEvent())),e.requestUpdate()}}firstUpdated(e){super.firstUpdated(e),this.element.style.setProperty("--ueb-pin-color-rgb",J.pinColor[this.element.pinType]),this.#te=this.element.querySelector(".ueb-pin-icon")??this.element}getLinkLocation(){const e=this.iconElement.getBoundingClientRect(),t=ne.convertLocation([(e.left+e.right)/2,(e.top+e.bottom)/2],this.element.blueprint.gridElement);return this.element.blueprint.compensateTranslation(t)}getClickableElement(){return this.element}}class ct extends ut{render(){return this.element.isOutput()?this.renderIcon():T``}getLinkLocation(){const e=(this.element.isInput()?this.element.nodeElement.template.outputPin.template:this).iconElement.getBoundingClientRect(),t=ne.convertLocation([this.element.isInput()?e.left+1:e.right+2,(e.top+e.bottom)/2],this.element.blueprint.gridElement);return this.element.blueprint.compensateTranslation(t)}}class ht extends at{#ie;get inputPin(){return this.#ie}#ne;get outputPin(){return this.#ne}render(){return T`
`}firstUpdated(e){super.firstUpdated(e);const t=this.element.querySelector(".ueb-node-border");Promise.all(this.element.getPinElements().map((e=>e.updateComplete))).then((()=>this.element.dispatchReflowEvent())),this.element.getPinElements().forEach((e=>t.appendChild(e)))}getPinElements(e){return e.querySelectorAll("ueb-pin")}createPinElements(){const e=this.element.getPinEntities().filter((e=>!e.isHidden())),t=e[e[0].isInput()?0:1],i=e[e[0].isOutput()?0:1],n=Ue.getConstructor("ueb-pin");return[this.#ie=new n(t,new ct,this.element),this.#ne=new n(i,new ct,this.element)]}}class dt extends at{toggleAdvancedDisplayHandler=e=>{this.element.toggleShowAdvancedPinDisplay(),this.element.addNextUpdatedCallbacks((()=>this.element.dispatchReflowEvent()),!0)};render(){return T`
${this.element.nodeDisplayName}
${"DevelopmentOnly"==this.element.enabledState?.toString()?T`
Development Only
`:D} ${this.element.advancedPinDisplay?T`
`:D}
`}firstUpdated(e){super.firstUpdated(e);const t=this.element.querySelector(".ueb-node-inputs"),i=this.element.querySelector(".ueb-node-outputs");Promise.all(this.element.getPinElements().map((e=>e.updateComplete))).then((()=>this.element.dispatchReflowEvent())),this.element.getPinElements().forEach((e=>{e.isInput()?t.appendChild(e):e.isOutput()&&i.appendChild(e)})),this.element.nodeNameElement=this.element.querySelector(".ueb-node-name-text")}getPinElements(e){return e.querySelectorAll("ueb-pin")}createPinElements(){return this.element.getPinEntities().filter((e=>!e.isHidden())).map((e=>new(Ue.getConstructor("ueb-pin"))(e,void 0,this.element)))}}class pt extends it{static#se={"/Script/BlueprintGraph.K2Node_Knot":ht};static properties={...it.properties,nodeClass:{type:String,attribute:"data-type",reflect:!0},name:{type:String,attribute:"data-name",reflect:!0},advancedPinDisplay:{type:String,attribute:"data-advanced-display",converter:le.attributeConverter,reflect:!0},enabledState:{type:String,attribute:"data-enabled-state",reflect:!0},nodeDisplayName:{type:String,attribute:!1},pureFunction:{type:Boolean,converter:ne.booleanConverter,attribute:"data-pure-function",reflect:!0}};static dragEventName=J.nodeDragEventName;static dragGeneralEventName=J.nodeDragGeneralEventName;get blueprint(){return super.blueprint}set blueprint(e){super.blueprint=e,this.#re.forEach((t=>t.blueprint=e))}#oe;get nodeNameElement(){return this.#oe}set nodeNameElement(e){this.#oe=e}#re;constructor(e,t){super(e,t??new(pt.getTypeTemplate(e))),this.#re=this.template.createPinElements(),this.nodeClass=this.entity.getClass(),this.name=this.entity.getObjectName(),this.advancedPinDisplay=this.entity.AdvancedPinDisplay?.toString(),this.enabledState=this.entity.EnabledState,this.nodeDisplayName=this.entity.getDisplayName(),this.pureFunction=this.entity.bIsPureFunc,this.dragLinkObjects=[],super.setLocation([this.entity.NodePosX.value,this.entity.NodePosY.value]),this.entity.subscribe("AdvancedPinDisplay",(e=>this.advancedPinDisplay=e)),this.entity.subscribe("Name",(e=>this.name=e))}static getTypeTemplate(e){return pt.#se[e.getClass()]??dt}static fromSerializedObject(e){e=e.trim();let t=te.getSerializer(Pe).deserialize(e);return new pt(t)}disconnectedCallback(){super.disconnectedCallback(),this.dispatchDeleteEvent()}getType(){return this.entity.getClass()}getNodeName(){return this.entity.getObjectName()}getNodeDisplayName(){return this.entity.getDisplayName()}sanitizeLinks(e=[]){this.getPinElements().forEach((t=>t.sanitizeLinks(e)))}rename(e){if(this.entity.Name==e)return!1;for(let t of this.getPinElements())for(let i of t.getLinks())this.blueprint.getPin(i).redirectLink(t,new be({objectName:e,pinGuid:t.entity.PinId}));this.entity.Name=e}getPinElements(){return this.#re}getPinEntities(){return this.entity.CustomProperties.filter((e=>e instanceof we))}setLocation(e=[0,0]){let t=this.entity.NodePosX.constructor;this.entity.NodePosX=new t(e[0]),this.entity.NodePosY=new t(e[1]),super.setLocation(e)}dispatchDeleteEvent(){let e=new CustomEvent(J.nodeDeleteEventName);this.dispatchEvent(e)}dispatchReflowEvent(){let e=new CustomEvent(J.nodeReflowEventName);this.dispatchEvent(e)}setShowAdvancedPinDisplay(e){this.entity.AdvancedPinDisplay=new le(e?"Shown":"Hidden")}toggleShowAdvancedPinDisplay(){this.setShowAdvancedPinDisplay("Shown"!=this.entity.AdvancedPinDisplay?.toString())}}class mt{constructor(e=(e=>e),t=null){this.array=new Uint32Array(t),this.comparisonValueSupplier=e,this.length=0,this.currentPosition=0}get(e){return e>=0&&e=0&&this.currentPosition=0&&this.currentPosition0?this.get(this.currentPosition-1):null}getPrevValue(){return this.currentPosition>0?this.comparisonValueSupplier(this.get(this.currentPosition-1)):Number.MIN_SAFE_INTEGER}shiftLeft(e,t=1){this.array.set(this.array.subarray(e+t),e)}shiftRight(e,t=1){this.array.set(this.array.subarray(e,-t),e+t)}}class gt{constructor(e,t,i,n){this.initialPosition=e,this.finalPosition=e,this.metadata=new Array(t.length),this.primaryOrder=new mt((e=>this.metadata[e].primaryBoundary)),this.secondaryOrder=new mt((e=>this.metadata[e].secondaryBoundary)),this.selectFunc=n,this.rectangles=t,this.primaryOrder.reserve(this.rectangles.length),this.secondaryOrder.reserve(this.rectangles.length),t.forEach(((e,t)=>{let s={primaryBoundary:this.initialPosition[0],secondaryBoundary:this.initialPosition[1],rectangle:t,onSecondaryAxis:!1};this.metadata[t]=s,n(e,!1);const r=i(e);this.initialPosition[1]{if(this.metadata[i].onSecondaryAxis)this.selectFunc(this.rectangles[i],n);else if(n){this.secondaryOrder.insert(i,e[1]);const n=this.metadata[i].secondaryBoundary;Math.sign(e[1]-n)==t[1]&&Math.sign(n-this.initialPosition[1])==t[1]&&this.selectFunc(this.rectangles[i],!0)}else this.selectFunc(this.rectangles[i],!1),this.secondaryOrder.remove(i);this.computeBoundaries(),this.selectTo(e)};e[0]this.boundaries.primaryN.v&&e[0]this.boundaries.primaryP.v&&(++this.primaryOrder.currentPosition,i(this.boundaries.primaryP.i,this.initialPosition[0]{this.selectFunc(this.rectangles[t],i),this.computeBoundaries(),this.selectTo(e)};e[1]this.boundaries.secondaryN.v&&e[1]this.boundaries.secondaryP.v&&(++this.secondaryOrder.currentPosition,n(this.boundaries.secondaryP.i,this.initialPosition[1]{let t=e.getBoundingClientRect(),i=this.nodesContainerElement.getBoundingClientRect();const n=1/this.getScale();return{primaryInf:(t.left-i.left)*n,primarySup:(t.right-i.right)*n,secondaryInf:(t.top-i.top)*n,secondarySup:(t.bottom-i.bottom)*n}};nodeSelectToggleFunction=(e,t)=>{e.setSelected(t)};constructor(e=new J){super({},new qe),this.selecting=!1,this.scrolling=!1,this.focused=!1,this.zoom=0,this.scrollX=J.expandGridSize,this.scrollY=J.expandGridSize,this.translateX=J.expandGridSize,this.translateY=J.expandGridSize}getGridDOMElement(){return this.gridElement}disconnectedCallback(){super.disconnectedCallback()}getScroll(){return[this.scrollX,this.scrollY]}setScroll([e,t],i=!1){this.scrollX=e,this.scrollY=t}scrollDelta(e,t=!1){const i=[2*J.expandGridSize,2*J.expandGridSize];let n=this.getScroll(),s=[n[0]+e[0],n[1]+e[1]],r=[0,0];for(let t=0;t<2;++t)e[t]<0&&s[t]0&&s[t]>i[t]-J.gridExpandThreshold*J.expandGridSize&&(r[t]=1);0==r[0]&&0==r[1]||this.seamlessExpand(r),n=this.getScroll(),s=[n[0]+e[0],n[1]+e[1]],this.setScroll(s,t)}scrollCenter(){const e=this.getScroll(),t=[this.translateX-e[0],this.translateY-e[1]],i=this.getViewportSize().map((e=>e/2)),n=[t[0]-i[0],t[1]-i[1]];this.scrollDelta(n,!0)}getViewportSize(){return[this.viewportElement.clientWidth,this.viewportElement.clientHeight]}getScrollMax(){return[this.viewportElement.scrollWidth-this.viewportElement.clientWidth,this.viewportElement.scrollHeight-this.viewportElement.clientHeight]}snapToGrid(e){return ne.snapToGrid(e,J.gridSize)}seamlessExpand([e,t]){e=Math.round(e),t=Math.round(t);let i=this.getScale();[e,t]=[-e*J.expandGridSize,-t*J.expandGridSize],0!=e&&(this.scrollX+=e,e/=i),0!=t&&(this.scrollY+=t,t/=i),this.translateX+=e,this.translateY+=t}progressiveSnapToGrid(e){return J.expandGridSize*Math.round(e/J.expandGridSize+.5*Math.sign(e))}getZoom(){return this.zoom}setZoom(e,t){if((e=ne.clamp(e,J.minZoom,J.maxZoom))==this.zoom)return;let i=this.getScale();this.zoom=e,t&&requestAnimationFrame((e=>{t[0]+=this.translateX,t[1]+=this.translateY;let n=this.getScale()/i,s=[n*t[0],n*t[1]];this.scrollDelta([(s[0]-t[0])*i,(s[1]-t[1])*i])}))}getScale(){return parseFloat(getComputedStyle(this.gridElement).getPropertyValue("--ueb-scale"))}compensateTranslation([e,t]){return[e-=this.translateX,t-=this.translateY]}getNodes(e=!1){return e?this.nodes.filter((e=>e.selected)):this.nodes}getPin(e){let t=this.template.getPin(e);return t&&t.nodeElement.getNodeName()==e.objectName.toString()?t:[...this.nodes.find((t=>e.objectName.toString()==t.getNodeName()))?.getPinElements()??[]].find((t=>e.pinGuid.toString()==t.getPinId().toString()))}getLinks([e,t]=[]){if(null==e!=t==null){const i=e??t;return this.links.filter((e=>e.sourcePin==i||e.destinationPin==i))}return null!=e&&null!=t?this.links.filter((i=>i.sourcePin==e&&i.destinationPin==t||i.sourcePin==t&&i.destinationPin==e)):this.links}getLink(e,t,i=!1){return this.links.find((n=>n.sourcePin==e&&n.destinationPin==t||i&&n.sourcePin==t&&n.destinationPin==e))}selectAll(){this.getNodes().forEach((e=>this.nodeSelectToggleFunction(e,!0)))}unselectAll(){this.getNodes().forEach((e=>this.nodeSelectToggleFunction(e,!1)))}addGraphElement(...e){for(let t of e)if(t.blueprint=this,t instanceof pt&&!this.nodes.includes(t)){const e=t.entity.getObjectName(),i=this.nodes.find((t=>t.entity.getObjectName()==e));if(i){let e=i.entity.getObjectName(!0);this.#ae[e]=this.#ae[e]??-1;do{++this.#ae[e]}while(this.nodes.find((t=>t.entity.getObjectName()==J.nodeName(e,this.#ae[e]))));i.rename(J.nodeName(e,this.#ae[e]))}this.nodes.push(t),this.nodesContainerElement?.appendChild(t)}else t instanceof tt&&!this.links.includes(t)&&(this.links.push(t),this.linksContainerElement&&!this.linksContainerElement.contains(t)&&this.linksContainerElement.appendChild(t));e.filter((e=>e instanceof pt)).forEach((t=>t.sanitizeLinks(e)))}removeGraphElement(...e){for(let t of e)if(t.closest("ueb-blueprint")==this){t.remove();let e=t instanceof pt?this.nodes:t instanceof tt?this.links:null;e?.splice(e.findIndex((e=>e===t)),1)}}setFocused(e=!0){if(this.focused==e)return;let t=new CustomEvent(e?"blueprint-focus":"blueprint-unfocus");this.focused=e,this.focused||this.unselectAll(),this.dispatchEvent(t)}dispatchEditTextEvent(e){const t=new CustomEvent(e?J.editTextEventName.begin:J.editTextEventName.end);this.dispatchEvent(t)}}customElements.define("ueb-blueprint",ft);class yt extends st{#le;get locationChangeCallback(){return this.#le}set locationChangeCallback(e){this.#le=e}movementSpace;movementSpaceSize=[0,0];connectedCallback(){super.connectedCallback(),this.movementSpace=this.element.parentElement;const e=this.movementSpace.getBoundingClientRect();this.movementSpaceSize=[e.width,e.height]}createDraggableObject(){return new nt(this.element,this.element.blueprint,{draggableElement:this.movementSpace,ignoreTranslateCompensate:!0,moveEverywhere:!0,movementSpace:this.movementSpace,repositionOnClick:!0,stepSize:1})}adjustLocation([e,t]){return this.locationChangeCallback?.(e,t),[e,t]}}class Et extends yt{adjustLocation([e,t]){const i=Math.round(this.movementSpaceSize[0]/2);e-=i,t=-(t-i);let[n,s]=ne.getPolarCoordinates([e,t]);return n=Math.min(n,i),[e,t]=ne.getCartesianCoordinates([n,s]),this.locationChangeCallback?.(e/i,t/i),[e=Math.round(e+i),t=Math.round(-t+i)]}}class wt extends Fe{windowElement;constructor(e,t){super(e,t)}connectedCallback(){super.connectedCallback(),this.windowElement=this.closest("ueb-window")}setLocation([e,t]){super.setLocation(this.template.adjustLocation([e,t]))}}class St extends wt{constructor(){super({},new Et)}}class Pt extends yt{adjustLocation([e,t]){return e=ne.clamp(e,0,this.movementSpaceSize[0]),t=ne.clamp(t,0,this.movementSpaceSize[1]),this.locationChangeCallback?.(e/this.movementSpaceSize[0],1-t/this.movementSpaceSize[1]),[e,t]}}class kt extends wt{constructor(){super({},new Pt)}}class Ct extends Oe{#ue=()=>{this.element.blueprint.dispatchEditTextEvent(!0),this.element.selectOnFocus&&getSelection().selectAllChildren(this.element)};#ce=()=>{this.element.blueprint.dispatchEditTextEvent(!1),document.getSelection()?.removeAllRanges()};#he=e=>e.target.querySelectorAll("br").forEach((e=>e.remove()));#de=e=>{"Enter"!=e.code||e.shiftKey||e.target.blur()};constructed(e){super.constructed(e),this.element.classList.add("ueb-pin-input-content"),this.element.setAttribute("role","textbox"),this.element.contentEditable="true"}connectedCallback(){this.element.addEventListener("focus",this.#ue),this.element.addEventListener("focusout",this.#ce),this.element.singleLine&&this.element.addEventListener("input",this.#he),this.element.blurOnEnter&&this.element.addEventListener("keydown",this.#de)}cleanup(){this.element.removeEventListener("focus",this.#ue),this.element.removeEventListener("focusout",this.#ce),this.element.singleLine&&this.element.removeEventListener("input",this.#he),this.element.blurOnEnter&&this.element.removeEventListener("keydown",this.#de)}}class xt extends Ge{static properties={...super.properties,singleLine:{type:Boolean,attribute:"data-single-line",converter:ne.booleanConverter,reflect:!0},selectOnFocus:{type:Boolean,attribute:"data-select-focus",converter:ne.booleanConverter,reflect:!0},blurOnEnter:{type:Boolean,attribute:"data-blur-enter",converter:ne.booleanConverter,reflect:!0}};constructor(){super({},new Ct),this.singleLine=!1,this.selectOnFocus=!0,this.blurOnEnter=!0}}class Nt extends ze{constructor(e,t,i={}){i.consumeEvent=!0,super(e,t,i)}}class At extends ut{#pe;#me=e=>this.element.setDefaultValue(this.#pe.checked);firstUpdated(e){super.firstUpdated(e),this.#pe=this.element.querySelector(".ueb-pin-input"),this.#pe.addEventListener("change",this.#me)}cleanup(){super.cleanup(),this.#pe.removeEventListener("change",this.#me)}createInputObjects(){return[...super.createInputObjects(),new Nt(this.#pe,this.element.blueprint)]}renderInput(){return T``}}class $t extends ut{renderIcon(){return T``}renderName(){return T``}}class Lt extends ut{static singleLineInput=!1;static selectOnFocus=!0;#ge;get inputContentElements(){return this.#ge}static stringFromInputToUE(e){return e.replace(/(?=\n\s*)\n$/,"").replaceAll("\n","\\r\n")}static stringFromUEToInput(e){return e.replaceAll(/(?:\r|(?<=(?:^|[^\\])(?:\\\\)*)\\r)(?=\n)/g,"").replace(/(?<=\n\s*)$/,"\n")}#be=()=>this.setInputs(this.getInputs(),!0);firstUpdated(e){super.firstUpdated(e),this.#ge=[...this.element.querySelectorAll("ueb-input")],this.#ge.length&&this.#ge.forEach((e=>{e.addEventListener("focusout",this.#be)}))}cleanup(){super.cleanup(),this.#ge.forEach((e=>{e.removeEventListener("focusout",this.#be)}))}createInputObjects(){return[...super.createInputObjects(),...this.#ge.map((e=>new Nt(e,this.element.blueprint)))]}getInput(){return this.getInputs().reduce(((e,t)=>e+t),"")}getInputs(){return this.#ge.map((e=>ne.clearHTMLWhitespace(e.innerHTML)))}setInputs(e=[],t=!0){this.#ge.forEach(this.constructor.singleLineInput?(t,i)=>t.innerText=e[i]:(t,i)=>t.innerText=e[i].replaceAll("\n","")),t&&this.setDefaultValue(e.map((e=>Lt.stringFromInputToUE(e))),e),this.element.addNextUpdatedCallbacks((()=>this.element.nodeElement.dispatchReflowEvent()))}setDefaultValue(e=[],t=e){this.element.setDefaultValue(e.join(""))}renderInput(){const e=this.constructor.singleLineInput,t=this.constructor.selectOnFocus;return T`
`}}class Tt extends Lt{static singleLineInput=!0;setInputs(e=[],t=!1){e&&0!=e.length||(e=[this.getInput()]);let i=[];for(const t of e){let e=parseFloat(t);isNaN(e)&&(e=0,!1),i.push(e)}super.setInputs(e,!1),this.setDefaultValue(i,e)}setDefaultValue(e=[],t){this.element.setDefaultValue(e[0])}}class Ot extends Tt{setDefaultValue(e=[],t=e){this.element.setDefaultValue(e[0])}renderInput(){return T`
`}} /** * @license * Copyright 2017 Google LLC * SPDX-License-Identifier: BSD-3-Clause - */const ct=1; + */const Dt=1; /** * @license * Copyright 2018 Google LLC * SPDX-License-Identifier: BSD-3-Clause */ -const ht=(e=>(...t)=>({_$litDirective$:e,values:t}))(class extends class{constructor(e){}get _$AU(){return this._$AM._$AU}_$AT(e,t,i){this._$Ct=e,this._$AM=t,this._$Ci=i}_$AS(e,t){return this.update(e,t)}update(e,t){return this.render(...t)}}{constructor(e){var t;if(super(e),e.type!==ct||"style"!==e.name||(null===(t=e.strings)||void 0===t?void 0:t.length)>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(e){return Object.keys(e).reduce(((t,i)=>{const n=e[i];return null==n?t:t+`${i=i.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${n};`}),"")}update(e,[t]){const{style:i}=e.element;if(void 0===this.vt){this.vt=new Set;for(const e in t)this.vt.add(e);return this.render(t)}this.vt.forEach((e=>{null==t[e]&&(this.vt.delete(e),e.includes("-")?i.removeProperty(e):i[e]="")}));for(const e in t){const n=t[e];null!=n&&(this.vt.add(e),e.includes("-")?i.setProperty(e,n):i[e]=n)}return O}});class dt extends Xe{#ee;get locationChangeCallback(){return this.#ee}set locationChangeCallback(e){this.#ee=e}movementSpace;movementSpaceSize=[0,0];connectedCallback(){super.connectedCallback(),this.movementSpace=this.element.parentElement;const e=this.movementSpace.getBoundingClientRect();this.movementSpaceSize=[e.width,e.height]}createDraggableObject(){return new Ke(this.element,this.element.blueprint,{draggableElement:this.movementSpace,ignoreTranslateCompensate:!0,moveEverywhere:!0,movementSpace:this.movementSpace,repositionOnClick:!0,stepSize:1})}adjustLocation([e,t]){return this.locationChangeCallback?.(e,t),[e,t]}}class pt extends dt{adjustLocation([e,t]){const i=Math.round(this.movementSpaceSize[0]/2);e-=i,t=-(t-i);let[n,s]=ne.getPolarCoordinates([e,t]);return n=Math.min(n,i),[e,t]=ne.getCartesianCoordinates([n,s]),this.locationChangeCallback?.(e/i,t/i),[e=Math.round(e+i),t=Math.round(-t+i)]}}class mt extends Fe{windowElement;constructor(e,t){super(e,t)}connectedCallback(){super.connectedCallback(),this.windowElement=this.closest("ueb-window")}setLocation([e,t]){super.setLocation(this.template.adjustLocation([e,t]))}}class gt extends mt{constructor(){super({},new pt)}}class vt extends dt{adjustLocation([e,t]){return e=ne.clamp(e,0,this.movementSpaceSize[0]),t=ne.clamp(t,0,this.movementSpaceSize[1]),this.locationChangeCallback?.(e/this.movementSpaceSize[0],1-t/this.movementSpaceSize[1]),[e,t]}}class bt extends mt{constructor(){super({},new vt)}}class ft extends We{toggleAdvancedDisplayHandler;getDraggableElement(){return this.element.querySelector(".ueb-window-top")}createDraggableObject(){return new Ke(this.element,this.element.blueprint,{draggableElement:this.getDraggableElement(),ignoreTranslateCompensate:!0,movementSpace:this.element.blueprint,stepSize:1})}render(){return T`
${this.renderWindowName()}
${this.renderContent()}
`}renderWindowName(){return T`Window`}renderContent(){return T``}apply(){this.element.dispatchEvent(new CustomEvent(J.windowApplyEventName)),this.element.remove()}cancel(){this.element.dispatchEvent(new CustomEvent(J.windowCancelEventName)),this.element.remove()}}class yt extends ft{#te;#ie;#ne;#se;#re;#oe;#ae;#le;#ue;#ce;#he=e=>{const t=ne.clearHTMLWhitespace(e.target.innerHTML),i=parseInt(t,16);isNaN(i)||(this.color.setFromRGBANumber(i),this.element.requestUpdate())};#de=e=>{const t=ne.clearHTMLWhitespace(e.target.innerHTML),i=parseInt(t,16);isNaN(i)||(this.color.setFromSRGBANumber(i),this.element.requestUpdate())};#pe=e=>t=>{"Enter"==t.code&&(t.preventDefault(),e(t))};#me=new pe;get color(){return this.#me}set color(e){e.toNumber()!=this.color?.toNumber()&&(this.element.requestUpdate("color",this.#me),this.#me=e)}#ge=new pe;get fullColor(){return this.#ge}#ve;get initialColor(){return this.#ve}#be=new pe;#fe(e,t,i=!1){const n=this.color.toRGBAString(),s=`${n.substring(0,2*e)}${t}${n.substring(2+2*e)}`;return i?`${s.substring(0,6)}FF`:s}connectedCallback(){super.connectedCallback(),this.#ve=this.element.windowOptions.getPinColor(),this.color.setFromHSVA(this.initialColor.H.value,this.initialColor.S.value,this.initialColor.V.value,this.initialColor.A.value),this.fullColor.setFromHSVA(this.color.H.value,1,1,1)}firstUpdated(e){this.#te=this.element.querySelector(".ueb-color-picker-wheel ueb-color-handler"),this.#ie=this.element.querySelector(".ueb-color-picker-saturation ueb-ui-slider"),this.#ne=this.element.querySelector(".ueb-color-picker-value ueb-ui-slider"),this.#se=this.element.querySelector(".ueb-color-picker-r ueb-ui-slider"),this.#re=this.element.querySelector(".ueb-color-picker-g ueb-ui-slider"),this.#oe=this.element.querySelector(".ueb-color-picker-b ueb-ui-slider"),this.#ae=this.element.querySelector(".ueb-color-picker-a ueb-ui-slider"),this.#le=this.element.querySelector(".ueb-color-picker-h ueb-ui-slider"),this.#ue=this.element.querySelector(".ueb-color-picker-s ueb-ui-slider"),this.#ce=this.element.querySelector(".ueb-color-picker-v ueb-ui-slider"),this.#te.template.locationChangeCallback=(e,t)=>{this.color.setFromWheelLocation([e,t],this.color.V.value,this.color.A.value),this.fullColor.setFromHSVA(this.color.H.value,1,1,1),this.element.requestUpdate()},this.#ie.template.locationChangeCallback=(e,t)=>{this.color.setFromHSVA(this.color.H.value,t,this.color.V.value,this.color.A.value),this.element.requestUpdate()},this.#ne.template.locationChangeCallback=(e,t)=>{this.color.setFromHSVA(this.color.H.value,this.color.S.value,t,this.color.A.value),this.element.requestUpdate()},this.#se.template.locationChangeCallback=(e,t)=>{this.color.setFromRGBA(e,this.color.G.value,this.color.B.value,this.color.A.value),this.element.requestUpdate()},this.#re.template.locationChangeCallback=(e,t)=>{this.color.setFromRGBA(this.color.R.value,e,this.color.B.value,this.color.A.value),this.element.requestUpdate()},this.#oe.template.locationChangeCallback=(e,t)=>{this.color.setFromRGBA(this.color.R.value,this.color.G.value,e,this.color.A.value),this.element.requestUpdate()},this.#ae.template.locationChangeCallback=(e,t)=>{this.color.setFromRGBA(this.color.R.value,this.color.G.value,this.color.B.value,e),this.element.requestUpdate()},this.#le.template.locationChangeCallback=(e,t)=>{this.color.setFromHSVA(e,this.color.S.value,this.color.V.value,this.color.A.value),this.element.requestUpdate()},this.#ue.template.locationChangeCallback=(e,t)=>{this.color.setFromHSVA(this.color.H.value,e,this.color.V.value,this.color.A.value),this.element.requestUpdate()},this.#ce.template.locationChangeCallback=(e,t)=>{this.color.setFromHSVA(this.color.H.value,this.color.S.value,e,this.color.A.value),this.element.requestUpdate()}}renderSlider(e){let t="",i=0,n="";const s=e=>`linear-gradient(to right, #${this.#fe(e,"00",!0)}, #${this.#fe(e,"ff",!0)})`;switch(e){case 0:t="r",i=this.color.R.value,n=s(e);break;case 1:t="g",i=this.color.G.value,n=s(e);break;case 2:t="b",i=this.color.B.value,n=s(e);break;case 3:t="a",i=this.color.A.value,n=`${J.alphaPattern}, ${s(e)}`;break;case 4:t="h",i=360*this.color.H.value,n="linear-gradient(to right, #f00 0%, #ff0 16.666%, #0f0 33.333%, #0ff 50%, #00f 66.666%, #f0f 83.333%, #f00 100%)";break;case 5:t="s",i=this.color.S.value,n=`linear-gradient(to right,#${this.#be.setFromHSVA(this.color.H.value,0,this.color.V.value,1),this.#be.toRGBAString()},#${this.#be.setFromHSVA(this.color.H.value,1,this.color.V.value,1),this.#be.toRGBAString()})`;break;case 6:t="v",i=this.color.V.value,n=`linear-gradient(to right, #000, #${this.fullColor.toRGBAString()})`}return n=`background: ${n};`,T`
${t.toUpperCase()}
`}renderContent(){const e=2*this.color.H.value*Math.PI,t={"--ueb-color-r":this.color.R.toString(),"--ueb-color-g":this.color.G.toString(),"--ueb-color-b":this.color.B.toString(),"--ueb-color-a":this.color.A.toString(),"--ueb-color-h":this.color.H.toString(),"--ueb-color-s":this.color.S.toString(),"--ueb-color-v":this.color.V.toString(),"--ueb-color-wheel-x":100*(this.color.S.value*Math.cos(e)*.5+.5)+"%","--ueb-color-wheel-y":100*(this.color.S.value*Math.sin(e)*.5+.5)+"%"},i=this.color.toRGBAString(),n=this.color.toSRGBAString(),s=this.fullColor.toRGBAString();return T`
Old
New
Advanced
${this.renderSlider(0)} ${this.renderSlider(1)} ${this.renderSlider(2)} ${this.renderSlider(3)}
${this.renderSlider(4)} ${this.renderSlider(5)} ${this.renderSlider(6)}
Hex Linear
Hex sRGB
OK
Cancel
`}renderWindowName(){return T`Color Picker`}}class Et extends Fe{static#ye={window:ft,"color-picker":yt};static properties={...Fe.properties,type:{type:ft,attribute:"data-type",reflect:!0,converter:{fromAttribute:(e,t)=>Et.#ye[e],toAttribute:(e,t)=>Object.entries(Et.#ye).find((([t,i])=>e==i))[0]}}};constructor(e={}){e.type.constructor==String&&(e.type=Et.#ye[e.type]),e.type??=ft,e.windowOptions??={},super({},new e.type),this.type=e.type,this.windowOptions=e.windowOptions}disconnectedCallback(){super.disconnectedCallback(),this.dispatchCloseEvent()}dispatchCloseEvent(){let e=new CustomEvent(J.windowCloseEventName);this.dispatchEvent(e)}}class wt extends it{#Y;#Ee;#we=e=>{this.#Ee=new Et({type:yt,windowOptions:{getPinColor:()=>this.element.defaultValue,setPinColor:e=>this.element.setDefaultValue(e)}}),this.element.blueprint.append(this.#Ee);const t=()=>{this.element.setDefaultValue(this.#Ee.template.color)},i=()=>{this.#Ee.removeEventListener(J.windowApplyEventName,t),this.#Ee.removeEventListener(J.windowCloseEventName,i),this.#Ee=null};this.#Ee.addEventListener(J.windowApplyEventName,t),this.#Ee.addEventListener(J.windowCloseEventName,i)};firstUpdated(e){super.firstUpdated(e),this.#Y=this.element.querySelector(".ueb-pin-input")}renderInput(){return T``}}class St extends at{static singleLineInput=!0}class Pt extends lt{setDefaultValue(e=[],t=e){this.element.setDefaultValue(e[0])}renderInput(){return T`
`}}class kt extends it{renderIcon(){return T``}}class Ct extends lt{setDefaultValue(e=[],t=e){if(!(this.element.entity.DefaultValue instanceof be))throw new TypeError("Expected DefaultValue to be a VectorEntity");let i=this.element.entity.DefaultValue;i.R=e[0],i.P=e[1],i.Y=e[2]}renderInput(){return T`
X
Y
Z
`}}class xt extends at{}class Nt extends lt{setDefaultValue(e,t){if(!(this.element.entity.DefaultValue instanceof ye))throw new TypeError("Expected DefaultValue to be a VectorEntity");let i=this.element.entity.DefaultValue;i.X=e[0],i.Y=e[1],i.Z=e[2]}renderInput(){return T`
X
Y
Z
`}}class At extends Ge{static#ye={"/Script/CoreUObject.LinearColor":wt,"/Script/CoreUObject.Rotator":Ct,"/Script/CoreUObject.Vector":Nt,bool:rt,exec:ot,int:ut,MUTABLE_REFERENCE:kt,name:St,real:Pt,string:xt};static properties={pinType:{type:String,attribute:"data-type",reflect:!0},advancedView:{type:String,attribute:"data-advanced-view",reflect:!0},color:{type:pe,converter:{fromAttribute:(e,t)=>e?$e.grammar.LinearColorFromAnyColor.parse(e).value:null,toAttribute:(e,t)=>e?ne.printLinearColor(e):null},attribute:"data-color",reflect:!0},defaultValue:{type:String,attribute:!1},isLinked:{type:Boolean,converter:ne.booleanConverter,attribute:"data-linked",reflect:!0},pinDirection:{type:String,attribute:"data-direction",reflect:!0}};static getTypeTemplate(e){return At.#ye[e.PinType.bIsReference&&!e.PinType.bIsConst?"MUTABLE_REFERENCE":e.getType()]??it}nodeElement;connections=0;constructor(e,t,i){super(e,t??new(At.getTypeTemplate(e))),this.pinType=this.entity.getType(),this.advancedView=this.entity.bAdvancedView,this.defaultValue=this.entity.getDefaultValue(),this.color=At.properties.color.converter.fromAttribute(J.pinColor[this.pinType]?.toString()),this.isLinked=!1,this.pinDirection=e.isInput()?"input":e.isOutput()?"output":"hidden",this.nodeElement=i,this.entity.subscribe("PinToolTip",(e=>{let t=e.match(/\s*(.+?(?=\n)|.+\S)\s*/);return t?ne.formatStringName(t[1]):ne.formatStringName(this.entity.PinName)}))}GetPinId(){return this.entity.PinId}GetPinIdValue(){return this.GetPinId().value}getPinName(){return this.entity.PinName}getPinDisplayName(){let e=null;return this.entity.PinToolTip&&(e=this.entity.PinToolTip.match(/\s*(.+?(?=\n)|.+\S)\s*/))?ne.formatStringName(e[1]):ne.formatStringName(this.entity.PinName)}isInput(){return this.entity.isInput()}isOutput(){return this.entity.isOutput()}getLinkLocation(){return this.template.getLinkLocation()}getNodeElement(){return this.nodeElement}getLinks(){return this.entity.LinkedTo??[]}setDefaultValue(e){this.entity.DefaultValue=e,this.defaultValue=e}sanitizeLinks(e=[]){this.entity.LinkedTo=this.getLinks().filter((t=>{let i=this.blueprint.getPin(t);if(i){if(e.length&&!e.includes(i.nodeElement))return!1;this.blueprint.getLink(this,i,!0)||this.blueprint.addGraphElement(new et(this,i))}return i}))}linkTo(e){this.entity.linkTo(e.getNodeElement().getNodeName(),e.entity),this.isLinked=this.entity.isLinked()}unlinkFrom(e){this.entity.unlinkFrom(e.getNodeElement().getNodeName(),e.entity),this.isLinked=this.entity.isLinked()}redirectLink(e,t){const i=this.entity.LinkedTo.findIndex((t=>t.objectName.toString()==e.getNodeElement().getNodeName()&&t.pinGuid.valueOf()==e.entity.PinId.valueOf()));return i>=0&&(this.entity.LinkedTo[i]=t,!0)}}class $t extends Ye{#Se;get inputPin(){return this.#Se}#Pe;get outputPin(){return this.#Pe}render(){return T`
`}firstUpdated(e){super.firstUpdated(e);const t=this.element.querySelector(".ueb-node-border");Promise.all(this.element.getPinElements().map((e=>e.updateComplete))).then((()=>this.element.dispatchReflowEvent())),this.element.getPinElements().forEach((e=>t.appendChild(e)))}getPinElements(e){return e.querySelectorAll("ueb-pin")}createPinElements(){const e=this.element.getPinEntities().filter((e=>!e.isHidden())),t=e[e[0].isInput()?0:1],i=e[e[0].isOutput()?0:1];return[this.#Se=new At(t,new nt,this.element),this.#Pe=new At(i,new nt,this.element)]}}class Lt extends Ye{toggleAdvancedDisplayHandler=e=>{this.element.toggleShowAdvancedPinDisplay(),this.element.addNextUpdatedCallbacks((()=>this.element.dispatchReflowEvent()),!0)};render(){return T`
${this.element.nodeDisplayName}
${"DevelopmentOnly"==this.element.enabledState?.toString()?T`
Development Only
`:M} ${this.element.advancedPinDisplay?T`
`:M}
`}firstUpdated(e){super.firstUpdated(e);const t=this.element.querySelector(".ueb-node-inputs"),i=this.element.querySelector(".ueb-node-outputs");Promise.all(this.element.getPinElements().map((e=>e.updateComplete))).then((()=>this.element.dispatchReflowEvent())),this.element.getPinElements().forEach((e=>{e.isInput()?t.appendChild(e):e.isOutput()&&i.appendChild(e)})),this.element.nodeNameElement=this.element.querySelector(".ueb-node-name-text")}getPinElements(e){return e.querySelectorAll("ueb-pin")}createPinElements(){return this.element.getPinEntities().filter((e=>!e.isHidden())).map((e=>new At(e,void 0,this.element)))}}class Tt extends Ue{static#ye={"/Script/BlueprintGraph.K2Node_Knot":$t};static properties={...Ue.properties,nodeClass:{type:String,attribute:"data-type",reflect:!0},name:{type:String,attribute:"data-name",reflect:!0},advancedPinDisplay:{type:String,attribute:"data-advanced-display",converter:le.attributeConverter,reflect:!0},enabledState:{type:String,attribute:"data-enabled-state",reflect:!0},nodeDisplayName:{type:String,attribute:!1},pureFunction:{type:Boolean,converter:ne.booleanConverter,attribute:"data-pure-function",reflect:!0}};static dragEventName=J.nodeDragEventName;static dragGeneralEventName=J.nodeDragGeneralEventName;get blueprint(){return super.blueprint}set blueprint(e){super.blueprint=e,this.#ke.forEach((t=>t.blueprint=e))}#Ce;get nodeNameElement(){return this.#Ce}set nodeNameElement(e){this.#Ce=e}#ke;constructor(e,t){super(e,t??new(Tt.getTypeTemplate(e))),this.#ke=this.template.createPinElements(),this.nodeClass=this.entity.getClass(),this.name=this.entity.getObjectName(),this.advancedPinDisplay=this.entity.AdvancedPinDisplay?.toString(),this.enabledState=this.entity.EnabledState,this.nodeDisplayName=this.entity.getDisplayName(),this.pureFunction=this.entity.bIsPureFunc,this.dragLinkObjects=[],super.setLocation([this.entity.NodePosX.value,this.entity.NodePosY.value]),this.entity.subscribe("AdvancedPinDisplay",(e=>this.advancedPinDisplay=e)),this.entity.subscribe("Name",(e=>this.name=e))}static getTypeTemplate(e){return Tt.#ye[e.getClass()]??Lt}static fromSerializedObject(e){e=e.trim();let t=te.getSerializer(Pe).deserialize(e);return new Tt(t)}disconnectedCallback(){super.disconnectedCallback(),this.dispatchDeleteEvent()}getType(){return this.entity.getClass()}getNodeName(){return this.entity.getObjectName()}getNodeDisplayName(){return this.entity.getDisplayName()}sanitizeLinks(e=[]){this.getPinElements().forEach((t=>t.sanitizeLinks(e)))}rename(e){if(this.entity.Name==e)return!1;for(let t of this.getPinElements())for(let i of t.getLinks())this.blueprint.getPin(i).redirectLink(t,new ve({objectName:e,pinGuid:t.entity.PinId}));this.entity.Name=e}getPinElements(){return this.#ke}getPinEntities(){return this.entity.CustomProperties.filter((e=>e instanceof we))}setLocation(e=[0,0]){let t=this.entity.NodePosX.constructor;this.entity.NodePosX=new t(e[0]),this.entity.NodePosY=new t(e[1]),super.setLocation(e)}dispatchDeleteEvent(){let e=new CustomEvent(J.nodeDeleteEventName);this.dispatchEvent(e)}dispatchReflowEvent(){let e=new CustomEvent(J.nodeReflowEventName);this.dispatchEvent(e)}setShowAdvancedPinDisplay(e){this.entity.AdvancedPinDisplay=new le(e?"Shown":"Hidden")}toggleShowAdvancedPinDisplay(){this.setShowAdvancedPinDisplay("Shown"!=this.entity.AdvancedPinDisplay?.toString())}}class Ot extends Q{static#p=new Le;#xe;constructor(e,t,i={}){i.listenOnFocus??=!0,i.unlistenOnTextEdit??=!0,super(e,t,i);let n=this;this.#xe=e=>n.pasted(e.clipboardData.getData("Text"))}listenEvents(){document.body.addEventListener("paste",this.#xe)}unlistenEvents(){document.body.removeEventListener("paste",this.#xe)}pasted(e){let t=0,i=0,n=0,s=Ot.#p.readMultiple(e).map((e=>{let s=new Tt(e);return t+=s.locationY,i+=s.locationX,++n,s}));t/=n,i/=n,s.length>0&&this.blueprint.unselectAll();let r=this.blueprint.mousePosition;return s.forEach((e=>{const n=[r[0]-i,r[1]-t];e.addLocation(n),e.snapToGrid(),e.setSelected(!0)})),this.blueprint.addGraphElement(...s),!0}}class Mt extends ze{constructor(e,t,i){super(e,t,i),this.selectorElement=this.blueprint.selectorElement}startDrag(){this.selectorElement.beginSelect(this.clickedPosition)}dragTo(e,t){this.selectorElement.selectTo(e)}endDrag(){this.started&&this.selectorElement.endSelect()}unclicked(){this.started||this.blueprint.unselectAll()}}class Dt{constructor(e=(e=>e),t=null){this.array=new Uint32Array(t),this.comparisonValueSupplier=e,this.length=0,this.currentPosition=0}get(e){return e>=0&&e=0&&this.currentPosition=0&&this.currentPosition0?this.get(this.currentPosition-1):null}getPrevValue(){return this.currentPosition>0?this.comparisonValueSupplier(this.get(this.currentPosition-1)):Number.MIN_SAFE_INTEGER}shiftLeft(e,t=1){this.array.set(this.array.subarray(e+t),e)}shiftRight(e,t=1){this.array.set(this.array.subarray(e,-t),e+t)}}class Ht{constructor(e,t,i,n){this.initialPosition=e,this.finalPosition=e,this.metadata=new Array(t.length),this.primaryOrder=new Dt((e=>this.metadata[e].primaryBoundary)),this.secondaryOrder=new Dt((e=>this.metadata[e].secondaryBoundary)),this.selectFunc=n,this.rectangles=t,this.primaryOrder.reserve(this.rectangles.length),this.secondaryOrder.reserve(this.rectangles.length),t.forEach(((e,t)=>{let s={primaryBoundary:this.initialPosition[0],secondaryBoundary:this.initialPosition[1],rectangle:t,onSecondaryAxis:!1};this.metadata[t]=s,n(e,!1);const r=i(e);this.initialPosition[1]{if(this.metadata[i].onSecondaryAxis)this.selectFunc(this.rectangles[i],n);else if(n){this.secondaryOrder.insert(i,e[1]);const n=this.metadata[i].secondaryBoundary;Math.sign(e[1]-n)==t[1]&&Math.sign(n-this.initialPosition[1])==t[1]&&this.selectFunc(this.rectangles[i],!0)}else this.selectFunc(this.rectangles[i],!1),this.secondaryOrder.remove(i);this.computeBoundaries(),this.selectTo(e)};e[0]this.boundaries.primaryN.v&&e[0]this.boundaries.primaryP.v&&(++this.primaryOrder.currentPosition,i(this.boundaries.primaryP.i,this.initialPosition[0]{this.selectFunc(this.rectangles[t],i),this.computeBoundaries(),this.selectTo(e)};e[1]this.boundaries.secondaryN.v&&e[1]this.boundaries.secondaryP.v&&(++this.secondaryOrder.currentPosition,n(this.boundaries.secondaryP.i,this.initialPosition[1]n.clickedSomewhere(e.target),this.blueprint.focus&&document.addEventListener("click",this.#Ne)}clickedSomewhere(e){e.closest("ueb-blueprint")||this.blueprint.setFocused(!1)}listenEvents(){document.addEventListener("click",this.#Ne)}unlistenEvents(){document.removeEventListener("click",this.#Ne)}}class Rt extends Oe{static styleVariables={"--ueb-font-size":`${J.fontSize}`,"--ueb-grid-axis-line-color":`${J.gridAxisLineColor}`,"--ueb-grid-expand":`${J.expandGridSize}px`,"--ueb-grid-line-color":`${J.gridLineColor}`,"--ueb-grid-line-width":`${J.gridLineWidth}px`,"--ueb-grid-set-line-color":`${J.gridSetLineColor}`,"--ueb-grid-set":`${J.gridSet}`,"--ueb-grid-size":`${J.gridSize}px`,"--ueb-link-min-width":`${J.linkMinWidth}`,"--ueb-node-radius":`${J.nodeRadius}px`};constructed(e){super.constructed(e),this.element.style.cssText=Object.entries(Rt.styleVariables).map((([e,t])=>`${e}:${t};`)).join("")}createInputObjects(){return[...super.createInputObjects(),new Te(this.element.getGridDOMElement(),this.element),new Ot(this.element.getGridDOMElement(),this.element),new De(this.element.getGridDOMElement(),this.element),new Re(this.element.getGridDOMElement(),this.element),new Ie(this.element.getGridDOMElement(),this.element),new Mt(this.element.getGridDOMElement(),this.element,{clickButton:0,exitAnyButton:!0,moveEverywhere:!0}),new je(this.element.getGridDOMElement(),this.element,{clickButton:2,exitAnyButton:!1,moveEverywhere:!0}),new Bt(this.element.getGridDOMElement(),this.element),new Ve(this.element.getGridDOMElement(),this.element),new Be(this.element.getGridDOMElement(),this.element)]}render(){return T`
${0==this.element.zoom?"1:1":this.element.zoom}
`}firstUpdated(e){super.firstUpdated(e),this.element.headerElement=this.element.querySelector(".ueb-viewport-header"),this.element.overlayElement=this.element.querySelector(".ueb-viewport-overlay"),this.element.viewportElement=this.element.querySelector(".ueb-viewport-body"),this.element.selectorElement=new It,this.element.querySelector(".ueb-grid-content")?.append(this.element.selectorElement),this.element.gridElement=this.element.viewportElement.querySelector(".ueb-grid"),this.element.linksContainerElement=this.element.querySelector("[data-links]"),this.element.linksContainerElement.append(...this.element.getLinks()),this.element.nodesContainerElement=this.element.querySelector("[data-nodes]"),this.element.nodesContainerElement.append(...this.element.getNodes()),this.element.viewportElement.scroll(J.expandGridSize,J.expandGridSize)}updated(e){if(super.updated(e),(e.has("scrollX")||e.has("scrollY"))&&this.element.viewportElement.scroll(this.element.scrollX,this.element.scrollY),e.has("zoom")){const t=e.get("zoom"),i=Math.min(t,this.element.zoom),n=Math.max(t,this.element.zoom),s=ne.range(i,n),r=e=>`ueb-zoom-${e}`;te<0)).map(r)),this.element.classList.add(...s.filter((e=>e>0)).map(r))):(this.element.classList.remove(...s.filter((e=>e>0)).map(r)),this.element.classList.add(...s.filter((e=>e<0)).map(r)))}}getPin(e){return this.element.querySelector(`ueb-node[data-name="${e.objectName}"] ueb-pin[data-id="${e.pinGuid}"]`)}}class Gt extends Ge{static properties={selecting:{type:Boolean,attribute:"data-selecting",reflect:!0,converter:ne.booleanConverter},scrolling:{type:Boolean,attribute:"data-scrolling",reflect:!0,converter:ne.booleanConverter},focused:{type:Boolean,attribute:"data-focused",reflect:!0,converter:ne.booleanConverter},zoom:{type:Number,attribute:"data-zoom",reflect:!0},scrollX:{type:Number,attribute:!1},scrollY:{type:Number,attribute:!1},additionalX:{type:Number,attribute:!1},additionalY:{type:Number,attribute:!1},translateX:{type:Number,attribute:!1},translateY:{type:Number,attribute:!1}};static styles=Rt.styles;#Ae=new Map;nodes=[];links=[];mousePosition=[0,0];gridElement;viewportElement;overlayElement;selectorElement;linksContainerElement;nodesContainerElement;headerElement;focused=!1;waitingExpandUpdate=!1;nodeBoundariesSupplier=e=>{let t=e.getBoundingClientRect(),i=this.nodesContainerElement.getBoundingClientRect();const n=1/this.getScale();return{primaryInf:(t.left-i.left)*n,primarySup:(t.right-i.right)*n,secondaryInf:(t.top-i.top)*n,secondarySup:(t.bottom-i.bottom)*n}};nodeSelectToggleFunction=(e,t)=>{e.setSelected(t)};constructor(e=new J){super({},new Rt),this.selecting=!1,this.scrolling=!1,this.focused=!1,this.zoom=0,this.scrollX=J.expandGridSize,this.scrollY=J.expandGridSize,this.translateX=J.expandGridSize,this.translateY=J.expandGridSize}getGridDOMElement(){return this.gridElement}disconnectedCallback(){super.disconnectedCallback()}getScroll(){return[this.scrollX,this.scrollY]}setScroll([e,t],i=!1){this.scrollX=e,this.scrollY=t}scrollDelta(e,t=!1){const i=[2*J.expandGridSize,2*J.expandGridSize];let n=this.getScroll(),s=[n[0]+e[0],n[1]+e[1]],r=[0,0];for(let t=0;t<2;++t)e[t]<0&&s[t]0&&s[t]>i[t]-J.gridExpandThreshold*J.expandGridSize&&(r[t]=1);0==r[0]&&0==r[1]||this.seamlessExpand(r),n=this.getScroll(),s=[n[0]+e[0],n[1]+e[1]],this.setScroll(s,t)}scrollCenter(){const e=this.getScroll(),t=[this.translateX-e[0],this.translateY-e[1]],i=this.getViewportSize().map((e=>e/2)),n=[t[0]-i[0],t[1]-i[1]];this.scrollDelta(n,!0)}getViewportSize(){return[this.viewportElement.clientWidth,this.viewportElement.clientHeight]}getScrollMax(){return[this.viewportElement.scrollWidth-this.viewportElement.clientWidth,this.viewportElement.scrollHeight-this.viewportElement.clientHeight]}snapToGrid(e){return ne.snapToGrid(e,J.gridSize)}seamlessExpand([e,t]){e=Math.round(e),t=Math.round(t);let i=this.getScale();[e,t]=[-e*J.expandGridSize,-t*J.expandGridSize],0!=e&&(this.scrollX+=e,e/=i),0!=t&&(this.scrollY+=t,t/=i),this.translateX+=e,this.translateY+=t}progressiveSnapToGrid(e){return J.expandGridSize*Math.round(e/J.expandGridSize+.5*Math.sign(e))}getZoom(){return this.zoom}setZoom(e,t){if((e=ne.clamp(e,J.minZoom,J.maxZoom))==this.zoom)return;let i=this.getScale();this.zoom=e,t&&requestAnimationFrame((e=>{t[0]+=this.translateX,t[1]+=this.translateY;let n=this.getScale()/i,s=[n*t[0],n*t[1]];this.scrollDelta([(s[0]-t[0])*i,(s[1]-t[1])*i])}))}getScale(){return parseFloat(getComputedStyle(this.gridElement).getPropertyValue("--ueb-scale"))}compensateTranslation([e,t]){return[e-=this.translateX,t-=this.translateY]}getNodes(e=!1){return e?this.nodes.filter((e=>e.selected)):this.nodes}getPin(e){let t=this.template.getPin(e);return t&&t.nodeElement.getNodeName()==e.objectName.toString()?t:[...this.nodes.find((t=>e.objectName.toString()==t.getNodeName()))?.getPinElements()??[]].find((t=>e.pinGuid.toString()==t.GetPinIdValue()))}getLinks([e,t]=[]){if(null==e!=t==null){const i=e??t;return this.links.filter((e=>e.sourcePin==i||e.destinationPin==i))}return null!=e&&null!=t?this.links.filter((i=>i.sourcePin==e&&i.destinationPin==t||i.sourcePin==t&&i.destinationPin==e)):this.links}getLink(e,t,i=!1){return this.links.find((n=>n.sourcePin==e&&n.destinationPin==t||i&&n.sourcePin==t&&n.destinationPin==e))}selectAll(){this.getNodes().forEach((e=>this.nodeSelectToggleFunction(e,!0)))}unselectAll(){this.getNodes().forEach((e=>this.nodeSelectToggleFunction(e,!1)))}addGraphElement(...e){for(let t of e)if(t.blueprint=this,t instanceof Tt&&!this.nodes.includes(t)){const e=t.entity.getObjectName(),i=this.nodes.find((t=>t.entity.getObjectName()==e));if(i){let e=i.entity.getObjectName(!0);this.#Ae[e]=this.#Ae[e]??-1;do{++this.#Ae[e]}while(this.nodes.find((t=>t.entity.getObjectName()==J.nodeName(e,this.#Ae[e]))));i.rename(J.nodeName(e,this.#Ae[e]))}this.nodes.push(t),this.nodesContainerElement?.appendChild(t)}else t instanceof et&&!this.links.includes(t)&&(this.links.push(t),this.linksContainerElement&&!this.linksContainerElement.contains(t)&&this.linksContainerElement.appendChild(t));e.filter((e=>e instanceof Tt)).forEach((t=>t.sanitizeLinks(e)))}removeGraphElement(...e){for(let t of e)if(t.closest("ueb-blueprint")==this){t.remove();let e=t instanceof Tt?this.nodes:t instanceof et?this.links:null;e?.splice(e.findIndex((e=>e===t)),1)}}setFocused(e=!0){if(this.focused==e)return;let t=new CustomEvent(e?"blueprint-focus":"blueprint-unfocus");this.focused=e,this.focused||this.unselectAll(),this.dispatchEvent(t)}dispatchEditTextEvent(e){const t=new CustomEvent(e?J.editTextEventName.begin:J.editTextEventName.end);this.dispatchEvent(t)}}customElements.define("ueb-blueprint",Gt);class Ft extends Oe{#$e=()=>{this.element.blueprint.dispatchEditTextEvent(!0),this.element.selectOnFocus&&getSelection().selectAllChildren(this.element)};#Le=()=>{this.element.blueprint.dispatchEditTextEvent(!1),document.getSelection()?.removeAllRanges()};#Te=e=>e.target.querySelectorAll("br").forEach((e=>e.remove()));#Oe=e=>{"Enter"!=e.code||e.shiftKey||e.target.blur()};constructed(e){super.constructed(e),this.element.classList.add("ueb-pin-input-content"),this.element.setAttribute("role","textbox"),this.element.contentEditable="true"}connectedCallback(){this.element.addEventListener("focus",this.#$e),this.element.addEventListener("focusout",this.#Le),this.element.singleLine&&this.element.addEventListener("input",this.#Te),this.element.blurOnEnter&&this.element.addEventListener("keydown",this.#Oe)}cleanup(){this.element.removeEventListener("focus",this.#$e),this.element.removeEventListener("focusout",this.#Le),this.element.singleLine&&this.element.removeEventListener("input",this.#Te),this.element.blurOnEnter&&this.element.removeEventListener("keydown",this.#Oe)}}class zt extends Ge{static properties={...super.properties,singleLine:{type:Boolean,attribute:"data-single-line",converter:ne.booleanConverter,reflect:!0},selectOnFocus:{type:Boolean,attribute:"data-select-focus",converter:ne.booleanConverter,reflect:!0},blurOnEnter:{type:Boolean,attribute:"data-blur-enter",converter:ne.booleanConverter,reflect:!0}};constructor(){super({},new Ft),this.singleLine=!1,this.selectOnFocus=!0,this.blurOnEnter=!0}}class jt extends $e{constructor(e,t,i,n,s,r,o){e=e??(e=>`(${e})`),super(t,i,n,s,r,o),this.wrap=e}read(e){const t=Ae.getGrammarForType($e.grammar,this.entityType).parse(e);if(!t.status)throw new Error(`Error when trying to parse the entity ${this.entityType.prototype.constructor.name}.`);return t.value}write(e,t,i=!1){return this.wrap(this.subWrite(e,[],t,i))}}class Vt extends jt{#Me;constructor(e,t){super(void 0,t),this.#Me=e}write(e,t,i=!1){return this.#Me(t,i)}}class Ut extends jt{constructor(e){super(void 0,e)}write(e,t,i){return i||t.constructor!==String?ne.escapeString(t.toString()):`"${ne.escapeString(t.toString())}"`}}!function(){const e=e=>`(${e})`;te.registerSerializer(null,new Vt(((e,t)=>"()"),null)),te.registerSerializer(Array,new Vt(((e,t)=>`(${e.map((e=>te.getSerializer(ne.getType(e)).serialize(e,t)+",")).join("")})`),Array)),te.registerSerializer(Boolean,new Vt(((e,t)=>e?t?"true":"True":t?"false":"False"),Boolean)),te.registerSerializer(oe,new jt(e,oe)),te.registerSerializer(ae,new Ut(ae)),te.registerSerializer(le,new Ut(le)),te.registerSerializer(ue,new Ut(ue)),te.registerSerializer(ce,new jt((e=>`${ce.lookbehind}(${e})`),ce,"",", ",!1,"",(e=>""))),te.registerSerializer(he,new jt(e,he)),te.registerSerializer(pe,new jt(e,pe)),te.registerSerializer(me,new jt((e=>`${me.lookbehind}(${e})`),me,"",", ",!1,"",(e=>""))),te.registerSerializer(Number,new Vt((e=>e.toString()),Number)),te.registerSerializer(Pe,new Le),te.registerSerializer(re,new Vt((e=>(e.type??"")+(e.path?e.type?`'"${e.path}"'`:`"${e.path}"`:"")),re)),te.registerSerializer(ge,new Ut(ge)),te.registerSerializer(we,new jt((e=>`${we.lookbehind} (${e})`),we,"",",",!0)),te.registerSerializer(ve,new jt((e=>e),ve,""," ",!1,"",(e=>""))),te.registerSerializer(de,new Ut(de)),te.registerSerializer(be,new jt(e,be)),te.registerSerializer(String,new Vt(((e,t)=>t?ne.escapeString(e):`"${ne.escapeString(e)}"`),String)),te.registerSerializer(fe,new Vt(((e,t)=>`${e.P}, ${e.Y}, ${e.R}`),fe)),te.registerSerializer(Ee,new Vt(((e,t)=>`${e.X}, ${e.Y}, ${e.Z}`),Ee)),te.registerSerializer(ye,new jt(e,ye))}(),customElements.define("ueb-color-handler",gt),customElements.define("ueb-input",zt),customElements.define("ueb-link",et),customElements.define("ueb-node",Tt),customElements.define("ueb-pin",At),customElements.define("ueb-selector",It),customElements.define("ueb-ui-slider",bt),customElements.define("ueb-window",Et);export{Gt as Blueprint,J as Configuration,et as LinkElement,Tt as NodeElement}; +const Mt=(e=>(...t)=>({_$litDirective$:e,values:t}))(class extends class{constructor(e){}get _$AU(){return this._$AM._$AU}_$AT(e,t,i){this._$Ct=e,this._$AM=t,this._$Ci=i}_$AS(e,t){return this.update(e,t)}update(e,t){return this.render(...t)}}{constructor(e){var t;if(super(e),e.type!==Dt||"style"!==e.name||(null===(t=e.strings)||void 0===t?void 0:t.length)>2)throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.")}render(e){return Object.keys(e).reduce(((t,i)=>{const n=e[i];return null==n?t:t+`${i=i.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g,"-$&").toLowerCase()}:${n};`}),"")}update(e,[t]){const{style:i}=e.element;if(void 0===this.vt){this.vt=new Set;for(const e in t)this.vt.add(e);return this.render(t)}this.vt.forEach((e=>{null==t[e]&&(this.vt.delete(e),e.includes("-")?i.removeProperty(e):i[e]="")}));for(const e in t){const n=t[e];null!=n&&(this.vt.add(e),e.includes("-")?i.setProperty(e,n):i[e]=n)}return O}});class Ht extends rt{toggleAdvancedDisplayHandler;getDraggableElement(){return this.element.querySelector(".ueb-window-top")}createDraggableObject(){return new nt(this.element,this.element.blueprint,{draggableElement:this.getDraggableElement(),ignoreTranslateCompensate:!0,movementSpace:this.element.blueprint,stepSize:1})}render(){return T`
${this.renderWindowName()}
${this.renderContent()}
`}renderWindowName(){return T`Window`}renderContent(){return T``}apply(){this.element.dispatchEvent(new CustomEvent(J.windowApplyEventName)),this.element.remove()}cancel(){this.element.dispatchEvent(new CustomEvent(J.windowCancelEventName)),this.element.remove()}}class _t extends Ht{#ve;#fe;#ye;#Ee;#we;#Se;#Pe;#ke;#Ce;#xe;#Ne=e=>{const t=ne.clearHTMLWhitespace(e.target.innerHTML),i=parseInt(t,16);isNaN(i)||(this.color.setFromRGBANumber(i),this.element.requestUpdate())};#Ae=e=>{const t=ne.clearHTMLWhitespace(e.target.innerHTML),i=parseInt(t,16);isNaN(i)||(this.color.setFromSRGBANumber(i),this.element.requestUpdate())};#$e=e=>t=>{"Enter"==t.code&&(t.preventDefault(),e(t))};#Le=new pe;get color(){return this.#Le}set color(e){e.toNumber()!=this.color?.toNumber()&&(this.element.requestUpdate("color",this.#Le),this.#Le=e)}#Te=new pe;get fullColor(){return this.#Te}#Oe;get initialColor(){return this.#Oe}#De=new pe;#Me(e,t,i=!1){const n=this.color.toRGBAString(),s=`${n.substring(0,2*e)}${t}${n.substring(2+2*e)}`;return i?`${s.substring(0,6)}FF`:s}connectedCallback(){super.connectedCallback(),this.#Oe=this.element.windowOptions.getPinColor(),this.color.setFromHSVA(this.initialColor.H.value,this.initialColor.S.value,this.initialColor.V.value,this.initialColor.A.value),this.fullColor.setFromHSVA(this.color.H.value,1,1,1)}firstUpdated(e){this.#ve=this.element.querySelector(".ueb-color-picker-wheel ueb-color-handler"),this.#fe=this.element.querySelector(".ueb-color-picker-saturation ueb-ui-slider"),this.#ye=this.element.querySelector(".ueb-color-picker-value ueb-ui-slider"),this.#Ee=this.element.querySelector(".ueb-color-picker-r ueb-ui-slider"),this.#we=this.element.querySelector(".ueb-color-picker-g ueb-ui-slider"),this.#Se=this.element.querySelector(".ueb-color-picker-b ueb-ui-slider"),this.#Pe=this.element.querySelector(".ueb-color-picker-a ueb-ui-slider"),this.#ke=this.element.querySelector(".ueb-color-picker-h ueb-ui-slider"),this.#Ce=this.element.querySelector(".ueb-color-picker-s ueb-ui-slider"),this.#xe=this.element.querySelector(".ueb-color-picker-v ueb-ui-slider"),this.#ve.template.locationChangeCallback=(e,t)=>{this.color.setFromWheelLocation([e,t],this.color.V.value,this.color.A.value),this.fullColor.setFromHSVA(this.color.H.value,1,1,1),this.element.requestUpdate()},this.#fe.template.locationChangeCallback=(e,t)=>{this.color.setFromHSVA(this.color.H.value,t,this.color.V.value,this.color.A.value),this.element.requestUpdate()},this.#ye.template.locationChangeCallback=(e,t)=>{this.color.setFromHSVA(this.color.H.value,this.color.S.value,t,this.color.A.value),this.element.requestUpdate()},this.#Ee.template.locationChangeCallback=(e,t)=>{this.color.setFromRGBA(e,this.color.G.value,this.color.B.value,this.color.A.value),this.element.requestUpdate()},this.#we.template.locationChangeCallback=(e,t)=>{this.color.setFromRGBA(this.color.R.value,e,this.color.B.value,this.color.A.value),this.element.requestUpdate()},this.#Se.template.locationChangeCallback=(e,t)=>{this.color.setFromRGBA(this.color.R.value,this.color.G.value,e,this.color.A.value),this.element.requestUpdate()},this.#Pe.template.locationChangeCallback=(e,t)=>{this.color.setFromRGBA(this.color.R.value,this.color.G.value,this.color.B.value,e),this.element.requestUpdate()},this.#ke.template.locationChangeCallback=(e,t)=>{this.color.setFromHSVA(e,this.color.S.value,this.color.V.value,this.color.A.value),this.element.requestUpdate()},this.#Ce.template.locationChangeCallback=(e,t)=>{this.color.setFromHSVA(this.color.H.value,e,this.color.V.value,this.color.A.value),this.element.requestUpdate()},this.#xe.template.locationChangeCallback=(e,t)=>{this.color.setFromHSVA(this.color.H.value,this.color.S.value,e,this.color.A.value),this.element.requestUpdate()}}renderSlider(e){let t="",i=0,n="";const s=e=>`linear-gradient(to right, #${this.#Me(e,"00",!0)}, #${this.#Me(e,"ff",!0)})`;switch(e){case 0:t="r",i=this.color.R.value,n=s(e);break;case 1:t="g",i=this.color.G.value,n=s(e);break;case 2:t="b",i=this.color.B.value,n=s(e);break;case 3:t="a",i=this.color.A.value,n=`${J.alphaPattern}, ${s(e)}`;break;case 4:t="h",i=360*this.color.H.value,n="linear-gradient(to right, #f00 0%, #ff0 16.666%, #0f0 33.333%, #0ff 50%, #00f 66.666%, #f0f 83.333%, #f00 100%)";break;case 5:t="s",i=this.color.S.value,n=`linear-gradient(to right,#${this.#De.setFromHSVA(this.color.H.value,0,this.color.V.value,1),this.#De.toRGBAString()},#${this.#De.setFromHSVA(this.color.H.value,1,this.color.V.value,1),this.#De.toRGBAString()})`;break;case 6:t="v",i=this.color.V.value,n=`linear-gradient(to right, #000, #${this.fullColor.toRGBAString()})`}return n=`background: ${n};`,T`
${t.toUpperCase()}
`}renderContent(){const e=2*this.color.H.value*Math.PI,t={"--ueb-color-r":this.color.R.toString(),"--ueb-color-g":this.color.G.toString(),"--ueb-color-b":this.color.B.toString(),"--ueb-color-a":this.color.A.toString(),"--ueb-color-h":this.color.H.toString(),"--ueb-color-s":this.color.S.toString(),"--ueb-color-v":this.color.V.toString(),"--ueb-color-wheel-x":100*(this.color.S.value*Math.cos(e)*.5+.5)+"%","--ueb-color-wheel-y":100*(this.color.S.value*Math.sin(e)*.5+.5)+"%"},i=this.color.toRGBAString(),n=this.color.toSRGBAString(),s=this.fullColor.toRGBAString();return T`
Old
New
Advanced
${this.renderSlider(0)} ${this.renderSlider(1)} ${this.renderSlider(2)} ${this.renderSlider(3)}
${this.renderSlider(4)} ${this.renderSlider(5)} ${this.renderSlider(6)}
Hex Linear
Hex sRGB
OK
Cancel
`}renderWindowName(){return T`Color Picker`}}class It extends ut{#pe;#He;#_e=e=>{this.#He=new(Ue.getConstructor("ueb-window"))({type:_t,windowOptions:{getPinColor:()=>this.element.defaultValue,setPinColor:e=>this.element.setDefaultValue(e)}}),this.element.blueprint.append(this.#He);const t=()=>{this.element.setDefaultValue(this.#He.template.color)},i=()=>{this.#He.removeEventListener(J.windowApplyEventName,t),this.#He.removeEventListener(J.windowCloseEventName,i),this.#He=null};this.#He.addEventListener(J.windowApplyEventName,t),this.#He.addEventListener(J.windowCloseEventName,i)};firstUpdated(e){super.firstUpdated(e),this.#pe=this.element.querySelector(".ueb-pin-input")}renderInput(){return T``}}class Bt extends Lt{static singleLineInput=!0}class Rt extends Tt{setDefaultValue(e=[],t=e){this.element.setDefaultValue(e[0])}renderInput(){return T`
`}}class Gt extends ut{renderIcon(){return T``}}class Ft extends Tt{setDefaultValue(e=[],t=e){if(!(this.element.entity.DefaultValue instanceof ve))throw new TypeError("Expected DefaultValue to be a VectorEntity");let i=this.element.entity.DefaultValue;i.R=e[0],i.P=e[1],i.Y=e[2]}renderInput(){return T`
X
Y
Z
`}}class zt extends Lt{}class jt extends Tt{setDefaultValue(e,t){if(!(this.element.entity.DefaultValue instanceof ye))throw new TypeError("Expected DefaultValue to be a VectorEntity");let i=this.element.entity.DefaultValue;i.X=e[0],i.Y=e[1],i.Z=e[2]}renderInput(){return T`
X
Y
Z
`}}class Vt extends Ge{static#se={"/Script/CoreUObject.LinearColor":It,"/Script/CoreUObject.Rotator":Ft,"/Script/CoreUObject.Vector":jt,bool:At,exec:$t,int:Ot,MUTABLE_REFERENCE:Gt,name:Bt,real:Rt,string:zt};static properties={pinType:{type:String,attribute:"data-type",reflect:!0},advancedView:{type:String,attribute:"data-advanced-view",reflect:!0},color:{type:pe,converter:{fromAttribute:(e,t)=>e?$e.grammar.LinearColorFromAnyColor.parse(e).value:null,toAttribute:(e,t)=>e?ne.printLinearColor(e):null},attribute:"data-color",reflect:!0},defaultValue:{type:String,attribute:!1},isLinked:{type:Boolean,converter:ne.booleanConverter,attribute:"data-linked",reflect:!0},pinDirection:{type:String,attribute:"data-direction",reflect:!0}};static getTypeTemplate(e){return Vt.#se[e.PinType.bIsReference&&!e.PinType.bIsConst?"MUTABLE_REFERENCE":e.getType()]??ut}nodeElement;connections=0;constructor(e,t,i){super(e,t??new(Vt.getTypeTemplate(e))),this.pinType=this.entity.getType(),this.advancedView=this.entity.bAdvancedView,this.defaultValue=this.entity.getDefaultValue(),this.color=Vt.properties.color.converter.fromAttribute(this.getColor().toString()),this.isLinked=!1,this.pinDirection=e.isInput()?"input":e.isOutput()?"output":"hidden",this.nodeElement=i,this.entity.subscribe("PinToolTip",(e=>{let t=e.match(/\s*(.+?(?=\n)|.+\S)\s*/);return t?ne.formatStringName(t[1]):ne.formatStringName(this.entity.PinName)}))}getPinId(){return this.entity.PinId}getPinName(){return this.entity.PinName}getPinDisplayName(){let e=null;return this.entity.PinToolTip&&(e=this.entity.PinToolTip.match(/\s*(.+?(?=\n)|.+\S)\s*/))?ne.formatStringName(e[1]):ne.formatStringName(this.entity.PinName)}getColor(){return this.pinType?J.pinColor[this.pinType]:J.pinColor.default}isInput(){return this.entity.isInput()}isOutput(){return this.entity.isOutput()}getLinkLocation(){return this.template.getLinkLocation()}getNodeElement(){return this.nodeElement}getLinks(){return this.entity.LinkedTo??[]}setDefaultValue(e){this.entity.DefaultValue=e,this.defaultValue=e}sanitizeLinks(e=[]){this.entity.LinkedTo=this.getLinks().filter((t=>{let i=this.blueprint.getPin(t);if(i){if(e.length&&!e.includes(i.nodeElement))return!1;this.blueprint.getLink(this,i,!0)||this.blueprint.addGraphElement(new(Ue.getConstructor("ueb-link"))(this,i))}return i}))}linkTo(e){this.entity.linkTo(e.getNodeElement().getNodeName(),e.entity),this.isLinked=this.entity.isLinked()}unlinkFrom(e){this.entity.unlinkFrom(e.getNodeElement().getNodeName(),e.entity),this.isLinked=this.entity.isLinked()}redirectLink(e,t){const i=this.entity.LinkedTo.findIndex((t=>t.objectName.toString()==e.getNodeElement().getNodeName()&&t.pinGuid.valueOf()==e.entity.PinId.valueOf()));return i>=0&&(this.entity.LinkedTo[i]=t,!0)}}class Ut extends Fe{static#se={window:Ht,"color-picker":_t};static properties={...Fe.properties,type:{type:Ht,attribute:"data-type",reflect:!0,converter:{fromAttribute:(e,t)=>Ut.#se[e],toAttribute:(e,t)=>Object.entries(Ut.#se).find((([t,i])=>e==i))[0]}}};constructor(e={}){e.type.constructor==String&&(e.type=Ut.#se[e.type]),e.type??=Ht,e.windowOptions??={},super({},new e.type),this.type=e.type,this.windowOptions=e.windowOptions}disconnectedCallback(){super.disconnectedCallback(),this.dispatchCloseEvent()}dispatchCloseEvent(){let e=new CustomEvent(J.windowCloseEventName);this.dispatchEvent(e)}}class Kt extends $e{constructor(e,t,i,n,s,r,o){e=e??(e=>`(${e})`),super(t,i,n,s,r,o),this.wrap=e}read(e){const t=Ae.getGrammarForType($e.grammar,this.entityType).parse(e);if(!t.status)throw new Error(`Error when trying to parse the entity ${this.entityType.prototype.constructor.name}.`);return t.value}write(e,t,i=!1){return this.wrap(this.subWrite(e,[],t,i))}}class Xt extends Kt{#Ie;constructor(e,t){super(void 0,t),this.#Ie=e}write(e,t,i=!1){return this.#Ie(t,i)}}class Wt extends Kt{constructor(e){super(void 0,e)}write(e,t,i){return i||t.constructor!==String?ne.escapeString(t.toString()):`"${ne.escapeString(t.toString())}"`}}!function(){const e=e=>`(${e})`;te.registerSerializer(null,new Xt(((e,t)=>"()"),null)),te.registerSerializer(Array,new Xt(((e,t)=>`(${e.map((e=>te.getSerializer(ne.getType(e)).serialize(e,t)+",")).join("")})`),Array)),te.registerSerializer(Boolean,new Xt(((e,t)=>e?t?"true":"True":t?"false":"False"),Boolean)),te.registerSerializer(oe,new Kt(e,oe)),te.registerSerializer(ae,new Wt(ae)),te.registerSerializer(le,new Wt(le)),te.registerSerializer(ue,new Wt(ue)),te.registerSerializer(ce,new Kt((e=>`${ce.lookbehind}(${e})`),ce,"",", ",!1,"",(e=>""))),te.registerSerializer(he,new Kt(e,he)),te.registerSerializer(pe,new Kt(e,pe)),te.registerSerializer(me,new Kt((e=>`${me.lookbehind}(${e})`),me,"",", ",!1,"",(e=>""))),te.registerSerializer(Number,new Xt((e=>e.toString()),Number)),te.registerSerializer(Pe,new Le),te.registerSerializer(re,new Xt((e=>(e.type??"")+(e.path?e.type?`'"${e.path}"'`:`"${e.path}"`:"")),re)),te.registerSerializer(ge,new Wt(ge)),te.registerSerializer(we,new Kt((e=>`${we.lookbehind} (${e})`),we,"",",",!0)),te.registerSerializer(be,new Kt((e=>e),be,""," ",!1,"",(e=>""))),te.registerSerializer(de,new Wt(de)),te.registerSerializer(ve,new Kt(e,ve)),te.registerSerializer(String,new Xt(((e,t)=>t?ne.escapeString(e):`"${ne.escapeString(e)}"`),String)),te.registerSerializer(fe,new Xt(((e,t)=>`${e.P}, ${e.Y}, ${e.R}`),fe)),te.registerSerializer(Ee,new Xt(((e,t)=>`${e.X}, ${e.Y}, ${e.Z}`),Ee)),te.registerSerializer(ye,new Kt(e,ye))}(),customElements.define("ueb-color-handler",St),Ue.registerElement("ueb-color-handler",St),customElements.define("ueb-input",xt),Ue.registerElement("ueb-input",xt),customElements.define("ueb-link",tt),Ue.registerElement("ueb-link",tt),customElements.define("ueb-node",pt),Ue.registerElement("ueb-node",pt),customElements.define("ueb-pin",Vt),Ue.registerElement("ueb-pin",Vt),customElements.define("ueb-selector",vt),Ue.registerElement("ueb-selector",vt),customElements.define("ueb-ui-slider",kt),Ue.registerElement("ueb-ui-slider",kt),customElements.define("ueb-window",Ut),Ue.registerElement("ueb-window",Ut);export{ft as Blueprint,J as Configuration,tt as LinkElement,pt as NodeElement}; diff --git a/js/Blueprint.js b/js/Blueprint.js index d0f7f93..5758b2c 100755 --- a/js/Blueprint.js +++ b/js/Blueprint.js @@ -298,7 +298,7 @@ export default class Blueprint extends IElement { return [... this.nodes .find(n => pinReference.objectName.toString() == n.getNodeName()) ?.getPinElements() ?? []] - .find(p => pinReference.pinGuid.toString() == p.GetPinIdValue()) + .find(p => pinReference.pinGuid.toString() == p.getPinId().toString()) } /** diff --git a/js/element/ElementFactory.js b/js/element/ElementFactory.js new file mode 100644 index 0000000..09a6c73 --- /dev/null +++ b/js/element/ElementFactory.js @@ -0,0 +1,25 @@ +/** + * @typedef {new (...args) => IElement} ElementConstructor + * @typedef {import("./IElement").default} IElement + */ + +export default class ElementFactory { + + /** @type {Map} */ + static #elementConstructors = new Map() + + /** + * @param {String} tagName + * @param {ElementConstructor} entityConstructor + */ + static registerElement(tagName, entityConstructor) { + ElementFactory.#elementConstructors.set(tagName, entityConstructor) + } + + /** + * @param {String} tagName + */ + static getConstructor(tagName) { + return ElementFactory.#elementConstructors.get(tagName) + } +} diff --git a/js/element/ISelectableDraggableElement.js b/js/element/ISelectableDraggableElement.js index 5f145a8..b8344a9 100644 --- a/js/element/ISelectableDraggableElement.js +++ b/js/element/ISelectableDraggableElement.js @@ -1,5 +1,4 @@ import Configuration from "../Configuration" -import IElement from "./IElement" import Utility from "../Utility" import IDraggableElement from "./IDraggableElement" diff --git a/js/element/NodeElement.js b/js/element/NodeElement.js index fe2a245..48282ed 100644 --- a/js/element/NodeElement.js +++ b/js/element/NodeElement.js @@ -4,7 +4,6 @@ import ISelectableDraggableElement from "./ISelectableDraggableElement" import KnotNodeTemplate from "../template/KnotNodeTemplate" import NodeTemplate from "../template/NodeTemplate" import ObjectEntity from "../entity/ObjectEntity" -import PinElement from "./PinElement" import PinEntity from "../entity/PinEntity" import PinReferenceEntity from "../entity/PinReferenceEntity" import SerializerFactory from "../serialization/SerializerFactory" diff --git a/js/element/PinElement.js b/js/element/PinElement.js index fe0a758..72c69f5 100644 --- a/js/element/PinElement.js +++ b/js/element/PinElement.js @@ -1,12 +1,12 @@ import BoolPinTemplate from "../template/BoolPinTemplate" import Configuration from "../Configuration" +import ElementFactory from "./ElementFactory" import ExecPinTemplate from "../template/ExecPinTemplate" import IElement from "./IElement" import IntPinTemplate from "../template/IntPinTemplate" import ISerializer from "../serialization/ISerializer" import LinearColorEntity from "../entity/LinearColorEntity" import LinearColorPinTemplate from "../template/LinearColorPinTemplate" -import LinkElement from "./LinkElement" import NamePinTemplate from "../template/NamePinTemplate" import PinTemplate from "../template/PinTemplate" import RealPinTemplate from "../template/RealPinTemplate" @@ -103,7 +103,6 @@ export default class PinElement extends IElement { /** @type {NodeElement} */ nodeElement - connections = 0 /** @@ -116,7 +115,7 @@ export default class PinElement extends IElement { this.pinType = this.entity.getType() this.advancedView = this.entity.bAdvancedView this.defaultValue = this.entity.getDefaultValue() - this.color = PinElement.properties.color.converter.fromAttribute(Configuration.pinColor[this.pinType]?.toString()) + this.color = PinElement.properties.color.converter.fromAttribute(this.getColor().toString()) this.isLinked = false this.pinDirection = entity.isInput() ? "input" : entity.isOutput() ? "output" : "hidden" this.nodeElement = nodeElement @@ -132,15 +131,10 @@ export default class PinElement extends IElement { } /** @return {GuidEntity} */ - GetPinId() { + getPinId() { return this.entity.PinId } - /** @return {String} */ - GetPinIdValue() { - return this.GetPinId().value - } - /** @returns {String} */ getPinName() { return this.entity.PinName @@ -158,6 +152,13 @@ export default class PinElement extends IElement { return Utility.formatStringName(this.entity.PinName) } + getColor() { + if (!this.pinType) { + return Configuration.pinColor["default"] + } + return Configuration.pinColor[this.pinType] + } + isInput() { return this.entity.isInput() } @@ -195,7 +196,7 @@ export default class PinElement extends IElement { } let link = this.blueprint.getLink(this, pin, true) if (!link) { - this.blueprint.addGraphElement(new LinkElement(this, pin)) + this.blueprint.addGraphElement(new (ElementFactory.getConstructor("ueb-link"))(this, pin)) } } return pin diff --git a/js/element/defineElements.js b/js/element/defineElements.js index 678c75a..a83cc37 100644 --- a/js/element/defineElements.js +++ b/js/element/defineElements.js @@ -1,5 +1,6 @@ import ColorHandlerElement from "./ColorHandlerElement" import ColorSliderElement from "./ColorSliderElement" +import ElementFactory from "./ElementFactory" import InputElement from "./InputElement" import LinkElement from "./LinkElement" import NodeElement from "./NodeElement" @@ -9,11 +10,19 @@ import WindowElement from "./WindowElement" export default function defineElements() { customElements.define("ueb-color-handler", ColorHandlerElement) + ElementFactory.registerElement("ueb-color-handler", ColorHandlerElement) customElements.define("ueb-input", InputElement) + ElementFactory.registerElement("ueb-input", InputElement) customElements.define("ueb-link", LinkElement) + ElementFactory.registerElement("ueb-link", LinkElement) customElements.define("ueb-node", NodeElement) + ElementFactory.registerElement("ueb-node", NodeElement) customElements.define("ueb-pin", PinElement) + ElementFactory.registerElement("ueb-pin", PinElement) customElements.define("ueb-selector", SelectorElement) + ElementFactory.registerElement("ueb-selector", SelectorElement) customElements.define("ueb-ui-slider", ColorSliderElement) + ElementFactory.registerElement("ueb-ui-slider", ColorSliderElement) customElements.define("ueb-window", WindowElement) -} \ No newline at end of file + ElementFactory.registerElement("ueb-window", WindowElement) +} diff --git a/js/entity/IEntity.js b/js/entity/IEntity.js index 76dd2c2..096cb8f 100644 --- a/js/entity/IEntity.js +++ b/js/entity/IEntity.js @@ -94,7 +94,7 @@ export default class IEntity extends Observable { } // @ts-expect-error const attributes = this.constructor.attributes - if (values.constructor !== Object && Object.getOwnPropertyNames(attributes).length == 1) { + if (values.constructor !== Object && Object.getOwnPropertyNames(attributes).length === 1) { // Where there is just one attribute, option can be the value of that attribute values = { [Object.getOwnPropertyNames(attributes)[0]]: values diff --git a/js/entity/ObjectReferenceEntity.js b/js/entity/ObjectReferenceEntity.js index d984023..a6bd038 100755 --- a/js/entity/ObjectReferenceEntity.js +++ b/js/entity/ObjectReferenceEntity.js @@ -8,6 +8,11 @@ export default class ObjectReferenceEntity extends IEntity { } constructor(options = {}) { + if (options.constructor !== Object) { + options = { + path: options + } + } super(options) /** @type {String} */ this.type /** @type {String} */ this.path diff --git a/js/entity/PinEntity.js b/js/entity/PinEntity.js index 286293d..8475188 100755 --- a/js/entity/PinEntity.js +++ b/js/entity/PinEntity.js @@ -37,7 +37,7 @@ export default class PinEntity extends IEntity { PinId: GuidEntity, PinName: "", PinFriendlyName: new TypeInitialization(LocalizedTextEntity, false, null), - PinToolTip: "", + PinToolTip: new TypeInitialization(String, false, ""), Direction: new TypeInitialization(String, false, ""), PinType: { PinCategory: "", diff --git a/js/entity/objects/KnotEntity.js b/js/entity/objects/KnotEntity.js new file mode 100644 index 0000000..b112934 --- /dev/null +++ b/js/entity/objects/KnotEntity.js @@ -0,0 +1,21 @@ +import ObjectEntity from "../ObjectEntity" +import ObjectReferenceEntity from "../ObjectReferenceEntity" +import PinEntity from "../PinEntity" + +export default class KnotEntity extends ObjectEntity { + + constructor(options = {}) { + super(options) + this.Class = new ObjectReferenceEntity("/Script/BlueprintGraph.K2Node_Knot") + this.Name = "K2Node_Knot" + this.CustomProperties = [ + new PinEntity({ + PinName: "InputPin", + }), + new PinEntity({ + PinName: "OutputPin", + Direction: "EGPD_Output", + }) + ] + } +} diff --git a/js/input/common/Paste.js b/js/input/common/Paste.js index 42fd09e..da55d90 100755 --- a/js/input/common/Paste.js +++ b/js/input/common/Paste.js @@ -1,7 +1,9 @@ +import ElementFactory from "../../element/ElementFactory" import IInput from "../IInput" -import NodeElement from "../../element/NodeElement" import ObjectSerializer from "../../serialization/ObjectSerializer" +/** @typedef {import("../../element/NodeElement").default} NodeElement */ + export default class Paste extends IInput { static #serializer = new ObjectSerializer() @@ -30,7 +32,9 @@ export default class Paste extends IInput { let left = 0 let count = 0 let nodes = Paste.#serializer.readMultiple(value).map(entity => { - let node = new NodeElement(entity) + /** @type {NodeElement} */ + // @ts-expect-error + let node = new (ElementFactory.getConstructor("ueb-node"))(entity) top += node.locationY left += node.locationX ++count diff --git a/js/input/mouse/IMouseClick.js b/js/input/mouse/MouseClick.js similarity index 97% rename from js/input/mouse/IMouseClick.js rename to js/input/mouse/MouseClick.js index 5cf6ca3..94d1e9f 100644 --- a/js/input/mouse/IMouseClick.js +++ b/js/input/mouse/MouseClick.js @@ -6,7 +6,7 @@ import IPointing from "./IPointing" * @template {HTMLElement} T * @extends {IPointing} */ -export default class IMouseClick extends IPointing { +export default class MouseClick extends IPointing { #mouseDownHandler = /** @param {MouseEvent} e */ @@ -15,7 +15,7 @@ export default class IMouseClick extends IPointing { switch (e.button) { case this.options.clickButton: // Either doesn't matter or consider the click only when clicking on the target, not descandants - if (!this.options.strictTarget || e.target == e.currentTarget) { + if (!this.options.strictTarget || e.target === e.currentTarget) { if (this.options.consumeEvent) { e.stopImmediatePropagation() // Captured, don't call anyone else } diff --git a/js/input/mouse/MouseCreateLink.js b/js/input/mouse/MouseCreateLink.js index 86f547d..3f8a3c5 100755 --- a/js/input/mouse/MouseCreateLink.js +++ b/js/input/mouse/MouseCreateLink.js @@ -1,9 +1,10 @@ import Configuration from "../../Configuration" +import ElementFactory from "../../element/ElementFactory" import IMouseClickDrag from "./IMouseClickDrag" -import LinkElement from "../../element/LinkElement" /** * @typedef {import("../../element/PinElement").default} PinElement + * @typedef {import("../../element/LinkElement").default} LinkElement * @typedef {import("../../template/KnotNodeTemplate").default} KnotNodeTemplate */ @@ -69,7 +70,9 @@ export default class MouseCreateLink extends IMouseClickDrag { if (this.target.nodeElement.getType() == Configuration.knotNodeTypeName) { this.#knotPin = this.target } - this.link = new LinkElement(this.target, null) + /** @type {LinkElement} */ + // @ts-expect-error + this.link = new (ElementFactory.getConstructor("ueb-link"))(this.target, null) this.blueprint.linksContainerElement.prepend(this.link) this.link.setMessagePlaceNode() this.#listenedPins = this.blueprint.querySelectorAll("ueb-pin") @@ -99,8 +102,8 @@ export default class MouseCreateLink extends IMouseClickDrag { // Knot pin direction correction if (this.#knotPin.isInput() && otherPin.isInput() || this.#knotPin.isOutput() && otherPin.isOutput()) { const oppositePin = this.#knotPin.isInput() - ?/** @type {KnotNodeTemplate} */(this.#knotPin.nodeElement.template).outputPin - :/** @type {KnotNodeTemplate} */(this.#knotPin.nodeElement.template).inputPin + ? /** @type {KnotNodeTemplate} */(this.#knotPin.nodeElement.template).outputPin + : /** @type {KnotNodeTemplate} */(this.#knotPin.nodeElement.template).inputPin if (this.#knotPin === this.link.sourcePin) { this.link.sourcePin = oppositePin } else { diff --git a/js/input/mouse/MouseDbClick.js b/js/input/mouse/MouseDbClick.js new file mode 100644 index 0000000..4857c7c --- /dev/null +++ b/js/input/mouse/MouseDbClick.js @@ -0,0 +1,59 @@ +import IPointing from "./IPointing" + +/** @typedef {import("../../Blueprint").default} Blueprint */ + +/** + * @template {HTMLElement} T + * @extends {IPointing} + */ +export default class MouseDbClick extends IPointing { + + static ignoreDbClick = + /** @param {Number[]} location */ + location => { } + + #mouseDbClickHandler = + /** @param {MouseEvent} e */ + e => { + if (!this.options.strictTarget || e.target === e.currentTarget) { + if (this.options.consumeEvent) { + e.stopImmediatePropagation() // Captured, don't call anyone else + } + this.clickedPosition = this.locationFromEvent(e) + this.blueprint.mousePosition[0] = this.clickedPosition[0] + this.blueprint.mousePosition[1] = this.clickedPosition[1] + this.dbclicked(this.clickedPosition) + } + } + + #onDbClick + get onDbClick() { + return this.#onDbClick + } + set onDbClick(value) { + this.#onDbClick = value + } + + clickedPosition = [0, 0] + + constructor(target, blueprint, options = {}, onDbClick = MouseDbClick.ignoreDbClick) { + options.consumeEvent ??= true + options.strictTarget ??= false + super(target, blueprint, options) + this.#onDbClick = onDbClick + this.listenEvents() + } + + listenEvents() { + this.target.addEventListener("dblclick", this.#mouseDbClickHandler) + } + + unlistenEvents() { + this.target.removeEventListener("dblclick", this.#mouseDbClickHandler) + } + + /* Subclasses will override the following method */ + dbclicked(location) { + this.onDbClick(location) + } +} diff --git a/js/template/BlueprintTemplate.js b/js/template/BlueprintTemplate.js index 7bdb3e8..6633d8a 100755 --- a/js/template/BlueprintTemplate.js +++ b/js/template/BlueprintTemplate.js @@ -9,7 +9,6 @@ import MouseScrollGraph from "../input/mouse/MouseScrollGraph" import MouseTracking from "../input/mouse/MouseTracking" import Paste from "../input/common/Paste" import Select from "../input/mouse/Select" -import SelectorElement from "../element/SelectorElement" import Unfocus from "../input/mouse/Unfocus" import Utility from "../Utility" import Zoom from "../input/mouse/Zoom" @@ -17,6 +16,7 @@ import Zoom from "../input/mouse/Zoom" /** * @typedef {import("../Blueprint").default} Blueprint * @typedef {import("../element/PinElement").default} PinElement + * @typedef {import("../element/SelectorElement").default} SelectorElement * @typedef {import("../entity/PinReferenceEntity").default} PinReferenceEntity */ @@ -78,6 +78,7 @@ export default class BlueprintTemplate extends ITemplate {
+
@@ -90,8 +91,7 @@ export default class BlueprintTemplate extends ITemplate { this.element.headerElement = /** @type {HTMLElement} */(this.element.querySelector('.ueb-viewport-header')) this.element.overlayElement = /** @type {HTMLElement} */(this.element.querySelector('.ueb-viewport-overlay')) this.element.viewportElement = /** @type {HTMLElement} */(this.element.querySelector('.ueb-viewport-body')) - this.element.selectorElement = new SelectorElement() - this.element.querySelector(".ueb-grid-content")?.append(this.element.selectorElement) + this.element.selectorElement = /** @type {SelectorElement} */(this.element.querySelector('ueb-selector')) this.element.gridElement = /** @type {HTMLElement} */(this.element.viewportElement.querySelector(".ueb-grid")) this.element.linksContainerElement = /** @type {HTMLElement} */(this.element.querySelector("[data-links]")) this.element.linksContainerElement.append(...this.element.getLinks()) diff --git a/js/template/KnotNodeTemplate.js b/js/template/KnotNodeTemplate.js index f0db84d..4cf4d16 100644 --- a/js/template/KnotNodeTemplate.js +++ b/js/template/KnotNodeTemplate.js @@ -1,9 +1,12 @@ import { html } from "lit" +import ElementFactory from "../element/ElementFactory" import ISelectableDraggableTemplate from "./ISelectableDraggableTemplate" import KnotPinTemplate from "./KnotPinTemplate" -import PinElement from "../element/PinElement" -/** @typedef {import("../element/NodeElement").default} NodeElement */ +/** + * @typedef {import("../element/NodeElement").default} NodeElement + * @typedef {import("../element/PinElement").default} PinElement + */ /** @extends {ISelectableDraggableTemplate} */ export default class KnotNodeTemplate extends ISelectableDraggableTemplate { @@ -46,9 +49,18 @@ export default class KnotNodeTemplate extends ISelectableDraggableTemplate { const entities = this.element.getPinEntities().filter(v => !v.isHidden()) const inputEntity = entities[entities[0].isInput() ? 0 : 1] const outputEntity = entities[entities[0].isOutput() ? 0 : 1] + const pinElementConstructor = ElementFactory.getConstructor("ueb-pin") return [ - this.#inputPin = new PinElement(inputEntity, new KnotPinTemplate(), this.element), - this.#outputPin = new PinElement(outputEntity, new KnotPinTemplate(), this.element), + this.#inputPin = /** @type {PinElement} */(new pinElementConstructor( + inputEntity, + new KnotPinTemplate(), + this.element + )), + this.#outputPin = /** @type {PinElement} */(new pinElementConstructor( + outputEntity, + new KnotPinTemplate(), + this.element + )), ] } } diff --git a/js/template/LinearColorPinTemplate.js b/js/template/LinearColorPinTemplate.js index 519ff16..d4010a8 100644 --- a/js/template/LinearColorPinTemplate.js +++ b/js/template/LinearColorPinTemplate.js @@ -1,11 +1,12 @@ import { html } from "lit" import ColorPickerWindowTemplate from "./ColorPickerWindowTemplate" import Configuration from "../Configuration" +import ElementFactory from "../element/ElementFactory" import PinTemplate from "./PinTemplate" -import WindowElement from "../element/WindowElement" /** * @typedef {import("../element/PinElement").default} PinElement + * @typedef {import("../element/WindowElement").default} WindowElement * @typedef {import("../entity/LinearColorEntity").default} LinearColorEntity */ @@ -22,15 +23,17 @@ export default class LinearColorPinTemplate extends PinTemplate { /** @param {MouseEvent} e */ e => { //e.preventDefault() - this.#window = new WindowElement({ - type: ColorPickerWindowTemplate, - windowOptions: { - // The created window will use the following functions to get and set the color - getPinColor: () => this.element.defaultValue, - /** @param {LinearColorEntity} color */ - setPinColor: color => this.element.setDefaultValue(color), - }, - }) + this.#window = /** @type {WindowElement} */ ( + new (ElementFactory.getConstructor("ueb-window"))({ + type: ColorPickerWindowTemplate, + windowOptions: { + // The created window will use the following functions to get and set the color + getPinColor: () => this.element.defaultValue, + /** @param {LinearColorEntity} color */ + setPinColor: color => this.element.setDefaultValue(color), + }, + }) + ) this.element.blueprint.append(this.#window) const windowApplyHandler = () => { this.element.setDefaultValue( diff --git a/js/template/LinkTemplate.js b/js/template/LinkTemplate.js index 9088f44..5a7234c 100755 --- a/js/template/LinkTemplate.js +++ b/js/template/LinkTemplate.js @@ -1,10 +1,14 @@ import { html, nothing } from "lit" import Configuration from "../Configuration" -import Utility from "../Utility" +import ElementFactory from "../element/ElementFactory" import IFromToPositionedTemplate from "./IFromToPositionedTemplate" +import KnotEntity from "../entity/objects/KnotEntity" +import MouseDbClick from "../input/mouse/MouseDbClick" +import Utility from "../Utility" /** * @typedef {import("../element/LinkElement").default} LinkElement + * @typedef {import("../element/NodeElement").default} NodeElement * @typedef {import("../template/KnotNodeTemplate").default} KnotNodeTemplate */ @@ -13,7 +17,7 @@ import IFromToPositionedTemplate from "./IFromToPositionedTemplate" export default class LinkTemplate extends IFromToPositionedTemplate { /** - * Returns a function performing the inverse multiplication y = a / x + q. The value of a and q are calculated using + * Returns a function providing the inverse multiplication y = a / x + q. The value of a and q are calculated using * the derivative of that function y' = -a / x^2 at the point p (x = p[0] and y = p[1]). This means * y'(p[0]) = m => -a / p[0]^2 = m => a = -m * p[0]^2. Now, in order to determine q we can use the starting * function: p[1] = a / p[0] + q => q = p[1] - a / p[0] @@ -28,11 +32,9 @@ export default class LinkTemplate extends IFromToPositionedTemplate { } /** - * Returns a function performing a clamped line passing through two points. It is clamped after and before the - * points. It is easier explained with an example. - * b ______ - * / - * / + * Returns a function providing a clamped line passing through two points. It is clamped after and before the + * points. It is easier explained with the following ascii draw. + * b ______ * / * / * / @@ -59,6 +61,31 @@ export default class LinkTemplate extends IFromToPositionedTemplate { static c2Clamped = LinkTemplate.clampedLine([0, 100], [200, 30]) + #createKnot = + /** @param {Number[]} location */ + location => { + const knot = /** @type {NodeElement} */(new (ElementFactory.getConstructor("ueb-node"))(new KnotEntity())) + knot.setLocation(this.element.blueprint.snapToGrid(location)) + const link = new (ElementFactory.getConstructor("ueb-link"))( + /** @type {KnotNodeTemplate} */(knot.template).outputPin, + this.element.destinationPin + ) + this.element.destinationPin = /** @type {KnotNodeTemplate} */(knot.template).inputPin + this.element.blueprint.addGraphElement(knot, link) + } + + createInputObjects() { + return [ + ...super.createInputObjects(), + new MouseDbClick( + this.element.querySelector(".ueb-link-area"), + this.element.blueprint, + undefined, + (location) => this.#createKnot(location) + ) + ] + } + /** * @param {Map} changedProperties */ @@ -112,9 +139,7 @@ export default class LinkTemplate extends IFromToPositionedTemplate { this.element.svgPathD = Configuration.linkRightSVGPath(this.element.startPercentage, c1, c2) } - /** - * @param {Map} changedProperties - */ + /** @param {Map} changedProperties */ update(changedProperties) { super.update(changedProperties) if (changedProperties.has("originatesFromInput")) { @@ -130,19 +155,19 @@ export default class LinkTemplate extends IFromToPositionedTemplate { } render() { - const uniqueId = "ueb-id-" + Math.floor(Math.random() * 1E12) + const uniqueId = `ueb-id-${Math.floor(Math.random() * 1E12)}` return html` - + - + ${this.element.linkMessageIcon != "" || this.element.linkMessageText != "" ? html` -
- - ${this.element.linkMessageText} -
+
+ + ${this.element.linkMessageText} +
` : nothing} ` } diff --git a/js/template/NodeTemplate.js b/js/template/NodeTemplate.js index ed2743c..4a090bc 100755 --- a/js/template/NodeTemplate.js +++ b/js/template/NodeTemplate.js @@ -1,8 +1,11 @@ import { html, nothing } from "lit" +import ElementFactory from "../element/ElementFactory" import ISelectableDraggableTemplate from "./ISelectableDraggableTemplate" -import PinElement from "../element/PinElement" -/** @typedef {import("../element/NodeElement").default} NodeElement */ +/** + * @typedef {import("../element/NodeElement").default} NodeElement + * @typedef {import("../element/PinElement").default} PinElement + */ /** @extends {ISelectableDraggableTemplate} */ export default class NodeTemplate extends ISelectableDraggableTemplate { @@ -80,6 +83,8 @@ export default class NodeTemplate extends ISelectableDraggableTemplate { createPinElements() { return this.element.getPinEntities() .filter(v => !v.isHidden()) - .map(v => new PinElement(v, undefined, this.element)) + .map(v => /** @type {PinElement} */( + new (ElementFactory.getConstructor("ueb-pin"))(v, undefined, this.element) + )) } } diff --git a/js/template/PinTemplate.js b/js/template/PinTemplate.js index 3fd15c5..253d356 100755 --- a/js/template/PinTemplate.js +++ b/js/template/PinTemplate.js @@ -25,7 +25,7 @@ export default class PinTemplate extends ITemplate { /** @param {PinElement} element */ constructed(element) { super.constructed(element) - this.element.dataset.id = this.element.GetPinIdValue() + this.element.dataset.id = this.element.getPinId().toString() } connectedCallback() { diff --git a/scss/ueb-link.scss b/scss/ueb-link.scss index cdf163c..7762d8a 100644 --- a/scss/ueb-link.scss +++ b/scss/ueb-link.scss @@ -32,7 +32,7 @@ ueb-link svg path { } ueb-link[data-dragging="true"] svg path, -ueb-link svg g:hover path { +ueb-link .ueb-link-area:hover path { stroke-width: calc(6px / var(--ueb-scale)); transition: stroke-width 0.8s; }