@progress/kendo-vue-data-tools 3.5.0-dev.202208020811 → 3.5.1-dev.202208110751

package/dist/esm/pager/Pager.js

@@ -0,0 +1,398 @@
+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';
+var inject = allVue.inject;
+import { PagerNumericButtons } from './PagerNumericButtons.js';
+import { PagerInput } from './PagerInput.js';
+import { PagerPageSizes } from './PagerPageSizes.js';
+import { PagerInfo } from './PagerInfo.js';
+import { PagerNavigationButton } from './PagerNavigationButton.js';
+import { messages, pagerFirstPage, pagerLastPage, pagerNextPage, pagerPreviousPage } from '../messages.js';
+import { provideLocalizationService } from '@progress/kendo-vue-intl';
+import { getListeners, getTemplate, hasListener, templateRendering } from '@progress/kendo-vue-common';
+/**
+ * @hidden
+ */
+
+var RESPONSIVE_BREAKPOINT_MEDIUM = 600;
+/**
+ * @hidden
+ */
+
+var RESPONSIVE_BREAKPOINT_LARGE = 768;
+/**
+ * @hidden
+ */
+
+var PagerVue2 = {
+  name: 'KendoPager',
+  props: {
+    pageSizeValue: [String, Number],
+    total: Number,
+    skip: Number,
+    take: Number,
+    pageSize: Number,
+    settings: [Object, Boolean],
+    buttonCount: {
+      type: Number,
+      default: 10
+    },
+    info: {
+      type: Boolean,
+      default: true
+    },
+    type: {
+      type: String,
+      default: 'numeric',
+      validator: function validator(value) {
+        return ['numeric', 'input'].includes(value);
+      }
+    },
+    pageSizes: {
+      type: Array
+    },
+    previousNext: Boolean,
+    messagesMap: Function,
+    responsive: {
+      type: Boolean,
+      default: true
+    },
+    pagerRender: [String, Function, Object],
+    width: [Number, String]
+  },
+  data: function data() {
+    return {
+      size: 'normal'
+    };
+  },
+  mounted: function mounted() {
+    window.addEventListener('resize', this.onWindowResize);
+    this.onWindowResize();
+  },
+  updated: function updated() {
+    this.onWindowResize();
+  },
+  destroyed: !!isV3 ? undefined : function () {
+    window.removeEventListener('resize', this.onWindowResize);
+  },
+  // @ts-ignore
+  unmounted: function unmounted() {
+    window.removeEventListener('resize', this.onWindowResize);
+  },
+  inject: {
+    kendoLocalizationService: {
+      default: null
+    },
+    kendoIntlService: {
+      default: null
+    }
+  },
+  computed: {
+    wrapperClass: {
+      get: function get() {
+        return {
+          'k-pager-wrap k-pager k-widget': true,
+          'k-pager-sm': this.size === 'small',
+          'k-pager-md': this.size === 'medium'
+        };
+      }
+    },
+    totalPages: {
+      get: function get() {
+        return Math.ceil((this.$props.total || 0) / this.currentTake);
+      }
+    },
+    currentPage: {
+      get: function get() {
+        return Math.floor((this.$props.skip || 0) / this.currentTake) + 1;
+      }
+    },
+    currentTake: {
+      get: function get() {
+        return this.$props.take || this.$props.pageSize;
+      }
+    }
+  },
+  methods: {
+    changePage: function changePage(page, e) {
+      if (page > 0 && page <= this.totalPages) {
+        this.$emit('pagechange', {
+          skip: (page - 1) * this.currentTake,
+          take: this.currentTake
+        }, e);
+      }
+    },
+    triggerPageChange: function triggerPageChange(state, event) {
+      var pagesizechange = hasListener.call(this, 'pagesizechange');
+
+      if (pagesizechange) {
+        this.$emit('pagesizechange', state, event);
+      } else {
+        this.$emit('pagechange', state, event);
+      }
+    },
+    onWindowResize: function onWindowResize() {
+      var element = this.$el;
+
+      if (!element || !this.$props.responsive || this.$props.settings.responsive === false) {
+        return;
+      }
+
+      var width = element.offsetWidth;
+
+      if (width < RESPONSIVE_BREAKPOINT_MEDIUM) {
+        this.size = 'small';
+      } else if (width >= RESPONSIVE_BREAKPOINT_MEDIUM && width < RESPONSIVE_BREAKPOINT_LARGE) {
+        this.size = 'medium';
+      } else {
+        this.size = 'large';
+      }
+    },
+    transformDimesion: function transformDimesion(initialValue) {
+      return typeof initialValue === 'string' ? initialValue.endsWith('px') ? initialValue : initialValue + 'px' : initialValue + 'px';
+    }
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    var kendoIntlService = inject('kendoIntlService', {});
+    var kendoLocalizationService = inject('kendoLocalizationService', {});
+    return {
+      v3: v3,
+      kendoIntlService: kendoIntlService,
+      kendoLocalizationService: kendoLocalizationService
+    };
+  },
+  // @ts-ignore 
+  render: function render(createElement) {
+    var h = gh || createElement;
+    var _a = this.$props,
+        skip = _a.skip,
+        take = _a.take,
+        total = _a.total,
+        pageSizes = _a.pageSizes,
+        buttonCount = _a.buttonCount,
+        messagesMap = _a.messagesMap,
+        info = _a.info,
+        type = _a.type,
+        previousNext = _a.previousNext,
+        pageSizeValue = _a.pageSizeValue;
+
+    var settings = __assign({
+      pageSizes: pageSizes,
+      buttonCount: buttonCount,
+      info: info,
+      previousNext: previousNext,
+      type: type,
+      skip: skip,
+      take: take,
+      total: total,
+      messagesMap: messagesMap,
+      pageSizeValue: pageSizeValue
+    }, this.$props.settings);
+
+    var pagerRender = this.$props.pagerRender || this.$props.settings.pagerRender;
+    var pagerRenderTemplate = pagerRender ? templateRendering.call(this, pagerRender, getListeners.call(this)) : null;
+    var localizationService = provideLocalizationService(this);
+    var firstPageMessage = messagesMap ? messagesMap(pagerFirstPage) : {
+      messageKey: pagerFirstPage,
+      defaultMessage: messages[pagerFirstPage]
+    };
+    var previousPageMessage = messagesMap ? messagesMap(pagerPreviousPage) : {
+      messageKey: pagerPreviousPage,
+      defaultMessage: messages[pagerPreviousPage]
+    };
+    var nextPageMessage = messagesMap ? messagesMap(pagerNextPage) : {
+      messageKey: pagerNextPage,
+      defaultMessage: messages[pagerNextPage]
+    };
+    var lastPageMessage = messagesMap ? messagesMap(pagerLastPage) : {
+      messageKey: pagerLastPage,
+      defaultMessage: messages[pagerLastPage]
+    };
+    var changer = settings.type === 'numeric' ? // @ts-ignore
+    h(PagerNumericButtons, {
+      size: this.size,
+      attrs: this.v3 ? undefined : {
+        size: this.size,
+        buttonCount: settings.buttonCount || 0,
+        totalPages: this.totalPages,
+        currentPage: this.currentPage
+      },
+      buttonCount: settings.buttonCount || 0,
+      totalPages: this.totalPages,
+      currentPage: this.currentPage,
+      onPagechange: this.changePage,
+      on: this.v3 ? undefined : {
+        "pagechange": this.changePage
+      }
+    }) : // @ts-ignore
+    h(PagerInput, {
+      currentPage: this.currentPage,
+      attrs: this.v3 ? undefined : {
+        currentPage: this.currentPage,
+        totalPages: this.totalPages,
+        messagesMap: messagesMap
+      },
+      totalPages: this.totalPages,
+      onPagechange: this.changePage,
+      on: this.v3 ? undefined : {
+        "pagechange": this.changePage
+      },
+      messagesMap: messagesMap
+    });
+    var first, prev, next, last;
+
+    if (settings.previousNext) {
+      first = // @ts-ignore function children
+      h(PagerNavigationButton, {
+        "class": 'k-pager-first' + (this.currentPage === 1 ? ' k-disabled' : ''),
+        page: 1,
+        attrs: this.v3 ? undefined : {
+          page: 1,
+          title: localizationService.toLanguageString(firstPageMessage.messageKey, firstPageMessage.defaultMessage),
+          icon: 'k-icon k-i-seek-w'
+        },
+        title: localizationService.toLanguageString(firstPageMessage.messageKey, firstPageMessage.defaultMessage),
+        icon: 'k-icon k-i-seek-w',
+        onPagechange: this.changePage,
+        on: this.v3 ? undefined : {
+          "pagechange": this.changePage
+        }
+      });
+      prev = // @ts-ignore function children
+      h(PagerNavigationButton, {
+        "class": this.currentPage === 1 ? ' k-disabled' : '',
+        page: this.currentPage - 1,
+        attrs: this.v3 ? undefined : {
+          page: this.currentPage - 1,
+          title: localizationService.toLanguageString(previousPageMessage.messageKey, previousPageMessage.defaultMessage),
+          icon: 'k-icon k-i-arrow-w'
+        },
+        title: localizationService.toLanguageString(previousPageMessage.messageKey, previousPageMessage.defaultMessage),
+        icon: 'k-icon k-i-arrow-w',
+        onPagechange: this.changePage,
+        on: this.v3 ? undefined : {
+          "pagechange": this.changePage
+        }
+      });
+      next = // @ts-ignore function children
+      h(PagerNavigationButton, {
+        "class": this.currentPage === this.totalPages ? ' k-disabled' : '',
+        page: this.currentPage + 1,
+        attrs: this.v3 ? undefined : {
+          page: this.currentPage + 1,
+          title: localizationService.toLanguageString(nextPageMessage.messageKey, nextPageMessage.defaultMessage),
+          icon: 'k-icon k-i-arrow-e'
+        },
+        title: localizationService.toLanguageString(nextPageMessage.messageKey, nextPageMessage.defaultMessage),
+        icon: 'k-icon k-i-arrow-e',
+        onPagechange: this.changePage,
+        on: this.v3 ? undefined : {
+          "pagechange": this.changePage
+        }
+      });
+      last = // @ts-ignore function children
+      h(PagerNavigationButton, {
+        "class": 'k-pager-last' + (this.currentPage === this.totalPages ? ' k-disabled' : ''),
+        page: this.totalPages,
+        attrs: this.v3 ? undefined : {
+          page: this.totalPages,
+          title: localizationService.toLanguageString(lastPageMessage.messageKey, lastPageMessage.defaultMessage),
+          icon: 'k-icon k-i-seek-e'
+        },
+        title: localizationService.toLanguageString(lastPageMessage.messageKey, lastPageMessage.defaultMessage),
+        icon: 'k-icon k-i-seek-e',
+        onPagechange: this.changePage,
+        on: this.v3 ? undefined : {
+          "pagechange": this.changePage
+        }
+      });
+    }
+
+    var renderPageSizes = settings.pageSizes && // @ts-ignore function children
+    h(PagerPageSizes, {
+      onPagechange: this.triggerPageChange,
+      on: this.v3 ? undefined : {
+        "pagechange": this.triggerPageChange
+      },
+      pageSize: this.currentTake,
+      attrs: this.v3 ? undefined : {
+        pageSize: this.currentTake,
+        pageSizes: settings.pageSizes,
+        value: settings.pageSizeValue,
+        messagesMap: messagesMap
+      },
+      pageSizes: settings.pageSizes,
+      value: settings.pageSizeValue,
+      messagesMap: messagesMap
+    });
+    var infoElement = !settings.info ? '' : // @ts-ignore function children
+    h(PagerInfo, {
+      totalPages: this.$props.total,
+      attrs: this.v3 ? undefined : {
+        totalPages: this.$props.total,
+        skip: this.$props.skip,
+        currentPage: this.currentTake,
+        messagesMap: messagesMap
+      },
+      skip: this.$props.skip,
+      currentPage: this.currentTake,
+      messagesMap: messagesMap
+    });
+    var pagerContent = getTemplate.call(this, {
+      h: h,
+      template: pagerRenderTemplate,
+      additionalProps: __assign(__assign({}, this.$props), {
+        current: this.currentPage
+      }),
+      additionalListeners: {
+        pagechange: this.triggerPageChange
+      }
+    });
+    var width = this.transformDimesion(this.$props.width);
+    return pagerRender ? h("div", {
+      "class": this.wrapperClass,
+      style: {
+        width: width
+      },
+      role: "navigation",
+      attrs: this.v3 ? undefined : {
+        role: "navigation"
+      }
+    }, [pagerContent]) : h("div", {
+      "class": this.wrapperClass,
+      style: {
+        width: width
+      },
+      role: "navigation",
+      attrs: this.v3 ? undefined : {
+        role: "navigation"
+      }
+    }, [first, prev, changer, next, last, renderPageSizes, infoElement]);
+  }
+};
+/**
+ * @hidden
+ */
+
+var Pager = PagerVue2;
+export { Pager, PagerVue2 };

