@progress/kendo-charts 2.4.0-dev.202405211537 → 2.4.0-dev.202406100726

package/dist/es2015/sankey/sankey.js

@@ -13,6 +13,27 @@ import { defined } from '../drawing-utils';
 const LINK = 'link';
 const NODE = 'node';
 
+const toRtl = sankey => {
+    const { nodes, links } = sankey;
+    const startX = Math.min(...nodes.map(node => node.x0));
+    const endX = Math.max(...nodes.map(node => node.x1));
+    const width = endX - startX;
+
+    nodes.forEach(node => {
+        const x0 = width - (node.x1 - 2 * startX);
+        const x1 = width - (node.x0 - 2 * startX);
+        node.x0 = x0;
+        node.x1 = x1;
+    });
+
+    links.forEach(link => {
+        const x0 = width - (link.x1 - 2 * startX);
+        const x1 = width - (link.x0 - 2 * startX);
+        link.x1 = x0;
+        link.x0 = x1;
+    });
+};
+
 export class Sankey extends Observable {
     constructor(element, options, theme) {
         super();
@@ -91,11 +112,15 @@ export class Sankey extends Observable {
         element.addEventListener('pointerdown', this._onDownHandler);
 
         this._focusState = {
-            node: this.columns[0][0],
+            node: this.firstFocusableNode(),
             link: null
         };
     }
 
+    firstFocusableNode() {
+        return this.columns[0][0];
+    }
+
     _initResizeObserver() {
         const observer = new ResizeObserver((entries) => {
             entries.forEach(entry => {
@@ -147,10 +172,13 @@ export class Sankey extends Observable {
     }
 
     trigger(name, ev) {
+        let dataItem = ev.element.dataItem;
+        const targetType = ev.element.type;
+
         const event = Object.assign({}, ev,
             {type: name,
-            targetType: ev.element.type,
-            dataItem: ev.element.dataItem});
+            targetType,
+            dataItem: dataItem});
 
         return super.trigger(name, event);
     }
@@ -416,7 +444,14 @@ export class Sankey extends Observable {
     }
 
     _keydown(ev) {
-        const handler = this['on' + ev.key];
+        let handler = this['on' + ev.key];
+        const rtl = this.options.rtl;
+
+        if (rtl && ev.key === 'ArrowLeft') {
+            handler = this.onArrowRight;
+        } else if (rtl && ev.key === 'ArrowRight') {
+            handler = this.onArrowLeft;
+        }
 
         if (handler) {
             handler.call(this, ev);
@@ -426,7 +461,7 @@ export class Sankey extends Observable {
     onEscape(ev) {
         ev.preventDefault();
 
-        this._focusState = { node: this.columns[0][0], link: null };
+        this._focusState = { node: this.firstFocusableNode(), link: null };
         this._focusNode();
     }
 
@@ -557,7 +592,7 @@ export class Sankey extends Observable {
     }
 
     calculateSankey(calcOptions, sankeyOptions) {
-        const { title, legend, data, nodes, labels, nodeColors, disableAutoLayout, disableKeyboardNavigation } = sankeyOptions;
+        const { title, legend, data, nodes, labels, nodeColors, disableAutoLayout, disableKeyboardNavigation, rtl } = sankeyOptions;
         const autoLayout = !disableAutoLayout;
         const padding = disableKeyboardNavigation ? 0 : highlightOptions.width / 2;
 
@@ -608,12 +643,20 @@ export class Sankey extends Observable {
 
         const box = new Box();
 
+        const diagramMinX = calculatedNodes.reduce((acc, node) => Math.min(acc, node.x0), Infinity);
+        const diagramMaxX = calculatedNodes.reduce((acc, node) => Math.max(acc, node.x1), 0);
+
         calculatedNodes.forEach((nodeEl, i) => {
+            if (rtl) {
+                const { x0, x1 } = nodeEl;
+                nodeEl.x0 = diagramMaxX - x1;
+                nodeEl.x1 = diagramMaxX - x0;
+            }
             const nodeOps = resolveNodeOptions(nodeEl, nodes, nodeColors, i);
             const nodeInstance = new Node(nodeOps);
             box.wrap(rectToBox(nodeInstance.exportVisual().rawBBox()));
 
-            const labelInstance = new Label(resolveLabelOptions(nodeEl, labels, sankeyBox.width()));
+            const labelInstance = new Label(resolveLabelOptions(nodeEl, labels, rtl, diagramMinX, diagramMaxX));
             const labelVisual = labelInstance.exportVisual();
             if (labelVisual) {
                 box.wrap(rectToBox(labelVisual.rawBBox()));
@@ -687,11 +730,15 @@ export class Sankey extends Observable {
         const sankeyOptions = options || this.options;
         const sankeyContext = context || this;
 
-        const { data, labels: labelOptions, nodes: nodesOptions, links: linkOptions, nodeColors, title, legend, disableKeyboardNavigation } = sankeyOptions;
+        const { labels: labelOptions, nodes: nodesOptions, links: linkOptions, nodeColors, title, legend, rtl, disableKeyboardNavigation } = sankeyOptions;
+        let data = sankeyOptions.data;
         const { width, height } = sankeyContext.size;
 
         const calcOptions = Object.assign({}, data, {width, height, nodesOptions, title, legend});
         const { sankey, titleBox, legendBox } = this.calculateSankey(calcOptions, sankeyOptions);
+        if (rtl) {
+            toRtl(sankey);
+        }
         const { nodes, links, columns } = sankey;
 
         sankeyContext.columns = columns.map(column => {
@@ -767,10 +814,11 @@ export class Sankey extends Observable {
             const { source, target } = link;
             const sourceNode = visualNodes.get(source.id);
             const targetNode = visualNodes.get(target.id);
-            const linkOps = resolveLinkOptions(link, linkOptions, sourceNode, targetNode);
-            linkOps.root = () => sankeyContext.element;
-            linkOps.navigatable = disableKeyboardNavigation !== true;
-            const linkInstance = new Link(linkOps);
+            const resolvedOptions = resolveLinkOptions(link, linkOptions, sourceNode, targetNode);
+            resolvedOptions.root = () => sankeyContext.element;
+            resolvedOptions.navigatable = disableKeyboardNavigation !== true;
+            resolvedOptions.rtl = rtl;
+            const linkInstance = new Link(resolvedOptions);
             const linkVisual = linkInstance.exportVisual();
 
             linkVisual.type = LINK;
@@ -779,7 +827,7 @@ export class Sankey extends Observable {
                 target: Object.assign({}, targetNode.dataItem),
                 value: link.value
             };
-            linkVisual.linkOptions = linkOps;
+            linkVisual.linkOptions = resolvedOptions;
             linksVisuals.push(linkVisual);
 
             sourceNode.links.push(linkVisual);
@@ -797,9 +845,11 @@ export class Sankey extends Observable {
             visual.append(linkVisual);
         });
 
-        const diagramWidth = nodes.reduce((acc, node) => Math.max(acc, node.x1), 0);
+        const diagramMinX = nodes.reduce((acc, node) => Math.min(acc, node.x0), Infinity);
+        const diagramMaxX = nodes.reduce((acc, node) => Math.max(acc, node.x1), 0);
+
         nodes.forEach((node) => {
-            const textOps = resolveLabelOptions(node, labelOptions, diagramWidth);
+            const textOps = resolveLabelOptions(node, labelOptions, rtl, diagramMinX, diagramMaxX);
             const labelInstance = new Label(textOps);
             const labelVisual = labelInstance.exportVisual();
 
@@ -809,7 +859,7 @@ export class Sankey extends Observable {
         });
 
         if (legendBox) {
-            const legendElement = new Legend(Object.assign({}, legend, {drawingRect: legendBox, nodes}));
+            const legendElement = new Legend(Object.assign({}, legend, {rtl, drawingRect: legendBox, nodes}));
             const legendVisual = legendElement.exportVisual();
             visual.append(legendVisual);
         }
@@ -867,7 +917,6 @@ setDefaultOptions(Sankey, {
             lineJoin: "round",
             width: 1
         },
-        align: LEFT,
         offset: { left: 0, top: 0 }
     },
     nodes: {

package/dist/es2015/services/dom-events-builder.js

@@ -1,4 +1,4 @@
-import { UserEvents } from '../map/scroller/user-events';
+import { UserEvents } from '../common';
 
 let current;
 
@@ -13,9 +13,7 @@ class DomEventsBuilder {
         if (current) {
             builder = current.create(element, events);
         } else {
-            builder = new UserEvents(element, Object.assign({}, {global: true,
-                multiTouch: true,
-                fastTap: true},
+            builder = new UserEvents(element, Object.assign({}, {multiTouch: true},
 
                 events));
         }