npm - @zeedhi/teknisa-components-vuetify - Versions diffs - 1.45.0 → 1.50.0 - Mend

@zeedhi/teknisa-components-vuetify 1.45.0 → 1.50.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/dist/tek-components-vuetify.esm.js +577 -375
package/dist/tek-components-vuetify.umd.js +593 -390
package/package.json +4 -2
package/types/components/public.d.ts +3 -1
package/types/components/tek-user-info/TekUserInfo.d.ts +12 -0
package/types/components/tek-user-info/TekUserInfoList.d.ts +9 -0

package/dist/tek-components-vuetify.umd.js CHANGED Viewed

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@zeedhi/common'), require('vue-property-decorator'), require('@zeedhi/teknisa-components-common'), require('@zeedhi/vuetify'), require('@zeedhi/core'), require('lodash.debounce'), require('sortablejs'), require('lodash.clonedeep')) :
-    typeof define === 'function' && define.amd ? define(['exports', '@zeedhi/common', 'vue-property-decorator', '@zeedhi/teknisa-components-common', '@zeedhi/vuetify', '@zeedhi/core', 'lodash.debounce', 'sortablejs', 'lodash.clonedeep'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["@zeedhi/teknisa-components-vuetify"] = {}, global.common, global["vue-property-decorator"], global["@zeedhi/teknisa-components-common"], global.vuetify, global.core, global.lodash.debounce, global.sortablejs, global.lodash.clonedeep));
-})(this, (function (exports, common, vuePropertyDecorator, teknisaComponentsCommon, vuetify, core, debounce, Sortable, cloneDeep) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@zeedhi/common'), require('@zeedhi/zd-user-info-vue'), require('vue-property-decorator'), require('@zeedhi/teknisa-components-common'), require('@zeedhi/vuetify'), require('@zeedhi/core'), require('lodash.debounce'), require('sortablejs'), require('lodash.clonedeep')) :
+    typeof define === 'function' && define.amd ? define(['exports', '@zeedhi/common', '@zeedhi/zd-user-info-vue', 'vue-property-decorator', '@zeedhi/teknisa-components-common', '@zeedhi/vuetify', '@zeedhi/core', 'lodash.debounce', 'sortablejs', 'lodash.clonedeep'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["@zeedhi/teknisa-components-vuetify"] = {}, global.common, global["@zeedhi/zd-user-info-vue"], global["vue-property-decorator"], global["@zeedhi/teknisa-components-common"], global.vuetify, global.core, global.lodash.debounce, global.sortablejs, global.lodash.clonedeep));
+})(this, (function (exports, common, zdUserInfoVue, vuePropertyDecorator, teknisaComponentsCommon, vuetify, core, debounce, Sortable, cloneDeep) { 'use strict';
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -46,7 +46,7 @@
         }
     };
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekBreadcrumbHeader.prototype, "title", void 0);
     __decorate([
@@ -60,7 +60,7 @@
     TekBreadcrumbHeader = __decorate([
         vuePropertyDecorator.Component
     ], TekBreadcrumbHeader);
-    var script$g = TekBreadcrumbHeader;
+    var script$i = TekBreadcrumbHeader;
     function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) {
         if (typeof shadowMode !== 'boolean') {
@@ -191,10 +191,10 @@
     }
     /* script */
-    const __vue_script__$g = script$g;
+    const __vue_script__$i = script$i;
     /* template */
-    var __vue_render__$g = function () {
+    var __vue_render__$i = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -265,34 +265,34 @@
         1
       )
     };
-    var __vue_staticRenderFns__$g = [];
-    __vue_render__$g._withStripped = true;
+    var __vue_staticRenderFns__$i = [];
+    __vue_render__$i._withStripped = true;
       /* style */
-      const __vue_inject_styles__$g = function (inject) {
+      const __vue_inject_styles__$i = function (inject) {
         if (!inject) return
         inject("data-v-4982d92e_0", { source: ".tek-breadcrumb-header .tek-breadcrumb-header-title-col {\n  display: flex;\n  padding-top: 5px;\n  padding-left: 0;\n}\n.tek-breadcrumb-header .tek-breadcrumb-header-title-col .tek-breadcrumb-header-slot-right {\n  margin-left: auto;\n}\n.tek-breadcrumb-header .zd-breadcrumbs {\n  padding: 0;\n  font-size: var(--zd-font-body2-size);\n}\n.tek-breadcrumb-header .zd-breadcrumbs .v-breadcrumbs__item--disabled {\n  color: #667080;\n}\n.tek-breadcrumb-header .zd-text {\n  color: #667080;\n}\n.tek-breadcrumb-header .zd-text.tek-breadcrumb-header-title {\n  font-size: 32px;\n  font-weight: bold;\n  line-height: 35px;\n  margin-bottom: 10px;\n}\n.tek-breadcrumb-header .zd-text > p {\n  margin: 0;\n}", map: undefined, media: undefined });
       };
       /* scoped */
-      const __vue_scope_id__$g = undefined;
+      const __vue_scope_id__$i = undefined;
       /* module identifier */
-      const __vue_module_identifier__$g = undefined;
+      const __vue_module_identifier__$i = undefined;
       /* functional template */
-      const __vue_is_functional_template__$g = false;
+      const __vue_is_functional_template__$i = false;
       /* style inject SSR */
       /* style inject shadow dom */
-      const __vue_component__$g = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$g, staticRenderFns: __vue_staticRenderFns__$g },
-        __vue_inject_styles__$g,
-        __vue_script__$g,
-        __vue_scope_id__$g,
-        __vue_is_functional_template__$g,
-        __vue_module_identifier__$g,
+      const __vue_component__$i = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$i, staticRenderFns: __vue_staticRenderFns__$i },
+        __vue_inject_styles__$i,
+        __vue_script__$i,
+        __vue_scope_id__$i,
+        __vue_is_functional_template__$i,
+        __vue_module_identifier__$i,
         false,
         createInjector,
         undefined,
@@ -309,15 +309,15 @@
         }
     };
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekCardTitle.prototype, "title", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekCardTitle.prototype, "subtitle", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekCardTitle.prototype, "iconName", void 0);
     __decorate([
@@ -325,23 +325,23 @@
         __metadata("design:type", Array)
     ], TekCardTitle.prototype, "rightSlot", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Boolean, String], default: true }),
+        vuetify.PropWatch({ type: [Boolean, String], default: true }),
         __metadata("design:type", Boolean)
     ], TekCardTitle.prototype, "showDivider", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekCardTitle.prototype, "to", void 0);
     TekCardTitle = __decorate([
         vuePropertyDecorator.Component
     ], TekCardTitle);
-    var script$f = TekCardTitle;
+    var script$h = TekCardTitle;
     /* script */
-    const __vue_script__$f = script$f;
+    const __vue_script__$h = script$h;
     /* template */
-    var __vue_render__$f = function () {
+    var __vue_render__$h = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -441,34 +441,34 @@
         1
       )
     };
-    var __vue_staticRenderFns__$f = [];
-    __vue_render__$f._withStripped = true;
+    var __vue_staticRenderFns__$h = [];
+    __vue_render__$h._withStripped = true;
       /* style */
-      const __vue_inject_styles__$f = function (inject) {
+      const __vue_inject_styles__$h = function (inject) {
         if (!inject) return
         inject("data-v-dc07bd14_0", { source: ".tek-card-title-row {\n  display: flex;\n  align-items: center;\n}\n.tek-card-title-row .tek-card-title-text {\n  color: var(--v-primary-base);\n  font-weight: bold;\n  font-size: 20px;\n}\n.tek-card-title-row .tek-card-subtitle-text {\n  padding-left: 10px;\n  color: var(--zd-font-color);\n  font-size: 13px;\n}\n.tek-card-title-row .tek-card-title-text,\n.tek-card-title-row .tek-card-subtitle-text {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  vertical-align: baseline;\n}\n.tek-card-title-row .v-icon {\n  color: var(--v-primary-base);\n  padding-right: calc(var(--zd-default-padding) / 2);\n}\n.tek-card-title .v-divider {\n  margin-bottom: 16px;\n}\n.tek-card-title .tek-card-title-router {\n  text-decoration: none;\n}\n.tek-card-title .tek-card-title-no-router {\n  text-decoration: none;\n  cursor: default;\n}", map: undefined, media: undefined });
       };
       /* scoped */
-      const __vue_scope_id__$f = undefined;
+      const __vue_scope_id__$h = undefined;
       /* module identifier */
-      const __vue_module_identifier__$f = undefined;
+      const __vue_module_identifier__$h = undefined;
       /* functional template */
-      const __vue_is_functional_template__$f = false;
+      const __vue_is_functional_template__$h = false;
       /* style inject SSR */
       /* style inject shadow dom */
-      const __vue_component__$f = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$f, staticRenderFns: __vue_staticRenderFns__$f },
-        __vue_inject_styles__$f,
-        __vue_script__$f,
-        __vue_scope_id__$f,
-        __vue_is_functional_template__$f,
-        __vue_module_identifier__$f,
+      const __vue_component__$h = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$h, staticRenderFns: __vue_staticRenderFns__$h },
+        __vue_inject_styles__$h,
+        __vue_script__$h,
+        __vue_scope_id__$h,
+        __vue_is_functional_template__$h,
+        __vue_module_identifier__$h,
         false,
         createInjector,
         undefined,
@@ -519,35 +519,35 @@
         }
     };
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: true }),
+        vuetify.PropWatch({ type: [String, Boolean], default: true }),
         __metadata("design:type", Object)
     ], TekCrudAddButton.prototype, "flat", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: true }),
+        vuetify.PropWatch({ type: [String, Boolean], default: true }),
         __metadata("design:type", Object)
     ], TekCrudAddButton.prototype, "icon", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: 'plus' }),
+        vuetify.PropWatch({ type: String, default: 'plus' }),
         __metadata("design:type", String)
     ], TekCrudAddButton.prototype, "iconName", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '#666' }),
+        vuetify.PropWatch({ type: String, default: '#666' }),
         __metadata("design:type", String)
     ], TekCrudAddButton.prototype, "color", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: 'f2' }),
+        vuetify.PropWatch({ type: String, default: 'f2' }),
         __metadata("design:type", String)
     ], TekCrudAddButton.prototype, "clickShortcutKey", void 0);
     TekCrudAddButton = __decorate([
         vuePropertyDecorator.Component
     ], TekCrudAddButton);
-    var script$e = TekCrudAddButton;
+    var script$g = TekCrudAddButton;
     /* script */
-    const __vue_script__$e = script$e;
+    const __vue_script__$g = script$g;
     /* template */
-    var __vue_render__$e = function () {
+    var __vue_render__$g = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -612,17 +612,17 @@
         ]
       )
     };
-    var __vue_staticRenderFns__$e = [];
-    __vue_render__$e._withStripped = true;
+    var __vue_staticRenderFns__$g = [];
+    __vue_render__$g._withStripped = true;
       /* style */
-      const __vue_inject_styles__$e = undefined;
+      const __vue_inject_styles__$g = undefined;
       /* scoped */
-      const __vue_scope_id__$e = undefined;
+      const __vue_scope_id__$g = undefined;
       /* module identifier */
-      const __vue_module_identifier__$e = undefined;
+      const __vue_module_identifier__$g = undefined;
       /* functional template */
-      const __vue_is_functional_template__$e = false;
+      const __vue_is_functional_template__$g = false;
       /* style inject */
       /* style inject SSR */
@@ -631,13 +631,13 @@
-      const __vue_component__$e = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$e, staticRenderFns: __vue_staticRenderFns__$e },
-        __vue_inject_styles__$e,
-        __vue_script__$e,
-        __vue_scope_id__$e,
-        __vue_is_functional_template__$e,
-        __vue_module_identifier__$e,
+      const __vue_component__$g = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$g, staticRenderFns: __vue_staticRenderFns__$g },
+        __vue_inject_styles__$g,
+        __vue_script__$g,
+        __vue_scope_id__$g,
+        __vue_is_functional_template__$g,
+        __vue_module_identifier__$g,
         false,
         undefined,
         undefined,
@@ -654,27 +654,27 @@
         }
     };
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: 'CANCEL' }),
+        vuetify.PropWatch({ type: String, default: 'CANCEL' }),
         __metadata("design:type", String)
     ], TekCrudCancelButton.prototype, "label", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: true }),