package/dist/esm/pager/PagerInfo.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;
+};
+export interface PagerInfoProps {
+    /**
+     * The number of pages.
+     */
+    totalPages: number;
+    /**
+     * The current page.
+     */
+    currentPage: number;
+    /**
+     * The number of pages to be skipped.
+     */
+    skip: number;
+    /**
+     * @hidden
+     */
+    messagesMap?: (messageKey: string) => ({
+        messageKey: string;
+        defaultMessage: string;
+    });
+}
+/**
+ * @hidden
+ */
+export interface PagerInfoMethods extends Vue2type {
+}
+/**
+ * @hidden
+ */
+export interface PagerInfoState {
+    _text: string | undefined;
+}
+/**
+ * @hidden
+ */
+export interface PagerInfoAll extends PagerInfoMethods, PagerInfoState {
+}
+/**
+ * @hidden
+ */
+declare let PagerInfoVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<PagerInfoAll>, {}, RecordPropsDefinition<PagerInfoProps>>;
+/**
+ * @hidden
+ */
+declare const PagerInfo: DefineComponent<PagerInfoProps, any, {}, {}, PagerInfoMethods, {}, {}, {}, string, PagerInfoProps, PagerInfoProps, {}>;
+export { PagerInfo, PagerInfoVue2 };

