@zeedhi/vuetify 1.60.0 → 1.62.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.
@@ -2212,7 +2212,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
2212
2212
  }
2213
2213
  Vuetify.install = install$1;
2214
2214
  Vuetify.installed = false;
2215
- Vuetify.version = "2.6.10";
2215
+ Vuetify.version = "2.6.11";
2216
2216
  Vuetify.config = {
2217
2217
  silent: false
2218
2218
  };
@@ -3370,7 +3370,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
3370
3370
  return isActive(e);
3371
3371
  }
3372
3372
 
3373
- function directive$1(e, el, binding, vnode) {
3373
+ function directive$1(e, el, binding) {
3374
3374
  const handler = typeof binding.value === 'function' ? binding.value : binding.value.handler;
3375
3375
  el._clickOutside.lastMousedownWasOutside && checkEvent(e, el, binding) && setTimeout(() => {
3376
3376
  checkIsActive(e, binding) && handler && handler(e);
@@ -29895,7 +29895,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
29895
29895
  return isActive(e);
29896
29896
  }
29897
29897
 
29898
- function directive(e, el, binding, vnode) {
29898
+ function directive(e, el, binding) {
29899
29899
  var handler = typeof binding.value === 'function' ? binding.value : binding.value.handler;
29900
29900
  el._clickOutside.lastMousedownWasOutside && checkEvent(e, el, binding) && setTimeout(function () {
29901
29901
  checkIsActive(e, binding) && handler && handler(e);
@@ -36833,7 +36833,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
36833
36833
  exports.default = Vuetify;
36834
36834
  Vuetify.install = install_1.install;
36835
36835
  Vuetify.installed = false;
36836
- Vuetify.version = "2.6.10";
36836
+ Vuetify.version = "2.6.11";
36837
36837
  Vuetify.config = {
36838
36838
  silent: false
36839
36839
  };
@@ -38251,7 +38251,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
38251
38251
  /* style */
38252
38252
  const __vue_inject_styles__$1n = function (inject) {
38253
38253
  if (!inject) return
38254
- inject("data-v-02c50976_0", { source: ".zd-apex-chart .apexcharts-toolbar {\n z-index: 0;\n}\n.zd-apex-chart .apexcharts-toolbar > div {\n transform: scale(0.8) !important;\n}\n.zd-apex-chart.theme--light .apexcharts-toolbar > div > .v-icon {\n color: #3b3b3b !important;\n}\n.zd-apex-chart.theme--light .apexcharts-tooltip {\n background: #fdfdfd !important;\n border: 1px solid #fdfdfd !important;\n color: #3b3b3b !important;\n z-index: 1;\n}\n.zd-apex-chart.theme--light .apexcharts-tooltip .apexcharts-tooltip-title {\n background: #eee !important;\n color: #3b3b3b !important;\n border-bottom: none !important;\n}\n.zd-apex-chart.theme--light .apexcharts-text {\n fill: #3b3b3b !important;\n}\n.zd-apex-chart.theme--light .apexcharts-title-text {\n fill: #3b3b3b !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip {\n background: #eee !important;\n border: 1px solid #d4d4d4 !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip .apexcharts-xaxistooltip-text {\n color: #3b3b3b !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip-bottom::before {\n border-bottom-color: #d4d4d4 !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip-bottom::after {\n border-bottom-color: #d4d4d4 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-toolbar > div > .v-icon {\n color: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-tooltip {\n background: #1e1e1e !important;\n border: 1px solid #1e1e1e !important;\n color: #b8b8b8 !important;\n z-index: 1;\n}\n.zd-apex-chart.theme--dark .apexcharts-tooltip .apexcharts-tooltip-title {\n background: #101010 !important;\n color: #b8b8b8 !important;\n border-bottom: none !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-text {\n fill: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-title-text {\n fill: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip {\n background: #101010 !important;\n border: 1px solid #252525 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip .apexcharts-xaxistooltip-text {\n color: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip-bottom::before {\n border-bottom-color: #252525 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip-bottom::after {\n border-bottom-color: #252525 !important;\n}\n.apexcharts-overlay {\n z-index: 0 !important;\n}\n.apexcharts-container {\n height: 100%;\n}", map: undefined, media: undefined });
38254
+ inject("data-v-0df63fea_0", { source: ".zd-apex-chart .apexcharts-toolbar {\n z-index: 0;\n}\n.zd-apex-chart .apexcharts-toolbar > div {\n transform: scale(0.8) !important;\n}\n.zd-apex-chart.theme--light .apexcharts-toolbar > div > .v-icon {\n color: #3b3b3b !important;\n}\n.zd-apex-chart.theme--light .apexcharts-tooltip {\n background: #fdfdfd !important;\n border: 1px solid #fdfdfd !important;\n color: #3b3b3b !important;\n z-index: 1;\n}\n.zd-apex-chart.theme--light .apexcharts-tooltip .apexcharts-tooltip-title {\n background: #eee !important;\n color: #3b3b3b !important;\n border-bottom: none !important;\n}\n.zd-apex-chart.theme--light .apexcharts-title-text {\n fill: #3b3b3b !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip {\n background: #eee !important;\n border: 1px solid #d4d4d4 !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip .apexcharts-xaxistooltip-text {\n color: #3b3b3b !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip-bottom::before {\n border-bottom-color: #d4d4d4 !important;\n}\n.zd-apex-chart.theme--light .apexcharts-xaxistooltip-bottom::after {\n border-bottom-color: #d4d4d4 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-toolbar > div > .v-icon {\n color: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-tooltip {\n background: #1e1e1e !important;\n border: 1px solid #1e1e1e !important;\n color: #b8b8b8 !important;\n z-index: 1;\n}\n.zd-apex-chart.theme--dark .apexcharts-tooltip .apexcharts-tooltip-title {\n background: #101010 !important;\n color: #b8b8b8 !important;\n border-bottom: none !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-text {\n fill: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-title-text {\n fill: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip {\n background: #101010 !important;\n border: 1px solid #252525 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip .apexcharts-xaxistooltip-text {\n color: #b8b8b8 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip-bottom::before {\n border-bottom-color: #252525 !important;\n}\n.zd-apex-chart.theme--dark .apexcharts-xaxistooltip-bottom::after {\n border-bottom-color: #252525 !important;\n}\n.apexcharts-overlay {\n z-index: 0 !important;\n}\n.apexcharts-container {\n height: 100%;\n}", map: undefined, media: undefined });
38255
38255
 
38256
38256
  };
38257
38257
  /* scoped */
@@ -40620,7 +40620,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
40620
40620
  /* style */
40621
40621
  const __vue_inject_styles__$1d = function (inject) {
40622
40622
  if (!inject) return
40623
- inject("data-v-1d788cee_0", { source: ".zd-code-editor {\n position: relative;\n}\n.zd-code-editor-clipboard-button {\n position: absolute;\n top: 10px;\n right: 10px;\n background-color: var(--v-grey-lighten5);\n opacity: 0;\n transition: 0.3s all ease-in;\n}\n.zd-code-editor-clipboard-button .v-icon {\n color: var(--v-grey-base);\n font-size: 18px;\n}\n.zd-code-editor:hover .zd-code-editor-clipboard-button {\n opacity: 1;\n}\n.zd-code-editor-container {\n position: relative;\n background-color: var(--v-grey-lighten5);\n min-height: 45px;\n display: flex;\n border: solid var(--regular) var(--v-grey-lighten5);\n overflow: auto;\n}\n.zd-code-editor-container:focus-within {\n border: solid var(--regular) var(--v-primary-base);\n}\n.zd-code-editor-container .zd-code-editor-line-numbers {\n height: 100%;\n min-height: 45px;\n width: 30px;\n overflow: hidden;\n flex-shrink: 0;\n margin-top: 0;\n font-size: 0.9em;\n padding: 10px 3px;\n font-family: Consolas, Monaco, \"Andale Mono\", \"Ubuntu Mono\", monospace;\n background: var(--v-grey-lighten4);\n color: var(--zd-font-color);\n position: sticky;\n top: 0;\n left: 0;\n}\n.zd-code-editor-container .zd-code-editor-line-numbers .zd-code-editor-line-number {\n text-align: right;\n white-space: nowrap;\n}\n.zd-code-editor-container pre {\n padding: 10px;\n margin: 0;\n background: transparent;\n -moz-tab-size: 4;\n -ms-flex-positive: 2;\n -o-tab-size: 4;\n -webkit-box-flex: 2;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n flex-grow: 2;\n outline: none;\n tab-size: 4;\n font-weight: 500;\n font-size: 0.9em;\n font-family: Consolas, Monaco, \"Andale Mono\", \"Ubuntu Mono\", monospace;\n overflow: hidden;\n color: var(--zd-font-color);\n}\n.zd-code-editor.theme--dark .zd-code-editor-clipboard-button {\n background-color: #383838;\n}\n.zd-code-editor.theme--dark .zd-code-editor-clipboard-button .v-icon {\n color: var(--v-grey-lighten4);\n font-size: 18px;\n}\n.zd-code-editor.theme--dark .zd-code-editor-container {\n border: solid var(--regular) var(--v-grey-darken3);\n background: #383838;\n}\n.zd-code-editor.theme--dark .zd-code-editor-container .zd-code-editor-line-numbers {\n background: var(--v-grey-darken3);\n color: var(--v-grey-lighten4);\n}\n.zd-code-editor.theme--dark .zd-code-editor-container pre {\n text-shadow: 0 1px #2c2c2c;\n}\n.zd-code-editor.theme--dark .zd-code-editor-container pre span.token.property, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.tag, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.boolean, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.number, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.constant, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.symbol, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.deleted {\n color: #ff6fd3;\n}\n.zd-code-editor.theme--dark .zd-code-editor-container pre span.token.atrule, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.attr-value, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.keyword {\n color: #00acf6;\n}\n.zd-code-editor.theme--dark .zd-code-editor-container pre span.token.function, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.class-name {\n color: #ff7692;\n}\n.zd-code-editor.theme--dark .zd-code-editor-container pre span.token.selector, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.attr-name, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.string, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.char, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.builtin, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.inserted {\n color: #77b300;\n}\n.zd-code-editor.theme--dark .zd-code-editor-container pre span.token.operator {\n background: none;\n}", map: undefined, media: undefined });
40623
+ inject("data-v-19dd4196_0", { source: ".zd-code-editor {\n position: relative;\n}\n.zd-code-editor-clipboard-button {\n position: absolute;\n top: 10px;\n right: 10px;\n background-color: var(--v-grey-lighten5);\n opacity: 0;\n transition: 0.3s all ease-in;\n}\n.zd-code-editor-clipboard-button .v-icon {\n color: var(--v-grey-base);\n font-size: 18px;\n}\n.zd-code-editor:hover .zd-code-editor-clipboard-button {\n opacity: 1;\n}\n.zd-code-editor-container {\n position: relative;\n background-color: var(--v-grey-lighten5);\n min-height: 45px;\n display: flex;\n border: solid var(--regular) var(--v-grey-lighten5);\n overflow: auto;\n}\n.zd-code-editor-container:focus-within {\n border: solid var(--regular) var(--v-primary-base);\n}\n.zd-code-editor-container .zd-code-editor-line-numbers {\n min-height: 45px;\n width: 30px;\n overflow: hidden;\n flex-shrink: 0;\n margin-top: 0;\n font-size: 0.9em;\n padding: 10px 3px;\n font-family: Consolas, Monaco, \"Andale Mono\", \"Ubuntu Mono\", monospace;\n background: var(--v-grey-lighten4);\n color: var(--zd-font-color);\n position: sticky;\n top: 0;\n left: 0;\n display: grid;\n gap: 0.25rem;\n}\n.zd-code-editor-container .zd-code-editor-line-numbers .zd-code-editor-line-number {\n text-align: right;\n white-space: nowrap;\n}\n.zd-code-editor-container pre {\n padding: 10px;\n margin: 0;\n background: transparent;\n -moz-tab-size: 4;\n -ms-flex-positive: 2;\n -o-tab-size: 4;\n -webkit-box-flex: 2;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n flex-grow: 2;\n outline: none;\n tab-size: 4;\n font-weight: 500;\n font-size: 0.9em;\n font-family: Consolas, Monaco, \"Andale Mono\", \"Ubuntu Mono\", monospace;\n overflow: hidden;\n color: var(--zd-font-color);\n}\n.zd-code-editor.theme--dark .zd-code-editor-clipboard-button {\n background-color: #383838;\n}\n.zd-code-editor.theme--dark .zd-code-editor-clipboard-button .v-icon {\n color: var(--v-grey-lighten4);\n font-size: 18px;\n}\n.zd-code-editor.theme--dark .zd-code-editor-container {\n border: solid var(--regular) var(--v-grey-darken3);\n background: #383838;\n}\n.zd-code-editor.theme--dark .zd-code-editor-container .zd-code-editor-line-numbers {\n background: var(--v-grey-darken3);\n color: var(--v-grey-lighten4);\n}\n.zd-code-editor.theme--dark .zd-code-editor-container pre {\n text-shadow: 0 1px #2c2c2c;\n}\n.zd-code-editor.theme--dark .zd-code-editor-container pre span.token.property, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.tag, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.boolean, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.number, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.constant, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.symbol, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.deleted {\n color: #ff6fd3;\n}\n.zd-code-editor.theme--dark .zd-code-editor-container pre span.token.atrule, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.attr-value, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.keyword {\n color: #00acf6;\n}\n.zd-code-editor.theme--dark .zd-code-editor-container pre span.token.function, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.class-name {\n color: #ff7692;\n}\n.zd-code-editor.theme--dark .zd-code-editor-container pre span.token.selector, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.attr-name, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.string, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.char, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.builtin, .zd-code-editor.theme--dark .zd-code-editor-container pre span.token.inserted {\n color: #77b300;\n}\n.zd-code-editor.theme--dark .zd-code-editor-container pre span.token.operator {\n background: none;\n}", map: undefined, media: undefined });
40624
40624
 
40625
40625
  };
40626
40626
  /* scoped */
@@ -42170,7 +42170,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
42170
42170
  while (core.Mask.isMaskDelimiter(inputEl.value[start - 1]) && inputEl.value[start - 1] !== ' ') {
42171
42171
  start -= 1;
42172
42172
  }
42173
- inputEl.value = `${value.slice(0, start - 1)} ${value.substr(start)}`;
42173
+ inputEl.value = `${value.slice(0, start - 1)} ${value.substring(start)}`;
42174
42174
  inputEl.selectionStart = start - 1;
42175
42175
  inputEl.selectionEnd = start - 1;
42176
42176
  if (core.Mask.getValueWithoutMask(inputEl.value) === '') {
@@ -42181,7 +42181,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
42181
42181
  else {
42182
42182
  if ((event.key === 'Backspace' || event.key === 'Delete') && (start !== 0 || end !== value.length)) {
42183
42183
  const selectionText = value.substring(start, end).replace(/[0-9]/g, ' ');
42184
- inputEl.value = value.slice(0, start) + selectionText + value.substr(end);
42184
+ inputEl.value = value.slice(0, start) + selectionText + value.substring(end);
42185
42185
  event.preventDefault();
42186
42186
  }
42187
42187
  else if ((event.key === 'Backspace' || event.key === 'Delete') && (start === 0 && end === value.length)) {
@@ -42195,8 +42195,8 @@ If you're seeing "$attrs is readonly", it's caused by this`);
42195
42195
  while (core.Mask.isMaskDelimiter(value[start]) && value[start] !== ' ') {
42196
42196
  start += 1;
42197
42197
  }
42198
- const firstSlice = value.substr(0, start);
42199
- const secondSlice = value.substr(start + 1);
42198
+ const firstSlice = value.substring(0, start);
42199
+ const secondSlice = value.substring(start + 1);
42200
42200
  inputEl.value = firstSlice + secondSlice;
42201
42201
  }
42202
42202
  inputEl.selectionStart = start;
@@ -42607,7 +42607,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
42607
42607
  while (core.Mask.isMaskDelimiter(inputEl.value[start - 1]) && inputEl.value[start - 1] !== ' ') {
42608
42608
  start -= 1;
42609
42609
  }
42610
- inputEl.value = `${value.slice(0, start - 1)} ${value.substr(start)}`;
42610
+ inputEl.value = `${value.slice(0, start - 1)} ${value.substring(start)}`;
42611
42611
  inputEl.selectionStart = start - 1;
42612
42612
  inputEl.selectionEnd = start - 1;
42613
42613
  if (core.Mask.getValueWithoutMask(inputEl.value) === '') {
@@ -42618,7 +42618,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
42618
42618
  else {
42619
42619
  if ((event.key === 'Backspace' || event.key === 'Delete') && (start !== 0 || end !== value.length)) {
42620
42620
  const selectionText = value.substring(start, end).replace(/[0-9-]/g, ' ');
42621
- inputEl.value = value.slice(0, start) + selectionText + value.substr(end);
42621
+ inputEl.value = value.slice(0, start) + selectionText + value.substring(end);
42622
42622
  event.preventDefault();
42623
42623
  }
42624
42624
  else if ((event.key === 'Backspace' || event.key === 'Delete') && (start === 0 && end === value.length)) {
@@ -42632,8 +42632,8 @@ If you're seeing "$attrs is readonly", it's caused by this`);
42632
42632
  while (core.Mask.isMaskDelimiter(value[start]) && value[start] !== ' ') {
42633
42633
  start += 1;
42634
42634
  }
42635
- const firstSlice = value.substr(0, start);
42636
- const secondSlice = value.substr(start + 1);
42635
+ const firstSlice = value.substring(0, start);
42636
+ const secondSlice = value.substring(start + 1);
42637
42637
  inputEl.value = firstSlice + secondSlice;
42638
42638
  }
42639
42639
  inputEl.selectionStart = start;
@@ -42790,6 +42790,10 @@ If you're seeing "$attrs is readonly", it's caused by this`);
42790
42790
  PropWatch({ type: String, default: '' }),
42791
42791
  __metadata("design:type", String)
42792
42792
  ], ZdDateRange.prototype, "helperValue", void 0);
42793
+ __decorate([
42794
+ PropWatch({ type: [String, Array], default: () => [] }),
42795
+ __metadata("design:type", Object)
42796
+ ], ZdDateRange.prototype, "value", void 0);
42793
42797
  ZdDateRange = __decorate([
42794
42798
  vuePropertyDecorator.Component
42795
42799
  ], ZdDateRange);
@@ -43227,6 +43231,54 @@ If you're seeing "$attrs is readonly", it's caused by this`);
43227
43231
  undefined
43228
43232
  );
43229
43233
 
43234
+ /**
43235
+ * This function was copied from https://github.com/vuetifyjs/vuetify/blob/master/packages/vuetify/src/mixins/activatable/index.ts
43236
+ * the only change was to consider ZdDropdown and ZdTooltip as activatable components
43237
+ */
43238
+ const getActivator = (e, comp) => {
43239
+ // If we've already fetched the activator, re-use
43240
+ if (comp.activatorElement)
43241
+ return comp.activatorElement;
43242
+ let activator = null;
43243
+ if (comp.activator) {
43244
+ const target = comp.internalActivator ? comp.$el : document;
43245
+ if (typeof comp.activator === 'string') {
43246
+ // Selector
43247
+ activator = target.querySelector(comp.activator);
43248
+ }
43249
+ else if (comp.activator.$el) {
43250
+ // Component (ref)
43251
+ activator = comp.activator.$el;
43252
+ }
43253
+ else {
43254
+ // HTMLElement | Element
43255
+ activator = comp.activator;
43256
+ }
43257
+ }
43258
+ else if (comp.activatorNode.length === 1 || (comp.activatorNode.length && !e)) {
43259
+ // Use the contents of the activator slot
43260
+ // There's either only one element in it or we
43261
+ // don't have a click event to use as a last resort
43262
+ const vm = comp.activatorNode[0].componentInstance;
43263
+ const isActivatable = (vm.$options.mixins
43264
+ && vm.$options.mixins.some((m) => m.options && ['activatable', 'menuable'].includes(m.options.name))) || ['ZdDropdown', 'ZdTooltip'].includes(vm.$options.name);
43265
+ if (vm && isActivatable) {
43266
+ // Activator is actually another activatible component, use its activator (#8846)
43267
+ activator = vm.getActivator();
43268
+ }
43269
+ else {
43270
+ activator = comp.activatorNode[0].elm;
43271
+ }
43272
+ }
43273
+ else if (e) {
43274
+ // Activated by a click or focus event
43275
+ activator = (e.currentTarget || e.target);
43276
+ }
43277
+ // The activator should only be a valid element (Ignore comments and text nodes)
43278
+ comp.activatorElement = (activator === null || activator === void 0 ? void 0 : activator.nodeType) === Node.ELEMENT_NODE ? activator : null;
43279
+ return comp.activatorElement;
43280
+ };
43281
+
43230
43282
  /**
43231
43283
  * Dropdown component
43232
43284
  */
@@ -43243,6 +43295,16 @@ If you're seeing "$attrs is readonly", it's caused by this`);
43243
43295
  '--cursor': this.getCursor(this.instance.cursor),
43244
43296
  };
43245
43297
  }
43298
+ getActivator() {
43299
+ const { dropdown } = this.$refs;
43300
+ return (dropdown === null || dropdown === void 0 ? void 0 : dropdown.getActivator()) || null;
43301
+ }
43302
+ mounted() {
43303
+ const { dropdown } = this.$refs;
43304
+ if (dropdown) {
43305
+ dropdown.getActivator = (e) => getActivator(e, dropdown);
43306
+ }
43307
+ }
43246
43308
  };
43247
43309
  __decorate([
43248
43310
  PropWatch({ type: [Boolean, String], default: false }),
@@ -43340,6 +43402,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
43340
43402
  expression: "instance.isVisible",
43341
43403
  },
43342
43404
  ],
43405
+ ref: "dropdown",
43343
43406
  style: _vm.instance.cssStyle,
43344
43407
  attrs: {
43345
43408
  id: _vm.instance.name,
@@ -43369,31 +43432,25 @@ If you're seeing "$attrs is readonly", it's caused by this`);
43369
43432
  var dropdown = ref.on;
43370
43433
  return [
43371
43434
  _c(
43372
- "div",
43373
- [
43374
- _c(
43375
- _vm.instance.activator.component,
43376
- _vm._b(
43377
- {
43378
- tag: "component",
43379
- attrs: {
43380
- "dropdown-activator": Object.assign(
43381
- {},
43382
- _vm.$attrs["dropdown-activator"],
43383
- dropdown
43384
- ),
43385
- },
43386
- },
43387
- "component",
43388
- _vm.instance.activator,
43389
- false
43390
- )
43391
- ),
43392
- _vm._v(" "),
43393
- _c("div", { staticStyle: { display: "none" } }),
43394
- ],
43395
- 1
43435
+ _vm.instance.activator.component,
43436
+ _vm._b(
43437
+ {
43438
+ tag: "component",
43439
+ attrs: {
43440
+ "dropdown-activator": Object.assign(
43441
+ {},
43442
+ _vm.$attrs["dropdown-activator"],
43443
+ dropdown
43444
+ ),
43445
+ },
43446
+ },
43447
+ "component",
43448
+ _vm.instance.activator,
43449
+ false
43450
+ )
43396
43451
  ),
43452
+ _vm._v(" "),
43453
+ _c("div", { staticStyle: { display: "none" } }),
43397
43454
  ]
43398
43455
  },
43399
43456
  },
@@ -43452,7 +43509,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
43452
43509
  /* style */
43453
43510
  const __vue_inject_styles__$11 = function (inject) {
43454
43511
  if (!inject) return
43455
- inject("data-v-fa06dbd6_0", { source: ".zd-dropdown {\n font-size: var(--zd-font-body1-size);\n font-weight: var(--zd-font-body1-weight);\n color: var(--zd-font-color);\n height: auto;\n line-height: unset;\n white-space: unset;\n overflow: auto;\n text-overflow: unset;\n padding: 2px;\n}\n.zd-dropdown .zd-dropdown-component {\n padding: 6px 14px;\n border-radius: var(--border);\n}\n.zd-dropdown-hover:hover {\n background-color: var(--v-grey-lighten5);\n}\n.zd-dropdown-cursor {\n cursor: var(--cursor);\n}\n.zd-dropdown-menu {\n margin: 0 !important;\n padding: 0 !important;\n box-shadow: var(--shadow-8);\n}", map: undefined, media: undefined });
43512
+ inject("data-v-289939c3_0", { source: ".zd-dropdown {\n font-size: var(--zd-font-body1-size);\n font-weight: var(--zd-font-body1-weight);\n color: var(--zd-font-color);\n height: auto;\n line-height: unset;\n white-space: unset;\n overflow: auto;\n text-overflow: unset;\n padding: 2px;\n}\n.zd-dropdown .zd-dropdown-component {\n padding: 6px 14px;\n border-radius: var(--border);\n}\n.zd-dropdown-hover:hover {\n background-color: var(--v-grey-lighten5);\n}\n.zd-dropdown-cursor {\n cursor: var(--cursor);\n}\n.zd-dropdown-menu {\n margin: 0 !important;\n padding: 0 !important;\n box-shadow: var(--shadow-8);\n}", map: undefined, media: undefined });
43456
43513
 
43457
43514
  };
43458
43515
  /* scoped */
@@ -44720,6 +44777,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
44720
44777
  constructor() {
44721
44778
  super(...arguments);
44722
44779
  this.instanceType = common.Grid;
44780
+ this.allselectedState = false;
44723
44781
  this.resizeX = 0;
44724
44782
  this.resizeWidth = 0;
44725
44783
  this.resizeTableWidth = 0;
@@ -44748,6 +44806,19 @@ If you're seeing "$attrs is readonly", it's caused by this`);
44748
44806
  }, 0);
44749
44807
  }
44750
44808
  }
44809
+ updateStates() {
44810
+ setTimeout(() => {
44811
+ this.allselectedState = this.instance.datasource.data.every((row) => {
44812
+ if (this.instance.callDisableSelection(row))
44813
+ return true;
44814
+ return this.instance.selectedRows.some((item) => {
44815
+ const key = this.instance.datasource.uniqueKey;
44816
+ const result = item[key] === row[key];
44817
+ return result;
44818
+ });
44819
+ });
44820
+ }, 0);
44821
+ }
44751
44822
  mounted() {
44752
44823
  this.setHeight();
44753
44824
  if (this.instance.dragColumns) {
@@ -44977,6 +45048,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
44977
45048
  }
44978
45049
  selectAllClick(isSelected, event) {
44979
45050
  this.$nextTick(() => {
45051
+ this.instance.selectAll(isSelected);
44980
45052
  this.instance.selectAllClick(isSelected, event, this.$el);
44981
45053
  });
44982
45054
  }
@@ -45273,6 +45345,12 @@ If you're seeing "$attrs is readonly", it's caused by this`);
45273
45345
  __metadata("design:paramtypes", [Boolean]),
45274
45346
  __metadata("design:returntype", void 0)
45275
45347
  ], ZdGrid.prototype, "change", null);
45348
+ __decorate([
45349
+ vuePropertyDecorator.Watch('instance.selectedRows'),
45350
+ __metadata("design:type", Function),
45351
+ __metadata("design:paramtypes", []),
45352
+ __metadata("design:returntype", void 0)
45353
+ ], ZdGrid.prototype, "updateStates", null);
45276
45354
  ZdGrid = __decorate([
45277
45355
  Component__default["default"]
45278
45356
  ], ZdGrid);
@@ -45368,7 +45446,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
45368
45446
  key: "header",
45369
45447
  fn: function (ref) {
45370
45448
  var props = ref.props;
45371
- var on = ref.on;
45449
+ ref.on;
45372
45450
  return [
45373
45451
  _c("thead", { staticClass: "zd-grid-table-header" }, [
45374
45452
  _c(
@@ -45395,20 +45473,18 @@ If you're seeing "$attrs is readonly", it's caused by this`);
45395
45473
  "indeterminate-icon": _vm.$getIcon(
45396
45474
  "checkboxIndeterminate"
45397
45475
  ),
45398
- "input-value": props.everyItem,
45476
+ "input-value": _vm.allselectedState,
45399
45477
  indeterminate:
45400
- !props.everyItem && props.someItems,
45478
+ !_vm.allselectedState &&
45479
+ props.someItems,
45401
45480
  },
45402
45481
  on: {
45403
45482
  click: function ($event) {
45404
45483
  $event.stopPropagation();
45405
- on["toggle-select-all"](
45406
- !props.everyItem
45407
- );
45408
- _vm.selectAllClick(
45409
- !props.everyItem,
45484
+ return _vm.selectAllClick(
45485
+ !_vm.allselectedState,
45410
45486
  $event
45411
- );
45487
+ )
45412
45488
  },
45413
45489
  },
45414
45490
  })
@@ -46090,7 +46166,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
46090
46166
  /* style */
46091
46167
  const __vue_inject_styles__$X = function (inject) {
46092
46168
  if (!inject) return
46093
- inject("data-v-7de6af71_0", { source: ".zd-grid {\n outline: none;\n}\n.zd-grid-flex {\n display: flex;\n flex-direction: column;\n}\n.zd-grid-flex .v-data-table__wrapper {\n flex: 1;\n}\n.zd-grid.theme--light:active table th.zd-table-cell, .zd-grid.theme--light:focus table th.zd-table-cell, .zd-grid.theme--light:focus-within table th.zd-table-cell {\n color: var(--v-primary-base) !important;\n}\n.zd-grid-toolbar {\n display: flex;\n justify-content: space-between;\n margin-bottom: var(--spacing-4);\n align-items: center;\n}\n.zd-grid-toolbar-slot {\n width: 100%;\n display: flex;\n align-items: center;\n}\n.zd-grid-search {\n max-width: 200px;\n}\n.zd-grid table .zd-table-cell {\n transition: height 0.1s ease;\n}\n.zd-grid table .zd-table-cell.selectable {\n width: 40px !important;\n padding-right: var(--spacing-2) !important;\n max-width: 40px !important;\n padding-bottom: 0 !important;\n}\n.zd-grid table .zd-table-cell.selectable > div.zd-grid-header-checkbox {\n margin-top: -2px;\n}\n.zd-grid table .zd-grid-header-checkbox, .zd-grid table .zd-grid-row-checkbox {\n margin-top: 0;\n padding-top: 0;\n}\n.zd-grid table .zd-grid-header-checkbox .v-icon, .zd-grid table .zd-grid-row-checkbox .v-icon {\n font-size: var(--icon-size-small);\n}\n.zd-grid table .zd-grid-header-checkbox .v-input--selection-controls__ripple::before, .zd-grid table .zd-grid-row-checkbox .v-input--selection-controls__ripple::before {\n display: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell {\n font-size: var(--zd-font-body2-size);\n font-weight: var(--zd-font-body2-weight);\n white-space: nowrap;\n height: 40px;\n padding: 0 var(--spacing-4) var(--spacing-2) var(--spacing-4);\n z-index: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-header-cell {\n width: 100%;\n display: flex;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-left .zd-table-header-cell {\n justify-content: flex-start;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-right .zd-table-header-cell {\n justify-content: flex-end;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort {\n opacity: 0;\n position: relative;\n display: inline-block;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-icon {\n position: relative;\n transition: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order {\n position: absolute;\n font-size: 9px;\n right: 2px;\n color: var(--zd-font-color);\n width: 12px;\n text-align: center;\n border-radius: 50%;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order.left {\n right: auto;\n left: 2px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name {\n opacity: 0.7;\n white-space: pre;\n display: inline-block;\n vertical-align: bottom;\n overflow: hidden;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.sortable {\n cursor: pointer;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: -8px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: 6px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: 3px;\n transform: rotate(180deg);\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: -1px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-name, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-name {\n opacity: 1;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-sort, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-sort {\n opacity: 1;\n}\n.zd-grid table thead tr th .zd-grid-resize-handle {\n height: 100%;\n width: 10px;\n display: block;\n position: absolute;\n top: 0;\n right: 0;\n cursor: ew-resize;\n font-size: 15px;\n color: #ccc;\n display: none;\n}\n.zd-grid table thead tr th:hover .zd-grid-resize-handle {\n display: block;\n}\n.zd-grid table tbody tr td.zd-table-cell {\n font-size: var(--zd-font-body1-size);\n font-weight: var(--zd-font-body1-weight);\n padding: 0 var(--spacing-4);\n height: 48px;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable {\n overflow: hidden;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 0.7;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text {\n display: block;\n overflow: hidden;\n white-space: pre;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table tbody tr:hover td.zd-table-cell.selectable .zd-grid-row-checkbox, .zd-grid table tbody tr.active td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 1;\n}\n.zd-grid table tbody tr.current {\n background: var(--current-row-color);\n}\n.zd-grid table tbody tr.current:hover {\n background: var(--current-row-hover-color) !important;\n}\n.zd-grid.v-data-table--dense table thead tr th.zd-table-cell {\n padding: 0 var(--spacing-2) var(--spacing-1) var(--spacing-2);\n height: 24px;\n}\n.zd-grid.v-data-table--dense table tbody tr td.zd-table-cell {\n padding: 0 var(--spacing-2);\n height: 29px;\n}\n.zd-grid.theme--light.v-data-table {\n background-color: transparent;\n}\n.zd-grid.theme--light table thead th.zd-table-cell {\n color: var(--zd-font-color) !important;\n}\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--indeterminate .v-icon,\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--is-label-active .v-icon {\n color: var(--v-primary-base);\n}\n.zd-grid.theme--light table tbody td.zd-table-cell {\n color: var(--zd-font-color);\n}\n.zd-grid.theme--light table tbody tr:not(:last-child) td:not(.v-data-table__mobile-row) {\n border-bottom: solid var(--regular) var(--v-grey-lighten5);\n}\n.zd-grid.theme--light.v-data-table--fixed-header table thead th.zd-table-cell {\n box-shadow: inset 0 -1px 0 var(--v-grey-lighten3);\n}\n.zd-grid-footer {\n margin: 24px 0 0 0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n}\n.zd-grid-div-footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n@media screen and (max-width: 425px) {\n.zd-grid-footer {\n flex-direction: column;\n justify-content: center;\n}\n.zd-grid-div-footer {\n width: 100%;\n}\n.zd-grid .zd-iterable-pagination {\n justify-content: space-evenly;\n}\n}\n.zd-grid .zd-skeleton-table-cell .v-skeleton-loader__table-cell {\n height: auto;\n}\n.zd-grid .zd-grid-cell-tooltip {\n z-index: 10000;\n position: fixed;\n color: white;\n background-color: var(--v-grey-lighten1);\n border-radius: var(--border);\n padding: var(--spacing-1) var(--spacing-2);\n opacity: 0.9;\n display: none;\n font-size: 14px;\n line-height: 22px;\n text-transform: none;\n width: auto;\n pointer-events: none;\n white-space: pre;\n}\n.zd-grid .zd-grid-cell-tooltip.zd-grid-cell-tooltip-show {\n display: block;\n white-space: normal;\n}\n.zd-grid-loading {\n pointer-events: none;\n}\n.v-data-table__progress {\n position: sticky;\n top: 24px;\n}\n.v-data-table--mobile > .v-data-table__wrapper tbody {\n display: contents;\n flex-direction: column;\n}", map: undefined, media: undefined });
46169
+ inject("data-v-c13aa836_0", { source: ".zd-grid {\n outline: none;\n}\n.zd-grid-flex {\n display: flex;\n flex-direction: column;\n}\n.zd-grid-flex .v-data-table__wrapper {\n flex: 1;\n}\n.zd-grid.theme--light:active table th.zd-table-cell, .zd-grid.theme--light:focus table th.zd-table-cell, .zd-grid.theme--light:focus-within table th.zd-table-cell {\n color: var(--v-primary-base) !important;\n}\n.zd-grid-toolbar {\n display: flex;\n justify-content: space-between;\n margin-bottom: var(--spacing-4);\n align-items: center;\n}\n.zd-grid-toolbar-slot {\n width: 100%;\n display: flex;\n align-items: center;\n}\n.zd-grid-search {\n max-width: 200px;\n}\n.zd-grid table .zd-table-cell {\n transition: height 0.1s ease;\n}\n.zd-grid table .zd-table-cell.selectable {\n width: 40px !important;\n padding-right: var(--spacing-2) !important;\n max-width: 40px !important;\n padding-bottom: 0 !important;\n}\n.zd-grid table .zd-table-cell.selectable > div.zd-grid-header-checkbox {\n margin-top: -2px;\n}\n.zd-grid table .zd-grid-header-checkbox, .zd-grid table .zd-grid-row-checkbox {\n margin-top: 0;\n padding-top: 0;\n}\n.zd-grid table .zd-grid-header-checkbox .v-icon, .zd-grid table .zd-grid-row-checkbox .v-icon {\n font-size: var(--icon-size-small);\n}\n.zd-grid table .zd-grid-header-checkbox .v-input--selection-controls__ripple::before, .zd-grid table .zd-grid-row-checkbox .v-input--selection-controls__ripple::before {\n display: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell {\n font-size: var(--zd-font-body2-size);\n font-weight: var(--zd-font-body2-weight);\n white-space: nowrap;\n height: 40px;\n padding: 0 var(--spacing-4) var(--spacing-2) var(--spacing-4);\n z-index: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-header-cell {\n width: 100%;\n display: flex;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-left .zd-table-header-cell {\n justify-content: flex-start;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-right .zd-table-header-cell {\n justify-content: flex-end;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort {\n opacity: 0;\n position: relative;\n display: inline-block;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-icon {\n position: relative;\n transition: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order {\n position: absolute;\n font-size: 9px;\n right: 2px;\n color: var(--zd-font-color);\n width: 12px;\n text-align: center;\n border-radius: 50%;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order.left {\n right: auto;\n left: 2px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name {\n opacity: 0.7;\n white-space: pre;\n display: inline-block;\n vertical-align: bottom;\n overflow: hidden;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.sortable {\n cursor: pointer;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: -8px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: 6px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: 3px;\n transform: rotate(180deg);\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: -1px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-name, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-name {\n opacity: 1;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-sort, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-sort {\n opacity: 1;\n}\n.zd-grid table thead tr th .zd-grid-resize-handle {\n height: 100%;\n width: 10px;\n display: block;\n position: absolute;\n top: 0;\n right: 0;\n cursor: ew-resize;\n font-size: 15px;\n color: #ccc;\n display: none;\n}\n.zd-grid table thead tr th:hover .zd-grid-resize-handle {\n display: block;\n}\n.zd-grid table tbody tr td.zd-table-cell {\n font-size: var(--zd-font-body1-size);\n font-weight: var(--zd-font-body1-weight);\n padding: 0 var(--spacing-4);\n height: 48px;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable {\n overflow: hidden;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 0.7;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text {\n display: block;\n overflow: hidden;\n white-space: pre;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table tbody tr:hover td.zd-table-cell.selectable .zd-grid-row-checkbox, .zd-grid table tbody tr.active td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 1;\n}\n.zd-grid table tbody tr.current {\n background: var(--current-row-color);\n}\n.zd-grid table tbody tr.current:hover {\n background: var(--current-row-hover-color) !important;\n}\n.zd-grid.v-data-table--dense table thead tr th.zd-table-cell {\n padding: 0 var(--spacing-2) var(--spacing-1) var(--spacing-2);\n height: 24px;\n}\n.zd-grid.v-data-table--dense table tbody tr td.zd-table-cell {\n padding: 0 var(--spacing-2);\n height: 29px;\n}\n.zd-grid.theme--light.v-data-table {\n background-color: transparent;\n}\n.zd-grid.theme--light table thead th.zd-table-cell {\n color: var(--zd-font-color) !important;\n}\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--indeterminate .v-icon,\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--is-label-active .v-icon {\n color: var(--v-primary-base);\n}\n.zd-grid.theme--light table tbody td.zd-table-cell {\n color: var(--zd-font-color);\n}\n.zd-grid.theme--light table tbody tr:not(:last-child) td:not(.v-data-table__mobile-row) {\n border-bottom: solid var(--regular) var(--v-grey-lighten5);\n}\n.zd-grid.theme--light.v-data-table--fixed-header table thead th.zd-table-cell {\n box-shadow: inset 0 -1px 0 var(--v-grey-lighten3);\n}\n.zd-grid-footer {\n margin: 24px 0 0 0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n}\n.zd-grid-div-footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n@media screen and (max-width: 425px) {\n.zd-grid-footer {\n flex-direction: column;\n justify-content: center;\n}\n.zd-grid-div-footer {\n width: 100%;\n}\n.zd-grid .zd-iterable-pagination {\n justify-content: space-evenly;\n}\n}\n.zd-grid .zd-skeleton-table-cell .v-skeleton-loader__table-cell {\n height: auto;\n}\n.zd-grid .zd-grid-cell-tooltip {\n z-index: 10000;\n position: fixed;\n color: white;\n background-color: var(--v-grey-lighten1);\n border-radius: var(--border);\n padding: var(--spacing-1) var(--spacing-2);\n opacity: 0.9;\n display: none;\n font-size: 14px;\n line-height: 22px;\n text-transform: none;\n width: auto;\n pointer-events: none;\n white-space: pre;\n}\n.zd-grid .zd-grid-cell-tooltip.zd-grid-cell-tooltip-show {\n display: block;\n white-space: normal;\n}\n.zd-grid-loading {\n pointer-events: none;\n}\n.v-data-table__progress {\n position: sticky;\n top: 24px;\n}\n.v-data-table--mobile > .v-data-table__wrapper tbody {\n display: contents;\n flex-direction: column;\n}", map: undefined, media: undefined });
46094
46170
 
46095
46171
  };
46096
46172
  /* scoped */
@@ -46126,6 +46202,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
46126
46202
  super(...arguments);
46127
46203
  this.instanceType = common.GridEditable;
46128
46204
  this.inputToFocus = '';
46205
+ this.isTrVisible = false;
46129
46206
  this.navigationKeyMapping = {
46130
46207
  enter: {
46131
46208
  event: this.navigateDown.bind(this),
@@ -46173,27 +46250,40 @@ If you're seeing "$attrs is readonly", it's caused by this`);
46173
46250
  }
46174
46251
  }
46175
46252
  getColWidth(col) {
46176
- this.$nextTick(() => {
46177
- const element = this.$el.querySelector(`.column-th-${col.name}-${this.instance.name}`);
46178
- if (!element) {
46179
- return;
46180
- }
46181
- if (col.width) {
46182
- element.style.width = this.calcWidth(col, col.width || '');
46183
- }
46184
- else if (col.maxWidth) {
46185
- element.style.width = this.calcWidth(col, col.maxWidth || '');
46186
- }
46187
- else if (col.minWidth) {
46188
- element.style.width = this.calcWidth(col, col.minWidth || '');
46189
- }
46190
- else {
46191
- element.style.width = `${element.clientWidth}px`;
46192
- }
46193
- });
46253
+ if (this.isTrVisible) {
46254
+ this.$nextTick(() => {
46255
+ const element = this.$el.querySelector(`.column-th-${col.name}-${this.instance.name}`);
46256
+ if (!element) {
46257
+ return;
46258
+ }
46259
+ if (col.width) {
46260
+ element.style.width = this.calcWidth(col, col.width || '');
46261
+ }
46262
+ else if (col.maxWidth) {
46263
+ element.style.width = this.calcWidth(col, col.maxWidth || '');
46264
+ }
46265
+ else if (col.minWidth) {
46266
+ element.style.width = this.calcWidth(col, col.minWidth || '');
46267
+ }
46268
+ else {
46269
+ element.style.width = `${element.clientWidth}px`;
46270
+ }
46271
+ });
46272
+ }
46194
46273
  return true;
46195
46274
  }
46275
+ registerOnVisible() {
46276
+ const headerRow = this.$el.querySelector('thead > tr');
46277
+ if (!headerRow)
46278
+ return;
46279
+ const obs = this.$onVisible(headerRow, () => {
46280
+ this.instance.columns.forEach(this.getColWidth);
46281
+ this.isTrVisible = true;
46282
+ obs.disconnect();
46283
+ }, this.$el);
46284
+ }
46196
46285
  mounted() {
46286
+ this.registerOnVisible();
46197
46287
  core.KeyMap.bind(this.navigationKeyMapping, this.instance, this.$el);
46198
46288
  }
46199
46289
  beforeDestroy() {
@@ -46358,7 +46448,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
46358
46448
  key: "header",
46359
46449
  fn: function (ref) {
46360
46450
  var props = ref.props;
46361
- var on = ref.on;
46451
+ ref.on;
46362
46452
  return [
46363
46453
  _c("thead", { staticClass: "zd-grid-table-header" }, [
46364
46454
  _c(
@@ -46386,20 +46476,18 @@ If you're seeing "$attrs is readonly", it's caused by this`);
46386
46476
  "indeterminate-icon": _vm.$getIcon(
46387
46477
  "checkboxIndeterminate"
46388
46478
  ),
46389
- "input-value": props.everyItem,
46479
+ "input-value": _vm.allselectedState,
46390
46480
  indeterminate:
46391
- !props.everyItem && props.someItems,
46481
+ !_vm.allselectedState &&
46482
+ props.someItems,
46392
46483
  },
46393
46484
  on: {
46394
46485
  click: function ($event) {
46395
46486
  $event.stopPropagation();
46396
- on["toggle-select-all"](
46397
- !props.everyItem
46398
- );
46399
- _vm.selectAllClick(
46400
- !props.everyItem,
46487
+ return _vm.selectAllClick(
46488
+ !_vm.allselectedState,
46401
46489
  $event
46402
- );
46490
+ )
46403
46491
  },
46404
46492
  },
46405
46493
  })
@@ -47258,8 +47346,8 @@ If you're seeing "$attrs is readonly", it's caused by this`);
47258
47346
  /* style */
47259
47347
  const __vue_inject_styles__$W = function (inject) {
47260
47348
  if (!inject) return
47261
- inject("data-v-0bddbd88_0", { source: ".zd-grid {\n outline: none;\n}\n.zd-grid-flex {\n display: flex;\n flex-direction: column;\n}\n.zd-grid-flex .v-data-table__wrapper {\n flex: 1;\n}\n.zd-grid.theme--light:active table th.zd-table-cell, .zd-grid.theme--light:focus table th.zd-table-cell, .zd-grid.theme--light:focus-within table th.zd-table-cell {\n color: var(--v-primary-base) !important;\n}\n.zd-grid-toolbar {\n display: flex;\n justify-content: space-between;\n margin-bottom: var(--spacing-4);\n align-items: center;\n}\n.zd-grid-toolbar-slot {\n width: 100%;\n display: flex;\n align-items: center;\n}\n.zd-grid-search {\n max-width: 200px;\n}\n.zd-grid table .zd-table-cell {\n transition: height 0.1s ease;\n}\n.zd-grid table .zd-table-cell.selectable {\n width: 40px !important;\n padding-right: var(--spacing-2) !important;\n max-width: 40px !important;\n padding-bottom: 0 !important;\n}\n.zd-grid table .zd-table-cell.selectable > div.zd-grid-header-checkbox {\n margin-top: -2px;\n}\n.zd-grid table .zd-grid-header-checkbox, .zd-grid table .zd-grid-row-checkbox {\n margin-top: 0;\n padding-top: 0;\n}\n.zd-grid table .zd-grid-header-checkbox .v-icon, .zd-grid table .zd-grid-row-checkbox .v-icon {\n font-size: var(--icon-size-small);\n}\n.zd-grid table .zd-grid-header-checkbox .v-input--selection-controls__ripple::before, .zd-grid table .zd-grid-row-checkbox .v-input--selection-controls__ripple::before {\n display: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell {\n font-size: var(--zd-font-body2-size);\n font-weight: var(--zd-font-body2-weight);\n white-space: nowrap;\n height: 40px;\n padding: 0 var(--spacing-4) var(--spacing-2) var(--spacing-4);\n z-index: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-header-cell {\n width: 100%;\n display: flex;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-left .zd-table-header-cell {\n justify-content: flex-start;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-right .zd-table-header-cell {\n justify-content: flex-end;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort {\n opacity: 0;\n position: relative;\n display: inline-block;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-icon {\n position: relative;\n transition: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order {\n position: absolute;\n font-size: 9px;\n right: 2px;\n color: var(--zd-font-color);\n width: 12px;\n text-align: center;\n border-radius: 50%;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order.left {\n right: auto;\n left: 2px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name {\n opacity: 0.7;\n white-space: pre;\n display: inline-block;\n vertical-align: bottom;\n overflow: hidden;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.sortable {\n cursor: pointer;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: -8px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: 6px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: 3px;\n transform: rotate(180deg);\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: -1px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-name, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-name {\n opacity: 1;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-sort, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-sort {\n opacity: 1;\n}\n.zd-grid table thead tr th .zd-grid-resize-handle {\n height: 100%;\n width: 10px;\n display: block;\n position: absolute;\n top: 0;\n right: 0;\n cursor: ew-resize;\n font-size: 15px;\n color: #ccc;\n display: none;\n}\n.zd-grid table thead tr th:hover .zd-grid-resize-handle {\n display: block;\n}\n.zd-grid table tbody tr td.zd-table-cell {\n font-size: var(--zd-font-body1-size);\n font-weight: var(--zd-font-body1-weight);\n padding: 0 var(--spacing-4);\n height: 48px;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable {\n overflow: hidden;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 0.7;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text {\n display: block;\n overflow: hidden;\n white-space: pre;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table tbody tr:hover td.zd-table-cell.selectable .zd-grid-row-checkbox, .zd-grid table tbody tr.active td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 1;\n}\n.zd-grid table tbody tr.current {\n background: var(--current-row-color);\n}\n.zd-grid table tbody tr.current:hover {\n background: var(--current-row-hover-color) !important;\n}\n.zd-grid.v-data-table--dense table thead tr th.zd-table-cell {\n padding: 0 var(--spacing-2) var(--spacing-1) var(--spacing-2);\n height: 24px;\n}\n.zd-grid.v-data-table--dense table tbody tr td.zd-table-cell {\n padding: 0 var(--spacing-2);\n height: 29px;\n}\n.zd-grid.theme--light.v-data-table {\n background-color: transparent;\n}\n.zd-grid.theme--light table thead th.zd-table-cell {\n color: var(--zd-font-color) !important;\n}\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--indeterminate .v-icon,\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--is-label-active .v-icon {\n color: var(--v-primary-base);\n}\n.zd-grid.theme--light table tbody td.zd-table-cell {\n color: var(--zd-font-color);\n}\n.zd-grid.theme--light table tbody tr:not(:last-child) td:not(.v-data-table__mobile-row) {\n border-bottom: solid var(--regular) var(--v-grey-lighten5);\n}\n.zd-grid.theme--light.v-data-table--fixed-header table thead th.zd-table-cell {\n box-shadow: inset 0 -1px 0 var(--v-grey-lighten3);\n}\n.zd-grid-footer {\n margin: 24px 0 0 0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n}\n.zd-grid-div-footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n@media screen and (max-width: 425px) {\n.zd-grid-footer {\n flex-direction: column;\n justify-content: center;\n}\n.zd-grid-div-footer {\n width: 100%;\n}\n.zd-grid .zd-iterable-pagination {\n justify-content: space-evenly;\n}\n}\n.zd-grid .zd-skeleton-table-cell .v-skeleton-loader__table-cell {\n height: auto;\n}\n.zd-grid .zd-grid-cell-tooltip {\n z-index: 10000;\n position: fixed;\n color: white;\n background-color: var(--v-grey-lighten1);\n border-radius: var(--border);\n padding: var(--spacing-1) var(--spacing-2);\n opacity: 0.9;\n display: none;\n font-size: 14px;\n line-height: 22px;\n text-transform: none;\n width: auto;\n pointer-events: none;\n white-space: pre;\n}\n.zd-grid .zd-grid-cell-tooltip.zd-grid-cell-tooltip-show {\n display: block;\n white-space: normal;\n}\n.zd-grid-loading {\n pointer-events: none;\n}\n.v-data-table__progress {\n position: sticky;\n top: 24px;\n}\n.v-data-table--mobile > .v-data-table__wrapper tbody {\n display: contents;\n flex-direction: column;\n}", map: undefined, media: undefined })
47262
- ,inject("data-v-0bddbd88_1", { source: ".zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable.text-right .zd-table-cell-inline-edit, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable.text-right .zd-table-cell-inline-edit {\n justify-content: flex-end;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable.text-center .zd-table-cell-inline-edit, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable.text-center .zd-table-cell-inline-edit {\n justify-content: center;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-inline-edit, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-inline-edit {\n display: flex;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-inline-edit .zd-table-cell-edit-icon .v-icon, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-inline-edit .zd-table-cell-edit-icon .v-icon {\n display: flex;\n font-size: 18px;\n margin-right: var(--spacing-1);\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text {\n padding: 0 8px;\n position: relative;\n display: block;\n height: 20px;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:before, .zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:after, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:before, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:after {\n content: \"\";\n position: absolute;\n width: 1px;\n height: var(--spacing-1);\n bottom: 0px;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:before, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:before {\n left: 0;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:after, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:after {\n right: 0px;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable {\n cursor: pointer;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text.zd-table-cell-text-editable {\n border-bottom: solid var(--regular) var(--v-grey-lighten4);\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text.zd-table-cell-text-editable:before, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text.zd-table-cell-text-editable:after {\n border-left: solid var(--regular) var(--v-grey-lighten4);\n}\n.zd-grid.v-data-table--dense table tbody .zd-input.zd-text-input .v-input__slot {\n height: 22px;\n}\n.zd-grid.v-data-table--dense table tbody .zd-input.zd-text-input .v-input__slot input, .zd-grid.v-data-table--dense table tbody .zd-input.zd-text-input .v-input__slot .v-select__selections {\n height: 22px;\n max-height: 22px;\n}", map: undefined, media: undefined });
47349
+ inject("data-v-a2a78194_0", { source: ".zd-grid {\n outline: none;\n}\n.zd-grid-flex {\n display: flex;\n flex-direction: column;\n}\n.zd-grid-flex .v-data-table__wrapper {\n flex: 1;\n}\n.zd-grid.theme--light:active table th.zd-table-cell, .zd-grid.theme--light:focus table th.zd-table-cell, .zd-grid.theme--light:focus-within table th.zd-table-cell {\n color: var(--v-primary-base) !important;\n}\n.zd-grid-toolbar {\n display: flex;\n justify-content: space-between;\n margin-bottom: var(--spacing-4);\n align-items: center;\n}\n.zd-grid-toolbar-slot {\n width: 100%;\n display: flex;\n align-items: center;\n}\n.zd-grid-search {\n max-width: 200px;\n}\n.zd-grid table .zd-table-cell {\n transition: height 0.1s ease;\n}\n.zd-grid table .zd-table-cell.selectable {\n width: 40px !important;\n padding-right: var(--spacing-2) !important;\n max-width: 40px !important;\n padding-bottom: 0 !important;\n}\n.zd-grid table .zd-table-cell.selectable > div.zd-grid-header-checkbox {\n margin-top: -2px;\n}\n.zd-grid table .zd-grid-header-checkbox, .zd-grid table .zd-grid-row-checkbox {\n margin-top: 0;\n padding-top: 0;\n}\n.zd-grid table .zd-grid-header-checkbox .v-icon, .zd-grid table .zd-grid-row-checkbox .v-icon {\n font-size: var(--icon-size-small);\n}\n.zd-grid table .zd-grid-header-checkbox .v-input--selection-controls__ripple::before, .zd-grid table .zd-grid-row-checkbox .v-input--selection-controls__ripple::before {\n display: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell {\n font-size: var(--zd-font-body2-size);\n font-weight: var(--zd-font-body2-weight);\n white-space: nowrap;\n height: 40px;\n padding: 0 var(--spacing-4) var(--spacing-2) var(--spacing-4);\n z-index: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-header-cell {\n width: 100%;\n display: flex;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-left .zd-table-header-cell {\n justify-content: flex-start;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-right .zd-table-header-cell {\n justify-content: flex-end;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort {\n opacity: 0;\n position: relative;\n display: inline-block;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-icon {\n position: relative;\n transition: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order {\n position: absolute;\n font-size: 9px;\n right: 2px;\n color: var(--zd-font-color);\n width: 12px;\n text-align: center;\n border-radius: 50%;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order.left {\n right: auto;\n left: 2px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name {\n opacity: 0.7;\n white-space: pre;\n display: inline-block;\n vertical-align: bottom;\n overflow: hidden;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.sortable {\n cursor: pointer;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: -8px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: 6px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: 3px;\n transform: rotate(180deg);\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: -1px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-name, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-name {\n opacity: 1;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-sort, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-sort {\n opacity: 1;\n}\n.zd-grid table thead tr th .zd-grid-resize-handle {\n height: 100%;\n width: 10px;\n display: block;\n position: absolute;\n top: 0;\n right: 0;\n cursor: ew-resize;\n font-size: 15px;\n color: #ccc;\n display: none;\n}\n.zd-grid table thead tr th:hover .zd-grid-resize-handle {\n display: block;\n}\n.zd-grid table tbody tr td.zd-table-cell {\n font-size: var(--zd-font-body1-size);\n font-weight: var(--zd-font-body1-weight);\n padding: 0 var(--spacing-4);\n height: 48px;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable {\n overflow: hidden;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 0.7;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text {\n display: block;\n overflow: hidden;\n white-space: pre;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table tbody tr:hover td.zd-table-cell.selectable .zd-grid-row-checkbox, .zd-grid table tbody tr.active td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 1;\n}\n.zd-grid table tbody tr.current {\n background: var(--current-row-color);\n}\n.zd-grid table tbody tr.current:hover {\n background: var(--current-row-hover-color) !important;\n}\n.zd-grid.v-data-table--dense table thead tr th.zd-table-cell {\n padding: 0 var(--spacing-2) var(--spacing-1) var(--spacing-2);\n height: 24px;\n}\n.zd-grid.v-data-table--dense table tbody tr td.zd-table-cell {\n padding: 0 var(--spacing-2);\n height: 29px;\n}\n.zd-grid.theme--light.v-data-table {\n background-color: transparent;\n}\n.zd-grid.theme--light table thead th.zd-table-cell {\n color: var(--zd-font-color) !important;\n}\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--indeterminate .v-icon,\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--is-label-active .v-icon {\n color: var(--v-primary-base);\n}\n.zd-grid.theme--light table tbody td.zd-table-cell {\n color: var(--zd-font-color);\n}\n.zd-grid.theme--light table tbody tr:not(:last-child) td:not(.v-data-table__mobile-row) {\n border-bottom: solid var(--regular) var(--v-grey-lighten5);\n}\n.zd-grid.theme--light.v-data-table--fixed-header table thead th.zd-table-cell {\n box-shadow: inset 0 -1px 0 var(--v-grey-lighten3);\n}\n.zd-grid-footer {\n margin: 24px 0 0 0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n}\n.zd-grid-div-footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n@media screen and (max-width: 425px) {\n.zd-grid-footer {\n flex-direction: column;\n justify-content: center;\n}\n.zd-grid-div-footer {\n width: 100%;\n}\n.zd-grid .zd-iterable-pagination {\n justify-content: space-evenly;\n}\n}\n.zd-grid .zd-skeleton-table-cell .v-skeleton-loader__table-cell {\n height: auto;\n}\n.zd-grid .zd-grid-cell-tooltip {\n z-index: 10000;\n position: fixed;\n color: white;\n background-color: var(--v-grey-lighten1);\n border-radius: var(--border);\n padding: var(--spacing-1) var(--spacing-2);\n opacity: 0.9;\n display: none;\n font-size: 14px;\n line-height: 22px;\n text-transform: none;\n width: auto;\n pointer-events: none;\n white-space: pre;\n}\n.zd-grid .zd-grid-cell-tooltip.zd-grid-cell-tooltip-show {\n display: block;\n white-space: normal;\n}\n.zd-grid-loading {\n pointer-events: none;\n}\n.v-data-table__progress {\n position: sticky;\n top: 24px;\n}\n.v-data-table--mobile > .v-data-table__wrapper tbody {\n display: contents;\n flex-direction: column;\n}", map: undefined, media: undefined })
47350
+ ,inject("data-v-a2a78194_1", { source: ".zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable.text-right .zd-table-cell-inline-edit, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable.text-right .zd-table-cell-inline-edit {\n justify-content: flex-end;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable.text-center .zd-table-cell-inline-edit, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable.text-center .zd-table-cell-inline-edit {\n justify-content: center;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-inline-edit, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-inline-edit {\n display: flex;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-inline-edit .zd-table-cell-edit-icon .v-icon, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-inline-edit .zd-table-cell-edit-icon .v-icon {\n display: flex;\n font-size: 18px;\n margin-right: var(--spacing-1);\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text {\n padding: 0 8px;\n position: relative;\n display: block;\n height: 20px;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:before, .zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:after, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:before, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:after {\n content: \"\";\n position: absolute;\n width: 1px;\n height: var(--spacing-1);\n bottom: 0px;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:before, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:before {\n left: 0;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:after, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:after {\n right: 0px;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable {\n cursor: pointer;\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text.zd-table-cell-text-editable {\n border-bottom: solid var(--regular) var(--v-grey-lighten4);\n}\n.zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text.zd-table-cell-text-editable:before, .zd-grid table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text.zd-table-cell-text-editable:after {\n border-left: solid var(--regular) var(--v-grey-lighten4);\n}\n.zd-grid.v-data-table--dense table tbody .zd-input.zd-text-input .v-input__slot {\n height: 22px;\n}\n.zd-grid.v-data-table--dense table tbody .zd-input.zd-text-input .v-input__slot input, .zd-grid.v-data-table--dense table tbody .zd-input.zd-text-input .v-input__slot .v-select__selections {\n height: 22px;\n max-height: 22px;\n}", map: undefined, media: undefined });
47263
47351
 
47264
47352
  };
47265
47353
  /* scoped */
@@ -48781,11 +48869,11 @@ If you're seeing "$attrs is readonly", it's caused by this`);
48781
48869
  /* style */
48782
48870
  const __vue_inject_styles__$N = function (inject) {
48783
48871
  if (!inject) return
48784
- inject("data-v-770adb91_0", { source: ".zd-iterable-component-render[data-v-770adb91] {\n width: 100%;\n display: flex;\n flex-wrap: wrap;\n -webkit-box-flex: 1;\n flex: 1 1 auto;\n}\n.zd-iterable-component-render .error--text[data-v-770adb91],\n.zd-iterable-component-render .no--data[data-v-770adb91] {\n text-align: center;\n width: 100%;\n font-size: 14px;\n}\n.zd-iterable-component-render .no--data[data-v-770adb91] {\n color: rgba(0, 0, 0, 0.38);\n}\n.zd-iterable-component-render .zd-iterable-toolbar[data-v-770adb91] {\n display: flex;\n justify-content: space-between;\n margin-bottom: 16px;\n align-items: center;\n width: 100%;\n}\n.zd-iterable-component-render .zd-iterable-footer[data-v-770adb91] {\n padding: 5px 0;\n display: flex;\n width: 100%;\n}", map: undefined, media: undefined });
48872
+ inject("data-v-425f0852_0", { source: ".zd-iterable-component-render[data-v-425f0852] {\n width: 100%;\n display: flex;\n flex-wrap: wrap;\n -webkit-box-flex: 1;\n flex: 1 1 auto;\n}\n.zd-iterable-component-render .error--text[data-v-425f0852],\n.zd-iterable-component-render .no--data[data-v-425f0852] {\n text-align: center;\n width: 100%;\n font-size: 14px;\n}\n.zd-iterable-component-render .no--data[data-v-425f0852] {\n color: rgba(0, 0, 0, 0.38);\n}\n.zd-iterable-component-render .zd-iterable-toolbar[data-v-425f0852] {\n display: flex;\n justify-content: space-between;\n margin-bottom: 16px;\n align-items: center;\n width: 100%;\n}\n.zd-iterable-component-render .zd-iterable-footer[data-v-425f0852] {\n padding: 5px 0;\n display: flex;\n width: 100%;\n}", map: undefined, media: undefined });
48785
48873
 
48786
48874
  };
48787
48875
  /* scoped */
48788
- const __vue_scope_id__$N = "data-v-770adb91";
48876
+ const __vue_scope_id__$N = "data-v-425f0852";
48789
48877
  /* module identifier */
48790
48878
  const __vue_module_identifier__$N = undefined;
48791
48879
  /* functional template */
@@ -50741,6 +50829,10 @@ If you're seeing "$attrs is readonly", it's caused by this`);
50741
50829
  PropWatch({ type: String, default: '' }),
50742
50830
  __metadata("design:type", String)
50743
50831
  ], ZdLogin.prototype, "poweredByImageCard", void 0);
50832
+ __decorate([
50833
+ PropWatch({ type: [Boolean, String], default: false }),
50834
+ __metadata("design:type", Boolean)
50835
+ ], ZdLogin.prototype, "flatForm", void 0);
50744
50836
  __decorate([
50745
50837
  vuePropertyDecorator.Prop({ type: Array, default: () => [] }),
50746
50838
  __metadata("design:type", Array)
@@ -50783,13 +50875,25 @@ If you're seeing "$attrs is readonly", it's caused by this`);
50783
50875
  "position-" + _vm.instance.layout,
50784
50876
  "zd-login-content",
50785
50877
  ],
50786
- style: "background: " + _vm.instance.backgroundStyle + ";",
50878
+ style: {
50879
+ background:
50880
+ !_vm.instance.flatForm || _vm.instance.layout === "center"
50881
+ ? _vm.instance.backgroundStyle
50882
+ : "",
50883
+ "flex-direction":
50884
+ _vm.instance.flatForm && _vm.instance.layout === "right"
50885
+ ? "row-reverse"
50886
+ : "row",
50887
+ },
50787
50888
  },
50788
50889
  [
50789
50890
  _c(
50790
50891
  "v-card",
50791
50892
  {
50792
- staticClass: "zd-login-card",
50893
+ class: [
50894
+ "zd-login-card",
50895
+ _vm.instance.flatForm ? "zd-login-flat-card" : "",
50896
+ ],
50793
50897
  attrs: {
50794
50898
  width: _vm.instance.cardWidth,
50795
50899
  dark: _vm.instance.dark,
@@ -50818,7 +50922,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
50818
50922
  {
50819
50923
  key: index,
50820
50924
  tag: "component",
50821
- staticClass: "zd-login-card-content",
50925
+ class: ["zd-login-card-content"],
50822
50926
  attrs: { parent: _vm.instance },
50823
50927
  },
50824
50928
  "component",
@@ -50894,6 +50998,20 @@ If you're seeing "$attrs is readonly", it's caused by this`);
50894
50998
  attrs: { src: _vm.instance.poweredByImage },
50895
50999
  })
50896
51000
  : _vm._e(),
51001
+ _vm._v(" "),
51002
+ _vm.instance.backgroundStyle &&
51003
+ _vm.instance.flatForm &&
51004
+ _vm.instance.layout !== "center"
51005
+ ? _c("div", {
51006
+ class: ["background-div"],
51007
+ style: [
51008
+ {
51009
+ width: "calc(100% - " + _vm.instance.cardWidth + ")",
51010
+ background: _vm.instance.backgroundStyle,
51011
+ },
51012
+ ],
51013
+ })
51014
+ : _vm._e(),
50897
51015
  ],
50898
51016
  1
50899
51017
  ),
@@ -50906,7 +51024,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
50906
51024
  /* style */
50907
51025
  const __vue_inject_styles__$C = function (inject) {
50908
51026
  if (!inject) return
50909
- inject("data-v-557ec43a_0", { source: ".zd-login {\n height: 100vh;\n}\n.zd-login .zd-login-content {\n height: 100%;\n background-size: cover !important;\n}\n@media screen and (max-width: 730px) {\n.zd-login div.zd-login-card {\n border-radius: unset;\n width: 100% !important;\n height: 90%;\n}\n.zd-login .flex {\n height: 100%;\n}\n}\n@media screen and (max-width: 960px) {\n.zd-login .zd-login-powered-by {\n display: none;\n}\n.zd-login .zd-login-powered-by-card {\n display: block;\n}\n}\n.zd-login .zd-login-button {\n width: 100%;\n}\n.zd-login .zd-login-powered-by-card-always-visible {\n display: block !important;\n}\n.zd-login .v-card {\n box-shadow: none;\n margin: 20px;\n}\n.zd-login .position-left {\n justify-content: flex-start;\n}\n.zd-login .position-left .zd-login-powered-by {\n position: absolute;\n bottom: 48px;\n right: 48px;\n}\n.zd-login .position-left .v-sheet {\n border-radius: 0px;\n}\n.zd-login .position-right {\n width: unset;\n justify-content: flex-end;\n}\n.zd-login .position-right .zd-login-powered-by {\n position: absolute;\n bottom: 48px;\n left: 48px;\n}\n.zd-login .position-right .v-sheet {\n border-radius: 0px;\n}\n.zd-login .position-center {\n justify-content: center;\n}\n.zd-login .position-center .zd-login-powered-by {\n position: absolute;\n bottom: 48px;\n left: 48px;\n}\n.zd-login .zd-login-powered-by-card {\n padding: 10px;\n display: none;\n margin-left: auto;\n margin-right: auto;\n}\n.zd-login-card {\n height: 90%;\n padding: 40px;\n background-color: #fff;\n}\n.zd-login-card .zd-login-message {\n font-size: var(--zd-font-headline-size);\n font-weight: var(--zd-font-headline-weight);\n color: var(--zd-font-default-color);\n line-height: 24px;\n margin-bottom: 20px;\n}\n.zd-login-card .zd-login-logo {\n margin-bottom: 20px;\n}\n.zd-login-card .zd-login-toolbar .v-card__title {\n padding: 0;\n align-items: center;\n display: flex;\n flex-wrap: wrap;\n}\n.zd-login-card .zd-login-card-actions {\n display: flex;\n justify-content: center;\n flex-wrap: wrap;\n margin-top: 20px;\n margin-bottom: 20px;\n}\n.zd-login-card .zd-login-sign-in {\n display: flex;\n align-items: center;\n justify-content: center;\n border-top: solid var(--regular) #f5f5f5;\n padding-top: 10px;\n text-align: center;\n font-size: var(--zd-font-body1-size);\n}\n.zd-login-card .zd-login-social-buttons {\n padding: 10px;\n}\n.zd-login-card .zd-login-social-buttons > img {\n border: solid var(--regular) #e0e0e0;\n border-radius: 50%;\n vertical-align: top;\n position: relative;\n cursor: pointer;\n align-items: center;\n align-content: center;\n}", map: undefined, media: undefined });
51027
+ inject("data-v-2045fd32_0", { source: ".zd-login {\n height: 100vh;\n}\n.zd-login .zd-login-content {\n height: 100%;\n background-size: cover !important;\n}\n.zd-login .zd-login-card {\n z-index: 1;\n}\n.zd-login .zd-login-flat-card {\n margin: 0px !important;\n height: 100%;\n border-radius: 0px !important;\n}\n.zd-login .zd-login-background-image {\n z-index: 0;\n}\n.zd-login .background-div {\n background-position-x: left !important;\n background-size: cover !important;\n height: 100%;\n}\n.zd-login .zd-login-powered-by {\n z-index: 1;\n}\n.zd-login .zd-login-powered-by-card {\n z-index: 1;\n}\n@media screen and (max-width: 730px) {\n.zd-login div.zd-login-card {\n border-radius: unset;\n width: 100% !important;\n height: 90%;\n}\n.zd-login .zd-login-flat-card {\n margin: 0px !important;\n height: 100% !important;\n border-radius: 0px !important;\n}\n.zd-login .flex {\n height: 100%;\n}\n.zd-login .background-div {\n position: absolute;\n}\n}\n@media screen and (max-width: 960px) {\n.zd-login .zd-login-powered-by {\n display: none;\n}\n.zd-login .zd-login-powered-by-card {\n display: block;\n}\n}\n.zd-login .zd-login-button {\n width: 100%;\n}\n.zd-login .zd-login-powered-by-card-always-visible {\n display: block !important;\n}\n.zd-login .v-card {\n box-shadow: none;\n margin: 20px;\n}\n.zd-login .position-left {\n justify-content: flex-start;\n}\n.zd-login .position-left .zd-login-powered-by {\n position: absolute;\n bottom: 48px;\n right: 48px;\n}\n.zd-login .position-left .v-sheet {\n border-radius: 0px;\n}\n.zd-login .position-left .zd-login-background-image {\n position: absolute;\n right: 0px;\n height: 100%;\n}\n.zd-login .position-right {\n width: unset;\n justify-content: flex-end;\n}\n.zd-login .position-right .zd-login-powered-by {\n position: absolute;\n bottom: 48px;\n left: 48px;\n}\n.zd-login .position-right .v-sheet {\n border-radius: 0px;\n}\n.zd-login .position-right .zd-login-background-image {\n position: absolute;\n left: 0px;\n height: 100%;\n}\n.zd-login .position-center {\n justify-content: center;\n}\n.zd-login .position-center .zd-login-powered-by {\n position: absolute;\n bottom: 48px;\n left: 48px;\n}\n.zd-login .position-center .backgroud-div {\n position: absolute !important;\n}\n.zd-login .position-center .zd-login-background-image {\n position: absolute;\n height: 100%;\n}\n.zd-login .zd-login-powered-by-card {\n padding: 10px;\n display: none;\n margin-left: auto;\n margin-right: auto;\n}\n.zd-login-card {\n height: 90%;\n padding: 40px;\n background-color: #fff;\n}\n.zd-login-card .zd-login-message {\n font-size: var(--zd-font-headline-size);\n font-weight: var(--zd-font-headline-weight);\n color: var(--zd-font-default-color);\n line-height: 24px;\n margin-bottom: 20px;\n}\n.zd-login-card .zd-login-logo {\n margin-bottom: 20px;\n}\n.zd-login-card .zd-login-toolbar .v-card__title {\n padding: 0;\n align-items: center;\n display: flex;\n flex-wrap: wrap;\n}\n.zd-login-card .zd-login-card-actions {\n display: flex;\n justify-content: center;\n flex-wrap: wrap;\n margin-top: 20px;\n margin-bottom: 20px;\n}\n.zd-login-card .zd-login-sign-in {\n display: flex;\n align-items: center;\n justify-content: center;\n border-top: solid var(--regular) #f5f5f5;\n padding-top: 10px;\n text-align: center;\n font-size: var(--zd-font-body1-size);\n}\n.zd-login-card .zd-login-social-buttons {\n padding: 10px;\n}\n.zd-login-card .zd-login-social-buttons > img {\n border: solid var(--regular) #e0e0e0;\n border-radius: 50%;\n vertical-align: top;\n position: relative;\n cursor: pointer;\n align-items: center;\n align-content: center;\n}", map: undefined, media: undefined });
50910
51028
 
50911
51029
  };
50912
51030
  /* scoped */
@@ -56975,6 +57093,16 @@ If you're seeing "$attrs is readonly", it's caused by this`);
56975
57093
  super(...arguments);
56976
57094
  this.instanceType = common.Tooltip;
56977
57095
  }
57096
+ getActivator() {
57097
+ const { tooltip } = this.$refs;
57098
+ return (tooltip === null || tooltip === void 0 ? void 0 : tooltip.getActivator()) || null;
57099
+ }
57100
+ mounted() {
57101
+ const { tooltip } = this.$refs;
57102
+ if (tooltip) {
57103
+ tooltip.getActivator = (e) => getActivator(e, tooltip);
57104
+ }
57105
+ }
56978
57106
  };
56979
57107
  __decorate([
56980
57108
  PropWatch({ type: [Boolean, String], default: false }),
@@ -57041,6 +57169,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
57041
57169
  "v-tooltip",
57042
57170
  _vm._b(
57043
57171
  {
57172
+ ref: "tooltip",
57044
57173
  style: _vm.instance.cssStyle,
57045
57174
  attrs: { id: _vm.instance.name },
57046
57175
  scopedSlots: _vm._u(
@@ -57050,32 +57179,28 @@ If you're seeing "$attrs is readonly", it's caused by this`);
57050
57179
  fn: function (ref) {
57051
57180
  var dropdown = ref.on;
57052
57181
  return [
57053
- _c(
57054
- "div",
57055
- _vm._l(_vm.instance.children, function (child, index) {
57056
- return _c(
57057
- child.component,
57058
- _vm._b(
57059
- {
57060
- key: index,
57061
- tag: "component",
57062
- attrs: {
57063
- "dropdown-activator": Object.assign(
57064
- {},
57065
- _vm.$attrs["dropdown-activator"],
57066
- dropdown
57067
- ),
57068
- parent: _vm.instance.parent,
57069
- },
57182
+ _vm._l(_vm.instance.children, function (child, index) {
57183
+ return _c(
57184
+ child.component,
57185
+ _vm._b(
57186
+ {
57187
+ key: index,
57188
+ tag: "component",
57189
+ attrs: {
57190
+ "dropdown-activator": Object.assign(
57191
+ {},
57192
+ _vm.$attrs["dropdown-activator"],
57193
+ dropdown
57194
+ ),
57195
+ parent: _vm.instance.parent,
57070
57196
  },
57071
- "component",
57072
- child,
57073
- false
57074
- )
57197
+ },
57198
+ "component",
57199
+ child,
57200
+ false
57075
57201
  )
57076
- }),
57077
- 1
57078
- ),
57202
+ )
57203
+ }),
57079
57204
  _vm._v(" "),
57080
57205
  _vm._t("default"),
57081
57206
  ]
@@ -57114,7 +57239,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
57114
57239
  /* style */
57115
57240
  const __vue_inject_styles__$5 = function (inject) {
57116
57241
  if (!inject) return
57117
- inject("data-v-17e0820c_0", { source: ".v-tooltip__content {\n background-color: var(--v-grey-lighten1);\n border-radius: var(--border);\n padding: var(--spacing-1) var(--spacing-2);\n}\n.v-tooltip__content.menuable__content__active {\n opacity: 0.9 !important;\n}", map: undefined, media: undefined });
57242
+ inject("data-v-766faea4_0", { source: ".v-tooltip__content {\n background-color: var(--v-grey-lighten1);\n border-radius: var(--border);\n padding: var(--spacing-1) var(--spacing-2);\n}\n.v-tooltip__content.menuable__content__active {\n opacity: 0.9 !important;\n}", map: undefined, media: undefined });
57118
57243
 
57119
57244
  };
57120
57245
  /* scoped */
@@ -57364,6 +57489,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
57364
57489
  this.beforeNodeState = {};
57365
57490
  }
57366
57491
  mounted() {
57492
+ this.setHeight();
57367
57493
  this.instance.setTree(this.$refs.tree);
57368
57494
  this.setAfterTitleMargin();
57369
57495
  this.nodeChange();
@@ -57379,6 +57505,15 @@ If you're seeing "$attrs is readonly", it's caused by this`);
57379
57505
  onNodeDrop(nodes, position, event) {
57380
57506
  this.instance.nodeDrop(nodes, position, event, this.$el);
57381
57507
  }
57508
+ setHeight() {
57509
+ const { grid } = this.$refs;
57510
+ if (this.instance.height) {
57511
+ grid.$el.style.height = this.$formatSize(this.instance.height);
57512
+ }
57513
+ if (this.instance.maxHeight) {
57514
+ grid.$el.style.maxHeight = this.$formatSize(this.instance.maxHeight);
57515
+ }
57516
+ }
57382
57517
  onNodeSelect(nodes, event) {
57383
57518
  const prevSelectCount = Object.keys(this.beforeNodeState).length;
57384
57519
  this.beforeNodeState = {};
@@ -57505,6 +57640,14 @@ If you're seeing "$attrs is readonly", it's caused by this`);
57505
57640
  vuePropertyDecorator.Prop({ type: [Boolean, String], default: false }),
57506
57641
  __metadata("design:type", Boolean)
57507
57642
  ], ZdTree.prototype, "checkbox", void 0);
57643
+ __decorate([
57644
+ vuePropertyDecorator.Prop({ type: [Number, String], default: '' }),
57645
+ __metadata("design:type", Object)
57646
+ ], ZdTree.prototype, "maxHeight", void 0);
57647
+ __decorate([
57648
+ vuePropertyDecorator.Prop({ type: [Number, String], default: '' }),
57649
+ __metadata("design:type", Object)
57650
+ ], ZdTree.prototype, "height", void 0);
57508
57651
  __decorate([
57509
57652
  vuePropertyDecorator.Prop({ type: [String, Number, Boolean], default: false }),
57510
57653
  __metadata("design:type", Object)
@@ -57550,15 +57693,28 @@ If you're seeing "$attrs is readonly", it's caused by this`);
57550
57693
  "zd-tree",
57551
57694
  { "theme--dark": _vm.$isDark(this) },
57552
57695
  { "theme--light": _vm.$isLight(this) },
57696
+ { "zd-tree-flex": _vm.instance.height || _vm.instance.maxHeight },
57553
57697
  ],
57554
- style: [_vm.cssColorVars].concat(_vm.$styleObject(_vm.instance.cssStyle)),
57698
+ style: [_vm.cssColorVars].concat(
57699
+ _vm.$styleObject(_vm.instance.cssStyle),
57700
+ [
57701
+ _vm.instance.height
57702
+ ? { height: _vm.$formatSize(_vm.instance.height) }
57703
+ : {},
57704
+ ],
57705
+ [
57706
+ _vm.instance.maxHeight
57707
+ ? { height: _vm.$formatSize(_vm.instance.maxHeight) }
57708
+ : {},
57709
+ ]
57710
+ ),
57555
57711
  attrs: { id: _vm.instance.name },
57556
57712
  },
57557
57713
  [
57558
57714
  _vm.instance.toolbarSlot.length && !_vm.$slots.toolbarSlot
57559
57715
  ? _c(
57560
57716
  "div",
57561
- { staticClass: "zd-mb-4" },
57717
+ { staticClass: "zd-mb-4 zd-tree-toolbar" },
57562
57718
  [
57563
57719
  _vm._l(_vm.instance.toolbarSlot, function (child, index) {
57564
57720
  return _c(
@@ -57582,238 +57738,247 @@ If you're seeing "$attrs is readonly", it's caused by this`);
57582
57738
  )
57583
57739
  : _vm._e(),
57584
57740
  _vm._v(" "),
57585
- _c("sl-vue-tree", {
57586
- ref: "tree",
57587
- attrs: {
57588
- allowMultiselect: _vm.instance.allowMultiSelect,
57589
- dark: _vm.instance.dark,
57590
- light: _vm.instance.light,
57591
- },
57592
- on: {
57593
- drop: _vm.onNodeDrop,
57594
- select: _vm.onNodeSelect,
57595
- nodeclick: _vm.onNodeClick,
57596
- nodedblclick: _vm.onNodeDblClick,
57597
- },
57598
- scopedSlots: _vm._u(
57599
- [
57600
- {
57601
- key: "title",
57602
- fn: function (ref) {
57603
- var node = ref.node;
57604
- return [
57605
- _c("span", { staticClass: "align" }),
57606
- _vm._v(" "),
57607
- _vm.instance.checkbox
57608
- ? _c("zd-tree-checkbox", {
57609
- attrs: {
57610
- disabled: _vm.instance.callDisableCheckbox(node),
57611
- node: _vm.instanceNode(node),
57612
- checkedField: _vm.instance.checkedField,
57613
- },
57614
- on: {
57615
- click: function ($event) {
57616
- return _vm.nodeCheck(node, $event)
57617
- },
57618
- },
57619
- })
57620
- : _vm._e(),
57621
- _vm._v(" "),
57622
- _c(
57623
- "span",
57624
- { staticClass: "item-icon" },
57625
- [
57626
- node.isLeaf && _vm.instance.itemIconName
57627
- ? _c(
57628
- "v-icon",
57629
- {
57630
- attrs: {
57631
- dark: _vm.instance.dark,
57632
- light: _vm.instance.light,
57741
+ _c(
57742
+ "div",
57743
+ { staticClass: "zd-tree-container" },
57744
+ [
57745
+ _c("sl-vue-tree", {
57746
+ ref: "tree",
57747
+ attrs: {
57748
+ allowMultiselect: _vm.instance.allowMultiSelect,
57749
+ dark: _vm.instance.dark,
57750
+ light: _vm.instance.light,
57751
+ },
57752
+ on: {
57753
+ drop: _vm.onNodeDrop,
57754
+ select: _vm.onNodeSelect,
57755
+ nodeclick: _vm.onNodeClick,
57756
+ nodedblclick: _vm.onNodeDblClick,
57757
+ },
57758
+ scopedSlots: _vm._u(
57759
+ [
57760
+ {
57761
+ key: "title",
57762
+ fn: function (ref) {
57763
+ var node = ref.node;
57764
+ return [
57765
+ _c("span", { staticClass: "align" }),
57766
+ _vm._v(" "),
57767
+ _vm.instance.checkbox
57768
+ ? _c("zd-tree-checkbox", {
57769
+ attrs: {
57770
+ disabled: _vm.instance.callDisableCheckbox(node),
57771
+ node: _vm.instanceNode(node),
57772
+ checkedField: _vm.instance.checkedField,
57773
+ },
57774
+ on: {
57775
+ click: function ($event) {
57776
+ return _vm.nodeCheck(node, $event)
57633
57777
  },
57634
57778
  },
57635
- [
57636
- _vm._v(
57637
- "\n " +
57638
- _vm._s(
57639
- _vm.$getIcon(_vm.instance.itemIconName)
57640
- ) +
57641
- "\n "
57642
- ),
57643
- ]
57644
- )
57779
+ })
57645
57780
  : _vm._e(),
57646
57781
  _vm._v(" "),
57647
- !node.isLeaf && _vm.instance.groupIconName
57648
- ? _c("v-icon", [
57649
- _vm._v(
57650
- _vm._s(_vm.$getIcon(_vm.instance.groupIconName)) +
57651
- "\n "
57652
- ),
57653
- ])
57654
- : _vm._e(),
57655
- ],
57656
- 1
57657
- ),
57658
- _vm._v(" "),
57659
- !_vm.$slots.titleSlot
57660
- ? [
57661
- _vm.instance.titleSlot.length === 0
57662
- ? _c(
57663
- "span",
57664
- {
57665
- class: [
57666
- "item-title",
57667
- { "has-children": node.children.length },
57668
- ],
57669
- },
57670
- [
57782
+ _c(
57783
+ "span",
57784
+ { staticClass: "item-icon" },
57785
+ [
57786
+ node.isLeaf && _vm.instance.itemIconName
57787
+ ? _c(
57788
+ "v-icon",
57789
+ {
57790
+ attrs: {
57791
+ dark: _vm.instance.dark,
57792
+ light: _vm.instance.light,
57793
+ },
57794
+ },
57795
+ [
57796
+ _vm._v(
57797
+ "\n " +
57798
+ _vm._s(
57799
+ _vm.$getIcon(_vm.instance.itemIconName)
57800
+ ) +
57801
+ "\n "
57802
+ ),
57803
+ ]
57804
+ )
57805
+ : _vm._e(),
57806
+ _vm._v(" "),
57807
+ !node.isLeaf && _vm.instance.groupIconName
57808
+ ? _c("v-icon", [
57671
57809
  _vm._v(
57672
- "\n " +
57673
- _vm._s(node.title) +
57674
- "\n "
57675
- ),
57676
- ]
57677
- )
57678
- : _c(
57679
- "span",
57680
- { staticClass: "zd-display-inline-flex" },
57681
- _vm._l(
57682
- _vm.instance.getSlotComponent(
57683
- _vm.instance.titleSlot,
57684
- node
57810
+ _vm._s(
57811
+ _vm.$getIcon(_vm.instance.groupIconName)
57812
+ ) + "\n "
57685
57813
  ),
57686
- function (comp, index) {
57687
- return _c(
57688
- comp.component,
57689
- _vm._b(
57690
- {
57691
- key: index,
57692
- tag: "component",
57693
- class: [
57694
- "item-title",
57814
+ ])
57815
+ : _vm._e(),
57816
+ ],
57817
+ 1
57818
+ ),
57819
+ _vm._v(" "),
57820
+ !_vm.$slots.titleSlot
57821
+ ? [
57822
+ _vm.instance.titleSlot.length === 0
57823
+ ? _c(
57824
+ "span",
57825
+ {
57826
+ class: [
57827
+ "item-title",
57828
+ { "has-children": node.children.length },
57829
+ ],
57830
+ },
57831
+ [
57832
+ _vm._v(
57833
+ "\n " +
57834
+ _vm._s(node.title) +
57835
+ "\n "
57836
+ ),
57837
+ ]
57838
+ )
57839
+ : _c(
57840
+ "span",
57841
+ { staticClass: "zd-display-inline-flex" },
57842
+ _vm._l(
57843
+ _vm.instance.getSlotComponent(
57844
+ _vm.instance.titleSlot,
57845
+ node
57846
+ ),
57847
+ function (comp, index) {
57848
+ return _c(
57849
+ comp.component,
57850
+ _vm._b(
57695
57851
  {
57696
- "has-children":
57697
- node.children.length,
57852
+ key: index,
57853
+ tag: "component",
57854
+ class: [
57855
+ "item-title",
57856
+ {
57857
+ "has-children":
57858
+ node.children.length,
57859
+ },
57860
+ ],
57698
57861
  },
57699
- ],
57700
- },
57701
- "component",
57702
- comp,
57703
- false
57704
- )
57705
- )
57706
- }
57707
- ),
57708
- 1
57709
- ),
57710
- ]
57711
- : _vm._e(),
57712
- _vm._v(" "),
57713
- _vm._t("titleSlot", null, { node: node }),
57714
- _vm._v(" "),
57715
- _c(
57716
- "zd-tree-after-title",
57717
- {
57718
- ref: node.pathStr,
57719
- attrs: {
57720
- afterTitleSlot: _vm.instance.getSlotComponent(
57721
- _vm.instance.afterTitleSlot,
57722
- node
57723
- )[0],
57724
- },
57725
- on: {
57726
- "hook:mounted": function ($event) {
57727
- return _vm.addObserver(node)
57728
- },
57729
- },
57730
- },
57731
- [_vm._t("afterTitleSlot", null, { node: node })],
57732
- 2
57733
- ),
57734
- ]
57735
- },
57736
- },
57737
- {
57738
- key: "toggle",
57739
- fn: function (ref) {
57740
- var node = ref.node;
57741
- return [
57742
- _c(
57743
- "span",
57744
- [
57745
- node.children.length &&
57746
- node.isExpanded &&
57747
- _vm.instance.openedIconName
57748
- ? _c(
57749
- "v-icon",
57750
- {
57751
- attrs: {
57752
- dark: _vm.instance.dark,
57753
- light: _vm.instance.light,
57754
- },
57755
- },
57756
- [
57757
- _vm._v(
57758
- _vm._s(
57759
- _vm.$getIcon(_vm.instance.openedIconName)
57760
- ) + "\n "
57761
- ),
57762
- ]
57763
- )
57862
+ "component",
57863
+ comp,
57864
+ false
57865
+ )
57866
+ )
57867
+ }
57868
+ ),
57869
+ 1
57870
+ ),
57871
+ ]
57764
57872
  : _vm._e(),
57765
57873
  _vm._v(" "),
57766
- node.children.length &&
57767
- !node.isExpanded &&
57768
- _vm.instance.closedIconName
57769
- ? _c(
57770
- "v-icon",
57771
- {
57772
- attrs: {
57773
- dark: _vm.instance.dark,
57774
- light: _vm.instance.light,
57775
- },
57874
+ _vm._t("titleSlot", null, { node: node }),
57875
+ _vm._v(" "),
57876
+ _c(
57877
+ "zd-tree-after-title",
57878
+ {
57879
+ ref: node.pathStr,
57880
+ attrs: {
57881
+ afterTitleSlot: _vm.instance.getSlotComponent(
57882
+ _vm.instance.afterTitleSlot,
57883
+ node
57884
+ )[0],
57885
+ },
57886
+ on: {
57887
+ "hook:mounted": function ($event) {
57888
+ return _vm.addObserver(node)
57776
57889
  },
57777
- [
57778
- _vm._v(
57779
- _vm._s(
57780
- _vm.$getIcon(_vm.instance.closedIconName)
57781
- ) + "\n "
57782
- ),
57783
- ]
57784
- )
57785
- : _vm._e(),
57786
- ],
57787
- 1
57788
- ),
57789
- ]
57790
- },
57791
- },
57792
- {
57793
- key: "draginfo",
57794
- fn: function () {
57795
- return [
57796
- _vm._v(
57797
- "\n " + _vm._s(_vm.selectedNodesTitle) + "\n "
57798
- ),
57799
- ]
57890
+ },
57891
+ },
57892
+ [_vm._t("afterTitleSlot", null, { node: node })],
57893
+ 2
57894
+ ),
57895
+ ]
57896
+ },
57897
+ },
57898
+ {
57899
+ key: "toggle",
57900
+ fn: function (ref) {
57901
+ var node = ref.node;
57902
+ return [
57903
+ _c(
57904
+ "span",
57905
+ [
57906
+ node.children.length &&
57907
+ node.isExpanded &&
57908
+ _vm.instance.openedIconName
57909
+ ? _c(
57910
+ "v-icon",
57911
+ {
57912
+ attrs: {
57913
+ dark: _vm.instance.dark,
57914
+ light: _vm.instance.light,
57915
+ },
57916
+ },
57917
+ [
57918
+ _vm._v(
57919
+ _vm._s(
57920
+ _vm.$getIcon(_vm.instance.openedIconName)
57921
+ ) + "\n "
57922
+ ),
57923
+ ]
57924
+ )
57925
+ : _vm._e(),
57926
+ _vm._v(" "),
57927
+ node.children.length &&
57928
+ !node.isExpanded &&
57929
+ _vm.instance.closedIconName
57930
+ ? _c(
57931
+ "v-icon",
57932
+ {
57933
+ attrs: {
57934
+ dark: _vm.instance.dark,
57935
+ light: _vm.instance.light,
57936
+ },
57937
+ },
57938
+ [
57939
+ _vm._v(
57940
+ _vm._s(
57941
+ _vm.$getIcon(_vm.instance.closedIconName)
57942
+ ) + "\n "
57943
+ ),
57944
+ ]
57945
+ )
57946
+ : _vm._e(),
57947
+ ],
57948
+ 1
57949
+ ),
57950
+ ]
57951
+ },
57952
+ },
57953
+ {
57954
+ key: "draginfo",
57955
+ fn: function () {
57956
+ return [
57957
+ _vm._v(
57958
+ "\n " +
57959
+ _vm._s(_vm.selectedNodesTitle) +
57960
+ "\n "
57961
+ ),
57962
+ ]
57963
+ },
57964
+ proxy: true,
57965
+ },
57966
+ ],
57967
+ null,
57968
+ true
57969
+ ),
57970
+ model: {
57971
+ value: _vm.instance.nodes,
57972
+ callback: function ($$v) {
57973
+ _vm.$set(_vm.instance, "nodes", $$v);
57800
57974
  },
57801
- proxy: true,
57975
+ expression: "instance.nodes",
57802
57976
  },
57803
- ],
57804
- null,
57805
- true
57806
- ),
57807
- model: {
57808
- value: _vm.instance.nodes,
57809
- callback: function ($$v) {
57810
- _vm.$set(_vm.instance, "nodes", $$v);
57811
- },
57812
- expression: "instance.nodes",
57813
- },
57814
- }),
57815
- ],
57816
- 1
57977
+ }),
57978
+ ],
57979
+ 1
57980
+ ),
57981
+ ]
57817
57982
  )
57818
57983
  };
57819
57984
  var __vue_staticRenderFns__$2 = [];
@@ -57822,7 +57987,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
57822
57987
  /* style */
57823
57988
  const __vue_inject_styles__$2 = function (inject) {
57824
57989
  if (!inject) return
57825
- inject("data-v-6a21eeb4_0", { source: ".zd-tree {\n color: var(--zd-font-color);\n font-size: var(--zd-font-body1-size);\n font-weight: normal;\n}\n.zd-tree.theme--light .sl-vue-tree-title {\n color: var(--zd-font-color);\n}\n.zd-tree.theme--light .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-node-item:hover {\n background: #eee;\n}\n.zd-tree.theme--dark .sl-vue-tree-title {\n color: #fff;\n}\n.zd-tree.theme--dark .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-node-item:hover {\n background: #616161;\n}\n.zd-tree .sl-vue-tree-title {\n display: flex;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node {\n padding-top: 3px;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-node-item {\n height: 30px;\n line-height: 30px;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node.sl-vue-tree-selected > .sl-vue-tree-node-item {\n background-color: var(--current-row-color);\n color: var(--zd-font-color);\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node.sl-vue-tree-selected > .sl-vue-tree-node-item:hover {\n background: var(--current-row-hover-color) !important;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node.sl-vue-tree-selected > .sl-vue-tree-node-item .sl-vue-tree-toggle .v-icon {\n color: var(--zd-font-color);\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-toggle span .v-icon {\n margin: 0px 1px 0px 1px;\n padding-bottom: 1.4px;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-gap {\n width: 32px;\n}\n.zd-tree .sl-vue-tree-nodes-list .item-title.has-children {\n font-weight: 700;\n}\n.zd-tree .sl-vue-tree-node-item.sl-vue-tree-node-is-leaf .sl-vue-tree-title .align {\n padding-left: 26px;\n}\n.zd-tree .sl-vue-tree-node-item.sl-vue-tree-node-is-leaf .sl-vue-tree-title .align.is-clickable {\n cursor: pointer;\n}\n.zd-tree .sl-vue-tree-node-item.sl-vue-tree-node-is-leaf .sl-vue-tree-title .align.v-icon {\n padding-left: 4px;\n}\n.zd-tree .sl-vue-tree-node-item .zd-tree-checkbox {\n padding: 0px 3px 3px 0px;\n}", map: undefined, media: undefined });
57990
+ inject("data-v-61d810b1_0", { source: ".zd-tree {\n color: var(--zd-font-color);\n font-size: var(--zd-font-body1-size);\n font-weight: normal;\n}\n.zd-tree-toolbar {\n display: flex;\n}\n.zd-tree-flex {\n display: flex;\n flex-direction: column;\n}\n.zd-tree-container {\n overflow: auto;\n}\n.zd-tree.theme--light .sl-vue-tree-title {\n color: var(--zd-font-color);\n}\n.zd-tree.theme--light .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-node-item:hover {\n background: #eee;\n}\n.zd-tree.theme--dark .sl-vue-tree-title {\n color: #fff;\n}\n.zd-tree.theme--dark .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-node-item:hover {\n background: #616161;\n}\n.zd-tree .sl-vue-tree-title {\n display: flex;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node {\n padding-top: 3px;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-node-item {\n height: 30px;\n line-height: 30px;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node.sl-vue-tree-selected > .sl-vue-tree-node-item {\n background-color: var(--current-row-color);\n color: var(--zd-font-color);\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node.sl-vue-tree-selected > .sl-vue-tree-node-item:hover {\n background: var(--current-row-hover-color) !important;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node.sl-vue-tree-selected > .sl-vue-tree-node-item .sl-vue-tree-toggle .v-icon {\n color: var(--zd-font-color);\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-node .sl-vue-tree-toggle span .v-icon {\n margin: 0px 1px 0px 1px;\n padding-bottom: 1.4px;\n}\n.zd-tree .sl-vue-tree-nodes-list .sl-vue-tree-gap {\n width: 32px;\n}\n.zd-tree .sl-vue-tree-nodes-list .item-title.has-children {\n font-weight: 700;\n}\n.zd-tree .sl-vue-tree-node-item.sl-vue-tree-node-is-leaf .sl-vue-tree-title .align {\n padding-left: 26px;\n}\n.zd-tree .sl-vue-tree-node-item.sl-vue-tree-node-is-leaf .sl-vue-tree-title .align.is-clickable {\n cursor: pointer;\n}\n.zd-tree .sl-vue-tree-node-item.sl-vue-tree-node-is-leaf .sl-vue-tree-title .align.v-icon {\n padding-left: 4px;\n}\n.zd-tree .sl-vue-tree-node-item .zd-tree-checkbox {\n padding: 0px 3px 3px 0px;\n}", map: undefined, media: undefined });
57826
57991
 
57827
57992
  };
57828
57993
  /* scoped */
@@ -58025,7 +58190,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
58025
58190
  key: "header",
58026
58191
  fn: function (ref) {
58027
58192
  var props = ref.props;
58028
- var on = ref.on;
58193
+ ref.on;
58029
58194
  return [
58030
58195
  _c("thead", { staticClass: "zd-grid-table-header" }, [
58031
58196
  _c(
@@ -58052,20 +58217,18 @@ If you're seeing "$attrs is readonly", it's caused by this`);
58052
58217
  "indeterminate-icon": _vm.$getIcon(
58053
58218
  "checkboxIndeterminate"
58054
58219
  ),
58055
- "input-value": props.everyItem,
58220
+ "input-value": _vm.allselectedState,
58056
58221
  indeterminate:
58057
- !props.everyItem && props.someItems,
58222
+ !_vm.allselectedState &&
58223
+ props.someItems,
58058
58224
  },
58059
58225
  on: {
58060
58226
  click: function ($event) {
58061
58227
  $event.stopPropagation();
58062
- on["toggle-select-all"](
58063
- !props.everyItem
58064
- );
58065
- _vm.selectAllClick(
58066
- !props.everyItem,
58228
+ return _vm.selectAllClick(
58229
+ !_vm.allselectedState,
58067
58230
  $event
58068
- );
58231
+ )
58069
58232
  },
58070
58233
  },
58071
58234
  })
@@ -58885,8 +59048,8 @@ If you're seeing "$attrs is readonly", it's caused by this`);
58885
59048
  /* style */
58886
59049
  const __vue_inject_styles__$1 = function (inject) {
58887
59050
  if (!inject) return
58888
- inject("data-v-7d538442_0", { source: ".zd-grid {\n outline: none;\n}\n.zd-grid-flex {\n display: flex;\n flex-direction: column;\n}\n.zd-grid-flex .v-data-table__wrapper {\n flex: 1;\n}\n.zd-grid.theme--light:active table th.zd-table-cell, .zd-grid.theme--light:focus table th.zd-table-cell, .zd-grid.theme--light:focus-within table th.zd-table-cell {\n color: var(--v-primary-base) !important;\n}\n.zd-grid-toolbar {\n display: flex;\n justify-content: space-between;\n margin-bottom: var(--spacing-4);\n align-items: center;\n}\n.zd-grid-toolbar-slot {\n width: 100%;\n display: flex;\n align-items: center;\n}\n.zd-grid-search {\n max-width: 200px;\n}\n.zd-grid table .zd-table-cell {\n transition: height 0.1s ease;\n}\n.zd-grid table .zd-table-cell.selectable {\n width: 40px !important;\n padding-right: var(--spacing-2) !important;\n max-width: 40px !important;\n padding-bottom: 0 !important;\n}\n.zd-grid table .zd-table-cell.selectable > div.zd-grid-header-checkbox {\n margin-top: -2px;\n}\n.zd-grid table .zd-grid-header-checkbox, .zd-grid table .zd-grid-row-checkbox {\n margin-top: 0;\n padding-top: 0;\n}\n.zd-grid table .zd-grid-header-checkbox .v-icon, .zd-grid table .zd-grid-row-checkbox .v-icon {\n font-size: var(--icon-size-small);\n}\n.zd-grid table .zd-grid-header-checkbox .v-input--selection-controls__ripple::before, .zd-grid table .zd-grid-row-checkbox .v-input--selection-controls__ripple::before {\n display: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell {\n font-size: var(--zd-font-body2-size);\n font-weight: var(--zd-font-body2-weight);\n white-space: nowrap;\n height: 40px;\n padding: 0 var(--spacing-4) var(--spacing-2) var(--spacing-4);\n z-index: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-header-cell {\n width: 100%;\n display: flex;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-left .zd-table-header-cell {\n justify-content: flex-start;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-right .zd-table-header-cell {\n justify-content: flex-end;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort {\n opacity: 0;\n position: relative;\n display: inline-block;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-icon {\n position: relative;\n transition: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order {\n position: absolute;\n font-size: 9px;\n right: 2px;\n color: var(--zd-font-color);\n width: 12px;\n text-align: center;\n border-radius: 50%;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order.left {\n right: auto;\n left: 2px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name {\n opacity: 0.7;\n white-space: pre;\n display: inline-block;\n vertical-align: bottom;\n overflow: hidden;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.sortable {\n cursor: pointer;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: -8px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: 6px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: 3px;\n transform: rotate(180deg);\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: -1px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-name, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-name {\n opacity: 1;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-sort, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-sort {\n opacity: 1;\n}\n.zd-grid table thead tr th .zd-grid-resize-handle {\n height: 100%;\n width: 10px;\n display: block;\n position: absolute;\n top: 0;\n right: 0;\n cursor: ew-resize;\n font-size: 15px;\n color: #ccc;\n display: none;\n}\n.zd-grid table thead tr th:hover .zd-grid-resize-handle {\n display: block;\n}\n.zd-grid table tbody tr td.zd-table-cell {\n font-size: var(--zd-font-body1-size);\n font-weight: var(--zd-font-body1-weight);\n padding: 0 var(--spacing-4);\n height: 48px;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable {\n overflow: hidden;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 0.7;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text {\n display: block;\n overflow: hidden;\n white-space: pre;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table tbody tr:hover td.zd-table-cell.selectable .zd-grid-row-checkbox, .zd-grid table tbody tr.active td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 1;\n}\n.zd-grid table tbody tr.current {\n background: var(--current-row-color);\n}\n.zd-grid table tbody tr.current:hover {\n background: var(--current-row-hover-color) !important;\n}\n.zd-grid.v-data-table--dense table thead tr th.zd-table-cell {\n padding: 0 var(--spacing-2) var(--spacing-1) var(--spacing-2);\n height: 24px;\n}\n.zd-grid.v-data-table--dense table tbody tr td.zd-table-cell {\n padding: 0 var(--spacing-2);\n height: 29px;\n}\n.zd-grid.theme--light.v-data-table {\n background-color: transparent;\n}\n.zd-grid.theme--light table thead th.zd-table-cell {\n color: var(--zd-font-color) !important;\n}\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--indeterminate .v-icon,\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--is-label-active .v-icon {\n color: var(--v-primary-base);\n}\n.zd-grid.theme--light table tbody td.zd-table-cell {\n color: var(--zd-font-color);\n}\n.zd-grid.theme--light table tbody tr:not(:last-child) td:not(.v-data-table__mobile-row) {\n border-bottom: solid var(--regular) var(--v-grey-lighten5);\n}\n.zd-grid.theme--light.v-data-table--fixed-header table thead th.zd-table-cell {\n box-shadow: inset 0 -1px 0 var(--v-grey-lighten3);\n}\n.zd-grid-footer {\n margin: 24px 0 0 0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n}\n.zd-grid-div-footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n@media screen and (max-width: 425px) {\n.zd-grid-footer {\n flex-direction: column;\n justify-content: center;\n}\n.zd-grid-div-footer {\n width: 100%;\n}\n.zd-grid .zd-iterable-pagination {\n justify-content: space-evenly;\n}\n}\n.zd-grid .zd-skeleton-table-cell .v-skeleton-loader__table-cell {\n height: auto;\n}\n.zd-grid .zd-grid-cell-tooltip {\n z-index: 10000;\n position: fixed;\n color: white;\n background-color: var(--v-grey-lighten1);\n border-radius: var(--border);\n padding: var(--spacing-1) var(--spacing-2);\n opacity: 0.9;\n display: none;\n font-size: 14px;\n line-height: 22px;\n text-transform: none;\n width: auto;\n pointer-events: none;\n white-space: pre;\n}\n.zd-grid .zd-grid-cell-tooltip.zd-grid-cell-tooltip-show {\n display: block;\n white-space: normal;\n}\n.zd-grid-loading {\n pointer-events: none;\n}\n.v-data-table__progress {\n position: sticky;\n top: 24px;\n}\n.v-data-table--mobile > .v-data-table__wrapper tbody {\n display: contents;\n flex-direction: column;\n}", map: undefined, media: undefined })
58889
- ,inject("data-v-7d538442_1", { source: ".zd-tree-grid.theme--light tbody td.zd-table-cell {\n color: var(--zd-font-color);\n}\n.zd-tree-grid.theme--dark tbody td.zd-table-cell {\n color: #fff;\n}\n.zd-tree-grid tbody td.zd-table-cell.first {\n padding-left: 5px !important;\n}\n.zd-tree-grid tbody td.zd-table-cell .zd-table-cell-text .search-result {\n background: var(--v-grey-lighten4);\n}\n.zd-tree-grid .zd-tree-grid-expand {\n display: inline-block;\n text-align: end;\n vertical-align: baseline;\n height: 10px;\n}\n.zd-tree-grid .zd-tree-grid-expand .v-icon {\n transition: transform 0.3s ease;\n -webkit-transition: transform 0.3s ease;\n font-size: 20px;\n}\n.zd-tree-grid .zd-tree-grid-expand .v-icon::after {\n content: none;\n}\n.zd-tree-grid .zd-tree-grid-expand .v-icon.opened {\n transform: rotate(90deg);\n -webkit-transform: rotate(90deg);\n}\n.zd-tree-grid .zd-tree-grid-expand.level1 {\n width: 20px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level2 {\n width: 40px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level3 {\n width: 60px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level4 {\n width: 80px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level5 {\n width: 100px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level6 {\n width: 120px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level7 {\n width: 140px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level8 {\n width: 160px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level9 {\n width: 180px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level10 {\n width: 200px;\n}", map: undefined, media: undefined });
59051
+ inject("data-v-37f68802_0", { source: ".zd-grid {\n outline: none;\n}\n.zd-grid-flex {\n display: flex;\n flex-direction: column;\n}\n.zd-grid-flex .v-data-table__wrapper {\n flex: 1;\n}\n.zd-grid.theme--light:active table th.zd-table-cell, .zd-grid.theme--light:focus table th.zd-table-cell, .zd-grid.theme--light:focus-within table th.zd-table-cell {\n color: var(--v-primary-base) !important;\n}\n.zd-grid-toolbar {\n display: flex;\n justify-content: space-between;\n margin-bottom: var(--spacing-4);\n align-items: center;\n}\n.zd-grid-toolbar-slot {\n width: 100%;\n display: flex;\n align-items: center;\n}\n.zd-grid-search {\n max-width: 200px;\n}\n.zd-grid table .zd-table-cell {\n transition: height 0.1s ease;\n}\n.zd-grid table .zd-table-cell.selectable {\n width: 40px !important;\n padding-right: var(--spacing-2) !important;\n max-width: 40px !important;\n padding-bottom: 0 !important;\n}\n.zd-grid table .zd-table-cell.selectable > div.zd-grid-header-checkbox {\n margin-top: -2px;\n}\n.zd-grid table .zd-grid-header-checkbox, .zd-grid table .zd-grid-row-checkbox {\n margin-top: 0;\n padding-top: 0;\n}\n.zd-grid table .zd-grid-header-checkbox .v-icon, .zd-grid table .zd-grid-row-checkbox .v-icon {\n font-size: var(--icon-size-small);\n}\n.zd-grid table .zd-grid-header-checkbox .v-input--selection-controls__ripple::before, .zd-grid table .zd-grid-row-checkbox .v-input--selection-controls__ripple::before {\n display: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell {\n font-size: var(--zd-font-body2-size);\n font-weight: var(--zd-font-body2-weight);\n white-space: nowrap;\n height: 40px;\n padding: 0 var(--spacing-4) var(--spacing-2) var(--spacing-4);\n z-index: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-header-cell {\n width: 100%;\n display: flex;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-left .zd-table-header-cell {\n justify-content: flex-start;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-right .zd-table-header-cell {\n justify-content: flex-end;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort {\n opacity: 0;\n position: relative;\n display: inline-block;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-icon {\n position: relative;\n transition: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order {\n position: absolute;\n font-size: 9px;\n right: 2px;\n color: var(--zd-font-color);\n width: 12px;\n text-align: center;\n border-radius: 50%;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order.left {\n right: auto;\n left: 2px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name {\n opacity: 0.7;\n white-space: pre;\n display: inline-block;\n vertical-align: bottom;\n overflow: hidden;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.sortable {\n cursor: pointer;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: -8px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: 6px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: 3px;\n transform: rotate(180deg);\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: -1px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-name, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-name {\n opacity: 1;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-sort, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-sort {\n opacity: 1;\n}\n.zd-grid table thead tr th .zd-grid-resize-handle {\n height: 100%;\n width: 10px;\n display: block;\n position: absolute;\n top: 0;\n right: 0;\n cursor: ew-resize;\n font-size: 15px;\n color: #ccc;\n display: none;\n}\n.zd-grid table thead tr th:hover .zd-grid-resize-handle {\n display: block;\n}\n.zd-grid table tbody tr td.zd-table-cell {\n font-size: var(--zd-font-body1-size);\n font-weight: var(--zd-font-body1-weight);\n padding: 0 var(--spacing-4);\n height: 48px;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable {\n overflow: hidden;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 0.7;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text {\n display: block;\n overflow: hidden;\n white-space: pre;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table tbody tr:hover td.zd-table-cell.selectable .zd-grid-row-checkbox, .zd-grid table tbody tr.active td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 1;\n}\n.zd-grid table tbody tr.current {\n background: var(--current-row-color);\n}\n.zd-grid table tbody tr.current:hover {\n background: var(--current-row-hover-color) !important;\n}\n.zd-grid.v-data-table--dense table thead tr th.zd-table-cell {\n padding: 0 var(--spacing-2) var(--spacing-1) var(--spacing-2);\n height: 24px;\n}\n.zd-grid.v-data-table--dense table tbody tr td.zd-table-cell {\n padding: 0 var(--spacing-2);\n height: 29px;\n}\n.zd-grid.theme--light.v-data-table {\n background-color: transparent;\n}\n.zd-grid.theme--light table thead th.zd-table-cell {\n color: var(--zd-font-color) !important;\n}\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--indeterminate .v-icon,\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--is-label-active .v-icon {\n color: var(--v-primary-base);\n}\n.zd-grid.theme--light table tbody td.zd-table-cell {\n color: var(--zd-font-color);\n}\n.zd-grid.theme--light table tbody tr:not(:last-child) td:not(.v-data-table__mobile-row) {\n border-bottom: solid var(--regular) var(--v-grey-lighten5);\n}\n.zd-grid.theme--light.v-data-table--fixed-header table thead th.zd-table-cell {\n box-shadow: inset 0 -1px 0 var(--v-grey-lighten3);\n}\n.zd-grid-footer {\n margin: 24px 0 0 0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n}\n.zd-grid-div-footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n@media screen and (max-width: 425px) {\n.zd-grid-footer {\n flex-direction: column;\n justify-content: center;\n}\n.zd-grid-div-footer {\n width: 100%;\n}\n.zd-grid .zd-iterable-pagination {\n justify-content: space-evenly;\n}\n}\n.zd-grid .zd-skeleton-table-cell .v-skeleton-loader__table-cell {\n height: auto;\n}\n.zd-grid .zd-grid-cell-tooltip {\n z-index: 10000;\n position: fixed;\n color: white;\n background-color: var(--v-grey-lighten1);\n border-radius: var(--border);\n padding: var(--spacing-1) var(--spacing-2);\n opacity: 0.9;\n display: none;\n font-size: 14px;\n line-height: 22px;\n text-transform: none;\n width: auto;\n pointer-events: none;\n white-space: pre;\n}\n.zd-grid .zd-grid-cell-tooltip.zd-grid-cell-tooltip-show {\n display: block;\n white-space: normal;\n}\n.zd-grid-loading {\n pointer-events: none;\n}\n.v-data-table__progress {\n position: sticky;\n top: 24px;\n}\n.v-data-table--mobile > .v-data-table__wrapper tbody {\n display: contents;\n flex-direction: column;\n}", map: undefined, media: undefined })
59052
+ ,inject("data-v-37f68802_1", { source: ".zd-tree-grid.theme--light tbody td.zd-table-cell {\n color: var(--zd-font-color);\n}\n.zd-tree-grid.theme--dark tbody td.zd-table-cell {\n color: #fff;\n}\n.zd-tree-grid tbody td.zd-table-cell.first {\n padding-left: 5px !important;\n}\n.zd-tree-grid tbody td.zd-table-cell .zd-table-cell-text .search-result {\n background: var(--v-grey-lighten4);\n}\n.zd-tree-grid .zd-tree-grid-expand {\n display: inline-block;\n text-align: end;\n vertical-align: baseline;\n height: 10px;\n}\n.zd-tree-grid .zd-tree-grid-expand .v-icon {\n transition: transform 0.3s ease;\n -webkit-transition: transform 0.3s ease;\n font-size: 20px;\n}\n.zd-tree-grid .zd-tree-grid-expand .v-icon::after {\n content: none;\n}\n.zd-tree-grid .zd-tree-grid-expand .v-icon.opened {\n transform: rotate(90deg);\n -webkit-transform: rotate(90deg);\n}\n.zd-tree-grid .zd-tree-grid-expand.level1 {\n width: 20px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level2 {\n width: 40px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level3 {\n width: 60px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level4 {\n width: 80px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level5 {\n width: 100px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level6 {\n width: 120px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level7 {\n width: 140px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level8 {\n width: 160px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level9 {\n width: 180px;\n}\n.zd-tree-grid .zd-tree-grid-expand.level10 {\n width: 200px;\n}", map: undefined, media: undefined });
58890
59053
 
58891
59054
  };
58892
59055
  /* scoped */
@@ -58922,6 +59085,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
58922
59085
  super(...arguments);
58923
59086
  this.instanceType = common.TreeGridEditable;
58924
59087
  this.inputToFocus = '';
59088
+ this.isTrVisible = false;
58925
59089
  this.navigationKeyMapping = {
58926
59090
  enter: {
58927
59091
  event: this.navigateDown.bind(this),
@@ -58968,27 +59132,41 @@ If you're seeing "$attrs is readonly", it's caused by this`);
58968
59132
  this.$nextTick(() => { input.focus(); });
58969
59133
  }
58970
59134
  }
58971
- setColumnsWidth() {
58972
- this.columns.forEach((col) => {
58973
- const element = document.querySelector(`.column-th-${col.name}-${this.instance.name}`);
58974
- if (element) {
59135
+ getColWidth(col) {
59136
+ if (this.isTrVisible) {
59137
+ this.$nextTick(() => {
59138
+ const element = this.$el.querySelector(`.column-th-${col.name}-${this.instance.name}`);
59139
+ if (!element) {
59140
+ return;
59141
+ }
58975
59142
  if (col.width) {
58976
- element.style.width = this.calcWidth(col, col.width);
59143
+ element.style.width = this.calcWidth(col, col.width || '');
58977
59144
  }
58978
59145
  else if (col.maxWidth) {
58979
- element.style.width = this.calcWidth(col, col.maxWidth);
59146
+ element.style.width = this.calcWidth(col, col.maxWidth || '');
58980
59147
  }
58981
59148
  else if (col.minWidth) {
58982
- element.style.width = this.calcWidth(col, col.minWidth);
59149
+ element.style.width = this.calcWidth(col, col.minWidth || '');
58983
59150
  }
58984
59151
  else {
58985
59152
  element.style.width = `${element.clientWidth}px`;
58986
59153
  }
58987
- }
58988
- });
59154
+ });
59155
+ }
59156
+ return true;
59157
+ }
59158
+ registerOnVisible() {
59159
+ const headerRow = this.$el.querySelector('thead > tr');
59160
+ if (!headerRow)
59161
+ return;
59162
+ const obs = this.$onVisible(headerRow, () => {
59163
+ this.instance.columns.forEach(this.getColWidth);
59164
+ this.isTrVisible = true;
59165
+ obs.disconnect();
59166
+ }, this.$el);
58989
59167
  }
58990
59168
  mounted() {
58991
- this.setColumnsWidth();
59169
+ this.registerOnVisible();
58992
59170
  core.KeyMap.bind(this.navigationKeyMapping, this.instance, this.$el);
58993
59171
  }
58994
59172
  beforeDestroy() {
@@ -59155,7 +59333,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
59155
59333
  key: "header",
59156
59334
  fn: function (ref) {
59157
59335
  var props = ref.props;
59158
- var on = ref.on;
59336
+ ref.on;
59159
59337
  return [
59160
59338
  _c("thead", { staticClass: "zd-grid-table-header" }, [
59161
59339
  _c(
@@ -59182,18 +59360,17 @@ If you're seeing "$attrs is readonly", it's caused by this`);
59182
59360
  "indeterminate-icon": _vm.$getIcon(
59183
59361
  "checkboxIndeterminate"
59184
59362
  ),
59185
- value: props.everyItem,
59363
+ value: _vm.allselectedState,
59186
59364
  indeterminate:
59187
- !props.everyItem && props.someItems,
59365
+ !_vm.allselectedState && props.someItems,
59188
59366
  },
59189
59367
  on: {
59190
59368
  click: function ($event) {
59191
59369
  $event.stopPropagation();
59192
- on["toggle-select-all"](!props.everyItem);
59193
- _vm.selectAllClick(
59194
- !props.everyItem,
59370
+ return _vm.selectAllClick(
59371
+ !_vm.allselectedState,
59195
59372
  $event
59196
- );
59373
+ )
59197
59374
  },
59198
59375
  },
59199
59376
  }),
@@ -59204,7 +59381,7 @@ If you're seeing "$attrs is readonly", it's caused by this`);
59204
59381
  _vm._v(" "),
59205
59382
  _vm._l(props.headers, function (column, index) {
59206
59383
  return [
59207
- column.isVisible
59384
+ column.isVisible && _vm.getColWidth(column)
59208
59385
  ? _c(
59209
59386
  "th",
59210
59387
  {
@@ -59685,292 +59862,538 @@ If you're seeing "$attrs is readonly", it's caused by this`);
59685
59862
  })
59686
59863
  : _vm._e(),
59687
59864
  _vm._v(" "),
59688
- Object.assign({}, column, cellProps)
59689
- .editable &&
59690
- _vm.canEditRowValues[
59691
- _vm.rowKey(item)
59692
- ] &&
59693
- _vm.instance.editing
59694
- ? _c(
59695
- "span",
59696
- {
59697
- directives: [
59865
+ _c(
59866
+ "span",
59867
+ {
59868
+ staticClass:
59869
+ "zd-tree-grid-editable-cell-wrapper",
59870
+ },
59871
+ [
59872
+ Object.assign(
59873
+ {},
59874
+ column,
59875
+ cellProps
59876
+ ).editable &&
59877
+ _vm.canEditRowValues[
59878
+ _vm.rowKey(item)
59879
+ ] &&
59880
+ _vm.instance.editing
59881
+ ? _c(
59882
+ "span",
59698
59883
  {
59699
- name: "show",
59700
- rawName: "v-show",
59701
- value: !column.loading,
59702
- expression:
59703
- "!column.loading",
59884
+ directives: [
59885
+ {
59886
+ name: "show",
59887
+ rawName: "v-show",
59888
+ value:
59889
+ !column.loading,
59890
+ expression:
59891
+ "!column.loading",
59892
+ },
59893
+ ],
59894
+ staticClass:
59895
+ "zd-table-cell-inline-edit",
59896
+ style: {
59897
+ width:
59898
+ _vm.calcWidth(
59899
+ column,
59900
+ column.width,
59901
+ true
59902
+ ) || "unset",
59903
+ "min-width":
59904
+ _vm.calcWidth(
59905
+ column,
59906
+ column.minWidth,
59907
+ true
59908
+ ) || "unset",
59909
+ "max-width":
59910
+ _vm.calcWidth(
59911
+ column,
59912
+ column.maxWidth,
59913
+ true
59914
+ ) || "unset",
59915
+ },
59704
59916
  },
59705
- ],
59706
- staticClass:
59707
- "zd-table-cell-inline-edit",
59708
- style: {
59709
- width:
59710
- _vm.calcWidth(
59711
- column,
59712
- column.width,
59713
- true
59714
- ) || "unset",
59715
- "min-width":
59716
- _vm.calcWidth(
59717
- column,
59718
- column.minWidth,
59719
- true
59720
- ) || "unset",
59721
- "max-width":
59722
- _vm.calcWidth(
59917
+ [
59918
+ _vm.instance.isEdited(
59723
59919
  column,
59724
- column.maxWidth,
59725
- true
59726
- ) || "unset",
59727
- },
59728
- },
59729
- [
59730
- _vm.instance.isEdited(
59920
+ item
59921
+ )
59922
+ ? _c(
59923
+ "span",
59924
+ {
59925
+ staticClass:
59926
+ "zd-table-cell-edit-icon",
59927
+ },
59928
+ [
59929
+ _vm.instance.isValid(
59930
+ column,
59931
+ item
59932
+ )
59933
+ ? _c(
59934
+ "v-icon",
59935
+ {
59936
+ attrs: {
59937
+ color:
59938
+ "primary",
59939
+ },
59940
+ },
59941
+ [
59942
+ _vm._v(
59943
+ _vm._s(
59944
+ _vm.$getIcon(
59945
+ "pencil"
59946
+ )
59947
+ )
59948
+ ),
59949
+ ]
59950
+ )
59951
+ : _c(
59952
+ "v-icon",
59953
+ {
59954
+ attrs: {
59955
+ color:
59956
+ "error",
59957
+ },
59958
+ },
59959
+ [
59960
+ _vm._v(
59961
+ _vm._s(
59962
+ _vm.$getIcon(
59963
+ "warning"
59964
+ )
59965
+ )
59966
+ ),
59967
+ ]
59968
+ ),
59969
+ ],
59970
+ 1
59971
+ )
59972
+ : _vm._e(),
59973
+ _vm._v(" "),
59974
+ _c(
59975
+ column.componentProps
59976
+ .component,
59977
+ _vm._b(
59978
+ {
59979
+ key:
59980
+ column.name +
59981
+ _vm.rowKey(item),
59982
+ tag: "component",
59983
+ },
59984
+ "component",
59985
+ _vm.getEditableComponent(
59986
+ column,
59987
+ item,
59988
+ cellProps
59989
+ ),
59990
+ false
59991
+ )
59992
+ ),
59993
+ ],
59994
+ 1
59995
+ )
59996
+ : _vm.hasToggleIcon(
59731
59997
  column,
59732
59998
  item
59733
59999
  )
59734
- ? _c(
59735
- "span",
60000
+ ? _c(
60001
+ "span",
60002
+ [
60003
+ _c("v-icon", [
60004
+ _vm._v(
60005
+ _vm._s(
60006
+ _vm.$getIcon(
60007
+ column.formatterByRow(
60008
+ item,
60009
+ cellProps
60010
+ )
60011
+ )
60012
+ )
60013
+ ),
60014
+ ]),
60015
+ ],
60016
+ 1
60017
+ )
60018
+ : _c(
60019
+ "span",
60020
+ {
60021
+ directives: [
59736
60022
  {
59737
- staticClass:
59738
- "zd-table-cell-edit-icon",
60023
+ name: "show",
60024
+ rawName: "v-show",
60025
+ value:
60026
+ !column.loading,
60027
+ expression:
60028
+ "!column.loading",
59739
60029
  },
59740
- [
59741
- _vm.instance.isValid(
60030
+ ],
60031
+ class: [
60032
+ "zd-table-cell-text",
60033
+ {
60034
+ "zd-table-cell-text-editable":
60035
+ Object.assign(
60036
+ {},
60037
+ column,
60038
+ cellProps
60039
+ ).editable,
60040
+ "overflow-hidden":
60041
+ column.overflow ===
60042
+ "hidden",
60043
+ "overflow-wrap":
60044
+ column.overflow ===
60045
+ "wrap",
60046
+ },
60047
+ !isNaN(column.overflow)
60048
+ ? "overflow-clamp overflow-clamp-" +
60049
+ column.overflow
60050
+ : "",
60051
+ ],
60052
+ style: {
60053
+ width:
60054
+ _vm.calcWidth(
59742
60055
  column,
59743
- item
60056
+ column.width,
60057
+ true
60058
+ ) || "unset",
60059
+ "min-width":
60060
+ _vm.calcWidth(
60061
+ column,
60062
+ column.minWidth,
60063
+ true
60064
+ ) || "unset",
60065
+ "max-width":
60066
+ _vm.calcWidth(
60067
+ column,
60068
+ column.maxWidth,
60069
+ true
60070
+ ) || "unset",
60071
+ },
60072
+ on: {
60073
+ mouseenter: function (
60074
+ $event
60075
+ ) {
60076
+ return _vm.checkOverflow(
60077
+ $event
59744
60078
  )
60079
+ },
60080
+ mouseleave: function (
60081
+ $event
60082
+ ) {
60083
+ return _vm.removeTooltip()
60084
+ },
60085
+ },
60086
+ },
60087
+ [
60088
+ _c(
60089
+ "div",
60090
+ {
60091
+ directives: [
60092
+ {
60093
+ name: "show",
60094
+ rawName: "v-show",
60095
+ value:
60096
+ headerIndex ===
60097
+ 0,
60098
+ expression:
60099
+ "headerIndex === 0",
60100
+ },
60101
+ ],
60102
+ class: [
60103
+ "zd-tree-grid-editable-expand",
60104
+ "level" +
60105
+ item.tree__level,
60106
+ ],
60107
+ },
60108
+ [
60109
+ item.tree__children
60110
+ .length > 0
59745
60111
  ? _c(
59746
60112
  "v-icon",
59747
60113
  {
60114
+ class: {
60115
+ opened:
60116
+ item.tree__opened,
60117
+ },
59748
60118
  attrs: {
59749
- color:
59750
- "primary",
60119
+ tabindex:
60120
+ "-1",
60121
+ },
60122
+ on: {
60123
+ click:
60124
+ function (
60125
+ $event
60126
+ ) {
60127
+ $event.stopPropagation();
60128
+ return _vm.instance.toggleExpand(
60129
+ item,
60130
+ index
60131
+ )
60132
+ },
59751
60133
  },
59752
60134
  },
59753
60135
  [
59754
60136
  _vm._v(
59755
- _vm._s(
59756
- _vm.$getIcon(
59757
- "pencil"
59758
- )
59759
- )
60137
+ "\n " +
60138
+ _vm._s(
60139
+ _vm.$getIcon(
60140
+ "chevronRight"
60141
+ )
60142
+ ) +
60143
+ "\n "
59760
60144
  ),
59761
60145
  ]
59762
60146
  )
59763
- : _c(
59764
- "v-icon",
60147
+ : _vm._e(),
60148
+ ],
60149
+ 1
60150
+ ),
60151
+ _vm._v(" "),
60152
+ Object.assign(
60153
+ {},
60154
+ column,
60155
+ cellProps
60156
+ ).editable &&
60157
+ _vm.canEditRowValues[
60158
+ _vm.rowKey(item)
60159
+ ] &&
60160
+ _vm.instance.editing
60161
+ ? _c(
60162
+ "span",
60163
+ {
60164
+ directives: [
59765
60165
  {
59766
- attrs: {
59767
- color:
59768
- "error",
59769
- },
60166
+ name: "show",
60167
+ rawName:
60168
+ "v-show",
60169
+ value:
60170
+ !column.loading,
60171
+ expression:
60172
+ "!column.loading",
59770
60173
  },
59771
- [
59772
- _vm._v(
59773
- _vm._s(
59774
- _vm.$getIcon(
59775
- "warning"
60174
+ ],
60175
+ staticClass:
60176
+ "zd-table-cell-inline-edit",
60177
+ style: {
60178
+ width:
60179
+ _vm.calcWidth(
60180
+ column,
60181
+ column.maxWidth ||
60182
+ column.minWidth
60183
+ ) || "unset",
60184
+ "min-width":
60185
+ _vm.calcWidth(
60186
+ column,
60187
+ column.minWidth
60188
+ ) || "unset",
60189
+ "max-width":
60190
+ _vm.calcWidth(
60191
+ column,
60192
+ column.maxWidth
60193
+ ) || "unset",
60194
+ },
60195
+ },
60196
+ [
60197
+ _vm.instance.isEdited(
60198
+ column,
60199
+ item
60200
+ )
60201
+ ? _c(
60202
+ "span",
60203
+ {
60204
+ staticClass:
60205
+ "zd-table-cell-edit-icon",
60206
+ },
60207
+ [
60208
+ _vm.instance.isValid(
60209
+ column,
60210
+ item
59776
60211
  )
59777
- )
60212
+ ? _c(
60213
+ "v-icon",
60214
+ {
60215
+ attrs:
60216
+ {
60217
+ color:
60218
+ "primary",
60219
+ },
60220
+ },
60221
+ [
60222
+ _vm._v(
60223
+ _vm._s(
60224
+ _vm.$getIcon(
60225
+ "pencil"
60226
+ )
60227
+ )
60228
+ ),
60229
+ ]
60230
+ )
60231
+ : _c(
60232
+ "v-icon",
60233
+ {
60234
+ attrs:
60235
+ {
60236
+ color:
60237
+ "error",
60238
+ },
60239
+ },
60240
+ [
60241
+ _vm._v(
60242
+ _vm._s(
60243
+ _vm.$getIcon(
60244
+ "warning"
60245
+ )
60246
+ )
60247
+ ),
60248
+ ]
60249
+ ),
60250
+ ],
60251
+ 1
60252
+ )
60253
+ : _vm._e(),
60254
+ _vm._v(" "),
60255
+ _c(
60256
+ column
60257
+ .componentProps
60258
+ .component,
60259
+ _vm._b(
60260
+ {
60261
+ key:
60262
+ column.name +
60263
+ _vm.rowKey(
60264
+ item
60265
+ ),
60266
+ tag: "component",
60267
+ },
60268
+ "component",
60269
+ _vm.getEditableComponent(
60270
+ column,
60271
+ item,
60272
+ cellProps
59778
60273
  ),
59779
- ]
60274
+ false
60275
+ )
59780
60276
  ),
59781
- ],
59782
- 1
59783
- )
59784
- : _vm._e(),
59785
- _vm._v(" "),
59786
- _c(
59787
- column.componentProps
59788
- .component,
59789
- _vm._b(
59790
- {
59791
- key:
59792
- column.name +
59793
- _vm.rowKey(item),
59794
- tag: "component",
59795
- },
59796
- "component",
59797
- _vm.getEditableComponent(
59798
- column,
59799
- item,
59800
- cellProps
59801
- ),
59802
- false
59803
- )
59804
- ),
59805
- ],
59806
- 1
59807
- )
59808
- : _vm.hasToggleIcon(column, item)
59809
- ? _c(
59810
- "span",
59811
- [
59812
- _c("v-icon", [
59813
- _vm._v(
59814
- _vm._s(
59815
- _vm.$getIcon(
59816
- column.formatterByRow(
59817
- item,
59818
- cellProps
60277
+ ],
60278
+ 1
60279
+ )
60280
+ : _vm.hasToggleIcon(
60281
+ column,
60282
+ item
59819
60283
  )
59820
- )
59821
- )
59822
- ),
59823
- ]),
59824
- ],
59825
- 1
59826
- )
59827
- : _c(
59828
- "span",
59829
- {
59830
- directives: [
59831
- {
59832
- name: "show",
59833
- rawName: "v-show",
59834
- value: !column.loading,
59835
- expression:
59836
- "!column.loading",
59837
- },
59838
- ],
59839
- class: [
59840
- "zd-table-cell-text",
59841
- {
59842
- "zd-table-cell-text-editable":
59843
- Object.assign(
59844
- {},
59845
- column,
59846
- cellProps
59847
- ).editable,
59848
- "overflow-hidden":
59849
- column.overflow ===
59850
- "hidden",
59851
- "overflow-wrap":
59852
- column.overflow ===
59853
- "wrap",
59854
- },
59855
- !isNaN(column.overflow)
59856
- ? "overflow-clamp overflow-clamp-" +
59857
- column.overflow
59858
- : "",
59859
- ],
59860
- style: {
59861
- width:
59862
- _vm.calcWidth(
59863
- column,
59864
- column.width,
59865
- true
59866
- ) || "unset",
59867
- "min-width":
59868
- _vm.calcWidth(
59869
- column,
59870
- column.minWidth,
59871
- true
59872
- ) || "unset",
59873
- "max-width":
59874
- _vm.calcWidth(
59875
- column,
59876
- column.maxWidth,
59877
- true
59878
- ) || "unset",
59879
- },
59880
- on: {
59881
- mouseenter: function (
59882
- $event
59883
- ) {
59884
- return _vm.checkOverflow(
59885
- $event
59886
- )
59887
- },
59888
- mouseleave: function (
59889
- $event
59890
- ) {
59891
- return _vm.removeTooltip()
59892
- },
59893
- },
59894
- },
59895
- [
59896
- _c(
59897
- "div",
59898
- {
59899
- directives: [
59900
- {
59901
- name: "show",
59902
- rawName: "v-show",
59903
- value:
59904
- headerIndex === 0,
59905
- expression:
59906
- "headerIndex === 0",
59907
- },
59908
- ],
59909
- class: [
59910
- "zd-tree-grid-editable-expand",
59911
- "level" +
59912
- item.tree__level,
59913
- ],
59914
- },
59915
- [
59916
- item.tree__children
59917
- .length > 0
59918
60284
  ? _c(
59919
- "v-icon",
60285
+ "span",
60286
+ [
60287
+ _c("v-icon", [
60288
+ _vm._v(
60289
+ _vm._s(
60290
+ _vm.$getIcon(
60291
+ column.formatterByRow(
60292
+ item,
60293
+ cellProps
60294
+ )
60295
+ )
60296
+ )
60297
+ ),
60298
+ ]),
60299
+ ],
60300
+ 1
60301
+ )
60302
+ : _c(
60303
+ "span",
59920
60304
  {
59921
- class: {
59922
- opened:
59923
- item.tree__opened,
59924
- },
59925
- attrs: {
59926
- tabindex: "-1",
60305
+ directives: [
60306
+ {
60307
+ name: "show",
60308
+ rawName:
60309
+ "v-show",
60310
+ value:
60311
+ !column.loading,
60312
+ expression:
60313
+ "!column.loading",
60314
+ },
60315
+ ],
60316
+ class: [
60317
+ "zd-table-cell-text",
60318
+ {
60319
+ "zd-table-cell-text-editable":
60320
+ Object.assign(
60321
+ {},
60322
+ column,
60323
+ cellProps
60324
+ ).editable,
60325
+ "overflow-hidden":
60326
+ column.overflow ===
60327
+ "hidden",
60328
+ "overflow-wrap":
60329
+ column.overflow ===
60330
+ "wrap",
60331
+ },
60332
+ !isNaN(
60333
+ column.overflow
60334
+ )
60335
+ ? "overflow-clamp overflow-clamp-" +
60336
+ column.overflow
60337
+ : "",
60338
+ ],
60339
+ style: {
60340
+ width:
60341
+ _vm.calcWidth(
60342
+ column,
60343
+ column.maxWidth ||
60344
+ column.minWidth
60345
+ ) || "unset",
60346
+ "min-width":
60347
+ _vm.calcWidth(
60348
+ column,
60349
+ column.minWidth
60350
+ ) || "unset",
60351
+ "max-width":
60352
+ _vm.calcWidth(
60353
+ column,
60354
+ column.maxWidth
60355
+ ) || "unset",
59927
60356
  },
59928
60357
  on: {
59929
- click:
60358
+ mouseenter:
59930
60359
  function (
59931
60360
  $event
59932
60361
  ) {
59933
- return _vm.instance.toggleExpand(
59934
- item,
59935
- index
60362
+ return _vm.checkOverflow(
60363
+ $event
59936
60364
  )
59937
60365
  },
60366
+ mouseleave:
60367
+ function (
60368
+ $event
60369
+ ) {
60370
+ return _vm.removeTooltip()
60371
+ },
59938
60372
  },
59939
60373
  },
59940
60374
  [
59941
- _vm._v(
59942
- "\n " +
59943
- _vm._s(
59944
- _vm.$getIcon(
59945
- "chevronRight"
59946
- )
59947
- ) +
59948
- "\n "
59949
- ),
60375
+ _c("span", {
60376
+ key: item.tree__searched
60377
+ ? "a"
60378
+ : "b",
60379
+ domProps: {
60380
+ innerHTML:
60381
+ _vm._s(
60382
+ _vm.formatSearchResult(
60383
+ column.formatterByRow(
60384
+ item,
60385
+ cellProps
60386
+ )
60387
+ )
60388
+ ),
60389
+ },
60390
+ }),
59950
60391
  ]
59951
- )
59952
- : _vm._e(),
59953
- ],
59954
- 1
60392
+ ),
60393
+ ]
59955
60394
  ),
59956
- _vm._v(" "),
59957
- _c("span", {
59958
- key: item.tree__searched
59959
- ? "a"
59960
- : "b",
59961
- domProps: {
59962
- innerHTML: _vm._s(
59963
- _vm.formatSearchResult(
59964
- column.formatterByRow(
59965
- item,
59966
- cellProps
59967
- )
59968
- )
59969
- ),
59970
- },
59971
- }),
59972
- ]
59973
- ),
60395
+ ]
60396
+ ),
59974
60397
  ],
59975
60398
  1
59976
60399
  ),
@@ -60193,8 +60616,8 @@ If you're seeing "$attrs is readonly", it's caused by this`);
60193
60616
  /* style */
60194
60617
  const __vue_inject_styles__ = function (inject) {
60195
60618
  if (!inject) return
60196
- inject("data-v-8a2baa58_0", { source: ".zd-grid {\n outline: none;\n}\n.zd-grid-flex {\n display: flex;\n flex-direction: column;\n}\n.zd-grid-flex .v-data-table__wrapper {\n flex: 1;\n}\n.zd-grid.theme--light:active table th.zd-table-cell, .zd-grid.theme--light:focus table th.zd-table-cell, .zd-grid.theme--light:focus-within table th.zd-table-cell {\n color: var(--v-primary-base) !important;\n}\n.zd-grid-toolbar {\n display: flex;\n justify-content: space-between;\n margin-bottom: var(--spacing-4);\n align-items: center;\n}\n.zd-grid-toolbar-slot {\n width: 100%;\n display: flex;\n align-items: center;\n}\n.zd-grid-search {\n max-width: 200px;\n}\n.zd-grid table .zd-table-cell {\n transition: height 0.1s ease;\n}\n.zd-grid table .zd-table-cell.selectable {\n width: 40px !important;\n padding-right: var(--spacing-2) !important;\n max-width: 40px !important;\n padding-bottom: 0 !important;\n}\n.zd-grid table .zd-table-cell.selectable > div.zd-grid-header-checkbox {\n margin-top: -2px;\n}\n.zd-grid table .zd-grid-header-checkbox, .zd-grid table .zd-grid-row-checkbox {\n margin-top: 0;\n padding-top: 0;\n}\n.zd-grid table .zd-grid-header-checkbox .v-icon, .zd-grid table .zd-grid-row-checkbox .v-icon {\n font-size: var(--icon-size-small);\n}\n.zd-grid table .zd-grid-header-checkbox .v-input--selection-controls__ripple::before, .zd-grid table .zd-grid-row-checkbox .v-input--selection-controls__ripple::before {\n display: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell {\n font-size: var(--zd-font-body2-size);\n font-weight: var(--zd-font-body2-weight);\n white-space: nowrap;\n height: 40px;\n padding: 0 var(--spacing-4) var(--spacing-2) var(--spacing-4);\n z-index: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-header-cell {\n width: 100%;\n display: flex;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-left .zd-table-header-cell {\n justify-content: flex-start;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-right .zd-table-header-cell {\n justify-content: flex-end;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort {\n opacity: 0;\n position: relative;\n display: inline-block;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-icon {\n position: relative;\n transition: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order {\n position: absolute;\n font-size: 9px;\n right: 2px;\n color: var(--zd-font-color);\n width: 12px;\n text-align: center;\n border-radius: 50%;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order.left {\n right: auto;\n left: 2px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name {\n opacity: 0.7;\n white-space: pre;\n display: inline-block;\n vertical-align: bottom;\n overflow: hidden;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.sortable {\n cursor: pointer;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: -8px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: 6px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: 3px;\n transform: rotate(180deg);\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: -1px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-name, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-name {\n opacity: 1;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-sort, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-sort {\n opacity: 1;\n}\n.zd-grid table thead tr th .zd-grid-resize-handle {\n height: 100%;\n width: 10px;\n display: block;\n position: absolute;\n top: 0;\n right: 0;\n cursor: ew-resize;\n font-size: 15px;\n color: #ccc;\n display: none;\n}\n.zd-grid table thead tr th:hover .zd-grid-resize-handle {\n display: block;\n}\n.zd-grid table tbody tr td.zd-table-cell {\n font-size: var(--zd-font-body1-size);\n font-weight: var(--zd-font-body1-weight);\n padding: 0 var(--spacing-4);\n height: 48px;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable {\n overflow: hidden;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 0.7;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text {\n display: block;\n overflow: hidden;\n white-space: pre;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table tbody tr:hover td.zd-table-cell.selectable .zd-grid-row-checkbox, .zd-grid table tbody tr.active td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 1;\n}\n.zd-grid table tbody tr.current {\n background: var(--current-row-color);\n}\n.zd-grid table tbody tr.current:hover {\n background: var(--current-row-hover-color) !important;\n}\n.zd-grid.v-data-table--dense table thead tr th.zd-table-cell {\n padding: 0 var(--spacing-2) var(--spacing-1) var(--spacing-2);\n height: 24px;\n}\n.zd-grid.v-data-table--dense table tbody tr td.zd-table-cell {\n padding: 0 var(--spacing-2);\n height: 29px;\n}\n.zd-grid.theme--light.v-data-table {\n background-color: transparent;\n}\n.zd-grid.theme--light table thead th.zd-table-cell {\n color: var(--zd-font-color) !important;\n}\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--indeterminate .v-icon,\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--is-label-active .v-icon {\n color: var(--v-primary-base);\n}\n.zd-grid.theme--light table tbody td.zd-table-cell {\n color: var(--zd-font-color);\n}\n.zd-grid.theme--light table tbody tr:not(:last-child) td:not(.v-data-table__mobile-row) {\n border-bottom: solid var(--regular) var(--v-grey-lighten5);\n}\n.zd-grid.theme--light.v-data-table--fixed-header table thead th.zd-table-cell {\n box-shadow: inset 0 -1px 0 var(--v-grey-lighten3);\n}\n.zd-grid-footer {\n margin: 24px 0 0 0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n}\n.zd-grid-div-footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n@media screen and (max-width: 425px) {\n.zd-grid-footer {\n flex-direction: column;\n justify-content: center;\n}\n.zd-grid-div-footer {\n width: 100%;\n}\n.zd-grid .zd-iterable-pagination {\n justify-content: space-evenly;\n}\n}\n.zd-grid .zd-skeleton-table-cell .v-skeleton-loader__table-cell {\n height: auto;\n}\n.zd-grid .zd-grid-cell-tooltip {\n z-index: 10000;\n position: fixed;\n color: white;\n background-color: var(--v-grey-lighten1);\n border-radius: var(--border);\n padding: var(--spacing-1) var(--spacing-2);\n opacity: 0.9;\n display: none;\n font-size: 14px;\n line-height: 22px;\n text-transform: none;\n width: auto;\n pointer-events: none;\n white-space: pre;\n}\n.zd-grid .zd-grid-cell-tooltip.zd-grid-cell-tooltip-show {\n display: block;\n white-space: normal;\n}\n.zd-grid-loading {\n pointer-events: none;\n}\n.v-data-table__progress {\n position: sticky;\n top: 24px;\n}\n.v-data-table--mobile > .v-data-table__wrapper tbody {\n display: contents;\n flex-direction: column;\n}", map: undefined, media: undefined })
60197
- ,inject("data-v-8a2baa58_1", { source: ".zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable.text-right .zd-table-cell-inline-edit, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable.text-right .zd-table-cell-inline-edit {\n justify-content: flex-end;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable.text-center .zd-table-cell-inline-edit, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable.text-center .zd-table-cell-inline-edit {\n justify-content: center;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-inline-edit, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-inline-edit {\n display: flex;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-inline-edit .zd-table-cell-edit-icon .v-icon, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-inline-edit .zd-table-cell-edit-icon .v-icon {\n display: flex;\n font-size: 18px;\n margin-right: var(--spacing-1);\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text {\n padding: 0 8px;\n position: relative;\n display: block;\n height: 20px;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:before, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:after, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:before, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:after {\n content: \"\";\n position: absolute;\n width: 1px;\n height: var(--spacing-1);\n bottom: 0px;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:before, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:before {\n left: 0;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:after, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:after {\n right: 0px;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable {\n cursor: pointer;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text.zd-table-cell-text-editable {\n border-bottom: solid var(--regular) var(--v-grey-lighten4);\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text.zd-table-cell-text-editable:before, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text.zd-table-cell-text-editable:after {\n border-left: solid var(--regular) var(--v-grey-lighten4);\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand {\n display: inline-block;\n text-align: end;\n vertical-align: baseline;\n height: 10px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand .v-icon {\n transition: transform 0.3s ease;\n -webkit-transition: transform 0.3s ease;\n font-size: 20px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand .v-icon::after {\n content: none;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand .v-icon.opened {\n transform: rotate(90deg);\n -webkit-transform: rotate(90deg);\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level1 {\n width: 20px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level2 {\n width: 40px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level3 {\n width: 60px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level4 {\n width: 80px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level5 {\n width: 100px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level6 {\n width: 120px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level7 {\n width: 140px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level8 {\n width: 160px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level9 {\n width: 180px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level10 {\n width: 200px;\n}\n.zd-tree-grid-editable.v-data-table--dense table tbody .zd-input.zd-text-input .v-input__slot {\n height: 22px;\n}\n.zd-tree-grid-editable.v-data-table--dense table tbody .zd-input.zd-text-input .v-input__slot input, .zd-tree-grid-editable.v-data-table--dense table tbody .zd-input.zd-text-input .v-input__slot .v-select__selections {\n height: 22px;\n max-height: 22px;\n}", map: undefined, media: undefined });
60619
+ inject("data-v-7871e6ca_0", { source: ".zd-grid {\n outline: none;\n}\n.zd-grid-flex {\n display: flex;\n flex-direction: column;\n}\n.zd-grid-flex .v-data-table__wrapper {\n flex: 1;\n}\n.zd-grid.theme--light:active table th.zd-table-cell, .zd-grid.theme--light:focus table th.zd-table-cell, .zd-grid.theme--light:focus-within table th.zd-table-cell {\n color: var(--v-primary-base) !important;\n}\n.zd-grid-toolbar {\n display: flex;\n justify-content: space-between;\n margin-bottom: var(--spacing-4);\n align-items: center;\n}\n.zd-grid-toolbar-slot {\n width: 100%;\n display: flex;\n align-items: center;\n}\n.zd-grid-search {\n max-width: 200px;\n}\n.zd-grid table .zd-table-cell {\n transition: height 0.1s ease;\n}\n.zd-grid table .zd-table-cell.selectable {\n width: 40px !important;\n padding-right: var(--spacing-2) !important;\n max-width: 40px !important;\n padding-bottom: 0 !important;\n}\n.zd-grid table .zd-table-cell.selectable > div.zd-grid-header-checkbox {\n margin-top: -2px;\n}\n.zd-grid table .zd-grid-header-checkbox, .zd-grid table .zd-grid-row-checkbox {\n margin-top: 0;\n padding-top: 0;\n}\n.zd-grid table .zd-grid-header-checkbox .v-icon, .zd-grid table .zd-grid-row-checkbox .v-icon {\n font-size: var(--icon-size-small);\n}\n.zd-grid table .zd-grid-header-checkbox .v-input--selection-controls__ripple::before, .zd-grid table .zd-grid-row-checkbox .v-input--selection-controls__ripple::before {\n display: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell {\n font-size: var(--zd-font-body2-size);\n font-weight: var(--zd-font-body2-weight);\n white-space: nowrap;\n height: 40px;\n padding: 0 var(--spacing-4) var(--spacing-2) var(--spacing-4);\n z-index: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-header-cell {\n width: 100%;\n display: flex;\n white-space: nowrap;\n text-overflow: ellipsis;\n overflow: hidden;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-left .zd-table-header-cell {\n justify-content: flex-start;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.text-right .zd-table-header-cell {\n justify-content: flex-end;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort {\n opacity: 0;\n position: relative;\n display: inline-block;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-icon {\n position: relative;\n transition: none;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order {\n position: absolute;\n font-size: 9px;\n right: 2px;\n color: var(--zd-font-color);\n width: 12px;\n text-align: center;\n border-radius: 50%;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-sort .zd-table-cell-sort-order.left {\n right: auto;\n left: 2px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name {\n opacity: 0.7;\n white-space: pre;\n display: inline-block;\n vertical-align: bottom;\n overflow: hidden;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell .zd-table-cell-name.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.sortable {\n cursor: pointer;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: -8px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.asc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: 6px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-icon {\n top: 3px;\n transform: rotate(180deg);\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell.active.desc .zd-table-cell-sort .zd-table-cell-sort-order {\n top: -1px;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-name, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-name {\n opacity: 1;\n}\n.zd-grid table .zd-grid-table-header th.zd-table-cell:hover .zd-table-cell-sort, .zd-grid table .zd-grid-table-header th.zd-table-cell.active .zd-table-cell-sort {\n opacity: 1;\n}\n.zd-grid table thead tr th .zd-grid-resize-handle {\n height: 100%;\n width: 10px;\n display: block;\n position: absolute;\n top: 0;\n right: 0;\n cursor: ew-resize;\n font-size: 15px;\n color: #ccc;\n display: none;\n}\n.zd-grid table thead tr th:hover .zd-grid-resize-handle {\n display: block;\n}\n.zd-grid table tbody tr td.zd-table-cell {\n font-size: var(--zd-font-body1-size);\n font-weight: var(--zd-font-body1-weight);\n padding: 0 var(--spacing-4);\n height: 48px;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable {\n overflow: hidden;\n}\n.zd-grid table tbody tr td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 0.7;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text {\n display: block;\n overflow: hidden;\n white-space: pre;\n text-overflow: ellipsis;\n overflow-wrap: break-word;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-hidden {\n text-overflow: unset;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-wrap {\n white-space: pre-wrap;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp {\n white-space: normal;\n -webkit-box-orient: vertical;\n display: -webkit-box;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-2 {\n -webkit-line-clamp: 2;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-3 {\n -webkit-line-clamp: 3;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-4 {\n -webkit-line-clamp: 4;\n}\n.zd-grid table tbody tr td.zd-table-cell .zd-table-cell-text.overflow-clamp.overflow-clamp-5 {\n -webkit-line-clamp: 5;\n}\n.zd-grid table tbody tr:hover td.zd-table-cell.selectable .zd-grid-row-checkbox, .zd-grid table tbody tr.active td.zd-table-cell.selectable .zd-grid-row-checkbox {\n opacity: 1;\n}\n.zd-grid table tbody tr.current {\n background: var(--current-row-color);\n}\n.zd-grid table tbody tr.current:hover {\n background: var(--current-row-hover-color) !important;\n}\n.zd-grid.v-data-table--dense table thead tr th.zd-table-cell {\n padding: 0 var(--spacing-2) var(--spacing-1) var(--spacing-2);\n height: 24px;\n}\n.zd-grid.v-data-table--dense table tbody tr td.zd-table-cell {\n padding: 0 var(--spacing-2);\n height: 29px;\n}\n.zd-grid.theme--light.v-data-table {\n background-color: transparent;\n}\n.zd-grid.theme--light table thead th.zd-table-cell {\n color: var(--zd-font-color) !important;\n}\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--indeterminate .v-icon,\n.zd-grid.theme--light table thead th.zd-table-cell.selectable .zd-grid-header-checkbox.v-input--is-label-active .v-icon {\n color: var(--v-primary-base);\n}\n.zd-grid.theme--light table tbody td.zd-table-cell {\n color: var(--zd-font-color);\n}\n.zd-grid.theme--light table tbody tr:not(:last-child) td:not(.v-data-table__mobile-row) {\n border-bottom: solid var(--regular) var(--v-grey-lighten5);\n}\n.zd-grid.theme--light.v-data-table--fixed-header table thead th.zd-table-cell {\n box-shadow: inset 0 -1px 0 var(--v-grey-lighten3);\n}\n.zd-grid-footer {\n margin: 24px 0 0 0;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 1rem;\n}\n.zd-grid-div-footer {\n display: flex;\n align-items: center;\n justify-content: space-between;\n}\n@media screen and (max-width: 425px) {\n.zd-grid-footer {\n flex-direction: column;\n justify-content: center;\n}\n.zd-grid-div-footer {\n width: 100%;\n}\n.zd-grid .zd-iterable-pagination {\n justify-content: space-evenly;\n}\n}\n.zd-grid .zd-skeleton-table-cell .v-skeleton-loader__table-cell {\n height: auto;\n}\n.zd-grid .zd-grid-cell-tooltip {\n z-index: 10000;\n position: fixed;\n color: white;\n background-color: var(--v-grey-lighten1);\n border-radius: var(--border);\n padding: var(--spacing-1) var(--spacing-2);\n opacity: 0.9;\n display: none;\n font-size: 14px;\n line-height: 22px;\n text-transform: none;\n width: auto;\n pointer-events: none;\n white-space: pre;\n}\n.zd-grid .zd-grid-cell-tooltip.zd-grid-cell-tooltip-show {\n display: block;\n white-space: normal;\n}\n.zd-grid-loading {\n pointer-events: none;\n}\n.v-data-table__progress {\n position: sticky;\n top: 24px;\n}\n.v-data-table--mobile > .v-data-table__wrapper tbody {\n display: contents;\n flex-direction: column;\n}", map: undefined, media: undefined })
60620
+ ,inject("data-v-7871e6ca_1", { source: ".zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable.text-right .zd-table-cell-inline-edit, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable.text-right .zd-table-cell-inline-edit {\n justify-content: flex-end;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable.text-center .zd-table-cell-inline-edit, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable.text-center .zd-table-cell-inline-edit {\n justify-content: center;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-inline-edit, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-inline-edit {\n display: flex;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-inline-edit .zd-table-cell-edit-icon .v-icon, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-inline-edit .zd-table-cell-edit-icon .v-icon {\n display: flex;\n font-size: 18px;\n margin-right: var(--spacing-1);\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-tree-grid-editable-cell-wrapper, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-tree-grid-editable-cell-wrapper {\n display: flex;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text {\n width: 100%;\n padding: 0 8px;\n position: relative;\n display: block;\n height: 20px;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:before, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:after, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:before, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:after {\n content: \"\";\n position: absolute;\n width: 1px;\n height: var(--spacing-1);\n bottom: 0px;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:before, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:before {\n left: 0;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-column-editable .zd-table-cell-text:after, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text:after {\n right: 0px;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable {\n cursor: pointer;\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text.zd-table-cell-text-editable {\n border-bottom: solid var(--regular) var(--v-grey-lighten4);\n}\n.zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text.zd-table-cell-text-editable:before, .zd-tree-grid-editable table tbody tr td.zd-table-cell.zd-table-cell-editable .zd-table-cell-text.zd-table-cell-text-editable:after {\n border-left: solid var(--regular) var(--v-grey-lighten4);\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand {\n display: inline-block;\n text-align: end;\n vertical-align: baseline;\n height: 10px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand .v-icon {\n transition: transform 0.3s ease;\n -webkit-transition: transform 0.3s ease;\n font-size: 20px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand .v-icon::after {\n content: none;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand .v-icon.opened {\n transform: rotate(90deg);\n -webkit-transform: rotate(90deg);\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level1 {\n width: 20px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level2 {\n width: 40px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level3 {\n width: 60px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level4 {\n width: 80px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level5 {\n width: 100px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level6 {\n width: 120px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level7 {\n width: 140px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level8 {\n width: 160px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level9 {\n width: 180px;\n}\n.zd-tree-grid-editable .zd-tree-grid-editable-expand.level10 {\n width: 200px;\n}\n.zd-tree-grid-editable.v-data-table--dense table tbody .zd-input.zd-text-input .v-input__slot {\n height: 22px;\n}\n.zd-tree-grid-editable.v-data-table--dense table tbody .zd-input.zd-text-input .v-input__slot input, .zd-tree-grid-editable.v-data-table--dense table tbody .zd-input.zd-text-input .v-input__slot .v-select__selections {\n height: 22px;\n max-height: 22px;\n}", map: undefined, media: undefined });
60198
60621
 
60199
60622
  };
60200
60623
  /* scoped */
@@ -60378,6 +60801,23 @@ If you're seeing "$attrs is readonly", it's caused by this`);
60378
60801
  return objectStyle;
60379
60802
  };
60380
60803
 
60804
+ /**
60805
+ * Register an observer that calls `callback` when the `element` becomes visible
60806
+ */
60807
+ var onVisiblePlugin = (element, callback, root) => {
60808
+ const options = {
60809
+ root,
60810
+ };
60811
+ const observer = new IntersectionObserver((entries) => {
60812
+ entries.forEach((entry) => {
60813
+ if (entry.intersectionRatio > 0)
60814
+ callback();
60815
+ });
60816
+ }, options);
60817
+ observer.observe(element);
60818
+ return observer;
60819
+ };
60820
+
60381
60821
  // tslint:disable: variable-name
60382
60822
  const VueTreeSelect = require('@zeedhi/zd-vue-treeselect');
60383
60823
  const Hooper = require('hooper');
@@ -60514,6 +60954,8 @@ If you're seeing "$attrs is readonly", it's caused by this`);
60514
60954
  Vue.prototype.$doubleClick = doubleClickPlugin;
60515
60955
  // isMobile
60516
60956
  Vue.prototype.$isMobile = isMobilePlugin;
60957
+ // onVisible
60958
+ Vue.prototype.$onVisible = onVisiblePlugin;
60517
60959
  // isDark
60518
60960
  Vue.prototype.$isDark = isDarkPlugin;
60519
60961
  // isLight