+        vuetify.PropWatch({ type: [String, Boolean], default: true }),
         __metadata("design:type", Object)
     ], TekCrudCancelButton.prototype, "outline", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: 'esc' }),
+        vuetify.PropWatch({ type: String, default: 'esc' }),
         __metadata("design:type", String)
     ], TekCrudCancelButton.prototype, "clickShortcutKey", void 0);
     TekCrudCancelButton = __decorate([
         vuePropertyDecorator.Component
     ], TekCrudCancelButton);
-    var script$d = TekCrudCancelButton;
+    var script$f = TekCrudCancelButton;
     /* script */
-    const __vue_script__$d = script$d;
+    const __vue_script__$f = script$f;
     /* template */
-    var __vue_render__$d = function () {
+    var __vue_render__$f = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -739,17 +739,17 @@
         ]
       )
     };
-    var __vue_staticRenderFns__$d = [];
-    __vue_render__$d._withStripped = true;
+    var __vue_staticRenderFns__$f = [];
+    __vue_render__$f._withStripped = true;
       /* style */
-      const __vue_inject_styles__$d = undefined;
+      const __vue_inject_styles__$f = undefined;
       /* scoped */
-      const __vue_scope_id__$d = undefined;
+      const __vue_scope_id__$f = undefined;
       /* module identifier */
-      const __vue_module_identifier__$d = undefined;
+      const __vue_module_identifier__$f = undefined;
       /* functional template */
-      const __vue_is_functional_template__$d = false;
+      const __vue_is_functional_template__$f = false;
       /* style inject */
       /* style inject SSR */
@@ -758,13 +758,13 @@
-      const __vue_component__$d = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$d, staticRenderFns: __vue_staticRenderFns__$d },
-        __vue_inject_styles__$d,
-        __vue_script__$d,
-        __vue_scope_id__$d,
-        __vue_is_functional_template__$d,
-        __vue_module_identifier__$d,
+      const __vue_component__$f = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$f, staticRenderFns: __vue_staticRenderFns__$f },
+        __vue_inject_styles__$f,
+        __vue_script__$f,
+        __vue_scope_id__$f,
+        __vue_is_functional_template__$f,
+        __vue_module_identifier__$f,
         false,
         undefined,
         undefined,
@@ -781,35 +781,35 @@
         }
     };
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: true }),
+        vuetify.PropWatch({ type: [String, Boolean], default: true }),
         __metadata("design:type", Object)
     ], TekCrudDeleteButton.prototype, "flat", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: true }),
+        vuetify.PropWatch({ type: [String, Boolean], default: true }),
         __metadata("design:type", Object)
     ], TekCrudDeleteButton.prototype, "icon", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: 'trashCanOutline' }),
+        vuetify.PropWatch({ type: String, default: 'trashCanOutline' }),
         __metadata("design:type", String)
     ], TekCrudDeleteButton.prototype, "iconName", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '#666' }),
+        vuetify.PropWatch({ type: String, default: '#666' }),
         __metadata("design:type", String)
     ], TekCrudDeleteButton.prototype, "color", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: 'ctrl+d' }),
+        vuetify.PropWatch({ type: String, default: 'ctrl+d' }),
         __metadata("design:type", String)
     ], TekCrudDeleteButton.prototype, "clickShortcutKey", void 0);
     TekCrudDeleteButton = __decorate([
         vuePropertyDecorator.Component
     ], TekCrudDeleteButton);
-    var script$c = TekCrudDeleteButton;
+    var script$e = TekCrudDeleteButton;
     /* script */
-    const __vue_script__$c = script$c;
+    const __vue_script__$e = script$e;
     /* template */
-    var __vue_render__$c = function () {
+    var __vue_render__$e = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -874,17 +874,17 @@
         ]
       )
     };
-    var __vue_staticRenderFns__$c = [];
-    __vue_render__$c._withStripped = true;
+    var __vue_staticRenderFns__$e = [];
+    __vue_render__$e._withStripped = true;
       /* style */
-      const __vue_inject_styles__$c = undefined;
+      const __vue_inject_styles__$e = undefined;
       /* scoped */
-      const __vue_scope_id__$c = undefined;
+      const __vue_scope_id__$e = undefined;
       /* module identifier */
-      const __vue_module_identifier__$c = undefined;
+      const __vue_module_identifier__$e = undefined;
       /* functional template */
-      const __vue_is_functional_template__$c = false;
+      const __vue_is_functional_template__$e = false;
       /* style inject */
       /* style inject SSR */
@@ -893,13 +893,13 @@
-      const __vue_component__$c = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$c, staticRenderFns: __vue_staticRenderFns__$c },
-        __vue_inject_styles__$c,
-        __vue_script__$c,
-        __vue_scope_id__$c,
-        __vue_is_functional_template__$c,
-        __vue_module_identifier__$c,
+      const __vue_component__$e = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$e, staticRenderFns: __vue_staticRenderFns__$e },
+        __vue_inject_styles__$e,
+        __vue_script__$e,
+        __vue_scope_id__$e,
+        __vue_is_functional_template__$e,
+        __vue_module_identifier__$e,
         false,
         undefined,
         undefined,
@@ -918,13 +918,13 @@
     TekCrudForm = __decorate([
         vuePropertyDecorator.Component
     ], TekCrudForm);
-    var script$b = TekCrudForm;
+    var script$d = TekCrudForm;
     /* script */
-    const __vue_script__$b = script$b;
+    const __vue_script__$d = script$d;
     /* template */
-    var __vue_render__$b = function () {
+    var __vue_render__$d = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -998,34 +998,34 @@
         2
       )
     };
-    var __vue_staticRenderFns__$b = [];
-    __vue_render__$b._withStripped = true;
+    var __vue_staticRenderFns__$d = [];
+    __vue_render__$d._withStripped = true;
       /* style */
-      const __vue_inject_styles__$b = function (inject) {
+      const __vue_inject_styles__$d = function (inject) {
         if (!inject) return
         inject("data-v-12f9560c_0", { source: ".tek-crud-form {\n  outline: none;\n}", map: undefined, media: undefined });
       };
       /* scoped */
-      const __vue_scope_id__$b = undefined;
+      const __vue_scope_id__$d = undefined;
       /* module identifier */
-      const __vue_module_identifier__$b = undefined;
+      const __vue_module_identifier__$d = undefined;
       /* functional template */
-      const __vue_is_functional_template__$b = false;
+      const __vue_is_functional_template__$d = false;
       /* style inject SSR */
       /* style inject shadow dom */
-      const __vue_component__$b = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$b, staticRenderFns: __vue_staticRenderFns__$b },
-        __vue_inject_styles__$b,
-        __vue_script__$b,
-        __vue_scope_id__$b,
-        __vue_is_functional_template__$b,
-        __vue_module_identifier__$b,
+      const __vue_component__$d = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$d, staticRenderFns: __vue_staticRenderFns__$d },
+        __vue_inject_styles__$d,
+        __vue_script__$d,
+        __vue_scope_id__$d,
+        __vue_is_functional_template__$d,
+        __vue_module_identifier__$d,
         false,
         createInjector,
         undefined,
@@ -1042,23 +1042,23 @@
         }
     };
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: 'SAVE' }),
+        vuetify.PropWatch({ type: String, default: 'SAVE' }),
         __metadata("design:type", String)
     ], TekCrudSaveButton.prototype, "label", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: 'ctrl+enter' }),
+        vuetify.PropWatch({ type: String, default: 'ctrl+enter' }),
         __metadata("design:type", String)
     ], TekCrudSaveButton.prototype, "clickShortcutKey", void 0);
     TekCrudSaveButton = __decorate([
         vuePropertyDecorator.Component
     ], TekCrudSaveButton);
-    var script$a = TekCrudSaveButton;
+    var script$c = TekCrudSaveButton;
     /* script */
-    const __vue_script__$a = script$a;
+    const __vue_script__$c = script$c;
     /* template */
-    var __vue_render__$a = function () {
+    var __vue_render__$c = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -1123,17 +1123,17 @@
         ]
       )
     };
-    var __vue_staticRenderFns__$a = [];
-    __vue_render__$a._withStripped = true;
+    var __vue_staticRenderFns__$c = [];
+    __vue_render__$c._withStripped = true;
       /* style */
-      const __vue_inject_styles__$a = undefined;
+      const __vue_inject_styles__$c = undefined;
       /* scoped */
-      const __vue_scope_id__$a = undefined;
+      const __vue_scope_id__$c = undefined;
       /* module identifier */
-      const __vue_module_identifier__$a = undefined;
+      const __vue_module_identifier__$c = undefined;
       /* functional template */
-      const __vue_is_functional_template__$a = false;
+      const __vue_is_functional_template__$c = false;
       /* style inject */
       /* style inject SSR */
@@ -1142,13 +1142,13 @@
-      const __vue_component__$a = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$a, staticRenderFns: __vue_staticRenderFns__$a },
-        __vue_inject_styles__$a,
-        __vue_script__$a,
-        __vue_scope_id__$a,
-        __vue_is_functional_template__$a,
-        __vue_module_identifier__$a,
+      const __vue_component__$c = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$c, staticRenderFns: __vue_staticRenderFns__$c },
+        __vue_inject_styles__$c,
+        __vue_script__$c,
+        __vue_scope_id__$c,
+        __vue_is_functional_template__$c,
+        __vue_module_identifier__$c,
         false,
         undefined,
         undefined,
@@ -1550,19 +1550,19 @@
         }
     };
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String], default: '' }),
+        vuetify.PropWatch({ type: [String], default: '' }),
         __metadata("design:type", String)
     ], TekGrid$1.prototype, "title", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Boolean, String], default: false }),
+        vuetify.PropWatch({ type: [Boolean, String], default: false }),
         __metadata("design:type", Object)
     ], TekGrid$1.prototype, "addButton", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String], default: 'none' }),
+        vuetify.PropWatch({ type: [String], default: 'none' }),
         __metadata("design:type", String)
     ], TekGrid$1.prototype, "deleteButton", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Boolean, String], default: false }),
+        vuetify.PropWatch({ type: [Boolean, String], default: false }),
         __metadata("design:type", Object)
     ], TekGrid$1.prototype, "columnsButton", void 0);
     __decorate([
@@ -1570,15 +1570,15 @@
         __metadata("design:type", Object)
     ], TekGrid$1.prototype, "columnsButtonIgnore", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Boolean, String], default: false }),
+        vuetify.PropWatch({ type: [Boolean, String], default: false }),
         __metadata("design:type", Object)
     ], TekGrid$1.prototype, "filterButton", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Boolean, String], default: true }),
+        vuetify.PropWatch({ type: [Boolean, String], default: true }),
         __metadata("design:type", Object)
     ], TekGrid$1.prototype, "showSearch", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Boolean, String], default: false }),
+        vuetify.PropWatch({ type: [Boolean, String], default: false }),
         __metadata("design:type", Object)
     ], TekGrid$1.prototype, "columnFilterButton", void 0);
     __decorate([
@@ -1586,27 +1586,27 @@
         __metadata("design:type", Array)
     ], TekGrid$1.prototype, "actions", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: true }),
+        vuetify.PropWatch({ type: [String, Boolean], default: true }),
         __metadata("design:type", Object)
     ], TekGrid$1.prototype, "dragColumns", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: true }),
+        vuetify.PropWatch({ type: [String, Boolean], default: true }),
         __metadata("design:type", Object)
     ], TekGrid$1.prototype, "resizeColumns", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: true }),
+        vuetify.PropWatch({ type: [String, Boolean], default: true }),
         __metadata("design:type", Object)
     ], TekGrid$1.prototype, "showLayoutOptions", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: false }),
+        vuetify.PropWatch({ type: [String, Boolean], default: false }),
         __metadata("design:type", Object)
     ], TekGrid$1.prototype, "showExport", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: true }),
+        vuetify.PropWatch({ type: [String, Boolean], default: true }),
         __metadata("design:type", Object)
     ], TekGrid$1.prototype, "showReload", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Array] }),
+        vuetify.PropWatch({ type: [String, Array] }),
         __metadata("design:type", Array)
     ], TekGrid$1.prototype, "exportConfig", void 0);
     __decorate([
@@ -1614,11 +1614,11 @@
         __metadata("design:type", Array)
     ], TekGrid$1.prototype, "exportActions", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: false }),