package/dist/esm/pager/PagerInfo.js

@@ -0,0 +1,59 @@
+// @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, provideLocalizationService } from '@progress/kendo-vue-intl';
+import { messages, pagerInfo } from '../messages.js';
+/**
+ * @hidden
+ */
+
+var PagerInfoVue2 = {
+  name: 'KendoPagerInfo',
+  props: {
+    totalPages: Number,
+    currentPage: Number,
+    skip: Number,
+    messagesMap: Function
+  },
+  inject: {
+    kendoLocalizationService: {
+      default: null
+    },
+    kendoIntlService: {
+      default: null
+    }
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    var kendoIntlService = inject('kendoIntlService', {});
+    var kendoLocalizationService = inject('kendoLocalizationService', {});
+    return {
+      v3: v3,
+      kendoIntlService: kendoIntlService,
+      kendoLocalizationService: kendoLocalizationService
+    };
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var h = gh || createElement;
+    var intlService = provideIntlService(this);
+    var localizationService = provideLocalizationService(this);
+    var infoMessage = this.$props.messagesMap ? this.$props.messagesMap(pagerInfo) : {
+      messageKey: pagerInfo,
+      defaultMessage: messages[pagerInfo]
+    };
+    return h("div", {
+      "class": "k-pager-info k-label"
+    }, [intlService.format(localizationService.toLanguageString(infoMessage.messageKey, infoMessage.defaultMessage), [Math.min(this.$props.skip + 1, this.$props.totalPages), Math.min(this.$props.skip + this.$props.currentPage, this.$props.totalPages), this.$props.totalPages])]);
+  }
+};
+/**
+ * @hidden
+ */
+
+var PagerInfo = PagerInfoVue2;
+export { PagerInfo, PagerInfoVue2 };

