@progress/kendo-vue-charts 3.5.0 → 3.5.1-dev.202208150613

package/dist/esm/tooltip/Crosshair.js

@@ -0,0 +1,143 @@
+// @ts-ignore
+import * as Vue from 'vue';
+var allVue = Vue;
+var gh = allVue.h;
+var isV3 = allVue.version && allVue.version[0] === '3';
+import { classNames, getDefaultSlots } from '@progress/kendo-vue-common';
+import { InstanceObserver } from '@progress/kendo-charts';
+import { TooltipPopup } from './Popup'; // import { ChartContext } from '../ChartContext.js';
+
+var CROSSHAIR_TOOLTIP_CLASS = 'k-chart-crosshair-tooltip';
+var INVERSE_TOOLTIP_CLASS = 'k-chart-tooltip-inverse';
+/**
+ * @hidden
+ */
+
+var CrosshairTooltipVue2 = {
+  name: 'KendoCrosshairTooltip',
+  props: {
+    index: Number,
+    name: String
+  },
+  data: function data() {
+    return {
+      popupShown: false,
+      popupAlign: undefined,
+      popupOffset: undefined,
+      popupContent: undefined,
+      popupStyles: undefined,
+      className: undefined
+    };
+  },
+  inject: {
+    optionsState: {
+      default: {}
+    },
+    dispatchOptions: {
+      default: null
+    },
+    observersStore: {
+      default: null
+    },
+    dispatchObservers: {
+      default: null
+    },
+    childrenObserver: {
+      default: null
+    }
+  },
+  created: function created() {
+    this.chartObserver = new InstanceObserver(this, {
+      showTooltip: 'onShowTooltip',
+      hideTooltip: 'onHideTooltip'
+    });
+    this.dispatchObservers({
+      type: 'add',
+      payload: this.chartObserver
+    });
+  },
+  destroyed: !!isV3 ? undefined : function () {
+    this.dispatchObservers({
+      type: 'remove',
+      payload: this.chartObserver
+    });
+  },
+  // @ts-ignore
+  unmounted: function unmounted() {
+    this.dispatchObservers({
+      type: 'remove',
+      payload: this.chartObserver
+    });
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    return {
+      v3: v3
+    };
+  },
+  render: function render(createElement) {
+    var _a;
+
+    var h = gh || createElement;
+    var defaultSlots = getDefaultSlots(this);
+    var tooltipContent = this.popupShown ? this.popupContent : Function.prototype;
+    var popupContainerClassName = classNames((_a = {}, _a[CROSSHAIR_TOOLTIP_CLASS] = true, _a[INVERSE_TOOLTIP_CLASS] = !!this.className, _a));
+    return (// @ts-ignore  function children
+      h(TooltipPopup, {
+        popupShown: this.popupShown,
+        attrs: this.v3 ? undefined : {
+          popupShown: this.popupShown,
+          popupAlign: this.popupAlign,
+          popupOffset: this.popupOffset,
+          popupStyles: this.popupStyles,
+          className: popupContainerClassName
+        },
+        popupAlign: this.popupAlign,
+        popupOffset: this.popupOffset,
+        popupStyles: this.popupStyles,
+        className: popupContainerClassName
+      }, this.v3 ? function () {
+        return [tooltipContent];
+      } : [tooltipContent])
+    );
+  },
+  methods: {
+    onShowTooltip: function onShowTooltip(e) {
+      var anchor = e.anchor,
+          style = e.style,
+          className = e.className,
+          crosshair = e.crosshair,
+          axisName = e.axisName,
+          axisIndex = e.axisIndex,
+          value = e.value;
+      var _a = this.$props,
+          name = _a.name,
+          index = _a.index;
+
+      if (!crosshair) {
+        return;
+      }
+
+      if (axisName === name && axisIndex === index) {
+        this.popupShown = true;
+        this.popupAlign = anchor.align;
+        this.popupOffset = anchor.point;
+        this.popupContent = value;
+        this.popupStyles = style;
+        this.className = className;
+      }
+    },
+    onHideTooltip: function onHideTooltip() {
+      this.popupShown = false;
+      this.popupStyles = {};
+      this.className = undefined;
+    }
+  }
+};
+/**
+ * @hidden
+ */
+
+var CrosshairTooltip = CrosshairTooltipVue2;
+export { CrosshairTooltip, CrosshairTooltipVue2 };