+        vuetify.PropWatch({ type: [String, Boolean], default: false }),
         __metadata("design:type", Object)
     ], TekGrid$1.prototype, "groupsOpened", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: true }),
+        vuetify.PropWatch({ type: [String, Boolean], default: true }),
         __metadata("design:type", Object)
     ], TekGrid$1.prototype, "showSummaryTotal", void 0);
     __decorate([
@@ -1631,13 +1631,13 @@
     TekGrid$1 = __decorate([
         vuePropertyDecorator.Component
     ], TekGrid$1);
-    var script$9 = TekGrid$1;
+    var script$b = TekGrid$1;
     /* script */
-    const __vue_script__$9 = script$9;
+    const __vue_script__$b = script$b;
     /* template */
-    var __vue_render__$9 = function () {
+    var __vue_render__$b = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -1658,7 +1658,7 @@
           { "zd-grid-flex": _vm.instance.gridHeight || _vm.instance.gridMaxHeight },
           { "zd-grid-loading": _vm.instance.datasource.loading },
         ],
-        style: [_vm.cssColorVars, _vm.instance.cssStyle],
+        style: [_vm.cssColorVars, _vm.$styleObject(_vm.instance.cssStyle)],
         attrs: {
           id: _vm.instance.name,
           "fixed-header": "",
@@ -1679,6 +1679,9 @@
           "disable-sort": "",
           "disable-filtering": "",
           tabindex: "0",
+          "loading-text": _vm.$t(_vm.instance.loadingText),
+          "no-data-text": _vm.$t(_vm.instance.noDataText),
+          "no-results-text": _vm.$t(_vm.instance.noResultText),
         },
         on: {
           "current-items": function ($event) {
@@ -3216,34 +3219,34 @@
         },
       })
     };
-    var __vue_staticRenderFns__$9 = [];
-    __vue_render__$9._withStripped = true;
+    var __vue_staticRenderFns__$b = [];
+    __vue_render__$b._withStripped = true;
       /* style */
-      const __vue_inject_styles__$9 = function (inject) {
+      const __vue_inject_styles__$b = function (inject) {
         if (!inject) return
-        inject("data-v-0ced07c0_0", { source: ".tek-grid .zd-grid-toolbar {\n  height: 36px;\n}\n.tek-grid .zd-grid-toolbar .zd-grid-toolbar-slot {\n  align-items: center;\n}\n.tek-grid .zd-grid-toolbar .toolbar-divider {\n  margin: 10px;\n}\n.tek-grid .zd-grid-toolbar .toolbar-title {\n  line-height: 22px;\n  color: var(--v-primary-base);\n}\n.tek-grid table thead tr th {\n  padding-right: 15px !important;\n}\n.tek-grid table thead tr th.zd-table-cell.zd-table-fixed-column {\n  position: sticky !important;\n  left: 0;\n  z-index: 5;\n}\n.tek-grid table thead tr th.zd-table-cell.zd-table-fixed-column.theme--light {\n  background: #f7f7f7 !important;\n}\n.tek-grid table thead tr th.zd-table-cell.zd-table-fixed-column.theme--dark {\n  background: #3c3c3c !important;\n}\n.tek-grid table thead tr th .tek-grid-column-filter-button {\n  display: inline-block;\n}\n.tek-grid table thead tr th .tek-grid-column-filter-button .v-icon {\n  cursor: pointer;\n  font-size: 15px;\n  width: 15px;\n  padding: 0 3px;\n  opacity: 0;\n  color: #ccc;\n}\n.tek-grid table thead tr th .tek-grid-column-filter-button.has-filter-data .v-icon {\n  opacity: 1;\n  color: var(--v-primary-base);\n}\n.tek-grid table thead tr th:hover .tek-grid-column-filter-button .v-icon {\n  opacity: 1;\n}\n.tek-grid table tbody tr.footer.theme--light {\n  background: #f6f6f6;\n}\n.tek-grid table tbody tr.footer.theme--dark {\n  background: #3b3b3b;\n}\n.tek-grid table tbody tr.footer td.zd-table-cell {\n  font-weight: 700;\n}\n.tek-grid table tbody tr.summary {\n  background: #eee;\n}\n.tek-grid table tbody tr.summary td.zd-table-cell {\n  font-weight: 700;\n  font-size: 15px;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header {\n  font-weight: bold;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .v-icon {\n  font-size: 21px;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .v-icon.closed {\n  transform: rotate(-90deg);\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .zd-table-group-container {\n  position: sticky !important;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .zd-table-group-container .zd-table-group-text {\n  vertical-align: middle;\n}\n.tek-grid table tbody tr td.zd-table-cell .zd-table-cell-text {\n  display: inline-block;\n  vertical-align: middle;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-fixed-column {\n  position: sticky !important;\n  left: 0;\n  z-index: 3;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-fixed-column.theme--light {\n  background: #f7f7f7 !important;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-fixed-column.theme--dark {\n  background: #3c3c3c !important;\n}\n.tek-grid table tbody tr.current td.zd-table-cell.zd-table-fixed-column {\n  color: var(--v-primary-base) !important;\n}\n.tek-grid table .tek-grid-header-group-identation {\n  width: 22px;\n  display: inline-block;\n  vertical-align: middle;\n}\n.tek-grid table .tek-grid-header-group-identation.first-group {\n  width: 20px;\n}\n.tek-grid table .tek-grid-body-group-identation {\n  width: 8px;\n  display: inline-block;\n  vertical-align: middle;\n  margin-left: 14px;\n  height: 100%;\n  border-left: solid 1px #ccc;\n}\n.tek-grid table .tek-grid-body-group-identation.first-group {\n  width: 10px;\n  margin-left: 10px;\n}\n.tek-grid table .tek-grid-body-group-identation.group-footer {\n  height: 60%;\n  border-bottom: solid 1px #ccc;\n  position: relative;\n  top: -25%;\n}\n.tek-grid table .tek-grid-body-group-identation.group-footer-no-line {\n  border-left: none;\n}\n.tek-grid .zd-skeleton-table-cell .v-skeleton-loader__table-cell {\n  height: auto;\n}\n.tekgrid-actions-dropdown > * {\n  display: block;\n}\n.tek-grid-column-filter-menu {\n  padding: 12px 12px 0 12px;\n  max-height: 300px;\n}\n.tek-grid-column-filter-menu.theme--light {\n  background: #fff;\n}\n.tek-grid-column-filter-menu.theme--dark {\n  background: #1e1e1e;\n}\n.filter-helper-values-button {\n  height: 24px !important;\n  margin-left: 5px;\n  margin-top: 0;\n}\n.filter-helper-values-button.with-label {\n  margin-top: 20px;\n}\n.filter-helper-values-option {\n  cursor: pointer;\n}\n.filter-helper-values-option:hover {\n  background-color: rgba(0, 0, 0, 0.03);\n}", map: undefined, media: undefined });
+        inject("data-v-7cb50338_0", { source: ".tek-grid .zd-grid-toolbar {\n  height: 36px;\n}\n.tek-grid .zd-grid-toolbar .zd-grid-toolbar-slot {\n  align-items: center;\n}\n.tek-grid .zd-grid-toolbar .toolbar-divider {\n  margin: 10px;\n}\n.tek-grid .zd-grid-toolbar .toolbar-title {\n  line-height: 22px;\n  color: var(--v-primary-base);\n}\n.tek-grid table thead tr th {\n  padding-right: 15px !important;\n}\n.tek-grid table thead tr th.zd-table-cell.zd-table-fixed-column {\n  position: sticky !important;\n  left: 0;\n  z-index: 5;\n}\n.tek-grid table thead tr th.zd-table-cell.zd-table-fixed-column.theme--light {\n  background: #f7f7f7 !important;\n}\n.tek-grid table thead tr th.zd-table-cell.zd-table-fixed-column.theme--dark {\n  background: #3c3c3c !important;\n}\n.tek-grid table thead tr th .tek-grid-column-filter-button {\n  display: inline-block;\n}\n.tek-grid table thead tr th .tek-grid-column-filter-button .v-icon {\n  cursor: pointer;\n  font-size: 15px;\n  width: 15px;\n  padding: 0 3px;\n  opacity: 0;\n  color: #ccc;\n}\n.tek-grid table thead tr th .tek-grid-column-filter-button.has-filter-data .v-icon {\n  opacity: 1;\n  color: var(--v-primary-base);\n}\n.tek-grid table thead tr th:hover .tek-grid-column-filter-button .v-icon {\n  opacity: 1;\n}\n.tek-grid table tbody tr.footer.theme--light {\n  background: #f6f6f6;\n}\n.tek-grid table tbody tr.footer.theme--dark {\n  background: #3b3b3b;\n}\n.tek-grid table tbody tr.footer td.zd-table-cell {\n  font-weight: 700;\n}\n.tek-grid table tbody tr.summary {\n  background: #eee;\n}\n.tek-grid table tbody tr.summary td.zd-table-cell {\n  font-weight: 700;\n  font-size: 15px;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header {\n  font-weight: bold;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .v-icon {\n  font-size: 21px;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .v-icon.closed {\n  transform: rotate(-90deg);\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .zd-table-group-container {\n  position: sticky !important;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .zd-table-group-container .zd-table-group-text {\n  vertical-align: middle;\n}\n.tek-grid table tbody tr td.zd-table-cell .zd-table-cell-text {\n  display: inline-block;\n  vertical-align: middle;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-fixed-column {\n  position: sticky !important;\n  left: 0;\n  z-index: 3;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-fixed-column.theme--light {\n  background: #f7f7f7 !important;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-fixed-column.theme--dark {\n  background: #3c3c3c !important;\n}\n.tek-grid table tbody tr.current td.zd-table-cell.zd-table-fixed-column {\n  color: var(--v-primary-base) !important;\n}\n.tek-grid table .tek-grid-header-group-identation {\n  width: 22px;\n  display: inline-block;\n  vertical-align: middle;\n}\n.tek-grid table .tek-grid-header-group-identation.first-group {\n  width: 20px;\n}\n.tek-grid table .tek-grid-body-group-identation {\n  width: 8px;\n  display: inline-block;\n  vertical-align: middle;\n  margin-left: 14px;\n  height: 100%;\n  border-left: solid 1px #ccc;\n}\n.tek-grid table .tek-grid-body-group-identation.first-group {\n  width: 10px;\n  margin-left: 10px;\n}\n.tek-grid table .tek-grid-body-group-identation.group-footer {\n  height: 60%;\n  border-bottom: solid 1px #ccc;\n  position: relative;\n  top: -25%;\n}\n.tek-grid table .tek-grid-body-group-identation.group-footer-no-line {\n  border-left: none;\n}\n.tek-grid .zd-skeleton-table-cell .v-skeleton-loader__table-cell {\n  height: auto;\n}\n.tekgrid-actions-dropdown > * {\n  display: block;\n}\n.tek-grid-column-filter-menu {\n  padding: 12px 12px 0 12px;\n  max-height: 300px;\n}\n.tek-grid-column-filter-menu.theme--light {\n  background: #fff;\n}\n.tek-grid-column-filter-menu.theme--dark {\n  background: #1e1e1e;\n}\n.filter-helper-values-button {\n  height: 24px !important;\n  margin-left: 5px;\n  margin-top: 0;\n}\n.filter-helper-values-button.with-label {\n  margin-top: 20px;\n}\n.filter-helper-values-option {\n  cursor: pointer;\n}\n.filter-helper-values-option:hover {\n  background-color: rgba(0, 0, 0, 0.03);\n}", map: undefined, media: undefined });
       };
       /* scoped */
-      const __vue_scope_id__$9 = undefined;
+      const __vue_scope_id__$b = undefined;
       /* module identifier */
-      const __vue_module_identifier__$9 = undefined;
+      const __vue_module_identifier__$b = undefined;
       /* functional template */
-      const __vue_is_functional_template__$9 = false;
+      const __vue_is_functional_template__$b = false;
       /* style inject SSR */
       /* style inject shadow dom */
-      const __vue_component__$9 = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$9, staticRenderFns: __vue_staticRenderFns__$9 },
-        __vue_inject_styles__$9,
-        __vue_script__$9,
-        __vue_scope_id__$9,
-        __vue_is_functional_template__$9,
-        __vue_module_identifier__$9,
+      const __vue_component__$b = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$b, staticRenderFns: __vue_staticRenderFns__$b },
+        __vue_inject_styles__$b,
+        __vue_script__$b,
+        __vue_scope_id__$b,
+        __vue_is_functional_template__$b,
+        __vue_module_identifier__$b,
         false,
         createInjector,
         undefined,