package/dist/esm/pager/PagerInput.d.ts

@@ -0,0 +1,50 @@
+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;
+};
+export interface PagerInputProps {
+    /**
+     * The number of pages.
+     */
+    totalPages: number;
+    /**
+     * The current page.
+     */
+    currentPage: number;
+    /**
+     * @hidden
+     */
+    messagesMap?: (messageKey: string) => ({
+        messageKey: string;
+        defaultMessage: string;
+    });
+}
+/**
+ * @hidden
+ */
+export interface PagerInputMethods extends Vue2type {
+    changeHangler: (e: any) => void;
+    blurHandler: () => void;
+    value: () => any;
+}
+/**
+ * @hidden
+ */
+export interface PagerInputState {
+    _text: string | undefined;
+}
+/**
+ * @hidden
+ */
+export interface PagerInputAll extends PagerInputMethods, PagerInputState {
+}
+/**
+ * @hidden
+ */
+declare let PagerInputVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<PagerInputAll>, {}, RecordPropsDefinition<PagerInputProps>>;
+/**
+ * @hidden
+ */
+declare const PagerInput: DefineComponent<PagerInputProps, any, {}, {}, PagerInputMethods, {}, {}, {}, string, PagerInputProps, PagerInputProps, {}>;
+export { PagerInput, PagerInputVue2 };

package/dist/esm/pager/PagerInput.js

