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

package/dist/esm/BaseGauge.js

@@ -0,0 +1,231 @@
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+}; // @ts-ignore
+
+
+import * as Vue from 'vue';
+var allVue = Vue;
+var gh = allVue.h;
+var isV3 = allVue.version && allVue.version[0] === '3';
+var inject = allVue.inject;
+import { provideIntlService } from '@progress/kendo-vue-intl';
+import { loadTheme } from './theming/theme-service.js';
+import createStore from './store/store.js';
+import { themeReducer } from './store/reducer.js';
+import { canUseDOM } from '@progress/kendo-vue-common'; // import { GaugeContextType, GaugeContext } from './GaugeContext.js';
+
+import { validatePackage, getDefaultSlots } from '@progress/kendo-vue-common';
+import { packageMetadata } from './package-metadata.js';
+/**
+ * @hidden
+ */
+
+var BaseGaugeVue2 = {
+  name: 'KendoBaseGauge',
+  props: {
+    dir: String,
+    renderAs: {
+      type: String,
+      default: 'svg',
+      validator: function validator(value) {
+        return ['svg', 'canvas'].includes(value);
+      }
+    },
+    scale: Object,
+    value: Number,
+    pointer: {
+      type: [Object, Array],
+      default: function _default() {
+        return undefined;
+      }
+    },
+    gaugeConstructor: [Object, Function],
+    deriveOptionsFromParent: Function,
+    transitions: {
+      type: Boolean,
+      default: undefined
+    }
+  },
+  inject: {
+    kendoIntlService: {
+      default: null
+    }
+  },
+  created: function created() {
+    validatePackage(packageMetadata);
+    this.gaugeInstance = null;
+    this.themeStore = {};
+    this._prevRenderAs = this.renderAs;
+    this._prevDir = this.dir;
+    this._prevScale = this.scale;
+    this.themeStore = createStore(themeReducer);
+  },
+  mounted: function mounted() {
+    loadTheme(this.themeStore, this.instantiateCoreGauge.bind(this));
+    this.themeUnsubscriber = this.themeStore.subscribe(this.refresh.bind(this));
+    window.addEventListener('resize', this.onWindowResize);
+  },
+  watch: {
+    dir: function dir(_newDir, oldDir) {
+      this._prevDir = oldDir;
+    },
+    renderAs: function renderAs(_newRenderAs, oldRenderAs) {
+      this._prevRenderAs = oldRenderAs;
+    },
+    scale: function scale(_newScale, oldScale) {
+      this._prevScale = oldScale;
+    }
+  },
+  updated: function updated() {
+    var _a = this.$props,
+        dir = _a.dir,
+        getTarget = _a.getTarget,
+        gaugeConstructor = _a.gaugeConstructor,
+        className = _a.className,
+        renderAs = _a.renderAs,
+        scale = _a.scale,
+        currentOthers = __rest(_a, ["dir", "getTarget", "gaugeConstructor", "className", "renderAs", "scale"]);
+
+    if (this.gaugeInstance !== null) {
+      var optionsChanged = this._prevDir !== dir || this._prevRenderAs !== renderAs || this._prevScale !== scale;
+      var typedCurrentOthers = currentOthers;
+
+      if (!optionsChanged) {
+        this.gaugeInstance.noTransitionsRedraw();
+      }
+
+      if (optionsChanged || (renderAs || 'svg') !== (this._prevRenderAs || 'svg')) {
+        this.refresh();
+      } else {
+        if (Object.keys(currentOthers).indexOf('pointer') > -1 && currentOthers.pointer) {
+          var isPointerArray = Array.isArray(typedCurrentOthers.pointer);
+
+          if (isPointerArray) {
+            this.refreshAllValues(typedCurrentOthers.pointer.map(function (item) {
+              return item.value;
+            }));
+          } else {
+            this.refreshValue((typedCurrentOthers.pointer || {}).value);
+          }
+        } else {
+          this.refreshValue(typedCurrentOthers.value);
+        }
+      }
+
+      if (this._prevDir !== dir) {
+        this.gaugeInstance.setDirection(this.getDirection(dir));
+      }
+
+      this.$emit('render', {
+        sender: this
+      });
+    }
+  },
+  destroyed: function destroyed() {
+    this.themeUnsubscriber();
+
+    if (this.gaugeInstance !== null) {
+      this.gaugeInstance.destroy();
+      this.gaugeInstance = null;
+    }
+
+    window.removeEventListener('resize', this.onWindowResize);
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    var kendoIntlService = inject('kendoIntlService', {});
+    return {
+      v3: v3,
+      kendoIntlService: kendoIntlService
+    };
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var h = gh || createElement;
+    var defaultSlots = getDefaultSlots(this);
+    var gaugeStyles = Object.assign({}, {
+      position: 'relative'
+    });
+    this._intl = provideIntlService(this);
+    return h("div", {
+      style: gaugeStyles
+    }, [defaultSlots]);
+  },
+  methods: {
+    instantiateCoreGauge: function instantiateCoreGauge() {
+      var _a = this.$props,
+          dir = _a.dir,
+          gaugeConstructor = _a.gaugeConstructor;
+      var gaugeOptions = this.getGaugeOptions();
+      this.gaugeInstance = new gaugeConstructor(this.$el, gaugeOptions, this.themeStore.getState(), {
+        rtl: this.getDirection(dir),
+        intlService: this._intl,
+        sender: this
+      });
+    },
+    refresh: function refresh() {
+      if (this.gaugeInstance !== null) {
+        var themeOptions = this.themeStore.getState();
+        var gaugeOptions = this.getGaugeOptions();
+        this.gaugeInstance.setOptions(gaugeOptions, themeOptions);
+      }
+    },
+    refreshValue: function refreshValue(value) {
+      this.gaugeInstance.value(value);
+    },
+    refreshAllValues: function refreshAllValues(values) {
+      this.gaugeInstance.allValues(values);
+    },
+    getDirection: function getDirection(dir) {
+      var _this = this;
+
+      var directionFromWindow = function directionFromWindow() {
+        return canUseDOM && window.getComputedStyle(_this.$el).direction;
+      };
+
+      var direction = dir !== undefined ? dir : directionFromWindow() || 'ltr';
+      return direction === 'rtl';
+    },
+    getGaugeOptions: function getGaugeOptions() {
+      var _a = this.$props,
+          renderAs = _a.renderAs,
+          transitions = _a.transitions,
+          deriveOptionsFromParent = _a.deriveOptionsFromParent;
+      var gaugeOptions = Object.assign({
+        renderAs: renderAs,
+        transitions: transitions
+      });
+
+      if (deriveOptionsFromParent) {
+        // Add options from parent - required by TS
+        gaugeOptions = deriveOptionsFromParent(gaugeOptions);
+      }
+
+      return gaugeOptions;
+    },
+    onWindowResize: function onWindowResize() {
+      if (this.gaugeInstance !== null) {
+        this.gaugeInstance.resize();
+        this.$emit('render', {
+          sender: this
+        });
+      }
+    }
+  }
+};
+/**
+ * @hidden
+ */
+
+var BaseGauge = BaseGaugeVue2;
+export { BaseGauge, BaseGaugeVue2 };