@@ -4200,7 +4203,7 @@
         }
     };
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Boolean, String], default: false }),
+        vuetify.PropWatch({ type: [Boolean, String], default: false }),
         __metadata("design:type", Object)
     ], TekGridColumnsButton.prototype, "hideGroups", void 0);
     __decorate([
@@ -4212,13 +4215,13 @@
     TekGridColumnsButton = __decorate([
         vuePropertyDecorator.Component
     ], TekGridColumnsButton);
-    var script$8 = TekGridColumnsButton;
+    var script$a = TekGridColumnsButton;
     /* script */
-    const __vue_script__$8 = script$8;
+    const __vue_script__$a = script$a;
     /* template */
-    var __vue_render__$8 = function () {
+    var __vue_render__$a = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -4480,34 +4483,34 @@
         ]
       )
     };
-    var __vue_staticRenderFns__$8 = [];
-    __vue_render__$8._withStripped = true;
+    var __vue_staticRenderFns__$a = [];
+    __vue_render__$a._withStripped = true;
       /* style */
-      const __vue_inject_styles__$8 = function (inject) {
+      const __vue_inject_styles__$a = function (inject) {
         if (!inject) return
-        inject("data-v-04ff1434_0", { source: ".tek-grid-columns-button-options {\n  max-height: 250px;\n  display: flex;\n  flex-direction: column;\n  background-color: #fff;\n}\n.tek-grid-columns-button-options.theme--dark {\n  background-color: #1e1e1e;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-wrapper {\n  flex: 1;\n  overflow-y: auto;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-wrapper .tek-grid-columns-button-table {\n  padding: 0 var(--spacing-2) var(--spacing-2) var(--spacing-2);\n  font-size: 13px;\n  border-spacing: 0;\n  width: 100%;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-wrapper .tek-grid-columns-button-table thead tr th {\n  padding: var(--spacing-2) var(--spacing-2) var(--spacing-1) var(--spacing-2);\n  white-space: nowrap;\n  text-align: left;\n  position: sticky;\n  top: 0;\n  z-index: 10;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-wrapper .tek-grid-columns-button-table tbody tr td {\n  padding: var(--spacing-1) var(--spacing-2);\n  white-space: nowrap;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-wrapper .tek-grid-columns-button-table tbody tr td.tek-grid-columns-button-column-name {\n  cursor: -webkit-grab;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-wrapper .tek-grid-columns-button-table tbody tr td.tek-grid-columns-button-column-name > span {\n  padding-right: 4px;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-wrapper .tek-grid-columns-button-table tbody tr td.tek-grid-columns-button-column-aggregation {\n  max-width: 150px;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-footer {\n  display: flex;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-footer .zd-button {\n  flex: 1;\n}\n.tek-grid-columns-button-sortable-drag {\n  background: white;\n}\n.tek-grid-column-option-box {\n  margin: var(--spacing-1);\n  background: #ccc;\n  padding: 2px var(--spacing-1);\n  cursor: pointer;\n}\n.tek-grid-column-option-box > * {\n  display: inline-block;\n}\n.tek-grid-column-option-box > .zd-icon {\n  font-size: 0.9rem;\n  margin-left: var(--spacing-2);\n}\n.tek-grid-column-option-box.tek-grid-column-option-grouped-true {\n  cursor: default;\n  background: #fafafa;\n}\n.tek-grid-column-option-box.tek-grid-column-option-grouped-true > .zd-icon {\n  display: none;\n}\n.tek-grid-column-option-box.tek-grid-column-option-selected-true {\n  background: var(--v-primary-base);\n  color: white;\n}\n.tek-grid-column-option-box.tek-grid-column-option-selected-true > .zd-icon {\n  color: white;\n}\n.tek-grid-column-option-container-col {\n  position: relative;\n}\n.tek-grid-column-option-container-col .tek-grid-column-option-container {\n  background: #eee;\n  padding: var(--spacing-1);\n  max-height: 100px;\n  min-height: 42px;\n  align-content: center;\n  position: relative;\n}\n.tek-grid-column-option-container-col .tek-grid-column-option-container .tek-iterable-footer {\n  display: none !important;\n}\n.tek-grid-column-option-container-col .tek-grid-column-option-container .zd-text.no-data {\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  text-align: center;\n  font-size: 0.7rem;\n}\n.tek-grid-column-option-container-col .tek-grid-column-option-label {\n  font-weight: var(--zd-font-body2-weight);\n}\n.tek-grid-column-option-container-col .tek-grid-column-option-select-all {\n  position: absolute;\n  top: 0.5rem;\n  right: var(--spacing-1);\n  color: var(--v-primary-base);\n  cursor: pointer;\n  font-size: 0.8rem;\n}\n.tek-grid-column-option-container-col .tek-grid-column-option-drop-here {\n  position: absolute;\n  z-index: 100;\n  left: 50%;\n  transform: translateX(-50%);\n  top: 35px;\n}\n.tek-grid-column-option-detail-name {\n  color: var(--v-primary-base);\n  font-weight: var(--zd-font-body2-weight);\n  font-size: 1.1rem;\n  margin-top: var(--spacing-6);\n}", map: undefined, media: undefined });
+        inject("data-v-1cfc4ef2_0", { source: ".tek-grid-columns-button-options {\n  max-height: 250px;\n  display: flex;\n  flex-direction: column;\n  background-color: #fff;\n}\n.tek-grid-columns-button-options.theme--dark {\n  background-color: #1e1e1e;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-wrapper {\n  flex: 1;\n  overflow-y: auto;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-wrapper .tek-grid-columns-button-table {\n  padding: 0 var(--spacing-2) var(--spacing-2) var(--spacing-2);\n  font-size: 13px;\n  border-spacing: 0;\n  width: 100%;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-wrapper .tek-grid-columns-button-table thead tr th {\n  padding: var(--spacing-2) var(--spacing-2) var(--spacing-1) var(--spacing-2);\n  white-space: nowrap;\n  text-align: left;\n  position: sticky;\n  top: 0;\n  z-index: 10;\n  background-color: var(--zd-background-base);\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-wrapper .tek-grid-columns-button-table tbody tr td {\n  padding: var(--spacing-1) var(--spacing-2);\n  white-space: nowrap;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-wrapper .tek-grid-columns-button-table tbody tr td.tek-grid-columns-button-column-name {\n  cursor: -webkit-grab;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-wrapper .tek-grid-columns-button-table tbody tr td.tek-grid-columns-button-column-name > span {\n  padding-right: 4px;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-wrapper .tek-grid-columns-button-table tbody tr td.tek-grid-columns-button-column-aggregation {\n  max-width: 150px;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-footer {\n  display: flex;\n}\n.tek-grid-columns-button-options .tek-grid-columns-button-table-footer .zd-button {\n  flex: 1;\n}\n.tek-grid-columns-button-sortable-drag {\n  background: white;\n}\n.tek-grid-column-option-box {\n  margin: var(--spacing-1);\n  background: #ccc;\n  padding: 2px var(--spacing-1);\n  cursor: pointer;\n}\n.tek-grid-column-option-box > * {\n  display: inline-block;\n}\n.tek-grid-column-option-box > .zd-icon {\n  font-size: 0.9rem;\n  margin-left: var(--spacing-2);\n}\n.tek-grid-column-option-box.tek-grid-column-option-grouped-true {\n  cursor: default;\n  background: #fafafa;\n}\n.tek-grid-column-option-box.tek-grid-column-option-grouped-true > .zd-icon {\n  display: none;\n}\n.tek-grid-column-option-box.tek-grid-column-option-selected-true {\n  background: var(--v-primary-base);\n  color: white;\n}\n.tek-grid-column-option-box.tek-grid-column-option-selected-true > .zd-icon {\n  color: white;\n}\n.tek-grid-column-option-container-col {\n  position: relative;\n}\n.tek-grid-column-option-container-col .tek-grid-column-option-container {\n  background: #eee;\n  padding: var(--spacing-1);\n  max-height: 100px;\n  min-height: 42px;\n  align-content: center;\n  position: relative;\n}\n.tek-grid-column-option-container-col .tek-grid-column-option-container .tek-iterable-footer {\n  display: none !important;\n}\n.tek-grid-column-option-container-col .tek-grid-column-option-container .zd-text.no-data {\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  text-align: center;\n  font-size: 0.7rem;\n}\n.tek-grid-column-option-container-col .tek-grid-column-option-label {\n  font-weight: var(--zd-font-body2-weight);\n}\n.tek-grid-column-option-container-col .tek-grid-column-option-select-all {\n  position: absolute;\n  top: 0.5rem;\n  right: var(--spacing-1);\n  color: var(--v-primary-base);\n  cursor: pointer;\n  font-size: 0.8rem;\n}\n.tek-grid-column-option-container-col .tek-grid-column-option-drop-here {\n  position: absolute;\n  z-index: 100;\n  left: 50%;\n  transform: translateX(-50%);\n  top: 35px;\n}\n.tek-grid-column-option-detail-name {\n  color: var(--v-primary-base);\n  font-weight: var(--zd-font-body2-weight);\n  font-size: 1.1rem;\n  margin-top: var(--spacing-6);\n}", map: undefined, media: undefined });
       };
       /* scoped */
-      const __vue_scope_id__$8 = undefined;
+      const __vue_scope_id__$a = undefined;
       /* module identifier */
-      const __vue_module_identifier__$8 = undefined;
+      const __vue_module_identifier__$a = undefined;
       /* functional template */
-      const __vue_is_functional_template__$8 = false;
+      const __vue_is_functional_template__$a = false;
       /* style inject SSR */
       /* style inject shadow dom */
-      const __vue_component__$8 = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$8, staticRenderFns: __vue_staticRenderFns__$8 },
-        __vue_inject_styles__$8,
-        __vue_script__$8,
-        __vue_scope_id__$8,
-        __vue_is_functional_template__$8,
-        __vue_module_identifier__$8,
+      const __vue_component__$a = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$a, staticRenderFns: __vue_staticRenderFns__$a },
+        __vue_inject_styles__$a,
+        __vue_script__$a,
+        __vue_scope_id__$a,
+        __vue_is_functional_template__$a,
+        __vue_module_identifier__$a,
         false,
         createInjector,
         undefined,
@@ -4710,13 +4713,13 @@
     TekGridLayoutOptions = __decorate([
         vuePropertyDecorator.Component
     ], TekGridLayoutOptions);
-    var script$7 = TekGridLayoutOptions;
+    var script$9 = TekGridLayoutOptions;
     /* script */
-    const __vue_script__$7 = script$7;
+    const __vue_script__$9 = script$9;
     /* template */
-    var __vue_render__$7 = function () {
+    var __vue_render__$9 = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -4978,36 +4981,36 @@
         1
       )
     };
-    var __vue_staticRenderFns__$7 = [];
-    __vue_render__$7._withStripped = true;
+    var __vue_staticRenderFns__$9 = [];
+    __vue_render__$9._withStripped = true;
       /* style */
