@progress/kendo-react-diagram 14.3.1-develop.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Diagram.d.ts +19 -0
- package/Diagram.js +8 -0
- package/Diagram.mjs +187 -0
- package/DiagramConnectionTooltip.d.ts +36 -0
- package/DiagramConnectionTooltip.js +8 -0
- package/DiagramConnectionTooltip.mjs +12 -0
- package/DiagramShapeTooltip.d.ts +36 -0
- package/DiagramShapeTooltip.js +8 -0
- package/DiagramShapeTooltip.mjs +12 -0
- package/LICENSE.md +11 -0
- package/NOTICE.txt +99 -0
- package/README.md +3 -0
- package/dist/cdn/js/kendo-react-diagram.js +15 -0
- package/hooks/index.d.ts +10 -0
- package/hooks/useDiagramData.d.ts +22 -0
- package/hooks/useDiagramData.js +8 -0
- package/hooks/useDiagramData.mjs +39 -0
- package/hooks/useDiagramEvents.d.ts +80 -0
- package/hooks/useDiagramEvents.js +8 -0
- package/hooks/useDiagramEvents.mjs +57 -0
- package/hooks/useDiagramTooltip.d.ts +67 -0
- package/hooks/useDiagramTooltip.js +8 -0
- package/hooks/useDiagramTooltip.mjs +116 -0
- package/index.d.mts +13 -0
- package/index.d.ts +13 -0
- package/index.js +8 -0
- package/index.mjs +60 -0
- package/interfaces/ConnectionTypes.d.ts +59 -0
- package/interfaces/DiagramEventTypes.d.ts +9 -0
- package/interfaces/DiagramTypes.d.ts +208 -0
- package/interfaces/ShapeTypes.d.ts +139 -0
- package/interfaces/TooltipTypes.d.ts +21 -0
- package/interfaces/index.d.ts +12 -0
- package/package-metadata.d.ts +12 -0
- package/package-metadata.js +8 -0
- package/package-metadata.mjs +13 -0
- package/package.json +66 -0
- package/utils/consts.d.ts +37 -0
- package/utils/consts.js +8 -0
- package/utils/consts.mjs +27 -0
- package/utils/index.d.ts +9 -0
- package/utils/navigate.d.ts +17 -0
- package/utils/navigate.js +8 -0
- package/utils/navigate.mjs +24 -0
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import { Diagram as DiagramWidget } from '@progress/kendo-diagram-common';
|
|
9
|
+
import { ShapeOptions, ConnectionOptions } from '../interfaces/index.js';
|
|
10
|
+
/**
|
|
11
|
+
* @hidden
|
|
12
|
+
*/
|
|
13
|
+
type DiagramEventHandlers = Record<string, ((...args: any[]) => void) | undefined>;
|
|
14
|
+
/**
|
|
15
|
+
* @hidden
|
|
16
|
+
*/
|
|
17
|
+
type TooltipShowHandler = (event: {
|
|
18
|
+
item: {
|
|
19
|
+
id: string | number;
|
|
20
|
+
name: string;
|
|
21
|
+
dataItem: Record<string, unknown>;
|
|
22
|
+
};
|
|
23
|
+
point: {
|
|
24
|
+
x: number;
|
|
25
|
+
y: number;
|
|
26
|
+
};
|
|
27
|
+
}, options: {
|
|
28
|
+
shapeDefaults?: {
|
|
29
|
+
tooltip?: {
|
|
30
|
+
visible?: boolean;
|
|
31
|
+
cssClass?: string;
|
|
32
|
+
};
|
|
33
|
+
};
|
|
34
|
+
connectionDefaults?: {
|
|
35
|
+
tooltip?: {
|
|
36
|
+
visible?: boolean;
|
|
37
|
+
cssClass?: string;
|
|
38
|
+
};
|
|
39
|
+
};
|
|
40
|
+
shapes?: ShapeOptions[];
|
|
41
|
+
connections?: ConnectionOptions[];
|
|
42
|
+
}) => void;
|
|
43
|
+
/**
|
|
44
|
+
* @hidden
|
|
45
|
+
*/
|
|
46
|
+
type TooltipHideHandler = (dataItem: Record<string, unknown>) => void;
|
|
47
|
+
/**
|
|
48
|
+
* @hidden
|
|
49
|
+
*/
|
|
50
|
+
interface DiagramEventBindingOptions {
|
|
51
|
+
handlers: DiagramEventHandlers;
|
|
52
|
+
handleTooltipShow: TooltipShowHandler;
|
|
53
|
+
handleTooltipHide: TooltipHideHandler;
|
|
54
|
+
}
|
|
55
|
+
/**
|
|
56
|
+
* @hidden
|
|
57
|
+
*
|
|
58
|
+
* Custom hook that binds Diagram widget events to React event handler props.
|
|
59
|
+
* Uses a ref-based approach so that event handlers always invoke the latest
|
|
60
|
+
* callback without requiring rebinding on every prop change.
|
|
61
|
+
*/
|
|
62
|
+
export declare const useDiagramEvents: (options: DiagramEventBindingOptions) => {
|
|
63
|
+
bindDiagramEvents: (widget: DiagramWidget, diagramOptions: {
|
|
64
|
+
shapeDefaults?: {
|
|
65
|
+
tooltip?: {
|
|
66
|
+
visible?: boolean;
|
|
67
|
+
cssClass?: string;
|
|
68
|
+
};
|
|
69
|
+
};
|
|
70
|
+
connectionDefaults?: {
|
|
71
|
+
tooltip?: {
|
|
72
|
+
visible?: boolean;
|
|
73
|
+
cssClass?: string;
|
|
74
|
+
};
|
|
75
|
+
};
|
|
76
|
+
shapes?: ShapeOptions[];
|
|
77
|
+
connections?: ConnectionOptions[];
|
|
78
|
+
}) => void;
|
|
79
|
+
};
|
|
80
|
+
export {};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("react"),m=require("@progress/kendo-diagram-common");function f(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,o.get?o:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const d=f(g),E={change:"onChange",click:"onDiagramClick",drag:"onDrag",dragEnd:"onDragEnd",dragStart:"onDragStart",itemBoundsChange:"onShapeBoundsChange",mouseEnter:"onMouseEnter",mouseLeave:"onMouseLeave",pan:"onPan",select:"onSelect",zoomEnd:"onZoomEnd",zoomStart:"onZoomStart"},p=e=>{const t=d.useRef(e);return t.current=e,{bindDiagramEvents:d.useCallback((o,l)=>{m.events.forEach(r=>{o.bind(r,a=>{var s,u;if(r==="tooltipShow"){t.current.handleTooltipShow(a,l);return}if(r==="tooltipHide"){t.current.handleTooltipHide((u=(s=a.item)==null?void 0:s.dataItem)!=null?u:{});return}const i=E[r];if(i){const c=t.current.handlers[i];c==null||c(a)}})})},[])}};exports.useDiagramEvents=p;
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import * as c from "react";
|
|
9
|
+
import { events as g } from "@progress/kendo-diagram-common";
|
|
10
|
+
const m = {
|
|
11
|
+
change: "onChange",
|
|
12
|
+
click: "onDiagramClick",
|
|
13
|
+
drag: "onDrag",
|
|
14
|
+
dragEnd: "onDragEnd",
|
|
15
|
+
dragStart: "onDragStart",
|
|
16
|
+
itemBoundsChange: "onShapeBoundsChange",
|
|
17
|
+
mouseEnter: "onMouseEnter",
|
|
18
|
+
mouseLeave: "onMouseLeave",
|
|
19
|
+
pan: "onPan",
|
|
20
|
+
select: "onSelect",
|
|
21
|
+
zoomEnd: "onZoomEnd",
|
|
22
|
+
zoomStart: "onZoomStart"
|
|
23
|
+
}, h = (e) => {
|
|
24
|
+
const o = c.useRef(e);
|
|
25
|
+
return o.current = e, { bindDiagramEvents: c.useCallback(
|
|
26
|
+
(d, u) => {
|
|
27
|
+
g.forEach((n) => {
|
|
28
|
+
d.bind(
|
|
29
|
+
n,
|
|
30
|
+
(t) => {
|
|
31
|
+
var i, s;
|
|
32
|
+
if (n === "tooltipShow") {
|
|
33
|
+
o.current.handleTooltipShow(
|
|
34
|
+
t,
|
|
35
|
+
u
|
|
36
|
+
);
|
|
37
|
+
return;
|
|
38
|
+
}
|
|
39
|
+
if (n === "tooltipHide") {
|
|
40
|
+
o.current.handleTooltipHide((s = (i = t.item) == null ? void 0 : i.dataItem) != null ? s : {});
|
|
41
|
+
return;
|
|
42
|
+
}
|
|
43
|
+
const a = m[n];
|
|
44
|
+
if (a) {
|
|
45
|
+
const r = o.current.handlers[a];
|
|
46
|
+
r == null || r(t);
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
);
|
|
50
|
+
});
|
|
51
|
+
},
|
|
52
|
+
[]
|
|
53
|
+
) };
|
|
54
|
+
};
|
|
55
|
+
export {
|
|
56
|
+
h as useDiagramEvents
|
|
57
|
+
};
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import { ShapeOptions, ConnectionOptions } from '../interfaces/index.js';
|
|
9
|
+
import * as React from 'react';
|
|
10
|
+
/**
|
|
11
|
+
* @hidden
|
|
12
|
+
*/
|
|
13
|
+
interface TooltipState {
|
|
14
|
+
visible: boolean;
|
|
15
|
+
content: React.ReactNode;
|
|
16
|
+
style: React.CSSProperties;
|
|
17
|
+
className?: string;
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* @hidden
|
|
21
|
+
*/
|
|
22
|
+
interface DiagramTooltipOptions {
|
|
23
|
+
shapeTooltipRender: ((dataItem: Record<string, unknown>) => React.ReactNode) | null;
|
|
24
|
+
connectionTooltipRender: ((dataItem: Record<string, unknown>) => React.ReactNode) | null;
|
|
25
|
+
diagramRef: React.RefObject<import('@progress/kendo-diagram-common').Diagram | null>;
|
|
26
|
+
wrapperRef: React.RefObject<HTMLDivElement | null>;
|
|
27
|
+
onTooltipShow?: (item: ShapeOptions | ConnectionOptions) => void;
|
|
28
|
+
onTooltipHide?: (item: ShapeOptions | ConnectionOptions) => void;
|
|
29
|
+
}
|
|
30
|
+
/**
|
|
31
|
+
* @hidden
|
|
32
|
+
*
|
|
33
|
+
* Custom hook that manages tooltip state and event handling for the Diagram component.
|
|
34
|
+
*/
|
|
35
|
+
export declare const useDiagramTooltip: (options: DiagramTooltipOptions) => {
|
|
36
|
+
tooltipState: TooltipState;
|
|
37
|
+
tooltipElRef: React.RefObject<HTMLDivElement | null>;
|
|
38
|
+
hideTooltip: () => void;
|
|
39
|
+
handleTooltipShow: (event: {
|
|
40
|
+
item: {
|
|
41
|
+
id: string | number;
|
|
42
|
+
name: string;
|
|
43
|
+
dataItem: Record<string, unknown>;
|
|
44
|
+
};
|
|
45
|
+
point: {
|
|
46
|
+
x: number;
|
|
47
|
+
y: number;
|
|
48
|
+
};
|
|
49
|
+
}, diagramOptions: {
|
|
50
|
+
shapeDefaults?: {
|
|
51
|
+
tooltip?: {
|
|
52
|
+
visible?: boolean;
|
|
53
|
+
cssClass?: string;
|
|
54
|
+
};
|
|
55
|
+
};
|
|
56
|
+
connectionDefaults?: {
|
|
57
|
+
tooltip?: {
|
|
58
|
+
visible?: boolean;
|
|
59
|
+
cssClass?: string;
|
|
60
|
+
};
|
|
61
|
+
};
|
|
62
|
+
shapes?: ShapeOptions[];
|
|
63
|
+
connections?: ConnectionOptions[];
|
|
64
|
+
}) => void;
|
|
65
|
+
handleTooltipHide: (_dataItem: Record<string, unknown>) => void;
|
|
66
|
+
};
|
|
67
|
+
export {};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const et=require("react"),G=require("@progress/kendo-diagram-common");function nt(i){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(i){for(const s in i)if(s!=="default"){const e=Object.getOwnPropertyDescriptor(i,s);Object.defineProperty(c,s,e.get?e:{enumerable:!0,get:()=>i[s]})}}return c.default=i,Object.freeze(c)}const u=nt(et),H=9999,st={width:0,height:0},F={x:0,y:0},J={visible:!1,content:null,style:{}},it=i=>{const{shapeTooltipRender:c,connectionTooltipRender:s,diagramRef:e,wrapperRef:g,onTooltipShow:d,onTooltipHide:f}=i,[D,R]=u.useState(J),p=u.useCallback(()=>{h.current=null,R(J)},[]),x=u.useRef(null),h=u.useRef(null);u.useLayoutEffect(()=>{const o=x.current,t=h.current;if(!D.visible||!t||!o)return;const{width:n,height:l}=o.getBoundingClientRect();if(n===0&&l===0)return;h.current=null;const m=G.placeTooltip({hovered:t.item,mouse:t.mouse,shapes:t.shapes,connections:t.connections,diagramRect:t.diagramRect,zoom:t.zoom,pan:t.pan,tooltipSize:{width:n,height:l},viewportBounds:t.viewportBounds});R(I=>({...I,style:{position:"fixed",left:m.left+t.scrollX,top:m.top+t.scrollY,zIndex:H}}))});const K=u.useCallback((o,t)=>{var j,k,X,Y,v,A,M,Z,q,V;p();const{dataItem:n}=o.item,l=o.item.name==="Shape",m=o.item.name==="Connection",I=l?(k=(j=t.shapeDefaults)==null?void 0:j.tooltip)==null?void 0:k.visible:(Y=(X=t.connectionDefaults)==null?void 0:X.tooltip)==null?void 0:Y.visible,y=(v=n.tooltip)==null?void 0:v.visible,C=l?t.shapes:t.connections,w=C==null?void 0:C.find(a=>{var W;return(a==null?void 0:a.id)===((W=o==null?void 0:o.item)==null?void 0:W.id)}),U=w==null?void 0:w.tooltipText,T=n.tooltipText||U;if(!T||!(y!==!1&&(I||y)))return;const S=T===n.tooltipText?n:{...n,tooltipText:T};let b;l&&c?b=c(S):m&&s?b=s(S):b=T;const $=l?(M=(A=t.shapeDefaults)==null?void 0:A.tooltip)==null?void 0:M.cssClass:(q=(Z=t.connectionDefaults)==null?void 0:Z.tooltip)==null?void 0:q.cssClass,tt=(V=n.tooltip)==null?void 0:V.cssClass,ot=$||tt;if(!e.current||!g.current)return;const z=g.current,r=z.ownerDocument.defaultView;if(!r)return;const O=e.current.connections.map(a=>a.allPoints()),_=e.current.shapes.map(a=>a.bounds()),E=z.getBoundingClientRect(),P=e.current.pan(),B=e.current.zoom(),L=new DOMRect(F.x,F.y,r.innerWidth,r.innerHeight),N=G.placeTooltip({hovered:o.item,mouse:o.point,shapes:_,connections:O,diagramRect:E,zoom:B,pan:P,tooltipSize:st,viewportBounds:L});h.current={item:o.item,mouse:o.point,shapes:_,connections:O,diagramRect:E,zoom:B,pan:P,viewportBounds:L,scrollX:r.scrollX,scrollY:r.scrollY},R({visible:!0,content:b,className:ot,style:{position:"fixed",left:N.left+r.scrollX,top:N.top+r.scrollY,zIndex:H,visibility:"hidden"}}),d==null||d({...S})},[c,s,p,d,e,g]),Q=u.useCallback(o=>{p(),f==null||f({...o})},[p,f]);return{tooltipState:D,tooltipElRef:x,hideTooltip:p,handleTooltipShow:K,handleTooltipHide:Q}};exports.useDiagramTooltip=it;
|
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import * as l from "react";
|
|
9
|
+
import { placeTooltip as M } from "@progress/kendo-diagram-common";
|
|
10
|
+
const j = 9999, et = { width: 0, height: 0 }, q = { x: 0, y: 0 }, F = { visible: !1, content: null, style: {} }, it = (J) => {
|
|
11
|
+
const { shapeTooltipRender: m, connectionTooltipRender: T, diagramRef: c, wrapperRef: I, onTooltipShow: a, onTooltipHide: p } = J, [S, R] = l.useState(F), r = l.useCallback(() => {
|
|
12
|
+
u.current = null, R(F);
|
|
13
|
+
}, []), g = l.useRef(null), u = l.useRef(null);
|
|
14
|
+
l.useLayoutEffect(() => {
|
|
15
|
+
const o = g.current, t = u.current;
|
|
16
|
+
if (!S.visible || !t || !o)
|
|
17
|
+
return;
|
|
18
|
+
const { width: e, height: s } = o.getBoundingClientRect();
|
|
19
|
+
if (e === 0 && s === 0)
|
|
20
|
+
return;
|
|
21
|
+
u.current = null;
|
|
22
|
+
const d = M({
|
|
23
|
+
hovered: t.item,
|
|
24
|
+
mouse: t.mouse,
|
|
25
|
+
shapes: t.shapes,
|
|
26
|
+
connections: t.connections,
|
|
27
|
+
diagramRect: t.diagramRect,
|
|
28
|
+
zoom: t.zoom,
|
|
29
|
+
pan: t.pan,
|
|
30
|
+
tooltipSize: { width: e, height: s },
|
|
31
|
+
viewportBounds: t.viewportBounds
|
|
32
|
+
});
|
|
33
|
+
R((C) => ({
|
|
34
|
+
...C,
|
|
35
|
+
style: {
|
|
36
|
+
position: "fixed",
|
|
37
|
+
left: d.left + t.scrollX,
|
|
38
|
+
top: d.top + t.scrollY,
|
|
39
|
+
zIndex: j
|
|
40
|
+
}
|
|
41
|
+
}));
|
|
42
|
+
});
|
|
43
|
+
const K = l.useCallback(
|
|
44
|
+
(o, t) => {
|
|
45
|
+
var X, O, Y, k, A, Z, V, W, v, G;
|
|
46
|
+
r();
|
|
47
|
+
const { dataItem: e } = o.item, s = o.item.name === "Shape", d = o.item.name === "Connection", C = s ? (O = (X = t.shapeDefaults) == null ? void 0 : X.tooltip) == null ? void 0 : O.visible : (k = (Y = t.connectionDefaults) == null ? void 0 : Y.tooltip) == null ? void 0 : k.visible, z = (A = e.tooltip) == null ? void 0 : A.visible, w = s ? t.shapes : t.connections, b = w == null ? void 0 : w.find(
|
|
48
|
+
(i) => {
|
|
49
|
+
var H;
|
|
50
|
+
return (i == null ? void 0 : i.id) === ((H = o == null ? void 0 : o.item) == null ? void 0 : H.id);
|
|
51
|
+
}
|
|
52
|
+
), U = b == null ? void 0 : b.tooltipText, f = e.tooltipText || U;
|
|
53
|
+
if (!f || !(z !== !1 && (C || z)))
|
|
54
|
+
return;
|
|
55
|
+
const x = f === e.tooltipText ? e : { ...e, tooltipText: f };
|
|
56
|
+
let h;
|
|
57
|
+
s && m ? h = m(x) : d && T ? h = T(x) : h = f;
|
|
58
|
+
const $ = s ? (V = (Z = t.shapeDefaults) == null ? void 0 : Z.tooltip) == null ? void 0 : V.cssClass : (v = (W = t.connectionDefaults) == null ? void 0 : W.tooltip) == null ? void 0 : v.cssClass, tt = (G = e.tooltip) == null ? void 0 : G.cssClass, ot = $ || tt;
|
|
59
|
+
if (!c.current || !I.current)
|
|
60
|
+
return;
|
|
61
|
+
const D = I.current, n = D.ownerDocument.defaultView;
|
|
62
|
+
if (!n)
|
|
63
|
+
return;
|
|
64
|
+
const E = c.current.connections.map((i) => i.allPoints()), _ = c.current.shapes.map((i) => i.bounds()), y = D.getBoundingClientRect(), B = c.current.pan(), L = c.current.zoom(), P = new DOMRect(
|
|
65
|
+
q.x,
|
|
66
|
+
q.y,
|
|
67
|
+
n.innerWidth,
|
|
68
|
+
n.innerHeight
|
|
69
|
+
), N = M({
|
|
70
|
+
hovered: o.item,
|
|
71
|
+
mouse: o.point,
|
|
72
|
+
shapes: _,
|
|
73
|
+
connections: E,
|
|
74
|
+
diagramRect: y,
|
|
75
|
+
zoom: L,
|
|
76
|
+
pan: B,
|
|
77
|
+
tooltipSize: et,
|
|
78
|
+
viewportBounds: P
|
|
79
|
+
});
|
|
80
|
+
u.current = {
|
|
81
|
+
item: o.item,
|
|
82
|
+
mouse: o.point,
|
|
83
|
+
shapes: _,
|
|
84
|
+
connections: E,
|
|
85
|
+
diagramRect: y,
|
|
86
|
+
zoom: L,
|
|
87
|
+
pan: B,
|
|
88
|
+
viewportBounds: P,
|
|
89
|
+
scrollX: n.scrollX,
|
|
90
|
+
scrollY: n.scrollY
|
|
91
|
+
}, R({
|
|
92
|
+
visible: !0,
|
|
93
|
+
content: h,
|
|
94
|
+
className: ot,
|
|
95
|
+
style: {
|
|
96
|
+
position: "fixed",
|
|
97
|
+
left: N.left + n.scrollX,
|
|
98
|
+
top: N.top + n.scrollY,
|
|
99
|
+
zIndex: j,
|
|
100
|
+
visibility: "hidden"
|
|
101
|
+
// hidden until measured and repositioned by two-pass layout
|
|
102
|
+
}
|
|
103
|
+
}), a == null || a({ ...x });
|
|
104
|
+
},
|
|
105
|
+
[m, T, r, a, c, I]
|
|
106
|
+
), Q = l.useCallback(
|
|
107
|
+
(o) => {
|
|
108
|
+
r(), p == null || p({ ...o });
|
|
109
|
+
},
|
|
110
|
+
[r, p]
|
|
111
|
+
);
|
|
112
|
+
return { tooltipState: S, tooltipElRef: g, hideTooltip: r, handleTooltipShow: K, handleTooltipHide: Q };
|
|
113
|
+
};
|
|
114
|
+
export {
|
|
115
|
+
it as useDiagramTooltip
|
|
116
|
+
};
|
package/index.d.mts
ADDED
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
export type { ShapeDefaultsBase, ConnectionDefaultsBase, ShapeOptionsBase, ConnectionOptionsBase, ConnectionDefaultsEditable, ConnectionPointsEditable, ConnectionEditingPoint, ShapeConnector, ShapeContent, EditableDefaults, ShapeDefaultsEditable, ShapeEditable, ShapeFillGradientStop, ShapeFillGradient, ShapeFill, ShapeHover, ShapeRotation, Fill, Stroke, DashType, ShapeType, ShapeConnectorHover, ShapeConnectorDefaults, Selectable, Pannable, LayoutGrid, DiagramLayout, DiagramEditable, Coordinate, DiagramDragEvent, DiagramDomEvent, DiagramZoomStartEvent, DiagramZoomEndEvent, DiagramPanEvent, DiagramSelectEvent, DiagramChangeEvent, DiagramItemBoundsChangeEvent, DiagramState, BringIntoViewOptions, SelectionOptions, Direction, ConnectionCap, ConnectionContent, DiagramMapping, ConvertResult, ConnectionMapping, ShapeMapping, MapSpec, FromPathOrFn } from '@progress/kendo-diagram-common';
|
|
9
|
+
export { Shape, Connection, Connector, Point, Rect, Circle, Group, FlowchartShapeType, ArrowMarker, CircleMarker, Collate, DataInputOutput, DataStorage, Database, Decision, Delay, DirectAccessStorage, Display, Document, MultipleDocuments, Extract, Image, InternalStorage, Layout, Line, LogicalOr, ManualInputOutput, ManualOperation, Merge, MultiLineTextBlock, OffPageConnector, OnPageConnector, Path, Polyline, PredefinedProcess, Preparation, Process, Rectangle, Sort, SummingJunction, Terminator, TextBlock, MarkerType, convertToDiagramModel } from '@progress/kendo-diagram-common';
|
|
10
|
+
export * from './Diagram.js';
|
|
11
|
+
export * from './DiagramConnectionTooltip.js';
|
|
12
|
+
export * from './DiagramShapeTooltip.js';
|
|
13
|
+
export * from './interfaces/index.js';
|
package/index.d.ts
ADDED
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
export type { ShapeDefaultsBase, ConnectionDefaultsBase, ShapeOptionsBase, ConnectionOptionsBase, ConnectionDefaultsEditable, ConnectionPointsEditable, ConnectionEditingPoint, ShapeConnector, ShapeContent, EditableDefaults, ShapeDefaultsEditable, ShapeEditable, ShapeFillGradientStop, ShapeFillGradient, ShapeFill, ShapeHover, ShapeRotation, Fill, Stroke, DashType, ShapeType, ShapeConnectorHover, ShapeConnectorDefaults, Selectable, Pannable, LayoutGrid, DiagramLayout, DiagramEditable, Coordinate, DiagramDragEvent, DiagramDomEvent, DiagramZoomStartEvent, DiagramZoomEndEvent, DiagramPanEvent, DiagramSelectEvent, DiagramChangeEvent, DiagramItemBoundsChangeEvent, DiagramState, BringIntoViewOptions, SelectionOptions, Direction, ConnectionCap, ConnectionContent, DiagramMapping, ConvertResult, ConnectionMapping, ShapeMapping, MapSpec, FromPathOrFn } from '@progress/kendo-diagram-common';
|
|
9
|
+
export { Shape, Connection, Connector, Point, Rect, Circle, Group, FlowchartShapeType, ArrowMarker, CircleMarker, Collate, DataInputOutput, DataStorage, Database, Decision, Delay, DirectAccessStorage, Display, Document, MultipleDocuments, Extract, Image, InternalStorage, Layout, Line, LogicalOr, ManualInputOutput, ManualOperation, Merge, MultiLineTextBlock, OffPageConnector, OnPageConnector, Path, Polyline, PredefinedProcess, Preparation, Process, Rectangle, Sort, SummingJunction, Terminator, TextBlock, MarkerType, convertToDiagramModel } from '@progress/kendo-diagram-common';
|
|
10
|
+
export * from './Diagram.js';
|
|
11
|
+
export * from './DiagramConnectionTooltip.js';
|
|
12
|
+
export * from './DiagramShapeTooltip.js';
|
|
13
|
+
export * from './interfaces/index.js';
|
package/index.js
ADDED
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@progress/kendo-diagram-common"),t=require("./Diagram.js"),r=require("./DiagramConnectionTooltip.js"),n=require("./DiagramShapeTooltip.js");Object.defineProperty(exports,"ArrowMarker",{enumerable:!0,get:()=>e.ArrowMarker});Object.defineProperty(exports,"Circle",{enumerable:!0,get:()=>e.Circle});Object.defineProperty(exports,"CircleMarker",{enumerable:!0,get:()=>e.CircleMarker});Object.defineProperty(exports,"Collate",{enumerable:!0,get:()=>e.Collate});Object.defineProperty(exports,"Connection",{enumerable:!0,get:()=>e.Connection});Object.defineProperty(exports,"Connector",{enumerable:!0,get:()=>e.Connector});Object.defineProperty(exports,"DataInputOutput",{enumerable:!0,get:()=>e.DataInputOutput});Object.defineProperty(exports,"DataStorage",{enumerable:!0,get:()=>e.DataStorage});Object.defineProperty(exports,"Database",{enumerable:!0,get:()=>e.Database});Object.defineProperty(exports,"Decision",{enumerable:!0,get:()=>e.Decision});Object.defineProperty(exports,"Delay",{enumerable:!0,get:()=>e.Delay});Object.defineProperty(exports,"DirectAccessStorage",{enumerable:!0,get:()=>e.DirectAccessStorage});Object.defineProperty(exports,"Display",{enumerable:!0,get:()=>e.Display});Object.defineProperty(exports,"Document",{enumerable:!0,get:()=>e.Document});Object.defineProperty(exports,"Extract",{enumerable:!0,get:()=>e.Extract});Object.defineProperty(exports,"FlowchartShapeType",{enumerable:!0,get:()=>e.FlowchartShapeType});Object.defineProperty(exports,"Group",{enumerable:!0,get:()=>e.Group});Object.defineProperty(exports,"Image",{enumerable:!0,get:()=>e.Image});Object.defineProperty(exports,"InternalStorage",{enumerable:!0,get:()=>e.InternalStorage});Object.defineProperty(exports,"Layout",{enumerable:!0,get:()=>e.Layout});Object.defineProperty(exports,"Line",{enumerable:!0,get:()=>e.Line});Object.defineProperty(exports,"LogicalOr",{enumerable:!0,get:()=>e.LogicalOr});Object.defineProperty(exports,"ManualInputOutput",{enumerable:!0,get:()=>e.ManualInputOutput});Object.defineProperty(exports,"ManualOperation",{enumerable:!0,get:()=>e.ManualOperation});Object.defineProperty(exports,"MarkerType",{enumerable:!0,get:()=>e.MarkerType});Object.defineProperty(exports,"Merge",{enumerable:!0,get:()=>e.Merge});Object.defineProperty(exports,"MultiLineTextBlock",{enumerable:!0,get:()=>e.MultiLineTextBlock});Object.defineProperty(exports,"MultipleDocuments",{enumerable:!0,get:()=>e.MultipleDocuments});Object.defineProperty(exports,"OffPageConnector",{enumerable:!0,get:()=>e.OffPageConnector});Object.defineProperty(exports,"OnPageConnector",{enumerable:!0,get:()=>e.OnPageConnector});Object.defineProperty(exports,"Path",{enumerable:!0,get:()=>e.Path});Object.defineProperty(exports,"Point",{enumerable:!0,get:()=>e.Point});Object.defineProperty(exports,"Polyline",{enumerable:!0,get:()=>e.Polyline});Object.defineProperty(exports,"PredefinedProcess",{enumerable:!0,get:()=>e.PredefinedProcess});Object.defineProperty(exports,"Preparation",{enumerable:!0,get:()=>e.Preparation});Object.defineProperty(exports,"Process",{enumerable:!0,get:()=>e.Process});Object.defineProperty(exports,"Rect",{enumerable:!0,get:()=>e.Rect});Object.defineProperty(exports,"Rectangle",{enumerable:!0,get:()=>e.Rectangle});Object.defineProperty(exports,"Shape",{enumerable:!0,get:()=>e.Shape});Object.defineProperty(exports,"Sort",{enumerable:!0,get:()=>e.Sort});Object.defineProperty(exports,"SummingJunction",{enumerable:!0,get:()=>e.SummingJunction});Object.defineProperty(exports,"Terminator",{enumerable:!0,get:()=>e.Terminator});Object.defineProperty(exports,"TextBlock",{enumerable:!0,get:()=>e.TextBlock});Object.defineProperty(exports,"convertToDiagramModel",{enumerable:!0,get:()=>e.convertToDiagramModel});exports.Diagram=t.Diagram;exports.DiagramConnectionTooltip=r.DiagramConnectionTooltip;exports.DiagramShapeTooltip=n.DiagramShapeTooltip;
|
package/index.mjs
ADDED
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import { ArrowMarker as t, Circle as a, CircleMarker as r, Collate as n, Connection as i, Connector as c, DataInputOutput as l, DataStorage as p, Database as u, Decision as g, Delay as m, DirectAccessStorage as D, Display as s, Document as M, Extract as P, FlowchartShapeType as C, Group as S, Image as T, InternalStorage as f, Layout as x, Line as y, LogicalOr as O, ManualInputOutput as h, ManualOperation as k, MarkerType as I, Merge as L, MultiLineTextBlock as d, MultipleDocuments as w, OffPageConnector as A, OnPageConnector as B, Path as R, Point as b, Polyline as v, PredefinedProcess as E, Preparation as F, Process as G, Rect as J, Rectangle as j, Shape as q, Sort as z, SummingJunction as H, Terminator as K, TextBlock as N, convertToDiagramModel as Q } from "@progress/kendo-diagram-common";
|
|
9
|
+
import { Diagram as V } from "./Diagram.mjs";
|
|
10
|
+
import { DiagramConnectionTooltip as X } from "./DiagramConnectionTooltip.mjs";
|
|
11
|
+
import { DiagramShapeTooltip as Z } from "./DiagramShapeTooltip.mjs";
|
|
12
|
+
export {
|
|
13
|
+
t as ArrowMarker,
|
|
14
|
+
a as Circle,
|
|
15
|
+
r as CircleMarker,
|
|
16
|
+
n as Collate,
|
|
17
|
+
i as Connection,
|
|
18
|
+
c as Connector,
|
|
19
|
+
l as DataInputOutput,
|
|
20
|
+
p as DataStorage,
|
|
21
|
+
u as Database,
|
|
22
|
+
g as Decision,
|
|
23
|
+
m as Delay,
|
|
24
|
+
V as Diagram,
|
|
25
|
+
X as DiagramConnectionTooltip,
|
|
26
|
+
Z as DiagramShapeTooltip,
|
|
27
|
+
D as DirectAccessStorage,
|
|
28
|
+
s as Display,
|
|
29
|
+
M as Document,
|
|
30
|
+
P as Extract,
|
|
31
|
+
C as FlowchartShapeType,
|
|
32
|
+
S as Group,
|
|
33
|
+
T as Image,
|
|
34
|
+
f as InternalStorage,
|
|
35
|
+
x as Layout,
|
|
36
|
+
y as Line,
|
|
37
|
+
O as LogicalOr,
|
|
38
|
+
h as ManualInputOutput,
|
|
39
|
+
k as ManualOperation,
|
|
40
|
+
I as MarkerType,
|
|
41
|
+
L as Merge,
|
|
42
|
+
d as MultiLineTextBlock,
|
|
43
|
+
w as MultipleDocuments,
|
|
44
|
+
A as OffPageConnector,
|
|
45
|
+
B as OnPageConnector,
|
|
46
|
+
R as Path,
|
|
47
|
+
b as Point,
|
|
48
|
+
v as Polyline,
|
|
49
|
+
E as PredefinedProcess,
|
|
50
|
+
F as Preparation,
|
|
51
|
+
G as Process,
|
|
52
|
+
J as Rect,
|
|
53
|
+
j as Rectangle,
|
|
54
|
+
q as Shape,
|
|
55
|
+
z as Sort,
|
|
56
|
+
H as SummingJunction,
|
|
57
|
+
K as Terminator,
|
|
58
|
+
N as TextBlock,
|
|
59
|
+
Q as convertToDiagramModel
|
|
60
|
+
};
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import { ConnectionDefaultsBase, ConnectionOptionsBase } from '@progress/kendo-diagram-common';
|
|
9
|
+
import { TooltipOptions } from './TooltipTypes.js';
|
|
10
|
+
/**
|
|
11
|
+
* Defines the configuration options for diagram connections.
|
|
12
|
+
* Extends the base connection options and adds tooltip support.
|
|
13
|
+
*/
|
|
14
|
+
export interface ConnectionOptions extends Omit<ConnectionOptionsBase, ''> {
|
|
15
|
+
/**
|
|
16
|
+
* Configures the tooltip that displays when you hover over the connection.
|
|
17
|
+
*/
|
|
18
|
+
tooltip?: TooltipOptions;
|
|
19
|
+
/**
|
|
20
|
+
* Sets the text content displayed in the tooltip.
|
|
21
|
+
*/
|
|
22
|
+
tooltipText?: string;
|
|
23
|
+
}
|
|
24
|
+
/**
|
|
25
|
+
* Defines the default configuration options for all connections in the `Diagram`.
|
|
26
|
+
* These settings apply to connections unless overridden by individual connection options.
|
|
27
|
+
*/
|
|
28
|
+
export interface ConnectionDefaults extends Omit<ConnectionDefaultsBase, ''> {
|
|
29
|
+
/**
|
|
30
|
+
* Configures the default tooltip settings for all connections.
|
|
31
|
+
*/
|
|
32
|
+
tooltip?: TooltipOptions;
|
|
33
|
+
}
|
|
34
|
+
/**
|
|
35
|
+
* Defines the field mapping configuration for connections data binding.
|
|
36
|
+
* Maps source object properties to `Diagram` connection properties.
|
|
37
|
+
*/
|
|
38
|
+
export interface ConnectionModelFields {
|
|
39
|
+
/**
|
|
40
|
+
* The field that contains the source shape identifier.
|
|
41
|
+
*/
|
|
42
|
+
from?: string;
|
|
43
|
+
/**
|
|
44
|
+
* The field that contains the target shape identifier.
|
|
45
|
+
*/
|
|
46
|
+
to?: string;
|
|
47
|
+
/**
|
|
48
|
+
* The field that contains the connection points.
|
|
49
|
+
*/
|
|
50
|
+
points?: string;
|
|
51
|
+
/**
|
|
52
|
+
* The field that contains the data item reference.
|
|
53
|
+
*/
|
|
54
|
+
dataItem?: string;
|
|
55
|
+
/**
|
|
56
|
+
* The field that contains the tooltip text.
|
|
57
|
+
*/
|
|
58
|
+
tooltipText?: string;
|
|
59
|
+
}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
*-------------------------------------------------------------------------------------------
|
|
4
|
+
* Copyright © 2026 Progress Software Corporation. All rights reserved.
|
|
5
|
+
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
|
+
*-------------------------------------------------------------------------------------------
|
|
7
|
+
*/
|
|
8
|
+
import { DiagramChangeEvent, DiagramDomEvent, DiagramDragEvent, DiagramItemBoundsChangeEvent, DiagramPanEvent, DiagramSelectEvent, DiagramZoomEndEvent, DiagramZoomStartEvent } from '@progress/kendo-diagram-common';
|
|
9
|
+
export type DiagramEvent = DiagramChangeEvent | DiagramDomEvent | DiagramDragEvent | DiagramItemBoundsChangeEvent | DiagramPanEvent | DiagramSelectEvent | DiagramZoomEndEvent | DiagramZoomStartEvent;
|