package/dist/esm/BaseGaugeProps.d.ts

@@ -0,0 +1,44 @@
+/**
+ * @hidden
+ */
+export interface BaseGaugePrivateProps {
+    /**
+     * @hidden
+     */
+    deriveOptionsFromParent?: (options: any) => any;
+    /**
+     * @hidden
+     */
+    gaugeConstructor?: object;
+    /**
+     * @hidden
+     */
+    getTarget?: () => any;
+}
+/**
+ * @hidden
+ */
+export interface BaseGaugeProps extends BaseGaugePrivateProps {
+    /**
+     * Represents the `dir` HTML attribute.
+     */
+    dir?: string;
+    value?: number;
+    scale?: object;
+    pointer?: object;
+    color?: any;
+    colors?: any[];
+    opacity?: any;
+    /**
+     * Sets the preferred rendering engine. If not supported by the browser, the Gauge switches to the first available mode.
+     *
+     * The supported values are:
+     * - `"svg"`—If available, renders the component as an inline `.svg` file.
+     * - `"canvas"`—If available, renders the component as a `canvas` element.
+     */
+    renderAs?: 'svg' | 'canvas' | string;
+    /**
+     * If set to `true`, the Gauge plays animations when it displays the series. By default, animations are enabled.
+     */
+    transitions?: boolean;
+}

package/dist/esm/BaseGaugeProps.js

@@ -0,0 +1 @@
+export {}; // tslint:enable:max-line-length

package/dist/esm/CircularGauge.d.ts

@@ -0,0 +1,43 @@
+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 { CircularGaugeProps } from './CircularGaugeProps';
+import { ArcGaugeState, ArcGaugeComputed, ArcGaugeMethods, ArcGaugeData } from './ArcGauge';
+/**
+ * @hidden
+ */
+export interface CircularGaugeState extends ArcGaugeState {
+}
+/**
+ * @hidden
+ */
+export interface CircularGaugeComputed extends ArcGaugeComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface CircularGaugeMethods extends ArcGaugeMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface CircularGaugeData extends ArcGaugeData {
+}
+/**
+ * @hidden
+ */
+export interface CircularGaugeAll extends Vue2type, CircularGaugeMethods, CircularGaugeData, CircularGaugeComputed, CircularGaugeState {
+}
+/**
+ * @hidden
+ */
+declare let CircularGaugeVue2: ComponentOptions<CircularGaugeAll, DefaultData<CircularGaugeData>, DefaultMethods<CircularGaugeAll>, CircularGaugeComputed, RecordPropsDefinition<CircularGaugeProps>>;
+/**
+ * @hidden
+ */
+declare const CircularGauge: DefineComponent<CircularGaugeProps, any, CircularGaugeData, CircularGaugeComputed, CircularGaugeMethods, {}, {}, {}, string, CircularGaugeProps, CircularGaugeProps, {}>;
+export { CircularGauge, CircularGaugeVue2 };

