@progress/kendo-charts 2.4.0-dev.202405201104 → 2.4.0-dev.202405290547

package/dist/es/map/scroller/scroller.js

@@ -6,19 +6,19 @@ import {
     addClass,
     Observable,
     isFunction,
-    setDefaultOptions
+    setDefaultOptions,
+    on,
+    off,
+    UserEvents
 } from '../../common';
 
 import {
     convertToHtml,
     prepend,
     wrapInner,
-    contains,
     hasNativeScrolling,
-    on,
-    off,
-    proxy,
     wheelDeltaY,
+    proxy,
     setDefaultEvents
 } from '../utils';
 
@@ -34,10 +34,6 @@ import {
     TapCapture
 } from './draggable';
 
-import {
-    UserEvents
-} from './user-events';
-
 var
     extend = Object.assign,
     abs = Math.abs,
@@ -382,8 +378,7 @@ export var Scroller = (function (Observable) {
             avoidScrolling = this.options.avoidScrolling,
 
             userEvents = new UserEvents(element, {
-                touchAction: 'pan-y',
-                fastTap: true,
+                touchAction: 'none',
                 allowSelection: true,
                 preventDragEvent: true,
                 captureUpIfMoved: true,
@@ -394,7 +389,7 @@ export var Scroller = (function (Observable) {
                     var velocityX = abs(e.x.velocity),
                         velocityY = abs(e.y.velocity),
                         horizontalSwipe = velocityX * 2 >= velocityY,
-                        originatedFromFixedContainer = contains(that.fixedContainer, e.event.target),
+                        originatedFromFixedContainer = that.fixedContainer.contains(e.event.target),
                         verticalSwipe = velocityY * 2 >= velocityX;
                     if (!originatedFromFixedContainer && !avoidScrolling(e) && that.enabled && (dimensions.x.enabled && horizontalSwipe || dimensions.y.enabled && verticalSwipe)) {
                         userEvents.capture();

package/dist/es/map/utils.js

@@ -1,15 +1,13 @@
-import {
-    isFunction,
-    isArray,
-    hasOwnProperty
-} from '../common';
+import { getSupportedFeatures } from '../common';
 
 /* eslint-disable arrow-body-style, no-useless-escape */
 
-var defineProperty = Object.defineProperty;
-
 export var extend = Object.assign;
 
+export var proxy = function (method, context) {
+    return method.bind(context);
+};
+
 export var convertToHtml = function (html) {
     var div = document.createElement("div");
     div.innerHTML = html;
@@ -65,331 +63,10 @@ export var toPixels = function (value) {
     return result;
 };
 
-var detectOS = function (ua) {
-    var os = false, minorVersion, match = [],
-        // notAndroidPhone = !/mobile safari/i.test(ua),
-        agentRxs = {
-            wp: /(Windows Phone(?: OS)?)\s(\d+)\.(\d+(\.\d+)?)/,
-            fire: /(Silk)\/(\d+)\.(\d+(\.\d+)?)/,
-            android: /(Android|Android.*(?:Opera|Firefox).*?\/)\s*(\d+)\.?(\d+(\.\d+)?)?/,
-            iphone: /(iPhone|iPod).*OS\s+(\d+)[\._]([\d\._]+)/,
-            ipad: /(iPad).*OS\s+(\d+)[\._]([\d_]+)/,
-            meego: /(MeeGo).+NokiaBrowser\/(\d+)\.([\d\._]+)/,
-            webos: /(webOS)\/(\d+)\.(\d+(\.\d+)?)/,
-            blackberry: /(BlackBerry|BB10).*?Version\/(\d+)\.(\d+(\.\d+)?)/,
-            playbook: /(PlayBook).*?Tablet\s*OS\s*(\d+)\.(\d+(\.\d+)?)/,
-            windows: /(MSIE)\s+(\d+)\.(\d+(\.\d+)?)/,
-            tizen: /(tizen).*?Version\/(\d+)\.(\d+(\.\d+)?)/i,
-            sailfish: /(sailfish).*rv:(\d+)\.(\d+(\.\d+)?).*firefox/i,
-            ffos: /(Mobile).*rv:(\d+)\.(\d+(\.\d+)?).*Firefox/
-        },
-        osRxs = {
-            ios: /^i(phone|pad|pod)$/i,
-            android: /^android|fire$/i,
-            blackberry: /^blackberry|playbook/i,
-            windows: /windows/,
-            wp: /wp/,
-            flat: /sailfish|ffos|tizen/i,
-            meego: /meego/
-        },
-        formFactorRxs = {
-            tablet: /playbook|ipad|fire/i
-        },
-        browserRxs = {
-            omini: /Opera\sMini/i,
-            omobile: /Opera\sMobi/i,
-            firefox: /Firefox|Fennec/i,
-            mobilesafari: /version\/.*safari/i,
-            ie: /MSIE|Windows\sPhone/i,
-            chrome: /chrome|crios/i,
-            webkit: /webkit/i
-        };
-
-    for (var agent in agentRxs) {
-        if (hasOwnProperty(agentRxs, agent)) {
-            match = ua.match(agentRxs[agent]);
-            if (match) {
-                if (agent === "windows" && "plugins" in navigator) { return false; } // Break if not Metro/Mobile Windows
-
-                os = {};
-                os.device = agent;
-                os.tablet = testRegex(agent, formFactorRxs, false);
-                os.browser = testRegex(ua, browserRxs, "default");
-                os.name = testRegex(agent, osRxs);
-                os[os.name] = true;
-                os.majorVersion = match[2];
-                os.minorVersion = (match[3] || "0").replace("_", ".");
-                minorVersion = os.minorVersion.replace(".", "").substr(0, 2);
-                os.flatVersion = os.majorVersion + minorVersion + (new Array(3 - (minorVersion.length < 3 ? minorVersion.length : 2)).join("0"));
-
-
-                break;
-            }
-        }
-    }
-
-    return os;
-};
-
-function testRegex(agent, regexes, dflt) {
-    for (var regex in regexes) {
-        if (hasOwnProperty(regexes, regex) && regexes[regex].test(agent)) {
-            return regex;
-        }
-    }
-    return dflt !== undefined ? dflt : agent;
-}
-
 export var hasNativeScrolling = function (userAgent) {
-    var os = detectOS(userAgent);
-    return os.ios || os.android;
-};
-
-var detectBrowser = function (userAgent) {
-    var browser = false,
-        match = [],
-        browserRxs = {
-            edge: /(edge)[ \/]([\w.]+)/i,
-            webkit: /(chrome|crios)[ \/]([\w.]+)/i,
-            safari: /(webkit)[ \/]([\w.]+)/i,
-            opera: /(opera)(?:.*version|)[ \/]([\w.]+)/i,
-            msie: /(msie\s|trident.*? rv:)([\w.]+)/i,
-            mozilla: /(mozilla)(?:.*? rv:([\w.]+)|)/i
-        };
-
-    for (var agent in browserRxs) {
-        if (hasOwnProperty(browserRxs, agent)) {
-            match = userAgent.match(browserRxs[agent]);
-
-            if (match) {
-                browser = {};
-                browser[agent] = true;
-                browser[match[1].toLowerCase().split(" ")[0].split("/")[0]] = true;
-                browser.version = parseInt(document.documentMode || match[2], 10);
-
-                break;
-            }
-        }
-    }
-
-    return browser;
-};
-
-export var getEventMap = function () {
-    var eventMap = {
-        down: "touchstart mousedown",
-        move: "mousemove touchmove",
-        up: "mouseup touchend touchcancel",
-        cancel: "mouseleave touchcancel"
-    };
-
-    var support = getSupportedFeatures();
-
-    if (support.touch && (support.mobileOS.ios || support.mobileOS.android)) {
-        eventMap = {
-            down: "touchstart",
-            move: "touchmove",
-            up: "touchend touchcancel",
-            cancel: "touchcancel"
-        };
-    } else if (support.pointers) {
-        eventMap = {
-            down: "pointerdown",
-            move: "pointermove",
-            up: "pointerup",
-            cancel: "pointercancel pointerleave"
-        };
-    } else if (support.msPointers) {
-        eventMap = {
-            down: "MSPointerDown",
-            move: "MSPointerMove",
-            up: "MSPointerUp",
-            cancel: "MSPointerCancel MSPointerLeave"
-        };
-    }
-
-    return eventMap;
-};
-
-export var getSupportedFeatures = function () {
-    var os = detectOS(navigator.userAgent);
-    var browser = detectBrowser(navigator.userAgent);
-
-    var chrome = browser.chrome,
-        mobileChrome = browser.crios,
-        mozilla = browser.mozilla,
-        safari = browser.safari;
-
-    var support = {};
-
-    support.mobileOS = os;
-    support.touch = "ontouchstart" in window;
-    support.pointers = !chrome && !mobileChrome && !mozilla && !safari && window.PointerEvent;
-    support.msPointers = !chrome && window.MSPointerEvent;
-    support.mouseAndTouchPresent = support.touch && !(support.mobileOS.ios || support.mobileOS.android);
-    support.eventCapture = document.documentElement.addEventListener;
-
-    var table = document.createElement("table");
-
-    var transitions = support.transitions = false,
-        transforms = support.transforms = false;
-
-    var STRING = "string";
-
-    ["Moz", "webkit", "O", "ms"].forEach(function(prefix) {
-        var hasTransitions = typeof table.style[prefix + "Transition"] === STRING;
-
-        if (hasTransitions || typeof table.style[prefix + "Transform"] === STRING) {
-            var lowPrefix = prefix.toLowerCase();
-
-            transforms = {
-                css: (lowPrefix !== "ms") ? "-" + lowPrefix + "-" : "",
-                prefix: prefix,
-                event: (lowPrefix === "o" || lowPrefix === "webkit") ? lowPrefix : ""
-            };
-
-            if (hasTransitions) {
-                transitions = transforms;
-                transitions.event = transitions.event ? transitions.event + "TransitionEnd" : "transitionend";
-            }
-
-            return false;
-        }
-    });
-
-    table = null;
-
-    support.transforms = transforms;
-    support.transitions = transitions;
-
-    support.delayedClick = function() {
-        // only the mobile devices with touch events do this.
-        if (support.touch) {
-            // All iOS devices so far (by the time I am writing this, iOS 9.0.2 is the latest),
-            // delay their click events.
-            if (support.mobileOS.ios) {
-                return true;
-            }
-
-            if (support.mobileOS.android) {
-
-                if (!support.browser.chrome) { // older webkits and webviews delay the click
-                    return true;
-                }
-
-                // from here on, we deal with Chrome on Android.
-                if (support.browser.version < 32) {
-                    return false;
-                }
-
-                // Chrome 32+ does conditional fast clicks if the view port is not user scalable.
-                var meta = document.querySelector("meta[name=viewport]");
-                var contentAttr = meta ? meta.getAttribute("content") : "";
-                return !contentAttr.match(/user-scalable=no/i);
-            }
-        }
-
-        return false;
-    };
-
-    return support;
-};
-
-export var ownsElement = function (parent, element) {
-    if (!element) {
-        return false;
-    }
-
-    var node = element.parentNode;
-
-    while (node !== null) {
-        if (node === parent) {
-            return true;
-        }
-
-        node = node.parentNode;
-    }
-
-    return false;
-};
-
-export var contains = function (parent, element) {
-    return parent === element || ownsElement(parent, element);
-};
-
-export var proxy = function (method, context) {
-    return method.bind(context);
-};
-
-function isString(value) {
-    return typeof(value) === "string";
-}
-
-export var on = function (element, events, filter, handler, useCapture) {
-    addEventListeners(element, events, filter, handler, useCapture);
-};
-
-export var addEventListeners = function (element, events, filter, handler, useCapture) {
-    var eventNames = isArray(events) ? events : (events || "").split(" ");
-
-    eventNames.forEach(function(eventName) {
-        addEventListener(element, eventName, filter, handler, useCapture);
-    });
-};
-
-export var addEventListener = function (element, event, filter, handler, useCapture) {
-    var eventHandler = handler;
-    var eventFilter;
-
-    if (filter && isFunction(filter) && !handler) {
-        eventHandler = filter;
-    } else if (filter && isString(filter) && isFunction(eventHandler)) {
-        eventFilter = filter;
-    }
-
-    element.addEventListener(event, function(e) {
-        var closestMatchingTarget = e.target ? e.target.closest(eventFilter) : null;
-
-        if (!eventFilter ||
-            (eventFilter && e.target && closestMatchingTarget)) {
-            var currentTarget = eventFilter ? closestMatchingTarget : e.currentTarget;
-
-            // reassign the property as it is a getters only
-            defineProperty(e, "currentTarget", { value: currentTarget });
-            // keep a reference to the top-level target
-            defineProperty(e, "delegateTarget", { value: element });
-
-            eventHandler(e);
-        }
-    }, Boolean(useCapture));
-};
-
-export var off = function (element, events, filter, handler, useCapture) {
-    removeEventListeners(element, events, filter, handler, useCapture);
-};
-
-export var removeEventListeners = function (element, events, handler, useCapture) {
-    var eventNames = isArray(events) ? events : (events || "").split(" ");
-
-    eventNames.forEach(function(eventName) {
-        removeEventListener(element, eventName, handler, useCapture);
-    });
-};
-
-export var removeEventListener = function (element, event, handler, useCapture) {
-    element.removeEventListener(event, handler, Boolean(useCapture));
-};
-
-export var applyEventMap = function (events) {
-    var eventMap = getEventMap(navigator.userAgent);
-    function queryEventMap(e) {
-        return eventMap[e] || e;
-    }
-
-    var eventRegEx = /([^ ]+)/g;
-    var appliedEvents = events.replace(eventRegEx, queryEventMap);
-
-    return appliedEvents;
+    var ref = getSupportedFeatures(userAgent);
+    var mobileOS = ref.mobileOS;
+    return mobileOS.ios || mobileOS.android;
 };
 
 export var setDefaultEvents = function (type, events) {
@@ -406,8 +83,7 @@ export var setDefaultEvents = function (type, events) {
     }
 };
 
-export var wheelDeltaY = function (jQueryEvent) {
-    var e = jQueryEvent.originalEvent || jQueryEvent;
+export var wheelDeltaY = function (e) {
     var deltaY = e.wheelDeltaY;
     var delta;
 
@@ -422,12 +98,6 @@ export var wheelDeltaY = function (jQueryEvent) {
     return delta;
 };
 
-export var now = function () {
-    return Number(new Date());
-};
-
-export var noop = function () {};
-
 export var renderPos = function (pos) {
     var result = [];
 

package/dist/es/map/zoom.js

@@ -5,12 +5,12 @@ import {
     keys,
     hasClasses,
     setDefaultOptions,
-    renderIcon
+    renderIcon,
+    on,
+    off,
 } from '../common';
 
 import {
-    on,
-    off,
     setDefaultEvents,
     convertToHtml
 } from './utils';

package/dist/es/sankey/legend.js

@@ -64,6 +64,11 @@ setDefaultOptions(Legend, {
     },
     position: BOTTOM,
     align: CENTER,
+    accessibility: {
+        role: 'presentation',
+        ariaLabel: null,
+        ariaRoleDescription: null
+    },
     border: {
         width: 0
     }

package/dist/es/sankey/link.js

@@ -2,6 +2,82 @@ import { drawing } from '@progress/kendo-drawing';
 import { SankeyElement } from './element';
 import { deepExtend } from '../common';
 import { defined } from '../drawing-utils';
+import { ARIA_ACTIVE_DESCENDANT } from '../common/constants';
+
+var distanceToLine = function (line, point) {
+    var ref = line[0];
+    var x1 = ref[0];
+    var y1 = ref[1];
+    var ref$1 = line[1];
+    var x2 = ref$1[0];
+    var y2 = ref$1[1];
+    var x3 = point[0];
+    var y3 = point[1];
+
+    return Math.abs((x2 - x1) * (y3 - y1) - (x3 - x1) * (y2 - y1)) / Math.sqrt(Math.pow( (x2 - x1), 2 ) + Math.pow( (y2 - y1), 2 ));
+};
+
+var bezierPoint = function (p1, p2, p3, p4, t) {
+    var t1 = 1 - t;
+    var t1t1 = t1 * t1;
+    var tt = t * t;
+    return (p1 * t1t1 * t1) + (3 * p2 * t * t1t1) + (3 * p3 * tt * t1) + (p4 * tt * t);
+};
+
+var angelBetweenTwoLines = function (line1, line2) {
+    var ref = line1[0];
+    var x1 = ref[0];
+    var y1 = ref[1];
+    var ref$1 = line1[1];
+    var x2 = ref$1[0];
+    var y2 = ref$1[1];
+    var ref$2 = line2[0];
+    var x3 = ref$2[0];
+    var y3 = ref$2[1];
+    var ref$3 = line2[1];
+    var x4 = ref$3[0];
+    var y4 = ref$3[1];
+
+    var a1 = Math.atan2(y2 - y1, x2 - x1);
+    var a2 = Math.atan2(y4 - y3, x4 - x3);
+
+    return Math.abs(a1 - a2);
+};
+
+var calculateControlPointsOffsetX = function (link) {
+    var x0 = link.x0;
+    var x1 = link.x1;
+    var y0 = link.y0;
+    var y1 = link.y1;
+    var xC = (x0 + x1) / 2;
+
+    var width = link.width;
+    var halfWidth = width / 2;
+
+    // upper curve, t = 0.5
+    var upperCurveMiddleLine = [[(x0 + xC) / 2, y0 - halfWidth], [(x1 + xC) / 2, y1 - halfWidth]];
+
+    // for lower curve, bezier-point at t = 0.5
+    // for the case t = 0.5, the bezier-point is the middle point of the curve. => ((y0 + halfWidth) + (y1 + halfWidth)) / 2
+    var lowerCurveMiddlePoint = [xC, bezierPoint(y0 + halfWidth, y0 + halfWidth, y1 + halfWidth, y1 + halfWidth, 0.5)];
+
+    // The actual width of the link at its middle point as can be seen on the screen.
+    var actualWidth = distanceToLine(upperCurveMiddleLine, lowerCurveMiddlePoint);
+
+    var upperNarrowness = (width - actualWidth) / 2;
+
+    // The line `upperCurveMiddleLine` shows the upper border of the link.
+    // Assumption 1: Translated to the left to the desired link width and the translate value will be the `offset`.
+    // Assumption 2: The translate value is a hypotenuse of a triangle.
+    var alpha = angelBetweenTwoLines(upperCurveMiddleLine, [[x0, y0 - halfWidth], [xC, y0 - halfWidth]]);
+    var a = upperNarrowness;
+    var b = Math.sin(alpha) * a;
+    var offset = Math.sqrt(a * a + b * b);
+    // Another option is to assume the triangle is isosceles
+    // => offset = Math.sqrt(2) * upperNarrowness;
+
+    return y0 - y1 > 0 ? (-1) * offset : offset;
+};
 
 export var Link = (function (SankeyElement) {
     function Link () {
@@ -24,18 +100,80 @@ export var Link = (function (SankeyElement) {
             .moveTo(x0, y0).curveTo([xC, y0], [xC, y1], [x1, y1]);
     };
 
+    Link.prototype.getLabelText = function getLabelText (options) {
+        var labelTemplate = options.labels.ariaTemplate;
+
+        if (labelTemplate) {
+            return labelTemplate({ link: options.link });
+        }
+    };
+
     Link.prototype.visualOptions = function visualOptions () {
         var options = this.options;
         var link = this.options.link;
+        var ariaLabel = this.getLabelText(options);
+
         return {
             stroke: {
                 width: options.link.width,
                 color: link.color || options.color,
                 opacity: defined(link.opacity) ? link.opacity : options.opacity
-            }
+            },
+            role: 'graphics-symbol',
+            ariaRoleDescription: 'Link',
+            ariaLabel: ariaLabel
         };
     };
 
+    Link.prototype.createFocusHighlight = function createFocusHighlight () {
+        if (!this.options.navigatable) {
+            return;
+        }
+        var link = this.options.link;
+        var x0 = link.x0;
+        var x1 = link.x1;
+        var y0 = link.y0;
+        var y1 = link.y1;
+        var xC = (x0 + x1) / 2;
+        var halfWidth = link.width / 2;
+
+        var offset = calculateControlPointsOffsetX(link);
+
+        this._highlight = new drawing.Path({ stroke: this.options.focusHighlight, visible: false })
+            .moveTo(x0, y0 + halfWidth)
+            .lineTo(x0, y0 - halfWidth)
+            .curveTo([xC + offset, y0 - halfWidth], [xC + offset, y1 - halfWidth], [x1, y1 - halfWidth])
+            .lineTo(x1, y1 + halfWidth)
+            .curveTo([xC - offset, y1 + halfWidth], [xC - offset, y0 + halfWidth], [x0, y0 + halfWidth]);
+    };
+
+    Link.prototype.focus = function focus (options) {
+        if (this._highlight) {
+            var ref = options || {};
+            var highlight = ref.highlight; if ( highlight === void 0 ) highlight = true;
+            if (highlight) {
+                this._highlight.options.set('visible', true);
+            }
+            var id = (this.options.link.sourceId) + "->" + (this.options.link.targetId);
+            this.visual.options.set('id', id);
+
+            if (this.options.root()) {
+                this.options.root().setAttribute(ARIA_ACTIVE_DESCENDANT, id);
+            }
+        }
+    };
+
+    Link.prototype.blur = function blur () {
+        if (this._highlight) {
+            this._highlight.options.set('visible', false);
+            this.visual.options.set('id', '');
+
+            if (this.options.root()) {
+                this.options.root().removeAttribute(ARIA_ACTIVE_DESCENDANT);
+            }
+        }
+    };
+
     return Link;
 }(SankeyElement));