kdutify 0.16.9-rc.0 → 2.6.1

package/es5/components/KDataTable/KEditDialog.js

@@ -1,22 +1,41 @@
-require('../../../src/stylus/components/_small-dialog.styl');
+"use strict";
 
-export default {
-  name: 'k-edit-dialog',
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
 
-  data: function data() {
-    return {
-      isActive: false,
-      isSaving: false
-    };
-  },
+require("..\\..\\..\\src\\components\\KDataTable\\KEditDialog.sass");
+
+var _returnable = _interopRequireDefault(require("../../mixins/returnable"));
+
+var _themeable = _interopRequireDefault(require("../../mixins/themeable"));
+
+var _helpers = require("../../util/helpers");
+
+var _KBtn = _interopRequireDefault(require("../KBtn"));
 
+var _KMenu = _interopRequireDefault(require("../KMenu"));
 
+var _mixins = _interopRequireDefault(require("../../util/mixins"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+// Styles
+// Mixins
+// Utils
+// Component
+
+/* @kdujs/component */
+var _default = (0, _mixins.default)(_returnable.default, _themeable.default).extend({
+  name: 'k-edit-dialog',
   props: {
     cancelText: {
       default: 'Cancel'
     },
     large: Boolean,
-    lazy: Boolean,
+    eager: Boolean,
+    persistent: Boolean,
     saveText: {
       default: 'Save'
     },
@@ -25,84 +44,110 @@ export default {
       default: 'slide-x-reverse-transition'
     }
   },
-
+  data: function data() {
+    return {
+      isActive: false
+    };
+  },
   watch: {
     isActive: function isActive(val) {
-      val && this.$emit('open') && setTimeout(this.focus, 50); // Give DOM time to paint
-
-      if (!val) {
-        !this.isSaving && this.$emit('cancel');
-        this.isSaving && this.$emit('close');
-        this.isSaving = false;
+      if (val) {
+        this.$emit('open');
+        setTimeout(this.focus, 50); // Give DOM time to paint
+      } else {
+        this.$emit('close');
       }
     }
   },
-
   methods: {
     cancel: function cancel() {
       this.isActive = false;
+      this.$emit('cancel');
     },
     focus: function focus() {
       var input = this.$refs.content.querySelector('input');
       input && input.focus();
     },
-    save: function save() {
-      this.isSaving = true;
-      this.isActive = false;
-      this.$emit('save');
-    },
     genButton: function genButton(fn, text) {
-      return this.$createElement('k-btn', {
+      return this.$createElement(_KBtn.default, {
         props: {
-          flat: true,
+          text: true,
           color: 'primary',
           light: true
         },
-        on: { click: fn }
+        on: {
+          click: fn
+        }
       }, text);
     },
     genActions: function genActions() {
+      var _this = this;
+
       return this.$createElement('div', {
-        'class': 'small-dialog__actions'
-      }, [this.genButton(this.cancel, this.cancelText), this.genButton(this.save, this.saveText)]);
+        class: 'k-small-dialog__actions'
+      }, [this.genButton(this.cancel, this.cancelText), this.genButton(function () {
+        _this.save(_this.returnValue);
+
+        _this.$emit('save');
+      }, this.saveText)]);
     },
     genContent: function genContent() {
-      var _this = this;
+      var _this2 = this;
 
       return this.$createElement('div', {
+        staticClass: 'k-small-dialog__content',
         on: {
           keydown: function keydown(e) {
-            e.keyCode === 27 && _this.cancel();
-            e.keyCode === 13 && _this.save();
+            e.keyCode === _helpers.keyCodes.esc && _this2.cancel();
+
+            if (e.keyCode === _helpers.keyCodes.enter) {
+              _this2.save(_this2.returnValue);
+
+              _this2.$emit('save');
+            }
           }
         },
         ref: 'content'
       }, [this.$slots.input]);
     }
   },
-
   render: function render(h) {
-    var _this2 = this;
+    var _this3 = this;
 
-    return h('k-menu', {
-      'class': 'small-dialog',
+    return h(_KMenu.default, {
+      staticClass: 'k-small-dialog',
+      class: this.themeClasses,
       props: {
-        contentClass: 'small-dialog__content',
+        contentClass: 'k-small-dialog__menu-content',
         transition: this.transition,
         origin: 'top right',
         right: true,
         value: this.isActive,
+        closeOnClick: !this.persistent,
         closeOnContentClick: false,
-        lazy: this.lazy
+        eager: this.eager,
+        light: this.light,
+        dark: this.dark
       },
       on: {
         input: function input(val) {
-          return _this2.isActive = val;
+          return _this3.isActive = val;
+        }
+      },
+      scopedSlots: {
+        activator: function activator(_ref) {
+          var on = _ref.on;
+          return h('div', {
+            staticClass: 'k-small-dialog__activator',
+            on: on
+          }, [h('span', {
+            staticClass: 'k-small-dialog__activator__content'
+          }, _this3.$slots.default)]);
         }
       }
-    }, [h('a', {
-      domProps: { href: 'javascript:;' },
-      slot: 'activator'
-    }, this.$slots.default), this.genContent(), this.large ? this.genActions() : null]);
+    }, [this.genContent(), this.large ? this.genActions() : null]);
   }
-};
+});
+
+exports.default = _default;
+//# sourceMappingURL=KEditDialog.js.map

package/es5/components/KDataTable/KEditDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/KDataTable/KEditDialog.ts"],"names":[],"mappings":"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","sourcesContent":["// Styles\nimport './KEditDialog.sass'\n\n// Mixins\nimport Returnable from '../../mixins/returnable'\nimport Themeable from '../../mixins/themeable'\n\n// Utils\nimport { keyCodes } from '../../util/helpers'\n\n// Component\nimport KBtn from '../KBtn'\nimport KMenu from '../KMenu'\n\n// Types\nimport { KNode, KNodeChildren } from 'kdu'\nimport mixins from '../../util/mixins'\n\n/* @kdujs/component */\nexport default mixins(Returnable, Themeable).extend({\n  name: 'k-edit-dialog',\n\n  props: {\n    cancelText: {\n      default: 'Cancel',\n    },\n    large: Boolean,\n    eager: Boolean,\n    persistent: Boolean,\n    saveText: {\n      default: 'Save',\n    },\n    transition: {\n      type: String,\n      default: 'slide-x-reverse-transition',\n    },\n  },\n\n  data () {\n    return {\n      isActive: false,\n    }\n  },\n\n  watch: {\n    isActive (val) {\n      if (val) {\n        this.$emit('open')\n        setTimeout(this.focus, 50) // Give DOM time to paint\n      } else {\n        this.$emit('close')\n      }\n    },\n  },\n\n  methods: {\n    cancel () {\n      this.isActive = false\n      this.$emit('cancel')\n    },\n    focus () {\n      const input = (this.$refs.content as Element).querySelector('input')\n      input && input.focus()\n    },\n    genButton (fn: Function, text: KNodeChildren): KNode {\n      return this.$createElement(KBtn, {\n        props: {\n          text: true,\n          color: 'primary',\n          light: true,\n        },\n        on: { click: fn },\n      }, text)\n    },\n    genActions (): KNode {\n      return this.$createElement('div', {\n        class: 'k-small-dialog__actions',\n      }, [\n        this.genButton(this.cancel, this.cancelText),\n        this.genButton(() => {\n          this.save(this.returnValue)\n          this.$emit('save')\n        }, this.saveText),\n      ])\n    },\n    genContent (): KNode {\n      return this.$createElement('div', {\n        staticClass: 'k-small-dialog__content',\n        on: {\n          keydown: (e: KeyboardEvent) => {\n            e.keyCode === keyCodes.esc && this.cancel()\n            if (e.keyCode === keyCodes.enter) {\n              this.save(this.returnValue)\n              this.$emit('save')\n            }\n          },\n        },\n        ref: 'content',\n      }, [this.$slots.input])\n    },\n  },\n\n  render (h): KNode {\n    return h(KMenu, {\n      staticClass: 'k-small-dialog',\n      class: this.themeClasses,\n      props: {\n        contentClass: 'k-small-dialog__menu-content',\n        transition: this.transition,\n        origin: 'top right',\n        right: true,\n        value: this.isActive,\n        closeOnClick: !this.persistent,\n        closeOnContentClick: false,\n        eager: this.eager,\n        light: this.light,\n        dark: this.dark,\n      },\n      on: {\n        input: (val: boolean) => (this.isActive = val),\n      },\n      scopedSlots: {\n        activator: ({ on }) => {\n          return h('div', {\n            staticClass: 'k-small-dialog__activator',\n            on,\n          }, [\n            h('span', {\n              staticClass: 'k-small-dialog__activator__content',\n            }, this.$slots.default),\n          ])\n        },\n      },\n    }, [\n      this.genContent(),\n      this.large ? this.genActions() : null,\n    ])\n  },\n})\n"],"sourceRoot":"","file":"KEditDialog.js"}

package/es5/components/KDataTable/KSimpleTable.js

@@ -0,0 +1,61 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("..\\..\\..\\src\\components\\KDataTable\\KSimpleTable.sass");
+
+var _helpers = require("../../util/helpers");
+
+var _themeable = _interopRequireDefault(require("../../mixins/themeable"));
+
+var _mixins = _interopRequireDefault(require("../../util/mixins"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+var _default = (0, _mixins.default)(_themeable.default).extend({
+  name: 'k-simple-table',
+  props: {
+    dense: Boolean,
+    fixedHeader: Boolean,
+    height: [Number, String]
+  },
+  computed: {
+    classes: function classes() {
+      return _objectSpread({
+        'k-data-table--dense': this.dense,
+        'k-data-table--fixed-height': !!this.height && !this.fixedHeader,
+        'k-data-table--fixed-header': this.fixedHeader,
+        'k-data-table--has-top': !!this.$slots.top,
+        'k-data-table--has-bottom': !!this.$slots.bottom
+      }, this.themeClasses);
+    }
+  },
+  methods: {
+    genWrapper: function genWrapper() {
+      return this.$slots.wrapper || this.$createElement('div', {
+        staticClass: 'k-data-table__wrapper',
+        style: {
+          height: (0, _helpers.convertToUnit)(this.height)
+        }
+      }, [this.$createElement('table', this.$slots.default)]);
+    }
+  },
+  render: function render(h) {
+    return h('div', {
+      staticClass: 'k-data-table',
+      class: this.classes
+    }, [this.$slots.top, this.genWrapper(), this.$slots.bottom]);
+  }
+});
+
+exports.default = _default;
+//# sourceMappingURL=KSimpleTable.js.map

package/es5/components/KDataTable/KSimpleTable.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/KDataTable/KSimpleTable.ts"],"names":[],"mappings":";;;;;;;AAAA;;AAEA;;AACA;;AACA;;;;;;;;;;eAGe,qBAAO,kBAAP,EAAkB,MAAlB,CAAyB;AACtC,EAAA,IAAI,EAAE,gBADgC;AAGtC,EAAA,KAAK,EAAE;AACL,IAAA,KAAK,EAAE,OADF;AAEL,IAAA,WAAW,EAAE,OAFR;AAGL,IAAA,MAAM,EAAE,CAAC,MAAD,EAAS,MAAT;AAHH,GAH+B;AAStC,EAAA,QAAQ,EAAE;AACR,IAAA,OADQ,qBACD;AACL;AACE,+BAAuB,KAAK,KAD9B;AAEE,sCAA8B,CAAC,CAAC,KAAK,MAAP,IAAiB,CAAC,KAAK,WAFvD;AAGE,sCAA8B,KAAK,WAHrC;AAIE,iCAAyB,CAAC,CAAC,KAAK,MAAL,CAAY,GAJzC;AAKE,oCAA4B,CAAC,CAAC,KAAK,MAAL,CAAY;AAL5C,SAMK,KAAK,YANV;AAQD;AAVO,GAT4B;AAsBtC,EAAA,OAAO,EAAE;AACP,IAAA,UADO,wBACG;AACR,aAAO,KAAK,MAAL,CAAY,OAAZ,IAAuB,KAAK,cAAL,CAAoB,KAApB,EAA2B;AACvD,QAAA,WAAW,EAAE,uBAD0C;AAEvD,QAAA,KAAK,EAAE;AACL,UAAA,MAAM,EAAE,4BAAc,KAAK,MAAnB;AADH;AAFgD,OAA3B,EAK3B,CACD,KAAK,cAAL,CAAoB,OAApB,EAA6B,KAAK,MAAL,CAAY,OAAzC,CADC,CAL2B,CAA9B;AAQD;AAVM,GAtB6B;AAmCtC,EAAA,MAnCsC,kBAmC9B,CAnC8B,EAmC7B;AACP,WAAO,CAAC,CAAC,KAAD,EAAQ;AACd,MAAA,WAAW,EAAE,cADC;AAEd,MAAA,KAAK,EAAE,KAAK;AAFE,KAAR,EAGL,CACD,KAAK,MAAL,CAAY,GADX,EAED,KAAK,UAAL,EAFC,EAGD,KAAK,MAAL,CAAY,MAHX,CAHK,CAAR;AAQD;AA5CqC,CAAzB,C","sourcesContent":["import './KSimpleTable.sass'\n\nimport { convertToUnit } from '../../util/helpers'\nimport Themeable from '../../mixins/themeable'\nimport mixins from '../../util/mixins'\nimport { KNode } from 'kdu'\n\nexport default mixins(Themeable).extend({\n  name: 'k-simple-table',\n\n  props: {\n    dense: Boolean,\n    fixedHeader: Boolean,\n    height: [Number, String],\n  },\n\n  computed: {\n    classes (): Record<string, boolean> {\n      return {\n        'k-data-table--dense': this.dense,\n        'k-data-table--fixed-height': !!this.height && !this.fixedHeader,\n        'k-data-table--fixed-header': this.fixedHeader,\n        'k-data-table--has-top': !!this.$slots.top,\n        'k-data-table--has-bottom': !!this.$slots.bottom,\n        ...this.themeClasses,\n      }\n    },\n  },\n\n  methods: {\n    genWrapper () {\n      return this.$slots.wrapper || this.$createElement('div', {\n        staticClass: 'k-data-table__wrapper',\n        style: {\n          height: convertToUnit(this.height),\n        },\n      }, [\n        this.$createElement('table', this.$slots.default),\n      ])\n    },\n  },\n\n  render (h): KNode {\n    return h('div', {\n      staticClass: 'k-data-table',\n      class: this.classes,\n    }, [\n      this.$slots.top,\n      this.genWrapper(),\n      this.$slots.bottom,\n    ])\n  },\n})\n"],"sourceRoot":"","file":"KSimpleTable.js"}

package/es5/components/KDataTable/KVirtualTable.js

@@ -0,0 +1,151 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("..\\..\\..\\src\\components\\KDataTable\\KVirtualTable.sass");
+
+var _KSimpleTable = _interopRequireDefault(require("./KSimpleTable"));
+
+var _mixins = _interopRequireDefault(require("../../util/mixins"));
+
+var _helpers = require("../../util/helpers");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+// Components
+// Utiltiies
+// Types
+var baseMixins = (0, _mixins.default)(_KSimpleTable.default);
+
+var _default2 = baseMixins.extend().extend({
+  name: 'k-virtual-table',
+  props: {
+    chunkSize: {
+      type: Number,
+      default: 25
+    },
+    headerHeight: {
+      type: Number,
+      default: 48
+    },
+    items: {
+      type: Array,
+      default: function _default() {
+        return [];
+      }
+    },
+    rowHeight: {
+      type: Number,
+      default: 48
+    }
+  },
+  data: function data() {
+    return {
+      scrollTop: 0,
+      oldChunk: 0,
+      scrollDebounce: null,
+      invalidateCache: false
+    };
+  },
+  computed: {
+    itemsLength: function itemsLength() {
+      return this.items.length;
+    },
+    totalHeight: function totalHeight() {
+      return this.itemsLength * this.rowHeight + this.headerHeight;
+    },
+    topIndex: function topIndex() {
+      return Math.floor(this.scrollTop / this.rowHeight);
+    },
+    chunkIndex: function chunkIndex() {
+      return Math.floor(this.topIndex / this.chunkSize);
+    },
+    startIndex: function startIndex() {
+      return Math.max(0, this.chunkIndex * this.chunkSize - this.chunkSize);
+    },
+    offsetTop: function offsetTop() {
+      return Math.max(0, this.startIndex * this.rowHeight);
+    },
+    stopIndex: function stopIndex() {
+      return Math.min(this.startIndex + this.chunkSize * 3, this.itemsLength);
+    },
+    offsetBottom: function offsetBottom() {
+      return Math.max(0, (this.itemsLength - this.stopIndex - this.startIndex) * this.rowHeight);
+    }
+  },
+  watch: {
+    chunkIndex: function chunkIndex(newValue, oldValue) {
+      this.oldChunk = oldValue;
+    },
+    items: function items() {
+      this.cachedItems = null;
+      this.$refs.table.scrollTop = 0;
+    }
+  },
+  created: function created() {
+    this.cachedItems = null;
+  },
+  mounted: function mounted() {
+    this.scrollDebounce = (0, _helpers.debounce)(this.onScroll, 50);
+    this.$refs.table.addEventListener('scroll', this.scrollDebounce, {
+      passive: true
+    });
+  },
+  beforeDestroy: function beforeDestroy() {
+    this.$refs.table.removeEventListener('scroll', this.scrollDebounce);
+  },
+  methods: {
+    createStyleHeight: function createStyleHeight(height) {
+      return {
+        height: "".concat(height, "px")
+      };
+    },
+    genBody: function genBody() {
+      if (this.cachedItems === null || this.chunkIndex !== this.oldChunk) {
+        this.cachedItems = this.genItems();
+        this.oldChunk = this.chunkIndex;
+      }
+
+      return this.$createElement('tbody', [this.$createElement('tr', {
+        style: this.createStyleHeight(this.offsetTop)
+      }), this.cachedItems, this.$createElement('tr', {
+        style: this.createStyleHeight(this.offsetBottom)
+      })]);
+    },
+    genItems: function genItems() {
+      return this.$scopedSlots.items({
+        items: this.items.slice(this.startIndex, this.stopIndex)
+      });
+    },
+    onScroll: function onScroll(e) {
+      var target = e.target;
+      this.scrollTop = target.scrollTop;
+    },
+    genTable: function genTable() {
+      return this.$createElement('div', {
+        ref: 'table',
+        staticClass: 'k-virtual-table__table'
+      }, [this.$createElement('table', [this.$slots['body.before'], this.genBody(), this.$slots['body.after']])]);
+    },
+    genWrapper: function genWrapper() {
+      return this.$createElement('div', {
+        staticClass: 'k-virtual-table__wrapper',
+        style: {
+          height: (0, _helpers.convertToUnit)(this.height)
+        }
+      }, [this.genTable()]);
+    }
+  },
+  render: function render(h) {
+    return h('div', {
+      staticClass: 'k-data-table k-virtual-table',
+      class: this.classes
+    }, [this.$slots.top, this.genWrapper(), this.$slots.bottom]);
+  }
+});
+
+exports.default = _default2;
+//# sourceMappingURL=KVirtualTable.js.map

package/es5/components/KDataTable/KVirtualTable.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/KDataTable/KVirtualTable.ts"],"names":[],"mappings":"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","sourcesContent":["import './KVirtualTable.sass'\n\n// Components\nimport KSimpleTable from './KSimpleTable'\n\n// Types\nimport { KNode, KNodeChildren } from 'kdu'\nimport { PropValidator } from 'kdu/types/options'\nimport mixins from '../../util/mixins'\n\n// Utiltiies\nimport { convertToUnit, debounce } from '../../util/helpers'\n\n// Types\nconst baseMixins = mixins(KSimpleTable)\n\ninterface options extends InstanceType<typeof baseMixins> {\n  $refs: {\n    table: HTMLElement\n  }\n  cachedItems: KNodeChildren\n}\n\nexport default baseMixins.extend<options>().extend({\n  name: 'k-virtual-table',\n\n  props: {\n    chunkSize: {\n      type: Number,\n      default: 25,\n    },\n    headerHeight: {\n      type: Number,\n      default: 48,\n    },\n    items: {\n      type: Array,\n      default: () => ([]),\n    } as PropValidator<any[]>,\n    rowHeight: {\n      type: Number,\n      default: 48,\n    },\n  },\n\n  data: () => ({\n    scrollTop: 0,\n    oldChunk: 0,\n    scrollDebounce: null as any,\n    invalidateCache: false,\n  }),\n\n  computed: {\n    itemsLength (): number {\n      return this.items.length\n    },\n    totalHeight (): number {\n      return (this.itemsLength * this.rowHeight) + this.headerHeight\n    },\n    topIndex (): number {\n      return Math.floor(this.scrollTop / this.rowHeight)\n    },\n    chunkIndex (): number {\n      return Math.floor(this.topIndex / this.chunkSize)\n    },\n    startIndex (): number {\n      return Math.max(0, (this.chunkIndex * this.chunkSize) - this.chunkSize)\n    },\n    offsetTop (): number {\n      return Math.max(0, this.startIndex * this.rowHeight)\n    },\n    stopIndex (): number {\n      return Math.min(this.startIndex + (this.chunkSize * 3), this.itemsLength)\n    },\n    offsetBottom (): number {\n      return Math.max(0, (this.itemsLength - this.stopIndex - this.startIndex) * this.rowHeight)\n    },\n  },\n\n  watch: {\n    chunkIndex (newValue, oldValue) {\n      this.oldChunk = oldValue\n    },\n    items () {\n      this.cachedItems = null\n      this.$refs.table.scrollTop = 0\n    },\n  },\n\n  created () {\n    this.cachedItems = null\n  },\n\n  mounted () {\n    this.scrollDebounce = debounce(this.onScroll, 50)\n\n    this.$refs.table.addEventListener('scroll', this.scrollDebounce, { passive: true })\n  },\n\n  beforeDestroy () {\n    this.$refs.table.removeEventListener('scroll', this.scrollDebounce)\n  },\n\n  methods: {\n    createStyleHeight (height: number) {\n      return {\n        height: `${height}px`,\n      }\n    },\n    genBody () {\n      if (this.cachedItems === null || this.chunkIndex !== this.oldChunk) {\n        this.cachedItems = this.genItems()\n        this.oldChunk = this.chunkIndex\n      }\n\n      return this.$createElement('tbody', [\n        this.$createElement('tr', { style: this.createStyleHeight(this.offsetTop) }),\n        this.cachedItems,\n        this.$createElement('tr', { style: this.createStyleHeight(this.offsetBottom) }),\n      ])\n    },\n    genItems () {\n      return this.$scopedSlots.items!({ items: this.items.slice(this.startIndex, this.stopIndex) })\n    },\n    onScroll (e: Event) {\n      const target = e.target as Element\n      this.scrollTop = target.scrollTop\n    },\n    genTable () {\n      return this.$createElement('div', {\n        ref: 'table',\n        staticClass: 'k-virtual-table__table',\n      }, [\n        this.$createElement('table', [\n          this.$slots['body.before'],\n          this.genBody(),\n          this.$slots['body.after'],\n        ]),\n      ])\n    },\n    genWrapper () {\n      return this.$createElement('div', {\n        staticClass: 'k-virtual-table__wrapper',\n        style: {\n          height: convertToUnit(this.height),\n        },\n      }, [\n        this.genTable(),\n      ])\n    },\n  },\n\n  render (h): KNode {\n    return h('div', {\n      staticClass: 'k-data-table k-virtual-table',\n      class: this.classes,\n    }, [\n      this.$slots.top,\n      this.genWrapper(),\n      this.$slots.bottom,\n    ])\n  },\n})\n"],"sourceRoot":"","file":"KVirtualTable.js"}

package/es5/components/KDataTable/MobileRow.js

@@ -0,0 +1,80 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _kdu = _interopRequireDefault(require("kdu"));
+
+var _helpers = require("../../util/helpers");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+var _default = _kdu.default.extend({
+  name: 'row',
+  functional: true,
+  props: {
+    headers: Array,
+    hideDefaultHeader: Boolean,
+    index: Number,
+    item: Object,
+    rtl: Boolean
+  },
+  render: function render(h, _ref) {
+    var props = _ref.props,
+        slots = _ref.slots,
+        data = _ref.data;
+    var computedSlots = slots();
+    var columns = props.headers.map(function (header) {
+      var classes = {
+        'k-data-table__mobile-row': true
+      };
+      var children = [];
+      var value = (0, _helpers.getObjectValueByPath)(props.item, header.value);
+      var slotName = header.value;
+      var scopedSlot = data.scopedSlots && data.scopedSlots[slotName];
+      var regularSlot = computedSlots[slotName];
+
+      if (scopedSlot) {
+        children.push(scopedSlot({
+          item: props.item,
+          isMobile: true,
+          header: header,
+          index: props.index,
+          value: value
+        }));
+      } else if (regularSlot) {
+        children.push(regularSlot);
+      } else {
+        children.push(value == null ? value : String(value));
+      }
+
+      var mobileRowChildren = [h('div', {
+        staticClass: 'k-data-table__mobile-row__cell'
+      }, children)];
+
+      if (header.value !== 'dataTableSelect' && !props.hideDefaultHeader) {
+        mobileRowChildren.unshift(h('div', {
+          staticClass: 'k-data-table__mobile-row__header'
+        }, [header.text]));
+      }
+
+      return h('td', {
+        class: classes
+      }, mobileRowChildren);
+    });
+    return h('tr', _objectSpread(_objectSpread({}, data), {}, {
+      staticClass: 'k-data-table__mobile-table-row'
+    }), columns);
+  }
+});
+
+exports.default = _default;
+//# sourceMappingURL=MobileRow.js.map

package/es5/components/KDataTable/MobileRow.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/KDataTable/MobileRow.ts"],"names":[],"mappings":";;;;;;;AAAA;;AACA;;;;;;;;;;eAGe,aAAI,MAAJ,CAAW;AACxB,EAAA,IAAI,EAAE,KADkB;AAGxB,EAAA,UAAU,EAAE,IAHY;AAKxB,EAAA,KAAK,EAAE;AACL,IAAA,OAAO,EAAE,KADJ;AAEL,IAAA,iBAAiB,EAAE,OAFd;AAGL,IAAA,KAAK,EAAE,MAHF;AAIL,IAAA,IAAI,EAAE,MAJD;AAKL,IAAA,GAAG,EAAE;AALA,GALiB;AAaxB,EAAA,MAbwB,kBAahB,CAbgB,QAaS;AAAA,QAApB,KAAoB,QAApB,KAAoB;AAAA,QAAb,KAAa,QAAb,KAAa;AAAA,QAAN,IAAM,QAAN,IAAM;AAC/B,QAAM,aAAa,GAAG,KAAK,EAA3B;AAEA,QAAM,OAAO,GAAY,KAAK,CAAC,OAAN,CAAc,GAAd,CAAkB,UAAC,MAAD,EAA4B;AACrE,UAAM,OAAO,GAAG;AACd,oCAA4B;AADd,OAAhB;AAIA,UAAM,QAAQ,GAAG,EAAjB;AACA,UAAM,KAAK,GAAG,mCAAqB,KAAK,CAAC,IAA3B,EAAiC,MAAM,CAAC,KAAxC,CAAd;AAEA,UAAM,QAAQ,GAAG,MAAM,CAAC,KAAxB;AACA,UAAM,UAAU,GAAG,IAAI,CAAC,WAAL,IAAoB,IAAI,CAAC,WAAL,CAAiB,QAAjB,CAAvC;AACA,UAAM,WAAW,GAAG,aAAa,CAAC,QAAD,CAAjC;;AAEA,UAAI,UAAJ,EAAgB;AACd,QAAA,QAAQ,CAAC,IAAT,CAAc,UAAU,CAAC;AACvB,UAAA,IAAI,EAAE,KAAK,CAAC,IADW;AAEvB,UAAA,QAAQ,EAAE,IAFa;AAGvB,UAAA,MAAM,EAAN,MAHuB;AAIvB,UAAA,KAAK,EAAE,KAAK,CAAC,KAJU;AAKvB,UAAA,KAAK,EAAL;AALuB,SAAD,CAAxB;AAOD,OARD,MAQO,IAAI,WAAJ,EAAiB;AACtB,QAAA,QAAQ,CAAC,IAAT,CAAc,WAAd;AACD,OAFM,MAEA;AACL,QAAA,QAAQ,CAAC,IAAT,CAAc,KAAK,IAAI,IAAT,GAAgB,KAAhB,GAAwB,MAAM,CAAC,KAAD,CAA5C;AACD;;AAED,UAAM,iBAAiB,GAAG,CACxB,CAAC,CAAC,KAAD,EAAQ;AACP,QAAA,WAAW,EAAE;AADN,OAAR,EAEE,QAFF,CADuB,CAA1B;;AAMA,UAAI,MAAM,CAAC,KAAP,KAAiB,iBAAjB,IAAsC,CAAC,KAAK,CAAC,iBAAjD,EAAoE;AAClE,QAAA,iBAAiB,CAAC,OAAlB,CACE,CAAC,CAAC,KAAD,EAAQ;AACP,UAAA,WAAW,EAAE;AADN,SAAR,EAEE,CAAC,MAAM,CAAC,IAAR,CAFF,CADH;AAKD;;AAED,aAAO,CAAC,CAAC,IAAD,EAAO;AAAE,QAAA,KAAK,EAAE;AAAT,OAAP,EAA2B,iBAA3B,CAAR;AACD,KAzCwB,CAAzB;AA2CA,WAAO,CAAC,CAAC,IAAD,kCAAY,IAAZ;AAAkB,MAAA,WAAW,EAAE;AAA/B,QAAmE,OAAnE,CAAR;AACD;AA5DuB,CAAX,C","sourcesContent":["import Kdu, { KNode, PropType } from 'kdu'\nimport { getObjectValueByPath } from '../../util/helpers'\nimport { DataTableHeader } from 'kdutify/types'\n\nexport default Kdu.extend({\n  name: 'row',\n\n  functional: true,\n\n  props: {\n    headers: Array as PropType<DataTableHeader[]>,\n    hideDefaultHeader: Boolean,\n    index: Number,\n    item: Object,\n    rtl: Boolean,\n  },\n\n  render (h, { props, slots, data }): KNode {\n    const computedSlots = slots()\n\n    const columns: KNode[] = props.headers.map((header: DataTableHeader) => {\n      const classes = {\n        'k-data-table__mobile-row': true,\n      }\n\n      const children = []\n      const value = getObjectValueByPath(props.item, header.value)\n\n      const slotName = header.value\n      const scopedSlot = data.scopedSlots && data.scopedSlots[slotName]\n      const regularSlot = computedSlots[slotName]\n\n      if (scopedSlot) {\n        children.push(scopedSlot({\n          item: props.item,\n          isMobile: true,\n          header,\n          index: props.index,\n          value,\n        }))\n      } else if (regularSlot) {\n        children.push(regularSlot)\n      } else {\n        children.push(value == null ? value : String(value))\n      }\n\n      const mobileRowChildren = [\n        h('div', {\n          staticClass: 'k-data-table__mobile-row__cell',\n        }, children),\n      ]\n\n      if (header.value !== 'dataTableSelect' && !props.hideDefaultHeader) {\n        mobileRowChildren.unshift(\n          h('div', {\n            staticClass: 'k-data-table__mobile-row__header',\n          }, [header.text])\n        )\n      }\n\n      return h('td', { class: classes }, mobileRowChildren)\n    })\n\n    return h('tr', { ...data, staticClass: 'k-data-table__mobile-table-row' }, columns)\n  },\n})\n"],"sourceRoot":"","file":"MobileRow.js"}

package/es5/components/KDataTable/Row.js

@@ -0,0 +1,79 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _kdu = _interopRequireDefault(require("kdu"));
+
+var _helpers = require("../../util/helpers");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
+
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function needsTd(slot) {
+  var _slot$;
+
+  return slot.length !== 1 || !['td', 'th'].includes((_slot$ = slot[0]) == null ? void 0 : _slot$.tag);
+}
+
+var _default = _kdu.default.extend({
+  name: 'row',
+  functional: true,
+  props: {
+    headers: Array,
+    index: Number,
+    item: Object,
+    rtl: Boolean
+  },
+  render: function render(h, _ref) {
+    var props = _ref.props,
+        slots = _ref.slots,
+        data = _ref.data;
+    var computedSlots = slots();
+    var columns = props.headers.map(function (header) {
+      var children = [];
+      var value = (0, _helpers.getObjectValueByPath)(props.item, header.value);
+      var slotName = header.value;
+      var scopedSlot = data.scopedSlots && data.scopedSlots[slotName];
+      var regularSlot = computedSlots[slotName];
+
+      if (scopedSlot) {
+        children.push.apply(children, _toConsumableArray((0, _helpers.wrapInArray)(scopedSlot({
+          item: props.item,
+          isMobile: false,
+          header: header,
+          index: props.index,
+          value: value
+        }))));
+      } else if (regularSlot) {
+        children.push.apply(children, _toConsumableArray((0, _helpers.wrapInArray)(regularSlot)));
+      } else {
+        children.push(value == null ? value : String(value));
+      }
+
+      var textAlign = "text-".concat(header.align || 'start');
+      return needsTd(children) ? h('td', {
+        class: [textAlign, header.cellClass, {
+          'k-data-table__divider': header.divider
+        }]
+      }, children) : children;
+    });
+    return h('tr', data, columns);
+  }
+});
+
+exports.default = _default;
+//# sourceMappingURL=Row.js.map

package/es5/components/KDataTable/Row.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/KDataTable/Row.ts"],"names":[],"mappings":";;;;;;;AACA;;AAIA;;;;;;;;;;;;;;;;AAEA,SAAS,OAAT,CAAkB,IAAlB,EAA2C;AAAA;;AACzC,SAAO,IAAK,CAAC,MAAN,KAAiB,CAAjB,IACL,CAAC,CAAC,IAAD,EAAO,IAAP,EAAa,QAAb,WAAsB,IAAK,CAAC,CAAD,CAA3B,qBAAsB,OAAU,GAAhC,CADH;AAED;;eAEc,aAAI,MAAJ,CAAW;AACxB,EAAA,IAAI,EAAE,KADkB;AAGxB,EAAA,UAAU,EAAE,IAHY;AAKxB,EAAA,KAAK,EAAE;AACL,IAAA,OAAO,EAAE,KADJ;AAEL,IAAA,KAAK,EAAE,MAFF;AAGL,IAAA,IAAI,EAAE,MAHD;AAIL,IAAA,GAAG,EAAE;AAJA,GALiB;AAYxB,EAAA,MAZwB,kBAYhB,CAZgB,QAYS;AAAA,QAApB,KAAoB,QAApB,KAAoB;AAAA,QAAb,KAAa,QAAb,KAAa;AAAA,QAAN,IAAM,QAAN,IAAM;AAC/B,QAAM,aAAa,GAAG,KAAK,EAA3B;AAEA,QAAM,OAAO,GAAG,KAAK,CAAC,OAAN,CAAc,GAAd,CAAkB,UAAC,MAAD,EAA4B;AAC5D,UAAM,QAAQ,GAAG,EAAjB;AACA,UAAM,KAAK,GAAG,mCAAqB,KAAK,CAAC,IAA3B,EAAiC,MAAM,CAAC,KAAxC,CAAd;AAEA,UAAM,QAAQ,GAAG,MAAM,CAAC,KAAxB;AACA,UAAM,UAAU,GAAG,IAAI,CAAC,WAAL,IAAoB,IAAI,CAAC,WAAL,CAAiB,QAAjB,CAAvC;AACA,UAAM,WAAW,GAAG,aAAa,CAAC,QAAD,CAAjC;;AAEA,UAAI,UAAJ,EAAgB;AACd,QAAA,QAAQ,CAAC,IAAT,OAAA,QAAQ,qBAAS,0BAAY,UAAU,CAAC;AACtC,UAAA,IAAI,EAAE,KAAK,CAAC,IAD0B;AAEtC,UAAA,QAAQ,EAAE,KAF4B;AAGtC,UAAA,MAAM,EAAN,MAHsC;AAItC,UAAA,KAAK,EAAE,KAAK,CAAC,KAJyB;AAKtC,UAAA,KAAK,EAAL;AALsC,SAAD,CAAtB,CAAT,EAAR;AAOD,OARD,MAQO,IAAI,WAAJ,EAAiB;AACtB,QAAA,QAAQ,CAAC,IAAT,OAAA,QAAQ,qBAAS,0BAAY,WAAZ,CAAT,EAAR;AACD,OAFM,MAEA;AACL,QAAA,QAAQ,CAAC,IAAT,CAAc,KAAK,IAAI,IAAT,GAAgB,KAAhB,GAAwB,MAAM,CAAC,KAAD,CAA5C;AACD;;AAED,UAAM,SAAS,kBAAW,MAAM,CAAC,KAAP,IAAgB,OAA3B,CAAf;AAEA,aAAO,OAAO,CAAC,QAAD,CAAP,GACH,CAAC,CAAC,IAAD,EAAO;AACR,QAAA,KAAK,EAAE,CACL,SADK,EAEL,MAAM,CAAC,SAFF,EAGL;AACE,mCAAyB,MAAM,CAAC;AADlC,SAHK;AADC,OAAP,EAQA,QARA,CADE,GAUH,QAVJ;AAWD,KAnCe,CAAhB;AAqCA,WAAO,CAAC,CAAC,IAAD,EAAO,IAAP,EAAa,OAAb,CAAR;AACD;AArDuB,CAAX,C","sourcesContent":["// Types\nimport Kdu, { KNode, PropType } from 'kdu'\nimport { DataTableHeader } from 'kdutify/types'\n\n// Utils\nimport { getObjectValueByPath, wrapInArray } from '../../util/helpers'\n\nfunction needsTd (slot: KNode[] | undefined) {\n  return slot!.length !== 1 ||\n    !['td', 'th'].includes(slot![0]?.tag!)\n}\n\nexport default Kdu.extend({\n  name: 'row',\n\n  functional: true,\n\n  props: {\n    headers: Array as PropType<DataTableHeader[]>,\n    index: Number,\n    item: Object,\n    rtl: Boolean,\n  },\n\n  render (h, { props, slots, data }): KNode {\n    const computedSlots = slots()\n\n    const columns = props.headers.map((header: DataTableHeader) => {\n      const children = []\n      const value = getObjectValueByPath(props.item, header.value)\n\n      const slotName = header.value\n      const scopedSlot = data.scopedSlots && data.scopedSlots[slotName]\n      const regularSlot = computedSlots[slotName]\n\n      if (scopedSlot) {\n        children.push(...wrapInArray(scopedSlot({\n          item: props.item,\n          isMobile: false,\n          header,\n          index: props.index,\n          value,\n        })))\n      } else if (regularSlot) {\n        children.push(...wrapInArray(regularSlot))\n      } else {\n        children.push(value == null ? value : String(value))\n      }\n\n      const textAlign = `text-${header.align || 'start'}`\n\n      return needsTd(children)\n        ? h('td', {\n          class: [\n            textAlign,\n            header.cellClass,\n            {\n              'k-data-table__divider': header.divider,\n            },\n          ],\n        }, children)\n        : children\n    })\n\n    return h('tr', data, columns)\n  },\n})\n"],"sourceRoot":"","file":"Row.js"}