-      const __vue_inject_styles__$7 = function (inject) {
+      const __vue_inject_styles__$9 = function (inject) {
         if (!inject) return
         inject("data-v-162a7d24_0", { source: ".tek-grid-layout-options-badge .v-badge__badge {\n  font-size: var(--zd-font-caption-size);\n  font-weight: var(--zd-font-caption-weight);\n  line-height: 14px;\n  pointer-events: none;\n  background-color: var(--zd-badge-background-color) !important;\n}\n.tek-grid-layout-options-badge .v-badge__badge span {\n  color: var(--zd-badge-text-color) !important;\n}\n.tek-grid-layout-item {\n  font-size: 13px;\n  cursor: pointer;\n  min-height: 30px;\n}\n.tek-grid-layout-item.selected {\n  font-weight: 700;\n}\n.tek-grid-layout-item:hover.theme--light {\n  background: #eee;\n}\n.tek-grid-layout-item:hover .tek-grid-layout-item-buttons {\n  display: inherit;\n}\n.tek-grid-layout-item .tek-grid-layout-item-buttons {\n  display: none;\n  position: absolute;\n  right: 5px;\n}\n.tek-grid-layout-item .tek-grid-layout-item-buttons .v-icon {\n  font-size: 12px;\n}", map: undefined, media: undefined });
       };
       /* scoped */
-      const __vue_scope_id__$7 = undefined;
+      const __vue_scope_id__$9 = undefined;
       /* module identifier */
-      const __vue_module_identifier__$7 = undefined;
+      const __vue_module_identifier__$9 = undefined;
       /* functional template */
-      const __vue_is_functional_template__$7 = false;
+      const __vue_is_functional_template__$9 = false;
       /* style inject SSR */
       /* style inject shadow dom */
-      const __vue_component__$7 = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$7, staticRenderFns: __vue_staticRenderFns__$7 },
-        __vue_inject_styles__$7,
-        __vue_script__$7,
-        __vue_scope_id__$7,
-        __vue_is_functional_template__$7,
-        __vue_module_identifier__$7,
-        false,
-        createInjector,
+      const __vue_component__$9 = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$9, staticRenderFns: __vue_staticRenderFns__$9 },
+        __vue_inject_styles__$9,
+        __vue_script__$9,
+        __vue_scope_id__$9,
+        __vue_is_functional_template__$9,
+        __vue_module_identifier__$9,
+        false,
+        createInjector,
         undefined,
         undefined
       );
@@ -5022,23 +5025,23 @@
         }
     };
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekImage.prototype, "to", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekImage.prototype, "src", void 0);
     TekImage = __decorate([
         vuePropertyDecorator.Component
     ], TekImage);
-    var script$6 = TekImage;
+    var script$8 = TekImage;
     /* script */
-    const __vue_script__$6 = script$6;
+    const __vue_script__$8 = script$8;
     /* template */
-    var __vue_render__$6 = function () {
+    var __vue_render__$8 = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -5049,17 +5052,17 @@
         1
       )
     };
-    var __vue_staticRenderFns__$6 = [];
-    __vue_render__$6._withStripped = true;
+    var __vue_staticRenderFns__$8 = [];
+    __vue_render__$8._withStripped = true;
       /* style */
-      const __vue_inject_styles__$6 = undefined;
+      const __vue_inject_styles__$8 = undefined;
       /* scoped */
-      const __vue_scope_id__$6 = undefined;
+      const __vue_scope_id__$8 = undefined;
       /* module identifier */
-      const __vue_module_identifier__$6 = undefined;
+      const __vue_module_identifier__$8 = undefined;
       /* functional template */
-      const __vue_is_functional_template__$6 = false;
+      const __vue_is_functional_template__$8 = false;
       /* style inject */
       /* style inject SSR */
@@ -5068,13 +5071,13 @@
-      const __vue_component__$6 = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$6, staticRenderFns: __vue_staticRenderFns__$6 },
-        __vue_inject_styles__$6,
-        __vue_script__$6,
-        __vue_scope_id__$6,
-        __vue_is_functional_template__$6,
-        __vue_module_identifier__$6,
+      const __vue_component__$8 = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$8, staticRenderFns: __vue_staticRenderFns__$8 },
+        __vue_inject_styles__$8,
+        __vue_script__$8,
+        __vue_scope_id__$8,
+        __vue_is_functional_template__$8,
+        __vue_module_identifier__$8,
         false,
         undefined,
         undefined,
@@ -5099,13 +5102,13 @@
     TekIterableCarousel = __decorate([
         vuePropertyDecorator.Component
     ], TekIterableCarousel);
-    var script$5 = TekIterableCarousel;
+    var script$7 = TekIterableCarousel;
     /* script */
-    const __vue_script__$5 = script$5;
+    const __vue_script__$7 = script$7;
     /* template */
-    var __vue_render__$5 = function () {
+    var __vue_render__$7 = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -5179,17 +5182,17 @@
         1
       )
     };
-    var __vue_staticRenderFns__$5 = [];
-    __vue_render__$5._withStripped = true;
+    var __vue_staticRenderFns__$7 = [];
+    __vue_render__$7._withStripped = true;
       /* style */
-      const __vue_inject_styles__$5 = undefined;
+      const __vue_inject_styles__$7 = undefined;
       /* scoped */
-      const __vue_scope_id__$5 = undefined;
+      const __vue_scope_id__$7 = undefined;
       /* module identifier */
-      const __vue_module_identifier__$5 = undefined;
+      const __vue_module_identifier__$7 = undefined;
       /* functional template */
-      const __vue_is_functional_template__$5 = false;
+      const __vue_is_functional_template__$7 = false;
       /* style inject */
       /* style inject SSR */
@@ -5198,13 +5201,13 @@
-      const __vue_component__$5 = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$5, staticRenderFns: __vue_staticRenderFns__$5 },
-        __vue_inject_styles__$5,
-        __vue_script__$5,
-        __vue_scope_id__$5,
-        __vue_is_functional_template__$5,
-        __vue_module_identifier__$5,
+      const __vue_component__$7 = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$7, staticRenderFns: __vue_staticRenderFns__$7 },
+        __vue_inject_styles__$7,
+        __vue_script__$7,
+        __vue_scope_id__$7,
+        __vue_is_functional_template__$7,
+        __vue_module_identifier__$7,
         false,
         undefined,
         undefined,
@@ -5233,7 +5236,7 @@
         __metadata("design:type", Object)
     ], TekIterableComponentRender.prototype, "componentMetadata", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: 'row' }),
+        vuetify.PropWatch({ type: String, default: 'row' }),
         __metadata("design:type", String)
     ], TekIterableComponentRender.prototype, "rowPropName", void 0);
     __decorate([
@@ -5269,27 +5272,27 @@
         __metadata("design:type", Array)
     ], TekIterableComponentRender.prototype, "noResultSlot", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Number, String], default: 'auto' }),
+        vuetify.PropWatch({ type: [Number, String], default: 'auto' }),
         __metadata("design:type", Object)
     ], TekIterableComponentRender.prototype, "height", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Number, String], default: 'none' }),
+        vuetify.PropWatch({ type: [Number, String], default: 'none' }),
         __metadata("design:type", Object)
     ], TekIterableComponentRender.prototype, "maxHeight", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Number, String], default: 'none' }),
+        vuetify.PropWatch({ type: [Number, String], default: 'none' }),
         __metadata("design:type", Object)
     ], TekIterableComponentRender.prototype, "minHeight", void 0);
     TekIterableComponentRender = __decorate([
         vuePropertyDecorator.Component
     ], TekIterableComponentRender);
-    var script$4 = TekIterableComponentRender;
+    var script$6 = TekIterableComponentRender;
     /* script */
-    const __vue_script__$4 = script$4;
+    const __vue_script__$6 = script$6;
     /* template */
-    var __vue_render__$4 = function () {
+    var __vue_render__$6 = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -5298,11 +5301,15 @@
             "div",
             {
               class: ["tek-iterable-component-render", _vm.instance.cssClass],
-              style: Object.assign({}, _vm.instance.cssStyle, {
-                height: _vm.$formatSize(_vm.instance.height),
-                minHeight: _vm.$formatSize(_vm.instance.minHeight),
-                maxHeight: _vm.$formatSize(_vm.instance.maxHeight),
-              }),
+              style: Object.assign(
+                {},
+                {
+                  height: _vm.$formatSize(_vm.instance.height),
+                  minHeight: _vm.$formatSize(_vm.instance.minHeight),
+                  maxHeight: _vm.$formatSize(_vm.instance.maxHeight),
+                },
+                _vm.$styleObject(_vm.instance.cssStyle)
+              ),
               attrs: { id: _vm.instance.name },
             },
             [
@@ -5473,34 +5480,34 @@
           )
         : _vm._e()
     };
-    var __vue_staticRenderFns__$4 = [];
-    __vue_render__$4._withStripped = true;
+    var __vue_staticRenderFns__$6 = [];
+    __vue_render__$6._withStripped = true;
       /* style */
-      const __vue_inject_styles__$4 = function (inject) {
+      const __vue_inject_styles__$6 = function (inject) {
         if (!inject) return
-        inject("data-v-1447399a_0", { source: ".tek-iterable-component-render[data-v-1447399a] {\n  width: 100%;\n  display: flex;\n  flex-wrap: wrap;\n  -webkit-box-flex: 1;\n  flex: 1 1 auto;\n}\n.tek-iterable-component-render .error--text[data-v-1447399a],\n.tek-iterable-component-render .no--data[data-v-1447399a] {\n  text-align: center;\n  width: 100%;\n  font-size: 14px;\n}\n.tek-iterable-component-render .no--data[data-v-1447399a] {\n  color: rgba(0, 0, 0, 0.38);\n}\n.tek-iterable-component-render .tek-iterable-toolbar[data-v-1447399a] {\n  display: flex;\n  justify-content: space-between;\n  margin-bottom: 16px;\n  align-items: center;\n  width: 100%;\n}\n.tek-iterable-component-render .tek-iterable-footer[data-v-1447399a] {\n  padding: 5px 0;\n  display: flex;\n  width: 100%;\n}", map: undefined, media: undefined });
+        inject("data-v-4336f203_0", { source: ".tek-iterable-component-render[data-v-4336f203] {\n  width: 100%;\n  display: flex;\n  flex-wrap: wrap;\n  -webkit-box-flex: 1;\n  flex: 1 1 auto;\n}\n.tek-iterable-component-render .error--text[data-v-4336f203],\n.tek-iterable-component-render .no--data[data-v-4336f203] {\n  text-align: center;\n  width: 100%;\n  font-size: 14px;\n}\n.tek-iterable-component-render .no--data[data-v-4336f203] {\n  color: rgba(0, 0, 0, 0.38);\n}\n.tek-iterable-component-render .tek-iterable-toolbar[data-v-4336f203] {\n  display: flex;\n  justify-content: space-between;\n  margin-bottom: 16px;\n  align-items: center;\n  width: 100%;\n}\n.tek-iterable-component-render .tek-iterable-footer[data-v-4336f203] {\n  padding: 5px 0;\n  display: flex;\n  width: 100%;\n}", map: undefined, media: undefined });
       };
       /* scoped */
-      const __vue_scope_id__$4 = "data-v-1447399a";
+      const __vue_scope_id__$6 = "data-v-4336f203";
       /* module identifier */
-      const __vue_module_identifier__$4 = undefined;
+      const __vue_module_identifier__$6 = undefined;
       /* functional template */
-      const __vue_is_functional_template__$4 = false;
+      const __vue_is_functional_template__$6 = false;
       /* style inject SSR */
       /* style inject shadow dom */
-      const __vue_component__$4 = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$4, staticRenderFns: __vue_staticRenderFns__$4 },
-        __vue_inject_styles__$4,
-        __vue_script__$4,
-        __vue_scope_id__$4,
-        __vue_is_functional_template__$4,
-        __vue_module_identifier__$4,
+      const __vue_component__$6 = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$6, staticRenderFns: __vue_staticRenderFns__$6 },
+        __vue_inject_styles__$6,
+        __vue_script__$6,
+        __vue_scope_id__$6,
+        __vue_is_functional_template__$6,
+        __vue_module_identifier__$6,
         false,
         createInjector,
         undefined,
@@ -5516,27 +5523,27 @@
         }
     };
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekLoading.prototype, "text", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: loading }),
+        vuetify.PropWatch({ type: String, default: loading }),
         __metadata("design:type", String)
     ], TekLoading.prototype, "image", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Number, String], default: 999 }),
+        vuetify.PropWatch({ type: [Number, String], default: 999 }),
         __metadata("design:type", Object)
     ], TekLoading.prototype, "zdIndex", void 0);
     TekLoading = __decorate([
         vuePropertyDecorator.Component
     ], TekLoading);
-    var script$3 = TekLoading;
+    var script$5 = TekLoading;
     /* script */
-    const __vue_script__$3 = script$3;
+    const __vue_script__$5 = script$5;
     /* template */
-    var __vue_render__$3 = function () {
+    var __vue_render__$5 = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -5560,17 +5567,17 @@
         )
       )
     };
-    var __vue_staticRenderFns__$3 = [];
-    __vue_render__$3._withStripped = true;
+    var __vue_staticRenderFns__$5 = [];
+    __vue_render__$5._withStripped = true;
       /* style */