package/dist/esm/tooltip/CrosshairContainer.d.ts

@@ -0,0 +1,61 @@
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
+declare type DefaultData<V> = object | ((this: V) => {});
+declare type DefaultMethods<V> = {
+    [key: string]: (this: V, ...args: any[]) => any;
+};
+import { CrosshairTooltipProps } from './Crosshair';
+/**
+ * @hidden
+ */
+export interface Tooltips {
+    [key: string]: CrosshairTooltipProps;
+}
+/**
+ * @hidden
+ */
+export interface CrosshairTooltipContainerState {
+    tooltips: Tooltips;
+}
+/**
+ * @hidden
+ */
+export interface CrosshairContainerProps {
+    options: any;
+}
+/**
+ * @hidden
+ */
+export interface CrosshairContainerData {
+    optionsState: object;
+}
+/**
+ * @hidden
+ */
+export interface CrosshairContainerState {
+}
+/**
+ * @hidden
+ */
+export interface CrosshairContainerMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface CrosshairContainerComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface CrosshairContainerAll extends CrosshairContainerMethods, CrosshairContainerState, CrosshairContainerData, CrosshairContainerComputed, Vue2type {
+}
+/**
+ * @hidden
+ */
+declare const CrosshairContainerVue2: ComponentOptions<Vue2type, DefaultData<CrosshairContainerData>, DefaultMethods<CrosshairContainerAll>, CrosshairContainerComputed, RecordPropsDefinition<CrosshairContainerData>>;
+/**
+ * @hidden
+ */
+declare const CrosshairContainer: DefineComponent<CrosshairContainerProps, any, CrosshairContainerData, CrosshairContainerComputed, CrosshairContainerMethods, {}, {}, {}, string, CrosshairContainerProps, CrosshairContainerProps, {}>;
+export { CrosshairContainer, CrosshairContainerVue2 };

package/dist/esm/tooltip/CrosshairContainer.js

@@ -0,0 +1,89 @@
+// @ts-ignore
+import * as Vue from 'vue';
+var allVue = Vue;
+var gh = allVue.h;
+var isV3 = allVue.version && allVue.version[0] === '3';
+import { CrosshairTooltip } from './Crosshair.js';
+var AXES = ['categoryAxis', 'valueAxis', 'xAxis', 'yAxis'];
+
+function mapTooltips(options) {
+  var map = {};
+
+  for (var idx = 0; idx < AXES.length; idx++) {
+    var tooltips = axesCrosshairTooltipOptions(options, AXES[idx]);
+
+    for (var tooltipIdx = 0; tooltipIdx < tooltips.length; tooltipIdx++) {
+      var tooltip = tooltips[tooltipIdx];
+      map[tooltip.name + tooltip.index] = tooltip;
+    }
+  }
+
+  return map;
+}
+
+function axesCrosshairTooltipOptions(options, name) {
+  var result = [];
+
+  if (options[name]) {
+    var axes = [].concat(options[name]);
+
+    for (var idx = 0; idx < axes.length; idx++) {
+      var tooltip = (axes[idx].crosshair || {}).tooltip;
+
+      if (tooltip && tooltip.visible) {
+        result.push({
+          index: idx,
+          name: name
+        });
+      }
+    }
+  }
+
+  return result;
+}
+/**
+ * @hidden
+ */
+
+
+var CrosshairContainerVue2 = {
+  name: 'KendoCrosshairContainer',
+  props: {
+    optionsState: Object
+  },
+  computed: {
+    tooltips: function tooltips() {
+      return mapTooltips(this.optionsState);
+    }
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    return {
+      v3: v3
+    };
+  },
+  render: function render(createElement) {
+    var h = gh || createElement;
+    var childrenMap = Object.keys(this.tooltips).map(function (key) {
+      return (// @ts-ignore  function children
+        h(CrosshairTooltip, {
+          index: this.tooltips[key].index,
+          attrs: this.v3 ? undefined : {
+            index: this.tooltips[key].index,
+            name: this.tooltips[key].name
+          },
+          name: this.tooltips[key].name,
+          key: key
+        })
+      );
+    }, this);
+    return h("div", [childrenMap]);
+  }
+};
+/**
+ * @hidden
+ */
+
+var CrosshairContainer = CrosshairContainerVue2;
+export { CrosshairContainer, CrosshairContainerVue2 };