@@ -0,0 +1,101 @@
+// @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 { messages, pagerOf, pagerPage, pagerTotalPages } from './../messages.js';
+import { provideIntlService, provideLocalizationService } from '@progress/kendo-vue-intl';
+/**
+ * @hidden
+ */
+
+var PagerInputVue2 = {
+  name: 'KendoPagerInput',
+  props: {
+    totalPages: Number,
+    currentPage: Number,
+    messagesMap: Function
+  },
+  inject: {
+    kendoIntlService: {
+      default: null
+    },
+    kendoLocalizationService: {
+      default: null
+    }
+  },
+  created: function created() {
+    this._text = undefined;
+  },
+  methods: {
+    changeHangler: function changeHangler(e) {
+      var text = this._text = e.target.value.replace(/\D/g, '');
+      this.$forceUpdate();
+
+      if (text) {
+        this.$emit('pagechange', parseInt(text, 10), e);
+      }
+    },
+    blurHandler: function blurHandler() {
+      this.$forceUpdate();
+    },
+    value: function value() {
+      var value = this._text === undefined ? this.$props.currentPage.toString() : this._text;
+      this._text = undefined;
+      return value;
+    }
+  },
+  // @ts-ignore
+  setup: !isV3 ? undefined : function () {
+    var v3 = !!isV3;
+    var kendoIntlService = inject('kendoIntlService', {});
+    var kendoLocalizationService = inject('kendoLocalizationService', {});
+    return {
+      v3: v3,
+      kendoIntlService: kendoIntlService,
+      kendoLocalizationService: kendoLocalizationService
+    };
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var h = gh || createElement;
+    var intlService = provideIntlService(this);
+    var localizationService = provideLocalizationService(this);
+    var pageMessage = this.$props.messagesMap ? this.$props.messagesMap(pagerPage) : {
+      messageKey: pagerPage,
+      defaultMessage: messages[pagerPage]
+    };
+    var ofMessage = this.$props.messagesMap ? this.$props.messagesMap(pagerOf) : {
+      messageKey: pagerOf,
+      defaultMessage: messages[pagerOf]
+    };
+    var totalPagesMessage = this.$props.messagesMap ? this.$props.messagesMap(pagerTotalPages) : {
+      messageKey: pagerTotalPages,
+      defaultMessage: messages[pagerTotalPages]
+    };
+    return h("span", {
+      "class": "k-pager-input k-label"
+    }, [localizationService.toLanguageString(pageMessage.messageKey, pageMessage.defaultMessage), h("span", {
+      "class": "k-textbox k-input k-input-md k-rounded-md k-input-solid"
+    }, [h("input", {
+      "class": "k-input-inner",
+      value: this.v3 ? this.value() : null,
+      domProps: this.v3 ? undefined : {
+        "value": this.value()
+      },
+      onBlur: this.blurHandler,
+      on: this.v3 ? undefined : {
+        "blur": this.blurHandler,
+        "change": this.changeHangler
+      },
+      onChange: this.changeHangler
+    })]), " ", "".concat(localizationService.toLanguageString(ofMessage.messageKey, ofMessage.defaultMessage), " ").concat(intlService.format(localizationService.toLanguageString(totalPagesMessage.messageKey, totalPagesMessage.defaultMessage), [this.$props.totalPages]))]);
+  }
+};
+/**
+ * @hidden
+ */
+
+var PagerInput = PagerInputVue2;
+export { PagerInput, PagerInputVue2 };

package/dist/esm/pager/PagerNavigationButton.d.ts

@@ -0,0 +1,50 @@
+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;
+};
+export interface PagerNavigationButtonProps {
+    /**
+     * The title of the button.
+     */
+    title: string;
+    /**
+     * The class responsible for the icon of the button.
+     */
+    icon: string;
+    /**
+     * The page number returned when the button is clicked.
+     */
+    page: number;
+}
+export interface PagerNavigationButtonEmits {
+    /**
+     * The pagechange event.
+     */
+    pagechange: (page: string, event: any) => void;
+}
+/**
+ * @hidden
+ */
+export interface PagerNavigationButtonMethods extends Vue2type {
+    changePage: (e: any) => void;
+}
+/**
+ * @hidden
+ */
+export interface PagerNavigationButtonState {
+}
+/**
+ * @hidden
+ */
+export interface PagerNavigationButtonAll extends PagerNavigationButtonMethods, PagerNavigationButtonState {
+}
+/**
+ * @hidden
+ */
+declare let PagerNavigationButtonVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<PagerNavigationButtonAll>, {}, RecordPropsDefinition<PagerNavigationButtonProps>>;
+/**
+ * @hidden
+ */
+declare const PagerNavigationButton: DefineComponent<PagerNavigationButtonProps, any, {}, {}, PagerNavigationButtonMethods, {}, {}, {}, string, PagerNavigationButtonProps, PagerNavigationButtonProps, {}>;
+export { PagerNavigationButton, PagerNavigationButtonVue2 };