-      const __vue_inject_styles__$3 = undefined;
+      const __vue_inject_styles__$5 = undefined;
       /* scoped */
-      const __vue_scope_id__$3 = undefined;
+      const __vue_scope_id__$5 = undefined;
       /* module identifier */
-      const __vue_module_identifier__$3 = undefined;
+      const __vue_module_identifier__$5 = undefined;
       /* functional template */
-      const __vue_is_functional_template__$3 = false;
+      const __vue_is_functional_template__$5 = false;
       /* style inject */
       /* style inject SSR */
@@ -5579,13 +5586,13 @@
-      const __vue_component__$3 = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$3, staticRenderFns: __vue_staticRenderFns__$3 },
-        __vue_inject_styles__$3,
-        __vue_script__$3,
-        __vue_scope_id__$3,
-        __vue_is_functional_template__$3,
-        __vue_module_identifier__$3,
+      const __vue_component__$5 = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$5, staticRenderFns: __vue_staticRenderFns__$5 },
+        __vue_inject_styles__$5,
+        __vue_script__$5,
+        __vue_scope_id__$5,
+        __vue_is_functional_template__$5,
+        __vue_module_identifier__$5,
         false,
         undefined,
         undefined,
@@ -5608,19 +5615,19 @@
         }
     };
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekNotifications.prototype, "allNotificationsPath", void 0);
     TekNotifications = __decorate([
         vuePropertyDecorator.Component
     ], TekNotifications);
-    var script$2 = TekNotifications;
+    var script$4 = TekNotifications;
     /* script */
-    const __vue_script__$2 = script$2;
+    const __vue_script__$4 = script$4;
     /* template */
-    var __vue_render__$2 = function () {
+    var __vue_render__$4 = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -5697,34 +5704,34 @@
         1
       )
     };
-    var __vue_staticRenderFns__$2 = [];
-    __vue_render__$2._withStripped = true;
+    var __vue_staticRenderFns__$4 = [];
+    __vue_render__$4._withStripped = true;
       /* style */
-      const __vue_inject_styles__$2 = function (inject) {
+      const __vue_inject_styles__$4 = function (inject) {
         if (!inject) return
         inject("data-v-30efacc6_0", { source: ".tek-notifications .tek-card-title .mark-read-text {\n  font-size: var(--zd-font-body1-size);\n  font-weight: var(--zd-font-body1-weight);\n  display: inline-block;\n}\n.tek-notifications .tek-card-title .mark-read-text p {\n  margin-bottom: 0px;\n}\n.tek-notifications .tek-card-title hr.v-divider {\n  margin-bottom: 0px;\n}\n.tek-notifications ul.tek-notifications-list {\n  list-style: none;\n  padding: 0;\n}\n.tek-notifications ul.tek-notifications-list li {\n  border-bottom: solid 1px rgba(0, 0, 0, 0.12);\n  color: #667080;\n  font-size: var(--zd-font-body1-size);\n  font-weight: var(--zd-font-body1-weight);\n  line-height: 14px;\n  padding: 10px 20px 10px 0;\n  position: relative;\n}\n.tek-notifications ul.tek-notifications-list li .tek-notification-subject {\n  font-weight: 700;\n}\n.tek-notifications ul.tek-notifications-list li .tek-notification-read-mark {\n  width: 10px;\n  height: 10px;\n  background-color: var(--v-primary-base);\n  border-radius: 50%;\n  position: absolute;\n  right: 2px;\n  top: 12px;\n}\n.tek-notifications ul.tek-notifications-list li:last-child {\n  border-bottom: none;\n}\n.tek-notifications .tek-notification-show-all {\n  text-decoration: none;\n  text-align: center;\n  padding-top: 10px;\n  font-weight: 700;\n  display: block;\n  border-top: solid 1px rgba(0, 0, 0, 0.12);\n}", map: undefined, media: undefined });
       };
       /* scoped */
-      const __vue_scope_id__$2 = undefined;
+      const __vue_scope_id__$4 = undefined;
       /* module identifier */
-      const __vue_module_identifier__$2 = undefined;
+      const __vue_module_identifier__$4 = undefined;
       /* functional template */
-      const __vue_is_functional_template__$2 = false;
+      const __vue_is_functional_template__$4 = false;
       /* style inject SSR */
       /* style inject shadow dom */
-      const __vue_component__$2 = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$2, staticRenderFns: __vue_staticRenderFns__$2 },
-        __vue_inject_styles__$2,
-        __vue_script__$2,
-        __vue_scope_id__$2,
-        __vue_is_functional_template__$2,
-        __vue_module_identifier__$2,
+      const __vue_component__$4 = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$4, staticRenderFns: __vue_staticRenderFns__$4 },
+        __vue_inject_styles__$4,
+        __vue_script__$4,
+        __vue_scope_id__$4,
+        __vue_is_functional_template__$4,
+        __vue_module_identifier__$4,
         false,
         createInjector,
         undefined,
@@ -5748,67 +5755,67 @@
         }
     };
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekProductCard.prototype, "id", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekProductCard.prototype, "to", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekProductCard.prototype, "src", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekProductCard.prototype, "errorImagePath", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: 'UNAVAILABLE_IMAGE' }),
+        vuetify.PropWatch({ type: String, default: 'UNAVAILABLE_IMAGE' }),
         __metadata("design:type", String)
     ], TekProductCard.prototype, "errorImageText", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekProductCard.prototype, "productName", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String }),
+        vuetify.PropWatch({ type: String }),
         __metadata("design:type", String)
     ], TekProductCard.prototype, "productSupplier", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String }),
+        vuetify.PropWatch({ type: String }),
         __metadata("design:type", String)
     ], TekProductCard.prototype, "productBrand", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Number] }),
+        vuetify.PropWatch({ type: [String, Number] }),
         __metadata("design:type", Object)
     ], TekProductCard.prototype, "productPrice", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: String, default: '' }),
+        vuetify.PropWatch({ type: String, default: '' }),
         __metadata("design:type", String)
     ], TekProductCard.prototype, "width", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Number, String], default: 'auto' }),
+        vuetify.PropWatch({ type: [Number, String], default: 'auto' }),
         __metadata("design:type", Object)
     ], TekProductCard.prototype, "height", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Number, String], default: 'none' }),
+        vuetify.PropWatch({ type: [Number, String], default: 'none' }),
         __metadata("design:type", Object)
     ], TekProductCard.prototype, "maxHeight", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Number, String], default: 'none' }),
+        vuetify.PropWatch({ type: [Number, String], default: 'none' }),
         __metadata("design:type", Object)
     ], TekProductCard.prototype, "minHeight", void 0);
     TekProductCard = __decorate([
         vuePropertyDecorator.Component
     ], TekProductCard);
-    var script$1 = TekProductCard;
+    var script$3 = TekProductCard;
     /* script */
-    const __vue_script__$1 = script$1;
+    const __vue_script__$3 = script$3;
     /* template */
-    var __vue_render__$1 = function () {
+    var __vue_render__$3 = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -5827,12 +5834,16 @@
                 { "theme--light": !_vm.$vuetify.theme.dark || _vm.instance.light },
                 _vm.instance.cssClass,
               ],
-              style: Object.assign({}, _vm.instance.cssStyle, {
-                width: _vm.instance.width,
-                height: _vm.$formatSize(_vm.instance.height),
-                minHeight: _vm.$formatSize(_vm.instance.minHeight),
-                maxHeight: _vm.$formatSize(_vm.instance.maxHeight),
-              }),
+              style: Object.assign(
+                {},
+                {
+                  width: _vm.instance.width,
+                  height: _vm.$formatSize(_vm.instance.height),
+                  minHeight: _vm.$formatSize(_vm.instance.minHeight),
+                  maxHeight: _vm.$formatSize(_vm.instance.maxHeight),
+                },
+                _vm.$styleObject(_vm.instance.cssStyle)
+              ),
               attrs: { id: _vm.instance.name },
               on: {
                 click: function ($event) {
@@ -5942,34 +5953,34 @@
           )
         : _vm._e()
     };
-    var __vue_staticRenderFns__$1 = [];
-    __vue_render__$1._withStripped = true;
+    var __vue_staticRenderFns__$3 = [];
+    __vue_render__$3._withStripped = true;
       /* style */
-      const __vue_inject_styles__$1 = function (inject) {
+      const __vue_inject_styles__$3 = function (inject) {
         if (!inject) return
-        inject("data-v-3dd89d23_0", { source: ".tek-product-card * {\n  text-decoration: none;\n}\n.tek-product-card .v-card {\n  padding: 0%;\n}\n.tek-product-card .v-card .tek-image-content {\n  text-align: center;\n}\n.tek-product-card .v-card .tek-product-card-image-container {\n  position: relative;\n}\n.tek-product-card .v-card .tek-product-card-info {\n  display: flex;\n  flex-direction: column;\n  padding: 5px 10px 10px 10px;\n  color: var(--zd-font-color);\n}\n.tek-product-card .v-card .tek-product-card-info .tek-product-card-title {\n  white-space: nowrap;\n  width: 100%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  font-size: 16px;\n  line-height: 19px;\n}\n.tek-product-card .v-card .tek-product-card-info .tek-product-card-supplier {\n  font-size: var(--zd-font-body2-size);\n  line-height: 14px;\n  color: #c4c4c4;\n}\n.tek-product-card .v-card .tek-product-card-info .tek-product-card-footer {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding-top: 10px;\n}\n.tek-product-card .v-card .tek-product-card-info .tek-product-card-footer .tek-product-card-brand {\n  font-size: var(--zd-font-body2-size);\n  line-height: 14px;\n}\n.tek-product-card .v-card .tek-product-card-info .tek-product-card-footer .tek-product-card-price {\n  font-weight: var(--zd-font-body4-weight);\n  font-size: var(--zd-font-body4-size);\n  line-height: 16px;\n}\n.tek-product-card--link .v-card {\n  cursor: pointer;\n}", map: undefined, media: undefined });
+        inject("data-v-0ad251e8_0", { source: ".tek-product-card * {\n  text-decoration: none;\n}\n.tek-product-card .v-card {\n  padding: 0%;\n}\n.tek-product-card .v-card .tek-image-content {\n  text-align: center;\n}\n.tek-product-card .v-card .tek-product-card-image-container {\n  position: relative;\n}\n.tek-product-card .v-card .tek-product-card-info {\n  display: flex;\n  flex-direction: column;\n  padding: 5px 10px 10px 10px;\n  color: var(--zd-font-color);\n}\n.tek-product-card .v-card .tek-product-card-info .tek-product-card-title {\n  white-space: nowrap;\n  width: 100%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  font-size: 16px;\n  line-height: 19px;\n}\n.tek-product-card .v-card .tek-product-card-info .tek-product-card-supplier {\n  font-size: var(--zd-font-body2-size);\n  line-height: 14px;\n  color: #c4c4c4;\n}\n.tek-product-card .v-card .tek-product-card-info .tek-product-card-footer {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding-top: 10px;\n}\n.tek-product-card .v-card .tek-product-card-info .tek-product-card-footer .tek-product-card-brand {\n  font-size: var(--zd-font-body2-size);\n  line-height: 14px;\n}\n.tek-product-card .v-card .tek-product-card-info .tek-product-card-footer .tek-product-card-price {\n  font-weight: var(--zd-font-body4-weight);\n  font-size: var(--zd-font-body4-size);\n  line-height: 16px;\n}\n.tek-product-card--link .v-card {\n  cursor: pointer;\n}", map: undefined, media: undefined });
       };
       /* scoped */
-      const __vue_scope_id__$1 = undefined;
+      const __vue_scope_id__$3 = undefined;
       /* module identifier */
-      const __vue_module_identifier__$1 = undefined;
+      const __vue_module_identifier__$3 = undefined;
       /* functional template */
-      const __vue_is_functional_template__$1 = false;
+      const __vue_is_functional_template__$3 = false;
       /* style inject SSR */
       /* style inject shadow dom */
-      const __vue_component__$1 = /*#__PURE__*/normalizeComponent(
-        { render: __vue_render__$1, staticRenderFns: __vue_staticRenderFns__$1 },
-        __vue_inject_styles__$1,
-        __vue_script__$1,
-        __vue_scope_id__$1,
-        __vue_is_functional_template__$1,
-        __vue_module_identifier__$1,
+      const __vue_component__$3 = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$3, staticRenderFns: __vue_staticRenderFns__$3 },
+        __vue_inject_styles__$3,
+        __vue_script__$3,
+        __vue_scope_id__$3,
+        __vue_is_functional_template__$3,
+        __vue_module_identifier__$3,
         false,
         createInjector,
         undefined,
@@ -6290,19 +6301,19 @@
         }
     };
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String], default: '' }),
+        vuetify.PropWatch({ type: [String], default: '' }),
         __metadata("design:type", String)
     ], TekGrid.prototype, "title", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Boolean, String], default: false }),