package/dist/esm/tooltip/Point.d.ts

@@ -0,0 +1,68 @@
+/**
+ * The point that is passed to the tooltip component.
+ */
+export declare class TooltipPoint {
+    /**
+     * The point value.
+     */
+    value: any;
+    /**
+     * The point category. Available only for the Categorical series.
+     */
+    category: string | Date | number;
+    /**
+     * The point category index. Available only for the Categorical series.
+     */
+    categoryIndex: number;
+    /**
+     * The point series options.
+     */
+    series: any;
+    /**
+     * The point `dataItem`.
+     */
+    dataItem: any;
+    /**
+     * The point value represented as a percentage value. Available only for the Donut, Pie, and 100% Stacked charts.
+     */
+    percentage: number;
+    /**
+     * The sum of point values since the last `"runningTotal"` summary point. Available for the Waterfall series.
+     */
+    runningTotal: number;
+    /**
+     * The sum of all previous series values. Available for the Waterfall series.
+     */
+    total: number;
+    /**
+     * The low value of the point error bar. Available for the Categorical series with error bars.
+     */
+    low: number;
+    /**
+     * The high value of the point error bar. Available for the Categorical series with error bars.
+     */
+    high: number;
+    /**
+     * The x low value of the point error bar. Available for the Scatter series with error bars.
+     */
+    xLow: number;
+    /**
+     * The x high value of the point error bar. Available for the Scatter series with error bars.
+     */
+    xHigh: number;
+    /**
+     * The y low value of the point error bar. Available for the Scatter series with error bars.
+     */
+    yLow: number;
+    /**
+     * The y low value of the point error bar. Available for the Scatter series with error bars.
+     */
+    yHigh: number;
+    private point;
+    private format?;
+    /**
+     * @hidden
+     */
+    constructor(point: any, format?: string);
+    get formattedValue(): string;
+}

package/dist/esm/tooltip/Point.js

