@zeedhi/teknisa-components-vuetify 3.1.0 → 3.3.0

package/dist/teknisa-vuetify.js

@@ -1,4117 +0,0 @@
-import { ModalService, Icons } from '@zeedhi/common';
-import { BreadcrumbHeader, TekRestDatasource, TekGridColumn, TekFilterHelper, TekGrid, TekMemoryDatasource, TekGridColumnsButton, TekGridFilterButton, TekGridLayoutOptions, Loading, TekUserInfo, TekUserInfoList } from '@zeedhi/teknisa-components-common';
-import { defineComponent, resolveComponent, openBlock, createElementBlock, createVNode, mergeProps, withCtx, normalizeProps, guardReactiveProps, createElementVNode, Fragment, renderList, createBlock, resolveDynamicComponent, createCommentVNode, renderSlot, inject, computed, provide, nextTick, withDirectives, normalizeClass, normalizeStyle, createSlots, vShow, reactive, toDisplayString, ref, watch, createTextVNode, onMounted, isMemoSame, withModifiers } from 'vue';
-import { ZdComponentRenderProps, useCreateInstance, NotProvidedError, buildProps, ZdGridEditableProps, useGridEditableInstance, getRootElement, useGridColumns, ZdIterableColumnsButtonProps, useButtonInstance, ZdButtonProps, ZdLoadingProps, useGetMethods, ZdListProps } from '@zeedhi/vuetify';
-import { Utils, Config, Metadata, dayjs, I18n, Singleton, Loader } from '@zeedhi/core';
-import cloneDeep from 'lodash.clonedeep';
-import debounce from 'lodash.debounce';
-import sortable from 'sortablejs';
-import { ZdUserInfoProps } from '@zeedhi/zd-user-info-vue';
-
-const TekBreadcrumbHeaderProps$1 = {
-    ...ZdComponentRenderProps,
-    title: {
-        type: String,
-        default: '',
-    },
-    breadcrumb: {
-        type: Object,
-        default: {},
-        watch: false,
-    },
-    rightSlot: {
-        type: Array,
-        default: () => [],
-        watch: false,
-    },
-};
-const breadcrumbHeaderComponent$1 = defineComponent({
-    props: TekBreadcrumbHeaderProps$1,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, BreadcrumbHeader, TekBreadcrumbHeaderProps$1);
-        return {
-            instance,
-            root,
-        };
-    },
-});
-
-const _hoisted_1$6 = ["id"];
-const _hoisted_2$3 = { class: "tek-breadcrumb-header-slot-right" };
-const _hoisted_3$1 = { key: 0 };
-
-function render$c(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_zd_breadcrumbs = resolveComponent("zd-breadcrumbs");
-  const _component_zd_text = resolveComponent("zd-text");
-  const _component_v_col = resolveComponent("v-col");
-
-  return (openBlock(), createElementBlock("div", {
-    id: _ctx.instance.name,
-    ref: "root",
-    class: "tek-breadcrumb-header"
-  }, [
-    createVNode(_component_zd_breadcrumbs, mergeProps(_ctx.instance.breadcrumb, {
-      theme: _ctx.instance.theme
-    }), null, 16 /* FULL_PROPS */, ["theme"]),
-    createVNode(_component_v_col, {
-      class: "tek-breadcrumb-header-title-col",
-      cols: "12"
-    }, {
-      default: withCtx(() => [
-        createVNode(_component_zd_text, normalizeProps(guardReactiveProps({
-          name: `${_ctx.instance.name}-title`,
-          cssClass: 'tek-breadcrumb-header-title',
-          text: _ctx.$t(_ctx.instance.title),
-        })), null, 16 /* FULL_PROPS */),
-        createElementVNode("span", _hoisted_2$3, [
-          (_ctx.instance.rightSlot.length)
-            ? (openBlock(), createElementBlock("span", _hoisted_3$1, [
-                (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.instance.rightSlot, (child) => {
-                  return (openBlock(), createBlock(resolveDynamicComponent(child.component), mergeProps({ ref_for: true }, child, {
-                    key: child.name
-                  }), null, 16 /* FULL_PROPS */))
-                }), 128 /* KEYED_FRAGMENT */))
-              ]))
-            : createCommentVNode("v-if", true),
-          renderSlot(_ctx.$slots, "rightSlot")
-        ])
-      ]),
-      _: 3 /* FORWARDED */
-    })
-  ], 8 /* PROPS */, _hoisted_1$6))
-}
-
-breadcrumbHeaderComponent$1.render = render$c;
-breadcrumbHeaderComponent$1.__file = "src/components/tek-breadcrumb-header/TekBreadcrumbHeader.vue";
-
-function useTableLayout() {
-    const applyLayout = inject('applyLayout');
-    const getColumnElements = inject('getColumnElements');
-    const getTableWidth = inject('getTableWidth');
-    if (!applyLayout) {
-        throw new NotProvidedError('applyLayout');
-    }
-    if (!getColumnElements) {
-        throw new NotProvidedError('getColumnElements');
-    }
-    if (!getTableWidth) {
-        throw new NotProvidedError('getTableWidth');
-    }
-    return { applyLayout, getColumnElements, getTableWidth };
-}
-function provideTableLayout({ instance, rootEl, }) {
-    const tableElement = rootEl.value?.querySelector('table');
-    const columnDictionary = computed(() => getColumnDictionary(instance.columns));
-    const datasourceDynamicFilter = () => {
-        const datasource = instance.datasource;
-        if (datasource instanceof TekRestDatasource)
-            return datasource.dynamicFilter;
-        return {};
-    };
-    const getColumnDictionary = (columns) => {
-        const columnDictionary = {};
-        columns.forEach((column) => {
-            columnDictionary[column.name] = column;
-        });
-        return columnDictionary;
-    };
-    const addMissingColumns = (layout) => {
-        const layoutColumnNames = layout.columns?.map((column) => column.name) || [];
-        const columnNames = Object.keys(columnDictionary.value);
-        columnNames.forEach((columnName) => {
-            if (!layoutColumnNames.includes(columnName)) {
-                layout.columns?.push(columnDictionary.value[columnName]);
-            }
-        });
-    };
-    const setHelperValue = (column, value) => {
-        if (column instanceof TekGridColumn) {
-            if (!Array.isArray(column.filterProps) && typeof value === 'string') {
-                column.filterProps.helperValue = value;
-            }
-            else if (Array.isArray(column.filterProps) && Array.isArray(value)) {
-                column.filterProps.forEach((prop, index) => {
-                    prop.value = value[index];
-                });
-            }
-        }
-    };
-    const getHelperValues = (dynamicFilter, columns) => {
-        const filter = cloneDeep(dynamicFilter);
-        Object.keys(filter).forEach((columnName) => {
-            const filterOptions = filter[columnName];
-            const column = columns[columns.findIndex((col) => col.name === columnName)];
-            const { filterHelperValue } = column;
-            filterOptions.forEach((item) => {
-                if (['IN', 'NOT_IN', 'BETWEEN'].includes(item.operation) && !Array.isArray(item.value)) {
-                    item.value = item.value.split(';');
-                }
-                let helperValue = '';
-                if (!Array.isArray(filterHelperValue)) {
-                    helperValue = filterHelperValue;
-                }
-                else {
-                    Object.keys(filterHelperValue).forEach((key) => {
-                        const value = filterHelperValue[key] || '';
-                        if (`${item.relation || 'AND'}-${item.operation || 'CONTAINS'}` === key) {
-                            helperValue = value;
-                        }
-                    });
-                }
-                if (helperValue) {
-                    const columnObj = instance.getColumn(column.name);
-                    item.value = TekFilterHelper.getValue(helperValue, columnObj);
-                }
-            });
-        });
-        return filter;
-    };
-    /**
-     * Applies the default grid layout
-     * @returns a boolean to indicate whether the group parameters changed
-     */
-    const applyDefaultLayout = (defaultLayout) => {
-        let groupParamsChanged = false;
-        instance.datasource.order = [...defaultLayout.originalDatasourceOrder];
-        instance.datasource.filter = { ...defaultLayout.originalDatasourceFilter };
-        if (instance.datasource instanceof TekRestDatasource) {
-            instance.datasource.dynamicFilter = getHelperValues(defaultLayout.originalDatasourceDynamicFilter, defaultLayout.originalColumnProps);
-        }
-        instance.columns = defaultLayout.originalColumnProps.map((defaultColumn) => {
-            const col = columnDictionary.value[defaultColumn.name];
-            groupParamsChanged =
-                groupParamsChanged ||
-                    col.grouped !== defaultColumn.grouped ||
-                    col.groupOpened !== defaultColumn.groupOpened ||
-                    col.aggregation !== defaultColumn.aggregation;
-            col.isVisible = defaultColumn.isVisible ?? col.isVisible;
-            col.label = defaultColumn.label ?? col.label;
-            col.align = defaultColumn.align ?? col.align;
-            col.fixed = defaultColumn.fixed ?? col.fixed;
-            col.grouped = defaultColumn.grouped ?? col.grouped;
-            col.groupOpened = defaultColumn.groupOpened ?? col.groupOpened;
-            col.aggregation = defaultColumn.aggregation ?? col.aggregation;
-            col.minWidth = defaultColumn.minWidth ?? col.minWidth;
-            col.maxWidth = defaultColumn.maxWidth ?? col.maxWidth;
-            col.width = defaultColumn.width ?? col.width;
-            setHelperValue(col, defaultColumn.filterHelperValue || '');
-            return col;
-        });
-        if (tableElement) {
-            tableElement.style.width = '100%';
-            const columnElements = Array.from(tableElement.querySelectorAll('tr th:not(.selectable)'));
-            columnElements.forEach((item) => {
-                item.style.width = 'unset';
-            });
-        }
-        return groupParamsChanged;
-    };
-    const applyNewLayout = (layout, changeLayoutCallback) => {
-        const gridColumnNames = Object.keys(columnDictionary.value);
-        let layoutChanged = false;
-        // removes columns that are in the layout but not in grid
-        layout.columns = layout.columns?.filter((column) => {
-            const isInGrid = gridColumnNames.includes(column.name);
-            if (!isInGrid)
-                layoutChanged = true;
-            return isInGrid;
-        });
-        if (layoutChanged) {
-            changeLayoutCallback(layout);
-        }
-        if (tableElement)
-            tableElement.style.width = layout.gridWidth || 'auto';
-        instance.datasource.order = layout.order !== undefined ? layout.order : instance.datasource.order;
-        instance.datasource.filter = layout.filter !== undefined ? layout.filter : instance.datasource.filter;
-        if (instance.datasource instanceof TekRestDatasource && layout.dynamicFilter !== undefined) {
-            instance.datasource.dynamicFilter = getHelperValues(layout.dynamicFilter, layout.columns || instance.columns);
-        }
-        if (layout.columns) {
-            instance.columns = layout.columns.map((column) => {
-                const col = columnDictionary.value[column.name];
-                col.label = column.label !== undefined ? column.label : col.label;
-                col.align = column.align !== undefined ? column.align : col.align;
-                col.isVisible = column.isVisible !== undefined ? column.isVisible : col.isVisible;
-                col.fixed = !!column.fixed;
-                col.grouped = !!column.grouped;
-                col.groupOpened = !!column.groupOpened;
-                col.aggregation = column.aggregation;
-                col.minWidth = column.minWidth || '';
-                col.maxWidth = column.maxWidth || '';
-                col.width = column.width;
-                setHelperValue(col, column.filterHelperValue || '');
-                return col;
-            });
-            // wait to change column orders
-            nextTick(() => {
-                gridColumnNames.forEach((_key, index) => {
-                    const columnElement = tableElement?.querySelector(`tr th:not(.selectable)[index="${index}"]`);
-                    if (columnElement) {
-                        columnElement.style.width = layout.columns[index].width || 'unset';
-                    }
-                });
-            });
-        }
-    };
-    const applyLayout = ({ layout, defaultLayout, changeLayoutCallback, }) => {
-        const oldOrder = instance.datasource.order;
-        const oldFilter = instance.datasource.filter;
-        const oldDynamicFilter = datasourceDynamicFilter();
-        let groupParamsChanged = false;
-        if (layout) {
-            addMissingColumns(layout);
-            applyNewLayout(layout, changeLayoutCallback);
-        }
-        else {
-            groupParamsChanged = applyDefaultLayout(defaultLayout);
-        }
-        if ((!Utils.isEqual(instance.datasource.order, oldOrder) ||
-            !Utils.isEqual(instance.datasource.filter, oldFilter) ||
-            !Utils.isEqual(datasourceDynamicFilter(), oldDynamicFilter)) &&
-            !groupParamsChanged) {
-            // Se os parametros de agrupamento tiverem sido alterados um get é feito automaticamente
-            instance.loadAfterTasks();
-        }
-    };
-    const getColumnElements = () => {
-        const elementDict = {};
-        const columnElements = tableElement?.querySelectorAll('tr th:not(.selectable)[index]') || [];
-        columnElements.forEach((el) => {
-            const index = el.getAttribute('index');
-            if (index === null)
-                return;
-            elementDict[index] = el;
-        });
-        return elementDict;
-    };
-    const getTableWidth = () => {
-        return tableElement ? window.getComputedStyle(tableElement).width : 'auto';
-    };
-    provide('applyLayout', applyLayout);
-    provide('getColumnElements', getColumnElements);
-    provide('getTableWidth', getTableWidth);
-}
-
-const TekGridProps$1 = buildProps({
-    ...ZdGridEditableProps,
-    toolbarSlot: {
-        type: Array,
-        default: undefined,
-        watch: false,
-    },
-    title: {
-        type: String,
-        default: '',
-    },
-    addButton: {
-        type: [Boolean, String],
-        default: false,
-    },
-    deleteButton: {
-        type: [String, Boolean],
-        default: 'none',
-    },
-    columnsButton: {
-        type: [Boolean, String],
-        default: false,
-    },
-    columnsButtonIgnore: {
-        type: [Array, String],
-        default: () => [],
-    },
-    showEditButtons: {
-        type: [Boolean, String],
-        default: true,
-    },
-    filterButton: {
-        type: [Boolean, String],
-        default: false,
-    },
-    modalFilterProps: {
-        type: Object,
-        default: () => ({}),
-    },
-    showSearch: {
-        type: [Boolean, String],
-        default: true,
-    },
-    columnFilterButton: {
-        type: [Boolean, String],
-        default: false,
-    },
-    hideActions: {
-        type: [Boolean, String],
-        default: false,
-    },
-    actions: {
-        type: Array,
-        default: () => [],
-        watch: false,
-    },
-    dragColumns: {
-        type: [Boolean, String],
-        default: true,
-    },
-    resizeColumns: {
-        type: [Boolean, String],
-        default: true,
-    },
-    showLayoutOptions: {
-        type: [Boolean, String],
-        default: true,
-    },
-    showExport: {
-        type: [String, Boolean],
-        default: false,
-    },
-    showReload: {
-        type: [Boolean, String],
-        default: true,
-    },
-    exportConfig: {
-        type: Array,
-    },
-    exportActions: {
-        type: Array,
-        watch: false,
-    },
-    groupsOpened: {
-        type: [Boolean, String],
-        default: false,
-    },
-    showSummaryTotal: {
-        type: [Boolean, String],
-        default: true,
-    },
-    mainGrid: {
-        type: [Boolean, String],
-        default: true,
-    },
-    xlsDefaultType: {
-        type: String,
-        default: undefined,
-    },
-    showCheckboxAllFilter: {
-        type: [Boolean, String],
-        default: Config.gridShowCheckboxAllFilter,
-    },
-    toolbarOpened: {
-        type: [Boolean],
-        default: true,
-    },
-    defaultFilter: {
-        type: Object,
-    },
-    reportTitle: {
-        type: String,
-    },
-    editNewRowsOnly: {
-        type: [Boolean, String],
-        default: false,
-    },
-});
-const gridEditableComponent$1 = defineComponent({
-    props: TekGridProps$1,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, TekGrid, TekGridProps$1);
-        const renderedData = computed(() => {
-            if (instance.isGrouped()) {
-                return instance.getGroupedData();
-            }
-            return instance.getData();
-        });
-        const visibleData = computed(() => {
-            return renderedData.value.filter((row) => instance.isItemVisible(row));
-        });
-        const isNavigableRow = (element) => {
-            return element.classList.contains('zd-grid__row')
-                && !element.classList.contains('tek-grid-group-row')
-                && !element.classList.contains('tek-grid-footer-row');
-        };
-        const gridEditableScope = useGridEditableInstance({
-            instance,
-            root,
-            renderedData: visibleData,
-            isNavigableRow,
-        });
-        const rootEl = getRootElement(root);
-        const { visibleColumns } = useGridColumns({
-            instance,
-            rootEl,
-            visibilityCondition: (column) => column.isVisible && !column.grouped,
-        });
-        provideTableLayout({ instance, rootEl });
-        const debouncedDatasourceGet = debounce((instance) => {
-            const event = new Event('change', { cancelable: true });
-            instance.callEvent('beforeApplyFilter', { component: instance, event });
-            if (event.defaultPrevented)
-                return;
-            const { datasource } = instance;
-            if (datasource instanceof TekRestDatasource || datasource instanceof TekMemoryDatasource) {
-                datasource.updateDynamicFilter();
-            }
-            else {
-                datasource.get();
-            }
-        }, 500);
-        const filter = computed(() => {
-            if (instance.datasource instanceof TekRestDatasource || instance.datasource instanceof TekMemoryDatasource) {
-                return instance.datasource.dynamicFilter;
-            }
-            const datasourceFilter = instance.datasource.filter;
-            const simpleFilter = {};
-            Object.keys(datasourceFilter).forEach((key) => {
-                simpleFilter[key] = [{ relation: 'AND', operation: 'CONTAINS', value: datasourceFilter[key] }];
-            });
-            return simpleFilter;
-        });
-        const setFilter = (newFilter) => {
-            if (Utils.isEqual(filter, newFilter))
-                return;
-            if (instance.datasource instanceof TekRestDatasource || instance.datasource instanceof TekMemoryDatasource) {
-                instance.datasource.dynamicFilter = cloneDeep(newFilter);
-            }
-            else {
-                const normalFilter = {};
-                Object.keys(newFilter).forEach((key) => {
-                    if (!newFilter[key][0].value)
-                        return;
-                    normalFilter[key] = newFilter[key][0].value;
-                });
-                instance.datasource.filter = normalFilter;
-            }
-            debouncedDatasourceGet(instance);
-            instance.changeLayout();
-        };
-        const columnHasFilter = (columnName) => {
-            return instance.columnHasFilter(columnName);
-        };
-        const isRowVisible = (row, index) => {
-            return instance.isItemVisible(row) && gridEditableScope.shouldRender(index);
-        };
-        const isCurrentRowGroup = (row) => {
-            const { uniqueKey, currentRow } = instance.datasource;
-            return !!((row.group && row.groupValue === currentRow.groupValue) ||
-                (row[uniqueKey] && row[uniqueKey] === currentRow[uniqueKey]));
-        };
-        const isGroupSelectIndeterminate = (item) => {
-            let hasSelected = false;
-            let hasNotSelected = false;
-            const { uniqueKey } = instance.datasource;
-            item.children.forEach((child) => {
-                const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
-                hasSelected = hasSelected || idx !== -1;
-                hasNotSelected = hasNotSelected || idx === -1;
-            });
-            return hasSelected && hasNotSelected;
-        };
-        const isGroupSelected = (item) => {
-            return item.children.every((child) => {
-                const { uniqueKey } = instance.datasource;
-                const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
-                return idx !== -1;
-            });
-        };
-        const selectGroupRowClick = (row, isSelected, event) => {
-            nextTick(() => {
-                const rootElement = getRootElement(root);
-                instance.selectGroupClick(row, isSelected, event, rootElement.value);
-            });
-        };
-        const selectGroup = (item, event) => {
-            const { uniqueKey } = instance.datasource;
-            const isSelected = isGroupSelected(item);
-            if (!isSelected) {
-                // here we fetch the item from renderedData because vuetify isSelected checks for object reference
-                // so we need to find the item inside renderedData to call selectRow() with the correct reference
-                // https://github.com/vuetifyjs/vuetify/blob/master/packages/vuetify/src/components/VDataTable/composables/select.ts#L128
-                const items = item.children.map((child) => {
-                    return renderedData.value.find((row) => child[uniqueKey] === row[uniqueKey]);
-                });
-                items.forEach((child) => {
-                    if (!child)
-                        return;
-                    const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
-                    if (idx === -1) {
-                        instance.selectRow(child, true);
-                    }
-                });
-            }
-            else {
-                item.children.forEach((child) => {
-                    const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
-                    if (idx !== -1) {
-                        instance.selectRow(child, false);
-                    }
-                });
-            }
-            selectGroupRowClick(item, !isSelected, event);
-        };
-        const openGroup = (item) => {
-            instance.openGroup(item);
-        };
-        const isGroup = (item) => {
-            return !!item.group;
-        };
-        const isFooter = (item) => {
-            return !!item.groupFooter;
-        };
-        const groupColumnNames = computed(() => {
-            return instance.columns.filter((column) => column.grouped).map((column) => column.name) || [];
-        });
-        return {
-            ...gridEditableScope,
-            instance,
-            root,
-            filter,
-            setFilter,
-            columnHasFilter,
-            visibleColumns,
-            isRowVisible,
-            isCurrentRowGroup,
-            isGroupSelectIndeterminate,
-            selectGroup,
-            isGroup,
-            openGroup,
-            renderedData,
-            isGroupSelected,
-            groupColumnNames,
-            isFooter,
-            visibleData,
-        };
-    },
-});
-
-const _hoisted_1$5 = ["colspan"];
-const _hoisted_2$2 = ["colspan"];
-
-function render$b(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_zd_grid_toolbar = resolveComponent("zd-grid-toolbar");
-  const _component_tek_grid_header_row = resolveComponent("tek-grid-header-row");
-  const _component_tek_grid_group_row = resolveComponent("tek-grid-group-row");
-  const _component_tek_grid_indentation = resolveComponent("tek-grid-indentation");
-  const _component_zd_grid_editable_row = resolveComponent("zd-grid-editable-row");
-  const _component_tek_grid_footer_row = resolveComponent("tek-grid-footer-row");
-  const _component_zd_iterable_no_data = resolveComponent("zd-iterable-no-data");
-  const _component_zd_grid_footer = resolveComponent("zd-grid-footer");
-  const _component_v_data_table = resolveComponent("v-data-table");
-
-  return withDirectives((openBlock(), createBlock(_component_v_data_table, {
-    ref: "root",
-    id: _ctx.instance.name,
-    modelValue: _ctx.selectedRows,
-    "onUpdate:modelValue": _cache[12] || (_cache[12] = $event => ((_ctx.selectedRows) = $event)),
-    class: normalizeClass([
-      'zd-grid',
-      'tek-grid',
-      'zd-grid-editable',
-      _ctx.instance.cssClass,
-      {
-        'zd-grid--loading': _ctx.instance.datasource.loading,
-        'zd-grid--cell-selection': _ctx.instance.cellSelection,
-      },
-    ]),
-    style: normalizeStyle([
-      _ctx.cssColorVars,
-      {
-        height: _ctx.$formatSize(_ctx.instance.height),
-        width: _ctx.$formatSize(_ctx.instance.width),
-        maxHeight: _ctx.$formatSize(_ctx.instance.maxHeight),
-        minHeight: _ctx.$formatSize(_ctx.instance.minHeight),
-        maxWidth: _ctx.$formatSize(_ctx.instance.maxWidth),
-        minWidth: _ctx.$formatSize(_ctx.instance.minWidth),
-      },
-      _ctx.$styleObject(_ctx.instance.cssStyle),
-    ]),
-    theme: _ctx.instance.theme,
-    "sort-asc-icon": "$collapse",
-    "sort-desc-icon": "$expand",
-    "fixed-header": "",
-    "multi-sort": "",
-    "hide-default-footer": "",
-    name: _ctx.instance.name,
-    headers: _ctx.headers,
-    items: _ctx.renderedData,
-    search: _ctx.instance.datasource.search,
-    density: _ctx.instance.dense ? 'compact' : 'default',
-    loading: _ctx.instance.datasource.loading,
-    "item-value": _ctx.instance.datasource.uniqueKey,
-    "items-per-page": -1,
-    "no-filter": "",
-    "sort-by": _ctx.sortBy,
-    "disable-sort": "",
-    "return-object": "",
-    tabindex: "0",
-    "onUpdate:sortBy": _cache[13] || (_cache[13] = $event => (_ctx.updateSortBy($event)))
-  }, createSlots({
-    top: withCtx(() => [
-      (!_ctx.hasToolbarSlot)
-        ? (openBlock(), createBlock(_component_zd_grid_toolbar, { key: 0 }))
-        : createCommentVNode("v-if", true),
-      renderSlot(_ctx.$slots, "toolbarSlot")
-    ]),
-    headers: withCtx(({ columns: tableColumns, isSorted, getSortIcon, toggleSort, sortBy }) => [
-      (_ctx.instance.showHeader)
-        ? (openBlock(), createBlock(_component_tek_grid_header_row, {
-            key: 0,
-            name: _ctx.instance.name,
-            selectable: _ctx.instance.selectable,
-            headerBackground: _ctx.instance.headerBackground,
-            showSelectAll: _ctx.instance.showSelectAll,
-            allselectedState: _ctx.allselectedState,
-            visibleColumns: _ctx.visibleColumns,
-            dragColumns: _ctx.instance.dragColumns,
-            headerCellTextColor: _ctx.instance.headerCellTextColor,
-            resizeColumns: _ctx.instance.resizeColumns,
-            getSortIcon: getSortIcon,
-            toggleSort: toggleSort,
-            sortBy: sortBy,
-            tableColumns: tableColumns,
-            isSorted: isSorted,
-            disableCheckbox: _ctx.instance.editing,
-            instanceName: _ctx.instance.name,
-            filterRelationsDatasource: _ctx.instance.filterRelationsDatasource,
-            filterOperationsDatasource: _ctx.instance.filterOperationsDatasource,
-            modelValue: _ctx.filter,
-            columnFilterButton: _ctx.instance.columnFilterButton,
-            columnHasFilter: _ctx.columnHasFilter,
-            level: _ctx.groupColumnNames.length,
-            "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => (_ctx.setFilter($event))),
-            onResizeMousedown: _cache[1] || (_cache[1] = $event => (_ctx.resizeMouseDownHandler($event.column, $event.event))),
-            onResizeClick: _cache[2] || (_cache[2] = $event => (_ctx.resizeClickHandler($event.event))),
-            onSelectAllClick: _cache[3] || (_cache[3] = $event => (_ctx.selectAllClick($event)))
-          }, null, 8 /* PROPS */, ["name", "selectable", "headerBackground", "showSelectAll", "allselectedState", "visibleColumns", "dragColumns", "headerCellTextColor", "resizeColumns", "getSortIcon", "toggleSort", "sortBy", "tableColumns", "isSorted", "disableCheckbox", "instanceName", "filterRelationsDatasource", "filterOperationsDatasource", "modelValue", "columnFilterButton", "columnHasFilter", "level"]))
-        : createCommentVNode("v-if", true)
-    ]),
-    "no-data": withCtx(() => [
-      createVNode(_component_zd_iterable_no_data, null, {
-        errorSlot: withCtx(() => [
-          renderSlot(_ctx.$slots, "errorSlot")
-        ]),
-        noResultSlot: withCtx(() => [
-          renderSlot(_ctx.$slots, "noResultSlot")
-        ]),
-        noDataSlot: withCtx(() => [
-          renderSlot(_ctx.$slots, "noDataSlot")
-        ]),
-        _: 3 /* FORWARDED */
-      })
-    ]),
-    bottom: withCtx(() => [
-      (_ctx.instance.showFooter && !_ctx.hasFooterSlot)
-        ? (openBlock(), createBlock(_component_zd_grid_footer, { key: 0 }))
-        : createCommentVNode("v-if", true),
-      renderSlot(_ctx.$slots, "footerSlot")
-    ]),
-    _: 2 /* DYNAMIC */
-  }, [
-    (_ctx.addTopPadding())
-      ? {
-          name: "body.prepend",
-          fn: withCtx(({ headers }) => [
-            createElementVNode("tr", null, [
-              createElementVNode("td", {
-                colspan: headers.length,
-                style: normalizeStyle(`padding-top:${_ctx.scrollData.startHeight}px`)
-              }, null, 12 /* STYLE, PROPS */, _hoisted_1$5)
-            ])
-          ]),
-          key: "0"
-        }
-      : undefined,
-    (_ctx.addBottomPadding())
-      ? {
-          name: "body.append",
-          fn: withCtx(({ headers }) => [
-            createElementVNode("tr", null, [
-              createElementVNode("td", {
-                colspan: headers.length,
-                style: normalizeStyle(`padding-top:${_ctx.scrollData.endHeight}px`)
-              }, null, 12 /* STYLE, PROPS */, _hoisted_2$2)
-            ])
-          ]),
-          key: "1"
-        }
-      : undefined,
-    (_ctx.instance.datasource.data.length)
-      ? {
-          name: "body",
-          fn: withCtx(({ internalItems, isSelected }) => [
-            (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.visibleData, (item, i) => {
-              return (openBlock(), createElementBlock(Fragment, null, [
-                (_ctx.isRowVisible(item, i))
-                  ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-                      (_ctx.isGroup(item))
-                        ? (openBlock(), createBlock(_component_tek_grid_group_row, {
-                            key: item.groupColumnName + item.groupValue,
-                            row: item,
-                            "is-current-row": _ctx.isCurrentRowGroup(item),
-                            selectable: _ctx.instance.selectable,
-                            selectionDisabled: _ctx.instance.callDisableSelection(item),
-                            cellSelection: _ctx.instance.cellSelection,
-                            "is-current": _ctx.isCurrent,
-                            isSelected: _ctx.isGroupSelected(item),
-                            indeterminate: _ctx.isGroupSelectIndeterminate(item),
-                            onClick: $event => (_ctx.rowClick(item, $event)),
-                            onCheckboxClick: $event => (_ctx.selectGroup(item, $event)),
-                            onFocusin: _cache[4] || (_cache[4] = $event => (_ctx.cellFocusIn($event))),
-                            onExpandClick: $event => (_ctx.openGroup(item))
-                          }, null, 8 /* PROPS */, ["row", "is-current-row", "selectable", "selectionDisabled", "cellSelection", "is-current", "isSelected", "indeterminate", "onClick", "onCheckboxClick", "onExpandClick"]))
-                        : (!_ctx.isFooter(item))
-                          ? (openBlock(), createBlock(_component_zd_grid_editable_row, {
-                              key: _ctx.instance.getRowKey(item),
-                              isSelected: isSelected(internalItems[i]),
-                              isCurrentRow: _ctx.isCurrentRow(item),
-                              selectable: _ctx.instance.selectable,
-                              selectionDisabled: _ctx.instance.callDisableSelection(item),
-                              cellSelection: _ctx.instance.cellSelection,
-                              isCurrent: _ctx.isCurrent,
-                              columns: _ctx.visibleColumns,
-                              row: item,
-                              fixedLeft: _ctx.fixedLeft,
-                              fixedRight: _ctx.fixedRight,
-                              isEditing: _ctx.isEditing,
-                              onCellFocus: _cache[5] || (_cache[5] = $event => (_ctx.cellFocus($event))),
-                              onCellClick: _cache[6] || (_cache[6] = $event => (_ctx.cellClick($event))),
-                              onClick: $event => (_ctx.rowClick(item, $event)),
-                              onFocusin: _cache[7] || (_cache[7] = $event => (_ctx.cellFocusIn($event))),
-                              onCheckboxClick: $event => (_ctx.selectRowClick(item, !isSelected(internalItems[i]), $event)),
-                              onCellEnterEdit: _cache[8] || (_cache[8] = $event => (_ctx.cellEnterEdit($event))),
-                              onCellKeydown: _cache[9] || (_cache[9] = $event => (_ctx.cellKeydown($event)))
-                            }, {
-                              "cell-prepend": withCtx(({ index }) => [
-                                (index === 0 && _ctx.groupColumnNames.length > 0)
-                                  ? (openBlock(), createBlock(_component_tek_grid_indentation, {
-                                      key: 0,
-                                      level: item.groupHeaders?.length
-                                    }, null, 8 /* PROPS */, ["level"]))
-                                  : createCommentVNode("v-if", true)
-                              ]),
-                              _: 2 /* DYNAMIC */
-                            }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["isSelected", "isCurrentRow", "selectable", "selectionDisabled", "cellSelection", "isCurrent", "columns", "row", "fixedLeft", "fixedRight", "isEditing", "onClick", "onCheckboxClick"]))
-                          : (openBlock(), createBlock(_component_tek_grid_footer_row, {
-                              key: 'footer' + item.groupColumnName + item.groupValue,
-                              isSelected: isSelected(internalItems[i]),
-                              selectable: _ctx.instance.selectable,
-                              selectionDisabled: _ctx.instance.callDisableSelection(item),
-                              cellSelection: _ctx.instance.cellSelection,
-                              isCurrent: _ctx.isCurrent,
-                              columns: _ctx.visibleColumns,
-                              row: item,
-                              fixedLeft: _ctx.fixedLeft,
-                              fixedRight: _ctx.fixedRight,
-                              onCellFocus: _cache[10] || (_cache[10] = $event => (_ctx.cellFocus($event))),
-                              onFocusin: _cache[11] || (_cache[11] = $event => (_ctx.cellFocusIn($event)))
-                            }, null, 8 /* PROPS */, ["isSelected", "selectable", "selectionDisabled", "cellSelection", "isCurrent", "columns", "row", "fixedLeft", "fixedRight"]))
-                    ], 64 /* STABLE_FRAGMENT */))
-                  : createCommentVNode("v-if", true)
-              ], 64 /* STABLE_FRAGMENT */))
-            }), 256 /* UNKEYED_FRAGMENT */))
-          ]),
-          key: "2"
-        }
-      : undefined
-  ]), 1032 /* PROPS, DYNAMIC_SLOTS */, ["id", "modelValue", "class", "style", "theme", "name", "headers", "items", "search", "density", "loading", "item-value", "sort-by"])), [
-    [vShow, _ctx.instance.isVisible]
-  ])
-}
-
-gridEditableComponent$1.render = render$b;
-gridEditableComponent$1.__file = "src/components/tek-grid/TekGrid.vue";
-
-const isArrayOperation = (operation) => {
-    return ['IN', 'NOT_IN', 'BETWEEN'].includes(operation);
-};
-
-const TekGridColumnFilterProps$1 = {
-    hasFilterData: {
-        type: Boolean,
-        default: false,
-    },
-    column: {
-        type: Object,
-        required: true,
-    },
-    modelValue: {
-        type: Array,
-        default: [],
-    },
-    instanceName: {
-        type: String,
-        required: true,
-    },
-    filterRelationsDatasource: {
-        type: [Object, null],
-        required: false,
-    },
-    filterOperationsDatasource: {
-        type: [Object, null],
-        required: false,
-    },
-    isHovering: {
-        type: Boolean,
-        default: false,
-    },
-    multiple: {
-        type: Boolean,
-        required: true,
-    },
-};
-const tekGridColumnFilter$1 = defineComponent({
-    props: TekGridColumnFilterProps$1,
-    inheritAttrs: false,
-    emits: ['update:modelValue'],
-    setup(props, ctx) {
-        const getValueInputName = (index) => `${props.instanceName}-${props.column.name}-filter-value-${index}`;
-        const focusValueInput = (index) => {
-            const valueInputName = getValueInputName(index);
-            const input = Metadata.getInstance(valueInputName);
-            input.setFocus();
-        };
-        const createNewFilter = () => {
-            return reactive({
-                operation: 'CONTAINS',
-                relation: 'AND',
-                value: undefined,
-            });
-        };
-        let newFilter = createNewFilter();
-        const convertToDateFormat = (value, revert) => {
-            const dateFormat = props.column.componentProps.dateFormat || Config.dateFormat;
-            const displayFormat = props.column.componentProps.displayFormat || Config.displayFormat;
-            if (revert) {
-                if (dayjs(value, displayFormat).isValid() || !dayjs(value, dateFormat).isValid()) {
-                    return value;
-                }
-                return dayjs(value, dateFormat).format(displayFormat);
-            }
-            if (dayjs(value, dateFormat).isValid() || !dayjs(value, displayFormat).isValid()) {
-                return value;
-            }
-            return dayjs(value, displayFormat).format(dateFormat);
-        };
-        const checkDateValueFormat = (value, revert = false) => {
-            if (!['ZdDate', 'ZdDateRange'].includes(props.column.componentProps.component))
-                return value;
-            if (Array.isArray(value)) {
-                return value.map((item) => convertToDateFormat(item, revert));
-            }
-            return convertToDateFormat(value, revert);
-        };
-        // use WeakMap to avoid memory leaks
-        const idMap = new WeakMap();
-        let idCounter = 0;
-        // retrieves a unique id for each item
-        const getId = (item) => {
-            if (!idMap.has(item)) {
-                idMap.set(item, `__item__${idCounter++}`);
-            }
-            return idMap.get(item);
-        };
-        // use computed to generate unique ids for each filter item
-        // this is needed for the v-for :key updates
-        const modelWithIds = computed(() => {
-            if (!props.multiple) {
-                if (props.modelValue.length > 0) {
-                    return [{ id: getId(props.modelValue[0]), item: props.modelValue[0] }];
-                }
-                return [{ id: getId(newFilter), item: newFilter }];
-            }
-            return [...props.modelValue, newFilter].map((item) => ({
-                id: getId(item),
-                item,
-            }));
-        });
-        const debounceUpdateModel = debounce((modelValue) => {
-            if (Utils.isEqual(modelValue, props.modelValue))
-                return;
-            ctx.emit('update:modelValue', modelValue);
-            newFilter = createNewFilter();
-        }, 500);
-        const changeRelation = (index, { component }) => {
-            const modelValue = cloneDeep(props.modelValue);
-            const isNewFilter = index === modelValue.length;
-            const filter = isNewFilter ? newFilter : modelValue[index];
-            const { value } = component;
-            focusValueInput(index);
-            // update item type value
-            filter.relation = value;
-            if (isNewFilter)
-                return;
-            debounceUpdateModel(modelValue);
-        };
-        const changeOperation = (index, { component }) => {
-            const modelValue = cloneDeep(props.modelValue);
-            const filterItem = modelValue[index];
-            const isNewFilter = index === modelValue.length;
-            const filter = isNewFilter ? newFilter : filterItem;
-            const { value } = component;
-            focusValueInput(index);
-            // if operation is IN, NOT_IN or BETWEEN, value should be an array
-            if (isArrayOperation(value)) {
-                filter.value = Array.isArray(filterItem.value) ? filterItem.value : [filterItem.value];
-            }
-            // update item type value
-            filter.operation = value;
-            if (isNewFilter)
-                return;
-            debounceUpdateModel(modelValue);
-        };
-        const changeValue = (item, index, { component }) => {
-            const modelValue = cloneDeep(props.modelValue);
-            const filter = cloneDeep(item);
-            const { value } = component;
-            const isNewFilter = props.multiple && index === modelValue.length;
-            let formattedValue = value;
-            if (value && isArrayOperation(filter.operation)) {
-                formattedValue = value.split(';');
-            }
-            filter.value = checkDateValueFormat(formattedValue);
-            if (!props.multiple) {
-                debounceUpdateModel([filter]);
-                return;
-            }
-            if (isNewFilter) {
-                // only emit event when newFilter has value
-                if (!filter.value)
-                    return;
-                debounceUpdateModel([...modelValue, filter]);
-                return;
-            }
-            if (!filter.value) {
-                // when removing the last (not new) filter, should pass its operation and relation to the new filter
-                if (index === modelValue.length - 1) {
-                    newFilter.operation = filter.operation;
-                    newFilter.relation = filter.relation;
-                }
-                modelValue.splice(index, 1);
-                // if the removed filter was the first, should set the new first relation to AND
-                if (modelValue.length > 0 && index === 0) {
-                    modelValue[0].relation = 'AND';
-                }
-                // if the removed filter was the last, should set the newFilter relation to AND
-                if (modelValue.length === 0) {
-                    newFilter.relation = 'AND';
-                }
-            }
-            debounceUpdateModel(modelValue);
-        };
-        const getComponentType = (operation) => {
-            return isArrayOperation(operation) ? 'ZdTextInput' : props.column.componentProps.component;
-        };
-        const getComponentHint = (operation) => {
-            return isArrayOperation(operation) ? 'TEKGRID_MULTIPLE_VALUE_HINT' : '';
-        };
-        const getItemValue = (item) => {
-            return isArrayOperation(item.operation) ? item.value.join(';') : item.value;
-        };
-        return {
-            changeValue,
-            changeRelation,
-            changeOperation,
-            getValueInputName,
-            newFilter,
-            getComponentType,
-            getComponentHint,
-            modelWithIds,
-            getItemValue,
-        };
-    },
-});
-
-function render$a(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_zd_grid_header_icon = resolveComponent("zd-grid-header-icon");
-  const _component_zd_radio = resolveComponent("zd-radio");
-  const _component_zd_select = resolveComponent("zd-select");
-  const _component_v_card = resolveComponent("v-card");
-  const _component_v_menu = resolveComponent("v-menu");
-
-  return (openBlock(), createBlock(_component_v_menu, {
-    "offset-overflow": "",
-    "offset-y": "",
-    transition: "scale-transition",
-    "content-class": "tek-grid-column-filter__menu",
-    "close-on-content-click": false
-  }, {
-    activator: withCtx(({ props }) => [
-      createVNode(_component_zd_grid_header_icon, mergeProps(props, {
-        icon: _ctx.$getIcon('filter'),
-        hidden: !_ctx.isHovering && !_ctx.hasFilterData,
-        color: _ctx.hasFilterData ? 'primary' : ''
-      }), null, 16 /* FULL_PROPS */, ["icon", "hidden", "color"])
-    ]),
-    default: withCtx(() => [
-      createVNode(_component_v_card, {
-        class: "zd-pa-4 zd-pb-0",
-        "min-width": 200,
-        "max-height": 300
-      }, {
-        default: withCtx(() => [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.modelWithIds, ({ item, id }, filterIndex) => {
-            return (openBlock(), createElementBlock(Fragment, { key: id }, [
-              createCommentVNode(" relation "),
-              (_ctx.multiple && filterIndex > 0)
-                ? (openBlock(), createBlock(_component_zd_radio, mergeProps({
-                    key: 0,
-                    name: `${_ctx.instanceName}-${_ctx.column.name}-filter-relation-${filterIndex}`
-                  }, { ref_for: true }, {
-            showLabel: false,
-            showHelper: false,
-            vertical: false,
-            cssClass: 'zd-mb-2',
-            datasource: _ctx.filterRelationsDatasource,
-            dataValue: 'value',
-            dataLabel: 'text',
-            value: item.relation,
-            events: {
-              change: (params) => _ctx.changeRelation(filterIndex, params),
-            },
-          }), null, 16 /* FULL_PROPS */, ["name"]))
-                : createCommentVNode("v-if", true),
-              createCommentVNode(" operation "),
-              (_ctx.multiple && item.operation)
-                ? (openBlock(), createBlock(_component_zd_select, mergeProps({
-                    key: 1,
-                    name: `${_ctx.instanceName}-${_ctx.column.name}-filter-operation-${filterIndex}`
-                  }, { ref_for: true }, {
-            autocomplete: false,
-            showLabel: false,
-            showHelper: false,
-            clearable: false,
-            cssClass: 'zd-mb-2',
-            datasource: _ctx.filterOperationsDatasource,
-            dataValue: 'value',
-            dataText: 'text',
-            value: item.operation,
-            events: {
-              change: (params) => _ctx.changeOperation(filterIndex, params),
-            },
-          }), null, 16 /* FULL_PROPS */, ["name"]))
-                : createCommentVNode("v-if", true),
-              createCommentVNode(" value "),
-              (openBlock(), createBlock(resolveDynamicComponent(_ctx.getComponentType(item.operation)), mergeProps({
-                name: `${_ctx.instanceName}-${_ctx.column.name}-filter-value-${filterIndex}`
-              }, { ref_for: true }, {
-            ..._ctx.column.componentProps,
-            showLabel: false,
-            showHelper: true,
-            autofill: false,
-            cssClass: 'zd-mb-2',
-            value: _ctx.getItemValue(item),
-            persistentHint: true,
-            hint: _ctx.getComponentHint(item.operation),
-            events: {
-              input: (params) => _ctx.changeValue(item, filterIndex, params),
-              change: (params) => _ctx.changeValue(item, filterIndex, params),
-            },
-          }), null, 16 /* FULL_PROPS */, ["name"]))
-            ], 64 /* STABLE_FRAGMENT */))
-          }), 128 /* KEYED_FRAGMENT */))
-        ]),
-        _: 1 /* STABLE */
-      })
-    ]),
-    _: 1 /* STABLE */
-  }))
-}
-
-tekGridColumnFilter$1.render = render$a;
-tekGridColumnFilter$1.__file = "src/components/tek-grid/column-filter/TekGridColumnFilter.vue";
-
-var script$3 = defineComponent({
-    props: {
-        selectable: {
-            type: Boolean,
-            default: false,
-        },
-        headerBackground: {
-            type: String,
-            default: '',
-        },
-        showSelectAll: {
-            type: Boolean,
-            default: false,
-        },
-        allselectedState: {
-            type: Number,
-            default: 0,
-        },
-        visibleColumns: {
-            type: Array,
-            default: () => [],
-        },
-        dragColumns: {
-            type: Boolean,
-            default: false,
-        },
-        headerCellTextColor: {
-            type: String,
-            default: '',
-        },
-        resizeColumns: {
-            type: Boolean,
-            default: false,
-        },
-        getSortIcon: {
-            type: Function,
-            default: () => { },
-        },
-        isSorted: {
-            type: Function,
-            default: () => { },
-        },
-        toggleSort: {
-            type: Function,
-            default: () => { },
-        },
-        tableColumns: {
-            type: Array,
-            default: () => [],
-        },
-        sortBy: {
-            type: Array,
-            default: () => [],
-        },
-        disableCheckbox: {
-            type: Boolean,
-            default: false,
-        },
-        sortable: {
-            type: Boolean,
-            default: true,
-        },
-        name: {
-            type: String,
-            default: '',
-        },
-        modelValue: {
-            type: Object,
-            default: () => [],
-        },
-        instanceName: {
-            type: String,
-            required: true,
-        },
-        filterRelationsDatasource: {
-            type: [Object, null],
-            required: false,
-        },
-        filterOperationsDatasource: {
-            type: [Object, null],
-            required: false,
-        },
-        columnFilterButton: {
-            type: Boolean,
-            required: true,
-        },
-        columnHasFilter: {
-            type: Function,
-            required: true,
-        },
-        level: {
-            type: Number,
-            default: 0,
-        },
-    },
-    emits: ['selectAllClick', 'resizeMousedown', 'resizeClick', 'update:modelValue'],
-    setup(props, { emit }) {
-        const calcWidth = inject('calcWidth');
-        if (!calcWidth) {
-            // TODO: use NotProvidedError
-            throw new Error('calcWidth');
-        }
-        const selectAllClick = (event) => {
-            emit('selectAllClick', event);
-        };
-        const resizeMousedown = (column, event) => {
-            emit('resizeMousedown', { event, column });
-        };
-        const resizeClick = (event) => {
-            emit('resizeClick', { event });
-        };
-        const findOrderIndex = (sortBy, column) => {
-            return sortBy.findIndex((sort) => sort.key === column.name);
-        };
-        const updateModelValue = (columnName, value) => {
-            const modelValue = { ...props.modelValue };
-            modelValue[columnName] = value;
-            emit('update:modelValue', modelValue);
-        };
-        const showFilterButton = (column) => {
-            return column.type !== 'action' && props.columnFilterButton && column.filterable;
-        };
-        return {
-            calcWidth,
-            resizeMousedown,
-            resizeClick,
-            findOrderIndex,
-            updateModelValue,
-            showFilterButton,
-            selectAllClick,
-        };
-    },
-});
-
-const _hoisted_1$4 = {
-  key: 0,
-  class: "tek-grid-column-aggregation"
-};
-
-function render$9(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_tek_grid_indentation = resolveComponent("tek-grid-indentation");
-  const _component_tek_grid_column_filter = resolveComponent("tek-grid-column-filter");
-  const _component_zd_grid_column_header = resolveComponent("zd-grid-column-header");
-  const _component_zd_grid_header_row = resolveComponent("zd-grid-header-row");
-
-  return (openBlock(), createBlock(_component_zd_grid_header_row, {
-    name: _ctx.name,
-    selectable: _ctx.selectable,
-    headerBackground: _ctx.headerBackground,
-    showSelectAll: _ctx.showSelectAll,
-    allselectedState: _ctx.allselectedState,
-    visibleColumns: _ctx.visibleColumns,
-    dragColumns: _ctx.dragColumns,
-    headerCellTextColor: _ctx.headerCellTextColor,
-    resizeColumns: _ctx.resizeColumns,
-    getSortIcon: _ctx.getSortIcon,
-    toggleSort: _ctx.toggleSort,
-    sortBy: _ctx.sortBy,
-    tableColumns: _ctx.tableColumns,
-    isSorted: _ctx.isSorted,
-    disableCheckbox: _ctx.disableCheckbox,
-    onSelectAllClick: _ctx.selectAllClick
-  }, {
-    default: withCtx(({ column, index, isHovering }) => [
-      createVNode(_component_zd_grid_column_header, {
-        cssStyle: {
-          'color': _ctx.headerCellTextColor,
-          width: _ctx.calcWidth(column),
-        },
-        action: column.type === 'action',
-        overflow: column.overflow,
-        helperText: column.helperText,
-        label: column.label,
-        columnAlign: column.align,
-        orderIndex: _ctx.findOrderIndex(_ctx.sortBy, column),
-        isSortable: _ctx.sortable && column.sortable,
-        resizeColumns: _ctx.resizeColumns,
-        sortIcon: _ctx.getSortIcon(_ctx.tableColumns[index]),
-        isSorted: _ctx.isSorted(_ctx.tableColumns[index]),
-        isHovering: isHovering,
-        onClick: $event => (_ctx.toggleSort(_ctx.tableColumns[index])),
-        onResizeMousedown: $event => (_ctx.resizeMousedown(column, $event)),
-        onResizeClick: _cache[0] || (_cache[0] = $event => (_ctx.resizeClick($event)))
-      }, createSlots({
-        label: withCtx(() => [
-          (column.aggregation)
-            ? (openBlock(), createElementBlock("span", _hoisted_1$4, "(" + toDisplayString(_ctx.$t(`TEKGRID_AGGREGATION_${column.aggregation}`)) + ") ", 1 /* TEXT */))
-            : createCommentVNode("v-if", true)
-        ]),
-        _: 2 /* DYNAMIC */
-      }, [
-        (index === 0)
-          ? {
-              name: "prepend",
-              fn: withCtx(() => [
-                createVNode(_component_tek_grid_indentation, {
-                  level: _ctx.level,
-                  "show-divider": false
-                }, null, 8 /* PROPS */, ["level"])
-              ]),
-              key: "0"
-            }
-          : undefined,
-        (_ctx.showFilterButton(column))
-          ? {
-              name: "append",
-              fn: withCtx(({ isHovering }) => [
-                createVNode(_component_tek_grid_column_filter, {
-                  modelValue: _ctx.modelValue[column.name],
-                  hasFilterData: _ctx.columnHasFilter(column.name),
-                  column: column,
-                  instanceName: _ctx.instanceName,
-                  filterRelationsDatasource: _ctx.filterRelationsDatasource,
-                  filterOperationsDatasource: _ctx.filterOperationsDatasource,
-                  isHovering: isHovering,
-                  multiple: !!_ctx.filterRelationsDatasource && !!_ctx.filterOperationsDatasource,
-                  "onUpdate:modelValue": $event => (_ctx.updateModelValue(column.name, $event))
-                }, null, 8 /* PROPS */, ["modelValue", "hasFilterData", "column", "instanceName", "filterRelationsDatasource", "filterOperationsDatasource", "isHovering", "multiple", "onUpdate:modelValue"])
-              ]),
-              key: "1"
-            }
-          : undefined
-      ]), 1032 /* PROPS, DYNAMIC_SLOTS */, ["cssStyle", "action", "overflow", "helperText", "label", "columnAlign", "orderIndex", "isSortable", "resizeColumns", "sortIcon", "isSorted", "isHovering", "onClick", "onResizeMousedown"])
-    ]),
-    _: 1 /* STABLE */
-  }, 8 /* PROPS */, ["name", "selectable", "headerBackground", "showSelectAll", "allselectedState", "visibleColumns", "dragColumns", "headerCellTextColor", "resizeColumns", "getSortIcon", "toggleSort", "sortBy", "tableColumns", "isSorted", "disableCheckbox", "onSelectAllClick"]))
-}
-
-script$3.render = render$9;
-script$3.__file = "src/components/tek-grid/column-header/TekGridHeaderRow.vue";
-
-/******************************************************************************
-Copyright (c) Microsoft Corporation.
-
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */
-/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
-
-
-function __decorate(decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-}
-
-typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
-    var e = new Error(message);
-    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
-};
-
-let TekGridColumnsOptionsController = class TekGridColumnsOptionsController {
-    modal;
-    columnData = {};
-    fixedColumns = [];
-    visibleColumns = [];
-    groupedColumns = [];
-    otherColumns = [];
-    aggregationData = [];
-    selectedColumnNames = [];
-    searchValue = '';
-    showGroups = true;
-    selectedColumnsAlignment;
-    selectedColumnsAggregation;
-    iterableComponent;
-    instanceValue;
-    constructor(modal) {
-        this.modal = modal;
-    }
-    updateArrays() {
-        this.fixedColumns = [];
-        this.visibleColumns = [];
-        this.groupedColumns = [];
-        this.otherColumns = [];
-        Object.keys(this.columnData).forEach((name) => {
-            const column = this.columnData[name];
-            if (this.instanceValue && this.instanceValue.ignoreColumns.indexOf(column.name) === -1) {
-                if (column.grouped) {
-                    this.groupedColumns.push(column);
-                }
-                else if (column.fixed) {
-                    this.fixedColumns.push(column);
-                }
-                else if (column.isVisible) {
-                    this.visibleColumns.push(column);
-                }
-                else {
-                    this.otherColumns.push(column);
-                }
-            }
-        });
-    }
-    set instance(instance) {
-        this.instanceValue = instance;
-        this.iterableComponent = instance.iterableComponent;
-        this.showGroups = instance.iterableComponent instanceof TekGrid;
-        this.aggregationData = instance.getAggregationSelectData();
-        this.columnData = {};
-        this.iterableComponent.columns.forEach((column) => {
-            this.columnData[column.name] = {
-                name: column.name,
-                label: column.label,
-                fixed: column.fixed,
-                isVisible: column.isVisible,
-                align: column.align,
-                grouped: column.grouped || false,
-                groupOpened: column.groupOpened || false,
-                aggregation: column.aggregation,
-                aggregationText: this.getAggregationText(column.aggregation),
-                selected: false,
-            };
-        });
-        this.updateArrays();
-        this.selectedColumnNames = [];
-    }
-    getAggregationText(aggregation) {
-        let result = '';
-        if (aggregation) {
-            const idx = this.aggregationData.findIndex((item) => item.value === aggregation);
-            if (idx !== -1) {
-                result = ` (${this.aggregationData[idx].text})`;
-            }
-        }
-        return result;
-    }
-    columnInSearch(column) {
-        return !this.searchValue || Utils.normalize(column.label).indexOf(Utils.normalize(this.searchValue)) !== -1;
-    }
-    get fixedColumnData() {
-        return this.fixedColumns.filter(this.columnInSearch.bind(this));
-    }
-    set fixedColumnData(_data) {
-        // do nothing
-    }
-    get visibleColumnData() {
-        return this.visibleColumns.filter(this.columnInSearch.bind(this));
-    }
-    set visibleColumnData(_data) {
-        // do nothing
-    }
-    get groupedColumnData() {
-        return this.groupedColumns.filter(this.columnInSearch.bind(this));
-    }
-    set groupedColumnData(_data) {
-        // do nothing
-    }
-    get otherColumnData() {
-        return this.otherColumns.filter(this.columnInSearch.bind(this));
-    }
-    set otherColumnData(_data) {
-        // do nothing
-    }
-    get hasSelectedColumn() {
-        return this.selectedColumnNames.length > 0;
-    }
-    get hasNoSelectedColumn() {
-        return !this.hasSelectedColumn;
-    }
-    get detailColumnName() {
-        const columnNames = this.selectedColumnNames.length
-            ? this.selectedColumnNames.join(', ')
-            : I18n.translate('TEKGRID_SELECT_COLUMN');
-        return `${I18n.translate('TEKGRID_DETAILS_FOR')} ${columnNames}`;
-    }
-    get hasNoFixedColumns() {
-        return this.fixedColumns.length === 0;
-    }
-    get hasNoVisibleColumns() {
-        return this.visibleColumns.length === 0;
-    }
-    get hasNoGroupedColumns() {
-        return this.groupedColumns.length === 0;
-    }
-    get hasNoOtherColumns() {
-        return this.otherColumns.length === 0;
-    }
-    get hasNoSingleSelection() {
-        return this.selectedColumnNames.length !== 1;
-    }
-    get selectedColumnLabel() {
-        return this.selectedColumnNames.length === 1 ? this.columnData[this.selectedColumnNames[0]].label : '';
-    }
-    set selectedColumnLabel(value) {
-        if (this.selectedColumnNames.length === 1) {
-            this.columnData[this.selectedColumnNames[0]].label = value;
-        }
-    }
-    getSameValue(propName) {
-        const isEqual = this.selectedColumnNames.length > 0 &&
-            this.selectedColumnNames.every((name) => this.columnData[name][propName] === this.columnData[this.selectedColumnNames[0]][propName]);
-        return isEqual ? this.columnData[this.selectedColumnNames[0]][propName] : undefined;
-    }
-    setSameValue(propName, value) {
-        this.selectedColumnNames.forEach((name) => {
-            this.columnData[name][propName] = value;
-        });
-    }
-    get groupInSelection() {
-        return this.hasNoSelectedColumn || this.selectedColumnNames.some((name) => this.columnData[name].grouped);
-    }
-    get notGroupInSelection() {
-        return this.hasNoSelectedColumn || this.selectedColumnNames.some((name) => !this.columnData[name].grouped);
-    }
-    get selectedColumnGroupOpened() {
-        return this.getSameValue('groupOpened');
-    }
-    set selectedColumnGroupOpened(value) {
-        this.setSameValue('groupOpened', value);
-    }
-    selectMounted({ component }) {
-        this.updatingSelect = true;
-        if (component.name === 'tekGridColumnsOptionsColumnAlignment') {
-            component.value = this.selectedColumnsAlignment;
-        }
-        else if (component.name === 'tekGridColumnsOptionsColumnAggregation') {
-            component.value = this.selectedColumnsAggregation;
-        }
-        // prevent changing column value from here
-        setTimeout(() => {
-            this.updatingSelect = false;
-        }, 0);
-    }
-    updatingSelect = false;
-    selectChange({ component }) {
-        if (this.updatingSelect)
-            return;
-        if (component.name === 'tekGridColumnsOptionsColumnAlignment') {
-            this.setSameValue('align', component.value);
-        }
-        else {
-            this.setSameValue('aggregation', component.value);
-            this.setSameValue('aggregationText', this.getAggregationText(component.value));
-        }
-    }
-    updateSelects() {
-        this.selectedColumnsAlignment = this.updateSelect('align');
-        this.selectedColumnsAggregation = this.updateSelect('aggregation');
-    }
-    updateSelect(propName) {
-        this.updatingSelect = true;
-        const propValue = this.getSameValue(propName);
-        const selectNames = {
-            align: 'tekGridColumnsOptionsColumnAlignment',
-            aggregation: 'tekGridColumnsOptionsColumnAggregation',
-        };
-        const instances = Metadata.getInstances(selectNames[propName]);
-        if (instances[0]) {
-            instances[0].value = propValue;
-        }
-        // prevent changing column value from here
-        setTimeout(() => {
-            this.updatingSelect = false;
-        }, 0);
-        return propValue;
-    }
-    columnRemoveClick(column) {
-        column.isVisible = false;
-        this.selectedColumnNames.splice(this.selectedColumnNames.indexOf(column.name), 1);
-        this.otherColumns.push(column);
-    }
-    columnFixedRemoveClick({ element }) {
-        const columnName = element?.getAttribute('columnname');
-        if (columnName) {
-            const column = this.columnData[columnName];
-            this.columnRemoveClick(column);
-            this.fixedColumns.splice(this.fixedColumns.indexOf(column), 1);
-        }
-    }
-    columnVisibleRemoveClick({ element }) {
-        const columnName = element?.getAttribute('columnname');
-        if (columnName) {
-            const column = this.columnData[columnName];
-            this.columnRemoveClick(column);
-            this.visibleColumns.splice(this.visibleColumns.indexOf(column), 1);
-        }
-    }
-    columnGroupedRemoveClick({ element }) {
-        const columnName = element?.getAttribute('columnname');
-        if (columnName) {
-            const column = this.columnData[columnName];
-            this.columnRemoveClick(column);
-            this.groupedColumns.splice(this.groupedColumns.indexOf(column), 1);
-        }
-    }
-    isMacPlatform() {
-        return /Mac/.test(navigator.platform);
-    }
-    isMobilePlatform() {
-        return /iPhone|iPad|Android/.test(navigator.platform);
-    }
-    columnClick({ element, event }) {
-        const columnName = element.getAttribute('columnname');
-        if (columnName) {
-            const mouseEvent = event;
-            const multiple = (this.isMacPlatform() && mouseEvent.metaKey) || mouseEvent.ctrlKey || this.isMobilePlatform();
-            if (!multiple) {
-                Object.keys(this.columnData).forEach((name) => {
-                    const column = this.columnData[name];
-                    column.selected = column.name === columnName;
-                });
-            }
-            else {
-                this.columnData[columnName].selected = !this.columnData[columnName].selected;
-            }
-            const orderedColumns = this.fixedColumns
-                .concat(this.visibleColumns)
-                .concat(this.groupedColumns)
-                .concat(this.otherColumns);
-            this.selectedColumnNames = orderedColumns.filter((column) => column.selected).map((column) => column.name);
-            this.updateSelects();
-        }
-    }
-    removeFromSourceList(columnName) {
-        const column = this.columnData[columnName];
-        const fixedIdx = this.fixedColumns.indexOf(column);
-        if (fixedIdx !== -1) {
-            this.fixedColumns.splice(fixedIdx, 1);
-        }
-        else {
-            const visibleIdx = this.visibleColumns.indexOf(column);
-            if (visibleIdx !== -1) {
-                this.visibleColumns.splice(visibleIdx, 1);
-            }
-            else {
-                const groupedIdx = this.groupedColumns.indexOf(column);
-                if (groupedIdx !== -1) {
-                    this.groupedColumns.splice(groupedIdx, 1);
-                }
-                else {
-                    const otherIdx = this.otherColumns.indexOf(column);
-                    if (otherIdx !== -1) {
-                        this.otherColumns.splice(otherIdx, 1);
-                    }
-                }
-            }
-        }
-    }
-    onDragEnd(event) {
-        const columnName = event.item.getAttribute('columnname');
-        if (this.selectedColumnNames.indexOf(columnName) === -1) {
-            this.selectedColumnNames = [columnName];
-            this.updateSelects();
-            setTimeout(() => {
-                Object.keys(this.columnData).forEach((name) => {
-                    const column = this.columnData[name];
-                    column.selected = column.name === columnName;
-                });
-            });
-        }
-        this.selectedColumnNames.forEach((name, index) => {
-            const newIndex = event.newIndex + index;
-            if (name) {
-                this.removeFromSourceList(name);
-                const column = this.columnData[name];
-                if (event.to.id === 'tekGridColumnsOptionsFixedColumns') {
-                    column.fixed = true;
-                    column.isVisible = true;
-                    column.grouped = false;
-                    column.groupOpened = false;
-                    this.fixedColumns.splice(newIndex, 0, column);
-                }
-                else if (event.to.id === 'tekGridColumnsOptionsVisibleColumns') {
-                    column.fixed = false;
-                    column.isVisible = true;
-                    column.grouped = false;
-                    column.groupOpened = false;
-                    this.visibleColumns.splice(newIndex, 0, column);
-                }
-                else if (event.to.id === 'tekGridColumnsOptionsOtherColumns') {
-                    column.fixed = false;
-                    column.isVisible = false;
-                    column.grouped = false;
-                    column.groupOpened = false;
-                    this.otherColumns.splice(newIndex, 0, column);
-                }
-                else if (event.to.id === 'tekGridColumnsOptionsGroupedColumns') {
-                    column.fixed = false;
-                    column.isVisible = true;
-                    column.grouped = true;
-                    column.aggregation = undefined;
-                    column.aggregationText = '';
-                    this.groupedColumns.splice(newIndex, 0, column);
-                }
-            }
-        });
-    }
-    columnContainerMounted({ element }) {
-        if (element) {
-            sortable.create(element, {
-                handle: '.tek-grid-column-option-box',
-                group: 'column-container',
-                filter: '.no-data, .tek-grid-column-option-grouped-true',
-                onEnd: this.onDragEnd.bind(this),
-            });
-        }
-    }
-    selectAll({ component }) {
-        let list;
-        if (component.name === 'tekGridColumnsOptionsFixedSelectAll') {
-            list = this.fixedColumns;
-        }
-        else if (component.name === 'tekGridColumnsOptionsVisibleSelectAll') {
-            list = this.visibleColumns;
-        }
-        else if (component.name === 'tekGridColumnsOptionsOtherSelectAll') {
-            list = this.otherColumns;
-        }
-        else {
-            list = this.groupedColumns;
-        }
-        this.selectedColumnNames = list.map((column) => column.name);
-        Object.keys(this.columnData).forEach((columnName) => {
-            const column = this.columnData[columnName];
-            column.selected = this.selectedColumnNames.indexOf(column.name) !== -1;
-        });
-    }
-    cancelChanges() {
-        this.modal.hide();
-    }
-    applyChanges({ event, element }) {
-        const ignoredColumns = this.iterableComponent.columns.filter((column) => this.instanceValue && this.instanceValue.ignoreColumns.indexOf(column.name) !== -1);
-        const orderedColumns = this.groupedColumns
-            .concat(this.fixedColumns)
-            .concat(this.visibleColumns)
-            .concat(this.otherColumns)
-            .concat(ignoredColumns);
-        if (this.iterableComponent) {
-            this.iterableComponent.columns = orderedColumns.map((orderColumn) => {
-                const columnIdx = this.iterableComponent.columns.findIndex((column) => column.name === orderColumn.name);
-                const iterableColumn = this.iterableComponent.columns[columnIdx];
-                iterableColumn.fixed = orderColumn.fixed;
-                iterableColumn.isVisible = orderColumn.isVisible;
-                iterableColumn.grouped = orderColumn.grouped;
-                iterableColumn.groupOpened = orderColumn.groupOpened;
-                iterableColumn.label = orderColumn.label;
-                iterableColumn.align = orderColumn.align;
-                iterableColumn.aggregation = orderColumn.aggregation;
-                return iterableColumn;
-            });
-            const { datasource } = this.iterableComponent;
-            const order = datasource.order.filter((item) => {
-                const columnName = item.split('.')[0];
-                return this.groupedColumns.findIndex((column) => column.name === columnName) === -1;
-            });
-            datasource.order = this.groupedColumns.map((column) => `${column.name}.asc`).concat(order);
-            this.iterableComponent.changeLayout(event, element);
-        }
-        this.modal.hide();
-    }
-};
-TekGridColumnsOptionsController = __decorate([
-    Singleton
-], TekGridColumnsOptionsController);
-var TekGridColumnsOptionsController$1 = TekGridColumnsOptionsController;
-
-class TekGridColumnsOptionsModal {
-    static controllerName = `TekGridColumnsOptionsController_${Date.now()}`;
-    static modalDef = {
-        name: 'tekGridColumnsOptionsModal',
-        title: '',
-        persistent: true,
-        grid: {
-            sm: 11,
-            md: 9,
-        },
-        children: [
-            {
-                name: 'tekGridColumnsOptionsCloseButtonContainer',
-                component: 'ZdContainer',
-                cssClass: 'zd-pa-0 zd-mb-6 zd-display-flex',
-                children: [
-                    {
-                        name: 'tekGridColumnsOptionsTitleText',
-                        component: 'ZdText',
-                        text: 'TEKGRID_COLUMNS_OPTIONS',
-                        cssClass: 'zd-theme-font-title',
-                    },
-                    {
-                        name: 'tekGridColumnsOptionsFilterSpacer',
-                        component: 'VSpacer',
-                    },
-                    {
-                        name: 'tekGridColumnsOptionsCloseModalButton',
-                        component: 'ZdModalCloseButton',
-                        small: true,
-                        modalName: 'tekGridColumnsOptionsModal',
-                    },
-                ],
-            },
-            {
-                name: 'tekGridColumnsOptionsSearchRow',
-                component: 'ZdRow',
-                children: [
-                    {
-                        name: 'tekGridColumnsOptionsSearchCol',
-                        component: 'ZdCol',
-                        cols: 12,
-                        children: [
-                            {
-                                name: 'tekGridColumnsOptionsSearchInput',
-                                component: 'ZdTextInput',
-                                showLabel: false,
-                                showHelper: false,
-                                placeholder: 'SEARCH',
-                                appendIcon: 'magnify',
-                                value: `{{${TekGridColumnsOptionsModal.controllerName}.searchValue}}`,
-                            },
-                        ],
-                    },
-                ],
-            },
-            {
-                name: 'tekGridColumnsOptionsFixedRow',
-                component: 'ZdRow',
-                children: [
-                    {
-                        name: 'tekGridColumnsOptionsFixedCol',
-                        component: 'ZdCol',
-                        cols: 12,
-                        cssClass: 'tek-grid-column-option-container-col',
-                        children: [
-                            {
-                                name: 'tekGridColumnsOptionsFixedLabel',
-                                component: 'ZdText',
-                                text: 'TEKGRID_FIXED_COLUMNS',
-                                cssClass: 'tek-grid-column-option-label',
-                            },
-                            {
-                                name: 'tekGridColumnsOptionsFixedSelectAll',
-                                component: 'ZdText',
-                                text: 'TEKGRID_SELECT_ALL',
-                                cssClass: 'tek-grid-column-option-select-all',
-                                events: {
-                                    click: `{{${TekGridColumnsOptionsModal.controllerName}.selectAll}}`,
-                                },
-                            },
-                            {
-                                name: 'tekGridColumnsOptionsFixedDropHere',
-                                component: 'ZdText',
-                                text: 'TEKGRID_DROP_COLUMNS',
-                                cssClass: 'tek-grid-column-option-drop-here',
-                                isVisible: `{{${TekGridColumnsOptionsModal.controllerName}.hasNoFixedColumns}}`,
-                            },
-                            {
-                                name: 'tekGridColumnsOptionsFixedColumns',
-                                component: 'TekIterableComponentRender',
-                                id: 'tekGridColumnsOptionsFixedColumns',
-                                cssClass: 'tek-grid-column-option-container',
-                                datasource: {
-                                    uniqueKey: 'name',
-                                    data: `{{${TekGridColumnsOptionsModal.controllerName}.fixedColumnData}}`,
-                                },
-                                noDataSlot: [],
-                                events: {
-                                    onMounted: `{{${TekGridColumnsOptionsModal.controllerName}.columnContainerMounted}}`,
-                                },
-                                componentMetadata: {
-                                    name: 'tekGridColumnsOptionsFixedColumn_<<row.name>>',
-                                    component: 'ZdTag',
-                                    columnName: '<<row.name>>',
-                                    cssClass: 'tek-grid-column-option-box zd-elevation-1 ' + 'tek-grid-column-option-selected-<<row.selected>>',
-                                    tag: 'div',
-                                    children: [
-                                        {
-                                            name: 'tekGridColumnsOptionsFixedColumnText_<<row.name>>',
-                                            columnName: '<<row.name>>',
-                                            component: 'ZdText',
-                                            text: '<<row.label>><<row.aggregationText>>',
-                                        },
-                                        {
-                                            name: 'tekGridColumnsOptionsFixedColumnRemove_<<row.name>>',
-                                            columnName: '<<row.name>>',
-                                            component: 'ZdIcon',
-                                            iconName: 'close',
-                                            events: {
-                                                click: `{{${TekGridColumnsOptionsModal.controllerName}.columnFixedRemoveClick}}`,
-                                            },
-                                        },
-                                    ],
-                                    events: {
-                                        click: `{{${TekGridColumnsOptionsModal.controllerName}.columnClick}}`,
-                                    },
-                                },
-                            },
-                        ],
-                    },
-                ],
-            },
-            {
-                name: 'tekGridColumnsOptionsVisibleRow',
-                component: 'ZdRow',
-                children: [
-                    {
-                        name: 'tekGridColumnsOptionsVisibleCol',
-                        component: 'ZdCol',
-                        cols: 12,
-                        cssClass: 'tek-grid-column-option-container-col',
-                        children: [
-                            {
-                                name: 'tekGridColumnsOptionsVisibleLabel',
-                                component: 'ZdText',
-                                text: 'TEKGRID_VISIBLE_COLUMNS',
-                                cssClass: 'tek-grid-column-option-label',
-                            },
-                            {
-                                name: 'tekGridColumnsOptionsVisibleSelectAll',
-                                component: 'ZdText',
-                                text: 'TEKGRID_SELECT_ALL',
-                                cssClass: 'tek-grid-column-option-select-all',
-                                events: {
-                                    click: `{{${TekGridColumnsOptionsModal.controllerName}.selectAll}}`,
-                                },
-                            },
-                            {
-                                name: 'tekGridColumnsOptionsVisibleDropHere',
-                                component: 'ZdText',
-                                text: 'TEKGRID_DROP_COLUMNS',
-                                cssClass: 'tek-grid-column-option-drop-here',
-                                isVisible: `{{${TekGridColumnsOptionsModal.controllerName}.hasNoVisibleColumns}}`,
-                            },
-                            {
-                                name: 'tekGridColumnsOptionsVisibleColumns',
-                                component: 'TekIterableComponentRender',
-                                id: 'tekGridColumnsOptionsVisibleColumns',
-                                cssClass: 'tek-grid-column-option-container',
-                                datasource: {
-                                    uniqueKey: 'name',
-                                    data: `{{${TekGridColumnsOptionsModal.controllerName}.visibleColumnData}}`,
-                                },
-                                noDataSlot: [],
-                                events: {
-                                    onMounted: `{{${TekGridColumnsOptionsModal.controllerName}.columnContainerMounted}}`,
-                                },
-                                componentMetadata: {
-                                    name: 'tekGridColumnsOptionsVisibleColumn_<<row.name>>',
-                                    component: 'ZdTag',
-                                    columnName: '<<row.name>>',
-                                    cssClass: 'tek-grid-column-option-box zd-elevation-1 ' + 'tek-grid-column-option-selected-<<row.selected>>',
-                                    tag: 'div',
-                                    children: [
-                                        {
-                                            name: 'tekGridColumnsOptionsVisibleColumnText_<<row.name>>',
-                                            columnName: '<<row.name>>',
-                                            component: 'ZdText',
-                                            text: '<<row.label>><<row.aggregationText>>',
-                                        },
-                                        {
-                                            name: 'tekGridColumnsOptionsVisibleColumnRemove_<<row.name>>',
-                                            columnName: '<<row.name>>',
-                                            component: 'ZdIcon',
-                                            iconName: 'close',
-                                            events: {
-                                                click: `{{${TekGridColumnsOptionsModal.controllerName}.columnVisibleRemoveClick}}`,
-                                            },
-                                        },
-                                    ],
-                                    events: {
-                                        click: `{{${TekGridColumnsOptionsModal.controllerName}.columnClick}}`,
-                                    },
-                                },
-                            },
-                        ],
-                    },
-                ],
-            },
-            {
-                name: 'tekGridColumnsOptionsGroupedRow',
-                component: 'ZdRow',
-                isVisible: `{{${TekGridColumnsOptionsModal.controllerName}.showGroups}}`,
-                children: [
-                    {
-                        name: 'tekGridColumnsOptionsGroupedCol',
-                        component: 'ZdCol',
-                        cssClass: 'tek-grid-column-option-container-col',
-                        cols: 12,
-                        children: [
-                            {
-                                name: 'tekGridColumnsOptionsGroupedLabel',
-                                component: 'ZdText',
-                                text: 'TEKGRID_GROUPED_COLUMNS',
-                                cssClass: 'tek-grid-column-option-label',
-                            },
-                            {
-                                name: 'tekGridColumnsOptionsGroupedSelectAll',
-                                component: 'ZdText',
-                                text: 'TEKGRID_SELECT_ALL',
-                                cssClass: 'tek-grid-column-option-select-all',
-                                events: {
-                                    click: `{{${TekGridColumnsOptionsModal.controllerName}.selectAll}}`,
-                                },
-                            },
-                            {
-                                name: 'tekGridColumnsOptionsGroupedDropHere',
-                                component: 'ZdText',
-                                text: 'TEKGRID_DROP_COLUMNS',
-                                cssClass: 'tek-grid-column-option-drop-here',
-                                isVisible: `{{${TekGridColumnsOptionsModal.controllerName}.hasNoGroupedColumns}}`,
-                            },
-                            {
-                                name: 'tekGridColumnsOptionsGroupedColumns',
-                                component: 'TekIterableComponentRender',
-                                id: 'tekGridColumnsOptionsGroupedColumns',
-                                cssClass: 'tek-grid-column-option-container',
-                                datasource: {
-                                    uniqueKey: 'name',
-                                    data: `{{${TekGridColumnsOptionsModal.controllerName}.groupedColumnData}}`,
-                                },
-                                noDataSlot: [],
-                                events: {
-                                    onMounted: `{{${TekGridColumnsOptionsModal.controllerName}.columnContainerMounted}}`,
-                                },
-                                componentMetadata: {
-                                    name: 'tekGridColumnsOptionsGroupedColumn_<<row.name>>',
-                                    component: 'ZdTag',
-                                    columnName: '<<row.name>>',
-                                    cssClass: 'tek-grid-column-option-box zd-elevation-1 ' + 'tek-grid-column-option-selected-<<row.selected>>',
-                                    tag: 'div',
-                                    children: [
-                                        {
-                                            name: 'tekGridColumnsOptionsGroupedColumnText_<<row.name>>',
-                                            columnName: '<<row.name>>',
-                                            component: 'ZdText',
-                                            text: '<<row.label>><<row.aggregationText>>',
-                                        },
-                                        {
-                                            name: 'tekGridColumnsOptionsGroupedColumnRemove_<<row.name>>',
-                                            columnName: '<<row.name>>',
-                                            component: 'ZdIcon',
-                                            iconName: 'close',
-                                            events: {
-                                                click: `{{${TekGridColumnsOptionsModal.controllerName}.columnGroupedRemoveClick}}`,
-                                            },
-                                        },
-                                    ],
-                                    events: {
-                                        click: `{{${TekGridColumnsOptionsModal.controllerName}.columnClick}}`,
-                                    },
-                                },
-                            },
-                        ],
-                    },
-                ],
-            },
-            {
-                name: 'tekGridColumnsOptionsOtherRow',
-                component: 'ZdRow',
-                children: [
-                    {
-                        name: 'tekGridColumnsOptionsOtherCol',
-                        component: 'ZdCol',
-                        cssClass: 'tek-grid-column-option-container-col',
-                        cols: 12,
-                        children: [
-                            {
-                                name: 'tekGridColumnsOptionsOtherLabel',
-                                component: 'ZdText',
-                                text: 'TEKGRID_OTHER_COLUMNS',
-                                cssClass: 'tek-grid-column-option-label',
-                            },
-                            {
-                                name: 'tekGridColumnsOptionsOtherSelectAll',
-                                component: 'ZdText',
-                                text: 'TEKGRID_SELECT_ALL',
-                                cssClass: 'tek-grid-column-option-select-all',
-                                events: {
-                                    click: `{{${TekGridColumnsOptionsModal.controllerName}.selectAll}}`,
-                                },
-                            },
-                            {
-                                name: 'tekGridColumnsOptionsOtherDropHere',
-                                component: 'ZdText',
-                                text: 'TEKGRID_DROP_COLUMNS',
-                                cssClass: 'tek-grid-column-option-drop-here',
-                                isVisible: `{{${TekGridColumnsOptionsModal.controllerName}.hasNoOtherColumns}}`,
-                            },
-                            {
-                                name: 'tekGridColumnsOptionsOtherColumns',
-                                component: 'TekIterableComponentRender',
-                                id: 'tekGridColumnsOptionsOtherColumns',
-                                cssClass: 'tek-grid-column-option-container',
-                                datasource: {
-                                    uniqueKey: 'name',
-                                    data: `{{${TekGridColumnsOptionsModal.controllerName}.otherColumnData}}`,
-                                },
-                                noDataSlot: [],
-                                events: {
-                                    onMounted: `{{${TekGridColumnsOptionsModal.controllerName}.columnContainerMounted}}`,
-                                },
-                                componentMetadata: {
-                                    name: 'tekGridColumnsOptionsOtherColumn_<<row.name>>',
-                                    component: 'ZdText',
-                                    columnName: '<<row.name>>',
-                                    text: '<<row.label>><<row.aggregationText>>',
-                                    cssClass: 'tek-grid-column-option-box zd-elevation-1 ' + 'tek-grid-column-option-selected-<<row.selected>>',
-                                    events: {
-                                        click: `{{${TekGridColumnsOptionsModal.controllerName}.columnClick}}`,
-                                    },
-                                },
-                            },
-                        ],
-                    },
-                ],
-            },
-            {
-                name: 'tekGridColumnsOptionsDetailColumnName',
-                component: 'ZdText',
-                cssClass: 'tek-grid-column-option-detail-name',
-                text: `{{${TekGridColumnsOptionsModal.controllerName}.detailColumnName}}`,
-                grid: {
-                    xs: 12,
-                },
-            },
-            {
-                name: 'tekGridColumnsOptionsDetailRow',
-                component: 'ZdRow',
-                children: [
-                    {
-                        name: 'tekGridColumnsOptionsDetailCol',
-                        component: 'ZdCol',
-                        cols: 12,
-                        children: [
-                            {
-                                name: 'tekGridColumnsOptionsDetailForm',
-                                component: 'ZdForm',
-                                cssClass: 'tek-grid-column-option-detail-form',
-                                children: [
-                                    {
-                                        name: 'tekGridColumnsOptionsColumnLabel',
-                                        component: 'ZdTextInput',
-                                        label: 'TEKGRID_COLUMN_LABEL',
-                                        showHelper: false,
-                                        clearable: false,
-                                        disabled: `{{${TekGridColumnsOptionsModal.controllerName}.hasNoSingleSelection}}`,
-                                        value: `{{${TekGridColumnsOptionsModal.controllerName}.selectedColumnLabel}}`,
-                                        grid: {
-                                            xs: 12,
-                                            md: 5,
-                                        },
-                                    },
-                                    {
-                                        name: 'tekGridColumnsOptionsColumnAlignment',
-                                        component: 'ZdSelect',
-                                        autocomplete: false,
-                                        label: 'TEKGRID_COLUMN_ALIGNMENT',
-                                        disabled: `{{${TekGridColumnsOptionsModal.controllerName}.hasNoSelectedColumn}}`,
-                                        showHelper: false,
-                                        clearable: false,
-                                        grid: {
-                                            xs: 6,
-                                            md: 2,
-                                        },
-                                        dataText: 'text',
-                                        dataValue: 'value',
-                                        datasource: {
-                                            data: [
-                                                { text: 'TEKGRID_LEFT', value: 'left' },
-                                                { text: 'TEKGRID_CENTER', value: 'center' },
-                                                { text: 'TEKGRID_RIGHT', value: 'right' },
-                                            ],
-                                            translate: 'text',
-                                        },
-                                        events: {
-                                            change: `{{${TekGridColumnsOptionsModal.controllerName}.selectChange}}`,
-                                            onMounted: `{{${TekGridColumnsOptionsModal.controllerName}.selectMounted}}`,
-                                        },
-                                    },
-                                    {
-                                        name: 'tekGridColumnsOptionsColumnAggregation',
-                                        component: 'ZdSelect',
-                                        isVisible: `{{${TekGridColumnsOptionsModal.controllerName}.showGroups}}`,
-                                        autocomplete: false,
-                                        label: 'TEKGRID_COLUMN_AGGREGATION',
-                                        showHelper: false,
-                                        disabled: `{{${TekGridColumnsOptionsModal.controllerName}.groupInSelection}}`,
-                                        dataText: 'text',
-                                        dataValue: 'value',
-                                        grid: {
-                                            xs: 6,
-                                            md: 2,
-                                        },
-                                        datasource: {
-                                            data: `{{${TekGridColumnsOptionsModal.controllerName}.aggregationData}}`,
-                                        },
-                                        events: {
-                                            change: `{{${TekGridColumnsOptionsModal.controllerName}.selectChange}}`,
-                                            onMounted: `{{${TekGridColumnsOptionsModal.controllerName}.selectMounted}}`,
-                                        },
-                                    },
-                                    {
-                                        name: 'tekGridColumnsOptionsColumnGroupOpened',
-                                        component: 'ZdCheckbox',
-                                        isVisible: `{{${TekGridColumnsOptionsModal.controllerName}.showGroups}}`,
-                                        cssClass: 'zd-form-input-align',
-                                        disabled: `{{${TekGridColumnsOptionsModal.controllerName}.notGroupInSelection}}`,
-                                        label: 'TEKGRID_COLUMN_GROUP_OPENED',
-                                        value: `{{${TekGridColumnsOptionsModal.controllerName}.selectedColumnGroupOpened}}`,
-                                        grid: {
-                                            xs: 6,
-                                            md: 3,
-                                        },
-                                    },
-                                ],
-                            },
-                        ],
-                    },
-                ],
-            },
-            {
-                name: 'tekGridColumnsOptionsDetailFooter',
-                component: 'ZdFooter',
-                padless: true,
-                color: 'transparent',
-                cssClass: 'zd-mt-6',
-                rightSlot: [
-                    {
-                        name: 'tekGridColumnsOptionsDetailCancel',
-                        component: 'ZdButton',
-                        outline: true,
-                        label: 'TEKGRID_CANCEL',
-                        events: {
-                            click: `{{${TekGridColumnsOptionsModal.controllerName}.cancelChanges}}`,
-                        },
-                    },
-                    {
-                        name: 'tekGridColumnsOptionsDetailApply',
-                        component: 'ZdButton',
-                        label: 'TEKGRID_APPLY',
-                        events: {
-                            click: `{{${TekGridColumnsOptionsModal.controllerName}.applyChanges}}`,
-                        },
-                    },
-                ],
-            },
-        ],
-    };
-    static modal;
-    static show(instance) {
-        if (!TekGridColumnsOptionsModal.modal) {
-            TekGridColumnsOptionsModal.modal = ModalService.create(TekGridColumnsOptionsModal.modalDef);
-            Loader.addController(TekGridColumnsOptionsModal.controllerName, TekGridColumnsOptionsController$1, [
-                TekGridColumnsOptionsModal.modal,
-            ]);
-        }
-        const controller = Loader.getInstance(TekGridColumnsOptionsModal.controllerName);
-        controller.instance = instance;
-        TekGridColumnsOptionsModal.modal.show();
-    }
-    static hide() {
-        if (TekGridColumnsOptionsModal.modal) {
-            TekGridColumnsOptionsModal.modal.hide();
-        }
-    }
-}
-
-const TekGridColumnsButtonProps$1 = {
-    ...ZdIterableColumnsButtonProps,
-    hideGroups: {
-        type: [Boolean, String],
-        default: false,
-    },
-};
-const tekGridColumnsButton$1 = defineComponent({
-    props: TekGridColumnsButtonProps$1,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, TekGridColumnsButton, TekGridColumnsButtonProps$1);
-        const buttonScope = useButtonInstance({ instance, root });
-        const menuIsOpened = ref(false);
-        const sortableInitialized = ref(false);
-        const teste = (a) => {
-            console.warn(a);
-        };
-        watch(menuIsOpened, () => {
-            if (!menuIsOpened.value || sortableInitialized.value)
-                return;
-            sortableInitialized.value = true;
-            nextTick(() => {
-                const columnsTableBody = document.querySelector(`#${instance.name}_columns_table tbody`);
-                if (columnsTableBody) {
-                    sortable.create(columnsTableBody, {
-                        handle: '.sortHandle',
-                        dragClass: 'tek-grid-columns-button-sortable-drag',
-                        onEnd: sortEnd,
-                    });
-                }
-            });
-        });
-        const gridGroupColumnNames = computed(() => {
-            return instance.iterableComponent.columns.filter((column) => column.grouped).map((column) => column.name) || [];
-        });
-        const sortEnd = (event) => {
-            const grid = instance.iterableComponent;
-            const newOrder = Array.from(event.srcElement.querySelectorAll('tr')).map((row) => row.getAttribute('name'));
-            const groupColumnNames = [];
-            const newColumns = newOrder.map((columnName) => {
-                const column = grid.getColumn(columnName);
-                if (column.grouped) {
-                    groupColumnNames.push(columnName);
-                }
-                return column;
-            });
-            const ignoredColumns = grid.columns.filter((column) => instance.ignoreColumns.indexOf(column.name) !== -1);
-            grid.columns = newColumns.concat(ignoredColumns);
-            if (grid.updateGrouping && JSON.stringify(groupColumnNames) !== JSON.stringify(gridGroupColumnNames)) {
-                grid.updateGrouping();
-            }
-            grid.changeLayout();
-        };
-        const moreOptions = () => {
-            TekGridColumnsOptionsModal.show(instance);
-        };
-        const close = () => {
-            menuIsOpened.value = false;
-        };
-        return {
-            ...buttonScope,
-            instance,
-            root,
-            menuIsOpened,
-            moreOptions,
-            close,
-            teste,
-            mergeProps,
-        };
-    },
-});
-
-const _hoisted_1$3 = { class: "tek-grid-columns-button-table-wrapper zd-mb-2" };
-const _hoisted_2$1 = ["id"];
-const _hoisted_3 = { key: 0 };
-const _hoisted_4 = { key: 1 };
-const _hoisted_5 = ["name"];
-const _hoisted_6 = { class: "tek-grid-columns-button-column-name sortHandle" };
-const _hoisted_7 = { key: 0 };
-const _hoisted_8 = {
-  key: 1,
-  class: "tek-grid-columns-button-column-aggregation"
-};
-const _hoisted_9 = { class: "tek-grid-columns-button-table-footer" };
-
-function render$8(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_zd_activator_wrapper = resolveComponent("zd-activator-wrapper");
-  const _component_v_tooltip = resolveComponent("v-tooltip");
-  const _component_zd_checkbox = resolveComponent("zd-checkbox");
-  const _component_zd_select = resolveComponent("zd-select");
-  const _component_zd_button = resolveComponent("zd-button");
-  const _component_v_card = resolveComponent("v-card");
-  const _component_v_menu = resolveComponent("v-menu");
-
-  return (openBlock(), createBlock(_component_v_menu, {
-    id: _ctx.instance.name,
-    modelValue: _ctx.menuIsOpened,
-    "onUpdate:modelValue": _cache[2] || (_cache[2] = $event => ((_ctx.menuIsOpened) = $event)),
-    class: normalizeClass(['zd-iterable-columns-button', 'tek-grid-columns-button', _ctx.instance.cssClass]),
-    style: normalizeStyle(_ctx.instance.cssStyle),
-    closeOnContentClick: false,
-    "offset-y": "",
-    "content-class": "zd-iterable-columns-button-options tek-grid-columns-button-options"
-  }, {
-    activator: withCtx(({ props: onMenu }) => [
-      createVNode(_component_v_tooltip, { bottom: "" }, {
-        activator: withCtx(({ props: onTooltip }) => [
-          createVNode(_component_zd_activator_wrapper, mergeProps({
-            "child-props": {
-              component: 'ZdButton',
-              name: _ctx.instance.name,
-              instanceObject: _ctx.instance,
-            }
-          }, _ctx.mergeProps(onMenu, onTooltip)), null, 16 /* FULL_PROPS */, ["child-props"])
-        ]),
-        default: withCtx(() => [
-          createElementVNode("span", null, toDisplayString(_ctx.$t('TEKGRID_COLUMNS')), 1 /* TEXT */)
-        ]),
-        _: 2 /* DYNAMIC */
-      }, 1024 /* DYNAMIC_SLOTS */)
-    ]),
-    default: withCtx(() => [
-      createVNode(_component_v_card, { class: "zd-pa-2" }, {
-        default: withCtx(() => [
-          createElementVNode("div", _hoisted_1$3, [
-            createElementVNode("table", {
-              class: "tek-grid-columns-button-table",
-              id: _ctx.instance.name + '_columns_table'
-            }, [
-              createElementVNode("thead", null, [
-                createElementVNode("tr", null, [
-                  _cache[3] || (_cache[3] = createElementVNode("th", null, [
-                    createCommentVNode("Name")
-                  ], -1 /* CACHED */)),
-                  createElementVNode("th", null, toDisplayString(_ctx.$t('TEKGRID_COLUMN_VISIBLE')), 1 /* TEXT */),
-                  (!_ctx.instance.hideGroups)
-                    ? (openBlock(), createElementBlock("th", _hoisted_3, toDisplayString(_ctx.$t('TEKGRID_COLUMN_GROUPED')), 1 /* TEXT */))
-                    : createCommentVNode("v-if", true),
-                  (!_ctx.instance.hideGroups)
-                    ? (openBlock(), createElementBlock("th", _hoisted_4, toDisplayString(_ctx.$t('TEKGRID_COLUMN_AGGREGATION')), 1 /* TEXT */))
-                    : createCommentVNode("v-if", true)
-                ])
-              ]),
-              createElementVNode("tbody", null, [
-                (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.instance.filteredColumns(), (column) => {
-                  return (openBlock(), createElementBlock("tr", {
-                    key: column.name,
-                    name: column.name
-                  }, [
-                    createElementVNode("td", _hoisted_6, [
-                      _cache[4] || (_cache[4] = createElementVNode("span", null, "⦙⦙", -1 /* CACHED */)),
-                      createTextVNode(toDisplayString(_ctx.$t(column.label)), 1 /* TEXT */)
-                    ]),
-                    createElementVNode("td", null, [
-                      createVNode(_component_zd_checkbox, {
-                        name: _ctx.instance.name + '_column_visible_' + column.name,
-                        value: column.grouped || column.isVisible,
-                        events: {
-                    change: _ctx.instance.controller.showHideTekColumn.bind(_ctx.instance.controller, column)
-                  }
-                      }, null, 8 /* PROPS */, ["name", "value", "events"])
-                    ]),
-                    (!_ctx.instance.hideGroups)
-                      ? (openBlock(), createElementBlock("td", _hoisted_7, [
-                          (column.type !== 'action')
-                            ? (openBlock(), createBlock(_component_zd_checkbox, {
-                                key: 0,
-                                name: _ctx.instance.name + '_column_grouped_' + column.name,
-                                value: column.grouped,
-                                events: {
-                    change: _ctx.instance.controller.changeGroupedColumn.bind(_ctx.instance.controller, column)
-                  }
-                              }, null, 8 /* PROPS */, ["name", "value", "events"]))
-                            : createCommentVNode("v-if", true)
-                        ]))
-                      : createCommentVNode("v-if", true),
-                    (!_ctx.instance.hideGroups)
-                      ? (openBlock(), createElementBlock("td", _hoisted_8, [
-                          (column.type !== 'action')
-                            ? (openBlock(), createBlock(_component_zd_select, mergeProps({
-                                key: 0,
-                                name: _ctx.instance.name + '_column_aggregation_' + column.name
-                              }, { ref_for: true }, {
-                    value: column.aggregation,
-                    disabled: column.grouped  || !column.isVisible,
-                    events: {
-                      change: _ctx.instance.controller.changeAggregationColumn.bind(_ctx.instance.controller, column)
-                    },
-                    dataText: 'text',
-                    dataValue: 'value',
-                    autocomplete: false,
-                    showHelper: false,
-                    showLabel: false,
-                    datasource: {
-                      data: _ctx.instance.getAggregationSelectData(),
-                    },
-                  }), null, 16 /* FULL_PROPS */, ["name"]))
-                            : createCommentVNode("v-if", true)
-                        ]))
-                      : createCommentVNode("v-if", true)
-                  ], 8 /* PROPS */, _hoisted_5))
-                }), 128 /* KEYED_FRAGMENT */))
-              ])
-            ], 8 /* PROPS */, _hoisted_2$1)
-          ]),
-          createElementVNode("div", _hoisted_9, [
-            createVNode(_component_zd_button, {
-              name: _ctx.instance.name + '_columns_table_footer_button',
-              label: "TEKGRID_MORE_OPTIONS",
-              small: "",
-              outline: "",
-              cssClass: "zd-ma-2 zd-mr-1",
-              onClick: _cache[0] || (_cache[0] = $event => (_ctx.moreOptions()))
-            }, null, 8 /* PROPS */, ["name"]),
-            createVNode(_component_zd_button, {
-              name: _ctx.instance.name + '_columns_table_footer_close',
-              label: "TEKGRID_CLOSE",
-              small: "",
-              cssClass: "zd-ma-2 zd-ml-1",
-              onClick: _cache[1] || (_cache[1] = $event => (_ctx.close()))
-            }, null, 8 /* PROPS */, ["name"])
-          ])
-        ]),
-        _: 1 /* STABLE */
-      })
-    ]),
-    _: 1 /* STABLE */
-  }, 8 /* PROPS */, ["id", "modelValue", "class", "style"]))
-}
-
-tekGridColumnsButton$1.render = render$8;
-tekGridColumnsButton$1.__file = "src/components/tek-grid/columns-button/TekGridColumnsButton.vue";
-
-const TekGridFilterButtonProps$1 = {
-    ...ZdButtonProps,
-    gridName: {
-        type: String,
-        default: '',
-    },
-    grid: {
-        type: [Object, String],
-        default: () => { },
-    },
-    showCheckboxAll: {
-        type: [Boolean, String],
-        default: false,
-    },
-};
-const tekGridFilterButtonComponent$1 = defineComponent({
-    props: TekGridFilterButtonProps$1,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, TekGridFilterButton, TekGridFilterButtonProps$1);
-        const buttonScope = useButtonInstance({ instance, root });
-        const filterClick = ({ event }) => {
-            instance.click(event);
-        };
-        return {
-            ...buttonScope,
-            instance,
-            root,
-            filterClick,
-        };
-    },
-});
-
-function render$7(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_zd_button = resolveComponent("zd-button");
-
-  return (openBlock(), createBlock(_component_zd_button, mergeProps({
-    id: `instance.name`,
-    name: `${_ctx.instance.name}_name`
-  }, {
-      icon: true,
-      cssClass: 'tek-grid-filter-button',
-      iconName: 'mdi-filter',
-      isVisible: _ctx.instance.grid.filterButton,
-      events: {
-        click: _ctx.filterClick,
-      },
-    }), null, 16 /* FULL_PROPS */, ["name"]))
-}
-
-tekGridFilterButtonComponent$1.render = render$7;
-tekGridFilterButtonComponent$1.__file = "src/components/tek-grid/filter-button/TekGridFilterButton.vue";
-
-var script$2 = defineComponent({
-    props: {
-        showDivider: {
-            type: Boolean,
-            default: true,
-        },
-        level: {
-            type: Number,
-            default: 0,
-        },
-        footer: {
-            type: Boolean,
-            default: false,
-        },
-    },
-    setup() {
-        return {};
-    },
-});
-
-function render$6(_ctx, _cache, $props, $setup, $data, $options) {
-  return (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.level, (n) => {
-    return (openBlock(), createElementBlock("span", {
-      key: n,
-      class: normalizeClass([
-      'tek-grid-indentation',
-      {
-        'tek-grid-indentation--corner': _ctx.footer && n === _ctx.level,
-        'tek-grid-indentation--divider': _ctx.showDivider,
-      }
-    ])
-    }, null, 2 /* CLASS */))
-  }), 128 /* KEYED_FRAGMENT */))
-}
-
-script$2.render = render$6;
-script$2.__file = "src/components/tek-grid/indentation/TekGridIndentation.vue";
-
-const TekGridLayoutOptionsProps$1 = {
-    ...ZdComponentRenderProps,
-    // Zeedhi 3.0
-};
-const layoutOptionsComponent$1 = defineComponent({
-    props: TekGridLayoutOptionsProps$1,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, TekGridLayoutOptions, TekGridLayoutOptionsProps$1);
-        const { applyLayout: applyTekGridLayout, getColumnElements, getTableWidth } = useTableLayout();
-        onMounted(() => {
-            instance.viewApplyLayout = applyLayout;
-            instance.viewGetCurrentLayout = getCurrentLayout;
-        });
-        const confirmLayoutClick = ({ component }) => {
-            const layoutName = component.value;
-            if (layoutName) {
-                const newLayout = getCurrentLayout(layoutName);
-                instance.newLayout(newLayout);
-            }
-            menuActive.value = false;
-            component.value = '';
-        };
-        const datasourceDynamicFilter = () => {
-            const datasource = instance.grid.datasource;
-            if (datasource instanceof TekRestDatasource)
-                return datasource.dynamicFilter;
-            return {};
-        };
-        const changeLayout = (layout) => {
-            instance.updateLayout(layout.name, getCurrentLayout(layout.name));
-        };
-        const applyLayout = (layout) => {
-            const defaultLayout = {
-                originalDatasourceOrder: instance.originalDatasourceOrder,
-                originalDatasourceFilter: instance.originalDatasourceFilter,
-                originalColumnProps: instance.originalColumnProps,
-                originalDatasourceDynamicFilter: instance.originalDatasourceDynamicFilter,
-            };
-            applyTekGridLayout({ layout, defaultLayout, changeLayoutCallback: changeLayout });
-            menuActive.value = false;
-        };
-        const getCurrentLayout = (layoutName) => {
-            const { grid } = instance;
-            const gridWidth = getTableWidth();
-            const columnElementsDict = getColumnElements();
-            return {
-                name: layoutName,
-                gridWidth,
-                order: grid.datasource.order,
-                filter: grid.datasource.filter,
-                dynamicFilter: datasourceDynamicFilter(),
-                columns: grid.columns.map((column, index) => {
-                    const columnElement = columnElementsDict[index];
-                    return {
-                        name: column.name,
-                        label: column.label,
-                        align: column.align,
-                        width: columnElement ? window.getComputedStyle(columnElement).width : 'unset',
-                        minWidth: column.minWidth,
-                        maxWidth: column.maxWidth,
-                        isVisible: column.isVisible,
-                        fixed: column.fixed,
-                        grouped: column.grouped,
-                        groupOpened: column.groupOpened,
-                        aggregation: column.aggregation,
-                        filterHelperValue: instance.getHelperValue(column),
-                    };
-                }),
-            };
-        };
-        const menuActive = ref(false);
-        const applyOrUpdateLayout = (event, layoutName) => {
-            if (instance.layoutEdited) {
-                instance.updateLayout(layoutName, getCurrentLayout(layoutName));
-                event.stopImmediatePropagation();
-                menuActive.value = false;
-            }
-            else {
-                instance.applyLayout(layoutName);
-            }
-        };
-        const deleteLayout = (event, layoutName) => {
-            instance.deleteLayout(layoutName);
-            event.stopImmediatePropagation();
-        };
-        return {
-            instance,
-            root,
-            menuActive,
-            confirmLayoutClick,
-            applyOrUpdateLayout,
-            deleteLayout,
-            mergeProps,
-        };
-    },
-});
-
-const _hoisted_1$2 = {
-  key: 0,
-  class: "tek-grid-layout-item-buttons"
-};
-
-function render$5(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_zd_activator_wrapper = resolveComponent("zd-activator-wrapper");
-  const _component_v_badge = resolveComponent("v-badge");
-  const _component_v_tooltip = resolveComponent("v-tooltip");
-  const _component_v_list_item = resolveComponent("v-list-item");
-  const _component_zd_text_input = resolveComponent("zd-text-input");
-  const _component_zd_button = resolveComponent("zd-button");
-  const _component_v_list = resolveComponent("v-list");
-  const _component_v_menu = resolveComponent("v-menu");
-
-  return (openBlock(), createBlock(_component_v_menu, {
-    id: _ctx.instance.name,
-    name: _ctx.instance.name,
-    class: normalizeClass(['tek-grid-layout-options', _ctx.instance.cssClass]),
-    style: normalizeStyle(_ctx.instance.cssStyle),
-    modelValue: _ctx.menuActive,
-    "onUpdate:modelValue": _cache[2] || (_cache[2] = $event => ((_ctx.menuActive) = $event)),
-    "offset-y": "",
-    closeOnContentClick: false
-  }, {
-    activator: withCtx(({ props: onMenu }) => [
-      createVNode(_component_v_tooltip, { bottom: "" }, {
-        activator: withCtx(({ props: onTooltip }) => [
-          withDirectives(createVNode(_component_v_badge, {
-            overlap: "",
-            class: "tek-grid-layout-options-badge",
-            dot: "",
-            offsetX: 12,
-            offsetY: 12,
-            value: _ctx.instance.layoutEdited
-          }, {
-            default: withCtx(() => [
-              createVNode(_component_zd_activator_wrapper, mergeProps({ ref: "root" }, _ctx.mergeProps(onMenu, onTooltip), {
-                "child-props": {
-                component: 'ZdButton',
-                name: _ctx.instance.name + '_button',
-                icon: true,
-                iconName: 'mdi-table-star',
-                isVisible: _ctx.instance.isVisible,
-              }
-              }), null, 16 /* FULL_PROPS */, ["child-props"])
-            ]),
-            _: 2 /* DYNAMIC */
-          }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["value"]), [
-            [vShow, _ctx.instance.isVisible]
-          ])
-        ]),
-        default: withCtx(() => [
-          createElementVNode("span", null, toDisplayString(_ctx.$t('LAYOUT') + (_ctx.instance.currentLayoutName || _ctx.$t('DEFAULT_LAYOUT'))), 1 /* TEXT */)
-        ]),
-        _: 2 /* DYNAMIC */
-      }, 1024 /* DYNAMIC_SLOTS */)
-    ]),
-    default: withCtx(() => [
-      createVNode(_component_v_list, null, {
-        default: withCtx(() => [
-          createVNode(_component_v_list_item, {
-            class: normalizeClass(['tek-grid-layout-item-header', { edited: _ctx.instance.layoutEdited }])
-          }, {
-            default: withCtx(() => [
-              createTextVNode(toDisplayString(_ctx.instance.layoutEdited ? _ctx.$t('LAYOUT_MODIFIED') : _ctx.$t('LAYOUT_NOT_MODIFIED')), 1 /* TEXT */)
-            ]),
-            _: 1 /* STABLE */
-          }, 8 /* PROPS */, ["class"]),
-          createVNode(_component_v_list_item, null, {
-            default: withCtx(() => [
-              createVNode(_component_zd_text_input, mergeProps({
-                name: _ctx.instance.name+'_new_layout',
-                ref: "inputNewLayout"
-              }, {
-            showHelper: false,
-            showLabel: false,
-            placeholder: 'NEW_LAYOUT',
-            appendOuterIcon: 'mdi-check',
-            autofocus: true,
-            autofill: false,
-            keyMap: {
-              enter: {
-                event: _ctx.confirmLayoutClick,
-                input: true,
-                active: true,
-              },
-            },
-            events: {
-              appendOuterIconClick: _ctx.confirmLayoutClick,
-            },
-          }), null, 16 /* FULL_PROPS */, ["name"])
-            ]),
-            _: 1 /* STABLE */
-          }),
-          (!_ctx.instance.layoutEdited)
-            ? (openBlock(), createBlock(_component_v_list_item, {
-                key: 0,
-                class: normalizeClass(['tek-grid-layout-item', {
-          selected: _ctx.instance.currentLayoutName === ''
-        }]),
-                onClick: _cache[0] || (_cache[0] = $event => (_ctx.instance.applyLayout('')))
-              }, {
-                default: withCtx(() => [
-                  createTextVNode(toDisplayString(_ctx.$t('DEFAULT_LAYOUT')), 1 /* TEXT */)
-                ]),
-                _: 1 /* STABLE */
-              }, 8 /* PROPS */, ["class"]))
-            : createCommentVNode("v-if", true),
-          (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.instance.layoutNames, (item) => {
-            return (openBlock(), createBlock(_component_v_list_item, {
-              key: item,
-              class: normalizeClass(['tek-grid-layout-item', {
-          selected: item === _ctx.instance.currentLayoutName
-        }]),
-              onClick: $event => (_ctx.applyOrUpdateLayout($event, item))
-            }, {
-              default: withCtx(() => [
-                createTextVNode(toDisplayString(item) + " ", 1 /* TEXT */),
-                (!_ctx.instance.layoutEdited)
-                  ? (openBlock(), createElementBlock("span", _hoisted_1$2, [
-                      createVNode(_component_zd_button, mergeProps({
-                        name: 'tek-grid-layout-item-delete_' + _ctx.instance.name + item
-                      }, { ref_for: true }, {
-              small: true,
-              icon: true,
-              iconName: 'mdi-trash-can-outline',
-              events: {
-                click: ({ event }) => { _ctx.deleteLayout(event, item); },
-              },
-            }), null, 16 /* FULL_PROPS */, ["name"])
-                    ]))
-                  : createCommentVNode("v-if", true)
-              ]),
-              _: 2 /* DYNAMIC */
-            }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["class", "onClick"]))
-          }), 128 /* KEYED_FRAGMENT */)),
-          (_ctx.instance.layoutEdited)
-            ? (openBlock(), createBlock(_component_v_list_item, {
-                key: 1,
-                class: normalizeClass(['tek-grid-layout-item-discard']),
-                onClick: _cache[1] || (_cache[1] = $event => (_ctx.instance.discardChanges()))
-              }, {
-                default: withCtx(() => [
-                  createVNode(_component_zd_button, {
-                    small: "",
-                    color: "error darken-2",
-                    width: "100%",
-                    name: "tek-grid-layout-item-discard-changes",
-                    label: "LAYOUT_DISCART_CHANGES"
-                  })
-                ]),
-                _: 1 /* STABLE */
-              }))
-            : createCommentVNode("v-if", true)
-        ]),
-        _: 1 /* STABLE */
-      })
-    ]),
-    _: 1 /* STABLE */
-  }, 8 /* PROPS */, ["id", "name", "class", "style", "modelValue"]))
-}
-
-layoutOptionsComponent$1.render = render$5;
-layoutOptionsComponent$1.__file = "src/components/tek-grid/layout-options/TekGridLayoutOptions.vue";
-
-var script$1 = defineComponent({
-    props: {
-        isSelected: {
-            type: Boolean,
-            required: true,
-        },
-        selectable: {
-            type: Boolean,
-            required: true,
-        },
-        selectionDisabled: {
-            type: Boolean,
-            required: true,
-        },
-        cellSelection: {
-            type: Boolean,
-            required: true,
-        },
-        isCurrent: {
-            type: Function,
-            required: true,
-        },
-        columns: {
-            type: Array,
-            required: true,
-        },
-        row: {
-            type: Object,
-            required: true,
-        },
-        fixedLeft: {
-            type: Object,
-            required: true,
-        },
-        fixedRight: {
-            type: Object,
-            required: true,
-        },
-    },
-    emits: ['focusin'],
-    setup(props, { emit }) {
-        const focusin = (event) => {
-            emit('focusin', { event, row: props.row });
-        };
-        const getLevel = (row) => {
-            if (!row.groupHeaders)
-                return 0;
-            const { length } = row.groupHeaders;
-            return length + 1;
-        };
-        return {
-            focusin,
-            getLevel,
-        };
-    },
-});
-
-const _hoisted_1$1 = {
-  key: 0,
-  class: /*@__PURE__*/normalizeClass([
-        'zd-grid__cell',
-        'zd-grid__cell--fixed',
-        'zd-grid__selectable-cell',
-      ])
-};
-
-function render$4(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_tek_grid_indentation = resolveComponent("tek-grid-indentation");
-  const _component_zd_grid_cell = resolveComponent("zd-grid-cell");
-  const _component_table_row = resolveComponent("table-row");
-
-  return (openBlock(), createBlock(_component_table_row, {
-    cssClass: [
-      'tek-grid-footer-row',
-      { 'tek-grid-footer-row--summary': _ctx.row.groupSummary }
-    ]
-  }, {
-    default: withCtx(() => [
-      (_ctx.selectable)
-        ? (openBlock(), createElementBlock("td", _hoisted_1$1))
-        : createCommentVNode("v-if", true),
-      (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.columns, (column, index, ___, _cached) => {
-        const _memo = ([_ctx.row, column, _ctx.fixedLeft, _ctx.fixedRight, _ctx.cellSelection, _ctx.isCurrent({ row: _ctx.row, column })]);
-        if (_cached && _cached.key === column.name && isMemoSame(_cached, _memo)) return _cached
-        const _item = (openBlock(), createBlock(_component_zd_grid_cell, {
-          key: column.name,
-          row: _ctx.row,
-          column: column,
-          cssClass: [
-        {
-          'zd-grid__cell--fixed': column.fixed,
-          'zd-grid__action-cell--fixed': column.actionFixed,
-        },
-      ],
-          cssStyle: [{
-        left: column.fixed ? _ctx.fixedLeft[column.name] : 'unset',
-        right: column.actionFixed ? _ctx.fixedRight[column.name] : 'unset',
-      }],
-          cellSelection: _ctx.cellSelection,
-          isCurrent: _ctx.isCurrent({ row: _ctx.row, column }),
-          onFocus: $event => (_ctx.cellFocus($event, column)),
-          onFocusin: $event => (_ctx.focusin($event, column))
-        }, {
-          prepend: withCtx(() => [
-            (index === 0)
-              ? (openBlock(), createBlock(_component_tek_grid_indentation, {
-                  key: 0,
-                  footer: "",
-                  level: _ctx.getLevel(_ctx.row)
-                }, null, 8 /* PROPS */, ["level"]))
-              : createCommentVNode("v-if", true)
-          ]),
-          _: 2 /* DYNAMIC */
-        }, 1032 /* PROPS, DYNAMIC_SLOTS */, ["row", "column", "cssClass", "cssStyle", "cellSelection", "isCurrent", "onFocus", "onFocusin"]));
-        _item.memo = _memo;
-        return _item
-      }, _cache, 0), 128 /* KEYED_FRAGMENT */))
-    ]),
-    _: 1 /* STABLE */
-  }, 8 /* PROPS */, ["cssClass"]))
-}
-
-script$1.render = render$4;
-script$1.__file = "src/components/tek-grid/row/TekGridFooterRow.vue";
-
-var script = defineComponent({
-    props: {
-        isSelected: {
-            type: Boolean,
-            required: true,
-        },
-        isCurrentRow: {
-            type: Boolean,
-            required: true,
-        },
-        selectable: {
-            type: Boolean,
-            required: true,
-        },
-        selectionDisabled: {
-            type: Boolean,
-            required: true,
-        },
-        cellSelection: {
-            type: Boolean,
-            required: true,
-        },
-        isCurrent: {
-            type: Function,
-            required: true,
-        },
-        row: {
-            type: Object,
-            required: true,
-        },
-        indeterminate: {
-            type: Boolean,
-            required: true,
-        },
-    },
-    emits: ['click', 'checkboxClick', 'focusin', 'expandClick'],
-    setup(props, { emit }) {
-        const click = (event) => {
-            emit('click', event);
-        };
-        const checkboxClick = (event) => {
-            emit('checkboxClick', event);
-        };
-        const focusin = (event) => {
-            emit('focusin', { event, row: props.row });
-        };
-        const expandClick = (event) => {
-            emit('expandClick', { event, row: props.row });
-        };
-        return {
-            click,
-            focusin,
-            checkboxClick,
-            expandClick,
-        };
-    },
-});
-
-const _hoisted_1 = ["tabindex"];
-const _hoisted_2 = { class: "tek-grid__group-text zd-ml-2" };
-
-function render$3(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_zd_grid_checkbox = resolveComponent("zd-grid-checkbox");
-  const _component_tek_grid_indentation = resolveComponent("tek-grid-indentation");
-  const _component_v_icon = resolveComponent("v-icon");
-  const _component_table_row = resolveComponent("table-row");
-
-  return (openBlock(), createBlock(_component_table_row, {
-    class: normalizeClass([
-      'tek-grid-group-row',
-      { 'tek-grid-row-group--summary': _ctx.row.groupSummary }
-    ]),
-    isCurrentRow: _ctx.isCurrentRow,
-    onClick: _cache[3] || (_cache[3] = $event => (_ctx.click($event)))
-  }, {
-    default: withCtx(() => [
-      (_ctx.selectable)
-        ? (openBlock(), createBlock(_component_zd_grid_checkbox, {
-            key: 0,
-            disabled: _ctx.selectionDisabled,
-            isSelected: _ctx.isSelected,
-            indeterminate: _ctx.indeterminate,
-            cellSelection: _ctx.cellSelection,
-            isCurrent: _ctx.isCurrent({ row: _ctx.row }),
-            onFocusin: _cache[0] || (_cache[0] = $event => (_ctx.focusin($event))),
-            onClick: _cache[1] || (_cache[1] = withModifiers($event => (_ctx.checkboxClick($event)), ["stop"]))
-          }, null, 8 /* PROPS */, ["disabled", "isSelected", "indeterminate", "cellSelection", "isCurrent"]))
-        : createCommentVNode("v-if", true),
-      createElementVNode("td", {
-        colspan: 999,
-        class: normalizeClass(
-        [
-          'zd-grid__cell',
-          'text-left',
-          'tek-grid-group-cell',
-          'zd-grid__cell--fixed',
-        ]),
-        style: normalizeStyle(`left: ${(_ctx.selectable ? 40 : 0)}px`),
-        tabindex: _ctx.cellSelection ? 0 : ''
-      }, [
-        createElementVNode("span", {
-          class: normalizeClass([
-          'tek-grid-group-cell__container'
-        ]),
-          style: normalizeStyle(`left: ${(_ctx.selectable ? 48 : 8)}px`)
-        }, [
-          createVNode(_component_tek_grid_indentation, {
-            level: _ctx.row.groupHeaders.length
-          }, null, 8 /* PROPS */, ["level"]),
-          (openBlock(), createBlock(_component_v_icon, {
-            class: normalizeClass({ closed: !_ctx.row.groupOpened }),
-            onClick: _cache[2] || (_cache[2] = $event => (_ctx.expandClick($event))),
-            key: `${_ctx.row.groupIndex}_${_ctx.row.groupValue}`
-          }, {
-            default: withCtx(() => [
-              createTextVNode(toDisplayString(_ctx.$getIcon('expand')), 1 /* TEXT */)
-            ]),
-            _: 1 /* STABLE */
-          }, 8 /* PROPS */, ["class"])),
-          createElementVNode("span", _hoisted_2, toDisplayString((_ctx.row.groupLabel? _ctx.row.groupLabel + ': ': '') + _ctx.row.groupValue), 1 /* TEXT */)
-        ], 4 /* STYLE */)
-      ], 12 /* STYLE, PROPS */, _hoisted_1)
-    ]),
-    _: 1 /* STABLE */
-  }, 8 /* PROPS */, ["class", "isCurrentRow"]))
-}
-
-script.render = render$3;
-script.__file = "src/components/tek-grid/row/TekGridGroupRow.vue";
-
-const TekLoadingProps$1 = {
-    ...ZdLoadingProps,
-    text: {
-        type: String,
-        default: '',
-    },
-    image: {
-        type: String,
-        default: undefined,
-    },
-};
-const loadingComponent = defineComponent({
-    props: TekLoadingProps$1,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, Loading, TekLoadingProps$1);
-        return {
-            instance,
-            root,
-        };
-    },
-});
-
-function render$2(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_zd_loading = resolveComponent("zd-loading");
-
-  return (openBlock(), createBlock(_component_zd_loading, mergeProps({ ref: "root" }, {
-      name: _ctx.instance.name,
-      text: _ctx.instance.text,
-      image: _ctx.instance.image,
-      zIndex: _ctx.instance.zIndex,
-      textColor: _ctx.textColor,
-      loadingColor: _ctx.loadingColor,
-      size: _ctx.size,
-      loadingWidth: _ctx.loadingWidth,
-      opacity: _ctx.opacity,
-    }), null, 16 /* FULL_PROPS */))
-}
-
-loadingComponent.render = render$2;
-loadingComponent.__file = "src/components/tek-loading/TekLoading.vue";
-
-const TekUserInfoProps$1 = {
-    ...ZdUserInfoProps,
-    aboutImage: {
-        type: String,
-        default: '',
-    },
-    defaultEmail: {
-        type: String,
-        default: '',
-    },
-    versionInfo: {
-        type: [Object, String],
-        default: null,
-    },
-    versionUrl: {
-        type: String,
-        default: '',
-    },
-    bottomSlot: {
-        type: Array,
-        default: undefined,
-        watch: false,
-    },
-};
-const tekUserInfoComponent$1 = defineComponent({
-    props: TekUserInfoProps$1,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, TekUserInfo, TekUserInfoProps$1);
-        const { click, focus, blur, mouseenter, mouseleave } = useGetMethods(instance, root);
-        return {
-            instance,
-            root,
-            click,
-            focus,
-            blur,
-            mouseenter,
-            mouseleave,
-        };
-    }
-});
-
-function render$1(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_zd_user_info = resolveComponent("zd-user-info");
-
-  return (openBlock(), createBlock(_component_zd_user_info, {
-    id: _ctx.instance.name,
-    "instance-object": _ctx.instance,
-    name: "user-info"
-  }, null, 8 /* PROPS */, ["id", "instance-object"]))
-}
-
-tekUserInfoComponent$1.render = render$1;
-tekUserInfoComponent$1.__file = "src/components/tek-user-info/TekUserInfo.vue";
-
-const TekUserInfoListProps$1 = {
-    ...ZdListProps,
-    parentName: {
-        type: String,
-        default: '',
-    },
-    dense: {
-        type: [Boolean, String],
-        default: true,
-    },
-};
-const tekUserInfoListComponent$1 = defineComponent({
-    props: TekUserInfoListProps$1,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, TekUserInfoList, TekUserInfoListProps$1);
-        const { click, focus, blur, mouseenter, mouseleave } = useGetMethods(instance, root);
-        return {
-            instance,
-            root,
-            click,
-            focus,
-            blur,
-            mouseenter,
-            mouseleave,
-        };
-    }
-});
-
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_zd_list = resolveComponent("zd-list");
-
-  return (openBlock(), createBlock(_component_zd_list, {
-    id: _ctx.instance.name,
-    "instance-object": _ctx.instance,
-    name: "list"
-  }, null, 8 /* PROPS */, ["id", "instance-object"]))
-}
-
-tekUserInfoListComponent$1.render = render;
-tekUserInfoListComponent$1.__file = "src/components/tek-user-info/TekUserInfoList.vue";
-
-const TekBreadcrumbHeaderProps = {
-    ...ZdComponentRenderProps,
-    title: {
-        type: String,
-        default: '',
-    },
-    breadcrumb: {
-        type: Object,
-        default: {},
-        watch: false,
-    },
-    rightSlot: {
-        type: Array,
-        default: () => [],
-        watch: false,
-    },
-};
-const breadcrumbHeaderComponent = defineComponent({
-    props: TekBreadcrumbHeaderProps,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, BreadcrumbHeader, TekBreadcrumbHeaderProps);
-        return {
-            instance,
-            root,
-        };
-    },
-});
-
-const TekLoadingProps = {
-    ...ZdLoadingProps,
-    text: {
-        type: String,
-        default: '',
-    },
-    image: {
-        type: String,
-        default: undefined,
-    },
-};
-defineComponent({
-    props: TekLoadingProps,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, Loading, TekLoadingProps);
-        return {
-            instance,
-            root,
-        };
-    },
-});
-
-const components = {
-    TekBreadcrumbHeader: breadcrumbHeaderComponent$1,
-    TekGrid: gridEditableComponent$1,
-    TekGridColumnFilter: tekGridColumnFilter$1,
-    TekGridHeaderRow: script$3,
-    TekGridColumnsButton: tekGridColumnsButton$1,
-    TekGridFilterButton: tekGridFilterButtonComponent$1,
-    TekGridIndentation: script$2,
-    TekGridLayoutOptions: layoutOptionsComponent$1,
-    TekGridFooterRow: script$1,
-    TekGridGroupRow: script,
-    TekLoading: loadingComponent,
-    TekUserInfo: tekUserInfoComponent$1,
-    TekUserInfoList: tekUserInfoListComponent$1,
-};
-
-const TekGridProps = buildProps({
-    ...ZdGridEditableProps,
-    toolbarSlot: {
-        type: Array,
-        default: undefined,
-        watch: false,
-    },
-    title: {
-        type: String,
-        default: '',
-    },
-    addButton: {
-        type: [Boolean, String],
-        default: false,
-    },
-    deleteButton: {
-        type: [String, Boolean],
-        default: 'none',
-    },
-    columnsButton: {
-        type: [Boolean, String],
-        default: false,
-    },
-    columnsButtonIgnore: {
-        type: [Array, String],
-        default: () => [],
-    },
-    showEditButtons: {
-        type: [Boolean, String],
-        default: true,
-    },
-    filterButton: {
-        type: [Boolean, String],
-        default: false,
-    },
-    modalFilterProps: {
-        type: Object,
-        default: () => ({}),
-    },
-    showSearch: {
-        type: [Boolean, String],
-        default: true,
-    },
-    columnFilterButton: {
-        type: [Boolean, String],
-        default: false,
-    },
-    hideActions: {
-        type: [Boolean, String],
-        default: false,
-    },
-    actions: {
-        type: Array,
-        default: () => [],
-        watch: false,
-    },
-    dragColumns: {
-        type: [Boolean, String],
-        default: true,
-    },
-    resizeColumns: {
-        type: [Boolean, String],
-        default: true,
-    },
-    showLayoutOptions: {
-        type: [Boolean, String],
-        default: true,
-    },
-    showExport: {
-        type: [String, Boolean],
-        default: false,
-    },
-    showReload: {
-        type: [Boolean, String],
-        default: true,
-    },
-    exportConfig: {
-        type: Array,
-    },
-    exportActions: {
-        type: Array,
-        watch: false,
-    },
-    groupsOpened: {
-        type: [Boolean, String],
-        default: false,
-    },
-    showSummaryTotal: {
-        type: [Boolean, String],
-        default: true,
-    },
-    mainGrid: {
-        type: [Boolean, String],
-        default: true,
-    },
-    xlsDefaultType: {
-        type: String,
-        default: undefined,
-    },
-    showCheckboxAllFilter: {
-        type: [Boolean, String],
-        default: Config.gridShowCheckboxAllFilter,
-    },
-    toolbarOpened: {
-        type: [Boolean],
-        default: true,
-    },
-    defaultFilter: {
-        type: Object,
-    },
-    reportTitle: {
-        type: String,
-    },
-    editNewRowsOnly: {
-        type: [Boolean, String],
-        default: false,
-    },
-});
-const gridEditableComponent = defineComponent({
-    props: TekGridProps,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, TekGrid, TekGridProps);
-        const renderedData = computed(() => {
-            if (instance.isGrouped()) {
-                return instance.getGroupedData();
-            }
-            return instance.getData();
-        });
-        const visibleData = computed(() => {
-            return renderedData.value.filter((row) => instance.isItemVisible(row));
-        });
-        const isNavigableRow = (element) => {
-            return element.classList.contains('zd-grid__row')
-                && !element.classList.contains('tek-grid-group-row')
-                && !element.classList.contains('tek-grid-footer-row');
-        };
-        const gridEditableScope = useGridEditableInstance({
-            instance,
-            root,
-            renderedData: visibleData,
-            isNavigableRow,
-        });
-        const rootEl = getRootElement(root);
-        const { visibleColumns } = useGridColumns({
-            instance,
-            rootEl,
-            visibilityCondition: (column) => column.isVisible && !column.grouped,
-        });
-        provideTableLayout({ instance, rootEl });
-        const debouncedDatasourceGet = debounce((instance) => {
-            const event = new Event('change', { cancelable: true });
-            instance.callEvent('beforeApplyFilter', { component: instance, event });
-            if (event.defaultPrevented)
-                return;
-            const { datasource } = instance;
-            if (datasource instanceof TekRestDatasource || datasource instanceof TekMemoryDatasource) {
-                datasource.updateDynamicFilter();
-            }
-            else {
-                datasource.get();
-            }
-        }, 500);
-        const filter = computed(() => {
-            if (instance.datasource instanceof TekRestDatasource || instance.datasource instanceof TekMemoryDatasource) {
-                return instance.datasource.dynamicFilter;
-            }
-            const datasourceFilter = instance.datasource.filter;
-            const simpleFilter = {};
-            Object.keys(datasourceFilter).forEach((key) => {
-                simpleFilter[key] = [{ relation: 'AND', operation: 'CONTAINS', value: datasourceFilter[key] }];
-            });
-            return simpleFilter;
-        });
-        const setFilter = (newFilter) => {
-            if (Utils.isEqual(filter, newFilter))
-                return;
-            if (instance.datasource instanceof TekRestDatasource || instance.datasource instanceof TekMemoryDatasource) {
-                instance.datasource.dynamicFilter = cloneDeep(newFilter);
-            }
-            else {
-                const normalFilter = {};
-                Object.keys(newFilter).forEach((key) => {
-                    if (!newFilter[key][0].value)
-                        return;
-                    normalFilter[key] = newFilter[key][0].value;
-                });
-                instance.datasource.filter = normalFilter;
-            }
-            debouncedDatasourceGet(instance);
-            instance.changeLayout();
-        };
-        const columnHasFilter = (columnName) => {
-            return instance.columnHasFilter(columnName);
-        };
-        const isRowVisible = (row, index) => {
-            return instance.isItemVisible(row) && gridEditableScope.shouldRender(index);
-        };
-        const isCurrentRowGroup = (row) => {
-            const { uniqueKey, currentRow } = instance.datasource;
-            return !!((row.group && row.groupValue === currentRow.groupValue) ||
-                (row[uniqueKey] && row[uniqueKey] === currentRow[uniqueKey]));
-        };
-        const isGroupSelectIndeterminate = (item) => {
-            let hasSelected = false;
-            let hasNotSelected = false;
-            const { uniqueKey } = instance.datasource;
-            item.children.forEach((child) => {
-                const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
-                hasSelected = hasSelected || idx !== -1;
-                hasNotSelected = hasNotSelected || idx === -1;
-            });
-            return hasSelected && hasNotSelected;
-        };
-        const isGroupSelected = (item) => {
-            return item.children.every((child) => {
-                const { uniqueKey } = instance.datasource;
-                const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
-                return idx !== -1;
-            });
-        };
-        const selectGroupRowClick = (row, isSelected, event) => {
-            nextTick(() => {
-                const rootElement = getRootElement(root);
-                instance.selectGroupClick(row, isSelected, event, rootElement.value);
-            });
-        };
-        const selectGroup = (item, event) => {
-            const { uniqueKey } = instance.datasource;
-            const isSelected = isGroupSelected(item);
-            if (!isSelected) {
-                // here we fetch the item from renderedData because vuetify isSelected checks for object reference
-                // so we need to find the item inside renderedData to call selectRow() with the correct reference
-                // https://github.com/vuetifyjs/vuetify/blob/master/packages/vuetify/src/components/VDataTable/composables/select.ts#L128
-                const items = item.children.map((child) => {
-                    return renderedData.value.find((row) => child[uniqueKey] === row[uniqueKey]);
-                });
-                items.forEach((child) => {
-                    if (!child)
-                        return;
-                    const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
-                    if (idx === -1) {
-                        instance.selectRow(child, true);
-                    }
-                });
-            }
-            else {
-                item.children.forEach((child) => {
-                    const idx = instance.selectedRows.findIndex((row) => child[uniqueKey] === row[uniqueKey]);
-                    if (idx !== -1) {
-                        instance.selectRow(child, false);
-                    }
-                });
-            }
-            selectGroupRowClick(item, !isSelected, event);
-        };
-        const openGroup = (item) => {
-            instance.openGroup(item);
-        };
-        const isGroup = (item) => {
-            return !!item.group;
-        };
-        const isFooter = (item) => {
-            return !!item.groupFooter;
-        };
-        const groupColumnNames = computed(() => {
-            return instance.columns.filter((column) => column.grouped).map((column) => column.name) || [];
-        });
-        return {
-            ...gridEditableScope,
-            instance,
-            root,
-            filter,
-            setFilter,
-            columnHasFilter,
-            visibleColumns,
-            isRowVisible,
-            isCurrentRowGroup,
-            isGroupSelectIndeterminate,
-            selectGroup,
-            isGroup,
-            openGroup,
-            renderedData,
-            isGroupSelected,
-            groupColumnNames,
-            isFooter,
-            visibleData,
-        };
-    },
-});
-
-const TekGridColumnFilterProps = {
-    hasFilterData: {
-        type: Boolean,
-        default: false,
-    },
-    column: {
-        type: Object,
-        required: true,
-    },
-    modelValue: {
-        type: Array,
-        default: [],
-    },
-    instanceName: {
-        type: String,
-        required: true,
-    },
-    filterRelationsDatasource: {
-        type: [Object, null],
-        required: false,
-    },
-    filterOperationsDatasource: {
-        type: [Object, null],
-        required: false,
-    },
-    isHovering: {
-        type: Boolean,
-        default: false,
-    },
-    multiple: {
-        type: Boolean,
-        required: true,
-    },
-};
-const tekGridColumnFilter = defineComponent({
-    props: TekGridColumnFilterProps,
-    inheritAttrs: false,
-    emits: ['update:modelValue'],
-    setup(props, ctx) {
-        const getValueInputName = (index) => `${props.instanceName}-${props.column.name}-filter-value-${index}`;
-        const focusValueInput = (index) => {
-            const valueInputName = getValueInputName(index);
-            const input = Metadata.getInstance(valueInputName);
-            input.setFocus();
-        };
-        const createNewFilter = () => {
-            return reactive({
-                operation: 'CONTAINS',
-                relation: 'AND',
-                value: undefined,
-            });
-        };
-        let newFilter = createNewFilter();
-        const convertToDateFormat = (value, revert) => {
-            const dateFormat = props.column.componentProps.dateFormat || Config.dateFormat;
-            const displayFormat = props.column.componentProps.displayFormat || Config.displayFormat;
-            if (revert) {
-                if (dayjs(value, displayFormat).isValid() || !dayjs(value, dateFormat).isValid()) {
-                    return value;
-                }
-                return dayjs(value, dateFormat).format(displayFormat);
-            }
-            if (dayjs(value, dateFormat).isValid() || !dayjs(value, displayFormat).isValid()) {
-                return value;
-            }
-            return dayjs(value, displayFormat).format(dateFormat);
-        };
-        const checkDateValueFormat = (value, revert = false) => {
-            if (!['ZdDate', 'ZdDateRange'].includes(props.column.componentProps.component))
-                return value;
-            if (Array.isArray(value)) {
-                return value.map((item) => convertToDateFormat(item, revert));
-            }
-            return convertToDateFormat(value, revert);
-        };
-        // use WeakMap to avoid memory leaks
-        const idMap = new WeakMap();
-        let idCounter = 0;
-        // retrieves a unique id for each item
-        const getId = (item) => {
-            if (!idMap.has(item)) {
-                idMap.set(item, `__item__${idCounter++}`);
-            }
-            return idMap.get(item);
-        };
-        // use computed to generate unique ids for each filter item
-        // this is needed for the v-for :key updates
-        const modelWithIds = computed(() => {
-            if (!props.multiple) {
-                if (props.modelValue.length > 0) {
-                    return [{ id: getId(props.modelValue[0]), item: props.modelValue[0] }];
-                }
-                return [{ id: getId(newFilter), item: newFilter }];
-            }
-            return [...props.modelValue, newFilter].map((item) => ({
-                id: getId(item),
-                item,
-            }));
-        });
-        const debounceUpdateModel = debounce((modelValue) => {
-            if (Utils.isEqual(modelValue, props.modelValue))
-                return;
-            ctx.emit('update:modelValue', modelValue);
-            newFilter = createNewFilter();
-        }, 500);
-        const changeRelation = (index, { component }) => {
-            const modelValue = cloneDeep(props.modelValue);
-            const isNewFilter = index === modelValue.length;
-            const filter = isNewFilter ? newFilter : modelValue[index];
-            const { value } = component;
-            focusValueInput(index);
-            // update item type value
-            filter.relation = value;
-            if (isNewFilter)
-                return;
-            debounceUpdateModel(modelValue);
-        };
-        const changeOperation = (index, { component }) => {
-            const modelValue = cloneDeep(props.modelValue);
-            const filterItem = modelValue[index];
-            const isNewFilter = index === modelValue.length;
-            const filter = isNewFilter ? newFilter : filterItem;
-            const { value } = component;
-            focusValueInput(index);
-            // if operation is IN, NOT_IN or BETWEEN, value should be an array
-            if (isArrayOperation(value)) {
-                filter.value = Array.isArray(filterItem.value) ? filterItem.value : [filterItem.value];
-            }
-            // update item type value
-            filter.operation = value;
-            if (isNewFilter)
-                return;
-            debounceUpdateModel(modelValue);
-        };
-        const changeValue = (item, index, { component }) => {
-            const modelValue = cloneDeep(props.modelValue);
-            const filter = cloneDeep(item);
-            const { value } = component;
-            const isNewFilter = props.multiple && index === modelValue.length;
-            let formattedValue = value;
-            if (value && isArrayOperation(filter.operation)) {
-                formattedValue = value.split(';');
-            }
-            filter.value = checkDateValueFormat(formattedValue);
-            if (!props.multiple) {
-                debounceUpdateModel([filter]);
-                return;
-            }
-            if (isNewFilter) {
-                // only emit event when newFilter has value
-                if (!filter.value)
-                    return;
-                debounceUpdateModel([...modelValue, filter]);
-                return;
-            }
-            if (!filter.value) {
-                // when removing the last (not new) filter, should pass its operation and relation to the new filter
-                if (index === modelValue.length - 1) {
-                    newFilter.operation = filter.operation;
-                    newFilter.relation = filter.relation;
-                }
-                modelValue.splice(index, 1);
-                // if the removed filter was the first, should set the new first relation to AND
-                if (modelValue.length > 0 && index === 0) {
-                    modelValue[0].relation = 'AND';
-                }
-                // if the removed filter was the last, should set the newFilter relation to AND
-                if (modelValue.length === 0) {
-                    newFilter.relation = 'AND';
-                }
-            }
-            debounceUpdateModel(modelValue);
-        };
-        const getComponentType = (operation) => {
-            return isArrayOperation(operation) ? 'ZdTextInput' : props.column.componentProps.component;
-        };
-        const getComponentHint = (operation) => {
-            return isArrayOperation(operation) ? 'TEKGRID_MULTIPLE_VALUE_HINT' : '';
-        };
-        const getItemValue = (item) => {
-            return isArrayOperation(item.operation) ? item.value.join(';') : item.value;
-        };
-        return {
-            changeValue,
-            changeRelation,
-            changeOperation,
-            getValueInputName,
-            newFilter,
-            getComponentType,
-            getComponentHint,
-            modelWithIds,
-            getItemValue,
-        };
-    },
-});
-
-const TekGridColumnsButtonProps = {
-    ...ZdIterableColumnsButtonProps,
-    hideGroups: {
-        type: [Boolean, String],
-        default: false,
-    },
-};
-const tekGridColumnsButton = defineComponent({
-    props: TekGridColumnsButtonProps,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, TekGridColumnsButton, TekGridColumnsButtonProps);
-        const buttonScope = useButtonInstance({ instance, root });
-        const menuIsOpened = ref(false);
-        const sortableInitialized = ref(false);
-        const teste = (a) => {
-            console.warn(a);
-        };
-        watch(menuIsOpened, () => {
-            if (!menuIsOpened.value || sortableInitialized.value)
-                return;
-            sortableInitialized.value = true;
-            nextTick(() => {
-                const columnsTableBody = document.querySelector(`#${instance.name}_columns_table tbody`);
-                if (columnsTableBody) {
-                    sortable.create(columnsTableBody, {
-                        handle: '.sortHandle',
-                        dragClass: 'tek-grid-columns-button-sortable-drag',
-                        onEnd: sortEnd,
-                    });
-                }
-            });
-        });
-        const gridGroupColumnNames = computed(() => {
-            return instance.iterableComponent.columns.filter((column) => column.grouped).map((column) => column.name) || [];
-        });
-        const sortEnd = (event) => {
-            const grid = instance.iterableComponent;
-            const newOrder = Array.from(event.srcElement.querySelectorAll('tr')).map((row) => row.getAttribute('name'));
-            const groupColumnNames = [];
-            const newColumns = newOrder.map((columnName) => {
-                const column = grid.getColumn(columnName);
-                if (column.grouped) {
-                    groupColumnNames.push(columnName);
-                }
-                return column;
-            });
-            const ignoredColumns = grid.columns.filter((column) => instance.ignoreColumns.indexOf(column.name) !== -1);
-            grid.columns = newColumns.concat(ignoredColumns);
-            if (grid.updateGrouping && JSON.stringify(groupColumnNames) !== JSON.stringify(gridGroupColumnNames)) {
-                grid.updateGrouping();
-            }
-            grid.changeLayout();
-        };
-        const moreOptions = () => {
-            TekGridColumnsOptionsModal.show(instance);
-        };
-        const close = () => {
-            menuIsOpened.value = false;
-        };
-        return {
-            ...buttonScope,
-            instance,
-            root,
-            menuIsOpened,
-            moreOptions,
-            close,
-            teste,
-            mergeProps,
-        };
-    },
-});
-
-const TekGridFilterButtonProps = {
-    ...ZdButtonProps,
-    gridName: {
-        type: String,
-        default: '',
-    },
-    grid: {
-        type: [Object, String],
-        default: () => { },
-    },
-    showCheckboxAll: {
-        type: [Boolean, String],
-        default: false,
-    },
-};
-const tekGridFilterButtonComponent = defineComponent({
-    props: TekGridFilterButtonProps,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, TekGridFilterButton, TekGridFilterButtonProps);
-        const buttonScope = useButtonInstance({ instance, root });
-        const filterClick = ({ event }) => {
-            instance.click(event);
-        };
-        return {
-            ...buttonScope,
-            instance,
-            root,
-            filterClick,
-        };
-    },
-});
-
-const TekGridLayoutOptionsProps = {
-    ...ZdComponentRenderProps,
-    // Zeedhi 3.0
-};
-const layoutOptionsComponent = defineComponent({
-    props: TekGridLayoutOptionsProps,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, TekGridLayoutOptions, TekGridLayoutOptionsProps);
-        const { applyLayout: applyTekGridLayout, getColumnElements, getTableWidth } = useTableLayout();
-        onMounted(() => {
-            instance.viewApplyLayout = applyLayout;
-            instance.viewGetCurrentLayout = getCurrentLayout;
-        });
-        const confirmLayoutClick = ({ component }) => {
-            const layoutName = component.value;
-            if (layoutName) {
-                const newLayout = getCurrentLayout(layoutName);
-                instance.newLayout(newLayout);
-            }
-            menuActive.value = false;
-            component.value = '';
-        };
-        const datasourceDynamicFilter = () => {
-            const datasource = instance.grid.datasource;
-            if (datasource instanceof TekRestDatasource)
-                return datasource.dynamicFilter;
-            return {};
-        };
-        const changeLayout = (layout) => {
-            instance.updateLayout(layout.name, getCurrentLayout(layout.name));
-        };
-        const applyLayout = (layout) => {
-            const defaultLayout = {
-                originalDatasourceOrder: instance.originalDatasourceOrder,
-                originalDatasourceFilter: instance.originalDatasourceFilter,
-                originalColumnProps: instance.originalColumnProps,
-                originalDatasourceDynamicFilter: instance.originalDatasourceDynamicFilter,
-            };
-            applyTekGridLayout({ layout, defaultLayout, changeLayoutCallback: changeLayout });
-            menuActive.value = false;
-        };
-        const getCurrentLayout = (layoutName) => {
-            const { grid } = instance;
-            const gridWidth = getTableWidth();
-            const columnElementsDict = getColumnElements();
-            return {
-                name: layoutName,
-                gridWidth,
-                order: grid.datasource.order,
-                filter: grid.datasource.filter,
-                dynamicFilter: datasourceDynamicFilter(),
-                columns: grid.columns.map((column, index) => {
-                    const columnElement = columnElementsDict[index];
-                    return {
-                        name: column.name,
-                        label: column.label,
-                        align: column.align,
-                        width: columnElement ? window.getComputedStyle(columnElement).width : 'unset',
-                        minWidth: column.minWidth,
-                        maxWidth: column.maxWidth,
-                        isVisible: column.isVisible,
-                        fixed: column.fixed,
-                        grouped: column.grouped,
-                        groupOpened: column.groupOpened,
-                        aggregation: column.aggregation,
-                        filterHelperValue: instance.getHelperValue(column),
-                    };
-                }),
-            };
-        };
-        const menuActive = ref(false);
-        const applyOrUpdateLayout = (event, layoutName) => {
-            if (instance.layoutEdited) {
-                instance.updateLayout(layoutName, getCurrentLayout(layoutName));
-                event.stopImmediatePropagation();
-                menuActive.value = false;
-            }
-            else {
-                instance.applyLayout(layoutName);
-            }
-        };
-        const deleteLayout = (event, layoutName) => {
-            instance.deleteLayout(layoutName);
-            event.stopImmediatePropagation();
-        };
-        return {
-            instance,
-            root,
-            menuActive,
-            confirmLayoutClick,
-            applyOrUpdateLayout,
-            deleteLayout,
-            mergeProps,
-        };
-    },
-});
-
-const TekUserInfoProps = {
-    ...ZdUserInfoProps,
-    aboutImage: {
-        type: String,
-        default: '',
-    },
-    defaultEmail: {
-        type: String,
-        default: '',
-    },
-    versionInfo: {
-        type: [Object, String],
-        default: null,
-    },
-    versionUrl: {
-        type: String,
-        default: '',
-    },
-    bottomSlot: {
-        type: Array,
-        default: undefined,
-        watch: false,
-    },
-};
-const tekUserInfoComponent = defineComponent({
-    props: TekUserInfoProps,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, TekUserInfo, TekUserInfoProps);
-        const { click, focus, blur, mouseenter, mouseleave } = useGetMethods(instance, root);
-        return {
-            instance,
-            root,
-            click,
-            focus,
-            blur,
-            mouseenter,
-            mouseleave,
-        };
-    }
-});
-
-const TekUserInfoListProps = {
-    ...ZdListProps,
-    parentName: {
-        type: String,
-        default: '',
-    },
-    dense: {
-        type: [Boolean, String],
-        default: true,
-    },
-};
-const tekUserInfoListComponent = defineComponent({
-    props: TekUserInfoListProps,
-    inheritAttrs: false,
-    setup(props, ctx) {
-        const { instance, root } = useCreateInstance(props, ctx, TekUserInfoList, TekUserInfoListProps);
-        const { click, focus, blur, mouseenter, mouseleave } = useGetMethods(instance, root);
-        return {
-            instance,
-            root,
-            click,
-            focus,
-            blur,
-            mouseenter,
-            mouseleave,
-        };
-    }
-});
-
-Icons.addIcons({
-    add: 'mdi-plus-box',
-    delete: 'mdi-trash-can-outline',
-    refresh: 'mdi-refresh',
-    more: 'mdi-dots-vertical',
-    filter: 'mdi-filter',
-    confirmLayout: 'mdi-check',
-    updateLayout: 'mdi-square-edit-outline',
-    layout: 'mdi-table-star',
-});
-const TeknisaComponents = {
-    install(app) {
-        Object.keys(components).forEach((id) => {
-            app.component(id, components[id]);
-        });
-    },
-};
-
-export { breadcrumbHeaderComponent as TekBreadcrumbHeader, gridEditableComponent as TekGrid, tekGridColumnFilter as TekGridColumnFilter, tekGridColumnsButton as TekGridColumnsButton, tekGridFilterButtonComponent as TekGridFilterButton, layoutOptionsComponent as TekGridLayoutOptions, loadingComponent as TekLoading, TekLoadingProps, tekUserInfoComponent as TekUserInfo, tekUserInfoListComponent as TekUserInfoList, TeknisaComponents as default };