diff --git a/notNeededPackages.json b/notNeededPackages.json index 676e532439ce8a..81008e2376fd13 100644 --- a/notNeededPackages.json +++ b/notNeededPackages.json @@ -1449,6 +1449,10 @@ "libraryName": "cypress-recurse", "asOfVersion": "1.9.0" }, + "cytoscape": { + "libraryName": "cytoscape", + "asOfVersion": "3.31.0" + }, "cytoscape-popper": { "libraryName": "cytoscape-popper", "asOfVersion": "4.0.0" diff --git a/types/cytoscape-avsdf/package.json b/types/cytoscape-avsdf/package.json index 96c8ababc4d5f2..8a7704d64fbc7f 100644 --- a/types/cytoscape-avsdf/package.json +++ b/types/cytoscape-avsdf/package.json @@ -6,7 +6,7 @@ "https://github.com/iVis-at-Bilkent/cytoscape.js-avsdf" ], "dependencies": { - "@types/cytoscape": "*" + "cytoscape": "^3.31" }, "devDependencies": { "@types/cytoscape-avsdf": "workspace:." diff --git a/types/cytoscape-canvas/package.json b/types/cytoscape-canvas/package.json index 960203fd7e1dce..5678abc1fa2bf9 100644 --- a/types/cytoscape-canvas/package.json +++ b/types/cytoscape-canvas/package.json @@ -6,7 +6,7 @@ "https://github.com/classcraft/cytoscape.js-canvas" ], "dependencies": { - "@types/cytoscape": "*" + "cytoscape": "^3.31" }, "devDependencies": { "@types/cytoscape-canvas": "workspace:." diff --git a/types/cytoscape-context-menus/package.json b/types/cytoscape-context-menus/package.json index 4f1630e9638469..be0e5fb26eaa61 100644 --- a/types/cytoscape-context-menus/package.json +++ b/types/cytoscape-context-menus/package.json @@ -6,7 +6,7 @@ "https://github.com/iVis-at-Bilkent/cytoscape.js-context-menus" ], "dependencies": { - "@types/cytoscape": "*" + "cytoscape": "^3.31" }, "devDependencies": { "@types/cytoscape-context-menus": "workspace:." diff --git a/types/cytoscape-cxtmenu/package.json b/types/cytoscape-cxtmenu/package.json index aba5826639eb65..6d905c39d15bf9 100644 --- a/types/cytoscape-cxtmenu/package.json +++ b/types/cytoscape-cxtmenu/package.json @@ -6,7 +6,7 @@ "https://github.com/cytoscape/cytoscape.js-cxtmenu" ], "dependencies": { - "@types/cytoscape": "*" + "cytoscape": "^3.31" }, "devDependencies": { "@types/cytoscape-cxtmenu": "workspace:." diff --git a/types/cytoscape-dagre/package.json b/types/cytoscape-dagre/package.json index 13fa7e2ba28162..ffa53956bfa498 100644 --- a/types/cytoscape-dagre/package.json +++ b/types/cytoscape-dagre/package.json @@ -6,7 +6,7 @@ "https://github.com/cytoscape/cytoscape.js-dagre" ], "dependencies": { - "@types/cytoscape": "*" + "cytoscape": "^3.31" }, "devDependencies": { "@types/cytoscape-dagre": "workspace:." diff --git a/types/cytoscape-edgehandles/package.json b/types/cytoscape-edgehandles/package.json index 4e4204778f3f85..5e241cc6d1339c 100644 --- a/types/cytoscape-edgehandles/package.json +++ b/types/cytoscape-edgehandles/package.json @@ -6,7 +6,7 @@ "https://github.com/cytoscape/cytoscape.js-edgehandles" ], "dependencies": { - "@types/cytoscape": "*" + "cytoscape": "^3.31" }, "devDependencies": { "@types/cytoscape-edgehandles": "workspace:." diff --git a/types/cytoscape-euler/package.json b/types/cytoscape-euler/package.json index 70f0445c2619a1..6c737a9bbef63f 100644 --- a/types/cytoscape-euler/package.json +++ b/types/cytoscape-euler/package.json @@ -6,7 +6,7 @@ "https://github.com/cytoscape/cytoscape.js-euler" ], "dependencies": { - "@types/cytoscape": "*" + "cytoscape": "^3.31" }, "devDependencies": { "@types/cytoscape-euler": "workspace:." diff --git a/types/cytoscape-fcose/package.json b/types/cytoscape-fcose/package.json index 9aed1a1393d852..af9d240bbbe275 100644 --- a/types/cytoscape-fcose/package.json +++ b/types/cytoscape-fcose/package.json @@ -6,7 +6,7 @@ "https://github.com/iVis-at-Bilkent/cytoscape.js-fcose" ], "dependencies": { - "@types/cytoscape": "*" + "cytoscape": "^3.31" }, "devDependencies": { "@types/cytoscape-fcose": "workspace:." diff --git a/types/cytoscape-klay/package.json b/types/cytoscape-klay/package.json index caa4f821d476fc..83e08575878c20 100644 --- a/types/cytoscape-klay/package.json +++ b/types/cytoscape-klay/package.json @@ -6,7 +6,7 @@ "https://github.com/cytoscape/cytoscape.js-klay" ], "dependencies": { - "@types/cytoscape": "*" + "cytoscape": "^3.31" }, "devDependencies": { "@types/cytoscape-klay": "workspace:." diff --git a/types/cytoscape-navigator/package.json b/types/cytoscape-navigator/package.json index 79ca0872b87487..855082eeca367e 100644 --- a/types/cytoscape-navigator/package.json +++ b/types/cytoscape-navigator/package.json @@ -6,7 +6,7 @@ "https://github.com/cytoscape/cytoscape.js-navigator" ], "dependencies": { - "@types/cytoscape": "*" + "cytoscape": "^3.31" }, "devDependencies": { "@types/cytoscape-navigator": "workspace:." diff --git a/types/cytoscape/.npmignore b/types/cytoscape/.npmignore deleted file mode 100644 index 93e307400a5456..00000000000000 --- a/types/cytoscape/.npmignore +++ /dev/null @@ -1,5 +0,0 @@ -* -!**/*.d.ts -!**/*.d.cts -!**/*.d.mts -!**/*.d.*.ts diff --git a/types/cytoscape/cytoscape-tests.ts b/types/cytoscape/cytoscape-tests.ts deleted file mode 100644 index 94a4c8e072f415..00000000000000 --- a/types/cytoscape/cytoscape-tests.ts +++ /dev/null @@ -1,1130 +0,0 @@ -"use strict"; - -// TODO: document all aliases as aliases, not as duplicates! - -import { - BreadthFirstLayoutOptions, - CircleLayoutOptions, - ConcentricLayoutOptions, - CoseLayoutOptions, - EdgeSingular, - GridLayoutOptions, - NodeSingular, - NullLayoutOptions, - PresetLayoutOptions, - RandomLayoutOptions, -} from "cytoscape"; - -const assert = (tag: boolean) => {}; -const aliases = (...obj: Array<{}>) => {}; - -// definitions -function oneOf(a: A, b: B, c: C, d: D, e: E): A | B | C | D | E; -function oneOf(a: A, b: B, c: C, d: D): A | B | C | D; -function oneOf(a: A, b: B, c: C): A | B | C; -function oneOf(a: A, b: B): A | B; -function oneOf(...array: T[]): T { - return array[0]; -} - -import cytoscape = require("cytoscape"); -const parentCSS = { - "padding-top": "10px", - "padding-left": "10px", - "padding-bottom": "10px", - "padding-right": "10px", - "text-valign": "top" as "top", - "text-halign": "center" as "center", - "background-color": "#CCC", - "font-size": 40, - "min-zoomed-font-size": 15, -}; - -const showAllStyle: cytoscape.Stylesheet[] = [ - { - selector: "node", - css: { - display: "element", - content: "data(id)", - "text-valign": "center", - "text-halign": "center", - shape: "rectangle", - "min-zoomed-font-size": 20, - opacity: 1, - width: "mapData(weight, 40, 80, 20, 60)", - "transition-property": "opacity", - "transition-duration": 500, - "transition-delay": 500, - }, - }, - { - selector: "node", - style: { - "background-image-crossorigin": "anonymous", - "background-image-opacity": 0.5, - "background-image-smoothing": "yes", - "background-image-containment": "inside", - "background-offset-x": "yes", - "background-offset-y": "yes", - "background-clip": "none", - "background-width-relative-to": "inner", - "background-height-relative-to": "inner", - "bounds-expansion": [1, "5em"], - }, - }, - { - selector: "node .background-multi-image", - style: { - "background-image": [ - "data:image/svg+xml;utf8," - + encodeURIComponent( - ``, - ), - "data:image/svg+xml;utf8," - + encodeURIComponent( - ``, - ), - ], - "background-image-opacity": [0.5, 1.0], - "background-image-crossorigin": ["anonymous", "use-credentials"], - "background-image-smoothing": ["yes", "no"], - "background-image-containment": ["inside", "over"], - "background-width": [24, "60%"], - "background-height": ["60%", 24], - "background-fit": ["contain", "cover"], - "background-repeat": ["repeat-x", "repeat-y"], - "background-position-x": [24, 24], - "background-position-y": [0, 10], - "background-offset-x": [0, 0], - "background-offset-y": [10, 10], - "background-width-relative-to": ["inner", "include-padding"], - "background-height-relative-to": ["inner", "include-padding"], - "background-clip": ["node", "none"], - }, - }, - { - selector: "$node > node", - css: parentCSS, - }, - { - selector: "edge", - css: { - "text-rotation": "autorotate", - "target-arrow-shape": "triangle", - "curve-style": "taxi", - "line-outline-width": "1px", - "line-outline-color": "black", - "source-endpoint": "outside-to-node", - "target-endpoint": "outside-to-node", - "line-opacity": 0.5, - "taxi-turn": "20deg", - "taxi-turn-min-distance": "7px", - }, - }, - { - selector: ":selected", - css: { - "background-color": "black", - "line-color": "black", - "target-arrow-color": "black", - "source-arrow-color": "black", - }, - }, - { - selector: "node.lesstext", - style: { - label: "data(name)", - "text-wrap": "ellipsis", - "text-max-width": "200", - }, - }, - { - selector: "node.text", - style: { - label: "data(name)", - "text-wrap": "ellipsis", - "text-max-width": "200", - "text-overflow-wrap": "anywhere", - "text-justification": "center", - "line-height": 1.2, - "text-rotation": "autorotate", - "source-text-rotation": "autorotate", - "target-text-rotation": "autorotate", - "text-events": "yes", - }, - }, - { - selector: "node.pie-background", - style: { - "pie-1-background-color": "110000", - "pie-1-background-size": 5, - "pie-2-background-color": "220000", - "pie-2-background-size": 5, - "pie-3-background-color": "330000", - "pie-3-background-size": 5, - "pie-4-background-color": "440000", - "pie-4-background-size": 5, - "pie-5-background-color": "550000", - "pie-5-background-size": 5, - "pie-6-background-color": "660000", - "pie-6-background-size": 5, - "pie-7-background-color": "770000", - "pie-7-background-size": 5, - "pie-8-background-color": "880000", - "pie-8-background-size": 5, - "pie-9-background-color": "990000", - "pie-9-background-size": 5, - "pie-10-background-color": "AA0000", - "pie-10-background-size": 5, - "pie-11-background-color": "BB0000", - "pie-11-background-size": 5, - "pie-12-background-color": "CC0000", - "pie-12-background-size": 5, - "pie-13-background-color": "DD0000", - "pie-13-background-size": 5, - "pie-14-background-color": "EE0000", - "pie-14-background-size": 5, - "pie-15-background-color": "FF0000", - "pie-15-background-size": 5, - "pie-16-background-color": "001100", - "pie-16-background-size": 5, - }, - }, - { - selector: "node.border", - style: { - "border-width": 5, - "border-style": "dashed", - "border-color": "red", - "border-opacity": 0.85, - "border-position": "inside", - "border-cap": "round", - "border-join": "bevel", - "border-dash-pattern": [6, 3], - "border-dash-offset": 5, - }, - }, -]; - -const cy = cytoscape({ - container: document.getElementById("cy"), - - boxSelectionEnabled: false, - autounselectify: true, - - style: showAllStyle, - - elements: { - nodes: [ - { data: { id: "a", parent: "b", foo: "bar" }, position: { x: 215, y: 85 } }, - { data: { id: "b" } }, - { data: { id: "c", parent: "b" }, position: { x: 300, y: 85 } }, - { data: { id: "d" }, position: { x: 215, y: 175 } }, - { data: { id: "e" } }, - { data: { id: "f", parent: "e" }, position: { x: 300, y: 175 } }, - ], - edges: [{ data: { id: "ad", source: "a", target: "d" } }, { data: { id: "eb", source: "e", target: "b" } }], - }, - - // initial viewport state: - zoom: 1, - pan: { x: 0, y: 0 }, - - // interaction options: - minZoom: 1e-50, - maxZoom: 1e50, - zoomingEnabled: true, - userZoomingEnabled: true, - panningEnabled: true, - userPanningEnabled: true, - selectionType: "single", - touchTapThreshold: 8, - desktopTapThreshold: 4, - autolock: false, - autoungrabify: false, - - // rendering options: - headless: false, - styleEnabled: true, - hideEdgesOnViewport: false, - hideLabelsOnViewport: false, - textureOnViewport: false, - motionBlur: false, - motionBlurOpacity: 0.2, - wheelSensitivity: 1, - pixelRatio: "auto", - - layout: { - name: "grid", - padding: 5, - animate: true, - animateFilter: (node, i) => { - return true; - }, - transform: (node, position) => { - return position; - }, - }, - - // additional custom graph data: - data: { - foo: "bar", - meta: { - description: "desc", - title: "title", - }, - }, -}); - -cy.on("zoom", event => { - if (cy.zoom() <= 1) { - cy.nodes("$node > node").style("opacity", 0); - } -}); -cy.off("zoom"); -// events(cy); - TODO - -cy.add({ data: { id: "g", someOtherKey: "value" }, position: { x: 200, y: 150 } }); -cy.add([{ data: { id: "h" }, position: { x: 250, y: 100 } }]); -const nodesBeforeDelete = cy.nodes(); -const edgesBeforeDelete = cy.edges(); - -const removed = cy.remove("#g #h"); -cy.add(removed); -const diffNodes = nodesBeforeDelete.diff(cy.nodes()); -const diffEdges = edgesBeforeDelete.diff(cy.edges()); -assert(diffNodes.left.size() === 0 && diffNodes.right.size() === 0 && diffNodes.both.size() === cy.nodes().size()); -assert(nodesBeforeDelete.same(cy.nodes())); -assert(edgesBeforeDelete.same(cy.edges())); - -const gh = cy.collection().add(cy.$id("g")).union(cy.getElementById("h")); -const gh2 = cy.$("#g #h"); -const gh3 = cy.nodes("#g #h"); -assert(gh2.same(gh)); -assert(gh3.same(gh)); -assert(gh.same(removed)); - -assert(cy.container() === null); // headless mode! - -cy.center(); -cy.center(gh); -aliases(cy.center, cy.centre); - -cy.fit(cy.$("#a #b #h")); - -const { x1, y1, x2, y2, w, h } = cy.extent(); - -aliases(cy.resize, cy.invalidateDimensions); - -cy.animate({ - fit: { - padding: 10, - eles: cy.nodes(), - }, - duration: 500, -}); - -cy.animate({ - center: { eles: cy.nodes()[0] }, - duration: 500, -}); - -const anim = cy.animation({ - zoom: { - level: 1, - position: { x: 0, y: 0 }, - }, - pan: { x: 100, y: 100 }, - duration: 100, - easing: "ease", -}); -cy.stop(true, true); -anim.play(); -assert(anim.playing()); -anim.progress(anim.progress() + 50); -anim.time(anim.time() - 50); -anim.stop(); - -aliases(cy.layout, cy.createLayout, cy.makeLayout); - -// Preconfigured data for layouts (as it could be passed) -const boundingBox = oneOf({ x1: 0, x2: 100, y1: 0, y2: 100 }, { x1: 0, w: 100, y1: 0, h: 100 }); -const positions = oneOf( - { a: { x: 100, y: 100 } }, - (node: cytoscape.NodeCollection): cytoscape.Position => ({ x: 100, y: 100 }), -); - -// #core/viewport -cy.viewport({ zoom: 1.2, pan: { x: 0, y: 1 } }); - -// TODO: uncomment after we have the way to add layout options properties from extensions -// const layouts = [ -// cy.layout({ -// name: 'null', -// ready: () => {}, -// stop: () => {} -// }), -// cy.layout({ -// name: 'random', -// fit: true, -// padding: 30, -// boundingBox, -// animate: false, -// animationDuration: 500, -// animationEasing: 'ease-in', -// animateFilter: (node, i) => true, -// transform: (node, position) => position -// }), -// cy.layout({ -// name: 'preset', -// positions, -// zoom: 1, -// pan: {x: 100, y: 100}, -// fit: false, -// padding: 30, -// animate: false, -// animationDuration: 500, -// animationEasing: 'ease-out', -// animateFilter: (node, i) => true, -// transform: (node, position) => position -// }), -// cy.layout({ -// name: 'grid', -// fit: true, -// padding: 30, -// boundingBox, -// avoidOverlap: true, -// avoidOverlapPadding: 10, -// nodeDimensionsIncludeLabels: false, -// spacingFactor: oneOf(1, undefined), -// condense: false, -// rows: oneOf(10, undefined), -// cols: oneOf(10, undefined), -// position: (node) => ({ row: 1, col: 1 }), -// sort: (a, b) => 1, -// animate: false, -// animationDuration: 500, -// animationEasing: 'ease-in-out', -// animateFilter: (node, i) => true, -// transform: (node, position) => position -// }), -// cy.layout({ -// name: 'circle', -// fit: true, -// padding: 30, -// boundingBox, -// avoidOverlap: true, -// nodeDimensionsIncludeLabels: false, -// spacingFactor: oneOf(1, undefined), -// radius: oneOf(1, undefined), -// startAngle: 3 / 2 * Math.PI, -// sweep: oneOf(6, undefined), -// clockwise: true, -// sort: (a, b) => 1, -// animate: false, -// animationDuration: 500, -// animationEasing: 'ease-in-sine', -// animateFilter: (node, i) => true, -// transform: (node, position) => position -// }), -// cy.layout({ -// name: 'concentric', -// fit: true, -// padding: 30, -// startAngle: 3 / 2 * Math.PI, -// sweep: oneOf(6, undefined), -// clockwise: true, -// equidistant: false, -// minNodeSpacing: 10, -// boundingBox, -// avoidOverlap: true, -// nodeDimensionsIncludeLabels: false, -// height: oneOf(500, undefined), -// width: oneOf(500, undefined), -// spacingFactor: oneOf(1, undefined), -// concentric: (node) => 1, -// levelWidth: (nodes) => 1, -// animate: false, -// animationDuration: 500, -// animationEasing: 'ease-out-sine', -// animateFilter: (node, i) => true, -// transform: (node, position) => position -// }), -// cy.layout({ -// name: 'breadthfirst', -// fit: true, -// directed: false, -// padding: 30, -// circle: false, -// spacingFactor: 1.75, -// boundingBox, -// avoidOverlap: true, -// nodeDimensionsIncludeLabels: false, -// maximalAdjustments: 0, -// animate: false, -// animationDuration: 500, -// animationEasing: 'ease-in-out-sine', -// animateFilter: (node, i) => true, -// transform: (node, position) => position -// }), -// cy.layout({ -// name: 'cose', -// ready: () => {}, -// stop: () => {}, -// animate: oneOf(true, false, 'end'), -// animationEasing: oneOf('ease-in-quad', undefined), -// animationDuration: oneOf(500, undefined), -// animateFilter: function ( node, i ){ return true; }, -// animationThreshold: 250, -// refresh: 20, -// fit: true, -// padding: 30, -// boundingBox: undefined, -// nodeDimensionsIncludeLabels: false, -// randomize: false, -// componentSpacing: 40, -// nodeRepulsion: (node) => 2048, -// nodeOverlap: 4, -// idealEdgeLength: (edge) => 32, -// edgeElasticity: (edge) => 32, -// nestingFactor: 1.2, -// gravity: 1, -// numIter: 1000, -// initialTemp: 1000, -// coolingFactor: 0.99, -// minTemp: 1.0, -// weaver: false -// }) -// ]; -// const lay = layouts[0]; -// aliases(lay.run, lay.start); -// events(lay); -// layouts.map(layout => { -// layout.run(); -// layout.stop(); -// }); - -cy.style("node { background-color: yellow; }"); -cy.style() - .clear() - .fromJson([]) - .fromString("") - .resetToDefault() - .selector("") - .style("color", "white") - .style({ color: "white" }) - .update(); - -// $ExpectType string -cy.png({ - output: oneOf("base64uri", "base64", undefined), - bg: oneOf("#ffffff", undefined), - full: true, - scale: 2, - maxWidth: 100, - maxHeight: 100, -}); -// $ExpectType Blob -cy.png({ - output: "blob", - bg: oneOf("#ffffff", undefined), - full: true, - scale: 2, - maxWidth: 100, - maxHeight: 100, -}); -// $ExpectType Promise -cy.png({ - output: "blob-promise", - bg: oneOf("#ffffff", undefined), - full: true, - scale: 2, - maxWidth: 100, - maxHeight: 100, -}); - -aliases(cy.jpg, cy.jpeg); -// $ExpectType string -cy.jpg({ - output: oneOf("base64uri", "base64", undefined), - bg: oneOf("#ffffff", undefined), - full: true, - scale: 2, - maxWidth: 100, - maxHeight: 100, - quality: 0.5, -}); -// $ExpectType Blob -cy.jpg({ - output: "blob", - bg: oneOf("#ffffff", undefined), - full: true, - scale: 2, - maxWidth: 100, - maxHeight: 100, - quality: 0.5, -}); -// $ExpectType Promise -cy.jpg({ - output: "blob-promise", - bg: oneOf("#ffffff", undefined), - full: true, - scale: 2, - maxWidth: 100, - maxHeight: 100, - quality: 0.5, -}); - -cy.json(cy.json()); - -// Types possible to call methods -const ele = oneOf(cy.nodes()[0], cy.edges()[0]); -const eles = cy.elements(); -const node = cy.nodes()[0]; -const nodes = cy.nodes(); -const edge = cy.edges()[0]; -const edges = cy.edges(); - -assert(ele.cy() === cy); -eles.remove(); -assert(eles.removed()); -assert(!eles.inside()); -eles.restore(); - -( - [ele, eles, node, nodes, edge, edges] as [ - cytoscape.SingularElementReturnValue, - cytoscape.CollectionReturnValue, - cytoscape.NodeSingular, - cytoscape.NodeCollection, - cytoscape.EdgeSingular, - cytoscape.EdgeCollection, - ] -).forEach(elemType => { - aliases(elemType.clone, elemType.copy); - // events(elemType); - TODO - aliases(elemType.removeData, elemType.removeAttr); -}); -([ele, node, edge] as [cytoscape.SingularElementReturnValue, cytoscape.NodeSingular, cytoscape.EdgeSingular]).forEach( - elemType => { - aliases(elemType.data, elemType.attr); - }, -); - -// #core/data -aliases(cy.removeData, cy.removeAttr); -aliases(cy.data, cy.attr); - -cy.data(); -// $ExpectType Core -cy.data("title", "test"); -// $ExpectType Core -cy.data({ cytoscape: "graph", core: "data" }); -cy.data("title"); -cy.data("data"); -// $ExpectType Core -cy.removeData("cytoscape core"); -// $ExpectType Core -cy.removeData(); - -// #eles/data -aliases(eles.data, eles.attr); - -eles.data(); -// $ExpectType CollectionReturnValue -cy.$("#a").data("foo", "baz"); -cy.$("#a").data("foo"); -// $ExpectType CollectionReturnValue -cy.$("#a").data({ foo: "bar" }); - -// TODO: tests for data flow - -const loops = oneOf(true, false); -node.degree(loops); -node.indegree(loops); -node.outdegree(loops); -nodes.totalDegree(loops); -nodes.minDegree(loops); -nodes.maxDegree(loops); -nodes.minIndegree(loops); -nodes.maxIndegree(loops); -nodes.minOutdegree(loops); -nodes.maxOutdegree(loops); - -// eslint-disable-next-line @typescript-eslint/no-unsafe-function-type -const getsetPos = (func: T): T => { - func("x", func("x")); - func(func()); - func({ x: 100, y: 100 }); - return func; -}; - -aliases(node.modelPosition, node.point, node.position); -getsetPos(node.position); - -nodes.shift("x", 100); -nodes.shift({ x: -100, y: 0 }); - -aliases(nodes.modelPositions, nodes.positions, nodes.points); -nodes.positions((node, i) => Object.assign(node.position(), { x: node.position("x") + i })); - -aliases(node.renderedPosition, node.renderedPoint); -getsetPos(node.renderedPoint); - -// TODO: tests for compound nodes (relativePosition, in particular) - -const sizes: number[] = [ - ele.width(), - ele.outerWidth(), - ele.renderedWidth(), - ele.renderedOuterWidth(), - ele.height(), - ele.outerHeight(), - ele.renderedHeight(), - ele.renderedOuterHeight(), -]; - -aliases(eles.boundingBox, eles.boundingbox); -aliases(eles.renderedBoundingBox, eles.renderedBoundingbox); - -node.layoutDimensions({ nodeDimensionsIncludeLabels: true }); - -const flags: boolean[] = [node.grabbed(), node.grabbable(), node.locked(), ele.active()]; -nodes.lock(); -node.lock(); -nodes.unlock(); -node.unlock(); - -const edgePoints: cytoscape.Position[] = [ - ...edge.controlPoints(), - ...edge.segmentPoints(), - edge.sourceEndpoint(), - edge.targetEndpoint(), - edge.midpoint(), -]; - -aliases(eles.layout, eles.createLayout, eles.makeLayout); -const layout = eles.layout({ name: "random" }).run(); - -layout.on("layoutstop", () => { - cy.fit(); -}); -layout.on("layoutstop", {}, obj => { - console.log(obj); -}); - -eles.select(); -assert(ele.selected()); // as we selected all, and this too -aliases(eles.unselect, eles.deselect); -eles.selectify(); -assert(ele.selectable()); -eles.unselectify(); - -eles.addClass("test"); -eles.toggleClass("test", oneOf(true, false, undefined)); -eles.removeClass("test"); -eles.classes(["lesstext"]); -eles.classes(oneOf("test", undefined)); -// $ExpectedType string[] -eles.classes(); -eles.flashClass("test flash", oneOf(1000, undefined)); -assert(ele.hasClass("test")); - -nodes.addClass("border"); -nodes.removeClass("border"); - -eles.style("background-color", "green"); -Object.keys(eles.style()).map(key => eles.style(key)); -eles.style(eles.style()); -aliases(eles.style, eles.css); -aliases(ele.renderedCss, ele.renderedStyle); - -nodes.forEach(child => { - child.animate({ - position: node.position(), - duration: 300, - complete: () => { - console.log(child.id()); - }, - }); -}); - -// position is not required for an animation -nodes.forEach(child => { - child.animate({ - style: { - backgroundColor: "#f185dc", - width: "30px", - height: "30px", - }, - duration: 300, - }); -}); - -nodes.animate( - { - renderedPosition: node.position(), - }, - { - style: { backgroundColor: "red" }, - duration: 1000, - queue: true, - complete: () => console.log("end"), - step: () => console.log("step"), - easing: "ease-in-out-quint", - }, -); - -eles.anySame(nodes); -aliases(eles.contains, eles.has); -aliases(eles.allAreNeighbors, eles.allAreNeighbours); -eles.is("#g"); -eles.allAre("#g"); -eles.some((el, i, els) => true); -eles.every((el, i, els) => true); - -aliases(eles.forEach, eles.each); -const selected: cytoscape.SingularElementArgument[] = [eles.eq(0), eles.first(), eles.last()]; -const collSel = cy.collection(selected); -const selectedNodes: cytoscape.NodeSingular[] = [nodes.eq(0), nodes.first(), nodes.last()]; -const collNodes = cy.collection(selectedNodes); -const selectedEdges: cytoscape.EdgeSingular[] = [edges.eq(0), edges.first(), edges.last()]; -eles.slice(0, -1); -eles.toArray(); - -aliases(eles.getElementById, eles.$id); -aliases(eles.union, eles.add, eles.or, eles.u, eles["+"], eles["|"]); -aliases(eles.difference, eles.not, eles.subtract, eles.relativeComplement, eles["\\"], eles["!"], eles["-"]); -aliases(eles.absoluteComplement, eles.abscomp, eles.complement); -aliases(eles.intersection, eles.intersect, eles.and, eles.n, eles["&"], eles["."]); -aliases(eles.symmetricDifference, eles.symdiff, eles.xor, eles["^"], eles["(+)"], eles["(-)"]); -cy.collection([nodes[0]]).union(nodes[1]).union(eles.$id("g")); -eles.difference(collNodes).abscomp().intersection(collSel).symdiff(collNodes); -const diff = collSel.diff(collNodes); -cy.collection() - .merge(diff.left) - .merge(diff.right) - .merge(diff.both) - .unmerge(collSel) - .filter((ele, i, eles) => true); -for (const _ of cy.collection([])) { -} - -nodes.map(n => n.degree(false)); -edges.map(e => e.source()); -eles.map(e => e.id()); -eles.map(e => (e.isNode() ? e.degree(false) : e.source())); -eles.map(e => (e.isEdge() ? e.source() : e.degree(false))); - -eles.sort((a, b) => a.id.length - b.id.length).map((ele, i, eles) => [i, ele]); -eles.reduce((prev, ele, i, eles) => [...prev, [ele, i]], []).concat(["finish"]); - -const min = eles.min((ele, i, eles) => (ele.isNode() ? ele.degree(false) : ele.source().degree(false))); -min.ele.scratch("min", min.value).scratch("min").value; -const max = eles.max((ele, i, eles) => (ele.isEdge() ? ele.source().degree(false) : ele.degree(false))); -max.ele.scratch("max", max.value); - -nodes.min(n => n.degree(false)); -nodes.max(n => n.degree(false)); -edges.max(n => n.source().id().length); -edges.max(n => n.source().id().length); - -// directly from the doc: http://js.cytoscape.org/#eles.stop -cy.nodes() - .animate( - { - style: { "background-color": "cyan" }, - }, - { - duration: 5000, - complete: () => { - console.log("Animation complete"); - }, - }, - ) - .delay(100); - -setTimeout(() => { - console.log("Stopping nodes animation"); - cy.nodes().stop(); -}, 2500); - -// directly from the doc: http://js.cytoscape.org/#eles.breadthFirstSearch -const bfs = cy.elements().bfs({ - roots: "#e", - visit: (v, e, u, i, depth) => { - console.log("visit " + v.id()); - - // example of finding desired node - if (v.data("weight") > 70) { - return true; - } - - // example of exiting search early - if (v.data("weight") < 0) { - return false; - } - }, - directed: false, -}); - -const path = bfs.path; // path to found node -const found = bfs.found; // found node - -// select the path -path.select(); - -// root || roots are both ok -cy.elements(":grabbable").bfs({ root: "#1" }); -cy.elements(":grabbable").dfs({ roots: "#1" }); - -// TODO: traversing (need to actively check the nodes/edges distinction) -// TODO: algorithms -// Cut -cy.elements().kargerStein(); -aliases(eles.hopcroftTarjanBiconnected, eles.hopcroftTarjanBiconnectedComponents); -aliases(eles.hopcroftTarjanBiconnected, eles.htb); -aliases(eles.hopcroftTarjanBiconnected, eles.htbc); -aliases(eles.tarjanStronglyConnected, eles.tarjanStronglyConnectedComponents); -aliases(eles.tarjanStronglyConnected, eles.tsc); -aliases(eles.tarjanStronglyConnected, eles.tscc); -cy.elements().htbc(); -cy.elements().tsc(); -// TODO: compound nodes (there aren't any in current test case) - -// Check eles.boundingBox return type: https://js.cytoscape.org/#eles.boundingBox -const box1 = eles.boundingBox(); -box1.x1; -box1.x2; -box1.y1; -box1.y2; -box1.w; -box1.h; -// Check eles.renderedBoundingBox return type: https://js.cytoscape.org/#eles.renderedBoundingBox -const box2 = eles.renderedBoundingBox(); -box2.x1; -box2.x2; -box2.y1; -box2.y2; -box2.w; -box2.h; - -cy.elements().bfs({ - root: "#a", - visit: (v, e, u) => { - if (typeof e === "undefined") { - const test: undefined = e; - } else { - const test: EdgeSingular = e; - } - - if (typeof u === "undefined") { - const test: undefined = u; - } else { - const test: NodeSingular = u; - } - }, -}); - -// Check extension registration: https://js.cytoscape.org/#extensions/registration - -// $ExpectType void -cytoscape("core", "prop", () => {}); -// $ExpectType unknown -cytoscape("core", "name"); - -const myExt: cytoscape.Ext = cy => { - // $ExpectType void - cy("core", "prop", () => {}); - // $ExpectType unknown - cy("core", "prop"); -}; - -// Test CollectionEvents -collSel.emit("myEvt", ["string", 1, { a: 1, b: true }]); -collSel.trigger("myEvt", ["string", 1, { a: 1, b: true }]); - -// None of the LayoutOptions should require anything besides the name property. - -const nullNoOptions: NullLayoutOptions = { - name: "null", -}; -cy.layout(nullNoOptions); - -const randomNoOptions: RandomLayoutOptions = { - name: "random", -}; -cy.layout(randomNoOptions); - -const presetNoOptions: PresetLayoutOptions = { - name: "preset", -}; -cy.layout(presetNoOptions); - -const gridNoOptions: GridLayoutOptions = { - name: "grid", -}; -cy.layout(gridNoOptions); - -const circleNoOptions: CircleLayoutOptions = { - name: "circle", -}; -cy.layout(circleNoOptions); - -const concentricNoOptions: ConcentricLayoutOptions = { - name: "concentric", -}; -cy.layout(concentricNoOptions); - -const bfNoOptions: BreadthFirstLayoutOptions = { - name: "breadthfirst", -}; -cy.layout(bfNoOptions); - -const coseNoOptions: CoseLayoutOptions = { - name: "cose", -}; -cy.layout(coseNoOptions); - -// Tests for particular options that had problems. -const bfAllOptions: BreadthFirstLayoutOptions = { - name: "breadthfirst", - fit: false, - directed: true, - padding: 60, - circle: true, - grid: true, - spacingFactor: 1.0, - boundingBox: { x1: 12, y1: 12, w: 200, h: 300 }, - avoidOverlap: false, - nodeDimensionsIncludeLabels: true, - roots: [], - maximal: true, - depthSort: (a, b) => { - return 0; - }, - animate: true, - animationDuration: 1000, - animationEasing: "ease", - animateFilter: (node, i) => { - return false; - }, - ready: () => {}, - stop: () => {}, - transform: (node, position) => { - return position; - }, -}; -cy.layout(bfAllOptions); - -const circleAllOptions: CircleLayoutOptions = { - name: "circle", - fit: false, - padding: 45, - boundingBox: { x1: -5, y1: -40, x2: 25, y2: 67 }, - avoidOverlap: false, - nodeDimensionsIncludeLabels: true, - spacingFactor: 12, - radius: 57, - startAngle: 0, - sweep: Math.PI, - clockwise: false, - sort: (x, y) => x.id().length - y.id().length, - animate: true, - animationDuration: 750, - animationEasing: "ease", - animateFilter: (n, i) => false, - ready: () => {}, - stop: () => {}, -}; -cy.layout(circleAllOptions); - -const gridAllOptions: GridLayoutOptions = { - name: "grid", - fit: false, - padding: 0, - boundingBox: { x1: 12, y1: 120, w: 240, h: 680 }, - avoidOverlap: false, - avoidOverlapPadding: 5, - nodeDimensionsIncludeLabels: true, - spacingFactor: 2, - condense: true, - rows: 12, - cols: 6, - position: node => { - return { row: 3, col: 2 }; - }, - sort: (a, b) => 1, - animate: true, - animationDuration: 150, - animationEasing: "ease-in-sine", - animateFilter: (node, i) => false, - ready: () => {}, - stop: () => {}, - transform: (node, position) => { - return { y: position.x, x: position.y }; - }, -}; -cy.layout(gridAllOptions); - -const concentricAllOptions: ConcentricLayoutOptions = { - name: "concentric", - - fit: false, - padding: 300, - startAngle: (1 / 2) * Math.PI, - sweep: Math.PI, - clockwise: false, - equidistant: true, - minNodeSpacing: 5, - boundingBox: { x1: 0, y1: 1, x2: 2, y2: 3 }, - avoidOverlap: false, - nodeDimensionsIncludeLabels: true, - height: 5, - width: 3, - spacingFactor: 7, - concentric: _node => _node.neighborhood().size(), - levelWidth: _nodes => 5, - animate: true, - animationDuration: 50, - animationEasing: "ease-out", - animateFilter: (node, i) => false, - ready: () => {}, - stop: () => {}, - transform: (node, position) => { - return position; - }, -}; -cy.layout(concentricAllOptions); - -const coseAllOptions: CoseLayoutOptions = { - name: "cose", - ready: () => {}, - stop: () => {}, - animate: false, - animationEasing: "ease-out", - animationDuration: undefined, - animateFilter: (node, i) => false, - animationThreshold: 125, - refresh: 30, - fit: false, - padding: 12, - boundingBox: { x1: 9, y1: 23, w: 42, h: 3000 }, - nodeDimensionsIncludeLabels: true, - randomize: true, - componentSpacing: 57, - nodeRepulsion: node => 32, - nodeOverlap: 4, - idealEdgeLength: edge => 75, - edgeElasticity: edge => 111, - nestingFactor: 3.8, - gravity: 9.8, - numIter: 12000, - initialTemp: 5000, - coolingFactor: 0.98, - minTemp: 10.0, -}; -cy.layout(coseAllOptions); - -const ccn = cy.nodes().closenessCentralityNormalized({ directed: false }); -ccn.closeness(cy.nodes()[0]); diff --git a/types/cytoscape/index.d.ts b/types/cytoscape/index.d.ts deleted file mode 100644 index 614639bda0cbbe..00000000000000 --- a/types/cytoscape/index.d.ts +++ /dev/null @@ -1,5873 +0,0 @@ -// -// Translation from Objects in help to Typescript interface. -// http://js.cytoscape.org/#notation/functions -// TypeScript Version: 2.3 - -/** - * cy --> Cy.Core - * the core - * - * eles --> Cy.Collection - * a collection of one or more elements (nodes and edges) - * - * ele --> Cy.Singular - * a collection of a single element (node or edge) - * - * node --> Cy.NodeSingular - * a collection of a single node - * - * nodes -> Cy.NodeCollection - * a collection of one or more nodes - * - * edge --> Cy.EdgeSingular - * a collection of a single edge - * - * edges -> Cy.EdgeCollection - * a collection of one or more edges - * - * The library makes a distinction between input and output parameters - * due to the dynamic behaviour of the Cytoscape library. - * - * For a input parameter it will always expect: - * - Cy.Collection - * The input can be any element (node and edge) collection. - * - Cy.NodeCollection - * The input must be a node collection. - * - Cy.EdgeCollection - * The input must be a edge collection. - * - Cy.Singular - * The input must be a single element. - * - Cy.NodeSingular - * The inut must be a single node. - * - Cy.EdgeSingular - * The input must be a single edge. - * - * For a output of a function it will always give: - * - Cy.CollectionElements - * The output is a collection of node and edge elements OR single element. - * - Cy.EdgeCollection - * The output is a collection of edge elements OR single edge. - * - Cy.NodeCollection - * The output is a collection of node elements OR single node. - * - * A number of interfaces contain nothing as they server to collect interfaces. - */ -export = cytoscape; -export as namespace cytoscape; - -declare function cytoscape(options?: cytoscape.CytoscapeOptions): cytoscape.Core; -declare function cytoscape(type: string, name: string): unknown; -declare function cytoscape(type: string, name: string, registrant: any): void; - -declare namespace cytoscape { - interface Position { - x: number; - y: number; - } - - type CssStyleDeclaration = any; - - interface ElementDefinition { - group?: ElementGroup | undefined; - data: NodeDataDefinition | EdgeDataDefinition; - /** - * Scratchpad data (usually temp or nonserialisable data) - */ - scratch?: Scratchpad | undefined; - /** - * The model position of the node (optional on init, mandatory after) - */ - position?: Position | undefined; - /** - * can alternatively specify position in rendered on-screen pixels - */ - renderedPosition?: Position | undefined; - /** - * Whether the element is selected (default false) - */ - selected?: boolean | undefined; - /** - * Whether the selection state is mutable (default true) - */ - selectable?: boolean | undefined; - /** - * When locked a node's position is immutable (default false) - */ - locked?: boolean | undefined; - /** - * Wether the node can be grabbed and moved by the user - */ - grabbable?: boolean | undefined; - /** - * Whether the element has passthrough panning enabled. - */ - pannable?: boolean | undefined; - /** - * a space separated list of class names that the element has - */ - classes?: string[] | string | undefined; - /** - * CssStyleDeclaration; - */ - style?: CssStyleDeclaration | undefined; - /** - * you should only use `style`/`css` for very special cases; use classes instead - */ - css?: Css.Node | Css.Edge | undefined; - } - - interface ElementDataDefinition { - /** - * elided id => autogenerated id - */ - id?: string | undefined; - position?: Position | undefined; - } - - interface EdgeDefinition extends ElementDefinition { - data: EdgeDataDefinition; - } - - interface EdgeDataDefinition extends ElementDataDefinition { - id?: string | undefined; - - /** - * the source node id (edge comes from this node) - */ - source: string; - /** - * the target node id (edge goes to this node) - */ - target: string; - - [key: string]: any; - } - - interface NodeDefinition extends ElementDefinition { - data: NodeDataDefinition; - } - - interface NodeDataDefinition extends ElementDataDefinition { - id?: string | undefined; - parent?: string | undefined; - [key: string]: any; - } - - interface CytoscapeOptions { - /////////////////////////////////////// - // very commonly used options: - /** - * A HTML DOM element in which the graph should be rendered. - * This is optional if Cytoscape.js is run headlessly or if you initialise using jQuery (in which case your jQuery object already has an associated DOM element). - * - * The default is undefined. - */ - container?: HTMLElement | null | undefined; - - /** - * An array of [[Elements]] specified as plain objects. For convenience, this option can alternatively be specified as a promise that resolves to the elements JSON. - */ - elements?: - | ElementsDefinition - | ElementDefinition[] - | Promise - | Promise - | undefined; - /** - * The [[Stylesheet]] used to style the graph. For convenience, this option can alternatively be specified as a promise that resolves to the stylesheet. - */ - style?: Stylesheet[] | Promise | undefined; - /** - * A plain object that specifies layout options. - * Which layout is initially run is specified by the name field. - * Refer to a layout's documentation for the options it supports. - * If you want to specify your node positions yourself in your elements JSON, - * you can use the preset layout — by default it does not set any positions, - * leaving your nodes in their current positions - * (e.g. specified in options.elements at initialisation time) - */ - layout?: LayoutOptions | undefined; - - /** - * A plain object that contains graph-level data (i.e. data that does not belong to any particular node or edge). - */ - data?: Record | undefined; - - /////////////////////////////////////// - // initial viewport state: - /** - * The initial zoom level of the graph. - * Make sure to disable viewport manipulation options, such as fit, in your layout so that it is not overridden when the layout is applied. - * You can set options.minZoom and options.maxZoom to set restrictions on the zoom level. - * - * The default value is 1. - */ - zoom?: number | undefined; - /** - * The initial panning position of the graph. Make sure to disable viewport manipulation options, such as fit, - * in your layout so that it is not overridden when the layout is applied. - */ - pan?: Position | undefined; - - /////////////////////////////////////// - // interaction options?: - /** - * A minimum bound on the zoom level of the graph. The viewport can not be scaled smaller than this zoom level. - * - * The default value is 1e-50. - */ - minZoom?: number | undefined; - /** - * A maximum bound on the zoom level of the graph. The viewport can not be scaled larger than this zoom level. - * - * The default value is 1e50. - */ - maxZoom?: number | undefined; - /** - * Whether zooming the graph is enabled, both by user events and programmatically. - * - * The default value is true. - */ - zoomingEnabled?: boolean | undefined; - /** - * Whether user events (e.g. mouse wheel, pinch-to-zoom) are allowed to zoom the graph. Programmatic changes to zoom are unaffected by this option. - * - * The default value is true. - */ - userZoomingEnabled?: boolean | undefined; - /** - * Whether panning the graph is enabled, both by user events and programmatically. - * - * The default value is true. - */ - panningEnabled?: boolean | undefined; - /** - * Whether user events (e.g. dragging the graph background) are allowed to pan the graph. Programmatic changes to pan are unaffected by this option. - * - * The default value is true. - */ - userPanningEnabled?: boolean | undefined; - /** - * Whether box selection (i.e. drag a box overlay around, and release it to select) is enabled. If enabled, the user must taphold to pan the graph. - * - * The default value is false. - */ - boxSelectionEnabled?: boolean | undefined; - /** - * A string indicating the selection behaviour from user input. - * By default, this is set automatically for you based on the type of input device detected. - * On touch devices, 'additive' is default — a new selection made by the user adds to the set of currenly selected elements. - * On mouse-input devices, 'single' is default — a new selection made by the user becomes the entire set of currently selected elements (i.e. the previous elements are unselected). - * - * The default value is (isTouchDevice ? 'additive' : 'single'). - */ - selectionType?: SelectionType | undefined; - /** - * A nonnegative integer that indicates the maximum allowable distance that a user may move during a tap gesture, - * on touch devices and desktop devices respectively. - * - * This makes tapping easier for users. - * These values have sane defaults, so it is not advised to change these options unless you have very good reason for doing so. - * Larger values will almost certainly have undesirable consequences. - * - * The default value is is 8. - */ - touchTapThreshold?: number | undefined; - /** - * A nonnegative integer that indicates the maximum allowable distance that a user may move during a tap gesture, - * on touch devices and desktop devices respectively. - * - * This makes tapping easier for users. - * These values have sane defaults, - * so it is not advised to change these options unless you have very good reason for doing so. - * Larger values will almost certainly have undesirable consequences. - * - * The default value is 4. - */ - desktopTapThreshold?: number | undefined; - /** - * Whether nodes should be locked (not draggable at all) by default (if true, overrides individual node state). - * - * The default value is false. - */ - autolock?: boolean | undefined; - /** - * Whether nodes should be ungrabified (not grabbable by user) by default (if true, overrides individual node state). - * - * The default value is false. - */ - autoungrabify?: boolean | undefined; - /** - * Whether nodes should be unselectified (immutable selection state) by default (if true, overrides individual element state). - * - * The default value is false. - */ - autounselectify?: boolean | undefined; - - /////////////////////////////////////// - // rendering options: - /** - * A convenience option that initialises the Core to run headlessly. - * You do not need to set this in environments that are implicitly headless (e.g. Node.js). - * However, it is handy to set headless: true if you want a headless Core in a browser. - * - * The default value is false. - */ - headless?: boolean | undefined; - /** - * A boolean that indicates whether styling should be used. - * For headless (i.e. outside the browser) environments, - * display is not necessary and so neither is styling necessary — thereby speeding up your code. - * You can manually enable styling in headless environments if you require it for a special case. - * Note that it does not make sense to disable style if you plan on rendering the graph. - * - * The default value is true. - */ - styleEnabled?: boolean | undefined; - /** - * When set to true, the renderer does not render edges while the viewport is being manipulated. - * This makes panning, zooming, dragging, et cetera more responsive for large graphs. - * - * The default value is false. - */ - hideEdgesOnViewport?: boolean | undefined; - /** - * when set to true, the renderer does not render labels while the viewport is being manipulated. - * This makes panning, zooming, dragging, et cetera more responsive for large graphs. - * - * The default value is false. - */ - hideLabelsOnViewport?: boolean | undefined; - /** - * When set to true, the renderer uses a texture (if supported) during panning and zooming instead of drawing the elements, - * making large graphs more responsive. - * - * The default value is false. - */ - textureOnViewport?: boolean | undefined; - /** - * When set to true, the renderer will use a motion blur effect to make the transition between frames seem smoother. - * This can significantly increase the perceived performance for a large graphs. - * - * The default value is false. - */ - motionBlur?: boolean | undefined; - /** - * When motionBlur: true, this value controls the opacity of motion blur frames. - * Higher values make the motion blur effect more pronounced. - * - * The default value is 0.2. - */ - motionBlurOpacity?: number | undefined; - /** - * Changes the scroll wheel sensitivity when zooming. This is a multiplicative modifier. - * So, a value between 0 and 1 reduces the sensitivity (zooms slower), and a value greater than 1 increases the sensitivity (zooms faster). - * - * The default value is 1. - */ - wheelSensitivity?: number | undefined; - /** - * Overrides the screen pixel ratio with a manually set value (1.0 or 0.666 recommended, if set). - * This can be used to increase performance on high density displays by reducing the effective area that needs to be rendered. - * If you want to use the hardware's actual pixel ratio at the expense of performance, you can set pixelRatio: 'auto'. - * - * The default value is 1. - */ - pixelRatio?: number | "auto" | undefined; - } - - /** - * cy --> Cy.Core - * The core object is your interface to a graph. - * - * It is your entry point to Cytoscape.js: - * All of the library’s features are accessed through this object. - * http://js.cytoscape.org/#core - */ - interface Core - extends - CoreGraphManipulation, - CoreData, - CoreGraphManipulationExt, - CoreEvents, - CoreViewportManipulation, - CoreAnimation, - CoreLayout, - CoreStyle, - CoreExport - {} - - /** - * These are the principle functions used to interact with the graph model. - * - * http://js.cytoscape.org/#core/graph-manipulation - */ - interface CoreGraphManipulation { - /** - * Add elements to the graph and return them. - */ - add( - eles: ElementDefinition | ElementDefinition[] | ElementsDefinition | CollectionArgument, - ): CollectionReturnValue; - - /** - * Remove elements in collecion or match the selector from the graph and return them. - */ - remove(eles: CollectionArgument | Selector): CollectionReturnValue; - - /** - * Get a collection from elements in the graph matching the specified selector or from an array of elements. - * If no parameter specified, an empty collection will be returned - */ - collection(eles?: Selector | CollectionArgument[]): CollectionReturnValue; - - /** - * check whether the specified id is in the collection - */ - hasElementWithId(id: string): boolean; - - /** - * Get an element from its ID in a very performant way. - * http://js.cytoscape.org/#cy.getElementById - */ - getElementById(id: string): CollectionReturnValue; - - /** - * Get an element from its ID in a very performant way. - * http://js.cytoscape.org/#cy.getElementById - */ - $id(id: string): CollectionReturnValue; - - /** - * Get elements in the graph matching the specified selector. - * http://js.cytoscape.org/#cy.$ - */ - $(selector: Selector): CollectionReturnValue; - - /** - * Get elements in the graph matching the specified selector. - * http://js.cytoscape.org/#cy.$ - */ - elements(selector?: Selector): CollectionReturnValue; - - /** - * Get nodes in the graph matching the specified selector. - */ - nodes(selector?: Selector): NodeCollection; - - /** - * Get edges in the graph matching the specified selector. - */ - edges(selector?: Selector): EdgeCollection; - /** - * Get elements in the graph matching the specified selector or filter function. - */ - filter( - selector: Selector | ((ele: Singular, i: number, eles: CollectionArgument) => boolean), - ): CollectionReturnValue; - - /** - * Allow for manipulation of elements without triggering multiple style calculations or multiple redraws. - * http://js.cytoscape.org/#cy.batch - * A callback within which you can make batch updates to elements. - */ - batch(callback: () => void): void; - /** - * Allow for manipulation of elements without triggering multiple style calculations or multiple redraws. - * http://js.cytoscape.org/#cy.batch - * - * Starts batching manually (useful for asynchronous cases). - */ - startBatch(): void; - /** - * Allow for manipulation of elements without triggering multiple style calculations or multiple redraws. - * http://js.cytoscape.org/#cy.batch - * - * Ends batching manually (useful for asynchronous cases). - */ - endBatch(): void; - - /** - * Attaches the instance to the specified container for visualisation. - * http://js.cytoscape.org/#cy.mount - * - * If the core instance is headless prior to calling cy.mount(), then - * the instance will no longer be headless and the visualisation will - * be shown in the specified container. If the core instance is - * non-headless prior to calling cy.mount(), then the visualisation - * is swapped from the prior container to the specified container. - */ - mount(element: Element): void; - - /** - * Remove the instance from its current container. - * http://js.cytoscape.org/#cy.unmount - * - * This function sets the instance to be headless after unmounting from - * the current container. - */ - unmount(): void; - - /** - * A convenience function to explicitly destroy the Core. - * http://js.cytoscape.org/#cy.destroy - */ - destroy(): void; - - /** - * Get whether the instance of Cytoscape.js has been destroyed or not. - * https://js.cytoscape.org/#cy.destroyed - */ - destroyed(): boolean; - } - - /** - * https://js.cytoscape.org/#core/data - */ - interface CoreData { - /** - * Read and write developer-defined data associated with the graph. - * http://js.cytoscape.org/#cy.data - */ - /** - * Get the entire data object or a particular data field. - * @alias attr - * - * @param name The name of the field to get. - */ - data(name?: string): any; - /** - * Set a particular data field. - * @alias attr - * - * @param name The name of the field to set. - * @param value The value to set for the field. - */ - data(name: string, value: any): this; - /** - * Update multiple data fields at once via an object. - * @alias attr - * - * @param obj The object containing name-value pairs to update data fields. - */ - data(obj: Record): this; - /** - * Get the entire data object or a particular data field. - * - * @param name The name of the field to get. Get the entire data object - */ - attr(name?: string): any; - /** - * Set a particular data field. - * - * @param name The name of the field to set. - * @param value The value to set for the field. - */ - attr(name: string, value: any): this; - /** - * Update multiple data fields at once via an object. - * - * @param obj The object containing name-value pairs to update data fields. - */ - attr(obj: Record): this; - - /** - * Remove developer-defined data associated with the elements. - * https://js.cytoscape.org/#cy.removeData - * @alias removeAttr - * - * @param names A space-separated list of fields to delete. - */ - removeData(names?: string): this; - /** - * Remove developer-defined data associated with the elements. - * https://js.cytoscape.org/#cy.removeData - * - * @param names A space-separated list of fields to delete. - */ - removeAttr(names?: string): this; - } - - /** - * http://js.cytoscape.org/#core/graph-manipulation - * http://js.cytoscape.org/#extensions - * These functions are intended for use in extensions. - */ - interface CoreGraphManipulationExt { - /** - * Set the scratchpad at a particular namespace, - * where temporary or non-JSON data can be stored. - * App-level scratchpad data should use namespaces prefixed with underscore, like '_foo'. - * - * If no parameter provided, the entire scratchpad will be returned. - * If only namespace provided, the scratchpad with the namespace will be returned. - * - * @param namespace A namespace string. - * @param value The value to set at the specified namespace. - */ - scratch(namespace?: string): Scratchpad; - scratch(namespace: string, value: any): this; - - /** - * Remove scratchpad data. You should remove scratchpad data only at your own namespaces. - * http://js.cytoscape.org/#cy.removeScratch - * - * @param namespace A namespace string. - */ - removeScratch(namespace: string): this; - } - - /** - * The principle events from the graph model. - * http://js.cytoscape.org/#core/events - */ - interface CoreEvents { - /** - * Bind to events that occur in the graph. - * - * @param events A space separated list of event names. - * @param handler The handler function that is called when one of the specified events occurs. - * @param selector A selector to specify elements for which the handler is triggered. - * @param data A plain object which is passed to the handler in the event object argument. - * @param eventsMap A map of event names to handler functions. - */ - - on(events: EventNames, handler: EventHandler): this; - on(events: EventNames, selector: Selector, handler: EventHandler): this; - on(events: EventNames, selector: Selector, data: any, handler: EventHandler): this; - on(eventsMap: { [value: string]: EventHandler }, selector?: Selector, data?: any): this; - - bind(events: EventNames, handler: EventHandler): this; - bind(events: EventNames, selector: Selector, handler: EventHandler): this; - bind(events: EventNames, selector: Selector, data: any, handler: EventHandler): this; - bind(eventsMap: { [value: string]: EventHandler }, selector?: Selector, data?: any): this; - - listen(events: EventNames, handler: EventHandler): this; - listen(events: EventNames, selector: Selector, handler: EventHandler): this; - listen(events: EventNames, selector: Selector, data: any, handler: EventHandler): this; - listen(eventsMap: { [value: string]: EventHandler }, selector?: Selector, data?: any): this; - - addListener(events: EventNames, handler: EventHandler): this; - addListener(events: EventNames, selector: Selector, handler: EventHandler): this; - addListener(events: EventNames, selector: Selector, data: any, handler: EventHandler): this; - addListener(eventsMap: { [value: string]: EventHandler }, selector?: Selector, data?: any): this; - - /** - * Get a promise that is resolved with the first - * of any of the specified events triggered on the graph. - * @param events A space separated list of event names. - * @param selector [optional] A selector to specify elements for which the handler is triggered. - */ - promiseOn(events: EventNames, selector?: Selector): Promise; - pon(events: EventNames, selector?: Selector): Promise; - /** - * Bind to events that occur in the graph, and trigger the handler only once. - * - * @param events A space separated list of event names. - * @param handler The handler function that is called when one of the specified events occurs. - */ - one(events: EventNames, handler: EventHandler): this; - /** - * Bind to events that occur in the graph, and trigger the handler only once. - * - * @param events A space separated list of event names. - * @param handler The handler function that is called when one of the specified events occurs. - * @param selector A selector to specify elements for which the handler is triggered. - */ - one(events: EventNames, selector: Selector, handler: EventHandler): this; - /** - * Bind to events that occur in the graph, and trigger the handler only once. - * - * @param events A space separated list of event names. - * @param handler The handler function that is called when one of the specified events occurs. - * @param selector A selector to specify elements for which the handler is triggered. - * @param data A plain object which is passed to the handler in the event object argument. - */ - one(events: EventNames, selector: Selector, data: any, handler: EventHandler): this; - /** - * Bind to events that occur in the graph, and trigger the handler only once. - * - * @param eventsMap A map of event names to handler functions. - * @param selector A selector to specify elements for which the handler is triggered. - * @param data A plain object which is passed to the handler in the event object argument. - */ - one(eventsMap: { [value: string]: EventHandler }, selector?: Selector, data?: any): this; - - /** - * Remove event handlers. - * http://js.cytoscape.org/#cy.off - * - * @param events A space separated list of event names. - * @param selector [optional] The same selector used to bind to the events. - * @param handler [optional] A reference to the handler function to remove. - * @param eventsMap A map of event names to handler functions to remove. - */ - off(events: EventNames, handler?: EventHandler): this; - off(events: EventNames, selector: Selector, handler?: EventHandler): this; - off(eventsMap: { [value: string]: EventHandler }, selector?: Selector): this; - - unbind(events: EventNames, handler?: EventHandler): this; - unbind(events: EventNames, selector: Selector, handler?: EventHandler): this; - unbind(eventsMap: { [value: string]: EventHandler }, selector?: Selector): this; - - unlisten(events: EventNames, handler?: EventHandler): this; - unlisten(events: EventNames, selector: Selector, handler?: EventHandler): this; - unlisten(eventsMap: { [value: string]: EventHandler }, selector?: Selector): this; - - removeListener(events: EventNames, handler?: EventHandler): this; - removeListener(events: EventNames, selector: Selector, handler?: EventHandler): this; - removeListener(eventsMap: { [value: string]: EventHandler }, selector?: Selector): this; - - /** - * Remove all event handlers. - * https://js.cytoscape.org/#cy.removeAllListeners - */ - removeAllListeners(): this; - - /** - * Trigger one or more events. - * - * @param events A space separated list of event names to trigger. - * @param extraParams [optional] An array of additional parameters to pass to the handler. - */ - trigger(events: EventNames, extraParams?: any[]): this; - emit(events: EventNames, extraParams?: any[]): this; - - /** - * Run a callback as soon as the graph becomes ready. If the graph is already ready, then the callback is called immediately. - * @param fn The callback run as soon as the graph is ready, inside which this refers to the core (cy). - */ - ready(fn: EventHandler): this; - } - - interface ZoomOptionsModel { - /** The position about which to zoom. */ - position: Position; - } - interface ZoomOptionsRendered { - /** The rendered position about which to zoom. */ - renderedPosition: Position; - } - interface ZoomOptionsLevel { - /** The zoom level to set. */ - level: number; - } - type ZoomOptions = number | (ZoomOptionsLevel & (ZoomOptionsModel | ZoomOptionsRendered)); - - /** - * http://js.cytoscape.org/#core/viewport-manipulation - */ - interface CoreViewportManipulation { - /** - * Get the HTML DOM element in which the graph is visualised. - * A null value is returned if the Core is headless. - */ - container(): HTMLElement | null; - - /** - * Pan the graph to the centre of a collection. - * - * @param eles The collection to centre upon. - */ - center(eles?: CollectionArgument): this; - - /** - * Pan the graph to the centre of a collection. - * - * @param eles The collection to centre upon. - */ - centre(eles?: CollectionArgument): this; - - /** - * Pan and zooms the graph to fit to a collection. - * http://js.cytoscape.org/#cy.fit - * - * @param eles [optional] The collection to fit to. - * @param padding [optional] An amount of padding (in pixels) to have around the graph - */ - fit(eles?: CollectionArgument, padding?: number): this; - - /** - * Reset the graph to the default zoom level and panning position. - * http://js.cytoscape.org/#cy.reset - */ - reset(): this; - - /** - * Get the panning position of the graph. - * http://js.cytoscape.org/#cy.pan - */ - pan(): Position; - - /** - * Set the panning position of the graph. - * http://js.cytoscape.org/#cy.pan - * - * @param renderedPosition The rendered position to pan the graph to. - */ - pan(renderedPosition?: Position): this; - - /** - * Relatively pan the graph by a specified rendered position vector. - * http://js.cytoscape.org/#cy.panBy - * - * @param renderedPosition The rendered position vector to pan the graph by. - */ - panBy(renderedPosition: Position): this; - - /** - * Get whether panning is enabled. - * If cy.boxSelectionEnabled() === true, then the user - * must taphold to initiate panning. - * http://js.cytoscape.org/#cy.panningEnabled - */ - panningEnabled(): boolean; - - /** - * Set whether panning is enabled. If cy.boxSelectionEnabled() === true, then the user must taphold to initiate panning. - * http://js.cytoscape.org/#cy.panningEnabled - * - * @param bool A truthy value enables panning; a falsey value disables it. - */ - panningEnabled(bool?: boolean): this; - - /** - * Get whether panning by user events (e.g. dragging the graph background) is enabled. If cy.boxSelectionEnabled() === true, then the user must taphold to initiate panning. - * http://js.cytoscape.org/#cy.userPanningEnabled - */ - userPanningEnabled(): boolean; - - /** - * Set whether panning by user events (e.g. dragging the graph background) is enabled. If cy.boxSelectionEnabled() === true, then the user must taphold to initiate panning. - * http://js.cytoscape.org/#cy.userPanningEnabled - * - * @param bool A truthy value enables user panning; a falsey value disables it. - */ - userPanningEnabled(bool?: boolean): this; - /** - * Get the zoom level. - * http://js.cytoscape.org/#cy.zoom - */ - zoom(): number; - /** - * Set the zoom level. - * http://js.cytoscape.org/#cy.zoom - * - * @param level The zoom level to set. - * @param options The options for zooming. - */ - zoom(level?: number | ZoomOptions): this; - - /** - * Set or get whether zooming is enabled. Get if no parameter provided. - * http://js.cytoscape.org/#cy.zoomingEnabled - * - * @param bool A truthy value enables zooming; a falsey value disables it. - */ - zoomingEnabled(bool?: boolean): this; - - /** - * Get whether zooming by user events (e.g. mouse wheel, pinch-to-zoom) - * is enabled. - * http://js.cytoscape.org/#cy.userZoomingEnabled - */ - userZoomingEnabled(): boolean; - /** - * Get or set whether zooming by user events get if no parameter provided - * (e.g. mouse wheel, pinch-to-zoom) is enabled. - * http://js.cytoscape.org/#cy.userZoomingEnabled - * - * @param bool A truthy value enables user zooming; a falsey value disables it. - */ - userZoomingEnabled(bool?: boolean): this; - - /** - * Get the minimum zoom level. - * http://js.cytoscape.org/#cy.minZoom - */ - minZoom(): number; - /** - * Set the minimum zoom level. - * http://js.cytoscape.org/#cy.minZoom - * - * @param zoom The new minimum zoom level to use. - */ - minZoom(zoom: number): this; - - /** - * Get the maximum zoom level. - * http://js.cytoscape.org/#cy.maxZoom - */ - maxZoom(): number; - /** - * Set the maximum zoom level. - * http://js.cytoscape.org/#cy.maxZoom - * - * @param zoom The new maximum zoom level to use. - */ - maxZoom(zoom: number): this; - - /** - * Set the viewport state (pan & zoom) in one call. - * http://js.cytoscape.org/#cy.viewport - * - * @param options The viewport options. - * @param options.zoom The zoom level to set. - * @param options.pan The pan to set (a rendered position). - */ - viewport(options: { zoom: number; pan: Position }): this; - - /** - * Get whether box selection is enabled. - * If enabled, the user must hold left-click to initiate panning. - * http://js.cytoscape.org/#cy.boxSelectionEnabled - */ - boxSelectionEnabled(): boolean; - /** - * Set whether box selection is enabled. - * If enabled, the user must hold left-click to initiate panning. - * http://js.cytoscape.org/#cy.boxSelectionEnabled - * - * @param bool A truthy value enables box selection; a falsey value disables it. - */ - boxSelectionEnabled(bool?: boolean): this; - - /** - * Get the selection type. - * http://js.cytoscape.org/#cy.selectionType - */ - selectionType(): SelectionType; - /** - * Set the selection type. - * http://js.cytoscape.org/#cy.selectionType - * - * @param type The selection type string; one of 'single' (default) or 'additive'. - */ - selectionType(type: SelectionType): this; - - /** - * Get the on-screen width of the viewport in pixels. - * http://js.cytoscape.org/#cy.width - */ - width(): number; - - /** - * Get the on-screen height of the viewport in pixels. - * http://js.cytoscape.org/#cy.height - */ - height(): number; - - /** - * Get the extent of the viewport, a bounding box in model - * coordinates that lets you know what model - * positions are visible in the viewport. - * http://js.cytoscape.org/#cy.extent - */ - extent(): { - x1: number; - y1: number; - x2: number; - y2: number; - w: number; - h: number; - }; - - /** - * Get whether nodes are automatically locked - * (i.e. if true, nodes are locked despite their individual state). - * http://js.cytoscape.org/#cy.autolock - */ - autolock(): boolean; - /** - * Set whether nodes are automatically locked - * (i.e. if true, nodes are locked despite their individual state). - * http://js.cytoscape.org/#cy.autolock - * - * @param bool A truthy value enables autolocking; a falsey value disables it. - */ - autolock(bool?: boolean): this; - - /** - * Get whether nodes are automatically ungrabified - * (i.e. if true, nodes are ungrabbale despite their individual state). - * http://js.cytoscape.org/#cy.autoungrabify - */ - autoungrabify(): boolean; - /** - * Set whether nodes are automatically ungrabified - * (i.e. if true, nodes are ungrabbale despite their individual state). - * http://js.cytoscape.org/#cy.autoungrabify - * - * @param bool A truthy value enables autolocking; a falsey value disables it. - */ - autoungrabify(bool?: boolean): this; - - /** - * Get whether nodes are automatically unselectified - * (i.e. if true, nodes are unselectable despite their individual state). - * http://js.cytoscape.org/#cy.autounselectify - */ - autounselectify(): boolean; - /** - * Set whether nodes are automatically unselectified - * (i.e. if true, nodes are unselectable despite their individual state). - * http://js.cytoscape.org/#cy.autounselectify - * - * @param bool A truthy value enables autolocking; a falsey value disables it. - */ - autounselectify(bool?: boolean): this; - - /** - * Force the renderer to redraw (i.e. draw a new frame). - * - * This function forces the renderer to draw a new frame. - * It is useful for very specific edgecases, such as in certain UI plugins, - * but it should not be needed for most developers. - * http://js.cytoscape.org/#cy.forceRender - */ - forceRender(): this; - - /** - * Force the renderer to recalculate the viewport bounds. - * - * If your code resizes the graph's dimensions or position - * (i.e. by changing the style of the HTML DOM element that holds the graph), - * you will want to call cy.resize() to have the graph resize and redraw itself. - * - * Cytoscape.js can not automatically monitor the bounding box of the viewport, - * as querying the DOM for those dimensions can be expensive. - * Although cy.resize() is automatically called for you on the window's resize event, - * there is no resize or style event for arbitrary DOM elements. - * http://js.cytoscape.org/#cy.resize - */ - resize(): this; - invalidateDimensions(): this; - } - - /** - * http://js.cytoscape.org/#core/animation - */ - interface AnimationFitOptions { - eles: CollectionArgument | Selector; // to which the viewport will be fitted. - padding: number; // Padding to use with the fitting. - } - interface CenterOptions { - eles: CollectionArgument | Selector; // to which the viewport will be selected. - } - interface AnimationOptions { - /** A zoom level to which the graph will be animated. */ - zoom?: ZoomOptions | undefined; - /** A panning position to which the graph will be animated. */ - pan?: Position | undefined; - /** A relative panning position to which the graph will be animated. */ - panBy?: Position | undefined; - /** An object containing fitting options from which the graph will be animated. */ - fit?: AnimationFitOptions | undefined; - /** An object containing centring options from which the graph will be animated. */ - center?: CenterOptions | undefined; - /** easing - A transition-timing-function easing style string that shapes the animation progress curve. */ - easing?: Css.TransitionTimingFunction | undefined; - - /** duration - The duration of the animation in milliseconds. */ - duration?: number | undefined; - } - interface AnimateOptions extends AnimationOptions { - /** queue - A boolean indicating whether to queue the animation. */ - queue?: boolean | undefined; - /** complete - A function to call when the animation is done. */ - complete?(): void; - /** step - A function to call each time the animation steps. */ - step?(): void; - } - - interface CoreAnimation { - /** - * Get whether the viewport is currently being animated. - * http://js.cytoscape.org/#cy.animated - */ - animated(): boolean; - - /** - * Animate the viewport. - * http://js.cytoscape.org/#cy.animate - * - * @param anis An object containing the details of the animation. - * - * @param options An object containing animation options. - */ - animate(anis: AnimateOptions, options?: AnimateOptions): Core; - - /** - * Get an animation of the viewport. - * http://js.cytoscape.org/#cy.animation - */ - animation(options: AnimationOptions): AnimationManipulation; - - /** - * Add a delay between animations for the viewport. - * - * @param duration How long the delay should be in milliseconds. - * @param complete A function to call when the delay is complete. - */ - delay(duration: number, complete?: () => void): Core; - - /** - * Get a delay animation of the viewport. - * http://js.cytoscape.org/#cy.delayAnimation - */ - delayAnimation(duration: number): AnimationManipulation; - - /** - * Stop all viewport animations that are currently running. - * http://js.cytoscape.org/#cy.stop - * - * @param clearQueue A boolean, indicating whether the queue of animations should be emptied. - * @param jumpToEnd A boolean, indicating whether the currently-running animations should jump to their ends rather than just stopping midway. - */ - stop(clearQueue?: boolean, jumpToEnd?: boolean): Core; - - /** - * Remove all queued animations for the viewport. - * http://js.cytoscape.org/#cy.clearQueue - */ - clearQueue(): Core; - } - - /** - * http://js.cytoscape.org/#core/layout - */ - interface CoreLayout { - /** - * Run a layout, which algorithmically positions the nodes in the graph. - * For layouts included with Cytoscape.js, you can find their - * options documented in the Layouts section. - * For external layouts, please refer to their accompanying documentation. - * - * An analogue to run a layout on a subset of the graph exists as eles.layout(). - * http://js.cytoscape.org/#cy.layout - */ - layout(layout: LayoutOptions): Layouts; - /** - * Get a new layout, which can be used to algorithmically - * position the nodes in the graph. - * - * You must specify options.name with the name of the layout you wish to use. - * - * This function creates and returns a layout object. - * You may want to keep a reference to the layout for more advanced usecases, - * such as running multiple layouts simultaneously. - * Note that you must call layout.run() in order for it to affect the graph. - * An analogue to make a layout on a subset of the graph exists as eles.makeLayout(). - */ - makeLayout(options: LayoutOptions): Layouts; - createLayout(options: LayoutOptions): Layouts; - } - - /** - * Get the entry point to modify the visual style of the graph after initialisation. - * http://js.cytoscape.org/#core/style - */ - interface ElementStylesheetStyle extends StylesheetStyle { - json(): any; - } - interface ElementStylesheetCSS extends StylesheetCSS { - json(): any; - } - - interface CoreStyle { - /** - * Assign a new stylesheet to replace the existing one (if provided) - * and return the style. - */ - style(sheet?: Stylesheet | Stylesheet[] | string): Style; - } - - interface Style { - /** - * Add a rule to the stylesheet. - */ - append(style: string | Stylesheet | Stylesheet[]): this; - - /** - * Remove all styles, including default styles. - */ - clear(): this; - - /** - * Set the style from JSON data. - * @example - * style.fromJson([ - * { - * selector: 'node', - * style: { - * 'background-color': 'red' - * } - * } - * ]); - */ - fromJson(json: any): this; - - /** - * Set the style from a string. - * @example - * style.fromString('node { background-color: blue; }'); - */ - fromString(style: string): this; - - /** - * Resets to the default stylesheet. - */ - resetToDefault(): this; - - /** - * Sets the selector context for defining styles. - * @example - * style.selector('foo').style('color', 'black'); - */ - selector(s: string): this; - - /** - * Sets a style for the current selected selector. - * @example - * style.selector('foo').style('color', 'black'); - */ - style(key: string, value: string): this; - - /** - * Sets a style for the current selected selector. - * @example - * style.selector('foo').style({color: 'black'}); - */ - style(css: Css.Node | Css.Edge): this; - - /** - * Makes the changes active. - */ - update(): void; - } - - /** - * http://js.cytoscape.org/#cy.style - */ - type Stylesheet = StylesheetStyle | StylesheetCSS; - - interface StylesheetStyle { - selector: string; - style: Css.Node | Css.Edge | Css.Core; - } - - /** - * http://js.cytoscape.org/#cy.style - */ - interface StylesheetCSS { - selector: string; - css: Css.Node | Css.Edge | Css.Core; - } - - /** - * http://js.cytoscape.org/#core/export - */ - interface ExportOptions { - /** - * The background colour of the image (transparent by default). - */ - bg?: string | undefined; - /** - * Whether to export the current viewport view (false, default) or the entire graph (true). - */ - full?: boolean | undefined; - /** - * This value specifies a positive number that scales the size of the resultant image. - */ - scale?: number | undefined; - /** - * Specifies the scale automatically in combination with maxHeight such that the resultant image is no wider than maxWidth. - */ - maxWidth?: number | undefined; - /** - * Specifies the scale automatically in combination with maxWidth such that the resultant image is no taller than maxHeight. - */ - maxHeight?: number | undefined; - } - interface ExportStringOptions extends ExportOptions { - /** - * output Whether the output should be 'base64uri' (default), 'base64', or 'blob'. - */ - output?: "base64uri" | "base64" | undefined; - } - interface ExportBlobOptions extends ExportOptions { - /** - * output Whether the output should be 'base64uri' (default), 'base64', or 'blob'. - */ - output?: "blob" | undefined; - } - - interface ExportBlobPromiseOptions extends ExportOptions { - /** - * output Whether the output should be 'base64uri' (default), 'base64', 'blob', or 'blob-promise'. - */ - output?: "blob-promise" | undefined; - } - - interface ExportJpgOptions extends ExportOptions { - /** - * quality Specifies the quality of the image from 0 - * (low quality, low filesize) to 1 (high quality, high filesize). - * If not set, the browser's default quality value is used. - */ - quality?: number | undefined; - } - - interface ExportJpgStringOptions extends ExportJpgOptions, ExportStringOptions {} - - interface ExportJpgBlobOptions extends ExportJpgOptions, ExportBlobOptions {} - - interface ExportJpgBlobPromiseOptions extends ExportJpgOptions, ExportBlobPromiseOptions {} - - interface CoreExport { - /** - * Export the current graph view as a PNG image in Base64 representation. - */ - png(options?: ExportStringOptions): string; - png(options?: ExportBlobOptions): Blob; - png(options?: ExportBlobPromiseOptions): Promise; - - /** - * Export the current graph view as a JPG image in Base64 representation. - */ - jpg(options?: ExportJpgStringOptions): string; - jpg(options?: ExportJpgBlobOptions): Blob; - jpg(options?: ExportJpgBlobPromiseOptions): Promise; - - /** - * Export the current graph view as a JPG image in Base64 representation. - */ - jpeg(options?: ExportJpgStringOptions): string; - jpeg(options?: ExportJpgBlobOptions): Blob; - jpeg(options?: ExportJpgBlobPromiseOptions): Promise; - - /** - * Export the graph as JSON, the same format used at initialisation. - */ - json(): object; - json(json: object): this; - } - - /** - * eles --> Cy.Collection - * a collection of one or more elements (nodes and edges) - * - * The input can be any element (node and edge) collection. - * http://js.cytoscape.org/#collection - */ - interface Collection - extends - CollectionGraphManipulation, - CollectionEvents, - CollectionData, - CollectionPosition, - CollectionTraversing, - CollectionLayout, - CollectionSelection, - CollectionStyle, - CollectionAnimation, - CollectionComparision, - CollectionIteration, - CollectionBuildingFiltering, - CollectionAlgorithms - {} - - /** - * ele --> Cy.Singular - * a collection of a single element (node or edge) - * NB: every singular collection is a general collection too (but not vice versa)! - */ - interface Singular - extends - Collection, - SingularGraphManipulation, - SingularData, - SingularPosition, - SingularSelection, - SingularStyle, - SingularAnimation - {} - - interface ElementsDefinition { - nodes: NodeDefinition[]; - edges: EdgeDefinition[]; - } - - type EventHandler = (event: EventObject, ...extraParams: any) => void; - - /** - * The output is a collection of node and edge elements OR single element. - */ - type CollectionArgument = Collection | EdgeCollection | NodeCollection | SingularElementArgument; - type CollectionReturnValue = Collection & EdgeCollection & NodeCollection & SingularElementReturnValue; - - /** - * edges -> Cy.EdgeCollection - * a collection of one or more edges - * - * The output is a collection of edge elements OR single edge. - */ - interface EdgeCollection extends Collection, EdgeCollectionTraversing {} - /** - * nodes -> Cy.NodeCollection - * a collection of one or more nodes - * - * The output is a collection of node elements OR single node. - */ - interface NodeCollection - extends - Collection, - NodeCollectionMetadata, - NodeCollectionPosition, - NodeCollectionTraversing, - NodeCollectionCompound, - NodeCollectionLayout - {} - - type SingularElementArgument = EdgeSingular | NodeSingular; - type SingularElementReturnValue = EdgeSingular & NodeSingular; - /** - * edge --> Cy.EdgeSingular - * a collection of a single edge - */ - interface EdgeSingular - extends - Singular, - EdgeCollection, - EdgeSingularData, - EdgeSingularPoints, - EdgeSingularTraversing - {} - - /** - * node --> Cy.NodeSingular - * a collection of a single node - */ - interface NodeSingular - extends - Singular, - NodeCollection, - NodeSingularMetadata, - NodeSingularPosition, - NodeSingularCompound, - NodeSingularLayout - {} - - /** - * http://js.cytoscape.org/#collection/graph-manipulation - */ - interface CollectionGraphManipulation { - /** - * Remove the elements from the graph. - * http://js.cytoscape.org/#eles.remove - */ - remove(): CollectionReturnValue; - - /** - * Put removed elements back into the graph. - * http://js.cytoscape.org/#eles.restore - */ - restore(): CollectionReturnValue; - - /** - * Get a new collection containing clones (i.e. copies) of the elements in the calling collection. - * http://js.cytoscape.org/#eles.clone - */ - clone(): CollectionReturnValue; - /** - * Get a new collection containing clones (i.e. copies) of the elements in the calling collection. - * http://js.cytoscape.org/#eles.clone - */ - copy(): CollectionReturnValue; - - /** - * Effectively move edges to different nodes. The modified (actually new) elements are returned. - * http://js.cytoscape.org/#eles.move - */ - move(location: { source?: string | undefined; target?: string | undefined }): EdgeCollection; - /** - * Effectively move nodes to different parent node. The modified (actually new) elements are returned. - * http://js.cytoscape.org/#eles.move - */ - move(location: { parent: string | null }): NodeCollection; - } - - /** - * http://js.cytoscape.org/#collection/graph-manipulation - */ - interface SingularGraphManipulation { - /** - * Get the core instance that owns the element. - */ - cy(): Core; - /** - * Get whether the element has been removed from the graph. - * http://js.cytoscape.org/#ele.removed - */ - removed(): boolean; - /** - * Get whether the element is inside the graph (i.e. not removed). - * http://js.cytoscape.org/#ele.inside - */ - inside(): boolean; - } - - /** - * http://js.cytoscape.org/#collection/events - */ - interface CollectionEvents { - /** - * http://js.cytoscape.org/#eles.on - * @param events A space separated list of event names. - * @param selector [optional] A delegate selector to specify child elements for which the handler runs. - * @param handler The handler function called when one of the specified events occurs. Takes the event object as a parameter. - */ - on(events: EventNames, selector: string, handler: EventHandler): this; - on(events: EventNames, handler: EventHandler): this; - bind(events: EventNames, selector: string, handler: EventHandler): this; - bind(events: EventNames, handler: EventHandler): this; - listen(events: EventNames, selector: string, handler: EventHandler): this; - listen(events: EventNames, handler: EventHandler): this; - addListener(events: EventNames, selector: string, handler: EventHandler): this; - addListener(events: EventNames, handler: EventHandler): this; - - /** - * http://js.cytoscape.org/#eles.promiseOn - * @alias pon - */ - promiseOn(events: EventNames, selector?: string): Promise; - pon(events: EventNames, selector?: string): Promise; - - /** - * @param events A space separated list of event names. - * @param selector [optional] A delegate selector to specify child elements for which the handler is triggered. - * @param data [optional] A plain object which is passed to the handler in the event object argument. - * @param function(event) The handler function that is called when one of the specified events occurs. - * @param event The event object. - * http://js.cytoscape.org/#eles.one - */ - one(events: EventNames, selector: string, data: any, handler: EventHandler): this; - one(events: EventNames, selector: string, handler: EventHandler): this; - one(events: EventNames, handler: EventHandler): this; - /** - * http://js.cytoscape.org/#eles.once - */ - once(events: EventNames, selector: string, data: any, handler: EventHandler): this; - once(events: EventNames, selector: string, handler: EventHandler): this; - once(events: EventNames, handler: EventHandler): this; - /** - * http://js.cytoscape.org/#eles.off - * @alias unbind, unlisten, removeListener - */ - off(events: EventNames, selector?: string, handler?: EventHandler): this; - unbind(events: EventNames, selector?: string, handler?: EventHandler): this; - unlisten(events: EventNames, selector?: string, handler?: EventHandler): this; - removeListener(events: EventNames, selector?: string, handler?: EventHandler): this; - /** - * https://js.cytoscape.org/#eles.removeAllListeners - */ - removeAllListeners(): this; - /** - * http://js.cytoscape.org/#eles.trigger - * @alias emit - */ - trigger(events: EventNames, extra?: unknown[]): this; - emit(events: EventNames, extra?: unknown[]): this; - } - - /** - * http://js.cytoscape.org/#collection/data - * - * The following fields are immutable: - * id: The id field is used to uniquely identify an element in the graph. - * source & target : These fields define an edge's relationship to nodes, and this relationship can not be changed after creation. - * parent: The parent field defines the parent (compound) node. - */ - interface CollectionData { - /** - * Read and write developer-defined data associated with the elements - * http://js.cytoscape.org/#eles.data - */ - - /** - * Get a particular data field for the element. - * @param name The name of the field to get. - */ - data(name?: string): any; - /** - * Set a particular data field for the element. - * @param name The name of the field to set. - * @param value The value to set for the field. - */ - data(name: string, value: any): this; - /** - * Update multiple data fields at once via an object. - * @param obj The object containing name- value pairs to update data fields. - */ - data(obj: any): this; - /** - * Get a particular data field for the element. - * @param name The name of the field to get. - */ - attr(name?: string): any; - /** - * Set a particular data field for the element. - * @param name The name of the field to set. - * @param value The value to set for the field. - */ - attr(name: string, value: any): this; - /** - * Update multiple data fields at once via an object. - * @param obj The object containing name- value pairs to update data fields. - */ - attr(obj: any): this; - - /** - * Remove developer-defined data associated with the elements. - * http://js.cytoscape.org/#eles.removeData - * @param names A space-separated list of fields to delete. - */ - removeData(names?: string): CollectionReturnValue; - removeAttr(names?: string): CollectionReturnValue; - - /** - * Get an array of the plain JavaScript object - * representation of all elements in the collection. - */ - jsons(): string[]; - } - /** - * http://js.cytoscape.org/#collection/data - */ - interface SingularData { - /** - * Get or set the scratchpad at a particular namespace, - * where temporary or non-JSON data can be stored. - * Get scratchpad if one or no parameter provided. - * App-level scratchpad data should use namespaces - * prefixed with underscore, like '_foo'. - * http://js.cytoscape.org/#ele.scratch - * @param namespace A namespace string. - * @param value The value to set at the specified namespace. - */ - scratch(namespace?: string): Scratchpad; - scratch(namespace: string, value: any): this; - - /** - * Remove scratchpad data. - * You should remove scratchpad data only at your own namespaces. - * http://js.cytoscape.org/#ele.removeScratch - * @param namespace A namespace string. - */ - removeScratch(namespace: string): this; - - /** - * A shortcut to get the ID of an element. - * http://js.cytoscape.org/#ele.id - */ - id(): string; - - /** - * Get the element's plain JavaScript object representation. - * http://js.cytoscape.org/#ele.json - */ - json(): string; - - /** - * Get the group string that defines the type of the element. - * - * The group strings are 'nodes' for nodes and 'edges' for edges. - * In general, you should be using ele.isEdge() - * and ele.isNode() instead of ele.group(). - * http://js.cytoscape.org/#ele.group - */ - group(): ElementGroup; - - /** - * Get whether the element is a node. - * http://js.cytoscape.org/#ele.isNode - */ - isNode(): this is NodeSingular; - - /** - * Get whether the element is an edge. - * http://js.cytoscape.org/#ele.isEdge - */ - isEdge(): this is EdgeSingular; - } - /** - * http://js.cytoscape.org/#collection/data - */ - interface EdgeSingularData { - /** - * Get whether the edge is a loop (i.e. source same as target). - * http://js.cytoscape.org/#edge.isLoop - */ - isLoop(): boolean; - - /** - * Get whether the edge is simple (i.e. source different than target). - * http://js.cytoscape.org/#edge.isSimple - */ - isSimple(): boolean; - } - - /** - * http://js.cytoscape.org/#collection/metadata - */ - interface NodeSingularMetadata { - /** - * Get the degree of a node. - * @param includeLoops A boolean, indicating whether loops are to be included in degree calculations. - */ - degree(includeLoops: boolean): number; - /** - * Get the indegree of a node. - * @param includeLoops A boolean, indicating whether loops are to be included in degree calculations. - */ - indegree(includeLoops: boolean): number; - /** - * Get the outdegree of a node. - * @param includeLoops A boolean, indicating whether loops are to be included in degree calculations. - */ - outdegree(includeLoops: boolean): number; - } - - /** - * http://js.cytoscape.org/#collection/metadata - */ - interface NodeCollectionMetadata { - /** - * Get the total degree of a collection of nodes. - * @param includeLoops A boolean, indicating whether loops are to be included in degree calculations. - */ - totalDegree(includeLoops: boolean): number; - - /** - * Get the minimum degree of the nodes in the collection. - * @param includeLoops A boolean, indicating whether loops are to be included in degree calculations. - */ - minDegree(includeLoops: boolean): number; - - /** - * Get the maximum degree of the nodes in the collection. - * @param includeLoops A boolean, indicating whether loops are to be included in degree calculations. - */ - maxDegree(includeLoops: boolean): number; - - /** - * Get the minimum indegree of the nodes in the collection. - * @param includeLoops A boolean, indicating whether loops are to be included in degree calculations. - */ - minIndegree(includeLoops: boolean): number; - - /** - * Get the maximum indegree of the nodes in the collection. - * @param includeLoops A boolean, indicating whether loops are to be included in degree calculations. - */ - maxIndegree(includeLoops: boolean): number; - - /** - * Get the minimum outdegree of the nodes in the collection. - * @param includeLoops A boolean, indicating whether loops are to be included in degree calculations. - */ - minOutdegree(includeLoops: boolean): number; - - /** - * Get the maximum outdegree of the nodes in the collection. - * @param includeLoops A boolean, indicating whether loops are to be included in degree calculations. - */ - maxOutdegree(includeLoops: boolean): number; - } - - /** - * http://js.cytoscape.org/#collection/position--dimensions - */ - interface NodeSingularPosition { - /** - * Get the (model) position of a node. - */ - position(): Position; - /** - * Get the value of a specified position dimension. - * @param dimension The position dimension to set. - * @param value The value to set to the dimension. - */ - position(dimension: PositionDimension): number; - /** - * Set the value of a specified position dimension. - * @param dimension The position dimension to set. - * @param value The value to set to the dimension. - */ - position(dimension: PositionDimension, value: number): this; - /** - * Set the position using name-value pairs in the specified object. - * @param pos An object specifying name-value pairs representing dimensions to set. - */ - position(pos: Position): this; - /** - * Get the (model) position of a node. - */ - modelPosition(): Position; - /** - * Get the value of a specified position dimension. - * @param dimension The position dimension to set. - * @param value The value to set to the dimension. - */ - modelPosition(dimension: PositionDimension): number; - /** - * Set the value of a specified position dimension. - * @param dimension The position dimension to set. - * @param value The value to set to the dimension. - */ - modelPosition(dimension: PositionDimension, value: number): this; - /** - * Set the position using name-value pairs in the specified object. - * @param pos An object specifying name-value pairs representing dimensions to set. - */ - modelPosition(pos: Position): this; - /** - * Get the (model) position of a node. - */ - point(): Position; - /** - * Get the value of a specified position dimension. - * @param dimension The position dimension to set. - * @param value The value to set to the dimension. - */ - point(dimension: PositionDimension): number; - /** - * Set the value of a specified position dimension. - * @param dimension The position dimension to set. - * @param value The value to set to the dimension. - */ - point(dimension: PositionDimension, value: number): this; - /** - * Set the position using name-value pairs in the specified object. - * @param pos An object specifying name-value pairs representing dimensions to set. - */ - point(pos: Position): this; - - /** - * Get or set the rendered (on-screen) position of a node. - * http://js.cytoscape.org/#node.renderedPosition - */ - /** - * Get the value of a specified rendered position dimension. - * @param dimension The position dimension to get. - * @param value The value to set to the dimension. - * @param pos An object specifying name-value pairs representing dimensions to set. - */ - renderedPosition(dimension?: PositionDimension): Position; - renderedPosition(dimension: PositionDimension, value: Position): this; - renderedPosition(pos: { [name: string]: number }): this; - - /** - * Set the value of a specified rendered position dimension. - * @param dimension The position dimension to set. - * @param value The value to set to the dimension. - * @param pos An object specifying name-value pairs representing dimensions to set. - */ - renderedPoint(dimension?: PositionDimension): Position; - renderedPoint(dimension: PositionDimension, value: Position): this; - renderedPoint(pos: { [name: string]: number }): this; - - /** - * http://js.cytoscape.org/#node.relativePosition - */ - /** - * Get the value of a specified relative position dimension. - * @param dimension The position dimension to get. - * @param value The value to set to the dimension. - * @param pos An object specifying name-value pairs representing dimensions to set. - */ - relativePosition(dimension?: PositionDimension): Position; - relativePosition(dimension: PositionDimension, value: Position): this; - relativePosition(pos: { [name: string]: number }): this; - - /** - * Get the value of a specified relative position dimension. - * @param dimension The position dimension to get. - * @param value The value to set to the dimension. - * @param pos An object specifying name-value pairs representing dimensions to set. - */ - relativePoint(dimension?: PositionDimension): Position; - relativePoint(dimension: PositionDimension, value: Position): this; - relativePoint(pos: { [name: string]: number }): this; - - /** - * Get whether a node is currently grabbed, meaning the user has hold of the node. - * http://js.cytoscape.org/#node.grabbed - */ - grabbed(): boolean; - /** - * Get whether the user can grab a node. - * http://js.cytoscape.org/#node.grabbable - */ - grabbable(): boolean; - /** - * Get whether a node is locked, meaning that its position can not be changed. - * http://js.cytoscape.org/#node.locked - */ - locked(): boolean; - } - - /** - * @param ele The element being iterated over for which the function should return a position to set. - * @param ix The index of the element when iterating over the elements in the collection. - */ - type ElementPositionFunction = (ele: NodeSingular, ix: number) => Position; - type ElementCollectionFunction = (ele: NodeSingular, ix: number, eles: CollectionArgument) => Position; - - /** - * http://js.cytoscape.org/#collection/position--dimensions - */ - interface NodeCollectionPosition { - /** - * Shift the positions of the nodes by a given model position vector. - * @param dimension The position dimension to shift. - * @param value The value to shift the dimension. - */ - shift(dimension: PositionDimension, value?: number): this; - /** - * Shift the positions of the nodes by a given model position vector. - * @param pos An object specifying name-value pairs representing dimensions to shift. - */ - shift(pos: Position): this; - - /** - * Set the positions via a function. - * @param handler A callback function that returns the position to set for each element. - * @param pos An object specifying name-value pairs representing dimensions to set. - * http://js.cytoscape.org/#nodes.positions - */ - positions(handler: ElementPositionFunction | Position): this; - modelPositions(handler: ElementPositionFunction | Position): this; - points(handler: ElementPositionFunction | Position): this; - - /** - * Allow the user to grab the nodes. - * http://js.cytoscape.org/#nodes.grabify - */ - grabify(): this; - /** - * Disallow the user to grab the nodes. - * http://js.cytoscape.org/#nodes.ungrabify - */ - ungrabify(): this; - /** - * Lock the nodes such that their positions can not be changed. - * http://js.cytoscape.org/#nodes.lock - */ - lock(): this; - /** - * Unlock the nodes such that their positions can be changed. - * http://js.cytoscape.org/#nodes.unlock - */ - unlock(): this; - } - /** - * http://js.cytoscape.org/#collection/position--dimensions - */ - interface SingularPosition { - /** - * Get the width of the element. - */ - width(): number; - /** - * Get the outer width of the element (includes width, padding, & border). - */ - outerWidth(): number; - - /** - * Get the width of the element in rendered dimensions. - */ - renderedWidth(): number; - - /** - * Get the outer width of the element (includes width, padding, & border) in rendered dimensions. - */ - renderedOuterWidth(): number; - - /** - * Get the height of the element. - */ - height(): number; - /** - * Get the outer height of the element (includes height, padding, & border). - */ - outerHeight(): number; - /** - * Get the height of the element in rendered dimensions. - */ - renderedHeight(): number; - - /** - * Get the outer height of the element (includes height, padding, & border) in rendered dimensions. - */ - renderedOuterHeight(): number; - /** - * Gets whether the element is active (e.g. on user tap, grab, etc). - * http://js.cytoscape.org/#ele.active - */ - active(): boolean; - } - - interface BoundingBoxOptions { - /** A boolean indicating whether to include nodes in the bounding box (default true). */ - includeNodes?: boolean | undefined; - /** A boolean indicating whether to include edges in the bounding box (default true). */ - includeEdges?: boolean | undefined; - /** A boolean indicating whether to include labels in the bounding box (default true). */ - includeLabels?: boolean | undefined; - /** A boolean indicating whether to include main (node or edge) labels in the bounding box (default true). */ - includeMainLabels?: boolean | undefined; - /** A boolean indicating whether to include (edge) source-labels in the bounding box (default true). */ - includeSourceLabels?: boolean | undefined; - /** A boolean indicating whether to include (edge) target-labels in the bounding box (default true). */ - includeTargetLabels?: boolean | undefined; - /** A boolean indicating whether to include overlays (such as the one which appears when a node is clicked) in the bounding box (default true). */ - includeOverlays?: boolean | undefined; - } - /** - * http://js.cytoscape.org/#collection/position--dimensions - */ - interface CollectionPosition { - /** - * Get the bounding box of the elements in model coordinates. - * @param options An object containing options for the function. - * http://js.cytoscape.org/#eles.boundingBox - */ - boundingBox(options?: BoundingBoxOptions): BoundingBox12 & BoundingBoxWH; - boundingbox(options?: BoundingBoxOptions): BoundingBox12 & BoundingBoxWH; - /** - * Get the bounding box of the elements in rendered coordinates. - * @param options An object containing options for the function. - */ - renderedBoundingBox(options?: BoundingBoxOptions): BoundingBox12 & BoundingBoxWH; - renderedBoundingbox(options?: BoundingBoxOptions): BoundingBox12 & BoundingBoxWH; - } - - /** - * http://js.cytoscape.org/#collection/layout - */ - interface CollectionLayout { - /** - * Get a new layout, which can be used to algorithmically position the nodes in the collection. - * This function is useful for running a layout on a subset of the elements in the graph, perhaps in parallel to other layouts. - * - * You must specify options.name with the name of the layout you wish to use. - * - * Note: that you must call layout.run() in order for it to affect the graph. - * - * @param options The layout options. - */ - layout(options: LayoutOptions): Layouts; - makeLayout(options: LayoutOptions): Layouts; - createLayout(options: LayoutOptions): Layouts; - } - - /** - * http://js.cytoscape.org/#collection/layout - */ - interface LayoutPositionOptions { - // whether to animate changes to the layout - animate?: boolean | undefined; - // duration of animation in ms, if enabled - animationDuration?: number | undefined; - // easing of animation, if enabled - animationEasing?: Css.TransitionTimingFunction | undefined; - // collection of elements involved in the layout; set by cy.layout() or eles.layout(s) - eles: CollectionArgument; - // whether to fit the viewport to the graph - fit?: boolean | undefined; - // padding to leave between graph and viewport - padding?: number | undefined; - // pan the graph to the provided position, given as { x, y } - pan?: Position | undefined; - // callback for the layoutready event - ready?: undefined; - // callback for the layoutstop event - stop?: undefined; - // a positive value which adjusts spacing between nodes (>1 means greater than usual spacing) - spacingFactor?: number | undefined; - // zoom level as a positive number to set after animation - zoom?: number | undefined; - } - interface NodeCollectionLayout { - /** - * Position the nodes for a discrete/synchronous layout. - * http://js.cytoscape.org/#nodes.layoutPositions - * @param layout The layout. - * @param options The layout options object. - */ - layoutPositions(layout: string, options: LayoutPositionOptions, handler: ElementPositionFunction): void; - } - /** - * http://js.cytoscape.org/#collection/layout - */ - interface LayoutDimensionOptions { - // Boolean which changes whether label dimensions are included when calculating node dimensions - nodeDimensionsIncludeLabels: boolean; - } - - /** - * https://js.cytoscape.org/#node.layoutDimensions - */ - interface NodeSingularLayout { - /** - * Returns the node width and height. - * Meant for use in layout positioning to do overlap detection. - * @param options The layout options object. - */ - layoutDimensions(options: LayoutDimensionOptions): { w: number; h: number }; - } - - /** - * http://js.cytoscape.org/#collection/selection - */ - interface SingularSelection { - /** - * Get whether the element is selected. - * http://js.cytoscape.org/#ele.selected - */ - selected(): boolean; - - /** - * Get whether the element's selection state is mutable. - * http://js.cytoscape.org/#ele.selectable - */ - selectable(): boolean; - } - /** - * https://js.cytoscape.org/#collection/selection - */ - interface CollectionSelection { - /** - * Make the elements selected (NB other elements outside the collection are not affected). - * http://js.cytoscape.org/#eles.select - */ - select(): this; - /** - * Make the elements not selected (NB other elements outside the collection are not affected). - * http://js.cytoscape.org/#eles.unselect - */ - unselect(): this; - deselect(): this; - /** - * Make the selection states of the elements mutable. - * http://js.cytoscape.org/#eles.selectify - */ - selectify(): this; - /** - * Make the selection states of the elements immutable. - * http://js.cytoscape.org/#eles.unselectify - */ - unselectify(): this; - } - - /** - * http://js.cytoscape.org/#collection/style - */ - type ClassName = string; - /** A space-separated list of class names or an array */ - type ClassNames = string | ClassName[]; - - interface CollectionStyle { - /** - * Add classes to elements. - * http://js.cytoscape.org/#eles.addClass - * @param classes A space-separated list of class names to add to the elements. - */ - addClass(classes: ClassNames): this; - /** - * Remove classes from elements. - * @param classes A space-separated list of class names to remove from the elements. - * http://js.cytoscape.org/#eles.removeClass - */ - removeClass(classes: ClassNames): this; - /** - * Toggle whether the elements have the specified classes. - * @param classes A space-separated list of class names to toggle on the elements. - * @param toggle [optional] Instead of automatically toggling, adds the classes on truthy values or removes them on falsey values. - * http://js.cytoscape.org/#eles.toggleClass - */ - toggleClass(classes: ClassNames, toggle?: boolean): this; - /** - * Replace the current list of classes on the elements with the specified list. - * @param classes A space-separated list or array of class names that replaces the current class list. - * http://js.cytoscape.org/#eles.classes - * Note: can be used to clear all classes (empty string or array). - */ - classes(classes: ClassNames): this; - classes(classes: ClassNames | undefined): this | string[]; - classes(): string[]; - /** - * Add classes to the elements, and then remove the classes after a specified duration. - * @param classes A space-separated list of class names to flash on the elements. - * @param duration [optional] The duration in milliseconds that the classes should be added on the elements. After the duration, the classes are removed. - * http://js.cytoscape.org/#eles.flashClass - */ - flashClass(classes: ClassNames, duration?: number): this; - - /** - * Set a particular style property value. - * @param name The name of the visual style property to set. - * @param value The value to which the property is set. - */ - style(name: string, value: any): this; - /** - * Get a particular style property value. - * @param name The name of the visual style property to get. - */ - style(name: string): any; - /** - * Set several particular style property values. - * @param obj An object of style property name-value pairs to set. - */ - style(obj: object): this; - /** - * Get a name-value pair object containing visual style properties and their values for the element. - */ - style(): { [index: string]: any }; - /** - * Set a particular style property value. - * @param name The name of the visual style property to set. - * @param value The value to which the property is set. - */ - css(name: string, value: any): this; - /** - * Get a particular style property value. - * @param name The name of the visual style property to get. - */ - css(name: string): any; - /** - * Set several particular style property values. - * @param obj An object of style property name-value pairs to set. - */ - css(obj: object): this; - /** - * Get a name-value pair object containing visual style properties and their values for the element. - */ - css(): { [index: string]: any }; - /** - * Remove all or specific style overrides. - * @param names A space-separated list of property names to remove overrides - */ - removeStyle(names?: string): this; - } - - /** - * http://js.cytoscape.org/#collection/style - */ - interface SingularStyle { - /** - * Get whether an element has a particular class. - * @param className The name of the class to test for. - * http://js.cytoscape.org/#ele.hasClass - */ - hasClass(className: ClassName): boolean; - - /** - * Get a name-value pair object containing rendered visual - * style properties and their values for the element. - * @param name The name of the visual style property to get. - */ - renderedStyle(): { [name: string]: any }; - renderedStyle(name: string): any; - - renderedCss(): { [name: string]: any }; - renderedCss(name: string): any; - - /** - * Get the numeric value of a style property in - * preferred units that can be used for calculations. - * @param name The name of the style property to get. - * http://js.cytoscape.org/#ele.numericStyle - */ - numericStyle(name: string): any; - - /** - * Get the units that ele.numericStyle() is expressed in, for a particular property. - * @param name The name of the style property to get. - * http://js.cytoscape.org/#ele.numericStyleUnits - */ - numericStyleUnits(name: string): any; - /** - * Get whether the element is visible. - * http://js.cytoscape.org/#ele.visible - */ - visible(): boolean; - /** - * Get whether the element is hidden. - * http://js.cytoscape.org/#ele.visible - */ - hidden(): boolean; - /** - * Get the effective opacity of the element - * (i.e. on-screen opacity), - * which takes into consideration parent node opacity. - * http://js.cytoscape.org/#ele.effectiveOpacity - */ - effectiveOpacity(): number; - /** - * Get whether the element's effective opacity is completely transparent, - * which takes into consideration parent node opacity. - * http://js.cytoscape.org/#ele.transparent - */ - transparent(): number; - } - - /** - * http://js.cytoscape.org/#collection/animation - */ - interface ElementAnimateOptionsBase { - /** An object containing name-value pairs of style properties to animate. */ - style?: { [name: string]: any } | undefined; - /** The duration of the animation in milliseconds. */ - duration?: number | undefined; - /** A boolean indicating whether to queue the animation. */ - queue?: boolean | undefined; - /** A function to call when the animation is done. */ - complete?(): void; - /** A function to call each time the animation steps. */ - step?(): void; - /** A transition-timing-function easing style string that shapes the animation progress curve. */ - easing?: Css.TransitionTimingFunction | undefined; - } - interface ElementAnimateOptionPos extends ElementAnimateOptionsBase { - /** A position to which the elements will be animated. */ - position?: Position | undefined; - } - interface ElementAnimateOptionRen extends ElementAnimateOptionsBase { - /** A rendered position to which the elements will be animated. */ - renderedPosition?: Position | undefined; - } - interface CollectionAnimation { - /** - * Animate the elements. - * @param options An object containing the details of the animation. - * http://js.cytoscape.org/#eles.animate - */ - animate(options: ElementAnimateOptionPos | ElementAnimateOptionRen, params?: ElementAnimateOptionsBase): this; - /** - * Add a delay between animations for the elements. - * @param duration How long the delay should be in milliseconds. - * @param complete A function to call when the delay is complete. - * http://js.cytoscape.org/#eles.delay - */ - delay(duration: number, complete?: () => void): this; - /** - * Stop all animations that are currently running. - * @param clearQueue A boolean, indicating whether the queue of animations should be emptied. - * @param jumpToEnd A boolean, indicating whether the currently-running animations should jump to their ends rather than just stopping midway. - * http://js.cytoscape.org/#eles.stop - */ - stop(clearQueue?: boolean, jumpToEnd?: boolean): this; - /** - * Remove all queued animations for the elements. - * http://js.cytoscape.org/#eles.clearQueue - */ - clearQueue(): this; - } - interface SingularAnimationOptionsBase { - /** A position to which the elements will be animated. */ - position: Position; - /** A rendered position to which the elements will be animated. */ - renderedPosition: Position; - /** An object containing name-value pairs of style properties to animate. */ - style: any; - /** The duration of the animation in milliseconds. */ - duration: number; - /** A transition-timing-function easing style string that shapes the animation progress curve. */ - easing: Css.TransitionTimingFunction; - } - interface SingularAnimationOptionsPos extends SingularAnimationOptionsBase { - /** A position to which the elements will be animated. */ - position: Position; - } - interface SingularAnimationOptionsRen extends SingularAnimationOptionsBase { - /** A rendered position to which the elements will be animated. */ - renderedPosition: Position; - } - interface SingularAnimation { - /** - * Get whether the element is currently being animated. - */ - animated(): boolean; - /** - * Get an animation for the element. - * @param options An object containing the details of the animation. - */ - animation(options: SingularAnimationOptionsRen | SingularAnimationOptionsPos): AnimationManipulation; - - /** - * Get a delay animation for the element. - * @param duration How long the delay should be in milliseconds. - * http://js.cytoscape.org/#ele.delayAnimation - */ - delayAnimation(duration: number): AnimationManipulation; - } - - /** - * http://js.cytoscape.org/#collection/comparison - */ - interface CollectionComparision { - /** - * Determine whether this collection contains exactly the same elements as another collection. - * @param eles The other elements to compare to. - */ - same(eles: CollectionArgument): boolean; - - /** - * Determine whether this collection contains any of the same elements as another collection. - * @param eles The other elements to compare to. - */ - anySame(eles: CollectionArgument): boolean; - - /** - * Determine whether this collection contains all of the elements of another collection. - */ - contains(eles: CollectionArgument): boolean; - has(eles: CollectionArgument): boolean; - - /** - * Determine whether all elements in the specified collection are in the neighbourhood of the calling collection. - * @param eles The other elements to compare to. - */ - allAreNeighbors(eles: CollectionArgument): boolean; - allAreNeighbours(eles: CollectionArgument): boolean; - - /** - * Determine whether any element in this collection matches a selector. - * - * @param selector The selector to match against. - */ - is(selector: Selector): boolean; - - /** - * Determine whether all elements in the collection match a selector. - * @param selector The selector to match against. - */ - allAre(selector: Selector): boolean; - - /** - * Determine whether any element in this collection satisfies the specified test function. - * - * @param test The test function that returns truthy values for elements that satisfy the test and falsey values for elements that do not satisfy the test. - * ele - The current element. - * i - The index of the current element. - * eles - The collection of elements being tested. - * @param thisArg [optional] The value for this within the test function. - */ - some(test: (ele: CollectionArgument, i: number, eles: CollectionArgument) => boolean, thisArg?: any): boolean; - - /** - * Determine whether all elements in this collection satisfy the specified test function. - * - * @param test The test function that returns truthy values for elements that satisfy the test and falsey values for elements that do not satisfy the test. - * ele - The current element. - * i - The index of the current element. - * eles - The collection of elements being tested. - * @param thisArg [optional] The value for this within the test function. - */ - every(test: (ele: CollectionArgument, i: number, eles: CollectionArgument) => boolean, thisArg?: any): boolean; - } - - /** - * http://js.cytoscape.org/#collection/iteration - */ - interface CollectionIteration { - /** - * Get the number of elements in the collection. - */ - size(): number; - /** - * Get the number of elements in the collection. - */ - length: number; - - /** - * Get whether the collection is empty, meaning it has no elements. - */ - empty(): boolean; - /** - * Get whether the collection is nonempty, meaning it has elements. - */ - nonempty(): boolean; - - /** - * Iterate over the elements in the collection using an implementation like the native array function namesake. - * - * This function behaves like Array.prototype.forEach() with minor changes for convenience: - * You can exit the iteration early by returning false in the iterating function. - * The Array.prototype.forEach() implementation does not support this, but it is included anyway on account of its utility. - * - * @param each The function executed each iteration. - * ele - The current element. - * i - The index of the current element. - * eles - The collection of elements being iterated. - * @param thisArg [optional] The value for this within the iterating function. - */ - // eslint-disable-next-line @typescript-eslint/no-invalid-void-type - each(each: (ele: TIn, i: number, eles: this) => void | boolean, thisArg?: any): this; - // eslint-disable-next-line @typescript-eslint/no-invalid-void-type - forEach(each: (ele: TIn, i: number, eles: this) => void | boolean, thisArg?: any): this; - - /** - * Get an element at a particular index in the collection. - * - * You may use eles[i] in place of eles.eq(i) as a more performant alternative. - * - * @param index The index of the element to get. - */ - eq(index: number): TOut; - /** - * Get an element at a particular index in the collection. - * - * @param index The index of the element to get. - */ - [index: number]: TOut; - /** - * Get the first element in the collection. - */ - first(): TOut; - /** - * Get the last element in the collection. - */ - last(): TOut; - - /** - * Get a subset of the elements in the collection based on specified indices. - * - * @param start [optional] An integer that specifies where to start the selection. - * The first element has an index of 0. - * Use negative numbers to select from the end of an array. - * @param end [optional] An integer that specifies where to end the selection. - * If omitted, all elements from the start position and to the end of the array will be selected. - * Use negative numbers to select from the end of an array. - */ - slice(start?: number, end?: number): this; - - /** - * Get the collection as an array, maintaining the order of the elements. - */ - toArray(): TOut[]; - - [Symbol.iterator](): Iterator; - } - - /** - * http://js.cytoscape.org/#collection/building--filtering - */ - /** - * Get a new collection, resulting from adding the collection with another one - * - * @param eles The elements or array of elements to add or elements in the graph matching the selector. - * http://js.cytoscape.org/#eles.union - */ - type CollectionBuildingUnionFunc = ( - eles: CollectionArgument | CollectionArgument[] | Selector, - ) => CollectionReturnValue; - - /** - * Get a new collection, resulting from the collection without some specified elements. - * http://js.cytoscape.org/#eles.difference - * @param eles The elements that will not be in the resultant collection. - * Elements from the calling collection matching this selector will not be in the resultant collection. - */ - type CollectionBuildingDifferenceFunc = (eles: CollectionArgument | Selector) => CollectionReturnValue; - - /** - * Get the elements in both this collection and another specified collection. - * http://js.cytoscape.org/#eles.intersection - * @param eles The elements to intersect with. - * A selector representing the elements to intersect with. - * All elements in the graph matching the selector are used as the passed collection. - */ - type CollectionBuildingIntersectionFunc = (eles: CollectionArgument | Selector) => CollectionReturnValue; - - /** - * Get the elements that are in the calling collection or the passed collection but not in both. - * http://js.cytoscape.org/#eles.symmetricDifference - * @param eles The elements to apply the symmetric difference with. - * A selector representing the elements to apply the symmetric difference with. - * All elements in the graph matching the selector are used as the passed collection. - */ - type CollectionSymmetricDifferenceFunc = (eles: CollectionArgument | Selector) => CollectionReturnValue; - /** - * http://js.cytoscape.org/#collection/building--filtering - */ - interface CollectionBuildingFiltering { - /** - * Get an element in the collection from its ID in a very performant way. - * @param id The ID of the element to get. - */ - getElementById(id: string): TOut; - /** - * Get an element in the collection from its ID in a very performant way. - * @param id The ID of the element to get. - */ - $id(id: string): TOut; - - /** - * Get a new collection, resulting from adding the collection with another one - * http://js.cytoscape.org/#eles.union - */ - union: CollectionBuildingUnionFunc; - u: CollectionBuildingUnionFunc; - add: CollectionBuildingUnionFunc; - "+": CollectionBuildingUnionFunc; - or: CollectionBuildingUnionFunc; - "|": CollectionBuildingUnionFunc; - - /** - * Get a new collection, resulting from the collection without some specified elements. - * http://js.cytoscape.org/#eles.difference - */ - difference: CollectionBuildingDifferenceFunc; - subtract: CollectionBuildingDifferenceFunc; - "\\": CollectionBuildingDifferenceFunc; - not: CollectionBuildingDifferenceFunc; - "!": CollectionBuildingDifferenceFunc; - relativeComplement: CollectionBuildingDifferenceFunc; - "-": CollectionBuildingDifferenceFunc; - - /** - * Get all elements in the graph that are not in the calling collection. - * http://js.cytoscape.org/#eles.absoluteComplement - */ - absoluteComplement(): CollectionReturnValue; - abscomp(): CollectionReturnValue; - complement(): CollectionReturnValue; - - /** - * Get the elements in both this collection and another specified collection. - * http://js.cytoscape.org/#eles.intersection - */ - intersection: CollectionBuildingIntersectionFunc; - intersect: CollectionBuildingIntersectionFunc; - and: CollectionBuildingIntersectionFunc; - n: CollectionBuildingIntersectionFunc; - "&": CollectionBuildingIntersectionFunc; - ".": CollectionBuildingIntersectionFunc; - - /** - * Get the elements that are in the calling collection - * or the passed collection but not in both. - * http://js.cytoscape.org/#eles.symmetricDifference - */ - symmetricDifference: CollectionSymmetricDifferenceFunc; - symdiff: CollectionSymmetricDifferenceFunc; - xor: CollectionSymmetricDifferenceFunc; - "^": CollectionSymmetricDifferenceFunc; - "(+)": CollectionSymmetricDifferenceFunc; - "(-)": CollectionSymmetricDifferenceFunc; - - /** - * Perform a traditional left/right diff on the two collections. - * - * @param selector - * A selector representing the elements on the right side of the diff. All elements in the graph matching the selector are used as the passed collection. - * The elements on the right side of the diff. - * @return This function returns a plain object of the form { left, right, both } where - * left - is the set of elements only in the calling (i.e. left) collection, - * right - is the set of elements only in the passed (i.e. right) collection, and - * both - is the set of elements in both collections. - * http://js.cytoscape.org/#eles.diff - */ - diff(selector: Selector | CollectionArgument): { - left: CollectionReturnValue; - right: CollectionReturnValue; - both: CollectionReturnValue; - }; - - /** - * Perform a in-place merge of the given elements into the calling collection. - * @param eles The elements to merge in-place or a selector representing the elements to merge. - * All elements in the graph matching the selector are used as the passed collection. - * - * This function modifies the calling collection instead of returning a new one. - * Use of this function should be considered for performance in some cases, but otherwise should be avoided. Consider using eles.union() instead. - * Use this function only on new collections that you create yourself, using cy.collection(). - * This ensures that you do not unintentionally modify another collection. - * - * Examples - * With a collection: - * @example - * var col = cy.collection(); // new, empty collection - * var j = cy.$('#j'); - * var e = cy.$('#e'); - * col.merge( j ).merge( e ); - * - * With a selector: - * @example - * var col = cy.collection(); // new, empty collection - * col.merge('#j').merge('#e'); - */ - merge(eles: CollectionArgument | Selector): this; - /** - * Perform an in-place operation on the calling collection to remove the given elements. - * @param eles The elements to remove in-place or a selector representing the elements to remove . - * All elements in the graph matching the selector are used as the passed collection. - * - * This function modifies the calling collection instead of returning a new one. - * Use of this function should be considered for performance in some cases, but otherwise should be avoided. Consider using eles.filter() or eles.remove() instead. - * Use this function only on new collections that you create yourself, using cy.collection(). - * This ensures that you do not unintentionally modify another collection. - * - * Examples - * With a collection: - * @example - * var col = cy.collection(); // new, empty collection - * var e = cy.$('#e'); - * col.merge( cy.nodes() ); - * col.unmerge( e ); - * - * With a selector: - * @example - * var col = cy.collection(); // new, empty collection - * col.merge( cy.nodes() ); - * col.unmerge('#e'); - */ - unmerge(eles: CollectionArgument | Selector): this; - - /** - * Get a new collection containing elements that are accepted by the specified filter. - * - * @param selector The selector to match against. - * @param filter selector The filter function that returns true for elements to include. - * i - The index of the current element being considered. - * ele - The element being considered. - * http://js.cytoscape.org/#eles.filter - */ - filter( - selector: Selector | ((ele: TIn, i: number, eles: CollectionArgument) => boolean), - ): CollectionReturnValue; - /** - * Get the nodes that match the specified selector. - * - * @param selector The selector to match against. - * http://js.cytoscape.org/#eles.filter - */ - nodes(selector?: Selector): NodeCollection; - /** - * Get the edges that match the specified selector. - * - * @param selector The selector to match against. - * http://js.cytoscape.org/#eles.filter - */ - edges(selector?: Selector): EdgeCollection; - - /** - * Get a new collection containing the elements sorted by the - * specified comparison function. - * - * @param sort The sorting comparison function that returns a negative number - * for ele1 before ele2, 0 for ele1 same as ele2, - * or a positive number for ele1 after ele2. - * - * http://js.cytoscape.org/#eles.sort - */ - sort(sort: (ele1: TIn, ele2: TIn) => number): CollectionReturnValue; - - /** - * Get an array containing values mapped from the collection. - * - * @param fn The function that returns the mapped value for each element. - * ele - The current element. - * i - The index of the current element. - * eles - The collection of elements being mapped. - * @param thisArg [optional] The value for this within the iterating function. - * - * http://js.cytoscape.org/#eles.map - */ - map(fn: (ele: TIn, i: number, eles: CollectionArgument) => T, thisArg?: any): T[]; - - /** - * Reduce a single value by applying a - * function against an accumulator and each value of the collection. - * - * @param fn The function that returns the accumulated value - * given the previous value and the current element. - * prevVal The value accumulated from previous elements. - * ele The current element. - * i The index of the current element. - * eles The collection of elements being reduced. - * @param initialValue The initial value for reducing - * It is used also for type inference of output, but the type can be - * also stated explicitly as generic - * http://js.cytoscape.org/#eles.reduce - */ - reduce(fn: (prevVal: T, ele: TIn, i: number, eles: CollectionArgument) => T, initialValue: T): T; - - /** - * Find a minimum value in a collection. - * - * @param fn The function that returns the value to compare for each element. - * ele - The current element. - * i - The index of the current element. - * eles - The collection of elements being mapped. - * @param thisArg [optional] The value for this within the iterating function. - * - * http://js.cytoscape.org/#eles.min - */ - min( - fn: (ele: TIn, i: number, eles: CollectionArgument) => T, - thisArg?: any, - ): { - /** - * The minimum value found. - */ - value: T; - /** - * The element that corresponds to the minimum value. - */ - ele: SingularElementReturnValue; - }; - - /** - * Find a maximum value and the corresponding element. - * - * @param fn The function that returns the value to compare for each element. - * ele - The current element. - * i - The index of the current element. - * eles - The collection of elements being mapped. - * @param thisArg [optional] The value for this within the iterating function. - * - * http://js.cytoscape.org/#eles.max - */ - max( - fn: (ele: TIn, i: number, eles: CollectionArgument) => T, - thisArg?: any, - ): { - /** - * The minimum value found. - */ - value: T; - /** - * The element that corresponds to the minimum value. - */ - ele: SingularElementReturnValue; - }; - } - - /** - * http://js.cytoscape.org/#collection/traversing - */ - - type MinumumSpanningTree = any; - - interface CollectionTraversing { - // http://js.cytoscape.org/#collection/traversing - - /** - * Get the open neighbourhood of the elements. - * - * The neighbourhood returned by this function is a bit different than the traditional definition of a "neighbourhood": - * This returned neighbourhood includes the edges connecting the collection to the neighbourhood. This gives you more flexibility. - * An open neighbourhood is one that does not include the original set of elements. If unspecified, a neighbourhood is open by default. - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - neighborhood(selector?: Selector): CollectionReturnValue; - - /** - * Get the open neighbourhood of the elements. - * - * The neighbourhood returned by this function is a bit different than the traditional definition of a "neighbourhood": - * This returned neighbourhood includes the edges connecting the collection to the neighbourhood. This gives you more flexibility. - * An open neighbourhood is one that does not include the original set of elements. If unspecified, a neighbourhood is open by default. - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - openNeighborhood(selector?: Selector): CollectionReturnValue; - /** - * Get the closed neighbourhood of the elements. - * - * The neighbourhood returned by this function is a bit different than the traditional definition of a "neighbourhood": - * This returned neighbourhood includes the edges connecting the collection to the neighbourhood. This gives you more flexibility. - * A closed neighbourhood is one that does include the original set of elements. - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - closedNeighborhood(selector?: Selector): CollectionReturnValue; - - /** - * Get the connected components, considering only the elements in the calling collection. - * An array of collections is returned, with each collection representing a component. - */ - components(): CollectionReturnValue[]; - } - /** - * http://js.cytoscape.org/#collection/edge-points - */ - interface EdgeSingularPoints { - /** - * Get an array of control point model positions for a {@code curve-style: bezier) or {@code curve-style: unbundled-bezier} edge. - * - * While the control points may be specified relatively in the CSS, - * this function returns the absolute model positions of the control points. - * The points are specified in the order of source-to-target direction. - * This function works for bundled beziers, but it is not applicable to the middle, straight-line edge in the bundle. - */ - controlPoints(): Position[]; - /** - * Get an array of segment point model positions (i.e. bend points) for a {@code curve-style: segments} edge. - * - * While the segment points may be specified relatively in the stylesheet, - * this function returns the absolute model positions of the segment points. - * The points are specified in the order of source-to-target direction. - */ - segmentPoints(): Position[]; - /** - * Get the model position of where the edge ends, towards the source node. - */ - sourceEndpoint(): Position; - /** - * Get the model position of where the edge ends, towards the target node. - */ - targetEndpoint(): Position; - /** - * Get the model position of the midpoint of the edge. - * - * The midpoint is, by default, where the edge’s label is centred. It is also the position towards which mid arrows point. - * For curve-style: unbundled-bezier edges, the midpoint is the middle extremum if the number of control points is odd. - * For an even number of control points, the midpoint is where the two middle-most control points meet. - * This is the middle inflection point for bilaterally symmetric or skew symmetric edges, for example. - * For curve-style: segments edges, the midpoint is the middle segment point if the number of segment points is odd. - * For an even number of segment points, the overall midpoint is the midpoint of the middle-most line segment (i.e. the mean of the middle two segment points). - */ - midpoint(): Position; - } - interface EdgeSingularTraversing { - /** - * Get source node of this edge. - * @param selector An optional selector that is used to filter the resultant collection. - * http://js.cytoscape.org/#edge.source - */ - source(selector?: Selector): NodeSingular; - - /** - * Get target node of this edge. - * @param selector An optional selector that is used to filter the resultant collection. - * http://js.cytoscape.org/#edge.target - */ - target(selector?: Selector): NodeSingular; - } - interface EdgeCollectionTraversing { - // http://js.cytoscape.org/#collection/traversing - - /** - * Get the nodes connected to the edges in the collection - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - connectedNodes(selector?: Selector): NodeCollection; - - /** - * Get source nodes connected to the edges in the collection. - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - sources(selector?: Selector): NodeCollection; - - /** - * Get target nodes connected to the edges in the collection. - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - targets(selector?: Selector): NodeCollection; - - /** - * Get edges parallel to those in the collection. - * - * Two edges are said to be parallel if they connect the same two nodes. - * Any two parallel edges may connect nodes in the same direction, in which case the edges share the same source and target. - * They may alternatively connect nodes in the opposite direction, in which case the source and target are reversed in the second edge. - * That is: - * - edge1.source().id() === edge2.source().id() - * && edge1.target().id() === edge2.target().id() - * OR - * - edge1.source().id() === edge2.target().id() - * && edge1.target().id() === edge2.source().id() - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - parallelEdges(selector?: Selector): EdgeCollection; - - /** - * Get edges codirected to those in the collection. - * - * Two edges are said to be codirected if they connect the same two nodes in the same direction: The edges have the same source and target. - * That is: - * - edge1.source().id() === edge2.source().id() - * && edge1.target().id() === edge2.target().id() - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - codirectedEdges(selector?: Selector): EdgeCollection; - } - interface NodeCollectionTraversing { - // http://js.cytoscape.org/#collection/traversing - - /** - * Get the edges connecting the collection to another collection. Direction of the edges does not matter. - * - * @param eles The other collection. - * @param selector The other collection, specified as a selector which is matched against all elements in the graph. - */ - edgesWith(eles: CollectionArgument | Selector): EdgeCollection; - - /** - * Get the edges coming from the collection (i.e. the source) going to another collection (i.e. the target). - * - * @param eles The other collection. - * @param selector The other collection, specified as a selector which is matched against all elements in the graph. - */ - edgesTo(eles: CollectionArgument | Selector): EdgeCollection; - - /** - * Get the edges connected to the nodes in the collection. - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - connectedEdges(selector?: Selector): EdgeCollection; - - /** - * From the set of calling nodes, get the nodes which are roots (i.e. no incoming edges, as in a directed acyclic graph). - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - roots(selector?: Selector): NodeCollection; - - /** - * From the set of calling nodes, get the nodes which are leaves (i.e. no outgoing edges, as in a directed acyclic graph). - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - leaves(selector?: Selector): NodeCollection; - - /** - * Get edges (and their targets) coming out of the nodes in the collection. - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - outgoers(selector?: Selector): CollectionReturnValue; - - /** - * Recursively get edges (and their targets) coming out of the nodes in the collection (i.e. the outgoers, the outgoers' outgoers, ...). - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - successors(selector?: Selector): CollectionReturnValue; - - /** - * Get edges (and their sources) coming into the nodes in the collection. - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - incomers(selector?: Selector): CollectionReturnValue; - - /** - * Recursively get edges (and their sources) coming into the nodes in the collection (i.e. the incomers, the incomers' incomers, ...). - * - * @param selector [optional] An optional selector that is used to filter the resultant collection. - */ - predecessors(selector?: Selector): CollectionReturnValue; - } - - /** - * http://js.cytoscape.org/#collection/algorithms - */ - - type WeightFn = (edge: EdgeCollection) => number; - - /** - * The handler returns true when it finds the desired node, and it returns false to cancel the search. - * v - The current node. - * e - The edge connecting the previous node to the current node. - * u - The previous node. - * i - The index indicating this node is the ith visited node. - * depth - How many edge hops away this node is from the root nodes. - */ - type SearchVisitFunction = ( - v: NodeSingular, - e: EdgeSingular | undefined, - u: NodeSingular | undefined, - i: number, - depth: number, - // eslint-disable-next-line @typescript-eslint/no-invalid-void-type - ) => boolean | void; - interface SearchFirstOptionsBase { - /** - * A handler function that is called when a node is visited in the search. - */ - visit?: SearchVisitFunction | undefined; - /** - * A boolean indicating whether the algorithm should only go along edges from source to target (default false). - */ - directed?: boolean | undefined; - } - interface SearchFirstOptions1 extends SearchFirstOptionsBase { - /** - * The root nodes (selector or collection) to start the search from. - */ - root: Selector | CollectionArgument; - } - interface SearchFirstOptions2 extends SearchFirstOptionsBase { - /** - * The root nodes (selector or collection) to start the search from. - */ - roots: Selector | CollectionArgument; - } - type SearchFirstOptions = SearchFirstOptions1 | SearchFirstOptions2; - interface SearchFirstResult { - /** - * The path of the search. - * - The path returned includes edges such that if path[i] is a node, then path[i - 1] is the edge used to get to that node. - */ - path: CollectionArgument; - /** - * The node found by the search - * - If no node was found, then found is empty. - * - If your handler function returns false, then the only the path up to that point is returned. - */ - found: NodeCollection; - } - - /** - * http://js.cytoscape.org/#eles.dijkstra - */ - interface SearchDijkstraOptions { - /** - * The root node (selector or collection) where the algorithm starts. - */ - root: Selector | CollectionArgument; - - /** - * A function that returns the positive numeric weight for this edge. - * - * If no weight function is defined, a constant weight of 1 is used for each edge. - */ - weight?: WeightFn | undefined; - - /** - * A boolean indicating whether the algorithm should only go along edges from source to target (default false). - */ - directed?: boolean | undefined; - } - /** - * http://js.cytoscape.org/#eles.dijkstra - */ - interface SearchDijkstraResult { - /** - * Returns the distance from the source node to node. - */ - distanceTo(node: NodeSingular): number; - - /** - * Returns a collection containing the shortest path from the source node to node. - * The path starts with the source node and includes the edges between the nodes in the path such that if pathTo(node)[i] is an edge, - * then pathTo(node)[i-1] is the previous node in the path and pathTo(node)[i+1] is the next node in the path. - */ - pathTo(node: NodeSingular): CollectionReturnValue; - } - /** - * http://js.cytoscape.org/#eles.aStar - */ - interface SearchAStarOptions { - root: Selector | CollectionArgument; - goal: Selector | CollectionArgument; - weight?: WeightFn | undefined; - heuristic?(node: NodeCollection): number; - directed?: boolean | undefined; - } - /** - * http://js.cytoscape.org/#eles.aStar - */ - interface SearchAStarResult { - found: boolean; - distance: number; - path: CollectionReturnValue; - } - - /** - * http://js.cytoscape.org/#eles.floydWarshall - */ - interface SearchFloydWarshallOptions { - weight: WeightFn; - directed?: boolean | undefined; - } - - /** - * http://js.cytoscape.org/#eles.floydWarshall - */ - interface SearchFloydWarshallResult { - /** - * Returns the distance from the source node to node. - */ - distance(fromNode: NodeSingular | CollectionSelection, toNode: NodeSingular | Selector): number; - - /** - * Returns a collection containing the shortest path from the source node to node. - * The path starts with the source node and includes the edges - * between the nodes in the path such that if pathTo(node)[i] is an edge, - * then pathTo(node)[i-1] is the previous node in the path and pathTo(node)[i+1] - * is the next node in the path. - */ - path(fromNode: NodeSingular | CollectionSelection, toNode: NodeSingular | Selector): CollectionReturnValue; - } - - /** - * http://js.cytoscape.org/#eles.bellmanFord - */ - interface SearchBellmanFordOptions { - /** - * The root node (selector or collection) where the search starts. - */ - root: any; - /** - * A function that returns the positive numeric weight for this edge. - */ - weight?: WeightFn | undefined; - /** - * Indicating whether the algorithm should only go along - * edges from source to target (default false). - */ - directed: boolean; - /** - * Indicating whether the algorithm should find and return - * negative weight cycles (default true). - */ - findNegativeWeightCycles?: boolean | undefined; - } - /** - * http://js.cytoscape.org/#eles.bellmanFord - */ - interface SearchBellmanFordResult { - /** - * function that computes the shortest path from root node to the argument node - * (either objects or selector string) - */ - pathTo(node: NodeSingular | Selector): CollectionReturnValue; - - /** - * function that computes the shortest distance from root node to argument node - * (either objects or selector string) - */ - distanceTo(node: NodeSingular | Selector): number; - - /* true/false. If true, pathTo and distanceTo will be undefined */ - hasNegativeWeightCycle: boolean; - - /** - * array of collections corresponding to the negative weight cycles found - * (only populated if the findNegativeWeightCycles option is set to true) - */ - negativeWeightCycles: CollectionReturnValue[]; - } - - /** - * http://js.cytoscape.org/#eles.kruskal - * trivial so implemented in the function - */ - - /** - * http://js.cytoscape.org/#eles.pageRank - */ - interface SearchPageRankOptions { - /** Numeric parameter for the algorithm. */ - dampingFactor?: number | undefined; - /** Numeric parameter that represents the required precision. */ - precision?: number | undefined; - /** Maximum number of iterations to perform. */ - iterations?: number | undefined; - } - /** - * http://js.cytoscape.org/#eles.pageRank - */ - interface SearchPageRankResult { - /** function that computes the rank of a given node (either object or selector string) */ - rank(node: NodeCollection): number; - } - - /** - * http://js.cytoscape.org/#eles.degreeCentrality - */ - interface SearchDegreeCentralityOptions { - /** - * The root node (selector or collection) for which the - * centrality calculation is made. - */ - root: NodeSingular | Selector; - /** A function that returns the weight for the edge. */ - weight?(edge: EdgeSingular): number; - /** - * The alpha value for the centrality calculation, ranging on [0, 1]. - * With value 0 (default), disregards edge weights and solely uses - * number of edges in the centrality calculation. With value 1, - * disregards number of edges and solely uses the edge weights - * in the centrality calculation. - */ - alpha?: number | undefined; - /** - * Whether the directed indegree and outdegree centrality is calculated (true) or - * whether the undirected centrality is calculated (false, default). - */ - directed?: boolean | undefined; - } - /** - * http://js.cytoscape.org/#eles.degreeCentrality - */ - interface SearchDegreeCentralityResultUndirected { - /** the degree centrality of the root node */ - degree: number; - } - interface SearchDegreeCentralityResultDirected { - /* the indegree centrality of the root node */ - indegree: number; - /* the outdegree centrality of the root node */ - outdegree: number; - } - /** - * http://js.cytoscape.org/#eles.degreeCentralityNormalized - */ - interface SearchDegreeCentralityNormalizedOptions { - /** A function that returns the weight for the edge. */ - weight(edge: EdgeSingular): number; - /** - * The alpha value for the centrality calculation, ranging on [0, 1]. - * With value 0 (default), disregards edge weights and solely uses - * number of edges in the centrality calculation. With value 1, - * disregards number of edges and solely uses the edge weights - * in the centrality calculation. - */ - alpha?: number | undefined; - /** - * A boolean indicating whether the directed indegree and outdegree centrality is calculated (true) or - * whether the undirected centrality is calculated (false, default). - */ - directed?: boolean | undefined; - } - /** - * http://js.cytoscape.org/#eles.degreeCentralityNormalized - */ - interface SearchDegreeCentralityNormalizedResultUndirected { - /** the normalised degree centrality of the specified node */ - degree(node: NodeSingular): any; - } - interface SearchDegreeCentralityNormalizedResultDirected { - /** the normalised indegree centrality of the specified node */ - indegree(node: NodeSingular): any; - - /** the normalised outdegree centrality of the specified node */ - outdegree(node: NodeSingular): any; - } - /** - * http://js.cytoscape.org/#eles.closenessCentrality - */ - interface SearchClosenessCentralityOptions { - /** - * The root node (selector or collection) for which the - * centrality calculation is made. - */ - root: NodeSingular | Selector; - /** A function that returns the weight for the edge. */ - weight?(edge: EdgeSingular): number; - - /** - * A boolean indicating whether the directed indegree and outdegree centrality is calculated (true) or - * whether the undirected centrality is calculated (false, default). - */ - directed?: boolean | undefined; - /** - * A boolean indicating whether the algorithm calculates the - * harmonic mean (true, default) or the arithmetic mean (false) of distances. - * The harmonic mean is very useful for graphs that are not strongly connected. - */ - harmonic?: boolean | undefined; - } - /** - * http://js.cytoscape.org/#eles.closenessCentrality - * trivial - */ - - /** - * http://js.cytoscape.org/#eles.closenessCentralityNormalized - */ - interface SearchClosenessCentralityNormalizedOptions { - /** A function that returns the weight for the edge. */ - weight?(edge: EdgeSingular): number; - directed?: boolean | undefined; - /** - * A boolean indicating whether the algorithm calculates the - * harmonic mean (true, default) or the arithmetic mean (false) of distances. - * The harmonic mean is very useful for graphs that are not strongly connected. - */ - harmonic?: boolean | undefined; - } - /** - * http://js.cytoscape.org/#eles.closenessCentralityNormalized - */ - interface SearchClosenessCentralityNormalizedResult { - /** the normalised closeness centrality of the specified node */ - closeness(node: NodeSingular): any; - } - - /** - * http://js.cytoscape.org/#eles.betweennessCentrality - */ - interface SearchBetweennessOptions { - /** A function that returns the weight for the edge. */ - weight?(edge: EdgeSingular): number; - - /** - * A boolean indicating whether the directed indegree and outdegree centrality is calculated (true) or - * whether the undirected centrality is calculated (false, default). - */ - directed?: boolean | undefined; - } - /** - * http://js.cytoscape.org/#eles.betweennessCentrality - */ - interface SearchBetweennessResult { - /** returns the betweenness centrality of the specified node */ - betweenness(node: NodeSingular): number; - - /** returns the normalised betweenness centrality of the specified node */ - betweennessNormalized(node: NodeSingular): number; - betweennessNormalised(node: NodeSingular): number; - } - - /** - * http://js.cytoscape.org/#eles.closenessCentralityNormalized - */ - interface SearchClosenessCentralityNormalizedOptions { - /** A function that returns the weight for the edge. */ - weight?(edge: EdgeSingular): number; - directed?: boolean | undefined; - /** - * A boolean indicating whether the algorithm calculates the - * harmonic mean (true, default) or the arithmetic mean (false) of distances. - * The harmonic mean is very useful for graphs that are not strongly connected. - */ - harmonic?: boolean | undefined; - } - /** - * http://js.cytoscape.org/#eles.closenessCentralityNormalized - * trivial - */ - - interface CollectionAlgorithms { - /** - * Perform a breadth-first search within the elements in the collection. - * @param options - * http://js.cytoscape.org/#eles.breadthFirstSearch - * @alias bfs - */ - breadthFirstSearch(options: SearchFirstOptions): SearchFirstResult; - bfs(options: SearchFirstOptions): SearchFirstResult; - /** - * Perform a depth-first search within the elements in the collection. - * http://js.cytoscape.org/#eles.depthFirstSearch - * @alias dfs - */ - depthFirstSearch(options: SearchFirstOptions): SearchFirstResult; - dfs(options: SearchFirstOptions): SearchFirstResult; - - /** - * Perform Dijkstra's algorithm on the elements in the collection. - * This finds the shortest paths to all other nodes in the collection from the root node. - * http://js.cytoscape.org/#eles.dijkstra - */ - dijkstra(options: SearchDijkstraOptions): SearchDijkstraResult; - - /** - * Perform the A* search algorithm on the elements in the collection. - * This finds the shortest path from the root node to the goal node. - * http://js.cytoscape.org/#eles.aStar - */ - aStar(options: SearchAStarOptions): SearchAStarResult; - /** - * Perform the Floyd Warshall search algorithm on the elements in the collection. - * This finds the shortest path between all pairs of nodes. - * http://js.cytoscape.org/#eles.floydWarshall - */ - floydWarshall(options: SearchFloydWarshallOptions): SearchFloydWarshallResult; - /** - * Perform the Bellman-Ford search algorithm on the elements in the collection. - * This finds the shortest path from the starting node to all other nodes in the collection. - * http://js.cytoscape.org/#eles.bellmanFord - */ - bellmanFord(options: SearchBellmanFordOptions): SearchBellmanFordResult; - /** - * Perform Kruskal's algorithm on the elements in the collection, - * returning the minimum spanning tree, assuming undirected edges. - * http://js.cytoscape.org/#eles.kruskal - */ - kruskal(handler: (edge: EdgeCollection) => number): CollectionReturnValue; - /** - * Finds the minimum cut in a graph using the Karger-Stein algorithm. - * The optimal result is found with a high probability, but without guarantee. - * http://js.cytoscape.org/#eles.kargerStein - */ - kargerStein(): { - cut: EdgeCollection; - components: CollectionReturnValue; - partitionFirst: NodeCollection; - partitionSecond: NodeCollection; - }; - /** - * finds the biconnected components in an undirected graph, - * as well as their respective cut vertices, using an algorithm due to Hopcroft and Tarjan. - * http://js.cytoscape.org/#eles.hopcroftTarjanBiconnected - */ - hopcroftTarjanBiconnected(): { cut: NodeCollection; components: CollectionReturnValue }; - /** - * Finds the biconnected components in an undirected graph, - * as well as their respective cut vertices, using an algorithm due to Hopcroft and Tarjan. - * http://js.cytoscape.org/#eles.hopcroftTarjanBiconnected - */ - hopcroftTarjanBiconnectedComponents(): { cut: NodeCollection; components: CollectionReturnValue }; - /** - * Finds the biconnected components in an undirected graph, - * as well as their respective cut vertices, using an algorithm due to Hopcroft and Tarjan. - * http://js.cytoscape.org/#eles.hopcroftTarjanBiconnected - */ - htb(): { cut: NodeCollection; components: CollectionReturnValue }; - /** - * Finds the biconnected components in an undirected graph, - * as well as their respective cut vertices, using an algorithm due to Hopcroft and Tarjan. - * http://js.cytoscape.org/#eles.hopcroftTarjanBiconnected - */ - htbc(): { cut: NodeCollection; components: CollectionReturnValue }; - /** - * Finds the strongly connected components of a directed graph using Tarjan's algorithm. - * http://js.cytoscape.org/#eles.tarjanStronglyConnected - */ - tarjanStronglyConnected(): { cut: EdgeCollection; components: CollectionReturnValue }; - /** - * Finds the strongly connected components of a directed graph using Tarjan's algorithm. - * http://js.cytoscape.org/#eles.tarjanStronglyConnected - */ - tarjanStronglyConnectedComponents(): { cut: EdgeCollection; components: CollectionReturnValue }; - /** - * Finds the strongly connected components of a directed graph using Tarjan's algorithm. - * http://js.cytoscape.org/#eles.tarjanStronglyConnected - */ - tsc(): { cut: EdgeCollection; components: CollectionReturnValue }; - /** - * Finds the strongly connected components of a directed graph using Tarjan's algorithm. - * http://js.cytoscape.org/#eles.tarjanStronglyConnected - */ - tscc(): { cut: EdgeCollection; components: CollectionReturnValue }; - /** - * Rank the nodes in the collection using the Page Rank algorithm. - * http://js.cytoscape.org/#eles.pageRank - */ - pageRank(options: SearchPageRankOptions): SearchPageRankResult; - /** - * Considering only the elements in the calling collection, - * calculate the degree centrality of the specified root node. - * http://js.cytoscape.org/#eles.degreeCentrality - */ - degreeCentrality( - options: SearchDegreeCentralityOptions, - ): SearchDegreeCentralityResultDirected | SearchDegreeCentralityResultUndirected; - - /** - * Considering only the elements in the calling collection, - * calculate the normalised degree centrality of the nodes. - * http://js.cytoscape.org/#eles.degreeCentralityNormalized - */ - degreeCentralityNormalized( - options: SearchDegreeCentralityNormalizedOptions, - ): SearchDegreeCentralityNormalizedResultDirected | SearchDegreeCentralityNormalizedResultUndirected; - - /** - * Considering only the elements in the calling collection, - * calculate the closeness centrality of the specified root node. - * http://js.cytoscape.org/#eles.closenessCentrality - */ - closenessCentrality(options: SearchClosenessCentralityOptions): number; - /** - * Considering only the elements in the calling collection, - * calculate the closeness centrality of the nodes. - * http://js.cytoscape.org/#eles.closenessCentralityNormalized - */ - closenessCentralityNormalized( - options: SearchClosenessCentralityNormalizedOptions, - ): SearchClosenessCentralityNormalizedResult; - /** - * Considering only the elements in the calling collection, - * calculate the betweenness centrality of the nodes. - * http://js.cytoscape.org/#eles.betweennessCentrality - */ - betweennessCentrality(options: SearchBetweennessOptions): SearchBetweennessResult; - } - - /** - * http://js.cytoscape.org/#collection/compound-nodes - */ - interface NodeSingularCompound { - /** - * Get whether the node is a compound parent - * (i.e. a node containing one or more child nodes) - * http://js.cytoscape.org/#node.isParent - */ - isParent(): boolean; - /** - * Get whether the node is childless (i.e. a node with no child nodes) - * http://js.cytoscape.org/#node.isChildless - */ - isChildless(): boolean; - /** - * Get whether the node is a compound child (i.e. contained within a node) - * http://js.cytoscape.org/#node.isChild - */ - isChild(): boolean; - /** - * Get whether the node is an orphan (i.e. a node with no parent) - * http://js.cytoscape.org/#node.isOrphan - */ - isOrphan(): boolean; - } - /** - * http://js.cytoscape.org/#collection/compound-nodes - */ - interface NodeCollectionCompound { - /** - * Get the compound parent node of each node in the collection. - * @param selector A selector used to filter the resultant collection. - * http://js.cytoscape.org/#nodes.parent - */ - parent(selector?: Selector): NodeCollection; - /** - * Get all compound ancestor nodes - * (i.e. parents, parents' parents, etc.) of each node in the collection. - * @param selector A selector used to filter the resultant collection. - * http://js.cytoscape.org/#nodes.ancestors - */ - ancestors(selector?: Selector): NodeCollection; - parents(selector?: Selector): NodeCollection; - /** - * Get all compound ancestors common to all the nodes in the collection, - * starting with the closest and getting progressively farther. - * @param selector A selector used to filter the resultant collection. - * http://js.cytoscape.org/#nodes.commonAncestors - */ - commonAncestors(selector?: Selector): NodeCollection; - /** - * Get all orphan (i.e. has no compound parent) nodes in the calling collection. - * @param selector A selector used to filter the resultant collection. - * http://js.cytoscape.org/#nodes.orphans - */ - orphans(selector?: Selector): NodeCollection; - /** - * Get all nonorphan (i.e. has a compound parent) nodes in the calling collection. - * @param selector A selector used to filter the resultant collection. - * http://js.cytoscape.org/#nodes.nonorphans - */ - nonorphans(selector?: Selector): NodeCollection; - /** - * Get all compound child (i.e. direct descendant) nodes of each node in the collection. - * @param selector A selector used to filter the resultant collection. - * http://js.cytoscape.org/#nodes.children - */ - children(selector?: Selector): NodeCollection; - /** - * Get all compound descendant (i.e. children, children's children, etc.) - * nodes of each node in the collection. - * @param selector A selector used to filter the resultant collection. - * http://js.cytoscape.org/#nodes.descendants - */ - descendants(selector?: Selector): NodeCollection; - /** - * Get all sibling (i.e. same compound parent) - * nodes of each node in the collection. - * @param selector A selector used to filter the resultant collection. - * http://js.cytoscape.org/#nodes.siblings - */ - siblings(selector?: Selector): NodeCollection; - } - - /** - * A selector functions similar to a CSS selector on DOM elements, - * but selectors in Cytoscape.js instead work on - * collections of graph elements. - * Note that wherever a selector may be specified - * as the argument to a function, - * a eles.filter()-style filter function may be - * used in place of the selector. - * - * See http://js.cytoscape.org/#selectors for - * details about writing selectors. - * Selectors are an island grammar. - */ - type Selector = string; - - /** - * A space separated list of event names. - * http://js.cytoscape.org/#cy.promiseOn - */ - type EventNames = string; - - /** - * A string indicating the selection behaviour from user input. - * http://js.cytoscape.org/#core/initialisation - * - * 'additive' : a new selection made by the user adds to the set of currently selected elements. - * 'single' : a new selection made by the user becomes the entire set of currently - * selected elements (i.e. the previous elements are unselected) - */ - type SelectionType = "additive" | "single"; - - /** - * http://js.cytoscape.org/#ele.group - * http://js.cytoscape.org/#notation/elements-json - * - * 'nodes' - * 'edges' - */ - type ElementGroup = "nodes" | "edges"; - - /** - * 'x' : x coordinate - * 'y' : y coordinate - */ - type PositionDimension = "x" | "y"; - - /** - * Usually temp or nonserialisable data can be stored. - * http://js.cytoscape.org/#notation/elements-json - * http://js.cytoscape.org/#cy.scratch - * http://js.cytoscape.org/#ele.scratch - */ - type Scratchpad = any; - - /** - * Style in Cytoscape.js follows CSS conventions as closely as possible. - * In most cases, a property has the same name and behaviour as its corresponding CSS namesake. - * However, the properties in CSS are not sufficient to specify the style of some parts of the graph. - * In that case, additional properties are introduced that are unique to Cytoscape.js. - * - * For simplicity and ease of use, specificity rules are completely ignored in stylesheets. - * For a given style property for a given element, the last matching selector wins. - * - * http://js.cytoscape.org/#style - */ - namespace Css { - type Colour = string; - - /** - * In addition to specifying the value of a property outright, the developer may also use a mapper to dynamically specify the property value. - * - data() - * - mapData() - * - function( ele ){ ... } - * https://js.cytoscape.org/#style/mappers - */ - type MapperFunction = (ele: Element) => Type; - - type PropertyValue = - | Type - | MapperFunction; - type PropertyValueNode = PropertyValue; - type PropertyValueEdge = PropertyValue; - type PropertyValueCore = PropertyValue; - - /** - * The shape of the node’s body. - * Note that each shape fits within the specified width and height, - * and so you may have to adjust width and height - * if you desire an equilateral shape - * (i.e. width !== height for several equilateral shapes). - * 'polygon' is a custom polygon specified via shape-polygon-points. - */ - type NodeShape = - | "rectangle" - | "roundrectangle" - | "ellipse" - | "triangle" - | "pentagon" - | "hexagon" - | "heptagon" - | "octagon" - | "star" - | "barrel" - | "diamond" - | "vee" - | "rhomboid" - | "polygon" - | "tag" - | "round-rectangle" - | "round-triangle" - | "round-diamond" - | "round-pentagon" - | "round-hexagon" - | "round-heptagon" - | "round-octagon" - | "round-tag" - | "cut-rectangle" - | "bottom-round-rectangle" - | "concave-hexagon"; - - /** - * A space-separated list of numbers ranging on [-1, 1], - * representing alternating x and y values (i.e. x1 y1 x2 y2, x3 y3 ...). - * This represents the points in the polygon for the node’s shape. - * The bounding box of the node is given by (-1, -1), (1, -1), (1, 1), (-1, 1). - */ - type ShapePolygonPoints = string; - - /** - * The line style; may be solid, dotted, dashed, or double - */ - type LineStyle = "solid" | "dotted" | "dashed" | "double"; - - /** - * http://js.cytoscape.org/#style/node-body - */ - interface Node - extends - Partial, - PaddingNode, - Partial>, - BackgroundImage, - Partial, - Partial>, - Partial, - Partial>, - Partial - { - /** - * The CSS content field - */ - content?: PropertyValueNode | undefined; - /** - * The width of the node’s body. - * This property can take on the special value label - * so the width is automatically based on the node’s label. - */ - width?: PropertyValueNode | undefined; - /** - * The height of the node’s body. - * This property can take on the special value label - * so the height is automatically based on the node’s label. - */ - height?: PropertyValueNode | undefined; - /** - * The shape of the node’s body. - */ - shape?: PropertyValueNode | undefined; - "shape-polygon-points"?: PropertyValueNode | undefined; - backgroundColor?: PropertyValueNode | undefined; - /** - * The colour of the node’s body. - */ - "background-color"?: PropertyValueNode | undefined; - /** - * Blackens the node’s body for values from 0 to 1; - * whitens the node’s body for values from 0 to -1. - */ - "background-blacken"?: PropertyValueNode | undefined; - /** - * The opacity level of the node’s background colour. - */ - "background-opacity"?: PropertyValueNode | undefined; - /** - * The size of the node’s border. - */ - "border-width"?: PropertyValueNode | undefined; - /** - * The style of the node’s border. - */ - "border-style"?: PropertyValueNode | undefined; - /** - * The colour of the node’s border. - */ - "border-color"?: PropertyValueNode | undefined; - /** - * The opacity of the node’s border. - * A value between [0 1]. - */ - "border-opacity"?: PropertyValueNode | undefined; - /** - * The position of the node’s border. - * One of: center, inside, outside. - */ - "border-position"?: PropertyValueNode<"center" | "inside" | "outside"> | undefined; - /** - * The cap style of the node’s border. - * One of: butt, round, square. - */ - "border-cap"?: PropertyValueNode<"butt" | "round" | "square"> | undefined; - /** - * The join style of the node’s border. - * One of: miter, bevel, round. - */ - "border-join"?: PropertyValueNode<"miter" | "bevel" | "round"> | undefined; - /** - * The dashed line pattern which specifies alternating lengths of lines and gaps. (e.g. [6, 3]). - */ - "border-dash-pattern"?: PropertyValueNode | undefined; - /** - * The dashed line offset (e.g. 24). It is useful for creating edge animations. - */ - "border-dash-offset"?: PropertyValueNode | undefined; - } - - /** - * A padding defines an addition to a node’s dimension. - * For example, padding-left adds to a node’s outer (i.e. total) width. - * This can be used to add spacing around the label of width: label; height: label; nodes, - * or it can be used to add spacing between a compound node parent and its children. - */ - interface PaddingNode { - "padding-left"?: PropertyValueNode | undefined; - "padding-right"?: PropertyValueNode | undefined; - "padding-top"?: PropertyValueNode | undefined; - "padding-bottom"?: PropertyValueNode | undefined; - } - - interface Dictionary { - [key: string]: any; - } - - // export interface ElementCss extends CSSStyleDeclaration { } - /** - * A background image may be applied to a node’s body: - * - * http://js.cytoscape.org/#style/background-image - */ - interface BackgroundImage { - /** - * The URL that points to the image that should be used as the node’s background. - * PNG, JPG, and SVG are supported formats. - * You may use a data URI to use embedded images, - * thereby saving a HTTP request. - */ - "background-image"?: PropertyValueNode | PropertyValueNode | undefined; - /** - * All images are loaded with a crossorigin attribute which may be `anonymous` or - * `use-credentials`. - * - * The default is set to `anonymous`. - */ - "background-image-crossorigin"?: - | PropertyValueNode<"anonymous" | "use-credentials"> - | PropertyValueNode>; - /** - * The opacity of the background image. [0 1] - */ - "background-image-opacity"?: PropertyValueNode | PropertyValueNode | undefined; - /** - * Determines whether background image is smoothed (`yes`, default) or not (`no`). - * This is only a hint, and the browser may or may not respect the - * value set for this property. - */ - "background-image-smoothing"?: PropertyValueNode<"yes" | "no"> | PropertyValueNode>; - /** - * Determines whether background image is within (`inside`) - * or over top of the node (`over`). - * - * The default is set to `inside`. - */ - "background-image-containment"?: - | PropertyValueNode<"inside" | "over"> - | PropertyValueNode>; - /** - * Specifies the width of the image. - * A percent value (e.g. 50%) may be used to set - * the image width relative to the node width. - * If used in combination with background- fit, - * then this value overrides the width of the image - * in calculating the fitting — thereby overriding the aspect ratio. - * The auto value is used by default, which uses the width of the image. - */ - "background-width"?: - | PropertyValueNode - | PropertyValueNode> - | undefined; - /** - * Specifies the height of the image. - * A percent value (e.g. 50%) may be used to set the image - * height relative to the node height. - * If used in combination with background- fit, - * then this value overrides the height of the image in calculating - * the fitting — thereby overriding the aspect ratio. - * The auto value is used by default, which uses the height of the image. - */ - "background-height"?: - | PropertyValueNode - | PropertyValueNode> - | undefined; - /** - * How the background image is fit to the node; - * may be none for original size, - * contain to fit inside node, - * or cover to cover the node. - */ - "background-fit"?: - | PropertyValueNode<"none" | "contain" | "cover"> - | PropertyValueNode> - | undefined; - /** - * Whether to repeat the background image; - * may be no-repeat, repeat-x, repeat-y, or repeat. - */ - "background-repeat"?: - | PropertyValueNode<"no-repeat" | "repeat-x" | "repeat-y" | "repeat"> - | PropertyValueNode> - | undefined; - /** - * The x position of the background image, - * measured in percent(e.g. `'50%'`) or pixels (e.g. `'10px'`). - */ - "background-position-x"?: - | PropertyValueNode - | PropertyValueNode> - | undefined; - /** - * The y position of the background image, - * measured in percent(e.g. `'50%'`) or pixels (e.g. `'10px'`). - */ - "background-position-y"?: - | PropertyValueNode - | PropertyValueNode> - | undefined; - /** - * The x offset of the background image, - * measured in percent(e.g. `'50%'`) or pixels (e.g. `'10px'`). - */ - "background-offset-x"?: PropertyValueNode | PropertyValueNode>; - /** - * The y offset of the background image, - * measured in percent(e.g. `'50%'`) or pixels (e.g. `'10px'`). - */ - "background-offset-y"?: PropertyValueNode | PropertyValueNode>; - /** - * Changes whether the width is calculated relative to the width of the node or - * the width in addition to the padding; may be inner or include-padding. - * - * If not specified, include-padding is used by default. - */ - "background-width-relative-to"?: - | PropertyValueNode<"inner" | "include-padding"> - | PropertyValueNode>; - /** - * Changes whether the height is calculated relative to the height of the node or - * the height in addition to the padding; may be `inner` or `include-padding`. - * - * If not specified, `include-padding` is used by default. - */ - "background-height-relative-to"?: - | PropertyValueNode<"inner" | "include-padding"> - | PropertyValueNode>; - /** - * How background image clipping is handled; - * may be node for clipped to node shape or none for no clipping. - */ - "background-clip"?: - | PropertyValueNode<"node" | "none"> - | PropertyValueNode> - | undefined; - /** - * Specifies a padding size (e.g. 20) that expands the bounding box of the node in - * all directions. This allows for images to be drawn outside of the normal bounding - * box of the node when `background-clip` is none. This is useful for small decorations - * just outside of the node. - * - * `bounds-expansions` accepts 1 value (for all directions), - * 2 values, ([topAndBottom, leftAndRight]) or 4 values ([top, right, bottom, left]). - */ - "bounds-expansion"?: PropertyValueNode< - | number - | string - | [number | string, number | string] - | [number | string, number | string, number | string, number | string] - >; - } - - /** - * The ghost properties allow for creating a ghosting effect, a semitransparent duplicate of the element drawn at an offset. - * https://js.cytoscape.org/#style/ghost - */ - interface Ghost { - /** - * Whether to use the ghost effect; may be yes or no. - */ - ghost: PropertyValueNode<"yes" | "no">; - /** - * The horizontal offset used to position the ghost effect. - */ - "ghost-offset-x": PropertyValueNode; - /** - * The vertical offset used to position the ghost effect. - */ - "ghost-offset-y": PropertyValueNode; - /** - * The opacity of the ghost effect. - */ - "ghost-opacity": PropertyValueNode; - } - - /** - * These properties allow you to create pie chart backgrounds on nodes. - * Note that 16 slices maximum are supported per node, - * so in the properties 1 <= i <= 16. - * Of course, you must specify a numerical value for each property in place of i. - * Each nonzero sized slice is placed in order of i, - * starting from the 12 o’clock position and working clockwise. - * - * You may find it useful to reserve a number to a particular - * colour for all nodes in your stylesheet. - * Then you can specify values for pie-i-background-size - * accordingly for each node via a mapper. - * This would allow you to create consistently coloured - * pie charts in each node of the graph based on element data. - * - * http://js.cytoscape.org/#style/pie-chart-background - */ - interface PieChartBackground { - /** - * @deprecated - * - * The diameter of the pie, measured as a percent of node size (e.g. 100%) or an absolute length (e.g. 25px). - */ - "pie-size": PropertyValueNode; - /** - * @deprecated - * - * The colour of the node’s ith pie chart slice. - */ - "pie-i-background-color": PropertyValueNode; - /** - * @deprecated - * - * The size of the node’s ith pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-i-background-size": PropertyValueNode; - /** - * @deprecated - * - * The opacity of the node’s ith pie chart slice. - */ - "pie-i-background-opacity": PropertyValueNode; - - /** - * The colour of the node’s 1st pie chart slice. - */ - "pie-1-background-color": PropertyValueNode; - /** - * The size of the node’s 1st pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-1-background-size": PropertyValueNode; - /** - * The opacity of the node’s 1st pie chart slice. - */ - "pie-1-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 2nd pie chart slice. - */ - "pie-2-background-color": PropertyValueNode; - /** - * The size of the node’s 2nd pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-2-background-size": PropertyValueNode; - /** - * The opacity of the node’s 2nd pie chart slice. - */ - "pie-2-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 3rd pie chart slice. - */ - "pie-3-background-color": PropertyValueNode; - /** - * The size of the node’s 3rd pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-3-background-size": PropertyValueNode; - /** - * The opacity of the node’s 3rd pie chart slice. - */ - "pie-3-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 4th pie chart slice. - */ - "pie-4-background-color": PropertyValueNode; - /** - * The size of the node’s 4th pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-4-background-size": PropertyValueNode; - /** - * The opacity of the node’s 4th pie chart slice. - */ - "pie-4-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 5th pie chart slice. - */ - "pie-5-background-color": PropertyValueNode; - /** - * The size of the node’s 5th pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-5-background-size": PropertyValueNode; - /** - * The opacity of the node’s 5th pie chart slice. - */ - "pie-5-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 6th pie chart slice. - */ - "pie-6-background-color": PropertyValueNode; - /** - * The size of the node’s 6th pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-6-background-size": PropertyValueNode; - /** - * The opacity of the node’s 6th pie chart slice. - */ - "pie-6-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 7th pie chart slice. - */ - "pie-7-background-color": PropertyValueNode; - /** - * The size of the node’s 7th pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-7-background-size": PropertyValueNode; - /** - * The opacity of the node’s 7th pie chart slice. - */ - "pie-7-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 8th pie chart slice. - */ - "pie-8-background-color": PropertyValueNode; - /** - * The size of the node’s 8th pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-8-background-size": PropertyValueNode; - /** - * The opacity of the node’s 8th pie chart slice. - */ - "pie-8-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 9th pie chart slice. - */ - "pie-9-background-color": PropertyValueNode; - /** - * The size of the node’s 9th pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-9-background-size": PropertyValueNode; - /** - * The opacity of the node’s 9th pie chart slice. - */ - "pie-9-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 10th pie chart slice. - */ - "pie-10-background-color": PropertyValueNode; - /** - * The size of the node’s 10th pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-10-background-size": PropertyValueNode; - /** - * The opacity of the node’s 10th pie chart slice. - */ - "pie-10-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 11th pie chart slice. - */ - "pie-11-background-color": PropertyValueNode; - /** - * The size of the node’s 11th pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-11-background-size": PropertyValueNode; - /** - * The opacity of the node’s 11th pie chart slice. - */ - "pie-11-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 12th pie chart slice. - */ - "pie-12-background-color": PropertyValueNode; - /** - * The size of the node’s 12th pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-12-background-size": PropertyValueNode; - /** - * The opacity of the node’s 12th pie chart slice. - */ - "pie-12-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 13th pie chart slice. - */ - "pie-13-background-color": PropertyValueNode; - /** - * The size of the node’s 13th pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-13-background-size": PropertyValueNode; - /** - * The opacity of the node’s 13th pie chart slice. - */ - "pie-13-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 14th pie chart slice. - */ - "pie-14-background-color": PropertyValueNode; - /** - * The size of the node’s 14th pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-14-background-size": PropertyValueNode; - /** - * The opacity of the node’s 14th pie chart slice. - */ - "pie-14-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 15th pie chart slice. - */ - "pie-15-background-color": PropertyValueNode; - /** - * The size of the node’s 15th pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-15-background-size": PropertyValueNode; - /** - * The opacity of the node’s 15th pie chart slice. - */ - "pie-15-background-opacity": PropertyValueNode; - /** - * The colour of the node’s 16th pie chart slice. - */ - "pie-16-background-color": PropertyValueNode; - /** - * The size of the node’s 16th pie chart slice, measured in percent (e.g. 25% or 25). - */ - "pie-16-background-size": PropertyValueNode; - /** - * The opacity of the node’s 16th pie chart slice. - */ - "pie-16-background-opacity": PropertyValueNode; - } - - interface Edge - extends - EdgeLine, - EdgeArrow, - Partial, - Partial, - Partial, - Partial, - Partial, - Partial, - Partial, - Partial, - Partial>, - Partial>, - Partial>, - Partial>, - Partial - {} - - /** - * These properties affect the styling of an edge’s line: - * - * http://js.cytoscape.org/#style/edge-line - */ - interface EdgeLine { - /** - * The width of an edge’s line. - */ - width?: PropertyValueEdge | undefined; - /** - * The curving method used to separate two or more edges between two nodes; - * may be - * - haystack (default, very fast, bundled straight edges for which loops and compounds are unsupported), - * - bezier(bundled curved edges), - * - unbundled - bezier(curved edges for use with manual control points), or - * - segments (a series of straight lines). - * Note that haystack edges work best with ellipse, rectangle, or similar nodes. - * Smaller node shapes, like triangle, will not be as aesthetically pleasing. - * Also note that edge arrows are unsupported for haystack edges. - */ - "curve-style"?: - | PropertyValueEdge<"haystack" | "straight" | "bezier" | "unbundled-bezier" | "segments" | "taxi"> - | undefined; - /** - * The colour of the edge’s line. - */ - "line-color"?: PropertyValueEdge | undefined; - /** - * The style of the edge’s line. - */ - "line-style"?: PropertyValueEdge | undefined; - /** - * The cap of the edge's line. - */ - "line-cap"?: PropertyValueEdge<"butt" | "round" | "square"> | undefined; - /** - * The filling style of the edge's line. - */ - "line-fill"?: PropertyValueEdge<"solid" | "linear-gradient" | "radial-gradient"> | undefined; - /** - * The opacity of the edge’s line and arrow. Useful if you wish to have a separate opacity for the edge - * label versus the edge line. Note that the opacity value of the edge element affects the effective - * opacity of its line and label subcomponents. - * - * Value between `0` and `1` inclusive. - */ - "line-opacity"?: PropertyValueEdge; - /** - * The dashed line pattern which specifies alternating lengths of lines and gaps. - */ - "line-dash-pattern"?: Array> | undefined; - /** - * The dashed line offset. - */ - "line-dash-offset"?: PropertyValueEdge | undefined; - /** - * The width of the edge’s outline. - */ - "line-outline-width"?: PropertyValueEdge | undefined; - /** - * The colour of the edge’s outline. - */ - "line-outline-color"?: PropertyValueEdge | undefined; - /** - * The distance the edge ends from its target. - */ - "target-distance-from-node"?: PropertyValueEdge | undefined; - /** - * The distance the edge ends from its source. - */ - "source-distance-from-node"?: PropertyValueEdge | undefined; - } - - /** - * These properties specify the gradient colouration of an edge's line: - * - * https://js.cytoscape.org/#style/gradient - */ - interface Gradient { - /** - * The colors of the gradient stops. - */ - "line-gradient-stop-colors"?: Array> | undefined; - /** - * The positions of the gradient stops. - * If not specified (or invalid), the stops will divide equally. - */ - "line-gradient-stop-positions"?: Array> | undefined; - } - - /** - * For automatic, bundled bezier edges (curve - style: bezier): - * - * http://js.cytoscape.org/#style/bezier-edges - */ - interface BezierEdges { - /** - * From the line perpendicular from source to target, - * this value specifies the distance between successive bezier edges. - */ - "control-point-step-size": PropertyValueEdge; - /** - * A single value that overrides "control-point-step-size" with a manual value. - * Because it overrides the step size, bezier edges with the same value will overlap. - * Thus, it’s best to use this as a one- off value for particular edges if need be. - */ - "control-point-distance": PropertyValueEdge; - /** - * A single value that weights control points along the line from source to target. - * The value usually ranges on [0, 1], with - * 0 towards the source node and - * 1 towards the target node — - * but larger or smaller values can also be used. - */ - "control-point-weight": PropertyValueEdge; - /** - * With value intersection (default), - * the line from source to target for "control-point-weight" is - * from the outside of the source node’s shape to the outside of - * the target node’s shape.With value node- position, - * the line is from the source position to the target position. - * The "node-position" option makes calculating edge points easier - * — but it should be used carefully because you can create invalid - * points that intersection would have automatically corrected. - */ - "edge-distances": PropertyValueEdge<"intersection" | "node-position">; - } - /** - * Loop edges - * For loops (i.e. same source and target) - * - * https://js.cytoscape.org/#style/loop-edges - */ - interface LoopEdges { - /** - * Determines the angle that loops extend from the node in cases when the source and - * target node of an edge is the same. The angle is specified from the 12 o’clock - * position and it progresses clockwise for increasing positive values. - * The default is `-45deg` (extending to the upper left). - */ - "loop-direction": PropertyValueEdge; - /** - * Determines the angle between the leaving and returning edges in loops. Positive - * values result in clockwise looping and negative values result in counter-clockwise - * looping. Default is `-90deg`. - */ - "loop-sweep": PropertyValueEdge; - } - /** - * Unbundled bezier edges - * For bezier edges with manual control points (curve - style: unbundled - bezier): - * - * http://js.cytoscape.org/#style/unbundled-bezier-edges - */ - interface UnbundledBezierEdges { - /** - * A series of values that specify for each control point the - * distance perpendicular to a line formed - * from source to target, e.g. -20 20 - 20. - */ - "control-point-distances": PropertyValueEdge; - /** - * A series of values that weights control points along - * a line from source to target, e.g. 0.25 0.5 0.75. - * A value usually ranges on [0, 1], with - * 0 towards the source node and - * 1 towards the target node - * — but larger or smaller values can also be used. - */ - "control-point-weights": PropertyValueEdge; - /** - * With value intersection (default), - * the line from source to target for "control-point-weights" - * is from the outside of the source node’s shape to the - * outside of the target node’s shape. - * With value - * "node-position", the line is from the source position to the target position. - * The "node-position" option makes calculating edge points easier - * — but it should be used carefully because you can create - * invalid points that intersection would have automatically corrected. - */ - "edge-distances": PropertyValueEdge<"intersection" | "node-position">; - } - /** - * Haystack edges - * Loop edges and compound parent nodes are not supported by haystack edges. - * Haystack edges are a more performant replacement for plain, straight line edges. - * - * For fast, straight line edges (curve - style: haystack): - * http://js.cytoscape.org/#style/haystack-edges - */ - interface HaystackEdges { - /** - * A value between 0 and 1 inclusive that indicates the relative radius used to position haystack edges on their connected nodes. - * The outside of the node is at 1, and the centre of the node is at 0. - */ - "haystack-radius": PropertyValueEdge; - } - /** - * Segments edges - * For edges made of several straight lines (curve - style: segments): - * http://js.cytoscape.org/#style/segments-edges - */ - interface SegmentsEdges { - /** - * A series of values that specify for each segment point the distance perpendicular to a line formed from source to target, e.g. -20 20 - 20. - */ - "segment-distances": PropertyValueEdge; - /** - * A series of values that weights segment points along a line from source to target, - * e.g. 0.25 0.5 0.75.A value usually ranges on [0, 1], - * with 0 towards the source node and 1 towards the target node — but larger or smaller values can also be used. - */ - "segment-weights": PropertyValueEdge; - /** - * With value - * * "intersection" (default), the line from source to target - * * for "segment-weights" is from the outside of the source node’s shape to the outside of the target node’s shape. - * * With value "node-position", the line is from the source position to the target position. - * The "node-position" option makes calculating edge points easier - * — but it should be used carefully because you can create - * invalid points that intersection would have automatically corrected. - */ - "edge-distances": PropertyValueEdge<"intersection" | "node-position">; - } - /** - * Taxi edges - * For hierarchical, bundled edges (curve-style: taxi) - * - * https://js.cytoscape.org/#style/taxi-edges - */ - interface TaxiEdges { - /** - * The main direction of the edge, the direction starting out from the source node; may be one of: - * * `auto`: Automatically use `vertical` or `horizontal`, based on whether the vertical or horizontal distance is largest. - * * `vertical`: Automatically use `downward` or `upward`, based on the vertical direction from source to target. - * * `downward`: Bundle outgoers downwards. - * * `upward`: Bundle outgoers upwards. - * * `horizontal`: Automatically use `righward` or `leftward`, based on the horizontal direction from source to target. - * * `rightward`: Bundle outgoers righwards. - * * `leftward`: Bundle outgoers leftwards. - */ - "taxi-direction": PropertyValueEdge< - "auto" | "vertical" | "downward" | "upward" | "horizontal" | "rightward" | "leftward" - >; - /** - * The distance along the primary axis where the first turn is applied. - * * This value may be an absolute distance (e.g. `'20px'`) or it may be a relative distance - * between the source and target (e.g. `'50%'`). - * * A negative value may be specified to indicate a distance in the oppostite, target to - * source direction (e.g. `'-20px'`). - * * Note that bundling may not work with an explicit direction (upward, downward, leftward, or rightward) - * in tandem with a turn distance specified in percent units. - */ - "taxi-turn": PropertyValueEdge; - /** - * The minimum distance along the primary axis that is maintained between the nodes and the turns. - * * This value only takes on absolute values (e.g. `'5px'`). - * * This property makes the taxi edge be re-routed when the turns would be otherwise too close to - * the source or target. As such, it also helps to avoid turns overlapping edge endpoint arrows. - */ - "taxi-turn-min-distance": PropertyValueEdge; - /** - * With value `intersection` (default), the `distances` (`taxi-turn` and `taxi-turn-min-distance`) - * are considered from the outside of the source’s bounds to the outside of the target’s bounds. - * With value `node-position`, the distances are considered from the source position to the target position. - * The `node-position` option makes calculating edge points easier — but it should be used carefully because - * you can create invalid points that `intersection` would have automatically corrected. - */ - "edge-distances": PropertyValueEdge<"intersection" | "node-position">; - } - - type ArrowShape = - | "tee" - | "vee" - | "triangle" - | "triangle-tee" - | "circle-triangle" - | "triangle-cross" - | "triangle-backcurve" - | "square" - | "circle" - | "diamond" - | "chevron" - | "none"; - - type ArrowFill = "filled" | "hollow"; - - /** - * Edge arrow - * * -arrow-color : The colour of the edge’s source arrow. - * * -arrow-shape : The shape of the edge’s source arrow. - * * -arrow-fill : The fill state of the edge’s source arrow. - * - * For each edge arrow property above, replace with one of - * * source : Pointing towards the source node, at the end of the edge. - * * mid-source : Pointing towards the source node, at the middle of the edge. - * * target : Pointing towards the target node, at the end of the edge. - * * mid-target: Pointing towards the target node, at the middle of the edge. - * - * Only mid arrows are supported on haystack edges. - * http://js.cytoscape.org/#style/edge-arrow - */ - interface EdgeArrow { - /** The size of the arrow. */ - "arrow-scale"?: PropertyValueEdge | undefined; - - /** The colour of the edge’s source arrow. */ - "source-arrow-color"?: PropertyValueEdge | undefined; - /** The colour of the edge’s "mid-source" arrow. */ - "mid-source-arrow-color"?: PropertyValueEdge | undefined; - /** The colour of the edge’s target arrow. */ - "target-arrow-color"?: PropertyValueEdge | undefined; - /** The colour of the edge’s "mid-target" arrow. */ - "mid-target-arrow-color"?: PropertyValueEdge | undefined; - - /** The shape of the edge’s source arrow. */ - "source-arrow-shape"?: PropertyValueEdge | undefined; - /** The shape of the edge’s mid-source arrow. */ - "mid-source-arrow-shape"?: PropertyValueEdge | undefined; - /** The shape of the edge’s target arrow. */ - "target-arrow-shape"?: PropertyValueEdge | undefined; - /** The shape of the edge’s mid-target arrow. */ - "mid-target-arrow-shape"?: PropertyValueEdge | undefined; - - /** The fill state of the edge’s source arrow. */ - "source-arrow-fill"?: PropertyValueEdge | undefined; - /** The fill state of the edge’s mid-source arrow. */ - "mid-source-arrow-fill"?: PropertyValueEdge | undefined; - /** The fill state of the edge’s target arrow. */ - "target-arrow-fill"?: PropertyValueEdge | undefined; - /** The fill state of the edge’s mid-target arrow. */ - "mid-target-arrow-fill"?: PropertyValueEdge | undefined; - } - - /** - * https://js.cytoscape.org/#style/edge-endpoints - */ - interface EdgeEndpoints { - /** Specifies the endpoint of the source side of the edge */ - "source-endpoint": PropertyValue< - SingularType, - | "inside-to-node" - | "outside-to-node" - | "outside-to-node-or-label" - | "outside-to-line" - | "outside-to-line-or-label" - | string - >; - /** Specifies the endpoint of the target side of the edge */ - "target-endpoint": PropertyValue< - SingularType, - | "inside-to-node" - | "outside-to-node" - | "outside-to-node-or-label" - | "outside-to-line" - | "outside-to-line-or-label" - | string - >; - } - - /** - * http://js.cytoscape.org/#style/visibility - */ - interface Visibility { - /** - * Whether to display the element; may be element for displayed or none for not displayed. - * Note that a "display: none" bezier edge does not take up space in its bundle. - */ - display: PropertyValue; - /** - * Whether the element is visible; may be visible or hidden. - * Note that a "visibility : hidden" bezier edge still takes up space in its bundle. - */ - visibility: PropertyValue; - /** - * The opacity of the element, ranging from 0 to 1. - * Note that the opacity of a compound node parent affects the effective opacity of its children. - */ - opacity: PropertyValue; - /** - * An integer value that affects the relative draw order of elements. - * In general, an element with a higher "z-index" will be drawn on top of an element with a lower "z-index". - * Note that edges are under nodes despite "z-index", except when necessary for compound nodes. - */ - "z-index": PropertyValue; - /** - * May be bottom, orphan, auto (default), or top. The first drawn is bottom, the second is orphan, - * which is the same depth as the root of the compound graph, followed by the default of auto - * which draws in depth order from root to leaves of the compound graph. The last drawn is top. - * It does not usually make sense to set this value for non-compound graphs. - */ - "z-compound-depth": PropertyValue; - /** - * May be auto (default) or manual. The auto setting draws edges under nodes, - * whereas manual ignores this convention and draws solely based on the z-index value. - */ - "z-index-compare": PropertyValue; - } - - /** https://developer.mozilla.org/en-US/docs/Web/CSS/font-style */ - type FontStyle = "normal" | "italic" | "oblique"; - - /** https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight */ - type FontWeight = number | "normal" | "bold" | "lighter" | "bolder"; - - /** http://js.cytoscape.org/#style/labels */ - type TextTranformation = "none" | "uppercase" | "lowercase"; - - /** - * Labels - * Label text: - * - * http://js.cytoscape.org/#style/labels - */ - interface Labels { - /** - * The text to display for an element’s label. - */ - label: PropertyValue; - /** - * The text to display for an edge’s source label. - */ - "source-label": PropertyValue; - /** - * The text to display for an edge’s target label. - */ - "target-label": PropertyValue; - /** - * Basic font styling: - */ - /** - * The colour of the element’s label. - */ - color: PropertyValue; - /** - * The opacity of the label text, including its outline. - */ - "text-opacity": PropertyValue; - /** - * A comma-separated list of font names to use on the label text. - */ - "font-family": PropertyValue; - /** - * The size of the label text. - * https://developer.mozilla.org/en-US/docs/Web/CSS/font-family - */ - "font-size": PropertyValue; - /** - * A CSS font style to be applied to the label text. - * https://developer.mozilla.org/en-US/docs/Web/CSS/font-style - */ - "font-style": PropertyValue; - /** - * A CSS font weight to be applied to the label text. - */ - "font-weight": PropertyValue; - /** - * A transformation to apply to the label text. - */ - "text-transform": PropertyValue; - - /** - * Wrapping text: - */ - - /** - * A wrapping style to apply to the label text; may be - * * "none" for no wrapping (including manual newlines ) or - * * "wrap" for manual and/ or autowrapping. - * * "ellipsis" to truncate the string and append - */ - "text-wrap": PropertyValue; - /** - * The maximum width for wrapped text, - * applied when "text-wrap" is set to wrap. - * For only manual newlines (i.e.\n), set a very large - * value like 1000px such that only your newline characters would apply. - */ - "text-max-width": PropertyValue; - /** - * The characters that may be used for possible wrapping locations when - * a line overflows `text-max-width`; may be `whitespace` (default) or `anywhere`. - * Note that anywhere is suited to CJK, where the characters are in a grid - * and no whitespace exists. Using anywhere with text in the Latin alphabet, - * for example, will split words at arbitrary locations. - */ - "text-overflow-wrap": PropertyValue; - /** - * The justification of multiline (wrapped) labels; may be - * `left`, `center`, `right`, or `auto` (default). The auto value makes it so that a - * node’s label is justified along the node — e.g. a label on the right side - * of a node is left justified. - */ - "text-justification": PropertyValue; - /** - * The line height of multiline text, as a relative, unitless value. It specifies the - * vertical spacing between each line. With value `1` (default), the lines are stacked - * directly on top of one another with no additional whitespace between them. - * With value `2`, for example, there is whitespace between each line equal to the visible - * height of a line of text. - */ - "line-height": PropertyValue; - - /** - * Node label alignment: - */ - - /** - * The vertical alignment of a node’s label. - */ - "text-halign": PropertyValue; - /** - * The vertical alignment of a node’s label. - */ - "text-valign": PropertyValue; - - /** - * Edge label alignment: - */ - - /** - * For the source label of an edge, how far from the source node the label should be placed. - */ - "source-text-offset": PropertyValue; - /** - * For the target label of an edge, how far from the target node the label should be placed. - */ - "target-text-offset": PropertyValue; - /** - * Margins: - */ - - /** - * A margin that shifts the label along the x- axis. - */ - "text-margin-x": PropertyValue; - /** - * A margin that shifts the label along the y- axis. - */ - "text-margin-y": PropertyValue; - /** - * (For the source label of an edge.) - */ - "source-text-margin-x": PropertyValue; - /** - * (For the source label of an edge.) - */ - "source-text-margin-y": PropertyValue; - /** - * (For the target label of an edge.) - */ - "target-text-margin-x": PropertyValue; - /** - * (For the target label of an edge.) - */ - "target-text-margin-y": PropertyValue; - /** - * Rotating text: - */ - - /** - * A rotation angle that is applied to the label. - * * Rotations are clockwise. - * * For edges, the special value `autorotate` can be used to align the label to the edge. - * * For nodes, the label is rotated along its anchor point on the node, so a label margin may help for some usecases. - * * The special value `none` can be used to denote 0deg. - * * Rotations works best with left-to-right text. - */ - "text-rotation": PropertyValue; - - /** - * (For the source label of an edge.) - */ - "source-text-rotation": PropertyValue; - /** - * (For the target label of an edge.) - */ - "target-text-rotation": PropertyValue; - - /** - * Outline: - */ - - /** - * The colour of the outline around the element’s label text. - */ - "text-outline-color": PropertyValue; - /** - * The opacity of the outline on label text. - */ - "text-outline-opacity": PropertyValue; - /** - * The size of the outline on label text. - */ - "text-outline-width": PropertyValue; - - /** - * Background: - */ - - /** - * The padding provides visual spacing between the text and the edge of the background. - */ - "text-background-padding": PropertyValue; - /** - * A colour to apply on the text background. - */ - "text-background-color": PropertyValue; - /** - * The opacity of the label background; the background is disabled for 0 (default value). - */ - "text-background-opacity": PropertyValue; - /** - * The shape to use for the label background. - */ - "text-background-shape": PropertyValue; - - /** - * Border: - */ - - /** - * The width of the border around the label; the border is disabled for 0 (default value). - */ - "text-border-opacity": PropertyValue; - /** - * The width of the border around the label. - */ - "text-border-width": PropertyValue; - /** - * The style of the border around the label. - */ - "text-border-style": PropertyValue; - /** - * The colour of the border around the label. - */ - "text-border-color": PropertyValue; - - /** - * Interactivity: - */ - - /** - * If zooming makes the effective font size of the label smaller than this, - * then no label is shown.Note that because of performance optimisations, - * the label may be shown at font sizes slightly smaller than this value. - * - * This effect is more pronounced at larger screen pixel ratios.However, - * it is guaranteed that the label will be shown at sizes equal to or greater than the value specified. - */ - "min-zoomed-font-size": PropertyValue; - /** - * Whether events should occur on an element if the label receives an event; may be `yes` or `no`. - * You may want a style applied to the text on active so you know the text is activatable. - */ - "text-events": PropertyValue; - } - - /** - * http://js.cytoscape.org/#style/events - */ - interface Events { - /** - * Whether events should occur on an element (e.g.tap, mouseover, etc.). - * * For "no", the element receives no events and events simply pass through to the core/viewport. - */ - events: PropertyValue; - /** - * Whether events should occur on an element if the label receives an event. - * You may want a style applied to the text on active so you know the text is activatable. - */ - "text-events": PropertyValue; - } - - /** - * These properties allow for the creation of overlays on top of nodes or edges, - * and are often used in the :active state. - * http://js.cytoscape.org/#style/overlay - */ - interface Overlay { - /** - * The colour of the overlay. - */ - "overlay-color": PropertyValueEdge; - /** - * The area outside of the element within which the overlay is shown. - */ - "overlay-padding": PropertyValueEdge; - /** - * The opacity of the overlay. - */ - "overlay-opacity": PropertyValueEdge; - } - - /** - * Transition animation - */ - type TransitionTimingFunction = - | "linear" - | "spring" - | "cubic-bezier" - | "ease" - | "ease-in" - | "ease-out" - | "ease-in-out" - | "ease-in-sine" - | "ease-out-sine" - | "ease-in-out-sine" - | "ease-in-quad" - | "ease-out-quad" - | "ease-in-out-quad" - | "ease-in-cubic" - | "ease-out-cubic" - | "ease-in-out-cubic" - | "ease-in-quart" - | "ease-out-quart" - | "ease-in-out-quart" - | "ease-in-quint" - | "ease-out-quint" - | "ease-in-out-quint" - | "ease-in-expo" - | "ease-out-expo" - | "ease-in-out-expo" - | "ease-in-circ" - | "ease-out-circ" - | "ease-in-out-circ"; - - /** - * http://js.cytoscape.org/#style/transition-animation - */ - interface TransitionAnimation { - /** - * A comma separated list of style properties to animate in this state. - */ - "transition-property": string; - /** - * The length of the transition in seconds(e.g. 0.5s). - */ - "transition-duration": number; - /** - * The length of the delay in seconds before the transition occurs (e.g. 250ms). - */ - "transition-delay": number; - /** - * An easing function that controls the animation progress curve (a visualisation of easings serves as a reference). - */ - "transition-timing-function": TransitionTimingFunction; - } - - /** - * Core - * These properties affect UI global to the graph, and apply only to the core. - * You can use the special core selector string to set these properties. - * http://js.cytoscape.org/#style/core - */ - interface Core { - /** - * Indicator: - */ - - /** - * The colour of the indicator shown when the background is grabbed by the user. - */ - "active-bg-color": PropertyValueCore; - /** - * The opacity of the active background indicator. - */ - "active-bg-opacity": PropertyValueCore; - /** - * The size of the active background indicator. - */ - "active-bg-size": PropertyValueCore; - /** - * Selection box: - */ - /** - * The background colour of the selection box used for drag selection. - */ - "selection-box-color": PropertyValueCore; - /** - * The colour of the border on the selection box. - */ - "selection-box-border-color": PropertyValueCore; - /** - * The size of the border on the selection box. - */ - "selection-box-border-width": PropertyValueCore; - /** - * The opacity of the selection box. - */ - "selection-box-opacity": PropertyValueCore; - /** - * Texture during viewport gestures: - */ - /** - * The colour of the area outside the viewport texture when initOptions.textureOnViewport === true. - */ - "outside-texture-bg-color": PropertyValueCore; - /** - * The opacity of the area outside the viewport texture. - */ - "outside-texture-bg-opacity": PropertyValueCore; - } - } - - /** - * Events passed to handler callbacks are similar to - * jQuery event objects in that they wrap native event objects, - * mimicking their API. - * - * http://js.cytoscape.org/#events - */ - interface EventObject extends InputEventObject, LayoutEventObject {} - - interface EventObjectNode extends EventObject { - target: NodeSingular; - } - - interface EventObjectEdge extends EventObject { - target: EdgeSingular; - } - - interface EventObjectCore extends EventObject { - target: Core; - } - - /** - * http://js.cytoscape.org/#events/event-object - */ - interface AbstractEventObject { - /** a reference to the corresponding core Core */ - cy: Core; - /** indicates the element or core that first caused the event */ - target: any; - /** the event type string (e.g. "tap", "select") */ - type: UserInputDeviceEventName | UserInputDeviceEventNameExt | CollectionEventName | GraphEventName; - /** the event namespace string (e.g. "foo" for "foo.tap") */ - namespace: string; - /** Unix epoch time of event in milliseconds */ - timeStamp: number; - - preventDefault: () => void; - stopPropagation: () => void; - stopImmediatePropagation: () => void; - isDefaultPrevented: () => boolean; - isPropagationStopped: () => boolean; - isImmediatePropagationStopped: () => boolean; - } - interface InputEventObject extends AbstractEventObject { - /** position : indicates the model position of the event */ - position: Position; - /** renderedPosition : indicates the rendered position of the event */ - renderedPosition: Position; - /** originalEvent : the original user input device event object */ - originalEvent: MouseEvent; - } - interface LayoutEventObject extends AbstractEventObject { - /** - * layout : indicates the corresponding layout that triggered the event - * (useful if running multiple layouts simultaneously) - */ - layout: any; - } - - /** - * These are normal browser events that you can bind to via Cytoscape.js. - * You can bind these events to the core and to collections. - * http://js.cytoscape.org/#events/user-input-device-events - */ - type UserInputDeviceEventName = - // when the mouse button is pressed - | "mousedown" - // when the mouse button is released - | "mouseup" - // after mousedown then mouseup - | "click" - // when the cursor is put on top of the target - | "mouseover" - // when the cursor is moved off of the target - | "mouseout" - // when the cursor is moved somewhere on top of the target - | "mousemove" - // when one or more fingers starts to touch the screen - | "touchstart" - // when one or more fingers are moved on the screen - | "touchmove" - // when one or more fingers are removed from the screen - | "touchend"; - - /** - * There are also some higher level events that you can use - * so you don’t have to bind to different events for - * mouse-input devices and for touch devices. - * http://js.cytoscape.org/#events/user-input-device-events - */ - type UserInputDeviceEventNameExt = - // normalised tap start event (either mousedown or touchstart) - | "tapstart" - | "vmousedown" - // normalised move event (either touchmove or mousemove) - | "tapdrag" - | "vmousemove" - // normalised over element event (either touchmove or mousemove/mouseover) - | "tapdragover" - // normalised off of element event (either touchmove or mousemove/mouseout) - | "tapdragout" - // normalised tap end event (either mouseup or touchend) - | "tapend" - | "vmouseup" - // normalised tap event (either click, or touchstart followed by touchend without touchmove) - | "tap" - | "vclick" - // normalised tap hold event - | "taphold" - // normalised right-click mousedown or two-finger tapstart - | "cxttapstart" - // normalised right-click mouseup or two-finger tapend - | "cxttapend" - // normalised right-click or two-finger tap - | "cxttap" - // normalised mousemove or two-finger drag after cxttapstart but before cxttapend - | "cxtdrag" - // when going over a node via cxtdrag - | "cxtdragover" - // when going off a node via cxtdrag - | "cxtdragout" - // when starting box selection - | "boxstart" - // when ending box selection - | "boxend" - // triggered on elements when selected by box selection - | "boxselect" - // triggered on elements when inside the box on boxend - | "box"; - - /** - * These events are custom to Cytoscape.js. You can bind to these events for collections. - * http://js.cytoscape.org/#events/collection-events - */ - type CollectionEventName = - // when an element is added to the graph - | "add" - // when an element is removed from the graph - | "remove" - // when an element is moved w.r.t. topology. Nodes: when the compound parent is changed. Edges: when the source or target is changed - | "move" - // when an element is selected - | "select" - // when an element is unselected - | "unselect" - // when an element is selected by a tap gesture - | "tapselect" - // when an element is unselected by a tap elsewhere - | "tapunselect" - // triggered on elements when selected by box selection - | "boxselect" - // triggered on elements when inside the box on boxend - | "box" - // when an element is locked - | "lock" - // when an element is unlocked - | "unlock" - // when an element is grabbed directly (including only the one node directly under the cursor or the user’s finger) - | "grabon" - // when an element is grabbed (including all elements that would be dragged) - | "grab" - // when an element is grabbed and then moved - | "drag" - // when an element is freed (i.e. let go from being grabbed) - | "free" - // when an element is freed directly (including only the one node directly under the cursor or the user’s finger) - | "freeon" - // when an element is freed after being dragged (i.e. grab then drag then free) - | "dragfree" - // when an element is freed after being dragged directly (i.e. grabon, drag, freeon) - | "dragfreeon" - // when an element changes position - | "position" - // when an element’s data is changed - | "data" - // when an element’s scratchpad data is changed - | "scratch" - // when an element’s style is changed - | "style" - // when a node’s background image is loaded - | "background"; - - /** - * These events are custom to Cytoscape.js, and they occur on the core. - * http://js.cytoscape.org/#events/graph-events - */ - type GraphEventName = - // when a layout starts running - | "layoutstart" - // when a layout has set initial positions for all the nodes (but perhaps not final positions) - | "layoutready" - // when a layout has finished running completely or otherwise stopped running - | "layoutstop" - // when a new Core of Cytoscape.js is ready to be interacted with - | "ready" - // when the Core of Cytoscape.js was explicitly destroyed by calling .destroy(). - | "destroy" - // when the viewport is (re)rendered - | "render" - // when the viewport is panned - | "pan" - // when the viewport is panned via dragging - | "dragpan" - // when the viewport is zoomed - | "zoom" - // when the viewport is zoomed via pinch gesture. This event is only supported for browsers which support the gesturechange event or touch events. - // Other browsers will fire the scrollzoom event. - | "pinchzoom" - // when the viewport is zoomed via the scroll wheel - | "scrollzoom" - // when the viewport is changed (i.e. from a pan, a zoom, or from both when zooming about a point – e.g. pinch-to-zoom) - | "viewport" - // when the viewport is resized (usually by calling cy.resize(), a window resize, or toggling a class on the Cytoscape.js div) - | "resize"; - - /** - * Layouts - * http://js.cytoscape.org/#layouts - * - * The function of a layout is to set the positions on the nodes in the graph. - * Layouts are extensions of Cytoscape.js such that it is possible for - * anyone to write a layout without modifying the library itself. - * Several layouts are included with Cytoscape.js by default, - * and their options are described in the sections that follow - * with the default values specified. - * Note that you must set options.name to the name of the - * layout to specify which one you want to run. - * Each layout has its own algorithm for setting the position for each node. - * This algorithm influences the overall shape of the graph and the lengths of the edges. - * A layout’s algorithm can be customised by setting its options. - * Therefore, edge lengths can be controlled by setting the layout options appropriately. - * For force-directed (physics) layouts, - * there is generally an option to set a weight to each edge - * to affect the relative edge lengths. - * Edge length can also be affected by options like spacing - * factors, angles, and overlap avoidance. - * Setting edge length depends on the particular layout, - * and some layouts will allow for more precise edge lengths than others. - */ - - interface Layouts extends LayoutManipulation, LayoutEvents {} - - type LayoutOptions = - | NullLayoutOptions - | RandomLayoutOptions - | PresetLayoutOptions - | GridLayoutOptions - | CircleLayoutOptions - | ConcentricLayoutOptions - | BreadthFirstLayoutOptions - | CoseLayoutOptions - | BaseLayoutOptions; - - type LayoutHandler = (e: LayoutEventObject) => void; - - interface BaseLayoutOptions { - name: string; - // on layoutready event - ready?: LayoutHandler | undefined; - // on layoutstop event - stop?: LayoutHandler | undefined; - /** - * transform a given node position. Useful for changing flow direction in discrete layouts - * - * @param node The node. - * @param position The node position. - */ - transform?(node: NodeSingular, position: Position): Position; - } - /** - * http://js.cytoscape.org/#layouts/null - */ - interface NullLayoutOptions { - name: "null"; - } - interface BoundingBox12 { - x1: number; - y1: number; - x2: number; - y2: number; - } - interface BoundingBoxWH { - x1: number; - y1: number; - w: number; - h: number; - } - interface AnimatedLayoutOptions { - // whether to transition the node positions - animate?: boolean | undefined; - // duration of animation in ms if enabled - animationDuration?: number | undefined; - // easing of animation if enabled - animationEasing?: Css.TransitionTimingFunction | undefined; - /** - * a function that determines whether the node should be animated. - * All nodes animated by default on animate enabled. - * Non-animated nodes are positioned immediately when the layout starts - */ - animateFilter?(node: NodeSingular, index: number): boolean; - } - /** - * http://js.cytoscape.org/#layouts/random - */ - interface RandomLayoutOptions extends BaseLayoutOptions, AnimatedLayoutOptions { - name: "random"; - // whether to fit to viewport - fit?: boolean; - // fit padding - padding?: number | undefined; - // constrain layout bounds - boundingBox?: undefined | BoundingBox12 | BoundingBoxWH; - } - - /** - * http://js.cytoscape.org/#layouts/preset - */ - interface NodePositionMap { - [nodeid: string]: Position; - } - type NodePositionFunction = (nodeid: string) => Position; - interface PresetLayoutOptions extends BaseLayoutOptions, AnimatedLayoutOptions { - name: "preset"; - // map of (node id) => (position obj); or function(node){ return somPos; } - positions?: NodePositionMap | NodePositionFunction | undefined; - // the zoom level to set (prob want fit = false if set) - zoom?: number | undefined; - // the pan level to set (prob want fit = false if set) - pan?: number | undefined; - // whether to fit to viewport - fit?: boolean | undefined; - // padding on fit - padding?: number | undefined; - } - - // A function that determines the order of the nodes. The return value has the same - // semantics as for compare function passed to Array.sort. - type SortingFunction = (a: NodeSingular, b: NodeSingular) => number; - - interface ShapedLayoutOptions extends BaseLayoutOptions, AnimatedLayoutOptions { - // whether to fit to viewport - fit?: boolean; - // padding used on fit - padding?: number | undefined; - // constrain layout bounds - boundingBox?: BoundingBox12 | BoundingBoxWH | undefined; - - // prevents node overlap, may overflow boundingBox if not enough space - avoidOverlap?: boolean | undefined; - - // Excludes the label when calculating node bounding boxes for the layout algorithm - nodeDimensionsIncludeLabels?: boolean; - // Applies a multiplicative factor (>0) to expand or compress the overall area that the nodes take up - spacingFactor?: number | undefined; - - // a sorting function to order the nodes - sort?: SortingFunction | undefined; - } - /** - * http://js.cytoscape.org/#layouts/grid - */ - interface GridLayoutOptions extends ShapedLayoutOptions { - name: "grid"; - - // extra spacing around nodes when avoidOverlap: true - avoidOverlapPadding?: number | undefined; - - // uses all available space on false, uses minimal space on true - condense?: boolean; - // force num of rows in the grid - rows?: number | undefined; - // force num of columns in the grid - cols?: number | undefined; - // returns { row, col } for element - position?(node: NodeSingular): { row: number; col: number }; - } - - /** - * http://js.cytoscape.org/#layouts/circle - */ - interface CircleLayoutOptions extends ShapedLayoutOptions { - name: "circle"; - - // the radius of the circle - radius?: number | undefined; - - // where nodes start in radians, e.g. 3 / 2 * Math.PI, - startAngle?: number; - // how many radians should be between the first and last node (defaults to full circle) - sweep?: number | undefined; - // whether the layout should go clockwise (true) or counterclockwise/anticlockwise (false) - clockwise?: boolean | undefined; - } - /** - * http://js.cytoscape.org/#layouts/concentric - */ - interface ConcentricLayoutOptions extends ShapedLayoutOptions { - name: "concentric"; - - // where nodes start in radians, e.g. 3 / 2 * Math.PI, - startAngle?: number; - // how many radians should be between the first and last node (defaults to full circle) - sweep?: number | undefined; - // whether the layout should go clockwise (true) or counterclockwise/anticlockwise (false) - clockwise?: boolean | undefined; - - // whether levels have an equal radial distance betwen them, may cause bounding box overflow - equidistant?: boolean; - minNodeSpacing?: number; // min spacing between outside of nodes (used for radius adjustment) - // height of layout area (overrides container height) - height?: number; - // width of layout area (overrides container width) - width?: number; - // Applies a multiplicative factor (>0) to expand or compress the overall area that the nodes take up - spacingFactor?: number; - // returns numeric value for each node, placing higher nodes in levels towards the centre - concentric?(node: NodeSingular): number; - // the variation of concentric values in each level - levelWidth?(node: NodeCollection): number; - } - - /** - * http://js.cytoscape.org/#layouts/breadthfirst - */ - interface BreadthFirstLayoutOptions extends ShapedLayoutOptions { - name: "breadthfirst"; - - // whether the tree is directed downwards (or edges can point in any direction if false) - directed?: boolean; - // put depths in concentric circles if true, put depths top down if false - circle?: boolean; - // the roots of the trees - roots?: string[] | undefined; - // Deprecated: how many times to try to position the nodes in a maximal way (i.e. no backtracking) - maximalAdjustments?: number; - // whether to shift nodes down their natural BFS depths in order to avoid upwards edges (DAGS only) - maximal?: boolean; - // whether to create an even grid into which the DAG is placed (circle:false only) - grid?: boolean; - // a sorting function to order nodes at equal depth. e.g. function(a, b){ return a.data('weight') - b.data('weight') } - depthSort?: (a: NodeSingular, b: NodeSingular) => number; - } - - /** - * http://js.cytoscape.org/#layouts/cose - */ - interface CoseLayoutOptions extends ShapedLayoutOptions { - name: "cose"; - - // Number of iterations between consecutive screen positions update - // (0 -> only updated on the end) - refresh?: number; - // Randomize the initial positions of the nodes (true) or use existing positions (false) - randomize?: boolean; - // Extra spacing between components in non-compound graphs - componentSpacing?: number; - // Node repulsion (non overlapping) multiplier - nodeRepulsion?(node: any): number; - - // Node repulsion (overlapping) multiplier - nodeOverlap?: number; - // Ideal edge (non nested) length - idealEdgeLength?(edge: any): number; - // Divisor to compute edge forces - edgeElasticity?(edge: any): number; - - // Nesting factor (multiplier) to compute ideal edge length for nested edges - nestingFactor?: number; - // Gravity force (constant) - gravity?: number; - // Maximum number of iterations to perform - numIter?: number; - // Initial temperature (maximum node displacement) - initialTemp?: number; - // Cooling factor (how the temperature is reduced between consecutive iterations - coolingFactor?: number; - // Lower temperature threshold (below this point the layout will end) - minTemp?: number; - // Deprecated: Pass a reference to weaver to use threads for calculations - weaver?: boolean; - - // The layout animates only after this many milliseconds for animate:true - // (prevents flashing on fast runs) - animationThreshold?: number; - } - - /** - * http://js.cytoscape.org/#layouts/layout-manipulation - * Layouts have a set of functions available to them, - * which allow for more complex behaviour than the primary run-one-layout-at-a-time usecase. - * A new, developer accessible layout can be made via cy.makeLayout(). - */ - interface LayoutManipulation { - /** - * Start running the layout - * http://js.cytoscape.org/#layout.run - */ - run(): this; - start(): this; - /** - * Stop running the (asynchronous/discrete) layout - * http://js.cytoscape.org/#layout.stop - */ - stop(): this; - } - interface LayoutEvents { - /** - * http://js.cytoscape.org/#layouts/layout-events - */ - /** - * @param events A space separated list of event names. - * @param data [optional] A plain object which is passed to the - * handler in the event object argument. - * @param handler The handler function that is called - * when one of the specified events occurs. - */ - on(events: EventNames, handler: EventHandler): this; - on(events: EventNames, data: any, handler: EventHandler): this; - bind(events: EventNames, handler: EventHandler): this; - bind(events: EventNames, data: any, handler: EventHandler): this; - listen(events: EventNames, handler: EventHandler): this; - listen(events: EventNames, data: any, handler: EventHandler): this; - addListener(events: EventNames, handler: EventHandler): this; - addListener(events: EventNames, data: any, handler: EventHandler): this; - - /** - * Get a promise that is resolved with the first of any of - * the specified events triggered on the layout. - * http://js.cytoscape.org/#layout.promiseOn - */ - promiseOn(events: EventNames): Promise; - pon(events: EventNames): Promise; - - /** - * Bind to events that are emitted by the layout, and trigger the handler only once. - * @param events A space separated list of event names. - * @param data [optional] A plain object which is passed to the handler in the event object argument. - * @param handler The handler function that is called when one of the specified events occurs. - */ - one(events: EventNames, handler: EventHandler): this; - one(events: EventNames, data: any, handler: EventHandler): this; - - /** - * Remove event handlers on the layout. - * http://js.cytoscape.org/#layout.off - * - * @param events A space separated list of event names. - * @param handler [optional] A reference to the handler function to remove. - */ - off(events: EventNames, handler?: EventHandler): this; - unbind(events: EventNames, handler?: EventHandler): this; - unlisten(events: EventNames, handler?: EventHandler): this; - removeListener(events: EventNames, handler?: EventHandler): this; - - /** - * Remove all event handlers on the layout. - * https://js.cytoscape.org/#layout.removeAllListeners - */ - removeAllListeners(): this; - - /** - * Trigger one or more events on the layout. - * http://js.cytoscape.org/#layout.trigger - * @param events A space separated list of event names to trigger. - * @param extraParams [optional] An array of additional parameters to pass to the handler. - */ - trigger(events: EventNames, extraParams?: any[]): this; - } - - /** - * An animation represents a visible change in state over - * a duration of time for a single element. - * Animations can be generated via cy.animation() - * (for animations on the viewport) and ele.animation() - * (for animations on graph elements). - * http://js.cytoscape.org/#animations - */ - - /** - * http://js.cytoscape.org/#animations/animation-manipulation - */ - interface AnimationManipulation { - /** - * Requests that the animation be played, starting on the next frame. - * If the animation is complete, it restarts from the beginning. - * http://js.cytoscape.org/#ani.play - */ - play(): this; - /** - * Get whether the animation is currently playing. - * http://js.cytoscape.org/#ani.playing - */ - playing(): boolean; - /** - * Get or set how far along the animation has progressed. - * http://js.cytoscape.org/#ani.progress - */ - /** - * Get the progress of the animation in percent. - */ - progress(): number; - /** - * Set the progress of the animation in percent. - * @param progress The progress in percent (i.e. between 0 and 1 inclusive) to set to the animation. - */ - progress(progress: number): AnimationManipulation; - /** - * Get the progress of the animation in milliseconds. - */ - time(): number; - /** - * Set the progress of the animation in milliseconds. - * @param time The progress in milliseconds - * (i.e. between 0 and the duration inclusive) to set to the animation. - */ - time(time: number): AnimationManipulation; - /** - * Rewind the animation to the beginning. - */ - rewind(): AnimationManipulation; - /** - * Fastforward the animation to the end. - */ - fastforward(): AnimationManipulation; - - /** - * Pause the animation, maintaining the current progress. - * http://js.cytoscape.org/#ani.pause - */ - pause(): AnimationManipulation; - /** - * Stop the animation, maintaining the current progress - * and removing the animation from any associated queues. - * http://js.cytoscape.org/#ani.stop - */ - stop(): AnimationManipulation; - /** - * Get whether the animation has progressed to the end. - * http://js.cytoscape.org/#ani.completed - */ - completed(): AnimationManipulation; - complete(): AnimationManipulation; - /** - * Apply the animation at its current progress. - * http://js.cytoscape.org/#ani.apply - */ - apply(): AnimationManipulation; - /** - * Get whether the animation is currently applying. - * http://js.cytoscape.org/#ani.applying - */ - applying(): AnimationManipulation; - /** - * Reverse the animation such that its starting - * conditions and ending conditions are reversed. - * http://js.cytoscape.org/#ani.reverse - */ - reverse(): AnimationManipulation; - /** - * Get a promise that is fulfilled with the specified animation event. - * @param animationEvent A string for the event name; completed or complete for - * completing the animation or frame for the next frame of the animation. - * http://js.cytoscape.org/#ani.promise - */ - promise(animationEvent?: "completed" | "complete" | "frame"): Promise; - } - - /** - * Cytoscape extension type - * Definition of an extension would be in following form: - * @example - * declare module 'cytoscape-ext' { - * const ext: cytoscape.Ext; - * export = ext; - * } - */ - type Ext = (cy: typeof cytoscape) => void; - /** - * Register imported extension into cytoscape - * @param module Entry point for the extension, got by module = require('cy-ext') - * or by import module from 'cy-ext' - * http://js.cytoscape.org/#extensions - */ - function use(module: Ext): void; - /** - * Surpress Cytoscape internal warnings globally with a flag. - * @param condition If true, all Cytoscape warnings are surpressed. - * https://js.cytoscape.org/#core/initialisation - */ - function warnings(condition: boolean): void; -} diff --git a/types/cytoscape/package.json b/types/cytoscape/package.json deleted file mode 100644 index 63c2b17fe8f294..00000000000000 --- a/types/cytoscape/package.json +++ /dev/null @@ -1,45 +0,0 @@ -{ - "private": true, - "name": "@types/cytoscape", - "version": "3.21.9999", - "projects": [ - "http://js.cytoscape.org/" - ], - "devDependencies": { - "@types/cytoscape": "workspace:." - }, - "owners": [ - { - "name": " Fabian Schmidt and Fred Eisele", - "githubUsername": "phreed" - }, - { - "name": "Yuri Pereira Constante", - "githubUsername": "ypconstante" - }, - { - "name": "Jan-Niclas Struewer", - "githubUsername": "janniclas" - }, - { - "name": "Andrej Kirejeŭ", - "githubUsername": "gsbelarus" - }, - { - "name": "Peter Ferrarotto", - "githubUsername": "peterjferrarotto" - }, - { - "name": "Xavier Ho", - "githubUsername": "spaxe" - }, - { - "name": "Fredrik Sandström", - "githubUsername": "Veckodag" - }, - { - "name": "Johan Svensson", - "githubUsername": "jsve" - } - ] -} diff --git a/types/cytoscape/tsconfig.json b/types/cytoscape/tsconfig.json deleted file mode 100644 index 3129cd4aaafa0c..00000000000000 --- a/types/cytoscape/tsconfig.json +++ /dev/null @@ -1,21 +0,0 @@ -{ - "compilerOptions": { - "module": "node16", - "lib": [ - "es6", - "dom" - ], - "noImplicitAny": true, - "noImplicitThis": true, - "strictNullChecks": true, - "strictFunctionTypes": true, - "types": [], - "noEmit": true, - "forceConsistentCasingInFileNames": true, - "target": "es6" - }, - "files": [ - "index.d.ts", - "cytoscape-tests.ts" - ] -} diff --git a/types/openui5/openui5-tests.ts b/types/openui5/openui5-tests.ts index 3857f6596a3c5f..1375d2905de330 100644 --- a/types/openui5/openui5-tests.ts +++ b/types/openui5/openui5-tests.ts @@ -280,4 +280,5 @@ new List().attachItemActionPress((oEvent) => { new FeedInput().addAction(link); // 1.140.0 -const p13nEngine = new Engine(); \ No newline at end of file +const p13nEngine = new Engine(); +// version 1.141.0 added - tests are not required as the type definitions are generated and the generator is sufficiently tested diff --git a/types/openui5/package.json b/types/openui5/package.json index aa87d632355443..091fd6d34b8a29 100644 --- a/types/openui5/package.json +++ b/types/openui5/package.json @@ -1,7 +1,7 @@ { "private": true, "name": "@types/openui5", - "version": "1.140.9999", + "version": "1.141.9999", "nonNpm": true, "nonNpmDescription": "openui5", "projects": [ diff --git a/types/openui5/sap.f.d.ts b/types/openui5/sap.f.d.ts index 432dd6f4cd1524..472954a583e919 100644 --- a/types/openui5/sap.f.d.ts +++ b/types/openui5/sap.f.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/tnt/library" { export interface IToolHeader { @@ -222,7 +222,7 @@ declare module "sap/f/library" { * * Each layout has a default predefined ratio for the three columns, depending on device size. Based on * the device and layout, some columns are hidden. For more information, refer to the ratios (in %) for - * each value, listed below: (dash "-" means non-accessible columns). + * each value, listed below: (hyphen "-" means non-accessible columns). * * **Notes:** * - The user is allowed to customize the default ratio by dragging the column separators to resize the @@ -2745,7 +2745,7 @@ declare module "sap/f/cards/Header" { import AvatarSize from "sap/m/AvatarSize"; - import { URI } from "sap/ui/core/library"; + import { URI, ValueState } from "sap/ui/core/library"; import ElementMetadata from "sap/ui/core/ElementMetadata"; @@ -2927,6 +2927,18 @@ declare module "sap/f/cards/Header" { * @returns Value of property `iconSrc` */ getIconSrc(): URI; + /** + * Gets current value of property {@link #getIconState iconState}. + * + * Defines a status-colored, non-interactive message icon in the icon area. + * + * Default value is `None`. + * + * @since 1.141 + * + * @returns Value of property `iconState` + */ + getIconState(): ValueState; /** * Gets current value of property {@link #getIconVisible iconVisible}. * @@ -3126,6 +3138,25 @@ declare module "sap/f/cards/Header" { */ sIconSrc?: URI ): this; + /** + * Sets a new value for property {@link #getIconState iconState}. + * + * Defines a status-colored, non-interactive message icon in the icon area. + * + * When called with a value of `null` or `undefined`, the default value of the property will be restored. + * + * Default value is `None`. + * + * @since 1.141 + * + * @returns Reference to `this` in order to allow method chaining + */ + setIconState( + /** + * New value for property `iconState` + */ + sIconState?: ValueState | keyof typeof ValueState + ): this; /** * Sets a new value for property {@link #getIconVisible iconVisible}. * @@ -3338,6 +3369,16 @@ declare module "sap/f/cards/Header" { | (AvatarImageFitType | keyof typeof AvatarImageFitType) | PropertyBindingInfo | `{${string}}`; + + /** + * Defines a status-colored, non-interactive message icon in the icon area. + * + * @since 1.141 + */ + iconState?: + | (ValueState | keyof typeof ValueState) + | PropertyBindingInfo + | `{${string}}`; } } diff --git a/types/openui5/sap.m.d.ts b/types/openui5/sap.m.d.ts index 39bdc34cb1b002..efb8db6b0fdb50 100644 --- a/types/openui5/sap.m.d.ts +++ b/types/openui5/sap.m.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/f/library" { export interface IShellBar { @@ -53603,18 +53603,36 @@ declare module "sap/m/ListBase" { } declare module "sap/m/ListItemAction" { - import Metadata from "sap/ui/base/Metadata"; + import { + default as ListItemActionBase, + $ListItemActionBaseSettings, + } from "sap/m/ListItemActionBase"; + + import ElementMetadata from "sap/ui/core/ElementMetadata"; import { ListItemActionType } from "sap/m/library"; + import { PropertyBindingInfo } from "sap/ui/base/ManagedObject"; + /** * The `sap.m.ListItemAction` control provides the option to define actions directly related to list items. * * @since 1.137 */ - export default class ListItemAction - extends /* was: sap.ui.core.ListItemActionBase */ Object - { + export default class ListItemAction extends ListItemActionBase { + /** + * Constructor for a new action for list items. + * + * Accepts an object literal `mSettings` that defines initial property values, aggregated and associated + * objects as well as event handlers. See {@link sap.ui.base.ManagedObject#constructor} for a general description + * of the syntax of the settings object. + */ + constructor( + /** + * Initial settings for the new control + */ + mSettings?: $ListItemActionSettings + ); /** * Constructor for a new action for list items. * @@ -53630,14 +53648,14 @@ declare module "sap/m/ListItemAction" { /** * Initial settings for the new control */ - mSettings?: object + mSettings?: $ListItemActionSettings ); /** * Creates a new subclass of class sap.m.ListItemAction with name `sClassName` and enriches it with the * information contained in `oClassInfo`. * - * `oClassInfo` might contain the same kind of information as described in {@link sap.ui.core.ListItemActionBase.extend}. + * `oClassInfo` might contain the same kind of information as described in {@link sap.m.ListItemActionBase.extend}. * * * @returns Created class / constructor function @@ -53663,7 +53681,7 @@ declare module "sap/m/ListItemAction" { * * @returns Metadata object describing this class */ - static getMetadata(): Metadata; + static getMetadata(): ElementMetadata; /** * Gets current value of property {@link #getType type}. * @@ -53694,6 +53712,18 @@ declare module "sap/m/ListItemAction" { sType?: ListItemActionType | keyof typeof ListItemActionType ): this; } + /** + * Describes the settings that can be provided to the ListItemAction constructor. + */ + export interface $ListItemActionSettings extends $ListItemActionBaseSettings { + /** + * Defines the type of the action. + */ + type?: + | (ListItemActionType | keyof typeof ListItemActionType) + | PropertyBindingInfo + | `{${string}}`; + } } declare module "sap/m/ListItemActionBase" { @@ -88644,6 +88674,11 @@ declare module "sap/m/PDFViewer" { * happen when the source PDF file is stored in a different domain. If you want no error message to be displayed * when this event is fired, call the preventDefault() method inside the event handler. * + * Modern browsers implement strict policies for validating external resources loaded within an iframe. + * PDFViewer cannot determine whether the resource inside the iframe is a valid PDF by itself. As the validation + * cannot be performed the sourceValidationFailed event cannot be triggered. + * + * @deprecated As of version 1.141.0. with no replacement. * * @returns Reference to `this` in order to allow method chaining */ @@ -88674,6 +88709,11 @@ declare module "sap/m/PDFViewer" { * happen when the source PDF file is stored in a different domain. If you want no error message to be displayed * when this event is fired, call the preventDefault() method inside the event handler. * + * Modern browsers implement strict policies for validating external resources loaded within an iframe. + * PDFViewer cannot determine whether the resource inside the iframe is a valid PDF by itself. As the validation + * cannot be performed the sourceValidationFailed event cannot be triggered. + * + * @deprecated As of version 1.141.0. with no replacement. * * @returns Reference to `this` in order to allow method chaining */ @@ -88743,6 +88783,7 @@ declare module "sap/m/PDFViewer" { * * The passed function and listener object must match the ones used for event registration. * + * @deprecated As of version 1.141.0. with no replacement. * * @returns Reference to `this` in order to allow method chaining */ @@ -88789,6 +88830,7 @@ declare module "sap/m/PDFViewer" { /** * Fires event {@link #event:sourceValidationFailed sourceValidationFailed} to attached listeners. * + * @deprecated As of version 1.141.0. with no replacement. * @ui5-protected Do not call from applications (only from related classes in the framework) * * @returns Reference to `this` in order to allow method chaining @@ -89320,6 +89362,12 @@ declare module "sap/m/PDFViewer" { * configuration of the Mozilla Firefox browser may not allow checking the loaded content. This may also * happen when the source PDF file is stored in a different domain. If you want no error message to be displayed * when this event is fired, call the preventDefault() method inside the event handler. + * + * Modern browsers implement strict policies for validating external resources loaded within an iframe. + * PDFViewer cannot determine whether the resource inside the iframe is a valid PDF by itself. As the validation + * cannot be performed the sourceValidationFailed event cannot be triggered. + * + * @deprecated As of version 1.141.0. with no replacement. */ sourceValidationFailed?: (oEvent: Event) => void; } @@ -89357,11 +89405,15 @@ declare module "sap/m/PDFViewer" { /** * Parameters of the PDFViewer#sourceValidationFailed event. + * + * @deprecated As of version 1.141.0. with no replacement. */ export interface PDFViewer$SourceValidationFailedEventParameters {} /** * Event object of the PDFViewer#sourceValidationFailed event. + * + * @deprecated As of version 1.141.0. with no replacement. */ export type PDFViewer$SourceValidationFailedEvent = Event< PDFViewer$SourceValidationFailedEventParameters, @@ -100015,6 +100067,7 @@ declare module "sap/m/Popover" { * * Any control that needed to be displayed in the header area. When this is set, the showHeader property * is ignored, and only this customHeader is shown on the top of popover. + * **Note:** To improve accessibility, titles with heading level `H1` should be used inside the custom header. */ getCustomHeader(): Control; /** @@ -100925,6 +100978,7 @@ declare module "sap/m/Popover" { /** * Any control that needed to be displayed in the header area. When this is set, the showHeader property * is ignored, and only this customHeader is shown on the top of popover. + * **Note:** To improve accessibility, titles with heading level `H1` should be used inside the custom header. */ customHeader?: Control; @@ -138940,6 +138994,8 @@ declare module "sap/m/TabContainerItem" { import ElementMetadata from "sap/ui/core/ElementMetadata"; + import TooltipBase from "sap/ui/core/TooltipBase"; + import { PropertyBindingInfo, AggregationBindingInfo, @@ -139278,6 +139334,18 @@ declare module "sap/m/TabContainerItem" { */ bSuppressInvalidation: boolean ): this; + /** + * Property setter for the icon + * + * + * @returns `this` to allow method chaining + */ + setTooltip( + /** + * new value of the tooltip aggregation + */ + sTooltip: string | TooltipBase + ): this; } /** * Describes the settings that can be provided to the TabContainerItem constructor. @@ -151358,7 +151426,8 @@ declare module "sap/m/TimePickerClocks" { import { PropertyBindingInfo } from "sap/ui/base/ManagedObject"; /** - * A picker clocks container control used inside the {@link sap.m.TimePicker}. + * A picker clocks container control used inside the {@link sap.m.TimePicker}. If you use the control standalone, + * please call the {@link #prepareForOpen} method before opening or displaying it. * * @since 1.90 */ diff --git a/types/openui5/sap.tnt.d.ts b/types/openui5/sap.tnt.d.ts index 5375e379081dd4..1df03b47d531db 100644 --- a/types/openui5/sap.tnt.d.ts +++ b/types/openui5/sap.tnt.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/tnt/library" { /** diff --git a/types/openui5/sap.ui.codeeditor.d.ts b/types/openui5/sap.ui.codeeditor.d.ts index 70974bfdc48058..876ef51538835a 100644 --- a/types/openui5/sap.ui.codeeditor.d.ts +++ b/types/openui5/sap.ui.codeeditor.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/codeeditor/library" {} diff --git a/types/openui5/sap.ui.commons.d.ts b/types/openui5/sap.ui.commons.d.ts index 3eb36724448394..b426b771b48b05 100644 --- a/types/openui5/sap.ui.commons.d.ts +++ b/types/openui5/sap.ui.commons.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/commons/library" { import { ColorPickerMode as ColorPickerMode1 } from "sap/ui/unified/library"; diff --git a/types/openui5/sap.ui.core.d.ts b/types/openui5/sap.ui.core.d.ts index 5c711a0fd42c9a..bb1982a3945277 100644 --- a/types/openui5/sap.ui.core.d.ts +++ b/types/openui5/sap.ui.core.d.ts @@ -279,7 +279,7 @@ declare namespace sap { "sap/ui/thirdparty/qunit-2": undefined; } } -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/base/assert" { /** @@ -787,7 +787,7 @@ declare module "sap/base/i18n/Formatting" { */ setLanguageTag( /** - * the new BCP47 compliant language tag; case doesn't matter and underscores can be used instead of dashes + * the new BCP47 compliant language tag; case doesn't matter and underscores can be used instead of hyphens * to separate components (compatibility with Java Locale IDs) */ vLanguageTag: string | LanguageTag | null @@ -1090,15 +1090,15 @@ declare module "sap/base/i18n/LanguageTag" { /** * Get the extension as a single string or `null`. * - * The extension always consists of a singleton character (not 'x'), a dash '-' and one or more extension - * token, each separated again with a dash. + * The extension always consists of a singleton character (not 'x'), a hyphen '-' and one or more extension + * token, each separated again with a hyphen. */ extension: string | null; /** * Get the extensions as an array of tokens. * - * The leading singleton and the separating dashes are not part of the result. If there is no extensions + * The leading singleton and the separating hyphens are not part of the result. If there is no extensions * section in the language tag, an empty array is returned. */ extensionSubtags: string[]; @@ -1130,14 +1130,14 @@ declare module "sap/base/i18n/LanguageTag" { /** * Get the variants as a single string or `null`. * - * Multiple variants are separated by a dash '-'. + * Multiple variants are separated by a hyphen '-'. */ variant: string | null; /** * Get the variants as an array of individual variants. * - * The separating dashes are not part of the result. If there is no variant section in the language tag, + * The separating hyphens are not part of the result. If there is no variant section in the language tag, * an empty array is returned. */ variantSubtags: string[]; @@ -1189,8 +1189,8 @@ declare module "sap/base/i18n/Localization" { * The value returned by config method in most cases corresponds to the exact value that has been configured * by the user or application or that has been determined from the user agent settings. It has not been * normalized, but has been validated against a relaxed version of {@link http://www.ietf.org/rfc/bcp/bcp47.txt BCP47}, - * allowing underscores ('_') instead of the suggested dashes ('-') and not taking the case of letters into - * account. + * allowing underscores ('_') instead of the suggested hyphens ('-') and not taking the case of letters + * into account. * * The exceptions mentioned above affect languages that have been specified via the URL parameter `sap-language`. * That parameter by definition represents an SAP logon language code ('ABAP language'). Most but not all @@ -1308,7 +1308,7 @@ declare module "sap/base/i18n/Localization" { setLanguage( /** * the new language as a BCP47 compliant language tag; case doesn't matter and underscores can be used instead - * of dashes to separate components (compatibility with Java Locale IDs) + * of hyphens to separate components (compatibility with Java Locale IDs) */ sLanguage: string, /** @@ -2355,7 +2355,7 @@ declare module "sap/base/security/encodeURL" { /** * Encode the string for inclusion into a URL parameter. * - * Unescaped characters: alphabetic, decimal digits, -_. (dash, underscore, point) + * Unescaped characters: alphabetic, decimal digits, -_. (hyphen, underscore, dot) * * @since 1.58 * @@ -3918,7 +3918,7 @@ declare module "sap/ui/core/ComponentSupport" { * instance of the {@link sap.ui.core.ComponentContainer ComponentContainer} in the JavaScript code. * * As HTML is case-insensitive, in order to define a property with upper-case characters, you have to "escape" - * them with a dash character, similar to CSS attributes. The following code gives an example: + * them with a hyphen character, similar to CSS attributes. The following code gives an example: * * * ```javascript @@ -6643,6 +6643,11 @@ declare module "sap/ui/model/odata/v2/ODataModel" { * property has to be an integer type */ hierarchyNodeDescendantCountFor?: string; + /** + * The property name in the same type holding the preorder rank for the node; the type of the referenced + * property has to be an integer type + */ + hierarchyPreorderRankFor?: string; }; /** * The number of levels that are auto-expanded initially. Setting this property might lead to multiple back-end @@ -6687,6 +6692,18 @@ declare module "sap/ui/model/odata/v2/ODataModel" { * or {@link sap.ui.model.odata.OperationMode.Auto OperationMode.Auto} is used. */ treeState?: any; + /** + * This parameter is experimental as of version 1.141.0. + * + * Whether the tree state is restored on hierarchy maintenance, such as adding, removing, or deleting a + * node. This is only supported if the following conditions are met: + * - The binding has to use {@link sap.ui.model.odata.OperationMode.Server OperationMode.Server} + * - The `"hierarchy-node-descendant-count-for"` annotation must be present in the service metadata or + * provided via `treeAnnotationProperties.hierarchyNodeDescendantCountFor` + * - The `"hierarchy-preorder-rank-for"` annotation must be present in the service metadata or provided + * via `treeAnnotationProperties.hierarchyPreorderRankFor` + */ + restoreTreeStateAfterChange?: boolean; /** * Defines the count mode of this binding; if not specified, the default count mode of the binding's model * is applied. The resulting count mode must not be {@link sap.ui.model.odata.CountMode.None}. @@ -16817,7 +16834,7 @@ declare module "sap/ui/core/library" { /** * A string type representing an ID or a name. * - * Allowed is a sequence of characters (capital/lowercase), digits, underscores, dashes, points and/or colons. + * Allowed is a sequence of characters (capital/lowercase), digits, underscores, hyphens, dots and/or colons. * It may start with a character or underscore only. */ export type ID = string; @@ -19449,7 +19466,7 @@ declare module "sap/ui/core/ComponentContainer" { * Gets current value of property {@link #getAutoPrefixId autoPrefixId}. * * Flag, whether to auto-prefix the ID of the nested Component or not. If this property is set to true the - * ID of the Component will be prefixed with the ID of the ComponentContainer followed by a single dash. + * ID of the Component will be prefixed with the ID of the ComponentContainer followed by a single hyphen. * This property can only be applied initially. * * Default value is `false`. @@ -19602,7 +19619,7 @@ declare module "sap/ui/core/ComponentContainer" { * Sets a new value for property {@link #getAutoPrefixId autoPrefixId}. * * Flag, whether to auto-prefix the ID of the nested Component or not. If this property is set to true the - * ID of the Component will be prefixed with the ID of the ComponentContainer followed by a single dash. + * ID of the Component will be prefixed with the ID of the ComponentContainer followed by a single hyphen. * This property can only be applied initially. * * When called with a value of `null` or `undefined`, the default value of the property will be restored. @@ -19884,7 +19901,7 @@ declare module "sap/ui/core/ComponentContainer" { /** * Flag, whether to auto-prefix the ID of the nested Component or not. If this property is set to true the - * ID of the Component will be prefixed with the ID of the ComponentContainer followed by a single dash. + * ID of the Component will be prefixed with the ID of the ComponentContainer followed by a single hyphen. * This property can only be applied initially. */ autoPrefixId?: boolean | PropertyBindingInfo | `{${string}}`; @@ -20543,8 +20560,8 @@ declare module "sap/ui/core/Configuration" { * The value returned by config method in most cases corresponds to the exact value that has been configured * by the user or application or that has been determined from the user agent settings. It has not been * normalized, but has been validated against a relaxed version of {@link http://www.ietf.org/rfc/bcp/bcp47.txt BCP47}, - * allowing underscores ('_') instead of the suggested dashes ('-') and not taking the case of letters into - * account. + * allowing underscores ('_') instead of the suggested hyphens ('-') and not taking the case of letters + * into account. * * The exceptions mentioned above affect languages that have been specified via the URL parameter `sap-language`. * That parameter by definition represents an SAP logon language code ('ABAP language'). Most but not all @@ -20813,7 +20830,7 @@ declare module "sap/ui/core/Configuration" { setFormatLocale( /** * the new format locale as a BCP47 compliant language tag; case doesn't matter and underscores can be used - * instead of dashes to separate components (compatibility with Java Locale IDs) + * instead of hyphens to separate components (compatibility with Java Locale IDs) */ sFormatLocale: string | null ): this; @@ -20870,7 +20887,7 @@ declare module "sap/ui/core/Configuration" { setLanguage( /** * the new language as a BCP47 compliant language tag; case doesn't matter and underscores can be used instead - * of dashes to separate components (compatibility with Java Locale IDs) + * of hyphens to separate components (compatibility with Java Locale IDs) */ sLanguage: string, /** @@ -27171,8 +27188,8 @@ declare module "sap/ui/core/Element" { * returned by {@link sap.ui.core.Element#getDomRef} is wrapped and returned. * * If an ID suffix is given, the ID of this Element is concatenated with the suffix (separated by a single - * dash) and the DOM node with that compound ID will be wrapped by jQuery. This matches the UI5 naming convention - * for named inner DOM nodes of a control. + * hyphen) and the DOM node with that compound ID will be wrapped by jQuery. This matches the UI5 naming + * convention for named inner DOM nodes of a control. * * @ui5-protected Do not call from applications (only from related classes in the framework) * @@ -27606,7 +27623,7 @@ declare module "sap/ui/core/Element" { * their current state (e.g. an initial, not yet rendered control). * * If an ID suffix is given, the ID of this Element is concatenated with the suffix (separated by a single - * dash) and the DOM node with that compound ID will be returned. This matches the UI5 naming convention + * hyphen) and the DOM node with that compound ID will be returned. This matches the UI5 naming convention * for named inner DOM nodes of a control. * * @ui5-protected Do not call from applications (only from related classes in the framework) @@ -34212,8 +34229,8 @@ declare module "sap/ui/core/Locale" { /** * Get the locale extension as a single string or `null`. * - * The extension always consists of a singleton character (not 'x'), a dash '-' and one or more extension - * token, each separated again with a dash. + * The extension always consists of a singleton character (not 'x'), a hyphen '-' and one or more extension + * token, each separated again with a hyphen. * * Use {@link #getExtensions} to get the individual extension tokens as an array. * @@ -34224,7 +34241,7 @@ declare module "sap/ui/core/Locale" { /** * Get the locale extensions as an array of tokens. * - * The leading singleton and the separating dashes are not part of the result. If there is no extensions + * The leading singleton and the separating hyphens are not part of the result. If there is no extensions * section in the locale tag, an empty array is returned. * * @@ -34251,7 +34268,7 @@ declare module "sap/ui/core/Locale" { /** * Get the locale private use section as an array of tokens. * - * The leading singleton and the separating dashes are not part of the result. If there is no private use + * The leading singleton and the separating hyphens are not part of the result. If there is no private use * section in the locale tag, an empty array is returned. * * @@ -34303,7 +34320,7 @@ declare module "sap/ui/core/Locale" { /** * Get the locale variants as a single string or `null`. * - * Multiple variants are separated by a dash '-'. + * Multiple variants are separated by a hyphen '-'. * * * @returns the variant or `null` @@ -34312,8 +34329,8 @@ declare module "sap/ui/core/Locale" { /** * Get the locale variants as an array of individual variants. * - * The separating dashes are not part of the result. If there is no variant section in the locale tag, an - * empty array is returned. + * The separating hyphens are not part of the result. If there is no variant section in the locale tag, + * an empty array is returned. * * * @returns the individual variant sections @@ -43159,10 +43176,15 @@ declare module "sap/ui/core/routing/History" { */ static getInstance(): History; /** - * Determines what the navigation direction for a newly given hash would be It will say Unknown if there - * is a history foo - bar (current history) - foo If you now ask for the direction of the hash "foo" you - * get Unknown because it might be backwards or forwards. For hash replacements, the history stack will - * be replaced at this position for the history. + * Determines what the navigation direction for a newly given hash would be. + * + * Returns the direction as {@link sap.ui.core.routing.HistoryDirection} (for example: Forwards, Backwards, + * NewEntry). If no navigation has occurred yet, returns `undefined`. In cases where the direction cannot + * be determined (if the same hash appears in multiple places), returns {@link sap.ui.core.routing.HistoryDirection.Unknown}. + * For hash replacements, the history stack is updated at the current position. + * + * Example: It will say "Unknown" if there is a history "foo" - "bar" (current history) - "foo". If you + * now ask for the direction of the hash "foo" you get "Unknown" because it might be backwards or forwards. * * * @returns Direction for the given hash or `undefined`, if no navigation has taken place yet. @@ -49330,11 +49352,21 @@ declare module "sap/ui/core/UIComponent" { /** * Initializes the component instance after creation. * - * Applications must not call this hook method directly, it is called by the framework while the constructor - * of a Component is executed. + * The primary responsibility of this method is to create the root control of the component and manage its + * aggregation in the "rootControl" aggregation. This is performed internally by invoking the {@link sap.ui.core.UIComponent#createContent } + * method. + * + * Depending on the class metadata (e.g., if the "sap.ui.core.IAsyncContentCreation" interface is implemented), + * the root control may be created synchronously or asynchronously. * - * Subclasses of `UIComponent` should override this hook to implement any necessary initialization. **When - * overriding this function make sure to invoke the `init` function of the `UIComponent` as well!** + * Additionally, this method is responsible for creating the router and targets instances. + * + * **Note:** Applications must not call this hook method directly; it is invoked by the framework during + * the execution of the Component constructor. + * + * Subclasses of `UIComponent` should override this hook to implement any required initialization logic. + * **When overriding this method, ensure that you always invoke the `init` method of the `UIComponent` base + * class.** * * @ui5-protected Do not call from applications (only from related classes in the framework) */ @@ -71294,7 +71326,7 @@ declare module "sap/ui/model/odata/v4/AnnotationHelper" { * * Annotations on an Operation or a Parameter: Since 1.71.0, for annotations on an operation or a parameter, * the binding parameter's name is stripped off any dynamic "14.5.12 Expression edm:Path" and "14.5.13 Expression - * edm:PropertyPath" where it might be used as a first segment. Since 1.76.0 this does not apply to annotations + * edm:PropertyPath" where it might be used as a first segment. Since 1.76.0, this does not apply to annotations * on a parameter. In the former case, we assume that the resulting data binding is relative to the parent * context of the operation binding, that is, to the context representing the binding parameter itself. * In the latter case, we assume that the resulting data binding is relative to the parameter context of @@ -71615,7 +71647,7 @@ declare module "sap/ui/model/odata/v4/AnnotationHelper" { * * Annotations on an Operation or a Parameter: Since 1.71.0, for annotations on an operation or a parameter, * the binding parameter's name is stripped off any dynamic "14.5.12 Expression edm:Path" and "14.5.13 Expression - * edm:PropertyPath" where it might be used as a first segment. Since 1.76.0 this does not apply to annotations + * edm:PropertyPath" where it might be used as a first segment. Since 1.76.0, this does not apply to annotations * on a parameter. In the former case, we assume that the resulting data binding is relative to the parent * context of the operation binding, that is, to the context representing the binding parameter itself. * In the latter case, we assume that the resulting data binding is relative to the parameter context of @@ -71730,6 +71762,11 @@ declare module "sap/ui/model/odata/v4/AnnotationHelper" { * apply to annotations on a parameter (since 1.76.0). */ overload?: object; + /** + * Optional prefix to be added to each dynamic "14.5.12 Expression edm:Path" and "14.5.13 Expression edm:PropertyPath"; + * is either an empty string or a path ending with a "/" (since 1.141.0) + */ + prefix?: string; } ): string; } @@ -71853,7 +71890,7 @@ declare module "sap/ui/model/odata/v4/Context" { * as a binding context. Exceptions hold for status APIs like {@link #isDeleted}, {@link #isKeepAlive}, * {@link #hasPendingChanges}, {@link #resetChanges}, or {@link #isSelected} (returns `false` since 1.114.0). * - * Since 1.105 such a pending deletion is a pending change. It causes `hasPendingChanges` to return `true` + * Since 1.105, such a pending deletion is a pending change. It causes `hasPendingChanges` to return `true` * for the context, the binding containing it, and the model. The `resetChanges` method called on the context, * the binding, or the model cancels the deletion and restores the context. * @@ -71897,7 +71934,7 @@ declare module "sap/ui/model/odata/v4/Context" { * binding is used, see {@link #getUpdateGroupId}. Since 1.81, if this context is transient (see {@link #isTransient}), * no group ID needs to be specified. Since 1.98.0, you can use `null` to prevent the DELETE request in * case of a kept-alive context that is not in the collection and of which you know that it does not exist - * on the server anymore (for example, a draft after activation). Since 1.108.0 the usage of a group ID + * on the server anymore (for example, a draft after activation). Since 1.108.0, the usage of a group ID * with {@link sap.ui.model.odata.v4.SubmitMode.API} is possible. Since 1.121.0, you can use the '$single' * group ID to send a DELETE request as fast as possible; it will be wrapped in a batch request as for a * '$auto' group. @@ -72217,8 +72254,8 @@ declare module "sap/ui/model/odata/v4/Context" { */ oParameters: { /** - * Whether the node should be copied instead of moved (@experimental as of version 1.135.0). The returned - * promise resolves with the index for the copied node. + * Whether the node should be copied instead of moved. The returned promise resolves with the index for + * the copied node. Supported since 1.141.0. */ copy?: boolean; /** @@ -72332,7 +72369,7 @@ declare module "sap/ui/model/odata/v4/Context" { requestParent(): Promise; /** * Returns a promise on the property value for the given path relative to this context. The path is expected - * to point to a structural property with primitive type. Since 1.81.1 it is possible to request more than + * to point to a structural property with primitive type. Since 1.81.1, it is possible to request more than * one property. Property values that are not cached yet are requested from the back end. * See: * sap.ui.model.odata.v4.ODataMetaModel#requestUI5Type @@ -72431,7 +72468,7 @@ declare module "sap/ui/model/odata/v4/Context" { * (unless listed explicitly), for example `[{$PropertyPath : "*"}, {$NavigationPropertyPath : "EMPLOYEE_2_MANAGER"}]` * or `[{$PropertyPath : "EMPLOYEE_2_MANAGER/*"}]`. * - * Since 1.82.0 absolute paths are supported. Absolute paths must start with the entity container (example + * Since 1.82.0, absolute paths are supported. Absolute paths must start with the entity container (example * "/com.sap.gateway.default.iwbep.tea_busi.v0001.Container/TEAMS") of the service. All (navigation) properties * in the complete model matching such an absolute path are updated. Since 1.85.0, "14.4.11 Expression edm:String" * is accepted as well. @@ -72508,7 +72545,7 @@ declare module "sap/ui/model/odata/v4/Context" { /** * Sets a new value for the property identified by the given path. The path is relative to this context * and is expected to point to a structural property with primitive type or, since 1.85.0, to an instance - * annotation. Since 1.122.0 the client-side annotation "@$ui5.context.isSelected" can be given as a path. + * annotation. Since 1.122.0, the client-side annotation "@$ui5.context.isSelected" can be given as a path. * Note: Writing to a client-side annotation never initiates a PATCH request, even if `sGroupId` is given. * Thus, reverting the value of this annotation cannot be done via {@link #resetChanges}. * See: @@ -72976,11 +73013,12 @@ declare module "sap/ui/model/odata/v4/ODataContextBinding" { * messages will be related to the return value context only. Such a message can only be connected to a * corresponding control if the control's property bindings use the return value context as binding context. * - * A return value context may also be provided if the parent context's path contains a maximum of one navigation - * property. In addition to the existing preconditions for a return value context, the metadata has to specify - * a partner attribute for the navigation property and the partner relationship has to be bi-directional. - * Also the navigation property binding has to be available in the entity set of the first segment in the - * parent context's path (@experimental as of version 1.119.0). + * Since 1.141.0, a return value context may also be provided if the parent context's path contains a maximum + * of one navigation property. In addition to the existing preconditions for a return value context, the + * metadata has to specify a partner attribute for the navigation property and the partner relationship + * has to be bi-directional. Also a navigation property binding has to be available for the entity set of + * the first segment in the parent context's path. **Note:** Ensure your service implementation returns + * all selected key properties; otherwise, no return value context is provided. */ invoke( /** @@ -73142,7 +73180,7 @@ declare module "sap/ui/model/odata/v4/ODataContextBinding" { * requests. Call {@link #resume} to resume the binding. Before 1.53.0, this method was not supported and * threw an error. Since 1.97.0, pending changes are ignored if they relate to a {@link sap.ui.model.odata.v4.Context#isKeepAlive kept-alive } * context of this binding. Since 1.98.0, {@link sap.ui.model.odata.v4.Context#isTransient transient} contexts - * of a {@link #getRootBinding root binding} do not count as pending changes. Since 1.108.0 {@link sap.ui.model.odata.v4.Context#delete deleted } + * of a {@link #getRootBinding root binding} do not count as pending changes. Since 1.108.0, {@link sap.ui.model.odata.v4.Context#delete deleted } * contexts do not count as pending changes. * See: * {@link https://ui5.sap.com/#/topic/b0f5c531e5034a27952cc748954cbe39 Suspend and Resume} @@ -73516,12 +73554,15 @@ declare module "sap/ui/model/odata/v4/ODataListBinding" { * set `bSkipRefresh` to `true`. To avoid errors you must skip this refresh when using {@link sap.ui.model.odata.v4.Context#requestSideEffects } * in the same $batch to refresh the complete collection containing the newly created entity. * - * Since 1.115.0 it is possible to create nested entities in a collection-valued navigation property together + * Since 1.115.0, it is possible to create nested entities in a collection-valued navigation property together * with the entity (so-called "deep create"), for example a list of items for an order. For this purpose, * bind the list relative to a transient context. Calling this method then adds a transient entity to the * parent's navigation property, which is sent with the payload of the parent entity. Such a nested context * cannot be inactive. * + * **Caution:** Only a single list must be bound to the same collection-valued navigation property relative + * to a transient context. Created data cannot be shared between list bindings. + * * **Note:** After a successful creation of the main entity the context returned for a nested entity is * no longer valid. Do not use the {@link sap.ui.model.odata.v4.Context#created created} promise of such * a context! New contexts are created for the nested collection because it is not possible to reliably @@ -73529,7 +73570,7 @@ declare module "sap/ui/model/odata/v4/ODataListBinding" { * the `created` promises of all nested contexts are always rejected with an instance of `Error`, even if * the deep create succeeds. This error always has the property `canceled` with the value `true`. * - * Since 1.118.0 deep create also supports single-valued navigation properties; no API call is required + * Since 1.118.0, deep create also supports single-valued navigation properties; no API call is required * in this case. Simply bind properties of the related entity relative to a transient context. An update * to the property adds it to the POST request of the parent entity, and by this the create becomes deep. * @@ -73581,7 +73622,7 @@ declare module "sap/ui/model/odata/v4/ODataListBinding" { */ bSkipRefresh?: boolean, /** - * Whether the entity is inserted at the end of the list. Supported since 1.66.0. Since 1.99.0 the first + * Whether the entity is inserted at the end of the list. Supported since 1.66.0. Since 1.99.0, the first * insertion determines the overall position of created contexts within the binding's context list. Every * succeeding insertion is relative to the created contexts within this list. */ @@ -73937,7 +73978,7 @@ declare module "sap/ui/model/odata/v4/ODataListBinding" { getHeaderContext(): Context | null; /** * Calls {@link sap.ui.model.odata.v4.Context#setKeepAlive} at the context for the given path and returns - * it. Since 1.100.0 the function always returns such a context. If none exists yet, it is created without + * it. Since 1.100.0, the function always returns such a context. If none exists yet, it is created without * data and a request for its entity is sent. * See: * sap.ui.model.odata.v4.ODataModel#getKeepAliveContext @@ -74378,7 +74419,7 @@ declare module "sap/ui/model/odata/v4/ODataListBinding" { * requests. Call {@link #resume} to resume the binding. Before 1.53.0, this method was not supported and * threw an error. Since 1.97.0, pending changes are ignored if they relate to a {@link sap.ui.model.odata.v4.Context#isKeepAlive kept-alive } * context of this binding. Since 1.98.0, {@link sap.ui.model.odata.v4.Context#isTransient transient} contexts - * of a {@link #getRootBinding root binding} do not count as pending changes. Since 1.108.0 {@link sap.ui.model.odata.v4.Context#delete deleted } + * of a {@link #getRootBinding root binding} do not count as pending changes. Since 1.108.0, {@link sap.ui.model.odata.v4.Context#delete deleted } * contexts do not count as pending changes. * See: * {@link https://ui5.sap.com/#/topic/b0f5c531e5034a27952cc748954cbe39 Suspend and Resume} @@ -75179,9 +75220,9 @@ declare module "sap/ui/model/odata/v4/ODataMetaModel" { * results either in a simple name like "EMPLOYEES" or maybe in a path like "some.other.EntityContainer/SomeEntitySet". * The path must not continue after "@sapui.name". * - * If the current object is a string value, that string value is treated as a relative path and followed - * step-by-step before the next segment is processed. Except for this, a path must not continue if it comes - * across a non-object value. Such a string value can be a qualified name (example path "/$EntityContainer/..."), + * If the current object is a string value, that string value is treated as an absolute or relative path + * and followed step-by-step before the next segment is processed. Except for this, a path must not continue + * if it comes across a non-object value. Such a string value can be a qualified name (example path "/$EntityContainer/..."), * a simple identifier (example path "/TEAMS/$NavigationPropertyBinding/TEAM_2_EMPLOYEES/...") including * the special name "$ReturnType" (since 1.71.0), or even a path according to "14.5.12 Expression edm:Path" * etc. (example path "/TEAMS/@com.sap.vocabularies.UI.v1.LineItem/0/Value/$Path/...". @@ -75333,7 +75374,7 @@ declare module "sap/ui/model/odata/v4/ODataMetaModel" { /** * Scope for lookup of aliases for computed annotations (since 1.43.0) as a map from alias to a module (like * `{AH : AnnotationHelper}`) or function (like `{format : AnnotationHelper.format}`); the alias must not - * contain a dot. Since 1.120.3 looking up a computed annotation via its global name is **deprecated**; + * contain a dot. Since 1.120.3, looking up a computed annotation via its global name is **deprecated**; * always use this scope instead. */ scope?: Record; @@ -76324,8 +76365,8 @@ declare module "sap/ui/model/odata/v4/ODataModel" { * Returns a context with the given path belonging to a matching list binding that has been marked with * `$$getKeepAliveContext` (see {@link #bindList}). If such a matching binding can be found, a context is * returned and kept alive (see {@link sap.ui.model.odata.v4.ODataListBinding#getKeepAliveContext}). Since - * 1.100.0 a temporary binding is used if no such binding could be found. If such a binding is created or - * resolved later, the context and its data are transferred to it, and the temporary binding is destroyed + * 1.100.0, a temporary binding is used if no such binding could be found. If such a binding is created + * or resolved later, the context and its data are transferred to it, and the temporary binding is destroyed * again. * * A `$$getKeepAliveContext` binding matches if its resolved binding path is the collection path of the @@ -76569,6 +76610,28 @@ declare module "sap/ui/model/odata/v4/ODataModel" { */ sGroupId?: string ): void; + /** + * Sets the "odata.continue-on-error" preference for the **current** batch request associated with the given + * group ID. This method can be called early on, when the batch queue is still empty, or even synchronously + * after {@link #submitBatch} - just as long as the $batch request is not already being sent to the server. + * It needs to be called again for future batch requests with the same group ID. It is safe to call it multiple + * times for the same batch request. + * + * **Caution:** Make sure that no user input is lost due to a side-effects GET being applied even after + * a failed PATCH. It's safe to use this method if, for example, only actions are invoked or when {@link sap.ui.model.odata.v4.Context#setProperty } + * is used without `bRetry` for mass updates. + * + * @since 1.141.0 + */ + setContinueOnError( + /** + * A valid group ID as specified in {@link sap.ui.model.odata.v4.ODataModel}. Avoid '$auto' to control which + * requests are affected by this preference. Using a {@link module:sap/base/util/uid UID} may be one way + * to achieve this, but take care to replace hyphens with underscores: `"$auto." + uid().replaceAll("-", + * "_")` + */ + sGroupId: string + ): void; /** * Method not supported * @@ -77075,7 +77138,7 @@ declare module "sap/ui/model/odata/v4/ODataPropertyBinding" { * Sets the new current value and updates the cache. If the value cannot be accepted or cannot be updated * on the server, an error is logged to the console and added to the message manager as a technical message. * Unless preconditions fail synchronously, a {@link sap.ui.model.odata.v4.ODataModel#event:propertyChange 'propertyChange' } - * event is fired and provides a promise on the outcome of the asynchronous operation. Since 1.122.0 this + * event is fired and provides a promise on the outcome of the asynchronous operation. Since 1.122.0, this * method allows updates to the client-side annotation "@$ui5.context.isSelected". Note: Changing the value * of a client-side annotation never initiates a PATCH request, no matter which `sGroupId` is given. Thus, * it cannot be reverted via {@link #resetChanges}. @@ -81605,7 +81668,7 @@ declare module "sap/ui/test/gherkin/dataTableUtils" { * * * - Trim spaces off the string on both sides. For example: `" hello "` becomes `"hello"`. - * - Assume that dashes and underscores are analogs for a space. For example: `"sold-to party"` and `"sold + * - Assume that hyphens and underscores are analogs for a space. For example: `"sold-to party"` and `"sold * to party"` are equivalent, and would both convert to the camelCase `"soldToParty"`. * - Trim multiple spaces between words. For example: `"hello____world"` becomes `"hello world"`. * - Remove any characters that are not alphanumeric or whitespace. For example: `"(hello)"` becomes `"hello"`. @@ -81704,7 +81767,7 @@ declare module "sap/ui/test/gherkin/dataTableUtils" { * * * - Trim spaces off the string on both sides. For example: `" hello "` becomes `"hello"`. - * - Assume that dashes and underscores are analogs for a space. For example: `"sold-to party"` and `"sold + * - Assume that hyphens and underscores are analogs for a space. For example: `"sold-to party"` and `"sold * to party"` are equivalent, and would both convert to the camelCase `"soldToParty"`. * - Trim multiple spaces between words. For example: `"hello____world"` becomes `"hello world"`. * - Remove any characters that are not alphanumeric or whitespace. For example: `"(hello)"` becomes `"hello"`. diff --git a/types/openui5/sap.ui.dt.d.ts b/types/openui5/sap.ui.dt.d.ts index 9ad32cd48fe6eb..fe7cacd98511f9 100644 --- a/types/openui5/sap.ui.dt.d.ts +++ b/types/openui5/sap.ui.dt.d.ts @@ -1,4 +1,205 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 + +declare module "sap/ui/dt/library" { + export namespace designtime { + namespace DesignTimeMetadata { + /** + * Object containing the aggregation configuration + */ + type Aggregation = { + /** + * Used to ignore the aggregation (and all its children) at design time. For example, this can be used to + * ignore deprecated or duplicated aggregations as well as aggregations irrelevant during the design time + * (such as dependents). If the value is true, then no overlays will be created for the aggregation and + * its children. For more options on how to disable actions in design time please refer to the UI5 Demo + * Kit. + */ + ignore?: boolean | Function; + /** + * Defines the DOM reference of the aggregation. The DOM reference is used to calculate the dimension of + * the aggregation at design time. This is needed, for instance, to make drag&drop possible. If no domRef + * property is given, a heuristic is used to calculate the dimension of the aggregation from its children + * during the design time. + */ + domRef?: string | Function; + /** + * Provide or compute name for the controls inside the aggregation which is understandable for the key user. + * This is needed for the "addODataProperty" and "createContainer" action to show the names in the context + * menu (Add , Available ). Name the control based on the general UI concept and follow + * the guidance from https://experience.sap.com/fiori-design/. The key user doesn't care about the difference + * between a smart, mobile, or responsive version of a form, it's just a form. + */ + childNames?: + | { + /** + * i18n key from library's design-time resource bundle or function returning the translated text + */ + singular: string | Function; + /** + * i18n key from library's design-time resource bundle or function returning the translated text + */ + plural: string | Function; + } + | Function; + /** + * Actions that can be performed on the aggregation (e.g. move). + */ + actions?: object; + /** + * Returns DesignTime-Metadata object which extends or overrides existing metadata of a successor control. + * In the negative case it returns the boolean "false" value. The propagateMetadata function gets 2 parameters + * passed through during execution: oControl and oRelevantContainerControl. The second parameter is the + * control which has defined this propagation function. It can be used if you need to know the relevantContainer + * during the execution of the function. + */ + propagateMetadata?: Function; + /** + * Defines the relevant container control for the actions which belong to successor controls. + */ + propagateRelevantContainer?: boolean | Function; + }; + + /** + * Object containing the association configuration + */ + type Association = { + /** + * Can be used to tell the design time that it should follow the association hierarchy. This is used by + * controls like e.g. the componentContainer that should allow to follow the association component, which + * defines the control hierarchy but is not a real aggregation (more isolation, regarding model propagation/rendering/eventing/...). + */ + aggregationLike: boolean; + }; + + /** + * Object containing the aggregation configuration + */ + type Property = { + /** + * Used to ignore the property at design time. For example, this can be used to ignore deprecated properties + * or properties that shall not be changed during design time. + */ + ignore?: boolean | Function; + }; + } + + /** + * Object containing a sample design time configuration + */ + type DesignTimeMetadata = { + /** + * Specify or calculate a speaking name for the control (which is understandable to key users). This is + * needed for the "reveal" action to show the names in the context menu (Add and Available + * ). Name your control based on the general UI concept and follow the guidance from https://experience.sap.com/fiori-design/. + * Example: Key users don't care about the difference between a smart, mobile or responsive version of a + * form, it's just a form. + */ + name: + | { + /** + * i18n key from library's design-time resource bundle or function returning the translated text + */ + singular: string | Function; + /** + * i18n key from library's design-time resource bundle or function returning the translated text + */ + plural: string | Function; + } + | Function; + /** + * Allows to provide a customized getter for the control label that is used in outlines, context menus and + * actions like "reveal" or "rename". The default implementation tries to get the following properties in + * that order: `text`, `labelText`, `label`, `title`, `heading`, `dataSourceLabel` + */ + getLabel?: Function; + /** + * Defines the DOM reference of the control + */ + domRef?: string | Function; + /** + * Needed for Elements that are not derived from sap.ui.core.Control. The function should return the visibility + * of the Element as a boolean (true = visible). This function can be called before the DOM is ready. + */ + isVisible: Function; + /** + * Palette settings for the control. + */ + palette: + | { + /** + * Possible values: "ACTION", "DISPLAY", "LAYOUT", "LIST", "INPUT", "CONTAINER", "CHART", "TILE" + */ + group: string | Function; + /** + * Preferable as SVG as this icon scales + */ + icon: string | Function; + } + | Function; + /** + * Create template will not be inherited, they are special to the current type. + */ + templates: { + /** + * Path to the template file + */ + create: string; + }; + /** + * RTA specific actions that can be performed on the control. + */ + actions: object; + /** + * Configuration for the properties of the control. See sap.ui.dt.DesignTimeMetadata.Property + */ + properties: object; + /** + * Configuration for the aggregations of the control. See sap.ui.dt.DesignTimeMetadata.Aggregation + */ + aggregations: object; + /** + * Describes the associations of the control. Per default no association is followed as overlays should + * match the control hierarchy. No actions are supported for associations. See sap.ui.dt.DesignTimeMetadata.Association + */ + associations: object; + /** + * Describes the OData annotations that are actively used by your control. This section needs to be filled + * for controls evaluating annotations. It can be used for documentation purposes, but is also evaluated + * by UI adaptation at design time. + */ + annotations: object; + /** + * Describes the scroll containers of the control. This is needed when there are more than one aggregation + * in one scroll container (e.g. ObjectPageLayout: Header + Sections). + */ + scrollContainers: Array<{ + /** + * Defines the DOM reference for the scroll wrapper + */ + domRef: string | Function; + /** + * Names of the aggregations inside the scroll wrapper. Two arguments are passed to the function: the control + * instance and an update function that can be called if the aggregations change. + */ + aggregations: string[] | Function; + }>; + /** + * This object defines hooks that are being called when a tool, e.g. Runtime Adaptation, is started and + * stopped. The functions are being called with the control instance as parameter. + */ + tool: { + /** + * Called when the tool is started + */ + start: Function; + /** + * Called when the tool is stopped + */ + stop: Function; + }; + }; + } +} declare namespace sap { interface IUI5DefineDependencyNames { diff --git a/types/openui5/sap.ui.fl.d.ts b/types/openui5/sap.ui.fl.d.ts index 51e56f5fbb862c..3e32fae42cd4ae 100644 --- a/types/openui5/sap.ui.fl.d.ts +++ b/types/openui5/sap.ui.fl.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/fl/library" {} @@ -12,10 +12,11 @@ declare module "sap/ui/fl/apply/api/ControlVariantApplyAPI" { */ interface ControlVariantApplyAPI { /** - * Activates the passed variant applicable to the passed control/component. If the Variant is not available - * and the backend supports lazy loading, a backend request is made to fetch the variant. If the flag standardVariant - * is set to true, the standard variant is activated and the variantReference is ignored. In this scenario - * the passed element must be the variant management control. + * Activates the passed variant applicable to the passed control/component. The corresponding variant management + * control must be available when this function is called. If the variant is not found and the backend supports + * lazy loading, a backend request is made to fetch the variant. If the flag standardVariant is set to true, + * the standard variant is activated and the variantReference is ignored: in this scenario, the passed element + * must be the variant management control. * * * @returns Resolves after the variant is activated or rejects if an error occurs @@ -1621,8 +1622,6 @@ declare namespace sap { "sap/ui/fl/apply/_internal/preprocessors/ComponentLifecycleHooks": undefined; - "sap/ui/fl/apply/_internal/preprocessors/ControllerExtension": undefined; - "sap/ui/fl/apply/api/AnnotationChangeHandlerAPI": undefined; "sap/ui/fl/apply/api/ControlVariantApplyAPI": undefined; @@ -1667,6 +1666,8 @@ declare namespace sap { "sap/ui/fl/initial/_internal/connectors/Utils": undefined; + "sap/ui/fl/initial/_internal/preprocessors/ControllerExtension": undefined; + "sap/ui/fl/initial/_internal/Settings": undefined; "sap/ui/fl/initial/_internal/Storage": undefined; diff --git a/types/openui5/sap.ui.integration.d.ts b/types/openui5/sap.ui.integration.d.ts index 59078ad0e52668..b60b247c8f8d91 100644 --- a/types/openui5/sap.ui.integration.d.ts +++ b/types/openui5/sap.ui.integration.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/integration/library" { import { URI } from "sap/ui/core/library"; diff --git a/types/openui5/sap.ui.layout.d.ts b/types/openui5/sap.ui.layout.d.ts index 7d7c3a809adc3c..82f69adeb6ef75 100644 --- a/types/openui5/sap.ui.layout.d.ts +++ b/types/openui5/sap.ui.layout.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/layout/library" { import Control from "sap/ui/core/Control"; @@ -6516,23 +6516,27 @@ declare module "sap/ui/layout/form/Form" { * A `Form` control arranges labels and fields (like input fields) into groups and rows. There are different * ways to visualize forms for different screen sizes. * - * A `Form` is structured into `FormContainers`. Each `FormContainer` consists of `FormElements`. The `FormElements` - * consists of a label and the form fields. A `Form` doesn't render its content by itself. The rendering - * is done by the assigned `FormLayout`. This is so that the rendering can be adopted to new UI requirements - * without changing the `Form` itself. + * A `Form` is structured into `FormContainers`. Each {@link sap.ui.layout.form.FormContainer FormContainer } + * consists of `FormElements`. The {@link sap.ui.layout.form.FormElement FormElement} consists of a label + * and the form fields. A `Form` doesn't render its content on its own. The rendering is done by the assigned + * {@link sap.ui.layout.form.FormLayout FormLayout}. This is so that the rendering can be adopted to new + * UI requirements without changing the `Form` itself. * - * For the content of a `Form`, `VariantLayoutData` are supported to allow simple switching of the `FormLayout`. - * `LayoutData` on the content can be used to overwrite the default layout of the `Form`. + * For the content of a `Form`, {@link sap.ui.core.VariantLayoutData VariantLayoutData} are supported to + * allow simple switching of the `FormLayout`. `LayoutData` on the content can be used to overwrite the + * default layout of the `Form`. * * The `Form` (and its sub-controls) automatically add label and field assignment to enable screen reader * support. It also adds keyboard support to navigate between the fields and groups inside the form. * - * **Warning:** Do not put any layout or other container controls into the `FormElement`. Views are also - * not supported. This could damage the visual layout, keyboard support and screen-reader support. + * **Warning:** Do not put any layout or other container controls into the {@link sap.ui.layout.form.FormElement FormElement}. + * Views are also not supported. This could damage the visual layout, keyboard support and screen-reader + * support. * * If editable controls are used as content, the `editable` property must be set to `true`, otherwise to * `false`. If the `editable` property is set incorrectly, there will be visual issues like wrong label - * alignment or wrong spacing between the controls. + * alignment or wrong spacing between the controls. In addition to that, wrong screen reader announcements + * might occur. * * @since 1.16.0 */ @@ -6673,7 +6677,8 @@ declare module "sap/ui/layout/form/Form" { * * **Warning:** If this property is wrongly set, this might lead to visual issues. The labels and fields * might be misaligned, the labels might be rendered in the wrong mode, and the spacing between the single - * controls might be wrong. Also, controls that do not fit the mode might be rendered incorrectly. + * controls might be wrong. Also, controls that do not fit the mode might be rendered incorrectly. In addition + * to that, wrong screen reader announcements might occur. * * Default value is `false`. * @@ -6817,7 +6822,8 @@ declare module "sap/ui/layout/form/Form" { * * **Warning:** If this property is wrongly set, this might lead to visual issues. The labels and fields * might be misaligned, the labels might be rendered in the wrong mode, and the spacing between the single - * controls might be wrong. Also, controls that do not fit the mode might be rendered incorrectly. + * controls might be wrong. Also, controls that do not fit the mode might be rendered incorrectly. In addition + * to that, wrong screen reader announcements might occur. * * When called with a value of `null` or `undefined`, the default value of the property will be restored. * @@ -6908,7 +6914,8 @@ declare module "sap/ui/layout/form/Form" { * * **Warning:** If this property is wrongly set, this might lead to visual issues. The labels and fields * might be misaligned, the labels might be rendered in the wrong mode, and the spacing between the single - * controls might be wrong. Also, controls that do not fit the mode might be rendered incorrectly. + * controls might be wrong. Also, controls that do not fit the mode might be rendered incorrectly. In addition + * to that, wrong screen reader announcements might occur. * * @since 1.20.0 */ @@ -9528,7 +9535,7 @@ declare module "sap/ui/layout/form/SimpleForm" { * a `{@link sap.ui.layout.form.Form Form}` control is created along with its `{@link sap.ui.layout.form.FormContainer FormContainer}` * elements and `{@link sap.ui.layout.form.FormElement FormElement}` elements, but the complexity in the * API is not exposed to the user. - * - A new `sap.ui.core.Title` element or `Toolbar` control starts a new group (`{@link sap.ui.layout.form.FormContainer FormContainer}`) + * - A new {@link sap.ui.core.Title Title} element or `Toolbar` control starts a new group (`{@link sap.ui.layout.form.FormContainer FormContainer}`) * in the form. * - A new `Label` control starts a new row (`{@link sap.ui.layout.form.FormElement FormElement}`) in * the form. @@ -9784,7 +9791,7 @@ declare module "sap/ui/layout/form/SimpleForm" { * Gets content of aggregation {@link #getContent content}. * * The content of the form is structured in the following way: - * - Add a `sap.ui.core.Title` element or `Toolbar` control to start a new group (`{@link sap.ui.layout.form.FormContainer FormContainer}`). + * - Add a {@link sap.ui.core.Title Title} element or `Toolbar` control to start a new group (`{@link sap.ui.layout.form.FormContainer FormContainer}`). * * - Add a `Label` control to start a new row (`{@link sap.ui.layout.form.FormElement FormElement}`). * @@ -9792,26 +9799,28 @@ declare module "sap/ui/layout/form/SimpleForm" { * - Use `LayoutData` to influence the layout for special cases in the single controls. For example, if * a `ColumnLayout` is used as a layout, the form content is weighted using 4 cells for the labels and 8 * cells for the field part, for large size. If there is only little space, the labels are above the fields - * and each field uses 12 cells. If your input controls should influence their width, you can add `sap.ui.layout.ColumnElementData` - * to them via `setLayoutData` method. Ensure that the sum of the weights in the `ColumnElementData` is - * not more than 12, as this is the total width of the input control part of each form row. Example - * for a row where the `Input` uses 6 cells and the second `Input` uses 2 cells (using `ColumnElementData`): + * and each field uses 12 cells. If your input controls should influence their width, you can add {@link sap.ui.layout.form.ColumnElementData ColumnElementData } + * to them via the {@link #setLayoutData setLayoutData} method. Ensure that the sum of the weights in the + * {@link sap.ui.layout.form.ColumnElementData ColumnElementData} is not more than 12, as this is the total + * width of the input control part of each form row. Example for a row where the {@link sap.m.Input Input } + * uses 6 cells and the second {@link sap.m.Input Input} uses 2 cells (using {@link sap.ui.layout.form.ColumnElementData ColumnElementData}): * * ```javascript * * new sap.m.Label({text:"Label"}); - * new sap.m.Input({value:"6 cells", layoutData: new sap.ui.layout.ColumnElementData({cellsLarge: 6, cellsSmall: 8})}), - * new sap.m.Input({value:"2 cells", layoutData: new sap.ui.layout.ColumnElementData({cellsLarge: 2, cellsSmall: 4})}), + * new sap.m.Input({value:"6 cells", layoutData: new sap.ui.layout.form.ColumnElementData({cellsLarge: 6, cellsSmall: 8})}), + * new sap.m.Input({value:"2 cells", layoutData: new sap.ui.layout.form.ColumnElementData({cellsLarge: 2, cellsSmall: 4})}), * ``` * * - * For example, if a `ResponsiveGridLayout` is used as a layout, there are 12 cells in one row. Depending - * on the screen size the labels use the defined `labelSpan`. The remaining cells are used for the fields - * (and `emptySpan` if defined). The available cells are distributed to all fields in the row. If one field - * should use a fixed number of cells you can add `sap.ui.layout.GridData` to them via `setLayoutData` method. - * If there are additional fields in the row they will get the remaining cells. Example for a row - * with two `Input` controls where one uses four cells on small screens, one cell on medium screens and - * 2 cells on larger screens (using `ResponsiveGridLayout`): + * For example, if a {@link sap.ui.layout.ResponsiveGridLayout ResponsiveGridLayout} is used as a layout, + * there are 12 cells in one row. Depending on the screen size the labels use the defined `labelSpan`. The + * remaining cells are used for the fields (and `emptySpan` if defined). The available cells are distributed + * to all fields in the row. If one field should use a fixed number of cells you can add {@link sap.ui.layout.GridData GridData } + * to them via the {@link #setLayoutData setLayoutData} method. If there are additional fields in the row + * they will get the remaining cells. Example for a row with two {@link sap.m.Input Input} controls + * where one uses four cells on small screens, one cell on medium screens and 2 cells on larger screens + * (using {@link sap.ui.layout.ResponsiveGridLayout ResponsiveGridLayout}): * ```javascript * * new sap.m.Label({text:"Label"}); @@ -9826,7 +9835,8 @@ declare module "sap/ui/layout/form/SimpleForm" { * * If editable controls are used as content, the `editable` property must be set to `true`, otherwise to * `false`. If the `editable` property is set incorrectly, there will be visual issues like wrong label - * alignment or wrong spacing between the controls. + * alignment or wrong spacing between the controls. In addition to that, wrong screen reader announcements + * might occur. */ getContent(): UI5Element[]; /** @@ -9843,7 +9853,8 @@ declare module "sap/ui/layout/form/SimpleForm" { * * **Warning:** If this property is wrongly set, this might lead to visual issues. The labels and fields * might be misaligned, the labels might be rendered in the wrong mode, and the spacing between the single - * controls might be wrong. Also, controls that do not fit the mode might be rendered incorrectly. + * controls might be wrong. Also, controls that do not fit the mode might be rendered incorrectly. In addition + * to that, wrong screen reader announcements might occur. * * Default value is `false`. * @@ -10364,7 +10375,8 @@ declare module "sap/ui/layout/form/SimpleForm" { * * **Warning:** If this property is wrongly set, this might lead to visual issues. The labels and fields * might be misaligned, the labels might be rendered in the wrong mode, and the spacing between the single - * controls might be wrong. Also, controls that do not fit the mode might be rendered incorrectly. + * controls might be wrong. Also, controls that do not fit the mode might be rendered incorrectly. In addition + * to that, wrong screen reader announcements might occur. * * When called with a value of `null` or `undefined`, the default value of the property will be restored. * @@ -10771,7 +10783,8 @@ declare module "sap/ui/layout/form/SimpleForm" { * * **Warning:** If this property is wrongly set, this might lead to visual issues. The labels and fields * might be misaligned, the labels might be rendered in the wrong mode, and the spacing between the single - * controls might be wrong. Also, controls that do not fit the mode might be rendered incorrectly. + * controls might be wrong. Also, controls that do not fit the mode might be rendered incorrectly. In addition + * to that, wrong screen reader announcements might occur. */ editable?: boolean | PropertyBindingInfo | `{${string}}`; @@ -10987,7 +11000,7 @@ declare module "sap/ui/layout/form/SimpleForm" { /** * The content of the form is structured in the following way: - * - Add a `sap.ui.core.Title` element or `Toolbar` control to start a new group (`{@link sap.ui.layout.form.FormContainer FormContainer}`). + * - Add a {@link sap.ui.core.Title Title} element or `Toolbar` control to start a new group (`{@link sap.ui.layout.form.FormContainer FormContainer}`). * * - Add a `Label` control to start a new row (`{@link sap.ui.layout.form.FormElement FormElement}`). * @@ -10995,26 +11008,28 @@ declare module "sap/ui/layout/form/SimpleForm" { * - Use `LayoutData` to influence the layout for special cases in the single controls. For example, if * a `ColumnLayout` is used as a layout, the form content is weighted using 4 cells for the labels and 8 * cells for the field part, for large size. If there is only little space, the labels are above the fields - * and each field uses 12 cells. If your input controls should influence their width, you can add `sap.ui.layout.ColumnElementData` - * to them via `setLayoutData` method. Ensure that the sum of the weights in the `ColumnElementData` is - * not more than 12, as this is the total width of the input control part of each form row. Example - * for a row where the `Input` uses 6 cells and the second `Input` uses 2 cells (using `ColumnElementData`): + * and each field uses 12 cells. If your input controls should influence their width, you can add {@link sap.ui.layout.form.ColumnElementData ColumnElementData } + * to them via the {@link #setLayoutData setLayoutData} method. Ensure that the sum of the weights in the + * {@link sap.ui.layout.form.ColumnElementData ColumnElementData} is not more than 12, as this is the total + * width of the input control part of each form row. Example for a row where the {@link sap.m.Input Input } + * uses 6 cells and the second {@link sap.m.Input Input} uses 2 cells (using {@link sap.ui.layout.form.ColumnElementData ColumnElementData}): * * ```javascript * * new sap.m.Label({text:"Label"}); - * new sap.m.Input({value:"6 cells", layoutData: new sap.ui.layout.ColumnElementData({cellsLarge: 6, cellsSmall: 8})}), - * new sap.m.Input({value:"2 cells", layoutData: new sap.ui.layout.ColumnElementData({cellsLarge: 2, cellsSmall: 4})}), + * new sap.m.Input({value:"6 cells", layoutData: new sap.ui.layout.form.ColumnElementData({cellsLarge: 6, cellsSmall: 8})}), + * new sap.m.Input({value:"2 cells", layoutData: new sap.ui.layout.form.ColumnElementData({cellsLarge: 2, cellsSmall: 4})}), * ``` * * - * For example, if a `ResponsiveGridLayout` is used as a layout, there are 12 cells in one row. Depending - * on the screen size the labels use the defined `labelSpan`. The remaining cells are used for the fields - * (and `emptySpan` if defined). The available cells are distributed to all fields in the row. If one field - * should use a fixed number of cells you can add `sap.ui.layout.GridData` to them via `setLayoutData` method. - * If there are additional fields in the row they will get the remaining cells. Example for a row - * with two `Input` controls where one uses four cells on small screens, one cell on medium screens and - * 2 cells on larger screens (using `ResponsiveGridLayout`): + * For example, if a {@link sap.ui.layout.ResponsiveGridLayout ResponsiveGridLayout} is used as a layout, + * there are 12 cells in one row. Depending on the screen size the labels use the defined `labelSpan`. The + * remaining cells are used for the fields (and `emptySpan` if defined). The available cells are distributed + * to all fields in the row. If one field should use a fixed number of cells you can add {@link sap.ui.layout.GridData GridData } + * to them via the {@link #setLayoutData setLayoutData} method. If there are additional fields in the row + * they will get the remaining cells. Example for a row with two {@link sap.m.Input Input} controls + * where one uses four cells on small screens, one cell on medium screens and 2 cells on larger screens + * (using {@link sap.ui.layout.ResponsiveGridLayout ResponsiveGridLayout}): * ```javascript * * new sap.m.Label({text:"Label"}); @@ -11029,7 +11044,8 @@ declare module "sap/ui/layout/form/SimpleForm" { * * If editable controls are used as content, the `editable` property must be set to `true`, otherwise to * `false`. If the `editable` property is set incorrectly, there will be visual issues like wrong label - * alignment or wrong spacing between the controls. + * alignment or wrong spacing between the controls. In addition to that, wrong screen reader announcements + * might occur. */ content?: | UI5Element[] diff --git a/types/openui5/sap.ui.mdc.d.ts b/types/openui5/sap.ui.mdc.d.ts index fc90ea4ef36efe..7440d5de7a9bd9 100644 --- a/types/openui5/sap.ui.mdc.d.ts +++ b/types/openui5/sap.ui.mdc.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/mdc/AggregationBaseDelegate" { import BaseDelegate from "sap/ui/mdc/BaseDelegate"; @@ -1953,9 +1953,9 @@ declare module "sap/ui/mdc/odata/v4/TableDelegate" { * If an update is not possible, it rebinds the table. * * Compares the current and previous state of the table to detect whether rebinding is necessary. The diffing - * is done for the sorters, filters, aggregation, parameters. Other {@link sap.ui.base.ManagedObject.AggregationBindingInfo binding info } - * keys, such as `path`, `events`, or `model`, must be provided in `updateBindingInfo`, and those keys must - * not be changed conditionally. + * is done for the sorters, filters, aggregation, parameters, and the path of the binding. Other {@link sap.ui.base.ManagedObject.AggregationBindingInfo binding info } + * keys, such as `events` or `model`, must be provided in `updateBindingInfo`, and those keys must not be + * changed conditionally. * * **Note:** To remove a binding info parameter, the value must be set to `undefined` in `updateBindingInfo`. * For more information, see {@link sap.ui.model.odata.v4.ODataListBinding#changeParameters}. diff --git a/types/openui5/sap.ui.rta.d.ts b/types/openui5/sap.ui.rta.d.ts index c4d9a7fee5683f..811541bcb24b38 100644 --- a/types/openui5/sap.ui.rta.d.ts +++ b/types/openui5/sap.ui.rta.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/rta/api/startAdaptation" { import Control from "sap/ui/core/Control"; diff --git a/types/openui5/sap.ui.suite.d.ts b/types/openui5/sap.ui.suite.d.ts index 7b93d6b0ecb7ff..e76defba125c8d 100644 --- a/types/openui5/sap.ui.suite.d.ts +++ b/types/openui5/sap.ui.suite.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/suite/library" { /** diff --git a/types/openui5/sap.ui.support.d.ts b/types/openui5/sap.ui.support.d.ts index 3331aa4399dff4..b8c7bf7f95db0f 100644 --- a/types/openui5/sap.ui.support.d.ts +++ b/types/openui5/sap.ui.support.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/support/library" { /** diff --git a/types/openui5/sap.ui.table.d.ts b/types/openui5/sap.ui.table.d.ts index cfe6914a2081fa..0848160040bb10 100644 --- a/types/openui5/sap.ui.table.d.ts +++ b/types/openui5/sap.ui.table.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/table/library" { import TreeAutoExpandMode1 from "sap/ui/model/TreeAutoExpandMode"; @@ -619,9 +619,11 @@ declare module "sap/ui/table/AnalyticalTable" { import Event from "sap/ui/base/Event"; /** - * Table that handles analytical OData back-end scenarios. The `AnalyticalTable` only works with {@link sap.ui.model.analytics.AnalyticalBinding AnalyticalBinding } + * Table that handles analytical OData V2 back-end scenarios. The `AnalyticalTable` only works with {@link sap.ui.model.analytics.AnalyticalBinding AnalyticalBinding } * and correctly annotated OData services. Please check out the functionality of analytical binding and - * the SAP Annotations for OData Version 2.0 documentation for further details. + * the SAP Annotations for OData Version 2.0 documentation for further details. For an analytical-table-like + * behavior with OData V4 services, use the {@link sap.ui.table.Table Table} control with the {@link sap.ui.table.plugins.ODataV4Aggregation ODataV4Aggregation } + * plugin. */ export default class AnalyticalTable extends Table { /** @@ -632,6 +634,7 @@ declare module "sap/ui/table/AnalyticalTable" { * of the syntax of the settings object. * See: * https://github.com/SAP/odata-vocabularies/blob/main/docs/v2-annotations.md + * {@link https://ui5.sap.com/#/topic/148892ff9aea4a18b912829791e38f3e Tables: Which One Should I Choose?} * {@link https://ui5.sap.com/#/topic/08197fa68e4f479cbe30f639cc1cd22c sap.ui.table} * {@link fiori:/analytical-table-alv/ Analytical Table} */ @@ -649,6 +652,7 @@ declare module "sap/ui/table/AnalyticalTable" { * of the syntax of the settings object. * See: * https://github.com/SAP/odata-vocabularies/blob/main/docs/v2-annotations.md + * {@link https://ui5.sap.com/#/topic/148892ff9aea4a18b912829791e38f3e Tables: Which One Should I Choose?} * {@link https://ui5.sap.com/#/topic/08197fa68e4f479cbe30f639cc1cd22c sap.ui.table} * {@link fiori:/analytical-table-alv/ Analytical Table} */ @@ -3584,6 +3588,10 @@ declare module "sap/ui/table/plugins/ODataV4Aggregation" { * * For details about data aggregation, see {@link sap.ui.model.odata.v4.ODataListBinding#setAggregation}. * + * In combination with the {@link sap.ui.table.Table Table} control, this plugin offers a UI for OData V4 + * that is similar to the one the {@link sap.ui.table.AnalyticalTable AnalyticalTable} offers for OData + * V2. + * * @since 1.140 */ export default class ODataV4Aggregation extends UI5Element { @@ -3748,6 +3756,9 @@ declare module "sap/ui/table/plugins/ODataV4Hierarchy" { * * For details about hierarchies, see {@link sap.ui.model.odata.v4.ODataListBinding#setAggregation}. * + * In combination with the {@link sap.ui.table.Table Table} control, this plugin offers a UI for OData V4 + * that is similar to the one the {@link sap.ui.table.TreeTable TreeTable} offers for other models. + * * @since 1.140 */ export default class ODataV4Hierarchy extends UI5Element { @@ -11231,7 +11242,10 @@ declare module "sap/ui/table/TreeTable" { import Event from "sap/ui/base/Event"; /** - * The TreeTable control provides a comprehensive set of features to display hierarchical data. + * The TreeTable control provides a comprehensive set of features to display hierarchical data. The control + * can be used in combination with {@link sap.ui.model.json.JSONModel JSONModel} and {@link sap.ui.model.odata.v2.ODataModel ODataModel V2}. + * For a tree-table-like behavior with OData V4 services, use the {@link sap.ui.table.Table Table} control + * with the {@link sap.ui.table.plugins.ODataV4Hierarchy ODataV4Hierarchy} plugin. */ export default class TreeTable extends Table { /** diff --git a/types/openui5/sap.ui.testrecorder.d.ts b/types/openui5/sap.ui.testrecorder.d.ts index 78bd68d338ea35..7486144de79350 100644 --- a/types/openui5/sap.ui.testrecorder.d.ts +++ b/types/openui5/sap.ui.testrecorder.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/testrecorder/library" {} diff --git a/types/openui5/sap.ui.unified.d.ts b/types/openui5/sap.ui.unified.d.ts index 0bde66acf9743d..ac8222b6656a1c 100644 --- a/types/openui5/sap.ui.unified.d.ts +++ b/types/openui5/sap.ui.unified.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/unified/library" { /** @@ -7657,9 +7657,9 @@ declare module "sap/ui/unified/CalendarAppointment" { $DateTypeRangeSettings, } from "sap/ui/unified/DateTypeRange"; - import Control from "sap/ui/core/Control"; + import { ID, CSSColor, URI } from "sap/ui/core/library"; - import { CSSColor, URI } from "sap/ui/core/library"; + import Control from "sap/ui/core/Control"; import ElementMetadata from "sap/ui/core/ElementMetadata"; @@ -7739,6 +7739,18 @@ declare module "sap/ui/unified/CalendarAppointment" { * @returns Metadata object describing this class */ static getMetadata(): ElementMetadata; + /** + * Adds some ariaLabelledBy into the association {@link #getAriaLabelledBy ariaLabelledBy}. + * + * + * @returns Reference to `this` in order to allow method chaining + */ + addAriaLabelledBy( + /** + * The ariaLabelledBy to add; if empty, nothing is inserted + */ + vAriaLabelledBy: ID | Control + ): this; /** * Adds some customContent to the aggregation {@link #getCustomContent customContent}. * @@ -7760,6 +7772,10 @@ declare module "sap/ui/unified/CalendarAppointment" { * @returns Reference to `this` in order to allow method chaining */ destroyCustomContent(): this; + /** + * Returns array of IDs of the elements which are the current targets of the association {@link #getAriaLabelledBy ariaLabelledBy}. + */ + getAriaLabelledBy(): ID[]; /** * Gets current value of property {@link #getColor color}. * @@ -7785,6 +7801,12 @@ declare module "sap/ui/unified/CalendarAppointment" { * - Do not use interactive controls as content, as they may trigger unwanted selection of the appointment * and may lead to unpredictable results. * + * **Note:** When using the `customContent` aggregation, it is the application developer's responsibility + * to add appropriate labels to the `ariaLabelledBy` association to provide accessible information about + * this appointment as the standard properties (`title`, `text`, `description`, and `icon`) are ignored, + * which means screen readers will have no information about the appointment unless proper ARIA labeling + * is implemented. + * * @since 1.93.0 */ getCustomContent(): Control[]; @@ -7891,6 +7913,13 @@ declare module "sap/ui/unified/CalendarAppointment" { */ iIndex: int ): this; + /** + * Removes all the controls in the association named {@link #getAriaLabelledBy ariaLabelledBy}. + * + * + * @returns An array of the removed elements (might be empty) + */ + removeAllAriaLabelledBy(): ID[]; /** * Removes all the controls from the aggregation {@link #getCustomContent customContent}. * @@ -7901,6 +7930,18 @@ declare module "sap/ui/unified/CalendarAppointment" { * @returns An array of the removed elements (might be empty) */ removeAllCustomContent(): Control[]; + /** + * Removes an ariaLabelledBy from the association named {@link #getAriaLabelledBy ariaLabelledBy}. + * + * + * @returns The removed ariaLabelledBy or `null` + */ + removeAriaLabelledBy( + /** + * The ariaLabelledBy to be removed or its index or ID + */ + vAriaLabelledBy: int | ID | Control + ): ID | null; /** * Removes a customContent from the aggregation {@link #getCustomContent customContent}. * @@ -8115,6 +8156,12 @@ declare module "sap/ui/unified/CalendarAppointment" { * - Do not use interactive controls as content, as they may trigger unwanted selection of the appointment * and may lead to unpredictable results. * + * **Note:** When using the `customContent` aggregation, it is the application developer's responsibility + * to add appropriate labels to the `ariaLabelledBy` association to provide accessible information about + * this appointment as the standard properties (`title`, `text`, `description`, and `icon`) are ignored, + * which means screen readers will have no information about the appointment unless proper ARIA labeling + * is implemented. + * * @since 1.93.0 */ customContent?: @@ -8122,6 +8169,11 @@ declare module "sap/ui/unified/CalendarAppointment" { | Control | AggregationBindingInfo | `{${string}}`; + + /** + * Association to controls / ids which label this control (see WAI-ARIA attribute aria-labelledBy). + */ + ariaLabelledBy?: Array; } } diff --git a/types/openui5/sap.ui.ux3.d.ts b/types/openui5/sap.ui.ux3.d.ts index cb9cf754dfbc56..9ff3ec7b544257 100644 --- a/types/openui5/sap.ui.ux3.d.ts +++ b/types/openui5/sap.ui.ux3.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/ux3/library" { /** diff --git a/types/openui5/sap.ui.webc.common.d.ts b/types/openui5/sap.ui.webc.common.d.ts index 1ba1b21f743726..0276291b315885 100644 --- a/types/openui5/sap.ui.webc.common.d.ts +++ b/types/openui5/sap.ui.webc.common.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/webc/common/library" {} diff --git a/types/openui5/sap.ui.webc.fiori.d.ts b/types/openui5/sap.ui.webc.fiori.d.ts index cafbaaafe6e2ab..e50f14f4cdbafe 100644 --- a/types/openui5/sap.ui.webc.fiori.d.ts +++ b/types/openui5/sap.ui.webc.fiori.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/webc/fiori/library" { /** diff --git a/types/openui5/sap.ui.webc.main.d.ts b/types/openui5/sap.ui.webc.main.d.ts index a3ecc2be28b720..6b4e6e26b75aca 100644 --- a/types/openui5/sap.ui.webc.main.d.ts +++ b/types/openui5/sap.ui.webc.main.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/ui/webc/main/library" { /** diff --git a/types/openui5/sap.uxap.d.ts b/types/openui5/sap.uxap.d.ts index 9e6e70d694e857..b2363f3234488f 100644 --- a/types/openui5/sap.uxap.d.ts +++ b/types/openui5/sap.uxap.d.ts @@ -1,4 +1,4 @@ -// For Library Version: 1.140.0 +// For Library Version: 1.141.0 declare module "sap/uxap/library" { /** diff --git a/types/react-cytoscapejs/index.d.ts b/types/react-cytoscapejs/index.d.ts index 9d25f57e57c220..6f26d5ff855a8c 100644 --- a/types/react-cytoscapejs/index.d.ts +++ b/types/react-cytoscapejs/index.d.ts @@ -7,7 +7,7 @@ interface CytoscapeComponentProps { style?: CSSProperties | undefined; elements: cytoscape.ElementDefinition[]; layout?: cytoscape.LayoutOptions | undefined; - stylesheet?: cytoscape.Stylesheet | cytoscape.Stylesheet[] | string | undefined; + stylesheet?: cytoscape.StylesheetJsonBlock | cytoscape.StylesheetJsonBlock[] | string | undefined; className?: string | undefined; zoom?: number | undefined; pan?: cytoscape.Position | undefined; diff --git a/types/react-cytoscapejs/package.json b/types/react-cytoscapejs/package.json index 7cc0dfcece218c..7585ba3a2f8407 100644 --- a/types/react-cytoscapejs/package.json +++ b/types/react-cytoscapejs/package.json @@ -6,8 +6,8 @@ "https://github.com/plotly/react-cytoscapejs" ], "dependencies": { - "@types/cytoscape": "*", - "@types/react": "*" + "@types/react": "*", + "cytoscape": "^3.31" }, "devDependencies": { "@types/react-cytoscapejs": "workspace:."