@@ -0,0 +1,35 @@
+/**
+ * The point that is passed to the tooltip component.
+ */
+var TooltipPoint = /** @class */ (function () {
+    /**
+     * @hidden
+     */
+    function TooltipPoint(point, format) {
+        this.value = point.value;
+        this.category = point.category;
+        this.categoryIndex = point.categoryIx;
+        this.series = point.series;
+        this.dataItem = point.dataItem;
+        this.percentage = point.percentage;
+        this.runningTotal = point.runningTotal;
+        this.total = point.total;
+        this.low = point.low;
+        this.high = point.high;
+        this.xLow = point.xLow;
+        this.xHigh = point.xHigh;
+        this.yLow = point.yLow;
+        this.yHigh = point.yHigh;
+        this.point = point;
+        this.format = ((point.options || {}).tooltip || {}).format || format;
+    }
+    Object.defineProperty(TooltipPoint.prototype, "formattedValue", {
+        get: function () {
+            return this.format ? this.point.formatValue(this.format) : String(this.value);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    return TooltipPoint;
+}());
+export { TooltipPoint };

package/dist/esm/tooltip/Popup.d.ts

@@ -0,0 +1,54 @@
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
+declare type DefaultData<V> = object | ((this: V) => {});
+declare type DefaultMethods<V> = {
+    [key: string]: (this: V, ...args: any[]) => any;
+};
+import { Align, Offset } from '@progress/kendo-vue-popup';
+/**
+ * @hidden
+ */
+export interface TooltipPopupProps {
+    className?: string | undefined;
+    popupShown: boolean;
+    popupAlign?: Align;
+    popupOffset?: Offset;
+    popupStyles?: any;
+    popupContent: Function;
+}
+/**
+ * @hidden
+ */
+export interface TooltipPopupData {
+}
+/**
+ * @hidden
+ */
+export interface TooltipPopupState {
+    chartObserver: any;
+}
+/**
+ * @hidden
+ */
+export interface TooltipPopupMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface TooltipPopupComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface TooltipPopupAll extends TooltipPopupMethods, TooltipPopupState, TooltipPopupData, TooltipPopupComputed, Vue2type {
+}
+/**
+ * @hidden
+ */
+declare const TooltipPopupVue2: ComponentOptions<Vue2type, DefaultData<TooltipPopupData>, DefaultMethods<TooltipPopupAll>, TooltipPopupComputed, RecordPropsDefinition<TooltipPopupProps>>;
+/**
+ * @hidden
+ */
+declare const TooltipPopup: DefineComponent<TooltipPopupProps, any, TooltipPopupData, TooltipPopupComputed, TooltipPopupMethods, {}, {}, {}, string, TooltipPopupProps, TooltipPopupProps, {}>;
+export { TooltipPopup, TooltipPopupVue2 };

package/dist/esm/tooltip/Popup.js

@@ -0,0 +1,163 @@
+// @ts-ignore
+import * as Vue from 'vue';
+var allVue = Vue;
+var gh = allVue.h;
+var isV3 = allVue.version && allVue.version[0] === '3';
+import { InstanceObserver } from '@progress/kendo-charts';
+import { hasParent } from '../utils/main.js';
+import { Popup } from '@progress/kendo-vue-popup';
+import { getDefaultSlots, getRef, setRef } from '@progress/kendo-vue-common';
+var COLLISION = {
+  horizontal: 'fit',
+  vertical: 'fit'
+};
+var TOOLTIP_CLASS = 'k-chart-tooltip';
+var POPUP_WRAPPER_CLASS = 'k-chart-tooltip-wrapper';
+/**
+ * @hidden
+ */
+
+var TooltipPopupVue2 = {
+  name: 'KendoTooltipPopup',
+  props: {
+    className: String,
+    popupShown: Boolean,
+    popupAlign: {
+      type: Object,
+      default: function _default() {
+        return undefined;
+      }
+    },
+    popupOffset: {
+      type: Object
+    },
+    popupStyles: {
+      type: Object
+    },
+    popupContent: Function
+  },
+  inject: {
+    options: {
+      default: {
+        state: {}
+      }
+    },
+    dispatchOptions: {
+      default: null
+    },
+    observersState: {
+      default: null
+    },
+    dispatchObservers: {
+      default: null
+    },
+    childrenObserver: {
+      default: null
+    }
+  },
+  created: function created() {
+    this.chartObserver = new InstanceObserver(this, {
+      onMouseLeave: 'onChartMouseLeave'
+    });
+    this.dispatchObservers({
+      type: 'add',
+      payload: this.chartObserver
+    });
+  },
+  mounted: function mounted() {
+    this.element = getRef(this, 'element');
+  },
+  destroyed: !!isV3 ? undefined : function () {
+    this.dispatchObservers({
+      type: 'remove',
+      payload: this.chartObserver
+    });
+  },
+  // @ts-ignore
+  unmounted: function unmounted() {
+    this.dispatchObservers({
+      type: 'remove',
+      payload: this.chartObserver
+    });
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    return {
+      v3: v3
+    };
+  },
+  render: function render(createElement) {
+    var _this = this;
+
+    var h = gh || createElement;
+    var defaultSlots = getDefaultSlots(this);
+    var _a = this.$props,
+        popupShown = _a.popupShown,
+        popupAlign = _a.popupAlign,
+        popupOffset = _a.popupOffset,
+        popupStyles = _a.popupStyles,
+        popupContent = _a.popupContent,
+        className = _a.className;
+    var wrapperClass = [TOOLTIP_CLASS, className].join(' ').trim();
+    return (// @ts-ignore  function children
+      h(Popup, {
+        animate: false,
+        attrs: this.v3 ? undefined : {
+          animate: false,
+          popupAlign: popupAlign,
+          offset: popupOffset,
+          show: popupShown,
+          collision: COLLISION
+        },
+        popupAlign: popupAlign,
+        offset: popupOffset,
+        show: popupShown,
+        collision: COLLISION,
+        "class": POPUP_WRAPPER_CLASS
+      }, this.v3 ? function () {
+        return [h("div", {
+          "class": wrapperClass,
+          style: popupStyles,
+          onMouseleave: _this.onMouseLeave,
+          on: _this.v3 ? undefined : {
+            "mouseleave": _this.onMouseLeave
+          },
+          ref: setRef(_this, 'element')
+        }, [defaultSlots])];
+      } : [h("div", {
+        "class": wrapperClass,
+        style: popupStyles,
+        onMouseleave: _this.onMouseLeave,
+        on: _this.v3 ? undefined : {
+          "mouseleave": _this.onMouseLeave
+        },
+        ref: setRef(_this, 'element')
+      }, [defaultSlots])])
+    );
+  },
+  methods: {
+    onChartMouseLeave: function onChartMouseLeave(e) {
+      var event = e.event;
+
+      if (hasParent(event.relatedTarget, this.element)) {
+        /* prevent default behavior so that the tooltip won't be hidden */
+        return true;
+      }
+
+      return false;
+    },
+    onMouseLeave: function onMouseLeave(_e) {//   const domEvent = toDomEvent(this, e);
+      //   const isDefaultPrevented = this.context.childrenObserver.trigger('onMouseLeave', domEvent);
+      // if (isDefaultPrevented) {
+      //     e.preventDefault();
+      // }
+    }
+  }
+};
+/**
+ * @hidden
+ */
+
+var TooltipPopup = TooltipPopupVue2;
+export { TooltipPopup, TooltipPopupVue2 };

package/dist/esm/tooltip/Series.d.ts

@@ -0,0 +1,51 @@
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
+declare type DefaultData<V> = object | ((this: V) => {});
+declare type DefaultMethods<V> = {
+    [key: string]: (this: V, ...args: any[]) => any;
+};
+import { Align, Offset } from '@progress/kendo-vue-popup';
+import { SharedTooltipContext, TooltipContext } from './Context';
+/**
+ * @hidden
+ */
+export interface SeriesTooltipData {
+    className?: string | undefined;
+    popupShown: boolean;
+    popupAlign?: Align;
+    popupOffset?: Offset;
+    popupStyles?: any;
+    popupContext: TooltipContext | SharedTooltipContext;
+    shared?: boolean;
+}
+/**
+ * @hidden
+ */
+export interface SeriesTooltipState {
+    chartObserver: any;
+}
+/**
+ * @hidden
+ */
+export interface SeriesTooltipMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface SeriesTooltipComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface SeriesTooltipAll extends SeriesTooltipMethods, SeriesTooltipState, SeriesTooltipData, SeriesTooltipComputed, Vue2type {
+}
+/**
+ * @hidden
+ */
+declare const SeriesTooltipVue2: ComponentOptions<Vue2type, DefaultData<SeriesTooltipData>, DefaultMethods<SeriesTooltipAll>, SeriesTooltipComputed, RecordPropsDefinition<{}>>;
+/**
+ * @hidden
+ */
+declare const SeriesTooltip: DefineComponent<{}, any, SeriesTooltipData, SeriesTooltipComputed, SeriesTooltipMethods, {}, {}, {}, string, {}, {}, {}>;
+export { SeriesTooltip, SeriesTooltipVue2 };