+        vuetify.PropWatch({ type: [Boolean, String], default: false }),
         __metadata("design:type", Object)
     ], TekGrid.prototype, "addButton", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String], default: 'none' }),
+        vuetify.PropWatch({ type: [String], default: 'none' }),
         __metadata("design:type", String)
     ], TekGrid.prototype, "deleteButton", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Boolean, String], default: false }),
+        vuetify.PropWatch({ type: [Boolean, String], default: false }),
         __metadata("design:type", Object)
     ], TekGrid.prototype, "columnsButton", void 0);
     __decorate([
@@ -6310,15 +6321,15 @@
         __metadata("design:type", Object)
     ], TekGrid.prototype, "columnsButtonIgnore", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Boolean, String], default: false }),
+        vuetify.PropWatch({ type: [Boolean, String], default: false }),
         __metadata("design:type", Object)
     ], TekGrid.prototype, "filterButton", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Boolean, String], default: true }),
+        vuetify.PropWatch({ type: [Boolean, String], default: true }),
         __metadata("design:type", Object)
     ], TekGrid.prototype, "showSearch", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [Boolean, String], default: false }),
+        vuetify.PropWatch({ type: [Boolean, String], default: false }),
         __metadata("design:type", Object)
     ], TekGrid.prototype, "columnFilterButton", void 0);
     __decorate([
@@ -6326,23 +6337,23 @@
         __metadata("design:type", Array)
     ], TekGrid.prototype, "actions", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: true }),
+        vuetify.PropWatch({ type: [String, Boolean], default: true }),
         __metadata("design:type", Object)
     ], TekGrid.prototype, "dragColumns", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: true }),
+        vuetify.PropWatch({ type: [String, Boolean], default: true }),
         __metadata("design:type", Object)
     ], TekGrid.prototype, "resizeColumns", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: true }),
+        vuetify.PropWatch({ type: [String, Boolean], default: true }),
         __metadata("design:type", Object)
     ], TekGrid.prototype, "showLayoutOptions", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: false }),
+        vuetify.PropWatch({ type: [String, Boolean], default: false }),
         __metadata("design:type", Object)
     ], TekGrid.prototype, "showExport", void 0);
     __decorate([
-        vuePropertyDecorator.Prop({ type: [String, Boolean], default: true }),
+        vuetify.PropWatch({ type: [String, Boolean], default: true }),
         __metadata("design:type", Object)
     ], TekGrid.prototype, "showReload", void 0);
     __decorate([
@@ -6363,13 +6374,13 @@
     TekGrid = __decorate([
         vuePropertyDecorator.Component
     ], TekGrid);
-    var script = TekGrid;
+    var script$2 = TekGrid;
     /* script */
-    const __vue_script__ = script;
+    const __vue_script__$2 = script$2;
     /* template */
-    var __vue_render__ = function () {
+    var __vue_render__$2 = function () {
       var _vm = this;
       var _h = _vm.$createElement;
       var _c = _vm._self._c || _h;
@@ -6392,7 +6403,7 @@
           { "zd-grid-flex": _vm.instance.gridHeight || _vm.instance.gridMaxHeight },
           { "zd-grid-loading": _vm.instance.datasource.loading },
         ],
-        style: [_vm.cssColorVars, _vm.instance.cssStyle],
+        style: [_vm.cssColorVars, _vm.$styleObject(_vm.instance.cssStyle)],
         attrs: {
           id: _vm.instance.name,
           "fixed-header": "",
@@ -6412,6 +6423,9 @@
           "disable-sort": "",
           "disable-filtering": "",
           tabindex: "0",
+          "loading-text": _vm.$t(_vm.instance.loadingText),
+          "no-data-text": _vm.$t(_vm.instance.noDataText),
+          "no-results-text": _vm.$t(_vm.instance.noResultText),
         },
         on: {
           "current-items": function ($event) {
@@ -7673,21 +7687,205 @@
         },
       })
     };
-    var __vue_staticRenderFns__ = [];
-    __vue_render__._withStripped = true;
+    var __vue_staticRenderFns__$2 = [];
+    __vue_render__$2._withStripped = true;
+      /* style */
+      const __vue_inject_styles__$2 = function (inject) {
+        if (!inject) return
+        inject("data-v-dd43cdf2_0", { source: ".tek-grid .zd-grid-toolbar {\n  height: 36px;\n}\n.tek-grid .zd-grid-toolbar .zd-grid-toolbar-slot {\n  align-items: center;\n}\n.tek-grid .zd-grid-toolbar .toolbar-divider {\n  margin: 10px;\n}\n.tek-grid .zd-grid-toolbar .toolbar-title {\n  line-height: 22px;\n  color: var(--v-primary-base);\n}\n.tek-grid table thead tr th {\n  padding-right: 15px !important;\n}\n.tek-grid table thead tr th.zd-table-cell.zd-table-fixed-column {\n  position: sticky !important;\n  left: 0;\n  z-index: 5;\n}\n.tek-grid table thead tr th.zd-table-cell.zd-table-fixed-column.theme--light {\n  background: #f7f7f7 !important;\n}\n.tek-grid table thead tr th.zd-table-cell.zd-table-fixed-column.theme--dark {\n  background: #3c3c3c !important;\n}\n.tek-grid table thead tr th .tek-grid-column-filter-button {\n  display: inline-block;\n}\n.tek-grid table thead tr th .tek-grid-column-filter-button .v-icon {\n  cursor: pointer;\n  font-size: 15px;\n  width: 15px;\n  padding: 0 3px;\n  opacity: 0;\n  color: #ccc;\n}\n.tek-grid table thead tr th .tek-grid-column-filter-button.has-filter-data .v-icon {\n  opacity: 1;\n  color: var(--v-primary-base);\n}\n.tek-grid table thead tr th:hover .tek-grid-column-filter-button .v-icon {\n  opacity: 1;\n}\n.tek-grid table tbody tr.footer.theme--light {\n  background: #f6f6f6;\n}\n.tek-grid table tbody tr.footer.theme--dark {\n  background: #3b3b3b;\n}\n.tek-grid table tbody tr.footer td.zd-table-cell {\n  font-weight: 700;\n}\n.tek-grid table tbody tr.summary {\n  background: #eee;\n}\n.tek-grid table tbody tr.summary td.zd-table-cell {\n  font-weight: 700;\n  font-size: 15px;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header {\n  font-weight: bold;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .v-icon {\n  font-size: 21px;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .v-icon.closed {\n  transform: rotate(-90deg);\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .zd-table-group-container {\n  position: sticky !important;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .zd-table-group-container .zd-table-group-text {\n  vertical-align: middle;\n}\n.tek-grid table tbody tr td.zd-table-cell .zd-table-cell-text {\n  display: inline-block;\n  vertical-align: middle;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-fixed-column {\n  position: sticky !important;\n  left: 0;\n  z-index: 3;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-fixed-column.theme--light {\n  background: #f7f7f7 !important;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-fixed-column.theme--dark {\n  background: #3c3c3c !important;\n}\n.tek-grid table tbody tr.current td.zd-table-cell.zd-table-fixed-column {\n  color: var(--v-primary-base) !important;\n}\n.tek-grid table .tek-grid-header-group-identation {\n  width: 22px;\n  display: inline-block;\n  vertical-align: middle;\n}\n.tek-grid table .tek-grid-header-group-identation.first-group {\n  width: 20px;\n}\n.tek-grid table .tek-grid-body-group-identation {\n  width: 8px;\n  display: inline-block;\n  vertical-align: middle;\n  margin-left: 14px;\n  height: 100%;\n  border-left: solid 1px #ccc;\n}\n.tek-grid table .tek-grid-body-group-identation.first-group {\n  width: 10px;\n  margin-left: 10px;\n}\n.tek-grid table .tek-grid-body-group-identation.group-footer {\n  height: 60%;\n  border-bottom: solid 1px #ccc;\n  position: relative;\n  top: -25%;\n}\n.tek-grid table .tek-grid-body-group-identation.group-footer-no-line {\n  border-left: none;\n}\n.tek-grid .zd-skeleton-table-cell .v-skeleton-loader__table-cell {\n  height: auto;\n}\n.tekgrid-actions-dropdown > * {\n  display: block;\n}\n.tek-grid-column-filter-menu {\n  padding: 12px 12px 0 12px;\n  max-height: 300px;\n}\n.tek-grid-column-filter-menu.theme--light {\n  background: #fff;\n}\n.tek-grid-column-filter-menu.theme--dark {\n  background: #1e1e1e;\n}\n.filter-helper-values-button {\n  height: 24px !important;\n  margin-left: 5px;\n  margin-top: 0;\n}\n.filter-helper-values-button.with-label {\n  margin-top: 20px;\n}\n.filter-helper-values-option {\n  cursor: pointer;\n}\n.filter-helper-values-option:hover {\n  background-color: rgba(0, 0, 0, 0.03);\n}", map: undefined, media: undefined });
+      };
+      /* scoped */
+      const __vue_scope_id__$2 = undefined;
+      /* module identifier */
+      const __vue_module_identifier__$2 = undefined;
+      /* functional template */
+      const __vue_is_functional_template__$2 = false;
+      /* style inject SSR */
+      /* style inject shadow dom */
+      const __vue_component__$2 = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$2, staticRenderFns: __vue_staticRenderFns__$2 },
+        __vue_inject_styles__$2,
+        __vue_script__$2,
+        __vue_scope_id__$2,
+        __vue_is_functional_template__$2,
+        __vue_module_identifier__$2,
+        false,
+        createInjector,
+        undefined,
+        undefined
+      );
+    let TekUserInfo = class TekUserInfo extends zdUserInfoVue.ZdUserInfo {
+        constructor() {
+            super(...arguments);
+            this.instanceType = teknisaComponentsCommon.TekUserInfo;
+        }
+    };
+    __decorate([
+        vuetify.PropWatch({ type: [String], default: '' }),
+        __metadata("design:type", String)
+    ], TekUserInfo.prototype, "aboutImage", void 0);
+    __decorate([
+        vuetify.PropWatch({ type: [String], default: '' }),
+        __metadata("design:type", String)
+    ], TekUserInfo.prototype, "defaultEmail", void 0);
+    __decorate([
+        vuetify.PropWatch({ type: [Object, String], default: null }),
+        __metadata("design:type", Object)
+    ], TekUserInfo.prototype, "versionInfo", void 0);
+    __decorate([
+        vuetify.PropWatch({ type: [String], default: '' }),
+        __metadata("design:type", String)
+    ], TekUserInfo.prototype, "versionUrl", void 0);
+    __decorate([
+        vuePropertyDecorator.Prop({ type: [Array], default: undefined }),
+        __metadata("design:type", Object)
+    ], TekUserInfo.prototype, "bottomSlot", void 0);
+    TekUserInfo = __decorate([
+        vuePropertyDecorator.Component
+    ], TekUserInfo);
+    var script$1 = TekUserInfo;
+    /* script */
+    const __vue_script__$1 = script$1;
+    /* template */
+    var __vue_render__$1 = function () {
+      var _vm = this;
+      var _h = _vm.$createElement;
+      var _c = _vm._self._c || _h;
+      return _c("zd-user-info", {
+        attrs: {
+          id: _vm.instance.name,
+          "instance-object": _vm.instance,
+          name: "user-info",
+        },
+        scopedSlots: _vm._u(
+          [
+            {
+              key: "headerSlot",
+              fn: function () {
+                return [_vm._t("headerSlot")]
+              },
+              proxy: true,
+            },
+            {
+              key: "topSlot",
+              fn: function () {
+                return [_vm._t("topSlot")]
+              },
+              proxy: true,
+            },
+            {
+              key: "centerSlot",
+              fn: function () {
+                return [_vm._t("centerSlot")]
+              },
+              proxy: true,
+            },
+            {
+              key: "bottomSlot",
+              fn: function () {
+                return [_vm._t("bottomSlot")]
+              },
+              proxy: true,
+            },
+          ],
+          null,
+          true
+        ),
+      })
+    };
+    var __vue_staticRenderFns__$1 = [];
+    __vue_render__$1._withStripped = true;
       /* style */
