@relation-graph/vue3 3.0.8 → 3.0.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +13 -1
- package/relation-graph.js +4 -4
- package/relation-graph.mjs +38 -38
- package/relation-graph.umd.js +9 -9
- package/style.css +1 -0
- package/types/packages/platforms/svelte/src/core4svelte/web-components/WebComponentStyleVariables.d.ts +4 -0
- package/types/packages/platforms/svelte/src/core4svelte/web-components/WebComponentUtils.d.ts +3 -2
- package/types/packages/platforms/svelte/src/index.d.ts +2 -229
- package/types/packages/platforms/svelte/src/index.shared.d.ts +229 -0
- package/types/packages/platforms/svelte/src/index.wc.d.ts +2 -0
package/style.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@charset "UTF-8";.relation-graph{box-sizing:border-box;position:relative;min-width:200px;min-height:200px;--editor-main-color: rgb(64, 165, 248);--editor-light-color: rgb(125, 192, 248);--editor-light2-color: rgb(168, 212, 248);--editor-light-opacity: rgba(57, 144, 216, .1);--rg-node-opacity: 1;--rg-node-font-size: 1rem;--rg-node-font-color: #000000;--rg-node-color: #eeeeee;--rg-node-border-color: #333333;--rg-node-border-width: 1px;--rg-node-border-radius: 3px;--rg-node-width: fit-content;--rg-node-height: fit-content;--rg-node-text-px: 10px;--rg-node-text-py: 3px;--rg-background-color: transparent;--rg-line-color: #888888;--rg-line-width: 1px;--rg-line-fontcolor: var(--rg-line-color, #666666);--rg-line-fontsize: 12px;--rg-line-opacity: 1;--rg-checked-item-bg-color: rgba(150, 150, 150, .2);--rg-checked-line-text-bg-color: rgb(234, 232, 232)}.relation-graph:focus{outline:none}.relation-graph .rg-graph-plugs{position:absolute;left:0px;top:0px;z-index:90;width:100%;height:100%;pointer-events:none;user-select:none}.relation-graph .rg-graph-plugs .rg-view-slot{position:relative;width:100%;height:100%}.relation-graph .rg-watermark{position:absolute;--watermark-width: 200px;--watermark-height: 100px;z-index:1200;overflow:visible;min-height:100px;min-width:100px;width:var(--watermark-width);height:var(--watermark-height);box-sizing:border-box}.relation-graph .rg-watermark div{box-sizing:border-box}.relation-graph .rg-watermark.rg-watermark-top{left:calc((100% - var(--watermark-width)) / 2);top:10px}.relation-graph .rg-watermark.rg-watermark-bottom{left:calc((100% - var(--watermark-width)) / 2);bottom:10px}.relation-graph .rg-watermark.rg-watermark-left{left:10px;top:calc((100% - var(--watermark-height)) / 2)}.relation-graph .rg-watermark.rg-watermark-right{right:10px;top:calc((100% - var(--watermark-height)) / 2)}.relation-graph .rg-watermark.rg-watermark-tl{left:10px;top:10px}.relation-graph .rg-watermark.rg-watermark-tr{right:10px;top:10px}.relation-graph .rg-watermark.rg-watermark-bl{left:10px;bottom:10px}.relation-graph .rg-watermark.rg-watermark-br{right:10px;bottom:10px}.relation-graph .rg-lines-container svg{overflow:visible}.relation-graph .rg-lines-svg{overflow:visible;width:10px;height:10px;position:absolute;left:0px;top:0px}.relation-graph .rg-lines-container{overflow:visible;position:absolute;z-index:40;width:100%;top:0px;left:0px;pointer-events:none}.relation-graph .rg-lines-container-el-lines{z-index:80;pointer-events:none}.relation-graph .rg-lines-container-el-lines .rg-line-bg{pointer-events:stroke}.relation-graph .rg-lines-container-el-lines .rg-line-text{pointer-events:all}.relation-graph .rg-lines-svg-el-lines{overflow:visible;width:10px;height:10px;position:absolute;left:0px;top:0px}.relation-graph .rg-nodes-container-wrapper{position:absolute;width:100%;top:0px;left:0px;z-index:50}.relation-graph .rg-nodes-container{position:relative;overflow:visible}.relation-graph .rg-map{background-color:var(--rg-background-color);overflow:hidden;cursor:default;user-select:none;opacity:.01;transition:none;width:100%;height:100%;position:relative}.relation-graph .rg-map-background{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none}.relation-graph.rg-move-mode .rg-map{cursor:grab}.relation-graph .rg-map-ready{opacity:1;transition:opacity .5s ease;will-change:opacity}.relation-graph .rg-map-background-norepeat{background-repeat:no-repeat;background-position:right bottom}.relation-graph .rg-map-canvas{position:relative;user-select:none;pointer-events:none;top:0;left:0;border:none;z-index:3;overflow:visible;white-space:nowrap;transform-origin:0 0;will-change:transform}.relation-graph .rg-map-canvas .rg-events-all{pointer-events:all}.relation-graph.rg-enable-node-xy-animation .rg-node-peel{transition:transform .15s ease}.relation-graph.rg-enable-node-xy-animation .rg-line-peel{transition:none}.relation-graph.rg-enable-canvas-animation .rg-map-canvas{transition:transform .5s ease}.relation-graph.rg-enable-canvas-animation .rg-editing-ctrl,.relation-graph.rg-enable-canvas-animation .rg-editing-line-ctrl,.relation-graph.rg-enable-canvas-animation .rg-editing-connect-ctrl{opacity:0}.relation-graph .rg-canvas-behind{z-index:2;position:absolute}.relation-graph .rg-canvas-above{z-index:5;position:absolute}.relation-graph .rg-canvas-slot{overflow:visible;position:absolute;margin-top:0;margin-left:0}.relation-graph .rg-canvas-slot-behind{z-index:30;overflow:visible}.relation-graph .rg-canvas-slot-above{z-index:70;overflow:visible}.relation-graph .rg-single-graph{position:relative;overflow:visible}.relation-graph .rg-map img{-webkit-user-drag:none;-webkit-user-select:none}.relation-graph .rg-line-text{fill:var(--rg-line-fontcolor, #888888);font-size:var(--rg-line-fontsize);paint-order:stroke;pointer-events:all}.relation-graph .rg-linetext-container{position:absolute;pointer-events:none;user-select:none;overflow:visible;left:0;top:0;z-index:45;display:block}.relation-graph .rg-linetext-container .rg-line-peel{width:fit-content}.relation-graph .rg-linetext-container .rg-line-peel .rg-line-label-on-path{--rg-line-text-bg-color: #ffffff}.relation-graph .rg-linetext-container .rg-line-peel .rg-line-label{display:block;color:var(--rg-line-fontcolor, #888888);font-size:var(--rg-line-fontsize);transform-origin:0 0;position:absolute;user-select:none;pointer-events:all;box-sizing:border-box;padding:2px 6px;border-radius:5px;white-space:nowrap;background-color:var(--rg-line-text-bg-color)}.relation-graph .rg-linetext-container .rg-line-checked .rg-line-label{background-color:var(--rg-checked-line-text-bg-color);color:#0f172a}.relation-graph .rg-line-peel{pointer-events:none;cursor:default;transition:opacity .2s ease-in;opacity:var(--rg-line-opacity, 1)}.relation-graph .rg-line{fill-rule:nonzero;stroke-linecap:round;stroke:var(--rg-line-color);stroke-width:var(--rg-line-width);pointer-events:none;fill:none;marker-end:var(--rg-line-marker-end);marker-start:var(--rg-line-marker-start)}.relation-graph .rg-line-bg{stroke:#fff;opacity:.01;fill:none;fill-rule:nonzero;stroke-linecap:round;pointer-events:stroke;stroke-width:calc(var(--rg-line-width) + 6px)}.relation-graph .rg-line-bg:hover{opacity:.7;stroke:var(--rg-checked-item-bg-color)}.relation-graph .rg-line-checked .rg-line-bg{stroke:var(--rg-checked-item-bg-color);opacity:1}.relation-graph .rg-line-checked .rg-line{z-index:100}.relation-graph .rg-line-checked .rg-line-text{stroke:var(--rg-checked-item-bg-color);stroke-width:2}.relation-graph .rg-line-disable-events{pointer-events:none!important}.relation-graph .rg-line-disable-events .rg-line-bg,.relation-graph .rg-line-disable-events .rg-line-text,.relation-graph .rg-linetext-container .rg-line-disable-events .rg-line-bg,.relation-graph .rg-linetext-container .rg-line-disable-events .rg-line-label{pointer-events:none}.relation-graph .rg-line-dashtype-1{stroke-dasharray:2,2,2;stroke-dashoffset:3px;stroke-linecap:butt;stroke-linejoin:bevel}.relation-graph .rg-line-dashtype-2{stroke-dasharray:5,5,5;stroke-dashoffset:3px;stroke-linecap:butt;stroke-linejoin:bevel}.relation-graph .rg-line-dashtype-3{stroke-dasharray:9,9,9;stroke-dashoffset:3px;stroke-linecap:butt;stroke-linejoin:bevel}.relation-graph .rg-line-dashtype-4{stroke-dasharray:5,5,15;stroke-dashoffset:3px;stroke-linecap:butt;stroke-linejoin:bevel}@keyframes ACTRGLineChecked{0%{stroke-dashoffset:352px;stroke-dasharray:5,5,5}50%{stroke-dasharray:5,5,5;stroke-dashoffset:3px}to{stroke-dashoffset:352px;stroke-dasharray:5,5,5}}@keyframes rg-line-anm1{0%{stroke-dashoffset:100px;stroke-dasharray:5,5,5}to{stroke-dasharray:5,5,5;stroke-dashoffset:3px}}@keyframes rg-line-anm2{0%{stroke-dashoffset:0;stroke-dasharray:4,4,4}to{stroke-dashoffset:10px;stroke-dasharray:20,20,20}}@keyframes rg-line-anm3{0%{stroke-opacity:1}50%{stroke-opacity:.2}to{stroke-opacity:1}}@keyframes rg-line-anm4{0%{stroke-dasharray:0,100%}to{stroke-dasharray:100%,0}}.relation-graph .rg-line-anm-1{animation:rg-line-anm1 10s infinite;animation-fill-mode:forwards;animation-timing-function:linear}.relation-graph .rg-line-anm-2{animation:rg-line-anm2 3s infinite}.relation-graph .rg-line-anm-3{animation:rg-line-anm3 1s infinite}.relation-graph .rg-line-anm-4{animation:rg-line-anm4 3s infinite}@keyframes deform1{0%{stroke-dashoffset:0}to{stroke-dashoffset:100%}}.relation-graph .rg-icon{width:19px;height:19px;vertical-align:0px;fill:currentColor;overflow:hidden}.relation-graph .rg-node-peel{padding:0;position:absolute;pointer-events:none;box-sizing:border-box;opacity:var(--rg-node-opacity);z-index:var(--rg-node-z-index);will-change:transform;transform-origin:0 0;cursor:default}.relation-graph .rg-node-peel .rg-node{pointer-events:all;text-align:center;border-style:solid;box-sizing:border-box;overflow:visible;transform-origin:0 0;font-size:var(--rg-node-font-size);color:var(--rg-node-font-color);background-color:var(--rg-node-color);border-color:var(--rg-node-border-color);border-width:var(--rg-node-border-width);width:var(--rg-node-width);height:var(--rg-node-height)}.relation-graph .rg-node-disable-events{pointer-events:none}.relation-graph .rg-node-shape-0>.rg-node{border-radius:50%}.relation-graph .rg-node-shape-1>.rg-node{border-radius:var(--rg-node-border-radius)}.relation-graph .rg-node-checked{z-index:800}.relation-graph .rg-node-checked>.rg-node{box-shadow:0 0 0 4px var(--rg-checked-item-bg-color)}.relation-graph .rg-node-selected>.rg-node{box-shadow:0 0 0 2px var(--editor-main-color)}.relation-graph img,.relation-graph svg,.relation-graph video,.relation-graph canvas,.relation-graph audio,.relation-graph iframe,.relation-graph embed,.relation-graph object{display:unset;vertical-align:unset}.relation-graph .rg-node-text{color:var(--rg-node-font-color);font-size:var(--rg-node-font-size);padding:var(--rg-node-text-py) var(--rg-node-text-px);height:100%;width:100%;display:flex;align-items:center;justify-content:center;box-sizing:border-box}.relation-graph .rg-node-type-button{border-radius:25px;color:#00f;cursor:pointer}.relation-graph .rg-editing-referline{user-select:none;position:absolute;z-index:999;pointer-events:none;width:100%;height:100%;left:0px;top:0px}.relation-graph .rg-editing-referline .rg-referline{position:absolute;display:flex;place-items:center;justify-content:center;overflow:visible;transform-origin:0 0;--rg-refer-offset: -3px}.relation-graph .rg-editing-referline .rg-referline .referline{display:flex;place-items:center;justify-content:center}.relation-graph .rg-editing-referline .rg-referline .referline>div{background-color:var(--editor-main-color);font-size:8px;border-radius:3px;color:#fff;width:fit-content;height:fit-content;padding:2px 5px}.relation-graph .rg-editing-referline .rg-referline-v{top:0px;width:6px;height:100%}.relation-graph .rg-editing-referline .rg-referline-v .referline{width:1px;height:100%;background-color:var(--editor-main-color)}.relation-graph .rg-editing-referline .rg-referline-v:before{content:"";position:absolute;width:5px;height:5px;background-color:var(--editor-main-color);border-radius:50%;top:0;transform:translateY(-50%)}.relation-graph .rg-editing-referline .rg-referline-v:after{content:"";position:absolute;width:5px;height:5px;background-color:var(--editor-main-color);border-radius:50%;bottom:0;transform:translateY(50%)}.relation-graph .rg-editing-referline .rg-referline-h{left:0px;width:100%;height:6px}.relation-graph .rg-editing-referline .rg-referline-h .referline{width:100%;height:1px;background-color:var(--editor-main-color)}.relation-graph .rg-editing-referline .rg-referline-h:before{content:"";position:absolute;width:5px;height:5px;background-color:var(--editor-main-color);border-radius:50%;left:0;transform:translate(-50%)}.relation-graph .rg-editing-referline .rg-referline-h:after{content:"";position:absolute;width:5px;height:5px;background-color:var(--editor-main-color);border-radius:50%;right:0;transform:translate(50%)}.relation-graph .rg-editing-line-ctrl{position:absolute;left:0px;top:0px;z-index:500;pointer-events:none;user-select:none;width:100%;height:100%}.relation-graph .rg-editing-line-ctrl .rg-edt-ctrl-svg{position:absolute;pointer-events:none;left:0px;top:0px;overflow:visible}.relation-graph .rg-editing-line-ctrl .rg-edt-ctrl-svg path{stroke:var(--editor-main-color);stroke-width:1px}.relation-graph .rg-editing-line-ctrl .rg-line-ctrl-dot{--rg-ctl-x: 0px;--rg-ctl-y: 0px;pointer-events:auto;user-select:none;width:10px;height:10px;background-color:#fff;box-shadow:0 0 0 1px var(--editor-main-color);position:absolute;border-radius:50%;cursor:move;z-index:1;transform-origin:0 0}.relation-graph .rg-editing-line-ctrl .start-dot,.relation-graph .rg-editing-line-ctrl .end-dot,.relation-graph .rg-editing-line-ctrl .ctrl-dot{transform-origin:0 0;transform:translate(-50%,-50%) translate(var(--rg-ctl-x),var(--rg-ctl-y))}.relation-graph .rg-editing-line-ctrl .ctrl-split,.relation-graph .rg-editing-line-ctrl .ctrl-split-core{background-color:#fff}.relation-graph .rg-editing-line-ctrl .ctrl-split-h{width:12px;height:5px;border-radius:3px;cursor:row-resize;transform:translate(-50%,-50%) translate(var(--rg-ctl-x),var(--rg-ctl-y))}.relation-graph .rg-editing-line-ctrl .ctrl-split-v{width:5px;height:12px;border-radius:3px;cursor:col-resize;transform:translate(-50%,-50%) translate(var(--rg-ctl-x),var(--rg-ctl-y))}.relation-graph .rg-editing-line-ctrl .rg-line-ctrl-text{--rg-ctl-x: 0px;--rg-ctl-y: 0px;--font-size: .8rem;pointer-events:auto;background-color:#fff;box-shadow:0 0 0 1px var(--editor-main-color);position:absolute;border-radius:3px;cursor:move;z-index:1;white-space:nowrap;color:#000;padding:3px 10px;display:flex;place-items:center;justify-content:center;box-sizing:border-box;text-shadow:none;font-size:var(--font-size, 12px);min-height:20px;max-height:30px;transform-origin:0 0;transform:translate(-50%,-50%) translate(var(--rg-ctl-x),var(--rg-ctl-y));min-width:50px;max-width:220px}.relation-graph .rg-editing-line-ctrl .rg-line-ctrl-text p{font-size:var(--font-size, 12px);color:#333}.relation-graph .rg-editing-line-ctrl .rg-line-ctrl-text p.empty-text{font-size:10px;color:#888}.relation-graph .rg-editing-line-ctrl .rg-line-ctrl-text .rg-line-text-input{white-space:nowrap;pointer-events:auto;user-select:auto;background-color:transparent;color:#000;border-radius:3px;height:100%;padding:3px 0;width:100px;text-shadow:none;font-size:var(--font-size, 12px);text-align:center;box-sizing:border-box;border:none;outline:none}.relation-graph .rg-editing-line-ctrl .rg-line-ctrl-text-editing{background-color:#faf191}.relation-graph .rg-editing-ctrl,.relation-graph .rg-editing-connect-ctrl{user-select:none;position:absolute;z-index:500;box-shadow:0 0 0 1px var(--editor-main-color);border-radius:0;pointer-events:none;transform-origin:0 0}.relation-graph .rg-editing-bar{user-select:none;pointer-events:none;position:absolute;border-radius:5px;padding:3px;box-sizing:border-box;display:flex;place-items:center;justify-content:center;flex-wrap:wrap;gap:5px}.relation-graph .rg-editing-bar .rg-gee-icon{background-color:#d603f680;pointer-events:auto;min-width:20px;min-height:20px;border-radius:5px;box-sizing:border-box;display:flex;place-items:center;justify-content:center;cursor:pointer}.relation-graph .rg-editing-bar .rg-gee-icon:hover{background-color:#d603f6;color:#fff}.relation-graph .rg-connect-source-handle{pointer-events:auto;width:fit-content;height:fit-content}.relation-graph .rg-editing-bar-top{width:fit-content;height:fit-content;left:50%;transform:translate(-50%) translateY(-100%);top:-15px}.relation-graph .rg-editing-bar-bottom{width:fit-content;height:fit-content;left:50%;transform:translate(-50%) translateY(100%);bottom:-15px}.relation-graph .rg-editing-bar-left{width:fit-content;height:fit-content;left:-15px;top:50%;transform:translate(-100%) translateY(-50%)}.relation-graph .rg-editing-bar-right{width:fit-content;height:fit-content;right:-15px;top:50%;transform:translate(100%) translateY(-50%)}.relation-graph .rg-editing-bar-tl{width:30px;height:30px;right:calc(100% + 10px);top:-40px}.relation-graph .rg-editing-bar-tr{width:30px;height:30px;left:calc(100% + 10px);top:-40px}.relation-graph .rg-editing-bar-bl{width:30px;height:30px;right:calc(100% + 10px);bottom:-40px}.relation-graph .rg-editing-bar-br{width:30px;height:30px;left:calc(100% + 10px);bottom:-40px}.relation-graph .rg-resize-ctl{user-select:none;position:relative;height:100%;width:100%;--resize-handler-size: 10px;--resize-handler-offset: -5px}.relation-graph .rg-resize-ctl .rg-resize-ctl-handler{pointer-events:auto;width:var(--resize-handler-size);height:var(--resize-handler-size);background-color:#fff;position:absolute;border-radius:2px;box-shadow:inset 0 0 0 1px var(--editor-main-color)}.relation-graph .rg-resize-ctl .rg-resize-ctl-tl{cursor:nwse-resize;left:var(--resize-handler-offset);top:var(--resize-handler-offset)}.relation-graph .rg-resize-ctl .rg-resize-ctl-tr{cursor:nesw-resize;right:var(--resize-handler-offset);top:var(--resize-handler-offset)}.relation-graph .rg-resize-ctl .rg-resize-ctl-bl{cursor:nesw-resize;left:var(--resize-handler-offset);bottom:var(--resize-handler-offset)}.relation-graph .rg-resize-ctl .rg-resize-ctl-br{cursor:nwse-resize;right:var(--resize-handler-offset);bottom:var(--resize-handler-offset)}.relation-graph .rg-resize-ctl .rg-resize-ctl-t{cursor:n-resize;top:var(--resize-handler-offset);left:50%;transform:translate(-50%)}.relation-graph .rg-resize-ctl .rg-resize-ctl-b{cursor:s-resize;bottom:var(--resize-handler-offset);left:50%;transform:translate(-50%)}.relation-graph .rg-resize-ctl .rg-resize-ctl-l{cursor:w-resize;left:var(--resize-handler-offset);top:50%;transform:translateY(-50%)}.relation-graph .rg-resize-ctl .rg-resize-ctl-r{cursor:e-resize;right:var(--resize-handler-offset);top:50%;transform:translateY(-50%)}.relation-graph .rg-editing-connect-ctrl{position:absolute;user-select:none;pointer-events:none;left:0;top:0;z-index:1400;--hander-border-radius: 5px;border-radius:var(--hander-border-radius);--border-handler-width: 8px;--hv-handler-width: 10px;--center-handler-width: 10px;--border-point-width: 10px;--border-point-height: 10px;--hander-color: var(--editor-light2-color);--hander-border-color: var(--editor-main-color);--hander-shadow-color: rgba(57, 144, 216, .1);box-shadow:0 0 0 var(--border-handler-width) var(--hander-shadow-color)}.relation-graph .rg-connect-ctl{width:100%;height:100%;pointer-events:none;user-select:none;border:none;position:relative}.relation-graph .rg-connect-ctl-handler{pointer-events:auto;user-select:none;z-index:20;cursor:crosshair}.relation-graph .rg-connect-target{pointer-events:auto}.relation-graph .rg-connect-ctl-handler-style{background-color:var(--hander-color);border:var(--hander-border-color) solid 1px;position:absolute;border-radius:3px}.relation-graph .rg-connect-ctl-handler-style:hover{background-color:#fbe691}.relation-graph .rg-connect-ctl-center{width:var(--center-handler-width);height:var(--center-handler-width);border-radius:50%;top:calc((100% - var(--center-handler-width)) / 2);left:calc((100% - var(--center-handler-width)) / 2)}.relation-graph .rg-connect-ctl-t{width:var(--border-point-width);height:var(--border-point-height);top:calc(var(--border-point-height) / -2);left:calc((100% - var(--border-point-width)) / 2)}.relation-graph .rg-connect-ctl-b{width:var(--border-point-width);height:var(--border-point-height);bottom:calc(var(--border-point-height) / -2);left:calc((100% - var(--border-point-width)) / 2)}.relation-graph .rg-connect-ctl-l{width:var(--border-point-height);height:var(--border-point-width);left:calc(var(--border-point-height) / -2);top:calc((100% - var(--border-point-width)) / 2)}.relation-graph .rg-connect-ctl-r{width:var(--border-point-height);height:var(--border-point-width);right:calc(var(--border-point-height) / -2);top:calc((100% - var(--border-point-width)) / 2)}.relation-graph .rg-connect-ctl-lr{width:100%;height:var(--hv-handler-width);right:0px;top:calc((100% - var(--hv-handler-width)) / 2);z-index:11;opacity:.01}.relation-graph .rg-connect-ctl-lr:hover{opacity:1}.relation-graph .rg-connect-ctl-tb{width:var(--hv-handler-width);height:100%;top:0px;left:calc((100% - var(--hv-handler-width)) / 2);z-index:10;opacity:.01}.relation-graph .rg-connect-ctl-tb:hover{opacity:1}.relation-graph .rg-connect-ctl-bottom-bar{border:0px;border:none;width:100%;height:var(--border-handler-width);right:0px;top:100%;z-index:5;opacity:.1;box-shadow:none;background-color:var(--edit-ctl-light-color);border-radius:var(--hander-border-radius);border-top-left-radius:0;border-top-right-radius:0;overflow:hidden}.relation-graph .rg-connect-ctl-bottom-bar:hover{opacity:1}.relation-graph .rg-connect-ctl-top-bar{border:0px;border:none;width:100%;height:var(--border-handler-width);right:0px;top:calc(var(--border-handler-width) * -1);z-index:5;opacity:.1;box-shadow:none;background-color:var(--edit-ctl-light-color);border-radius:var(--hander-border-radius);border-bottom-left-radius:0;border-bottom-right-radius:0;overflow:hidden}.relation-graph .rg-connect-ctl-top-bar:hover{opacity:1}.relation-graph .rg-connect-ctl-left-bar{border:0px;border:none;width:var(--border-handler-width);height:100%;left:calc(var(--border-handler-width) * -1);top:0;z-index:5;opacity:.1;box-shadow:none;background-color:var(--edit-ctl-light-color);border-radius:var(--hander-border-radius);border-bottom-right-radius:0;border-top-right-radius:0;overflow:hidden}.relation-graph .rg-connect-ctl-left-bar:hover{opacity:1}.relation-graph .rg-connect-ctl-right-bar{border:0px;width:var(--border-handler-width);height:100%;right:calc(var(--border-handler-width) * -1);top:0px;z-index:5;opacity:.1;box-shadow:none;background-color:var(--edit-ctl-light-color);border-radius:var(--hander-border-radius);border-bottom-left-radius:0;border-top-left-radius:0;overflow:hidden}.relation-graph .rg-connect-ctl-right-bar:hover{opacity:1}.relation-graph .rg-miniview{pointer-events:all;position:absolute;user-select:none;overflow:hidden;z-index:1100;min-height:100px;min-width:100px;--miniview-width: 200px;--miniview-height: 120px;height:var(--miniview-height);width:var(--miniview-width);border-radius:3px;display:flex;place-items:center;justify-content:center;background-color:#fff;box-shadow:0 0 0 1px #ccc;border:none}.relation-graph .rg-miniview .rg-miniview-container{position:relative;width:100%;height:100%;display:flex;place-items:center;justify-content:center}.relation-graph .rg-miniview canvas{opacity:1}.relation-graph .rg-miniview .rg-mv-canvas-reset{cursor:pointer}.relation-graph .rg-miniview .rg-mv-canvas-reset:hover{background-color:#bbf54794}.relation-graph .rg-miniview .rg-mv-visible-area{z-index:2;position:absolute;left:0;top:0;cursor:move;transform-origin:0 0;box-shadow:0 0 0 9999px #0003;border:#888 solid 1px;border-radius:3px;display:grid;place-items:center;color:#fff;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.5)}.relation-graph .rg-miniview.rg-miniview-top{left:calc((100% - var(--miniview-width)) / 2);top:10px}.relation-graph .rg-miniview.rg-miniview-bottom{left:calc((100% - var(--miniview-width)) / 2);bottom:10px}.relation-graph .rg-miniview.rg-miniview-left{left:10px;top:calc((100% - var(--miniview-height)) / 2)}.relation-graph .rg-miniview.rg-miniview-right{right:10px;top:calc((100% - var(--miniview-height)) / 2)}.relation-graph .rg-miniview.rg-miniview-tl{left:10px;top:10px}.relation-graph .rg-miniview.rg-miniview-tr{right:10px;top:10px}.relation-graph .rg-miniview.rg-miniview-bl{left:10px;bottom:10px}.relation-graph .rg-miniview.rg-miniview-br{right:10px;bottom:10px}.relation-graph .rg-node-flashing{animation:ACTRGNodeFlashing 2s infinite}.relation-graph .rg-node-vtree-2{transform-origin:0 0;transform:rotate(30deg) translate(0)}.relation-graph .rg-node-vtree{width:130px;height:45px;text-align:left}.relation-graph .rg-node-expand-holder{position:absolute;height:fit-content;width:fit-content;display:flex;align-items:center;justify-content:center;user-select:none;pointer-events:none;color:#000}.relation-graph .rg-node-expand-holder .rg-node-expand-button{width:16px;height:16px;border-radius:15px;cursor:pointer;pointer-events:all;border:#666 solid 1px;background-color:#fff;display:flex;align-items:center;justify-content:center}.relation-graph .rg-node-expand-holder .rg-icon{width:14px;height:14px}.relation-graph .c-expand-positon-hide{display:none}.relation-graph .c-expand-positon-left{transform:translate(-100%) translateY(-50%);left:-5px;top:50%}.relation-graph .c-expand-positon-right{transform:translate(5px) translateY(-50%);left:100%;top:50%}.relation-graph .c-expand-positon-bottom{transform:translate(-50%);left:50%;top:calc(100% + 5px)}.relation-graph .c-expand-positon-top{transform:translate(-50%) translateY(-100%);left:50%;top:-5px}.relation-graph .rg-setting-panel{--height: 300px;--width: 200px;width:300px;height:200px;position:absolute;left:10px;top:5px;font-size:12px;color:#3a5bb2;padding:60px 10px 10px;overflow:hidden;box-shadow:0 0 5px #999;border-radius:5px;z-index:1000;background-color:#fff;border:#999999 solid 1px}.relation-graph .rg-setting-panel-button{height:35px;width:35px;font-size:8px;line-height:35px;text-align:center;border-radius:50%;position:absolute;margin-left:25px;margin-top:20px;background-color:#3a5bb2;color:#fff;cursor:pointer;z-index:1001;box-shadow:0 0 8px #999}.relation-graph .rg-setting-panel-button:hover{box-shadow:0 0 20px #ffa20a;border:#ffffff solid 1px;color:#ffa20a;-moz-transform:rotate(-89deg) translateX(-190px);animation-timing-function:linear;animation:flashButton 2s infinite}@keyframes flashButton{0%{box-shadow:0 0 8px #2e4e8f}30%{box-shadow:0 0 20px #ffa20a}to{box-shadow:0 0 8px #2e4e8f}}.relation-graph .c-debug-tools-row{text-align:left}.relation-graph .rg-operate{pointer-events:none;user-select:none;position:absolute;top:0px;left:0px;width:100%;height:100%;z-index:180}.relation-graph .rg-operate .rg-node{cursor:move}.relation-graph .rg-operate .rg-creating-container{pointer-events:none;position:relative}.relation-graph .rg-operate .rg-creating-container *{pointer-events:none!important}.relation-graph .rg-selection{pointer-events:none;position:absolute;user-select:none;background-color:var(--editor-light-opacity);border:var(--editor-main-color) solid 1px;transform-origin:0 0}.relation-graph .rg-graph-loading{position:absolute;z-index:1600;left:0px;top:0px;height:100%;width:100%;background-color:#ffffffe6}.relation-graph .rg-graph-loading .rg-graph-loading-icon{width:16px;height:16px;vertical-align:-3px;fill:currentColor;overflow:hidden;animation:turn 1s linear infinite}.relation-graph .rg-graph-loading .rg-graph-loading-message{position:absolute;padding:2px 15px;text-align:center;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:5px;font-size:12px;background-color:#fff;border:#666 solid 1px;color:#666;display:flex;place-items:center;justify-content:center;gap:8px}.relation-graph .rg-graph-loading-hide{display:none}@keyframes slowHide{0%{opacity:1}to{opacity:0;display:none}}.relation-graph .rg-easy-view{overflow:visible;height:100%;width:100%;background-color:transparent;position:absolute;left:0px;top:0px;z-index:3;pointer-events:none}.relation-graph .rg-easy-view canvas{opacity:0;width:100%;height:100%}.relation-graph .rg-easy-view-active{pointer-events:all}.relation-graph .rg-easy-view-active canvas{opacity:1}.relation-graph .rg-move-operator{position:absolute;width:100%;height:100%;pointer-events:none;user-select:none;left:0px;top:0px;z-index:6666}.relation-graph .rg-move-operator .rg-move-touchpad{display:none;background-color:var(--edit-ctl-light2-color);height:100%;width:100%;pointer-events:all}.relation-graph .rg-move-operator.rg-move-operator-active{pointer-events:all;cursor:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMzJweCIgaGVpZ2h0PSIzMnB4Ij48aW1hZ2UgeGxpbms6aHJlZj0iZGF0YTppbWFnZS9wbmc7YmFzZTY0LGlWQk9SdzBLR2dvQUFBQU5TVWhFVWdBQUFFQUFBQUJBQ0FZQUFBQ3FhWEhlQUFBQUFYTlNSMElBcnM0YzZRQUFDWlpKUkVGVWVGN3RXZ3RNVk5rWi9xYThabkZ4QkVIQWlCV3lFa0drUEcwRW1paWdGVVZzcFZxTmlsSmZRVEV4c2k2eDFqZHRMVnVEeGpoTlJDc0JzeHBOZktEV0J4Q05QTFFpaUNoRzBTQkxKZHBTYUFWNXlHaW4rOTNjdzQ2enVEc0Rkd1lUT01uSm5XRXU5NTcvKy8vLyt4L25xRERJaDJxUXk0OGhBSVlzWUpBak1PUUNnOXdBaGtod3lBV0dYR0NRSXpEa0FnTmtBQUo0UXdYbzViV0lxMVdXWm0wTDRQdCtCTUJHdnZJN0o0WG0vQitBZC9MVktrQllBd0FocEJEY3RyS3lNc3pYMTNlcG5aMWRvTDI5ZlhoM2QzZTVUcWVycnEydHpRc0pDYmtENEswUkVCWUR3NUlBR0dxYkdyY0ZZSGYvL3YxWkV5Wk0rTE90cmEyN3NZMi9mZnYybjQ4ZVBmcDgwcVJKZndPZ2s0RWdHTFFNVHNXQnNBUUFRdU1VMkxhc3JDekF6ODh2U2ExV0I2dlY2Z2doOUtWTGw4QjU0TUFCckYrL0huRnhjZElVUTZmVFBlN3M3THgyK1BEaFA2U2xwZjNieUNvVTR3ZExBRUJ0YzlxM3RMUnNkWFoyL3NKNHRRME5EUWdNRE1TclY2OTZmdEpvTktpdXJzYllzV1BmdTEybjB6MjRjZVBHNnRqWTJHb0EzUWF1b1FnSVNnUEE1OWxSZUsxVzY1T1NrbktQcXp4eTVBaU9IajJLMHRKU1RKMDZGY09HRGNQRml4ZXhZOGNPYk4rK0hUdDM3cFErejU0OUcrM3Q3YmgrL1RvaUl5T1JuSnlNRlN0V29MdTd1elkzTjNmK3FsV3I2bVFRaEZ2MEd3U2xBYURtSFFBNHZuang0azhlSGg2L29URFRwazNyZGFGNi9iY3VyVkwxdnBScjE2NUpvTDE4K2ZLdm5wNmV2d1hRQ2VDTjdCTDk1Z1dsQWFEMkhRRTR0YmEyWG5CeWN2cEpSRVFFYnQ2OCtSMXRFNUhlQURDMmlpbFRwcUNzckV3Q3NLT2o0MjVYVjFkNWZuNStWbkp5Y29OTWxDSnM5c2thbEFTQXo2TDJod0VZb2Rmcm4zSkZRck85Q2R1WHYvR1pPcDN1SC9YMTllbSt2cjc1QnRHQzFtRDJVQklBeG5rMXRRL0FSYS9YUDFRS2dISGp4cUcrdnY0N3ZKQ2Vudjd6ZmZ2Mk5SbndndGxoVWtrQTZQK2ZBQmdPWUtSZXJ5ZHJLMklCeG1vVnZORFkyTGh2ekpneHUyVmVFQkhDTEN0UUVnREdmZnEvUmdiZ3JsSUFmSWdYMnRyYWJnOGZQdnlYQU5vQWRNbnVZSFVBYVBvRTB0NElnTnRLQWZCOVhLRlNxWHdBTUtGb2wxM0JMRGZvandWUWNKSGYyeFFWRlFXTUh6OStiazFOemRkeGNYRVA5WHA5c1pVQThBUFFBdUMxYkFWbWtXRmZBYURnVXFwYlYxY1g3Kzd1L2l0SFI4ZjV2ZG1lMGxIQStIa3FsU29RUURPQVZwa0xHQlpOSG4wQlFBaHZYMUZSTVRVa0pPUVUyWjhzZmV2V0xYUjFkU0VoSVFFdUxpN1NJcXdBUUpBTUFOMmdRMDZWTFFZQUFaT3l2ZFRVMUZGNzkrNHR0TGUzOThuSnlVRnFhcXFVeG5Jd245KzBhWlAwTnlzQUVBS0F4WklBZ0dteXljTmNDNkQyU1hhZkZCY1h4MGRGUmVVMk5UVmg4dVRKVXB4ZXVIQWgzcjE3aDFPbmFCVEF5Wk1uc1dEQkF1bXpJWkd4NkhuOCtESG16Ly9XYTBTNnpCQW5oaW5ncVZTcVVBRE1CYXdDQUxYUFpPZlR1cnE2MzNsN2U2ZHF0VnFzVzdjT3k1Y3Zsd29lamtPSERtSE5talVZT1hJa21wdnBudThEWUtwNkJKQ0dRUFhDQVFTQUZ2QmYyUVVzYWdITTlhVmtwN2k0ZUZsVVZGVEdpUk1uc0dqUklrbjd4NDhmNzVHTkdtVWhKSWFoQlpnS2dDbWtLbHVBVlFGZ3JxODVkdXhZM09MRmkvOUMwdzhJQ0lDTmpRMEtDd3NSSGg3ZXMrNVpzMlpKVFErUnlQUkg4QSs1eFlBQkFNQzFvYUhob0plWDEwODNidHlJckt3c1RKOCtIVmV2WGxWQ3pnOCs0d011WURVT0VPa3U4MzNYN096c09TdFhydHoxK3ZWclJFZEhvN3k4SEZ1M2JzV3VYYnNzQnNKQUF5QklrQldmTTRCUnQyL2Yvanc4UER6K3lwVXJtRGx6cGlUNGhRc1hwTzZPMHFPcXFnckJ3Y0VZUFhvMEdoc2I4ZWJObTFkcXRacmRGcXVIUVJZOUkxajBCQVVGalNzb0tQalMxZFgxeDl1MmJjUHUzYnVsUmJLSm9WWXpZQ2czbUcrd1RSWWFHb283ZCs2Z3RiWDFhNDFHOHdzREFOZ3RzbWdVb0RTTUJHeDhTSFUvWFVHcjFjYWxwS1NrODBmMjhpaDhSa1lHdG16Wm9wejAzK1M1NmVucHlNek14TnExYTNIdzRFRTBOVFhkR3pWcVZKSkJKa2dBckpJS2k5WVhTMStDNEZaWldmbEZjSEJ3OUprelp6QnYzanhKOEljUEg4TFBqN1dLTW1QdTNMbkl6OC9IK2ZQbkVSOGZqOU9uVC84eE1USHhLNk5hd0NyRkVNbVFWdkNwY0lVTkd6Wk16c3pNM0dOblorZVFsSlNFdkx3OGFaRmNyQkpEY0F6OW44QTZPanAyUmtkSEx5Z3BLV0hyamRVZ2V3SnNsbG9GQU5IK1psTFU0d3FGaFlXclkySmlmczFVbDY3QTZFQ056Wmt6cDk4WWVIbDU0Zm56NXowNVJVMU56WldBZ0lDZEFQNGxaNEVzaDlrVnNtby9RR3FCaXk2UWs1T1RlMjF0YlphSGg4ZG5vdGRQeWZ1YkJTNWJ0Z3k1dWJtWU9IRWlDZ29LNE9ucGljMmJONi9mczJkUHFVeUFMSVZaQ1hJN3pheGhiakZrK0hCUkdZcEdLS09DSU1UTnZKRmNRRTVnVkNncEthSFptclU0M2h3Ykc0dWlvaUpKZUJaWC92Nyt1SGZ2WGtGUVVGQ0dYQVFaTmtQTUlrQSt2ejhBOFA5WkhmYlVCd3lMbktXbHBlc2pJaUlTZUFQMyt5NWZ2Z3huWjJka1oyY2pNVEhSSkJBWTh0TFMwdERTMHZLZThNM056UTJ1cnE1clpPRlphWWtxMEd6elZ3SUFQa1BzQmtrMWdnQ2hycTd1OTk3ZTNteFc5R3g5OFhOWVdCaVdMbDBLYm5pNHVibEprMXRsRHg0OGtHWk5UWTEwUFh2MnJBU1VvZWFsQmF0VWpQc1VYQlJBb2hWbVZ2d1hXdWl2QlFnUUdSV2tNbGxFQlliSGtwS1NsTWpJU0NrOUpDZWNPM2NPZCs5S3plSWZIR1Q3MWF0WFM1TSsvK3paczJvZkh4K1NIazJlOHo4eTh6UDIwL2ZOWW44bEFUQjJCVVlGa1IrTXlNdkxTMWl5Wk1rSzhVSUN3TWp3NU1rVFBIMzZWTHJTekNrd0JRMEtDcEtLcWhrelpraHV3L0ZONisxNldGallBWm50S1RocmYwRjhmZG9QVUJvQTRRcFN0MGkyQklKQVl0UmtabWIrTENZbVpvcS92MytvV3EwMmlRbDFPdDJicXFxcXYrZms1RnpWYXJYM1pZSHA3NXlNK1dSOUNrL1ROeXYwR1RQNUQ1cWppVGVJcUVBUWhEdlFHbGc1OGtyM1VPL2Z2ejh5SkNURTE4M056ZFhaMmRsVm85RzRPRGc0T0haMmRyWjFkSFMwdGJlM3R4VVhGNWRuWldXVlZWUlVNTWF6MFVpQk9hbDFmaGZDOTJ0alZDa1NOQVpVT2h3aHRzbmx6VklLVDVLa2RSQWNSZzd5aGpnc3hXZUlRMUxVS0RYTHJJNkNVbUF4K1owN1FJb2RsRkNDQkkwTlJGaUNTSmVaTEZGd0lUeS9Fd0FCQWtPcEFJQWFGUUJRVUU2U25EZ1RRRkFFNGZXSjlIcGJySWtXYnRadGhnZWtwQk1qOGhTZnBVMFZPWThRQVBBRkJJQ1RRbkpTWUdwYmZCY25RL3JzODlZQ1FMem52ZTB6c1p0a1lQcmlkMkVCRkV5QVFHSEZGTDZ1aU5ZdFJZTGZaeUxDSW9UQVlrTlZhSisvaThPU3ZSMllWRnh3UzRSQlUzMUU4STQ0VG1mOGY0WkFtUHJNUHQ5bkNSTHM4MklHNGgrSEFCZ0kxRCttZHc1WndNZWtqWUZZeTVBRkRBVHFIOU03QjcwRi9COEJrUXA5WU5iRzJRQUFBQUJKUlU1RXJrSmdnZz09IiB3aWR0aD0iMzIiIGhlaWdodD0iMzIiLz48L3N2Zz4=) 16 16,auto!important;cursor:-webkit-image-set(url(data:image/png;base64,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) 2x,url(data:image/png;base64,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) 1x) 16 16,auto!important}.relation-graph .rg-move-operator.rg-move-operator-active .rg-move-touchpad{display:flex}.relation-graph.rg-creating-line .rg-connect-source-handle{pointer-events:none;opacity:.5}.rg-background{position:absolute;left:0px;top:0px;width:100%;height:100%;z-index:0;pointer-events:none}.rg-toolbar{user-select:none;pointer-events:all;display:flex;position:absolute;z-index:300;background-color:#fff;color:#333;--rg-toolbar-hover-bg-color: rgba(220, 220, 220, .5);box-shadow:0 1px 3px #0003,0 0 1px #0006;box-sizing:border-box;border-radius:5px;width:fit-content;height:fit-content;place-items:center;justify-content:center;gap:3px;backdrop-filter:blur(5px)}.rg-toolbar .rg-icon{flex-grow:1;width:16px;height:16px;fill:currentColor;overflow:hidden}.rg-toolbar .rg-mb-button svg{margin:auto}.rg-toolbar .rg-mb-button:hover{background-color:var(--rg-toolbar-hover-bg-color)}.rg-toolbar .rg-loading-icon{animation:turn 1s linear infinite}@keyframes turn{0%{-webkit-transform:rotate(0deg)}25%{-webkit-transform:rotate(90deg)}50%{-webkit-transform:rotate(180deg)}75%{-webkit-transform:rotate(270deg)}to{-webkit-transform:rotate(360deg)}}.rg-toolbar .rg-current-zoom{margin-top:0;font-size:10px;text-align:center;border-radius:3px;cursor:pointer}.rg-toolbar .rg-current-zoom:hover{background-color:var(--rg-toolbar-hover-bg-color)}.rg-toolbar .rg-mb-button{width:35px;height:35px;margin-top:0;opacity:1;cursor:pointer;font-size:18px;box-sizing:border-box;display:flex;align-items:center;justify-items:center;border-radius:3px}.rg-toolbar.rg-toolbar-v{flex-flow:column;padding:10px 3px}.rg-toolbar.rg-toolbar-v .rg-current-zoom{width:35px;height:25px;line-height:25px}.rg-toolbar.rg-toolbar-h{padding:3px 10px}.rg-toolbar.rg-toolbar-h .rg-current-zoom{width:fit-content;padding:0 5px;height:35px;line-height:35px}.rg-toolbar.rg-toolbar-h-right{right:15px}.rg-toolbar.rg-toolbar-h-left{left:15px}.rg-toolbar.rg-toolbar-h-center{left:50%;transform:translate(-50%)}.rg-toolbar.rg-toolbar-v-top{top:15px}.rg-toolbar.rg-toolbar-v-bottom{bottom:15px}.rg-toolbar.rg-toolbar-v-center{top:50%;transform:translateY(-50%)}.rg-toolbar.rg-xs-toolbar .rg-mb-button{width:25px;height:25px}.rg-toolbar.rg-xs-toolbar .rg-icon{width:14px;height:14px}.rg-toolbar.rg-xs-toolbar.rg-toolbar-v{padding:3px}.rg-toolbar.rg-xs-toolbar.rg-toolbar-v .rg-current-zoom{width:30px;height:25px;line-height:25px}.rg-toolbar.rg-xs-toolbar.rg-toolbar-h{padding:3px}.rg-toolbar.rg-xs-toolbar.rg-toolbar-h .rg-current-zoom{width:35px;height:25px;line-height:25px}.rg-toolbar.rg-xs-toolbar.rg-toolbar-h .rg-mb-button{width:25px;height:25px}.rg-toolbar.rg-xs-toolbar.rg-toolbar-h-right{right:10px}.rg-toolbar.rg-xs-toolbar.rg-toolbar-h-left{left:10px}.rg-toolbar.rg-xs-toolbar.rg-toolbar-h-center{left:50%;transform:translate(-50%)}.rg-toolbar.rg-xs-toolbar.rg-toolbar-v-top{top:10px}.rg-toolbar.rg-xs-toolbar.rg-toolbar-v-bottom{bottom:10px}.rg-toolbar.rg-xs-toolbar.rg-toolbar-v-center{top:50%;transform:translateY(-50%)}
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export declare const relationGraphWebComponentVarCss = "\n.rg-toolbar {\n z-index: var(--rg-toolbar-z-index, 300);\n background-color: var(--rg-toolbar-bg, #ffffff);\n color: var(--rg-toolbar-color, #333333);\n --rg-toolbar-hover-bg-color: var(--rg-toolbar-hover-bg, rgba(220, 220, 220, 0.5));\n box-shadow: var(--rg-toolbar-shadow, 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 0 1px 0 rgba(0, 0, 0, 0.4));\n border: var(--rg-toolbar-border, none);\n border-radius: var(--rg-toolbar-radius, 5px);\n gap: var(--rg-toolbar-gap, 3px);\n backdrop-filter: var(--rg-toolbar-backdrop-filter, blur(5px));\n}\n\n.rg-toolbar .rg-icon {\n width: var(--rg-toolbar-icon-size, 16px);\n height: var(--rg-toolbar-icon-size, 16px);\n}\n\n.rg-toolbar .rg-current-zoom {\n font-size: var(--rg-toolbar-current-zoom-font-size, 10px);\n border-radius: var(--rg-toolbar-current-zoom-radius, 3px);\n}\n\n.rg-toolbar .rg-mb-button {\n width: var(--rg-toolbar-button-size, 35px);\n height: var(--rg-toolbar-button-size, 35px);\n border-radius: var(--rg-toolbar-button-radius, 3px);\n}\n\n.rg-toolbar.rg-toolbar-v {\n padding: var(--rg-toolbar-v-padding, 10px 3px);\n}\n\n.rg-toolbar.rg-toolbar-v .rg-current-zoom {\n width: var(--rg-toolbar-v-current-zoom-width, 35px);\n height: var(--rg-toolbar-v-current-zoom-height, 25px);\n line-height: var(--rg-toolbar-v-current-zoom-line-height, 25px);\n}\n\n.rg-toolbar.rg-toolbar-h {\n padding: var(--rg-toolbar-h-padding, 3px 10px);\n}\n\n.rg-toolbar.rg-toolbar-h .rg-current-zoom {\n padding: var(--rg-toolbar-h-current-zoom-padding, 0px 5px);\n height: var(--rg-toolbar-h-current-zoom-height, 35px);\n line-height: var(--rg-toolbar-h-current-zoom-line-height, 35px);\n}\n\n.rg-toolbar.rg-toolbar-h-right {\n right: var(--rg-toolbar-offset-right, 15px);\n}\n\n.rg-toolbar.rg-toolbar-h-left {\n left: var(--rg-toolbar-offset-left, 15px);\n}\n\n.rg-toolbar.rg-toolbar-v-top {\n top: var(--rg-toolbar-offset-top, 15px);\n}\n\n.rg-toolbar.rg-toolbar-v-bottom {\n bottom: var(--rg-toolbar-offset-bottom, 15px);\n}\n\n.rg-toolbar.rg-xs-toolbar .rg-mb-button {\n width: var(--rg-toolbar-xs-button-size, 25px);\n height: var(--rg-toolbar-xs-button-size, 25px);\n}\n\n.rg-toolbar.rg-xs-toolbar .rg-icon {\n width: var(--rg-toolbar-xs-icon-size, 14px);\n height: var(--rg-toolbar-xs-icon-size, 14px);\n}\n\n.rg-toolbar.rg-xs-toolbar.rg-toolbar-v {\n padding: var(--rg-toolbar-xs-v-padding, 3px);\n}\n\n.rg-toolbar.rg-xs-toolbar.rg-toolbar-v .rg-current-zoom {\n width: var(--rg-toolbar-xs-v-current-zoom-width, 30px);\n height: var(--rg-toolbar-xs-v-current-zoom-height, 25px);\n line-height: var(--rg-toolbar-xs-v-current-zoom-line-height, 25px);\n}\n\n.rg-toolbar.rg-xs-toolbar.rg-toolbar-h {\n padding: var(--rg-toolbar-xs-h-padding, 3px);\n}\n\n.rg-toolbar.rg-xs-toolbar.rg-toolbar-h .rg-current-zoom {\n width: var(--rg-toolbar-xs-h-current-zoom-width, 35px);\n height: var(--rg-toolbar-xs-h-current-zoom-height, 25px);\n line-height: var(--rg-toolbar-xs-h-current-zoom-line-height, 25px);\n}\n\n.rg-toolbar.rg-xs-toolbar.rg-toolbar-h-right {\n right: var(--rg-toolbar-xs-offset-right, 10px);\n}\n\n.rg-toolbar.rg-xs-toolbar.rg-toolbar-h-left {\n left: var(--rg-toolbar-xs-offset-left, 10px);\n}\n\n.rg-toolbar.rg-xs-toolbar.rg-toolbar-v-top {\n top: var(--rg-toolbar-xs-offset-top, 10px);\n}\n\n.rg-toolbar.rg-xs-toolbar.rg-toolbar-v-bottom {\n bottom: var(--rg-toolbar-xs-offset-bottom, 10px);\n}\n\n.rg-editing-referline {\n z-index: var(--rg-reference-line-z-index, 999);\n}\n\n.rg-editing-referline .rg-referline {\n --rg-refer-offset: var(--rg-reference-line-offset, -3px);\n}\n\n.rg-editing-referline .rg-referline .referline > div {\n background-color: var(--rg-reference-line-label-bg, var(--editor-main-color));\n font-size: var(--rg-reference-line-label-font-size, 8px);\n border-radius: var(--rg-reference-line-label-radius, 3px);\n color: var(--rg-reference-line-label-color, #ffffff);\n padding: var(--rg-reference-line-label-padding, 2px 5px);\n}\n\n.rg-editing-referline .rg-referline-v {\n width: var(--rg-reference-line-v-hit-width, 6px);\n}\n\n.rg-editing-referline .rg-referline-v .referline {\n width: var(--rg-reference-line-thickness, 1px);\n background-color: var(--rg-reference-line-color, var(--editor-main-color));\n}\n\n.rg-editing-referline .rg-referline-v::before,\n.rg-editing-referline .rg-referline-v::after {\n width: var(--rg-reference-line-dot-size, 5px);\n height: var(--rg-reference-line-dot-size, 5px);\n background-color: var(--rg-reference-line-color, var(--editor-main-color));\n}\n\n.rg-editing-referline .rg-referline-h {\n height: var(--rg-reference-line-h-hit-width, 6px);\n}\n\n.rg-editing-referline .rg-referline-h .referline {\n height: var(--rg-reference-line-thickness, 1px);\n background-color: var(--rg-reference-line-color, var(--editor-main-color));\n}\n\n.rg-editing-referline .rg-referline-h::before,\n.rg-editing-referline .rg-referline-h::after {\n width: var(--rg-reference-line-dot-size, 5px);\n height: var(--rg-reference-line-dot-size, 5px);\n background-color: var(--rg-reference-line-color, var(--editor-main-color));\n}\n\n.rg-editing-connect-ctrl {\n z-index: var(--rg-connect-controller-z-index, 1400);\n --hander-border-radius: var(--rg-connect-handler-radius, 5px);\n --border-handler-width: var(--rg-connect-border-bar-size, 8px);\n --hv-handler-width: var(--rg-connect-hv-bar-size, 10px);\n --center-handler-width: var(--rg-connect-center-size, 10px);\n --border-point-width: var(--rg-connect-point-width, 10px);\n --border-point-height: var(--rg-connect-point-height, 10px);\n --hander-color: var(--rg-connect-handler-bg, var(--editor-light2-color));\n --hander-border-color: var(--rg-connect-handler-border-color, var(--editor-main-color));\n --hander-shadow-color: var(--rg-connect-handler-shadow-color, rgba(57, 144, 216, 0.1));\n box-shadow: 0 0 0 var(--border-handler-width) var(--hander-shadow-color);\n}\n\n.rg-connect-ctl-handler-style {\n border-radius: var(--rg-connect-handler-corner-radius, 3px);\n}\n\n.rg-connect-ctl-handler-style:hover {\n background-color: var(--rg-connect-handler-hover-bg, #fbe691);\n}\n\n.rg-connect-ctl-lr,\n.rg-connect-ctl-tb {\n opacity: var(--rg-connect-axis-handle-opacity, 0.01);\n}\n\n.rg-connect-ctl-bottom-bar,\n.rg-connect-ctl-top-bar,\n.rg-connect-ctl-left-bar,\n.rg-connect-ctl-right-bar {\n background-color: var(--rg-connect-side-bar-bg, var(--edit-ctl-light-color));\n opacity: var(--rg-connect-side-bar-opacity, 0.1);\n}\n\n.rg-connect-ctl-bottom-bar {\n border-radius: var(--rg-connect-handler-radius, 5px);\n border-top-left-radius: 0px;\n border-top-right-radius: 0px;\n}\n\n.rg-connect-ctl-top-bar {\n border-radius: var(--rg-connect-handler-radius, 5px);\n border-bottom-left-radius: 0px;\n border-bottom-right-radius: 0px;\n}\n\n.rg-connect-ctl-left-bar {\n border-radius: var(--rg-connect-handler-radius, 5px);\n border-bottom-right-radius: 0px;\n border-top-right-radius: 0px;\n}\n\n.rg-connect-ctl-right-bar {\n border-radius: var(--rg-connect-handler-radius, 5px);\n border-bottom-left-radius: 0px;\n border-top-left-radius: 0px;\n}\n";
|
|
2
|
+
export declare const miniViewWebComponentVarCss = "\n.rg-miniview {\n pointer-events: var(--rg-miniview-pointer-events, all);\n z-index: var(--rg-miniview-z-index, 1100);\n min-width: var(--rg-miniview-min-width, 100px);\n min-height: var(--rg-miniview-min-height, 100px);\n --miniview-width: var(--rg-miniview-width, 200px);\n --miniview-height: var(--rg-miniview-height, 120px);\n width: var(--miniview-width);\n height: var(--miniview-height);\n border-radius: var(--rg-miniview-radius, 3px);\n background-color: var(--rg-miniview-bg, #ffffff);\n box-shadow: var(--rg-miniview-shadow, 0 0 0 1px #cccccc);\n border: var(--rg-miniview-border, none);\n}\n\n.rg-miniview .rg-mv-canvas-reset:hover {\n background-color: var(--rg-miniview-reset-hover-bg, rgba(187, 245, 71, 0.58));\n}\n\n.rg-miniview .rg-mv-visible-area {\n box-shadow: 0 0 0 9999px var(--rg-miniview-mask-color, rgba(0, 0, 0, 0.2));\n border: var(--rg-miniview-visible-area-border, #888 solid 1px);\n border-radius: var(--rg-miniview-visible-area-radius, 3px);\n}\n\n.rg-miniview.rg-miniview-top {\n left: var(--rg-miniview-left, calc((100% - var(--miniview-width)) / 2));\n right: var(--rg-miniview-right, auto);\n top: var(--rg-miniview-top, 10px);\n bottom: var(--rg-miniview-bottom, auto);\n}\n\n.rg-miniview.rg-miniview-bottom {\n left: var(--rg-miniview-left, calc((100% - var(--miniview-width)) / 2));\n right: var(--rg-miniview-right, auto);\n top: var(--rg-miniview-top, auto);\n bottom: var(--rg-miniview-bottom, 10px);\n}\n\n.rg-miniview.rg-miniview-left {\n left: var(--rg-miniview-left, 10px);\n right: var(--rg-miniview-right, auto);\n top: var(--rg-miniview-top, calc((100% - var(--miniview-height)) / 2));\n bottom: var(--rg-miniview-bottom, auto);\n}\n\n.rg-miniview.rg-miniview-right {\n left: var(--rg-miniview-left, auto);\n right: var(--rg-miniview-right, 10px);\n top: var(--rg-miniview-top, calc((100% - var(--miniview-height)) / 2));\n bottom: var(--rg-miniview-bottom, auto);\n}\n\n.rg-miniview.rg-miniview-tl {\n left: var(--rg-miniview-left, var(--rg-miniview-tl-left, 10px));\n right: var(--rg-miniview-right, var(--rg-miniview-tl-right, auto));\n top: var(--rg-miniview-top, var(--rg-miniview-tl-top, 10px));\n bottom: var(--rg-miniview-bottom, var(--rg-miniview-tl-bottom, auto));\n}\n\n.rg-miniview.rg-miniview-tr {\n left: var(--rg-miniview-left, var(--rg-miniview-tr-left, auto));\n right: var(--rg-miniview-right, var(--rg-miniview-tr-right, 10px));\n top: var(--rg-miniview-top, var(--rg-miniview-tr-top, 10px));\n bottom: var(--rg-miniview-bottom, var(--rg-miniview-tr-bottom, auto));\n}\n\n.rg-miniview.rg-miniview-bl {\n left: var(--rg-miniview-left, var(--rg-miniview-bl-left, 10px));\n right: var(--rg-miniview-right, var(--rg-miniview-bl-right, auto));\n top: var(--rg-miniview-top, var(--rg-miniview-bl-top, auto));\n bottom: var(--rg-miniview-bottom, var(--rg-miniview-bl-bottom, 10px));\n}\n\n.rg-miniview.rg-miniview-br {\n left: var(--rg-miniview-left, var(--rg-miniview-br-left, auto));\n right: var(--rg-miniview-right, var(--rg-miniview-br-right, 10px));\n top: var(--rg-miniview-top, var(--rg-miniview-br-top, auto));\n bottom: var(--rg-miniview-bottom, var(--rg-miniview-br-bottom, 10px));\n}\n";
|
|
3
|
+
export declare const editingLineWebComponentVarCss = "\n.rg-editing-line-ctrl {\n z-index: var(--rg-editing-line-z-index, 500);\n}\n\n.rg-editing-line-ctrl .rg-edt-ctrl-svg path {\n stroke: var(--rg-editing-line-guide-color, var(--editor-main-color));\n stroke-width: var(--rg-editing-line-guide-width, 1px);\n}\n\n.rg-editing-line-ctrl .rg-line-ctrl-dot {\n width: var(--rg-editing-line-dot-size, 10px);\n height: var(--rg-editing-line-dot-size, 10px);\n background-color: var(--rg-editing-line-dot-bg, #ffffff);\n box-shadow: 0 0 0 var(--rg-editing-line-dot-ring-width, 1px) var(--rg-editing-line-dot-ring-color, var(--editor-main-color));\n border-radius: var(--rg-editing-line-dot-radius, 50%);\n}\n\n.rg-editing-line-ctrl .ctrl-split-h {\n width: var(--rg-editing-line-split-h-width, 12px);\n height: var(--rg-editing-line-split-h-height, 5px);\n border-radius: var(--rg-editing-line-split-radius, 3px);\n}\n\n.rg-editing-line-ctrl .ctrl-split-v {\n width: var(--rg-editing-line-split-v-width, 5px);\n height: var(--rg-editing-line-split-v-height, 12px);\n border-radius: var(--rg-editing-line-split-radius, 3px);\n}\n\n.rg-editing-line-ctrl .rg-line-ctrl-text {\n background-color: var(--rg-editing-line-text-bg, rgba(255, 255, 255, 1));\n box-shadow: 0 0 0 var(--rg-editing-line-text-ring-width, 1px) var(--rg-editing-line-text-ring-color, var(--editor-main-color));\n border-radius: var(--rg-editing-line-text-radius, 3px);\n color: var(--rg-editing-line-text-color, #000000);\n padding: var(--rg-editing-line-text-padding, 3px 10px);\n min-height: var(--rg-editing-line-text-min-height, 20px);\n max-height: var(--rg-editing-line-text-max-height, 30px);\n min-width: var(--rg-editing-line-text-min-width, 50px);\n max-width: var(--rg-editing-line-text-max-width, 220px);\n}\n\n.rg-editing-line-ctrl .rg-line-ctrl-text p {\n color: var(--rg-editing-line-text-paragraph-color, #333333);\n}\n\n.rg-editing-line-ctrl .rg-line-ctrl-text p.empty-text {\n color: var(--rg-editing-line-empty-text-color, #888888);\n}\n\n.rg-editing-line-ctrl .rg-line-ctrl-text .rg-line-text-input {\n background-color: var(--rg-editing-line-input-bg, transparent);\n color: var(--rg-editing-line-input-color, #000000);\n border-radius: var(--rg-editing-line-input-radius, 3px);\n width: var(--rg-editing-line-input-width, 100px);\n}\n\n.rg-editing-line-ctrl .rg-line-ctrl-text-editing {\n background-color: var(--rg-editing-line-text-editing-bg, #faf191);\n}\n";
|
|
4
|
+
export declare const editingResizeWebComponentVarCss = "\n.rg-resize-ctl {\n --resize-handler-size: var(--rg-resize-handler-size, 10px);\n --resize-handler-offset: var(--rg-resize-handler-offset, -5px);\n}\n\n.rg-resize-ctl .rg-resize-ctl-handler {\n background-color: var(--rg-resize-handler-bg, #ffffff);\n border-radius: var(--rg-resize-handler-radius, 2px);\n box-shadow: inset 0 0 0 var(--rg-resize-handler-ring-width, 1px) var(--rg-resize-handler-ring-color, var(--editor-main-color));\n}\n";
|
package/types/packages/platforms/svelte/src/core4svelte/web-components/WebComponentUtils.d.ts
CHANGED
|
@@ -6,6 +6,7 @@ export type WebComponentConnectEventDetail = {
|
|
|
6
6
|
export type WebComponentDisconnectEventDetail = {
|
|
7
7
|
webComponentName: string;
|
|
8
8
|
};
|
|
9
|
-
export declare const onWebComponentReady: (hostElement: HTMLElement | null, globalCss: string, eventDetail: WebComponentConnectEventDetail) => void;
|
|
9
|
+
export declare const onWebComponentReady: (hostElement: HTMLElement | null, globalCss: string | string[], eventDetail: WebComponentConnectEventDetail) => void;
|
|
10
10
|
export declare const onWebComponentUnMounted: (hostElement: HTMLElement, eventDetail: WebComponentDisconnectEventDetail) => void;
|
|
11
|
-
export declare const appendWebComponentGlobalStyle: (hostElement: HTMLElement, globalCss: string) => void;
|
|
11
|
+
export declare const appendWebComponentGlobalStyle: (hostElement: HTMLElement, globalCss: string | string[]) => void;
|
|
12
|
+
export declare const appendWebComponentGlobalStyles: (hostElement: HTMLElement, globalCss: string | string[]) => void;
|
|
@@ -4,232 +4,5 @@
|
|
|
4
4
|
* Github: https://github.com/seeksdream/relation-graph
|
|
5
5
|
*
|
|
6
6
|
*/
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
import { default as BaseLayout } from '../../../relation-graph-models/layouts/RGBaseLayout';
|
|
10
|
-
import { default as BidirectionalTreeLayout } from '../../../relation-graph-models/layouts/RGTreeLayout';
|
|
11
|
-
import { default as CenterLayout } from '../../../relation-graph-models/layouts/RGCenterLayout';
|
|
12
|
-
import { default as CircleLayout } from '../../../relation-graph-models/layouts/RGCircleLayout';
|
|
13
|
-
import { default as FixedLayout } from '../../../relation-graph-models/layouts/RGFixedLayout';
|
|
14
|
-
import { default as ForceLayout } from '../../../relation-graph-models/layouts/RGForceLayout';
|
|
15
|
-
import { default as RGFolderLayout } from '../../../relation-graph-models/layouts/RGFolderLayout';
|
|
16
|
-
export { default as RGToolBar } from './core4svelte/widgets/GraphXsToolBar.svelte';
|
|
17
|
-
export { default as RGFakeNode } from './core4svelte/RGFakeNode.svelte';
|
|
18
|
-
export { default as RGLinePath } from './core4svelte/RGLinePath.svelte';
|
|
19
|
-
export { default as RGLineText } from './core4svelte/RGLineText.svelte';
|
|
20
|
-
export { default as RGNodeExpandHolder } from './core4svelte/RGNodeExpandHolder.svelte';
|
|
21
|
-
export { default as RGMiniToolBar } from './core4svelte/widgets/GraphXsToolBar.svelte';
|
|
22
|
-
export { default as RGEditingNodeController } from './core4svelte/editing/RGEditingNodeController.svelte';
|
|
23
|
-
export { default as RGEditingResize } from './core4svelte/editing/RGEditingResize.svelte';
|
|
24
|
-
export { default as RGMiniView } from './core4svelte/editing/RGMiniView.svelte';
|
|
25
|
-
export { default as RelationGraphAsWebComponent } from './core4svelte/web-components/RelationGraphWithProvider.svelte';
|
|
26
|
-
export { default as RGMiniViewAsWebComponent } from './core4svelte/web-components/RGMiniView.svelte';
|
|
27
|
-
export { default as RGEditingNodeControllerWebComponenet } from './core4svelte/web-components/RGEditingNodeController.svelte';
|
|
28
|
-
export { default as RGEditingResizeWebComponenet } from './core4svelte/web-components/RGEditingResize.svelte';
|
|
29
|
-
export { default as RGConnectTargetWebComponenet } from './core4svelte/web-components/RGConnectTarget.svelte';
|
|
30
|
-
export { default as RGEditingNearNodeWidgetWebComponenet } from './core4svelte/web-components/RGEditingNearNodeWidget.svelte';
|
|
31
|
-
export { default as RGEditingLineControllerWebComponenet } from './core4svelte/web-components/RGEditingLineController.svelte';
|
|
32
|
-
export { default as RGEditingConnectControllerWebComponenet } from './core4svelte/web-components/RGEditingConnectController.svelte';
|
|
33
|
-
export { default as RGEditingReferenceLineWebComponenet } from './core4svelte/web-components/RGEditingReferenceLine.svelte';
|
|
34
|
-
export { default as RGWatermark } from './core4svelte/widgets/GraphWatermark.svelte';
|
|
35
|
-
export { default as RGBackground } from './core4svelte/widgets/GraphBackground.svelte';
|
|
36
|
-
export { default as RGEditingNearNodeWidget } from './core4svelte/editing/RGEditingNearNodeWidget.svelte';
|
|
37
|
-
export { default as RGEditingLineController } from './core4svelte/editing/RGEditingLineController.svelte';
|
|
38
|
-
export { default as RGEditingConnectController } from './core4svelte/editing/RGEditingConnectController.svelte';
|
|
39
|
-
export { default as RGConnectSource } from './core4svelte/editing/RGConnectSource.svelte';
|
|
40
|
-
export { default as RGConnectTarget } from './core4svelte/editing/RGConnectTarget.svelte';
|
|
41
|
-
export { default as RGEditingConnectPoints } from './core4svelte/editing/RGEditingConnectPoints.svelte';
|
|
42
|
-
export { default as RGEditingReferenceLine } from './core4svelte/editing/RGEditingReferenceLine.svelte';
|
|
43
|
-
export { default as RelationLinker } from './core4svelte/RelationLinker.svelte';
|
|
44
|
-
export { default as RGProvider } from './RGProvider.svelte';
|
|
45
|
-
import * as RGOptionsDataUtils from "../../../relation-graph-models/data/RGOptionsDataUtils";
|
|
46
|
-
import * as RGLineDataUtils from "../../../relation-graph-models/data/RGLineDataUtils";
|
|
47
|
-
import * as RGNodeDataUtils from "../../../relation-graph-models/data/RGNodeDataUtils";
|
|
48
|
-
export * from '../../../types';
|
|
49
|
-
export * from './types-svelte';
|
|
50
|
-
export declare const version: string;
|
|
51
|
-
export declare const RelationGraphCore: typeof _RelationGraphCore;
|
|
52
|
-
export declare const RGLayouts: {
|
|
53
|
-
BaseLayout: typeof BaseLayout;
|
|
54
|
-
BidirectionalTreeLayout: typeof BidirectionalTreeLayout;
|
|
55
|
-
CenterLayout: typeof CenterLayout;
|
|
56
|
-
CircleLayout: typeof CircleLayout;
|
|
57
|
-
FixedLayout: typeof FixedLayout;
|
|
58
|
-
ForceLayout: typeof ForceLayout;
|
|
59
|
-
RGFolderLayout: typeof RGFolderLayout;
|
|
60
|
-
};
|
|
61
|
-
export declare const RGUtils: {
|
|
62
|
-
RGOptionsDataUtils: typeof RGOptionsDataUtils;
|
|
63
|
-
RGLineDataUtils: typeof RGLineDataUtils;
|
|
64
|
-
RGNodeDataUtils: typeof RGNodeDataUtils;
|
|
65
|
-
RGGraphMath: {
|
|
66
|
-
getRectPoint(from_x: number, from_y: number, to_x: number, to_y: number, f_W: number, f_H: number, t_W: number, t_H: number, isReverse?: boolean, totalLines?: number, currentIndex?: number, lineDistance?: number, isEndPoint?: boolean): {
|
|
67
|
-
x: number;
|
|
68
|
-
y: number;
|
|
69
|
-
};
|
|
70
|
-
getRectPointBasic(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number): {
|
|
71
|
-
x: number;
|
|
72
|
-
y: number;
|
|
73
|
-
_case: string;
|
|
74
|
-
};
|
|
75
|
-
getRectJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
76
|
-
x: number;
|
|
77
|
-
y: number;
|
|
78
|
-
};
|
|
79
|
-
getRectHJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
80
|
-
x: number;
|
|
81
|
-
y: number;
|
|
82
|
-
};
|
|
83
|
-
getRectLeftJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
84
|
-
x: number;
|
|
85
|
-
y: number;
|
|
86
|
-
};
|
|
87
|
-
getRectRightJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
88
|
-
x: number;
|
|
89
|
-
y: number;
|
|
90
|
-
};
|
|
91
|
-
getRectTopJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
92
|
-
x: number;
|
|
93
|
-
y: number;
|
|
94
|
-
};
|
|
95
|
-
getRectBottomJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
96
|
-
x: number;
|
|
97
|
-
y: number;
|
|
98
|
-
};
|
|
99
|
-
getRectHorizontalLineJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
100
|
-
y: number;
|
|
101
|
-
x: number;
|
|
102
|
-
};
|
|
103
|
-
getRectVerticalLineLineJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
104
|
-
x: number;
|
|
105
|
-
y: number;
|
|
106
|
-
};
|
|
107
|
-
getRectVJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
108
|
-
y: number;
|
|
109
|
-
x: number;
|
|
110
|
-
};
|
|
111
|
-
getBorderPoint(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number, n1style: number): {
|
|
112
|
-
x: number;
|
|
113
|
-
y: number;
|
|
114
|
-
};
|
|
115
|
-
getBorderPoint4MultiLine(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
116
|
-
x: number;
|
|
117
|
-
y: number;
|
|
118
|
-
};
|
|
119
|
-
getCirclePoint(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number): {
|
|
120
|
-
x: number;
|
|
121
|
-
y: number;
|
|
122
|
-
};
|
|
123
|
-
getCirclePoint4MultiLine(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number, isReverse: boolean, totalLines: number, currentIndex: number, lineDistance: number, isEndPoint: boolean): {
|
|
124
|
-
x: number;
|
|
125
|
-
y: number;
|
|
126
|
-
};
|
|
127
|
-
getCirclePointBasic(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number, radius: number): {
|
|
128
|
-
x: number;
|
|
129
|
-
y: number;
|
|
130
|
-
};
|
|
131
|
-
getCirclePointPlus(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number): {
|
|
132
|
-
x: number;
|
|
133
|
-
y: number;
|
|
134
|
-
};
|
|
135
|
-
getOvalPoint(c_x: number, c_y: number, c_r: number, c_i: number, c_n: number, startAngle?: number): {
|
|
136
|
-
x: number;
|
|
137
|
-
y: number;
|
|
138
|
-
};
|
|
139
|
-
getRotatedPoint(x: number, y: number, c_x: number, c_y: number, rotateDeg: number): {
|
|
140
|
-
x: number;
|
|
141
|
-
y: number;
|
|
142
|
-
};
|
|
143
|
-
getFlippedX(x: number, c_x: number): number;
|
|
144
|
-
getFlippedY(y: number, c_y: number): number;
|
|
145
|
-
getAngleType(buffer_x: number, buffer_y: number): 1 | 2 | 3 | 4 | undefined;
|
|
146
|
-
getTextAngle(fx: number, fy: number, tx: number, ty: number): number;
|
|
147
|
-
};
|
|
148
|
-
RGNodesAnalyticUtils: {
|
|
149
|
-
getDescendantNodes(node: import('.').RGNode, collectList?: import('.').RGNode[]): import('.').RGNode[];
|
|
150
|
-
isVisibleNode(thisNode: import('.').RGNode, deep?: number): boolean;
|
|
151
|
-
isAllowShowNode(thisNode: import('.').RGNode, deep?: number): boolean;
|
|
152
|
-
getNodeWidth(thisNode: import('.').RGNode): number;
|
|
153
|
-
getNodeHeight(thisNode: import('.').RGNode): number;
|
|
154
|
-
getNodeXByLotX(nodeAlignOption: {
|
|
155
|
-
alignItemsX: "start" | "center" | "end";
|
|
156
|
-
}, thisNode: import('.').RGNode): number;
|
|
157
|
-
getNodeYByLotY(nodeAlignOption: {
|
|
158
|
-
alignItemsY: "start" | "center" | "end";
|
|
159
|
-
}, thisNode: import('.').RGNode): number;
|
|
160
|
-
getNodeLotXY(nodeAlignOption: import('.').RGLayoutOptions4Alignment, node: import('.').RGNode): {
|
|
161
|
-
x: number;
|
|
162
|
-
y: number;
|
|
163
|
-
};
|
|
164
|
-
isRectangleOverlap(rectA: any, rectB: any): boolean;
|
|
165
|
-
isXOverlap(aX: number, bX: number, a_W: number, b_W: number): boolean;
|
|
166
|
-
isYOverlap(aY: number, bY: number, a_H: number, b_H: number): boolean;
|
|
167
|
-
shapesOverlap(nodeA: any, nodeB: any, shapeA?: number, shapeB?: number): boolean;
|
|
168
|
-
getNoOverlapLimitedPosition(rectA: any, newX: any, newY: any, rectB: any): {
|
|
169
|
-
x: any;
|
|
170
|
-
y: any;
|
|
171
|
-
};
|
|
172
|
-
flatNodeData(orignNodes: import('.').JsonNode[], parentNode: import('.').JsonNode | null, nodesCollect: import('.').JsonNode[], linksCollect: import('.').JsonLine[]): void;
|
|
173
|
-
};
|
|
174
|
-
RGEffectUtils: {
|
|
175
|
-
startDrag(e: MouseEvent | TouchEvent, startPositionOrModel: import('.').RGCoordinate, onDragged: import('../../../relation-graph-models/utils/RGDragUtils').RGDraggedCallback, onDragging?: import('../../../relation-graph-models/utils/RGDragUtils').RGDraggingCallback): void;
|
|
176
|
-
onNodeMove(e: MouseEvent | TouchEvent): void;
|
|
177
|
-
onNodeDragend(e: MouseEvent | TouchEvent): void;
|
|
178
|
-
};
|
|
179
|
-
};
|
|
180
|
-
export { useRelationGraph } from './hooks/useRelationGraph';
|
|
181
|
-
export declare const RGHooks: {
|
|
182
|
-
useGraphInstance: typeof import('./hooks/useGraphInstance').useGraphInstance;
|
|
183
|
-
useGraphStore: typeof import('./hooks/useGraphStore').useGraphStore;
|
|
184
|
-
useCreatingLine: typeof import('./hooks/useGraphStore').useCreatingLine;
|
|
185
|
-
useCreatingNode: typeof import('./hooks/useGraphStore').useCreatingNode;
|
|
186
|
-
useEditingNodes: typeof import('./hooks/useGraphStore').useEditingNodes;
|
|
187
|
-
useEditingLine: typeof import('./hooks/useGraphStore').useEditingLine;
|
|
188
|
-
useViewInformation: typeof import('./hooks/useGraphStore').useViewInformation;
|
|
189
|
-
useSelection: typeof import('./hooks/useGraphStore').useSelection;
|
|
190
|
-
useConnectingNode: typeof import('./hooks/useGraphStore').useConnectingNode;
|
|
191
|
-
useCheckedItem: typeof import('./hooks/useGraphStore').useCheckedItem;
|
|
192
|
-
};
|
|
193
|
-
export declare const useGraphInstance: typeof import('./hooks/useGraphInstance').useGraphInstance;
|
|
194
|
-
export declare const RelationGraph: typeof _RelationGraph;
|
|
195
|
-
/**
|
|
196
|
-
const RG_COMPONENTS: Record<string, any> = {
|
|
197
|
-
'relation-graph': RelationGraphAsWebComponent,
|
|
198
|
-
'rg-mini-view': RGMiniViewAsWebComponent,
|
|
199
|
-
'rg-editing-node-controller': RGEditingNodeControllerWebComponenet,
|
|
200
|
-
'rg-editing-resize': RGEditingResizeWebComponenet,
|
|
201
|
-
'rg-connect-target': RGConnectTargetWebComponenet,
|
|
202
|
-
'rg-editing-node-widget': RGEditingNearNodeWidgetWebComponenet,
|
|
203
|
-
'rg-editing-line-controller': RGEditingLineControllerWebComponenet,
|
|
204
|
-
'rg-editing-connect-controller': RGEditingConnectControllerWebComponenet,
|
|
205
|
-
'rg-editing-reference-line': RGEditingReferenceLineWebComponenet,
|
|
206
|
-
};
|
|
207
|
-
|
|
208
|
-
function safeDefine(tag: string, clazz: CustomElementConstructor) {
|
|
209
|
-
if (typeof window === 'undefined') return; // 适配 SSR 环境
|
|
210
|
-
|
|
211
|
-
const existing = customElements.get(tag);
|
|
212
|
-
if (existing) {
|
|
213
|
-
if (existing !== clazz) {
|
|
214
|
-
console.warn(`[RelationGraph] Element "${tag}" is already defined with a different class.`);
|
|
215
|
-
}
|
|
216
|
-
return;
|
|
217
|
-
}
|
|
218
|
-
|
|
219
|
-
try {
|
|
220
|
-
customElements.define(tag, clazz);
|
|
221
|
-
} catch (err) {
|
|
222
|
-
console.error(`[RelationGraph] Failed to define "${tag}":`, err);
|
|
223
|
-
}
|
|
224
|
-
}
|
|
225
|
-
export function registerRelationGraphElements(prefix = '') {
|
|
226
|
-
Object.entries(RG_COMPONENTS).forEach(([tag, clazz]) => {
|
|
227
|
-
const finalTag = prefix ? `${prefix}-${tag}` : tag;
|
|
228
|
-
safeDefine(finalTag, clazz);
|
|
229
|
-
});
|
|
230
|
-
}
|
|
231
|
-
if (typeof window !== "undefined" && typeof customElements !== "undefined") {
|
|
232
|
-
registerRelationGraphElements();
|
|
233
|
-
}
|
|
234
|
-
**/
|
|
235
|
-
export default _RelationGraph;
|
|
7
|
+
export * from './index.shared';
|
|
8
|
+
export { default } from './index.shared';
|
|
@@ -0,0 +1,229 @@
|
|
|
1
|
+
import { default as _RelationGraph } from './core4svelte/RelationGraph.svelte';
|
|
2
|
+
import { RelationGraphCore as _RelationGraphCore } from '../../../relation-graph-models/models/RelationGraphCore';
|
|
3
|
+
import { default as BaseLayout } from '../../../relation-graph-models/layouts/RGBaseLayout';
|
|
4
|
+
import { default as BidirectionalTreeLayout } from '../../../relation-graph-models/layouts/RGTreeLayout';
|
|
5
|
+
import { default as CenterLayout } from '../../../relation-graph-models/layouts/RGCenterLayout';
|
|
6
|
+
import { default as CircleLayout } from '../../../relation-graph-models/layouts/RGCircleLayout';
|
|
7
|
+
import { default as FixedLayout } from '../../../relation-graph-models/layouts/RGFixedLayout';
|
|
8
|
+
import { default as ForceLayout } from '../../../relation-graph-models/layouts/RGForceLayout';
|
|
9
|
+
import { default as RGFolderLayout } from '../../../relation-graph-models/layouts/RGFolderLayout';
|
|
10
|
+
export { default as RGToolBar } from './core4svelte/widgets/GraphXsToolBar.svelte';
|
|
11
|
+
export { default as RGFakeNode } from './core4svelte/RGFakeNode.svelte';
|
|
12
|
+
export { default as RGLinePath } from './core4svelte/RGLinePath.svelte';
|
|
13
|
+
export { default as RGLineText } from './core4svelte/RGLineText.svelte';
|
|
14
|
+
export { default as RGNodeExpandHolder } from './core4svelte/RGNodeExpandHolder.svelte';
|
|
15
|
+
export { default as RGMiniToolBar } from './core4svelte/widgets/GraphXsToolBar.svelte';
|
|
16
|
+
export { default as RGEditingNodeController } from './core4svelte/editing/RGEditingNodeController.svelte';
|
|
17
|
+
export { default as RGEditingResize } from './core4svelte/editing/RGEditingResize.svelte';
|
|
18
|
+
export { default as RGMiniView } from './core4svelte/editing/RGMiniView.svelte';
|
|
19
|
+
export { default as RelationGraphAsWebComponent } from './core4svelte/web-components/RelationGraphWithProvider.svelte';
|
|
20
|
+
export { default as RGMiniViewAsWebComponent } from './core4svelte/web-components/RGMiniView.svelte';
|
|
21
|
+
export { default as RGEditingNodeControllerWebComponenet } from './core4svelte/web-components/RGEditingNodeController.svelte';
|
|
22
|
+
export { default as RGEditingResizeWebComponenet } from './core4svelte/web-components/RGEditingResize.svelte';
|
|
23
|
+
export { default as RGConnectTargetWebComponenet } from './core4svelte/web-components/RGConnectTarget.svelte';
|
|
24
|
+
export { default as RGEditingNearNodeWidgetWebComponenet } from './core4svelte/web-components/RGEditingNearNodeWidget.svelte';
|
|
25
|
+
export { default as RGEditingLineControllerWebComponenet } from './core4svelte/web-components/RGEditingLineController.svelte';
|
|
26
|
+
export { default as RGEditingConnectControllerWebComponenet } from './core4svelte/web-components/RGEditingConnectController.svelte';
|
|
27
|
+
export { default as RGEditingReferenceLineWebComponenet } from './core4svelte/web-components/RGEditingReferenceLine.svelte';
|
|
28
|
+
export { default as RGWatermark } from './core4svelte/widgets/GraphWatermark.svelte';
|
|
29
|
+
export { default as RGBackground } from './core4svelte/widgets/GraphBackground.svelte';
|
|
30
|
+
export { default as RGEditingNearNodeWidget } from './core4svelte/editing/RGEditingNearNodeWidget.svelte';
|
|
31
|
+
export { default as RGEditingLineController } from './core4svelte/editing/RGEditingLineController.svelte';
|
|
32
|
+
export { default as RGEditingConnectController } from './core4svelte/editing/RGEditingConnectController.svelte';
|
|
33
|
+
export { default as RGConnectSource } from './core4svelte/editing/RGConnectSource.svelte';
|
|
34
|
+
export { default as RGConnectTarget } from './core4svelte/editing/RGConnectTarget.svelte';
|
|
35
|
+
export { default as RGEditingConnectPoints } from './core4svelte/editing/RGEditingConnectPoints.svelte';
|
|
36
|
+
export { default as RGEditingReferenceLine } from './core4svelte/editing/RGEditingReferenceLine.svelte';
|
|
37
|
+
export { default as RelationLinker } from './core4svelte/RelationLinker.svelte';
|
|
38
|
+
export { default as RGProvider } from './RGProvider.svelte';
|
|
39
|
+
import * as RGOptionsDataUtils from "../../../relation-graph-models/data/RGOptionsDataUtils";
|
|
40
|
+
import * as RGLineDataUtils from "../../../relation-graph-models/data/RGLineDataUtils";
|
|
41
|
+
import * as RGNodeDataUtils from "../../../relation-graph-models/data/RGNodeDataUtils";
|
|
42
|
+
export * from '../../../types';
|
|
43
|
+
export * from './types-svelte';
|
|
44
|
+
export declare const version: string;
|
|
45
|
+
export declare const RelationGraphCore: typeof _RelationGraphCore;
|
|
46
|
+
export declare const RGLayouts: {
|
|
47
|
+
BaseLayout: typeof BaseLayout;
|
|
48
|
+
BidirectionalTreeLayout: typeof BidirectionalTreeLayout;
|
|
49
|
+
CenterLayout: typeof CenterLayout;
|
|
50
|
+
CircleLayout: typeof CircleLayout;
|
|
51
|
+
FixedLayout: typeof FixedLayout;
|
|
52
|
+
ForceLayout: typeof ForceLayout;
|
|
53
|
+
RGFolderLayout: typeof RGFolderLayout;
|
|
54
|
+
};
|
|
55
|
+
export declare const RGUtils: {
|
|
56
|
+
RGOptionsDataUtils: typeof RGOptionsDataUtils;
|
|
57
|
+
RGLineDataUtils: typeof RGLineDataUtils;
|
|
58
|
+
RGNodeDataUtils: typeof RGNodeDataUtils;
|
|
59
|
+
RGGraphMath: {
|
|
60
|
+
getRectPoint(from_x: number, from_y: number, to_x: number, to_y: number, f_W: number, f_H: number, t_W: number, t_H: number, isReverse?: boolean, totalLines?: number, currentIndex?: number, lineDistance?: number, isEndPoint?: boolean): {
|
|
61
|
+
x: number;
|
|
62
|
+
y: number;
|
|
63
|
+
};
|
|
64
|
+
getRectPointBasic(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number): {
|
|
65
|
+
x: number;
|
|
66
|
+
y: number;
|
|
67
|
+
_case: string;
|
|
68
|
+
};
|
|
69
|
+
getRectJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
70
|
+
x: number;
|
|
71
|
+
y: number;
|
|
72
|
+
};
|
|
73
|
+
getRectHJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
74
|
+
x: number;
|
|
75
|
+
y: number;
|
|
76
|
+
};
|
|
77
|
+
getRectLeftJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
78
|
+
x: number;
|
|
79
|
+
y: number;
|
|
80
|
+
};
|
|
81
|
+
getRectRightJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
82
|
+
x: number;
|
|
83
|
+
y: number;
|
|
84
|
+
};
|
|
85
|
+
getRectTopJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
86
|
+
x: number;
|
|
87
|
+
y: number;
|
|
88
|
+
};
|
|
89
|
+
getRectBottomJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
90
|
+
x: number;
|
|
91
|
+
y: number;
|
|
92
|
+
};
|
|
93
|
+
getRectHorizontalLineJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
94
|
+
y: number;
|
|
95
|
+
x: number;
|
|
96
|
+
};
|
|
97
|
+
getRectVerticalLineLineJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
98
|
+
x: number;
|
|
99
|
+
y: number;
|
|
100
|
+
};
|
|
101
|
+
getRectVJoinPoint(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
102
|
+
y: number;
|
|
103
|
+
x: number;
|
|
104
|
+
};
|
|
105
|
+
getBorderPoint(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number, n1style: number): {
|
|
106
|
+
x: number;
|
|
107
|
+
y: number;
|
|
108
|
+
};
|
|
109
|
+
getBorderPoint4MultiLine(params: import('../../../relation-graph-models/utils/RGGraphMath').CreateJunctionPointParams): {
|
|
110
|
+
x: number;
|
|
111
|
+
y: number;
|
|
112
|
+
};
|
|
113
|
+
getCirclePoint(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number): {
|
|
114
|
+
x: number;
|
|
115
|
+
y: number;
|
|
116
|
+
};
|
|
117
|
+
getCirclePoint4MultiLine(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number, isReverse: boolean, totalLines: number, currentIndex: number, lineDistance: number, isEndPoint: boolean): {
|
|
118
|
+
x: number;
|
|
119
|
+
y: number;
|
|
120
|
+
};
|
|
121
|
+
getCirclePointBasic(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number, radius: number): {
|
|
122
|
+
x: number;
|
|
123
|
+
y: number;
|
|
124
|
+
};
|
|
125
|
+
getCirclePointPlus(x1: number, y1: number, x2: number, y2: number, n1w: number, n1h: number, n2w: number, n2h: number): {
|
|
126
|
+
x: number;
|
|
127
|
+
y: number;
|
|
128
|
+
};
|
|
129
|
+
getOvalPoint(c_x: number, c_y: number, c_r: number, c_i: number, c_n: number, startAngle?: number): {
|
|
130
|
+
x: number;
|
|
131
|
+
y: number;
|
|
132
|
+
};
|
|
133
|
+
getRotatedPoint(x: number, y: number, c_x: number, c_y: number, rotateDeg: number): {
|
|
134
|
+
x: number;
|
|
135
|
+
y: number;
|
|
136
|
+
};
|
|
137
|
+
getFlippedX(x: number, c_x: number): number;
|
|
138
|
+
getFlippedY(y: number, c_y: number): number;
|
|
139
|
+
getAngleType(buffer_x: number, buffer_y: number): 1 | 2 | 3 | 4 | undefined;
|
|
140
|
+
getTextAngle(fx: number, fy: number, tx: number, ty: number): number;
|
|
141
|
+
};
|
|
142
|
+
RGNodesAnalyticUtils: {
|
|
143
|
+
getDescendantNodes(node: import('./index.shared').RGNode, collectList?: import('./index.shared').RGNode[]): import('./index.shared').RGNode[];
|
|
144
|
+
isVisibleNode(thisNode: import('./index.shared').RGNode, deep?: number): boolean;
|
|
145
|
+
isAllowShowNode(thisNode: import('./index.shared').RGNode, deep?: number): boolean;
|
|
146
|
+
getNodeWidth(thisNode: import('./index.shared').RGNode): number;
|
|
147
|
+
getNodeHeight(thisNode: import('./index.shared').RGNode): number;
|
|
148
|
+
getNodeXByLotX(nodeAlignOption: {
|
|
149
|
+
alignItemsX: "start" | "center" | "end";
|
|
150
|
+
}, thisNode: import('./index.shared').RGNode): number;
|
|
151
|
+
getNodeYByLotY(nodeAlignOption: {
|
|
152
|
+
alignItemsY: "start" | "center" | "end";
|
|
153
|
+
}, thisNode: import('./index.shared').RGNode): number;
|
|
154
|
+
getNodeLotXY(nodeAlignOption: import('./index.shared').RGLayoutOptions4Alignment, node: import('./index.shared').RGNode): {
|
|
155
|
+
x: number;
|
|
156
|
+
y: number;
|
|
157
|
+
};
|
|
158
|
+
isRectangleOverlap(rectA: any, rectB: any): boolean;
|
|
159
|
+
isXOverlap(aX: number, bX: number, a_W: number, b_W: number): boolean;
|
|
160
|
+
isYOverlap(aY: number, bY: number, a_H: number, b_H: number): boolean;
|
|
161
|
+
shapesOverlap(nodeA: any, nodeB: any, shapeA?: number, shapeB?: number): boolean;
|
|
162
|
+
getNoOverlapLimitedPosition(rectA: any, newX: any, newY: any, rectB: any): {
|
|
163
|
+
x: any;
|
|
164
|
+
y: any;
|
|
165
|
+
};
|
|
166
|
+
flatNodeData(orignNodes: import('./index.shared').JsonNode[], parentNode: import('./index.shared').JsonNode | null, nodesCollect: import('./index.shared').JsonNode[], linksCollect: import('./index.shared').JsonLine[]): void;
|
|
167
|
+
};
|
|
168
|
+
RGEffectUtils: {
|
|
169
|
+
startDrag(e: MouseEvent | TouchEvent, startPositionOrModel: import('./index.shared').RGCoordinate, onDragged: import('../../../relation-graph-models/utils/RGDragUtils').RGDraggedCallback, onDragging?: import('../../../relation-graph-models/utils/RGDragUtils').RGDraggingCallback): void;
|
|
170
|
+
onNodeMove(e: MouseEvent | TouchEvent): void;
|
|
171
|
+
onNodeDragend(e: MouseEvent | TouchEvent): void;
|
|
172
|
+
};
|
|
173
|
+
};
|
|
174
|
+
export { useRelationGraph } from './hooks/useRelationGraph';
|
|
175
|
+
export declare const RGHooks: {
|
|
176
|
+
useGraphInstance: typeof import('./hooks/useGraphInstance').useGraphInstance;
|
|
177
|
+
useGraphStore: typeof import('./hooks/useGraphStore').useGraphStore;
|
|
178
|
+
useCreatingLine: typeof import('./hooks/useGraphStore').useCreatingLine;
|
|
179
|
+
useCreatingNode: typeof import('./hooks/useGraphStore').useCreatingNode;
|
|
180
|
+
useEditingNodes: typeof import('./hooks/useGraphStore').useEditingNodes;
|
|
181
|
+
useEditingLine: typeof import('./hooks/useGraphStore').useEditingLine;
|
|
182
|
+
useViewInformation: typeof import('./hooks/useGraphStore').useViewInformation;
|
|
183
|
+
useSelection: typeof import('./hooks/useGraphStore').useSelection;
|
|
184
|
+
useConnectingNode: typeof import('./hooks/useGraphStore').useConnectingNode;
|
|
185
|
+
useCheckedItem: typeof import('./hooks/useGraphStore').useCheckedItem;
|
|
186
|
+
};
|
|
187
|
+
export declare const useGraphInstance: typeof import('./hooks/useGraphInstance').useGraphInstance;
|
|
188
|
+
export declare const RelationGraph: typeof _RelationGraph;
|
|
189
|
+
/**
|
|
190
|
+
const RG_COMPONENTS: Record<string, any> = {
|
|
191
|
+
'relation-graph': RelationGraphAsWebComponent,
|
|
192
|
+
'rg-mini-view': RGMiniViewAsWebComponent,
|
|
193
|
+
'rg-editing-node-controller': RGEditingNodeControllerWebComponenet,
|
|
194
|
+
'rg-editing-resize': RGEditingResizeWebComponenet,
|
|
195
|
+
'rg-connect-target': RGConnectTargetWebComponenet,
|
|
196
|
+
'rg-editing-node-widget': RGEditingNearNodeWidgetWebComponenet,
|
|
197
|
+
'rg-editing-line-controller': RGEditingLineControllerWebComponenet,
|
|
198
|
+
'rg-editing-connect-controller': RGEditingConnectControllerWebComponenet,
|
|
199
|
+
'rg-editing-reference-line': RGEditingReferenceLineWebComponenet,
|
|
200
|
+
};
|
|
201
|
+
|
|
202
|
+
function safeDefine(tag: string, clazz: CustomElementConstructor) {
|
|
203
|
+
if (typeof window === 'undefined') return; // 适配 SSR 环境
|
|
204
|
+
|
|
205
|
+
const existing = customElements.get(tag);
|
|
206
|
+
if (existing) {
|
|
207
|
+
if (existing !== clazz) {
|
|
208
|
+
console.warn(`[RelationGraph] Element "${tag}" is already defined with a different class.`);
|
|
209
|
+
}
|
|
210
|
+
return;
|
|
211
|
+
}
|
|
212
|
+
|
|
213
|
+
try {
|
|
214
|
+
customElements.define(tag, clazz);
|
|
215
|
+
} catch (err) {
|
|
216
|
+
console.error(`[RelationGraph] Failed to define "${tag}":`, err);
|
|
217
|
+
}
|
|
218
|
+
}
|
|
219
|
+
export function registerRelationGraphElements(prefix = '') {
|
|
220
|
+
Object.entries(RG_COMPONENTS).forEach(([tag, clazz]) => {
|
|
221
|
+
const finalTag = prefix ? `${prefix}-${tag}` : tag;
|
|
222
|
+
safeDefine(finalTag, clazz);
|
|
223
|
+
});
|
|
224
|
+
}
|
|
225
|
+
if (typeof window !== "undefined" && typeof customElements !== "undefined") {
|
|
226
|
+
registerRelationGraphElements();
|
|
227
|
+
}
|
|
228
|
+
**/
|
|
229
|
+
export default _RelationGraph;
|