package/dist/esm/CircularGauge.js

@@ -0,0 +1,41 @@
+var __assign = this && this.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+
+      for (var p in s) {
+        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+      }
+    }
+
+    return t;
+  };
+
+  return __assign.apply(this, arguments);
+}; // @ts-ignore
+
+
+import * as Vue from 'vue';
+var allVue = Vue;
+var gh = allVue.h;
+var isV3 = allVue.version && allVue.version[0] === '3';
+import { ArcGauge } from './ArcGauge.js';
+import { CircularGauge as KendoCircularGauge } from '@progress/kendo-charts';
+/**
+ * @hidden
+ */
+
+var CircularGaugeVue2 = __assign(__assign({}, ArcGauge), {
+  name: 'KendoCircularGauge',
+  created: function created() {
+    this.gaugeType = KendoCircularGauge;
+    this.arcCenterStyles = {};
+  }
+});
+/**
+ * @hidden
+ */
+
+
+var CircularGauge = CircularGaugeVue2;
+export { CircularGauge, CircularGaugeVue2 };

package/dist/esm/CircularGaugeProps.d.ts

@@ -0,0 +1,17 @@
+import { ArcGaugeProps } from './ArcGaugeProps';
+import { CircularScale } from './types/circular-scale.interface';
+import { ColorRange } from './types/color-range.interface';
+/**
+ * Represents the props of the [Kendo UI for Vue CircularGauge component]({% slug overview_circulargauge_gauges %}).
+ */
+export interface CircularGaugeProps extends ArcGaugeProps {
+    /**
+     * The color ranges of the value pointer
+     * ([see example]({% slug colorranges_circulargauge %})).
+     */
+    colors?: ColorRange[];
+    /**
+     * The scale options of the CircularGauge.
+     */
+    scale?: CircularScale;
+}

package/dist/esm/CircularGaugeProps.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/LinearGauge.d.ts

@@ -0,0 +1,43 @@
+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 { LinearGaugeProps } from './LinearGaugeProps';
+/**
+ * @hidden
+ */
+export interface LinearGaugeState {
+    baseGauge: any;
+}
+/**
+ * @hidden
+ */
+export interface LinearGaugeComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface LinearGaugeMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface LinearGaugeData {
+}
+/**
+ * @hidden
+ */
+export interface LinearGaugeAll extends Vue2type, LinearGaugeMethods, LinearGaugeData, LinearGaugeComputed, LinearGaugeState {
+}
+/**
+ * @hidden
+ */
+declare let LinearGaugeVue2: ComponentOptions<LinearGaugeAll, DefaultData<LinearGaugeData>, DefaultMethods<LinearGaugeAll>, LinearGaugeComputed, RecordPropsDefinition<LinearGaugeProps>>;
+/**
+ * @hidden
+ */
+declare const LinearGauge: DefineComponent<LinearGaugeProps, any, LinearGaugeData, LinearGaugeComputed, LinearGaugeMethods, {}, {}, {}, string, LinearGaugeProps, LinearGaugeProps, {}>;
+export { LinearGauge, LinearGaugeVue2 };

package/dist/esm/LinearGauge.js