-      const __vue_inject_styles__ = function (inject) {
+      const __vue_inject_styles__$1 = function (inject) {
         if (!inject) return
-        inject("data-v-3ef85802_0", { source: ".tek-grid .zd-grid-toolbar {\n  height: 36px;\n}\n.tek-grid .zd-grid-toolbar .zd-grid-toolbar-slot {\n  align-items: center;\n}\n.tek-grid .zd-grid-toolbar .toolbar-divider {\n  margin: 10px;\n}\n.tek-grid .zd-grid-toolbar .toolbar-title {\n  line-height: 22px;\n  color: var(--v-primary-base);\n}\n.tek-grid table thead tr th {\n  padding-right: 15px !important;\n}\n.tek-grid table thead tr th.zd-table-cell.zd-table-fixed-column {\n  position: sticky !important;\n  left: 0;\n  z-index: 5;\n}\n.tek-grid table thead tr th.zd-table-cell.zd-table-fixed-column.theme--light {\n  background: #f7f7f7 !important;\n}\n.tek-grid table thead tr th.zd-table-cell.zd-table-fixed-column.theme--dark {\n  background: #3c3c3c !important;\n}\n.tek-grid table thead tr th .tek-grid-column-filter-button {\n  display: inline-block;\n}\n.tek-grid table thead tr th .tek-grid-column-filter-button .v-icon {\n  cursor: pointer;\n  font-size: 15px;\n  width: 15px;\n  padding: 0 3px;\n  opacity: 0;\n  color: #ccc;\n}\n.tek-grid table thead tr th .tek-grid-column-filter-button.has-filter-data .v-icon {\n  opacity: 1;\n  color: var(--v-primary-base);\n}\n.tek-grid table thead tr th:hover .tek-grid-column-filter-button .v-icon {\n  opacity: 1;\n}\n.tek-grid table tbody tr.footer.theme--light {\n  background: #f6f6f6;\n}\n.tek-grid table tbody tr.footer.theme--dark {\n  background: #3b3b3b;\n}\n.tek-grid table tbody tr.footer td.zd-table-cell {\n  font-weight: 700;\n}\n.tek-grid table tbody tr.summary {\n  background: #eee;\n}\n.tek-grid table tbody tr.summary td.zd-table-cell {\n  font-weight: 700;\n  font-size: 15px;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header {\n  font-weight: bold;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .v-icon {\n  font-size: 21px;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .v-icon.closed {\n  transform: rotate(-90deg);\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .zd-table-group-container {\n  position: sticky !important;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-group-header .zd-table-group-container .zd-table-group-text {\n  vertical-align: middle;\n}\n.tek-grid table tbody tr td.zd-table-cell .zd-table-cell-text {\n  display: inline-block;\n  vertical-align: middle;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-fixed-column {\n  position: sticky !important;\n  left: 0;\n  z-index: 3;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-fixed-column.theme--light {\n  background: #f7f7f7 !important;\n}\n.tek-grid table tbody tr td.zd-table-cell.zd-table-fixed-column.theme--dark {\n  background: #3c3c3c !important;\n}\n.tek-grid table tbody tr.current td.zd-table-cell.zd-table-fixed-column {\n  color: var(--v-primary-base) !important;\n}\n.tek-grid table .tek-grid-header-group-identation {\n  width: 22px;\n  display: inline-block;\n  vertical-align: middle;\n}\n.tek-grid table .tek-grid-header-group-identation.first-group {\n  width: 20px;\n}\n.tek-grid table .tek-grid-body-group-identation {\n  width: 8px;\n  display: inline-block;\n  vertical-align: middle;\n  margin-left: 14px;\n  height: 100%;\n  border-left: solid 1px #ccc;\n}\n.tek-grid table .tek-grid-body-group-identation.first-group {\n  width: 10px;\n  margin-left: 10px;\n}\n.tek-grid table .tek-grid-body-group-identation.group-footer {\n  height: 60%;\n  border-bottom: solid 1px #ccc;\n  position: relative;\n  top: -25%;\n}\n.tek-grid table .tek-grid-body-group-identation.group-footer-no-line {\n  border-left: none;\n}\n.tek-grid .zd-skeleton-table-cell .v-skeleton-loader__table-cell {\n  height: auto;\n}\n.tekgrid-actions-dropdown > * {\n  display: block;\n}\n.tek-grid-column-filter-menu {\n  padding: 12px 12px 0 12px;\n  max-height: 300px;\n}\n.tek-grid-column-filter-menu.theme--light {\n  background: #fff;\n}\n.tek-grid-column-filter-menu.theme--dark {\n  background: #1e1e1e;\n}\n.filter-helper-values-button {\n  height: 24px !important;\n  margin-left: 5px;\n  margin-top: 0;\n}\n.filter-helper-values-button.with-label {\n  margin-top: 20px;\n}\n.filter-helper-values-option {\n  cursor: pointer;\n}\n.filter-helper-values-option:hover {\n  background-color: rgba(0, 0, 0, 0.03);\n}", map: undefined, media: undefined });
+        inject("data-v-d9bc3516_0", { source: ".about-modal {\n  height: 80%;\n  overflow-y: unset;\n}\n.about-modal .zd-modal-card, .about-modal .zd-modal-card-text, .about-modal .zd-modal-container, .about-modal .zd-tabs {\n  height: 100%;\n}\n.about-modal .zd-modal-container {\n  display: flex;\n  flex-direction: column;\n}\n.about-modal .zd-tabs, .about-modal .v-tabs-items {\n  overflow-y: auto;\n}", map: undefined, media: undefined });
       };
       /* scoped */
+      const __vue_scope_id__$1 = undefined;
+      /* module identifier */
+      const __vue_module_identifier__$1 = undefined;
+      /* functional template */
+      const __vue_is_functional_template__$1 = false;
+      /* style inject SSR */
+      /* style inject shadow dom */
+      const __vue_component__$1 = /*#__PURE__*/normalizeComponent(
+        { render: __vue_render__$1, staticRenderFns: __vue_staticRenderFns__$1 },
+        __vue_inject_styles__$1,
+        __vue_script__$1,
+        __vue_scope_id__$1,
+        __vue_is_functional_template__$1,
+        __vue_module_identifier__$1,
+        false,
+        createInjector,
+        undefined,
+        undefined
+      );
+    // eslint-disable-next-line prefer-destructuring
+    const ZdList = vuetify.components.ZdList;
+    let TekUserInfoList = class TekUserInfoList extends ZdList {
+        constructor() {
+            super(...arguments);
+            this.instanceType = teknisaComponentsCommon.TekUserInfoList;
+        }
+    };
+    __decorate([
+        vuetify.PropWatch({ type: [String], default: '' }),
+        __metadata("design:type", String)
+    ], TekUserInfoList.prototype, "parentName", void 0);
+    __decorate([
+        vuetify.PropWatch({ type: [Boolean, String], default: true }),
+        __metadata("design:type", Boolean)
+    ], TekUserInfoList.prototype, "dense", void 0);
+    TekUserInfoList = __decorate([
+        vuePropertyDecorator.Component
+    ], TekUserInfoList);
+    var script = TekUserInfoList;
+    /* script */
+    const __vue_script__ = script;
+    /* template */
+    var __vue_render__ = function () {
+      var _vm = this;
+      var _h = _vm.$createElement;
+      var _c = _vm._self._c || _h;
+      return _c("zd-list", {
+        attrs: {
+          id: _vm.instance.name,
+          "instance-object": _vm.instance,
+          name: "list",
+        },
+      })
+    };
+    var __vue_staticRenderFns__ = [];
+    __vue_render__._withStripped = true;
+      /* style */
+      const __vue_inject_styles__ = undefined;
+      /* scoped */
       const __vue_scope_id__ = undefined;
       /* module identifier */
       const __vue_module_identifier__ = undefined;
       /* functional template */
       const __vue_is_functional_template__ = false;
+      /* style inject */
       /* style inject SSR */
       /* style inject shadow dom */
@@ -7702,29 +7900,31 @@
         __vue_is_functional_template__,
         __vue_module_identifier__,
         false,
-        createInjector,
+        undefined,
         undefined,
         undefined
       );
     const components = {
-        TekBreadcrumbHeader: __vue_component__$g,
-        TekCardTitle: __vue_component__$f,
-        TekCrudAddButton: __vue_component__$e,
-        TekCrudCancelButton: __vue_component__$d,
-        TekCrudDeleteButton: __vue_component__$c,
-        TekCrudForm: __vue_component__$b,
-        TekCrudSaveButton: __vue_component__$a,
-        TekGrid: __vue_component__$9,
-        TekGridColumnsButton: __vue_component__$8,
-        TekGridLayoutOptions: __vue_component__$7,
-        TekImage: __vue_component__$6,
-        TekProductCard: __vue_component__$1,
-        TekIterableComponentRender: __vue_component__$4,
-        TekIterableCarousel: __vue_component__$5,
-        TekLoading: __vue_component__$3,
-        TekNotifications: __vue_component__$2,
-        TekTreeGrid: __vue_component__,
+        TekBreadcrumbHeader: __vue_component__$i,
+        TekCardTitle: __vue_component__$h,
+        TekCrudAddButton: __vue_component__$g,
+        TekCrudCancelButton: __vue_component__$f,
+        TekCrudDeleteButton: __vue_component__$e,
+        TekCrudForm: __vue_component__$d,
+        TekCrudSaveButton: __vue_component__$c,
+        TekGrid: __vue_component__$b,
+        TekGridColumnsButton: __vue_component__$a,
+        TekGridLayoutOptions: __vue_component__$9,
+        TekImage: __vue_component__$8,
+        TekProductCard: __vue_component__$3,
+        TekIterableComponentRender: __vue_component__$6,
+        TekIterableCarousel: __vue_component__$7,
+        TekLoading: __vue_component__$5,
+        TekNotifications: __vue_component__$4,
+        TekTreeGrid: __vue_component__$2,
+        TekUserInfo: __vue_component__$1,
+        TekUserInfoList: __vue_component__,
     };
     common.Icons.addIcons({
@@ -7742,23 +7942,26 @@
             Object.keys(components).forEach((id) => {
                 Vue.component(id, components[id]);
             });
+            Vue.component('ZdUserInfo', zdUserInfoVue.ZdUserInfo);
         },
     };
-    exports.TekBreadcrumbHeader = script$g;
-    exports.TekCardTitle = script$f;
-    exports.TekCrudAddButton = script$e;
-    exports.TekCrudCancelButton = script$d;
-    exports.TekCrudDeleteButton = script$c;
-    exports.TekCrudForm = script$b;
-    exports.TekCrudSaveButton = script$a;
-    exports.TekGrid = script$9;
-    exports.TekGridColumnsButton = script$8;
-    exports.TekGridLayoutOptions = script$7;
-    exports.TekImage = script$6;
-    exports.TekIterableComponentRender = script$4;
-    exports.TekProductCard = script$1;
-    exports.TekTreeGrid = script;
+    exports.TekBreadcrumbHeader = script$i;
+    exports.TekCardTitle = script$h;
+    exports.TekCrudAddButton = script$g;
+    exports.TekCrudCancelButton = script$f;
+    exports.TekCrudDeleteButton = script$e;
+    exports.TekCrudForm = script$d;
+    exports.TekCrudSaveButton = script$c;
+    exports.TekGrid = script$b;
+    exports.TekGridColumnsButton = script$a;
+    exports.TekGridLayoutOptions = script$9;
+    exports.TekImage = script$8;
+    exports.TekIterableComponentRender = script$6;
+    exports.TekProductCard = script$3;
+    exports.TekTreeGrid = script$2;
+    exports.TekUserInfo = script$1;
+    exports.TekUserInfoList = script;
     exports["default"] = TeknisaComponents;
     Object.defineProperty(exports, '__esModule', { value: true });