@@ -0,0 +1,131 @@
+// @ts-ignore
+import * as Vue from 'vue';
+var allVue = Vue;
+var gh = allVue.h;
+var isV3 = allVue.version && allVue.version[0] === '3';
+import { BaseGauge } from './BaseGauge.js';
+import { LinearGauge as KendoLinearGauge } from '@progress/kendo-charts';
+import { Group } from '@progress/kendo-drawing';
+import { getDefaultSlots } from '@progress/kendo-vue-common';
+/**
+ * @hidden
+ */
+
+var LinearGaugeVue2 = {
+  name: 'KendoLinearGauge',
+  props: {
+    dir: String,
+    renderAs: {
+      type: String,
+      default: 'svg',
+      validator: function validator(value) {
+        return ['svg', 'canvas'].includes(value);
+      }
+    },
+    gaugeConstructor: [Object, Function],
+    pointer: {
+      type: [Object, Array],
+      default: undefined
+    },
+    scale: {
+      type: Object,
+      default: undefined
+    },
+    transitions: {
+      type: Boolean,
+      default: undefined
+    }
+  },
+  mounted: function mounted() {
+    this._baseGauge = this.v3 ? this.baseGaugeRef : this.$refs.baseGauge;
+  },
+  updated: function updated() {
+    this._baseGauge = this.v3 ? this.baseGaugeRef : this.$refs.baseGauge;
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    return {
+      v3: v3
+    };
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var _this = this;
+
+    var h = gh || createElement;
+    var defaultSlots = getDefaultSlots(this);
+    return (// @ts-ignore  function children
+      h(BaseGauge, {
+        transitions: this.$props.transitions,
+        attrs: this.v3 ? undefined : {
+          transitions: this.$props.transitions,
+          scale: this.$props.scale,
+          pointer: this.$props.pointer,
+          deriveOptionsFromParent: this.deriveOptionsFromParent,
+          gaugeConstructor: KendoLinearGauge,
+          getTarget: this.getTarget
+        },
+        scale: this.$props.scale,
+        pointer: this.$props.pointer,
+        deriveOptionsFromParent: this.deriveOptionsFromParent,
+        ref: this.v3 ? function (el) {
+          _this.baseGaugeRef = el;
+        } : 'baseGauge',
+        gaugeConstructor: KendoLinearGauge,
+        getTarget: this.getTarget,
+        "class": 'k-gauge'
+      }, this.v3 ? function () {
+        return [defaultSlots];
+      } : [defaultSlots])
+    );
+  },
+  methods: {
+    gaugeInstance: function gaugeInstance() {
+      if (this._baseGauge !== null) {
+        return this._baseGauge.gaugeInstance;
+      }
+
+      return null;
+    },
+    surface: function surface() {
+      if (this._baseGauge !== null) {
+        return this._baseGauge.surface;
+      }
+
+      return null;
+    },
+    element: function element() {
+      if (this._baseGauge !== null) {
+        return this._baseGauge.element;
+      }
+
+      return null;
+    },
+    exportVisual: function exportVisual(options) {
+      if (this.gaugeInstance() !== null) {
+        return Promise.resolve(this.gaugeInstance().exportVisual(options));
+      }
+
+      return Promise.resolve(new Group());
+    },
+    getTarget: function getTarget() {
+      return this;
+    },
+    deriveOptionsFromParent: function deriveOptionsFromParent(options) {
+      var _a = this.$props,
+          pointer = _a.pointer,
+          scale = _a.scale;
+      return Object.assign({}, options, {
+        pointer: pointer,
+        scale: scale
+      });
+    }
+  }
+};
+/**
+ * @hidden
+ */
+
+var LinearGauge = LinearGaugeVue2;
+export { LinearGauge, LinearGaugeVue2 };

package/dist/esm/LinearGaugeProps.d.ts

@@ -0,0 +1,15 @@
+import { BaseGaugeProps } from './BaseGaugeProps';
+import { LinearPointer, LinearScale } from './types';
+/**
+ * Represents the props of the [Kendo UI for Vue LinearGauge component]({% slug overview_lineargauge_gauges %}).
+ */
+export interface LinearGaugeProps extends BaseGaugeProps {
+    /**
+     * The configuration of the pointers ([see example]({% slug multiplepointers_lineargauge %})).
+     */
+    pointer: LinearPointer | LinearPointer[];
+    /**
+     * The configuration of the scale.
+     */
+    scale?: LinearScale;
+}

package/dist/esm/LinearGaugeProps.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/RadialGauge.d.ts

@@ -0,0 +1,43 @@
+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 { RadialGaugeProps } from './RadialGaugeProps';
+/**
+ * @hidden
+ */
+export interface RadialGaugeState {
+    baseGauge: any;
+}
+/**
+ * @hidden
+ */
+export interface RadialGaugeComputed {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface RadialGaugeMethods {
+    [key: string]: any;
+}
+/**
+ * @hidden
+ */
+export interface RadialGaugeData {
+}
+/**
+ * @hidden
+ */
+export interface RadialGaugeAll extends Vue2type, RadialGaugeMethods, RadialGaugeData, RadialGaugeComputed, RadialGaugeState {
+}
+/**
+ * @hidden
+ */
+declare let RadialGaugeVue2: ComponentOptions<RadialGaugeAll, DefaultData<RadialGaugeData>, DefaultMethods<RadialGaugeAll>, RadialGaugeComputed, RecordPropsDefinition<RadialGaugeProps>>;
+/**
+ * @hidden
+ */
+declare const RadialGauge: DefineComponent<RadialGaugeProps, any, RadialGaugeData, RadialGaugeComputed, RadialGaugeMethods, {}, {}, {}, string, RadialGaugeProps, RadialGaugeProps, {}>;
+export { RadialGauge, RadialGaugeVue2 };