@green-code-studio/objects-list 1.13.1 → 1.14.0

package/demoDist/demo.js

@@ -306,7 +306,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \****************************/
 /***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ObjectsList: () => (/* binding */ ObjectsList)\n/* harmony export */ });\n/* harmony import */ var _tableView_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./tableView.js */ \"./src/tableView.js\");\n/* harmony import */ var _listView_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./listView.js */ \"./src/listView.js\");\n/* harmony import */ var _i18n_xml__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./i18n.xml */ \"./src/i18n.xml\");\n/* harmony import */ var _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./paginationButtons.js */ \"./src/paginationButtons.js\");\n/* harmony import */ var _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @green-code-studio/context-menu/dist/index.mjs */ \"./node_modules/@green-code-studio/context-menu/dist/index.mjs\");\n/* harmony import */ var _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./utils/concurencyLimiter.js */ \"./src/utils/concurencyLimiter.js\");\n/* harmony import */ var _idsSet_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./idsSet.js */ \"./src/idsSet.js\");\n/* harmony import */ var _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./ConfigPopup.js */ \"./src/ConfigPopup.js\");\n/* harmony import */ var fast_creator__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! fast-creator */ \"./node_modules/fast-creator/dist/entry.js\");\n/* harmony import */ var _calendarView_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./calendarView.js */ \"./src/calendarView.js\");\n/* harmony import */ var _graphView_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./graphView.js */ \"./src/graphView.js\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nclass ObjectsList extends HTMLElement {\r\n    constructor(datasource, defaultView = 'tableView') {\r\n        super();\r\n        this.columns = [];\r\n        this.columnsReordered = [];\r\n        this.columnsReorderedChanged = false;\r\n        this.hiddenColumns = new Set()\r\n        this.columnFilters = new Map();\r\n        this.generateActions = () => [];\r\n        this.insideViewClass = defaultView === 'calendarView' ? _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView : _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n        this.icon = 'icon-document';\r\n        this.loadConcurencyLimiter = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.loadConcurencyLimiterTotal = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.datasource = datasource;\r\n        this.datasource.onchange = () => this.refresh();\r\n        this.start = 0;\r\n        this.limit = 10\r\n        this.total = 0;\r\n        this.selected = new _idsSet_js__WEBPACK_IMPORTED_MODULE_6__.IdsSet();\r\n        this.selectedMain = null;\r\n        this.dataById = new Map();\r\n        this.initFoot();\r\n        this.addEventListener('contextmenu', e => this.showGlobalContextMenu(e));\r\n        this.resizeBinded = this.resize.bind(this);\r\n        this.popstateBinded = this.readUrl.bind(this);\r\n        this.readUrl()\r\n        this.addEventListener('keydown', e => this.onkeydown(e));\r\n        this.infiniteScrollEnabled = false;\r\n    }\r\n\r\n    connectedCallback() {\r\n        addEventListener('resize', this.resizeBinded);\r\n        addEventListener(\"popstate\", this.popstateBinded)\r\n        if (this.paramsInLocalStorage) {\r\n            this.applyParams(JSON.parse(localStorage['objectList_params_' + this.paramsInLocalStorage] ?? 'null'));\r\n        }\r\n    }\r\n\r\n    disconnectedCallback() {\r\n        removeEventListener('resize', this.resizeBinded);\r\n        removeEventListener(\"popstate\", this.popstateBinded)\r\n    }\r\n\r\n    get columns() {\r\n        return this._columns;\r\n    }\r\n\r\n    set columns(value) {\r\n        this._columns = value;\r\n        this.columnsReordered = value;\r\n        this.columnsReorderedChanged = false;\r\n    }\r\n\r\n    get visibleColumns() {\r\n        return this.columnsReordered.filter(x => !this.hiddenColumns.has(x.dataName ?? x.sortName))\r\n    }\r\n\r\n    refreshLimit() {\r\n        this.limit = this.insideView.calcMaxVisibleItems(this.clientHeight - this.foot.clientHeight - 2);\r\n        if (this.limit < 1) this.limit = 1;\r\n        if (this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView) {\r\n            this.start = 0;\r\n            this.limit = 1000000;\r\n        } else if (this.infiniteScrollEnabled) {\r\n            this.limit = Math.ceil(this.limit / 20) * 20 + 40;\r\n        } else {\r\n            this.start = Math.floor(Math.min(this.total, this.start) / this.limit) * this.limit;\r\n        }\r\n    }\r\n\r\n    async refresh() {\r\n        console.log('refresh')\r\n        this.classList.toggle('infiniteScrollEnabled', this.infiniteScrollEnabled);\r\n\r\n        if (!this.insideView || !(this.insideView instanceof this.insideViewClass))\r\n            this.initInsideView();\r\n        else if (this.insideView.refreshHeader) {\r\n            this.insideView.params = this.insideViewParams\r\n            this.insideView.refreshHeader()\r\n        }\r\n\r\n        this.refreshLimit();\r\n        const refreshSymbol = Symbol();\r\n        this.lastRefreshSymbol = refreshSymbol;\r\n        this.lastRefreshSymbolTotal = refreshSymbol;\r\n        this.pagination.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? 'none' : '';\r\n        this.dateInput.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? '' : 'none';\r\n        if (this.insideView instanceof _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView) {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.getSummary(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentSummary = data.summary;\r\n                this.insideView.loadData(data);\r\n            });\r\n        } else if (this.asyncTotal) {\r\n            const promise1 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                const data = await this.datasource.getRows(this);\r\n\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            const promise2 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                let dataTotal = this.datasource.getTotal(this);\r\n                const x = await dataTotal\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                this.total = x.total;\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            await promise1;\r\n            await promise2;\r\n        } else {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.get(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.total = data.total;\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n        }\r\n\r\n\r\n        while (this.filterShortContainer.firstChild) {\r\n            this.filterShortContainer.firstChild.remove()\r\n        }\r\n        if (this.columnFilters.size) {\r\n            this.filterShortContainer.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.filtersCount') + ': ' + this.columnFilters.size}));\r\n            const clearButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.clearFilters')});\r\n            clearButton.onclick = () => {\r\n                this.columnFilters.clear();\r\n                this.refresh();\r\n            }\r\n            this.filterShortContainer.append(clearButton);\r\n        }\r\n        if (this.paramsInUrl) {\r\n            this.setUrl();\r\n        }\r\n        if (this.paramsInLocalStorage) {\r\n            this.setLocalStorage();\r\n        }\r\n    }\r\n\r\n    setUrl() {\r\n        const query = new URLSearchParams(document.location.search)\r\n        const prev = Object.fromEntries([...query]);\r\n        const next = new URLSearchParams(this.serializeParams(prev))\r\n        console.log('dddddcccc')\r\n        console.log(query)\r\n        if (prev.toString() !== next.toString()) {\r\n            const url = new URL(document.location);\r\n            url.search = next.toString();\r\n            history.pushState(null, '', url.toString());\r\n        }\r\n    }\r\n\r\n    setLocalStorage() {\r\n        const prev = JSON.parse(localStorage.getItem('objectList_params_' + this.paramsInLocalStorage));\r\n        const next = this.serializeParams(prev);\r\n        if (JSON.stringify(prev) !== JSON.stringify(next)) {\r\n            localStorage.setItem('objectList_params_' + this.paramsInLocalStorage, JSON.stringify(next));\r\n        }\r\n    }\r\n\r\n    serializeParams(old = {}) {\r\n        old = old || {};\r\n        let ret = {};\r\n        let changed = false;\r\n        var visibleColumns = this.visibleColumns.map(x => x.dataName ?? x.sortName).join();\r\n        if (old.visibleColumns || this.hiddenColumns.size || this.columnsReorderedChanged) {\r\n            ret.visibleColumns = visibleColumns;\r\n            changed = true;\r\n\r\n        }\r\n        if (old.sort || this.sort?.col) {\r\n            ret.sort = this.sort?.col;\r\n\r\n        }\r\n        if (old.sortDesc == 'true' || this.sort?.desc) {\r\n            ret.sortDesc = this.sort?.desc ? 'true' : 'false';\r\n\r\n\r\n        }\r\n        if (old.columnFilters || this.columnFilters) {\r\n            ret.columnFilters = JSON.stringify(Array.from(this.columnFilters.entries()));\r\n\r\n        }\r\n\r\n        if (old.insideView || this.insideViewName) {\r\n            ret.insideView = this.insideViewName;\r\n        }\r\n        const currentDate = new Date().toISOString().substring(0, 7);\r\n        if (old.date || this.date != currentDate) {\r\n            ret.date = this.date;\r\n        }\r\n        return ret;\r\n    }\r\n\r\n    get insideViewName() {\r\n        if (this.insideViewClass == _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView) {\r\n            if (this.insideViewParams?.wide)\r\n                return 'tableWideView';\r\n            else\r\n                return 'tableView'\r\n        } else {\r\n            return 'listView'\r\n        }\r\n    }\r\n\r\n    set insideViewName(value) {\r\n        if (this.insideViewName == value) return;\r\n        if (value == 'tableView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: false}\r\n        } else if (value == 'tableWideView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: true}\r\n        } else if (value == 'listView') {\r\n            this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'calendarView') {\r\n            this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'graphView') {\r\n            this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView\r\n            this.insideViewParams = {}\r\n        }\r\n    }\r\n\r\n    readUrl() {\r\n\r\n        const query = new URLSearchParams(document.location.search)\r\n        const params = Object.fromEntries([...query]);\r\n        this.applyParams(params)\r\n    }\r\n\r\n    applyParams(params) {\r\n        if (params?.visibleColumns) {\r\n            const splitted = params.visibleColumns.split(',');\r\n            this.hiddenColumns = new Set(this.columns.map(x => x.dataName ?? x.sortName));\r\n            for (const name of splitted) {\r\n                this.hiddenColumns.delete(name);\r\n            }\r\n            for (let i = splitted.length - 1; i > 0; i--) {\r\n                const column = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i - 1]);\r\n                const next = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i]);\r\n                if (column) {\r\n                    this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n                    if (next)\r\n                        this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n                    else\r\n                        this.columnsReordered.push(column)\r\n                    this.columnsReorderedChanged = true;\r\n                }\r\n            }\r\n        }\r\n        if (params?.sort) {\r\n            this.sort = {\r\n                col: params.sort,\r\n                desc: params.sortDesc === 'true'\r\n            };\r\n        }\r\n        if (params?.columnFilters) {\r\n            this.columnFilters = new Map(JSON.parse(params.columnFilters));\r\n        }\r\n        if (params?.insideView) {\r\n            this.insideViewName = params.insideView;\r\n        }\r\n        if (params?.date) {\r\n            this.date = params.date;\r\n        }\r\n    }\r\n\r\n    initInsideView() {\r\n        if (this.insideView) {\r\n            this.insideView.remove();\r\n        }\r\n        this.insideView = new this.insideViewClass(this, this.insideViewParams);\r\n        this.insertBefore(this.insideView, this.foot);\r\n        this.insideView.refresh = () => this.refresh();\r\n        this.insideView.onPaginationChanged = (start, limit) => {\r\n            if (this.start != start) {\r\n                this.start = start;\r\n                //this.limit=limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n    fillDataById(rows) {\r\n        for (let row of rows) {\r\n            this.dataById.set(parseInt(row.id), row);\r\n        }\r\n    }\r\n\r\n    getSelectedData() {\r\n        let data = Array.from(this.dataById).filter(([id, row]) => this.selected.has(id)).map(([id, row]) => row);\r\n        if (data.length > 0) return data;\r\n        else if (this.dataById[this.selectedMain])\r\n            return [this.dataById[this.selectedMain]]\r\n        else return [];\r\n    }\r\n\r\n    initFoot() {\r\n        this.foot = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.foot');\r\n        this.append(this.foot);\r\n        let menuButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button.menuButton span.icon-settings');\r\n        this.foot.append(menuButton)\r\n        menuButton.onclick = e => this.showConfigPopup();\r\n        this.pagination = new _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__.PaginationButtons();\r\n        this.pagination.onpageclick = (page) => {\r\n            this.start = page * this.limit;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.pagination);\r\n        this.dateInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {type: 'month', value: new Date().toISOString().substring(0, 7)});\r\n        this.dateInput.onchange = date => {\r\n            this.start = 0;\r\n            this.date = this.dateInput.value;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.dateInput);\r\n        this.filterShortContainer = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.filterShortContainer');\r\n        this.foot.append(this.filterShortContainer);\r\n        this.searchForm = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('form', {className: 'search'});\r\n        this.foot.append(this.searchForm);\r\n        this.searchForm.onsubmit = e => e.preventDefault();\r\n        const searchInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {\r\n            name: 'search',\r\n            type: 'search',\r\n            placeholder: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.search')\r\n        });\r\n        this.searchForm.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)(searchInput));\r\n        searchInput.oninput = e => {\r\n            this.start = 0;\r\n            this.refresh();\r\n        }\r\n\r\n    }\r\n\r\n    get search() {\r\n        if (!this.foot) return '';\r\n        const searchForm = this.foot.querySelector('.search');\r\n        if (!searchForm) return '';\r\n        return searchForm.search.value;\r\n    }\r\n\r\n    showGlobalContextMenu(e) {\r\n        let elements = [{\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.paginationMode'),\r\n            icon: 'icon-pagination',\r\n            onclick: () => {\r\n                this.infiniteScrollEnabled = false;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.scrollMode'),\r\n            icon: 'icon-scroll',\r\n            onclick: () => {\r\n                this.infiniteScrollEnabled = true;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.tableView'),\r\n            icon: 'icon-table',\r\n            onclick: () => {\r\n                this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.listView'),\r\n            icon: 'icon-list',\r\n            onclick: () => {\r\n                this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView;\r\n                this.refresh();\r\n            }\r\n        }];\r\n        if (this.dateRowCallback != null) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.calendarView'),\r\n                 icon: 'icon-calendar',\r\n                onclick: () => {\r\n                    this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.datasource.canGetSummary != null) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.graphView'),\r\n                 icon: 'icon-graph',\r\n                onclick: () => {\r\n                    this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.allowTableEdit) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.startMultiEdit'),\r\n                icon: 'icon-edit',\r\n                onclick: () => {\r\n                    this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                    this.refresh();\r\n                    this.insideView.startMultiEdit();\r\n                }\r\n            });\r\n        }\r\n        _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__.ContextMenu.openContextMenu(e, elements);\r\n    }\r\n\r\n    resize() {\r\n        let limit = this.limit;\r\n        this.refreshLimit();\r\n        if (limit != this.limit) {\r\n            this.refresh();\r\n        }\r\n    }\r\n\r\n    multiEditChanged(id, data, save = false) {\r\n        this.datasource.multiEditChanged(id, data, save);\r\n    }\r\n\r\n    showConfigPopup() {\r\n        if (this.querySelector('config-popup')) {\r\n            this.querySelector('config-popup').remove()\r\n        } else {\r\n            const popup = new _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__.ConfigPopup(this)\r\n            this.append(popup)\r\n        }\r\n    }\r\n\r\n    gotoUrl(url) {\r\n        window.location.href = url;\r\n    }\r\n\r\n    onkeydown(e) {\r\n        if (e.ctrlKey) {\r\n            if (e.key == 'ArrowLeft' || e.key == 'ArrowRight') {\r\n                let page = Math.floor(this.start / this.limit);\r\n                page += (e.key == 'ArrowLeft' ? -1 : 1);\r\n                if (page < 0) page = 0;\r\n                else if (page > 0 && page > Math.ceil(this.total / this.limit) - 1) page = Math.ceil(this.total / this.limit) - 1;\r\n                this.start = page * this.limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n\r\n    reorderColumns(column, next) {\r\n        console.log('reorderColumns')\r\n        if (column) {\r\n            this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n            if (next)\r\n                this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n            else\r\n                this.columnsReordered.push(column)\r\n\r\n            this.columnsReorderedChanged = true;\r\n            if (this.insideView.setColumnsWidths) {\r\n                this.insideView.setColumnsWidths()\r\n            }\r\n        }\r\n    }\r\n}\r\n\r\ncustomElements\r\n    .define(\r\n        'data-view'\r\n        ,\r\n        ObjectsList\r\n    )\r\n;\r\n\n\n//# sourceURL=webpack://@green-code-studio/objects-list/./src/objectsList.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ObjectsList: () => (/* binding */ ObjectsList)\n/* harmony export */ });\n/* harmony import */ var _tableView_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./tableView.js */ \"./src/tableView.js\");\n/* harmony import */ var _listView_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./listView.js */ \"./src/listView.js\");\n/* harmony import */ var _i18n_xml__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./i18n.xml */ \"./src/i18n.xml\");\n/* harmony import */ var _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./paginationButtons.js */ \"./src/paginationButtons.js\");\n/* harmony import */ var _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @green-code-studio/context-menu/dist/index.mjs */ \"./node_modules/@green-code-studio/context-menu/dist/index.mjs\");\n/* harmony import */ var _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./utils/concurencyLimiter.js */ \"./src/utils/concurencyLimiter.js\");\n/* harmony import */ var _idsSet_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./idsSet.js */ \"./src/idsSet.js\");\n/* harmony import */ var _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./ConfigPopup.js */ \"./src/ConfigPopup.js\");\n/* harmony import */ var fast_creator__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! fast-creator */ \"./node_modules/fast-creator/dist/entry.js\");\n/* harmony import */ var _calendarView_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./calendarView.js */ \"./src/calendarView.js\");\n/* harmony import */ var _graphView_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./graphView.js */ \"./src/graphView.js\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nclass ObjectsList extends HTMLElement {\r\n    constructor(datasource, defaultView = 'tableView') {\r\n        super();\r\n        this.columns = [];\r\n        this.columnsReordered = [];\r\n        this.columnsReorderedChanged = false;\r\n        this.hiddenColumns = new Set()\r\n        this.columnFilters = new Map();\r\n        this.generateActions = () => [];\r\n        this.insideViewClass = defaultView === 'calendarView' ? _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView : _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n        this.icon = 'icon-document';\r\n        this.loadConcurencyLimiter = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.loadConcurencyLimiterTotal = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.datasource = datasource;\r\n        this.datasource.onchange = () => this.refresh();\r\n        this.start = 0;\r\n        this.limit = 10\r\n        this.total = 0;\r\n        this.selected = new _idsSet_js__WEBPACK_IMPORTED_MODULE_6__.IdsSet();\r\n        this.selectedMain = null;\r\n        this.dataById = new Map();\r\n        this.initFoot();\r\n        this.addEventListener('contextmenu', e => this.showGlobalContextMenu(e));\r\n        this.resizeBinded = this.resize.bind(this);\r\n        this.popstateBinded = this.readUrl.bind(this);\r\n        this.readUrl()\r\n        this.addEventListener('keydown', e => this.onkeydown(e));\r\n        this.infiniteScrollEnabled = false;\r\n    }\r\n\r\n    connectedCallback() {\r\n        addEventListener('resize', this.resizeBinded);\r\n        addEventListener(\"popstate\", this.popstateBinded)\r\n        if (this.paramsInLocalStorage) {\r\n            this.applyParams(JSON.parse(localStorage['objectList_params_' + this.paramsInLocalStorage] ?? 'null'));\r\n        }\r\n    }\r\n\r\n    disconnectedCallback() {\r\n        removeEventListener('resize', this.resizeBinded);\r\n        removeEventListener(\"popstate\", this.popstateBinded)\r\n    }\r\n\r\n    get columns() {\r\n        return this._columns;\r\n    }\r\n\r\n    set columns(value) {\r\n        this._columns = value;\r\n        this.columnsReordered = value;\r\n        this.columnsReorderedChanged = false;\r\n    }\r\n\r\n    get visibleColumns() {\r\n        return this.columnsReordered.filter(x => !this.hiddenColumns.has(x.dataName ?? x.sortName))\r\n    }\r\n\r\n    refreshLimit() {\r\n        this.limit = this.insideView.calcMaxVisibleItems(this.clientHeight - this.foot.clientHeight - 2);\r\n        if (this.limit < 1) this.limit = 1;\r\n        if (this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView) {\r\n            this.start = 0;\r\n            this.limit = 1000000;\r\n        } else if (this.infiniteScrollEnabled) {\r\n            this.limit = Math.ceil(this.limit / 20) * 20 + 40;\r\n        } else {\r\n            this.start = Math.floor(Math.min(this.total, this.start) / this.limit) * this.limit;\r\n        }\r\n    }\r\n\r\n    async refresh() {\r\n        console.log('refresh')\r\n        this.classList.toggle('infiniteScrollEnabled', this.infiniteScrollEnabled);\r\n\r\n        if (!this.insideView || !(this.insideView instanceof this.insideViewClass))\r\n            this.initInsideView();\r\n        else if (this.insideView.refreshHeader) {\r\n            this.insideView.params = this.insideViewParams\r\n            this.insideView.refreshHeader()\r\n        }\r\n\r\n        this.refreshLimit();\r\n        const refreshSymbol = Symbol();\r\n        this.lastRefreshSymbol = refreshSymbol;\r\n        this.lastRefreshSymbolTotal = refreshSymbol;\r\n        this.pagination.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? 'none' : '';\r\n        this.dateInput.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? '' : 'none';\r\n        if (this.insideView instanceof _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView) {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.getSummary(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentSummary = data.summary;\r\n                this.insideView.loadData(data);\r\n            });\r\n        } else if (this.asyncTotal) {\r\n            const promise1 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                const data = await this.datasource.getRows(this);\r\n\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            const promise2 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                let dataTotal = this.datasource.getTotal(this);\r\n                const x = await dataTotal\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                this.total = x.total;\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            await promise1;\r\n            await promise2;\r\n        } else {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.get(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.total = data.total;\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n        }\r\n\r\n\r\n        while (this.filterShortContainer.firstChild) {\r\n            this.filterShortContainer.firstChild.remove()\r\n        }\r\n        if (this.columnFilters.size) {\r\n            this.filterShortContainer.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.filtersCount') + ': ' + this.columnFilters.size}));\r\n            const clearButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.clearFilters')});\r\n            clearButton.onclick = () => {\r\n                this.columnFilters.clear();\r\n                this.refresh();\r\n            }\r\n            this.filterShortContainer.append(clearButton);\r\n        }\r\n        if (this.paramsInUrl) {\r\n            this.setUrl();\r\n        }\r\n        if (this.paramsInLocalStorage) {\r\n            this.setLocalStorage();\r\n        }\r\n    }\r\n\r\n    setUrl() {\r\n        const query = new URLSearchParams(document.location.search)\r\n        const prev = Object.fromEntries([...query]);\r\n        const next = new URLSearchParams(this.serializeParams(prev))\r\n        console.log('dddddcccc')\r\n        console.log(query)\r\n        if (prev.toString() !== next.toString()) {\r\n            const url = new URL(document.location);\r\n            url.search = next.toString();\r\n            history.pushState(null, '', url.toString());\r\n        }\r\n    }\r\n\r\n    setLocalStorage() {\r\n        const prev = JSON.parse(localStorage.getItem('objectList_params_' + this.paramsInLocalStorage));\r\n        const next = this.serializeParams(prev);\r\n        if (JSON.stringify(prev) !== JSON.stringify(next)) {\r\n            localStorage.setItem('objectList_params_' + this.paramsInLocalStorage, JSON.stringify(next));\r\n        }\r\n    }\r\n\r\n    serializeParams(old = {}) {\r\n        old = old || {};\r\n        let ret = {};\r\n        let changed = false;\r\n        var visibleColumns = this.visibleColumns.map(x => x.dataName ?? x.sortName).join();\r\n        if (old.visibleColumns || this.hiddenColumns.size || this.columnsReorderedChanged) {\r\n            ret.visibleColumns = visibleColumns;\r\n            changed = true;\r\n\r\n        }\r\n        if (old.sort || this.sort?.col) {\r\n            ret.sort = this.sort?.col;\r\n\r\n        }\r\n        if (old.sortDesc == 'true' || this.sort?.desc) {\r\n            ret.sortDesc = this.sort?.desc ? 'true' : 'false';\r\n\r\n\r\n        }\r\n        if (old.columnFilters || this.columnFilters) {\r\n            ret.columnFilters = JSON.stringify(Array.from(this.columnFilters.entries()));\r\n\r\n        }\r\n\r\n        if (old.insideView || this.insideViewName) {\r\n            ret.insideView = this.insideViewName;\r\n        }\r\n        const currentDate = new Date().toISOString().substring(0, 7);\r\n        if (old.date || this.date != currentDate) {\r\n            ret.date = this.date;\r\n        }\r\n        return ret;\r\n    }\r\n\r\n    get insideViewName() {\r\n        if (this.insideViewClass == _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView) {\r\n            if (this.insideViewParams?.wide)\r\n                return 'tableWideView';\r\n            else\r\n                return 'tableView'\r\n        } else {\r\n            return 'listView'\r\n        }\r\n    }\r\n\r\n    set insideViewName(value) {\r\n        if (this.insideViewName == value) return;\r\n        if (value == 'tableView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: false}\r\n        } else if (value == 'tableWideView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: true}\r\n        } else if (value == 'listView') {\r\n            this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'calendarView') {\r\n            this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'graphView') {\r\n            this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView\r\n            this.insideViewParams = {}\r\n        }\r\n    }\r\n\r\n    readUrl() {\r\n\r\n        const query = new URLSearchParams(document.location.search)\r\n        const params = Object.fromEntries([...query]);\r\n        this.applyParams(params)\r\n    }\r\n\r\n    applyParams(params) {\r\n        if (params?.visibleColumns) {\r\n            const splitted = params.visibleColumns.split(',');\r\n            this.hiddenColumns = new Set(this.columns.map(x => x.dataName ?? x.sortName));\r\n            for (const name of splitted) {\r\n                this.hiddenColumns.delete(name);\r\n            }\r\n            for (let i = splitted.length - 1; i > 0; i--) {\r\n                const column = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i - 1]);\r\n                const next = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i]);\r\n                if (column) {\r\n                    this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n                    if (next)\r\n                        this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n                    else\r\n                        this.columnsReordered.push(column)\r\n                    this.columnsReorderedChanged = true;\r\n                }\r\n            }\r\n        }\r\n        if (params?.sort) {\r\n            this.sort = {\r\n                col: params.sort,\r\n                desc: params.sortDesc === 'true'\r\n            };\r\n        }\r\n        if (params?.columnFilters) {\r\n            this.columnFilters = new Map(JSON.parse(params.columnFilters));\r\n        }\r\n        if (params?.insideView) {\r\n            this.insideViewName = params.insideView;\r\n        }\r\n        if (params?.date) {\r\n            this.date = params.date;\r\n        }\r\n    }\r\n\r\n    initInsideView() {\r\n        if (this.insideView) {\r\n            this.insideView.remove();\r\n        }\r\n        this.insideView = new this.insideViewClass(this, this.insideViewParams);\r\n        this.insertBefore(this.insideView, this.foot);\r\n        this.insideView.refresh = () => this.refresh();\r\n        this.insideView.onPaginationChanged = (start, limit) => {\r\n            if (this.start != start) {\r\n                this.start = start;\r\n                //this.limit=limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n    fillDataById(rows) {\r\n        for (let row of rows) {\r\n            this.dataById.set(parseInt(row.id), row);\r\n        }\r\n    }\r\n\r\n    getSelectedData() {\r\n        let data = Array.from(this.dataById).filter(([id, row]) => this.selected.has(id)).map(([id, row]) => row);\r\n        if (data.length > 0) return data;\r\n        else if (this.dataById[this.selectedMain])\r\n            return [this.dataById[this.selectedMain]]\r\n        else return [];\r\n    }\r\n\r\n    initFoot() {\r\n        this.foot = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.foot');\r\n        this.append(this.foot);\r\n        let menuButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button.menuButton span.icon-settings');\r\n        this.foot.append(menuButton)\r\n        menuButton.onclick = e => this.showConfigPopup();\r\n        this.pagination = new _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__.PaginationButtons();\r\n        this.pagination.onpageclick = (page) => {\r\n            this.start = page * this.limit;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.pagination);\r\n        this.dateInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {type: 'month', value: new Date().toISOString().substring(0, 7)});\r\n        this.dateInput.onchange = date => {\r\n            this.start = 0;\r\n            this.date = this.dateInput.value;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.dateInput);\r\n        this.filterShortContainer = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.filterShortContainer');\r\n        this.foot.append(this.filterShortContainer);\r\n        this.searchForm = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('form', {className: 'search'});\r\n        this.foot.append(this.searchForm);\r\n        this.searchForm.onsubmit = e => e.preventDefault();\r\n        const searchInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {\r\n            name: 'search',\r\n            type: 'search',\r\n            placeholder: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.search')\r\n        });\r\n        this.searchForm.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)(searchInput));\r\n        searchInput.oninput = e => {\r\n            this.start = 0;\r\n            this.refresh();\r\n        }\r\n\r\n    }\r\n\r\n    get search() {\r\n        if (!this.foot) return '';\r\n        const searchForm = this.foot.querySelector('.search');\r\n        if (!searchForm) return '';\r\n        return searchForm.search.value;\r\n    }\r\n\r\n    showGlobalContextMenu(e) {\r\n        let elements = [{\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.paginationMode'),\r\n            icon: 'icon-pagination',\r\n            onclick: () => {\r\n                this.infiniteScrollEnabled = false;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.scrollMode'),\r\n            icon: 'icon-scroll',\r\n            onclick: () => {\r\n                this.infiniteScrollEnabled = true;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.tableView'),\r\n            icon: 'icon-table',\r\n            onclick: () => {\r\n                this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.listView'),\r\n            icon: 'icon-list',\r\n            onclick: () => {\r\n                this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView;\r\n                this.refresh();\r\n            }\r\n        }];\r\n        if (this.dateRowCallback != null) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.calendarView'),\r\n                 icon: 'icon-calendar',\r\n                onclick: () => {\r\n                    this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.datasource.canGetSummary) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.graphView'),\r\n                 icon: 'icon-graph',\r\n                onclick: () => {\r\n                    this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.allowTableEdit) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.startMultiEdit'),\r\n                icon: 'icon-edit',\r\n                onclick: async () => {\r\n                    this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                    const getSelects=datasource.getSelects?await datasource.getSelects(this):null;\r\n                    this.refresh();\r\n                    this.insideView.startMultiEdit(getSelects);\r\n                }\r\n            });\r\n        }\r\n        _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__.ContextMenu.openContextMenu(e, elements);\r\n    }\r\n\r\n    resize() {\r\n        let limit = this.limit;\r\n        this.refreshLimit();\r\n        if (limit != this.limit) {\r\n            this.refresh();\r\n        }\r\n    }\r\n\r\n    multiEditChanged(id, data, save = false) {\r\n        this.datasource.multiEditChanged(id, data, save);\r\n    }\r\n\r\n    showConfigPopup() {\r\n        if (this.querySelector('config-popup')) {\r\n            this.querySelector('config-popup').remove()\r\n        } else {\r\n            const popup = new _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__.ConfigPopup(this)\r\n            this.append(popup)\r\n        }\r\n    }\r\n\r\n    gotoUrl(url) {\r\n        window.location.href = url;\r\n    }\r\n\r\n    onkeydown(e) {\r\n        if (e.ctrlKey) {\r\n            if (e.key == 'ArrowLeft' || e.key == 'ArrowRight') {\r\n                let page = Math.floor(this.start / this.limit);\r\n                page += (e.key == 'ArrowLeft' ? -1 : 1);\r\n                if (page < 0) page = 0;\r\n                else if (page > 0 && page > Math.ceil(this.total / this.limit) - 1) page = Math.ceil(this.total / this.limit) - 1;\r\n                this.start = page * this.limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n\r\n    reorderColumns(column, next) {\r\n        console.log('reorderColumns')\r\n        if (column) {\r\n            this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n            if (next)\r\n                this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n            else\r\n                this.columnsReordered.push(column)\r\n\r\n            this.columnsReorderedChanged = true;\r\n            if (this.insideView.setColumnsWidths) {\r\n                this.insideView.setColumnsWidths()\r\n            }\r\n        }\r\n    }\r\n}\r\n\r\ncustomElements\r\n    .define(\r\n        'data-view'\r\n        ,\r\n        ObjectsList\r\n    )\r\n;\r\n\n\n//# sourceURL=webpack://@green-code-studio/objects-list/./src/objectsList.js?");
 
 /***/ }),
 
@@ -326,7 +326,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \**************************/
 /***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   TableView: () => (/* binding */ TableView)\n/* harmony export */ });\n/* harmony import */ var _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @green-code-studio/context-menu/dist/index.mjs */ \"./node_modules/@green-code-studio/context-menu/dist/index.mjs\");\n/* harmony import */ var fast_creator__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! fast-creator */ \"./node_modules/fast-creator/dist/entry.js\");\n/* harmony import */ var _abstractView_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./abstractView.js */ \"./src/abstractView.js\");\n/* harmony import */ var _i18n_xml__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./i18n.xml */ \"./src/i18n.xml\");\n\r\n\r\n\r\n\r\n\r\nclass TableView extends _abstractView_js__WEBPACK_IMPORTED_MODULE_2__.AbstractView {\r\n    constructor(objectsList, params) {\r\n        super();\r\n        this.objectsList = objectsList;\r\n        this.init();\r\n        window.dbgTable = this;\r\n        this.params = params ?? {};\r\n    }\r\n\r\n    init() {\r\n        this.head = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.head');\r\n        this.append(this.head);\r\n        this.refreshHeader();\r\n        const bodyContainer = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.bodyContainer')\r\n        this.body = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.body')\r\n        bodyContainer.append(this.body)\r\n        this.append(bodyContainer);\r\n        this.setColumnsWidths();\r\n        addEventListener('resize', this.setColumnsWidths.bind(this))\r\n        addEventListener('copy', this.onCopy.bind(this));\r\n        this.addEventListener('scroll', this.onScroll.bind(this));\r\n    }\r\n\r\n    refreshHeader() {\r\n        while (this.head.firstChild) this.head.firstChild.remove();\r\n\r\n        console.log('uuu')\r\n        this.head.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.column.icon'))\r\n        for (let column of this.objectsList.visibleColumns) {\r\n            let node = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.column')\r\n            node.__column = column\r\n            this.head.append(node);\r\n            node.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('span.name', {text: column.name}));\r\n            if (column.sortName) {\r\n                node.classList.add('ableToSort');\r\n                node.dataset.sortName = column.sortName\r\n                node.onclick = () => {\r\n                    let sortName = column.sortName || x.dataset.value;\r\n                    if (this.objectsList.sort && this.objectsList.sort.col === column.sortName) {\r\n                        this.objectsList.sort.desc = !this.objectsList.sort.desc;\r\n                    } else {\r\n                        this.objectsList.sort = {col: column.sortName, desc: false};\r\n                    }\r\n                    if (!this.objectsList.infiniteScrollEnabled) {\r\n                        this.objectsList.start = 0;\r\n                    }\r\n                    this.objectsList.refresh();\r\n                }\r\n            }\r\n            this.initColumnMovability(node)\r\n        }\r\n        this.head.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.column.actions'))\r\n\r\n\r\n        this.setColumnsWidths();\r\n    }\r\n\r\n    initColumnMovability(node) {\r\n        let startX = null;\r\n        let changed = false;\r\n        let onmove = (e) => {\r\n            const movement = (e.pageX - startX);\r\n            node.style.setProperty('--move-x', movement + 'px');\r\n            if (movement < -node.previousElementSibling.clientWidth / 2) {\r\n                if (node.previousElementSibling.__column) {\r\n                    startX -= node.previousElementSibling.clientWidth;\r\n                    const prev = node.previousElementSibling;\r\n                    node.parentNode.insertBefore(node, prev);\r\n                    this.objectsList.reorderColumns(node.__column, prev?.__column)\r\n                    changed = true;\r\n                }\r\n            } else if (movement > node.nextElementSibling.clientWidth / 2) {\r\n                if (node.nextElementSibling.__column) {\r\n                    startX += node.nextElementSibling.clientWidth;\r\n                    const next = node.nextElementSibling.nextElementSibling;\r\n                    node.parentNode.insertBefore(node, next);\r\n                    this.objectsList.reorderColumns(node.__column, next?.__column)\r\n                    changed = true;\r\n                }\r\n            }\r\n        }\r\n        const onup = e => {\r\n            const movement = (e.pageX - startX);\r\n            if (Math.abs(movement) < 10 && !changed) {\r\n                if (node.onclick)\r\n                    node.onclick();\r\n            }\r\n            startX = null;\r\n            node.style.setProperty('--move-x', 0 + 'px');\r\n            removeEventListener('mousemove', onmove);\r\n            removeEventListener('mouseup', onup);\r\n            if(changed) {\r\n                this.objectsList.refresh()\r\n            }\r\n        }\r\n        node.addEventListener('mousedown', (e) => {\r\n            startX = e.pageX;\r\n            addEventListener('mousemove', onmove)\r\n            addEventListener('mouseup', onup)\r\n        })\r\n    }\r\n\r\n    loadData(data, start, limit, infiniteScrollEnabled) {\r\n        this.refreshSortIndicators();\r\n        super.loadData(data, start, limit, infiniteScrollEnabled)\r\n        this.setColumnsWidths();\r\n    }\r\n\r\n    get rowHeight() {\r\n        return parseFloat(window.getComputedStyle(this).getPropertyValue('--rowHeight') ?? 31);\r\n    }\r\n\r\n    generateRow(data) {\r\n        let tr = this.body.querySelector(`.tr[data-row=\"${data.id}\"]`);\r\n        if (!tr) {\r\n            tr = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.tr');\r\n            tr.draggable = true;\r\n        }\r\n        tr.classList.toggle('selected', this.objectsList.selected.has(data.id))\r\n        this.fillRowContent(tr, data);\r\n        return tr;\r\n    }\r\n\r\n    fillRowContent(tr, data) {\r\n        tr.lastData = data;\r\n        while (tr.firstChild) {\r\n            tr.removeChild(tr.firstChild)\r\n        }\r\n        tr.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.td.icon', {className: this.objectsList.icon}));\r\n        for (let column of this.objectsList.visibleColumns) {\r\n            let td = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.td');\r\n            tr.append(td);\r\n            if (this.multiEdit && column.dataName) {\r\n                tr.dataset.id = data.id;\r\n                td.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('input', {\r\n                    data: {name: column.dataName},\r\n                    value: data[column.dataName],\r\n                    onclick: e => e.stopPropagation(),\r\n                    onchange: () => this.multiEditChanged(tr)\r\n                }));\r\n            } else {\r\n                td.append(column.content?.call(column, data) || data[column.dataName] || '');\r\n            }\r\n        }\r\n        let actionsTd = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.td.actions');\r\n        tr.append(actionsTd);\r\n        let actions = this.objectsList.generateActions([data], 'row');\r\n        if (this.multiEdit && data.__isMultirowEdited) {\r\n            actions = [\r\n                {\r\n                    name: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_3__.t)(\"objectList.saveRow\"),\r\n                    icon: 'icon-save',\r\n                    command: () => {\r\n                        this.multiEditChanged(tr, true)\r\n                    }\r\n                }\r\n            ]\r\n        }\r\n        for (let action of actions) {\r\n            let actionButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)(action.href ? 'a.button' : 'button', {\r\n                title: action.name\r\n            });\r\n            actionsTd.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)(actionButton));\r\n            actionButton.classList.add('action-' + (action.action ?? 'view'));\r\n\r\n            if (action.href) {\r\n                actionButton.href = action.href;\r\n            }\r\n            if (action.command) {\r\n                actionButton.onclick = action.command;\r\n            }\r\n            if (action.icon) {\r\n                actionButton.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('span', {classList: [action.icon]}));\r\n            } else {\r\n                actionButton.textContent = action.name;\r\n            }\r\n        }\r\n\r\n\r\n        tr.dataset.row = data.id;\r\n        tr.oncontextmenu = this.contextMenu.bind(this, tr);\r\n        tr.onclick = this.trOnClick.bind(this, data);\r\n        tr.ondblclick = this.trOnDblClick.bind(this, data, tr);\r\n        tr.onkeydown = this.trOnKeyDown.bind(this, data, tr);\r\n        tr.ondragstart = this.trOnDragStart.bind(this, data, tr);\r\n    }\r\n\r\n    setColumnsWidths() {\r\n        const widths = this.calculateColumnsWidths();\r\n        for (let tr of this.body?.children ?? []) {\r\n            for (let i = 0; i < widths.length; i++) {\r\n                if(tr.children[i]) {\r\n                    tr.children[i].style.width = widths[i] + 'px';\r\n                }\r\n            }\r\n        }\r\n        let sum = 0;\r\n        for (let i = 0; i < widths.length; i++) {\r\n            let node = this.head.children[i];\r\n            if (node) {\r\n                if (i + 1 < widths.length)\r\n                    node.style.width = widths[i] + 1 + 'px';\r\n                else\r\n                    node.style.width = widths[i] + 'px';\r\n                node.style.left = sum + 'px';\r\n            }\r\n            sum += widths[i];\r\n        }\r\n    }\r\n\r\n    calculateColumnsWidths() {\r\n        let needed = [{base: 30, grow: 0}];\r\n\r\n        for (let column of this.objectsList.visibleColumns) {\r\n            needed.push({base: column.width || 10, grow: typeof (column.widthGrow) == \"number\" ? column.widthGrow : 1});\r\n        }\r\n        let actionWidth = Math.ceil(Array.from(this.querySelectorAll('.td.actions')).map(x => {\r\n            if (x.lastElementChild)\r\n                return x.lastElementChild.getBoundingClientRect().right - x.getBoundingClientRect().left + parseFloat(getComputedStyle(x).paddingRight);\r\n            else\r\n                return 0;\r\n        }).reduce((a, b) => Math.max(a, b), 0));\r\n        needed.push({base: actionWidth, grow: 0});\r\n        let availableToGrow = this.clientWidth - needed.map(x => x.base).reduce((a, b) => a + b, 0);\r\n        let sumGrow = needed.map(x => x.grow).reduce((a, b) => a + b, 0);\r\n        if (this.params?.wide) {\r\n            return needed.map(x => x.base + x.grow * Math.max(100, availableToGrow / sumGrow));\r\n        } else {\r\n            if (availableToGrow > 0 && sumGrow > 0) {\r\n                return needed.map(x => x.base + x.grow / sumGrow * availableToGrow);\r\n            } else {\r\n                return needed.map(x => x.base);\r\n            }\r\n        }\r\n    }\r\n\r\n    refreshSortIndicators() {\r\n        this.head.querySelectorAll('[data-order]').forEach(x => delete x.dataset.order);\r\n        if (this.objectsList.sort)\r\n            this.head.querySelectorAll(`[data-sort-name=\"${this.objectsList.sort.col}\"]`).forEach(x => x.dataset.order = this.objectsList.sort.desc ? 'desc' : 'asc');\r\n    }\r\n\r\n    generateTableHtml(trs) {\r\n        const thead = '<thead><tr>' + Array.from(this.head.querySelectorAll('.column')).map(x => '<th>' + x.innerHTML + '</th>').join('') + '</tr></thead>';\r\n        const tbody = '<tbody>' + trs.map(tr => {\r\n            return '<tr>' + Array.from(tr.children).slice(1, -1).map(td => {\r\n                return '<td>' + td.innerHTML + '</td>';\r\n            }).join('') + '</tr>';\r\n        }).join('') + '</tbody>'\r\n        return '<table>' + thead + tbody + '</table>';\r\n    }\r\n\r\n    generateTableTextPlain(trs) {\r\n        const head = Array.from(this.head.querySelectorAll('.column')).map(x => x.textContent.replace(/\\r\\n/gm, ' ')).join(\"\\t\")\r\n        const body = trs.map(tr => Array.from(tr.children).slice(1).map(x => x.textContent.replace(/\\r\\n/gm, ' ')).join(\"\\t\")).join(\"\\r\\n\")\r\n        return head + \"\\r\\n\" + body;\r\n    }\r\n\r\n    calcMaxVisibleItems(height) {\r\n        return Math.floor((height - this.head.clientHeight) / this.rowHeight);\r\n    }\r\n\r\n    forceCopy(rows) {\r\n        this.copyForced = new Set(rows.map(x => x.id));\r\n        document.execCommand(\"copy\");\r\n        setTimeout(() => this.copyForced = null, 100);\r\n    }\r\n\r\n    startMultiEdit() {\r\n        this.multiEdit = true;\r\n    }\r\n\r\n    multiEditChanged(tr, save = false) {\r\n        let data = [...tr.querySelectorAll('[data-name]')].map(x => [x.dataset.name, x.value]);\r\n        let dataObj = Object.fromEntries(data);\r\n        this.objectsList.multiEditChanged(tr.dataset.id, dataObj, save);\r\n        this.fillRowContent(tr, {...tr.lastData, ...dataObj, __isMultirowEdited: true});\r\n        this.setColumnsWidths();\r\n    }\r\n}\r\n\r\ncustomElements.define('table-view', TableView);\r\n\n\n//# sourceURL=webpack://@green-code-studio/objects-list/./src/tableView.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   TableView: () => (/* binding */ TableView)\n/* harmony export */ });\n/* harmony import */ var _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @green-code-studio/context-menu/dist/index.mjs */ \"./node_modules/@green-code-studio/context-menu/dist/index.mjs\");\n/* harmony import */ var fast_creator__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! fast-creator */ \"./node_modules/fast-creator/dist/entry.js\");\n/* harmony import */ var _abstractView_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./abstractView.js */ \"./src/abstractView.js\");\n/* harmony import */ var _i18n_xml__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./i18n.xml */ \"./src/i18n.xml\");\n\r\n\r\n\r\n\r\n\r\nclass TableView extends _abstractView_js__WEBPACK_IMPORTED_MODULE_2__.AbstractView {\r\n    constructor(objectsList, params) {\r\n        super();\r\n        this.objectsList = objectsList;\r\n        this.init();\r\n        window.dbgTable = this;\r\n        this.params = params ?? {};\r\n    }\r\n\r\n    init() {\r\n        this.head = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.head');\r\n        this.append(this.head);\r\n        this.refreshHeader();\r\n        const bodyContainer = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.bodyContainer')\r\n        this.body = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.body')\r\n        bodyContainer.append(this.body)\r\n        this.append(bodyContainer);\r\n        this.setColumnsWidths();\r\n        addEventListener('resize', this.setColumnsWidths.bind(this))\r\n        addEventListener('copy', this.onCopy.bind(this));\r\n        this.addEventListener('scroll', this.onScroll.bind(this));\r\n    }\r\n\r\n    refreshHeader() {\r\n        while (this.head.firstChild) this.head.firstChild.remove();\r\n\r\n        console.log('uuu')\r\n        this.head.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.column.icon'))\r\n        for (let column of this.objectsList.visibleColumns) {\r\n            let node = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.column')\r\n            node.__column = column\r\n            this.head.append(node);\r\n            node.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('span.name', {text: column.name}));\r\n            if (column.sortName) {\r\n                node.classList.add('ableToSort');\r\n                node.dataset.sortName = column.sortName\r\n                node.onclick = () => {\r\n                    let sortName = column.sortName || x.dataset.value;\r\n                    if (this.objectsList.sort && this.objectsList.sort.col === column.sortName) {\r\n                        this.objectsList.sort.desc = !this.objectsList.sort.desc;\r\n                    } else {\r\n                        this.objectsList.sort = {col: column.sortName, desc: false};\r\n                    }\r\n                    if (!this.objectsList.infiniteScrollEnabled) {\r\n                        this.objectsList.start = 0;\r\n                    }\r\n                    this.objectsList.refresh();\r\n                }\r\n            }\r\n            this.initColumnMovability(node)\r\n        }\r\n        this.head.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.column.actions'))\r\n\r\n\r\n        this.setColumnsWidths();\r\n    }\r\n\r\n    initColumnMovability(node) {\r\n        let startX = null;\r\n        let changed = false;\r\n        let onmove = (e) => {\r\n            const movement = (e.pageX - startX);\r\n            node.style.setProperty('--move-x', movement + 'px');\r\n            if (movement < -node.previousElementSibling.clientWidth / 2) {\r\n                if (node.previousElementSibling.__column) {\r\n                    startX -= node.previousElementSibling.clientWidth;\r\n                    const prev = node.previousElementSibling;\r\n                    node.parentNode.insertBefore(node, prev);\r\n                    this.objectsList.reorderColumns(node.__column, prev?.__column)\r\n                    changed = true;\r\n                }\r\n            } else if (movement > node.nextElementSibling.clientWidth / 2) {\r\n                if (node.nextElementSibling.__column) {\r\n                    startX += node.nextElementSibling.clientWidth;\r\n                    const next = node.nextElementSibling.nextElementSibling;\r\n                    node.parentNode.insertBefore(node, next);\r\n                    this.objectsList.reorderColumns(node.__column, next?.__column)\r\n                    changed = true;\r\n                }\r\n            }\r\n        }\r\n        const onup = e => {\r\n            const movement = (e.pageX - startX);\r\n            if (Math.abs(movement) < 10 && !changed) {\r\n                if (node.onclick)\r\n                    node.onclick();\r\n            }\r\n            startX = null;\r\n            node.style.setProperty('--move-x', 0 + 'px');\r\n            removeEventListener('mousemove', onmove);\r\n            removeEventListener('mouseup', onup);\r\n            if (changed) {\r\n                this.objectsList.refresh()\r\n            }\r\n        }\r\n        node.addEventListener('mousedown', (e) => {\r\n            startX = e.pageX;\r\n            addEventListener('mousemove', onmove)\r\n            addEventListener('mouseup', onup)\r\n        })\r\n    }\r\n\r\n    loadData(data, start, limit, infiniteScrollEnabled) {\r\n        this.refreshSortIndicators();\r\n        super.loadData(data, start, limit, infiniteScrollEnabled)\r\n        this.setColumnsWidths();\r\n    }\r\n\r\n    get rowHeight() {\r\n        return parseFloat(window.getComputedStyle(this).getPropertyValue('--rowHeight') ?? 31);\r\n    }\r\n\r\n    generateRow(data) {\r\n        let tr = this.body.querySelector(`.tr[data-row=\"${data.id}\"]`);\r\n        if (!tr) {\r\n            tr = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.tr');\r\n            tr.draggable = true;\r\n        }\r\n        tr.classList.toggle('selected', this.objectsList.selected.has(data.id))\r\n        this.fillRowContent(tr, data);\r\n        return tr;\r\n    }\r\n\r\n    fillRowContent(tr, data) {\r\n        tr.lastData = data;\r\n        while (tr.firstChild) {\r\n            tr.removeChild(tr.firstChild)\r\n        }\r\n        tr.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.td.icon', {className: this.objectsList.icon}));\r\n        for (let column of this.objectsList.visibleColumns) {\r\n            let td = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.td');\r\n            tr.append(td);\r\n            if (this.multiEdit && column.dataName) {\r\n                tr.dataset.id = data.id;\r\n                if (column.dataType === 'select') {\r\n                    let select = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('select', {\r\n                        data: {name: column.dataName},\r\n                        onchange: () => this.multiEditChanged(tr)\r\n                    }, ...this.selects[column.dataName].map(x => (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('option', {value: x.id, text: x.name})));\r\n                    select.value = data[column.dataName];\r\n                    td.append(select);\r\n                } else {\r\n                    td.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('input', {\r\n                        data: {name: column.dataName},\r\n                        value: data[column.dataName],\r\n                        onclick: e => e.stopPropagation(),\r\n                        onchange: () => this.multiEditChanged(tr)\r\n                    }));\r\n                }\r\n            } else {\r\n                td.append(column.content?.call(column, data) || data[column.dataName] || '');\r\n            }\r\n        }\r\n        let actionsTd = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.td.actions');\r\n        tr.append(actionsTd);\r\n        let actions = this.objectsList.generateActions([data], 'row');\r\n        if (this.multiEdit && data.__isMultirowEdited) {\r\n            actions = [\r\n                {\r\n                    name: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_3__.t)(\"objectList.saveRow\"),\r\n                    icon: 'icon-save',\r\n                    command: () => {\r\n                        this.multiEditChanged(tr, true)\r\n                    }\r\n                }\r\n            ]\r\n        }\r\n        for (let action of actions) {\r\n            let actionButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)(action.href ? 'a.button' : 'button', {\r\n                title: action.name\r\n            });\r\n            actionsTd.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)(actionButton));\r\n            actionButton.classList.add('action-' + (action.action ?? 'view'));\r\n\r\n            if (action.href) {\r\n                actionButton.href = action.href;\r\n            }\r\n            if (action.command) {\r\n                actionButton.onclick = action.command;\r\n            }\r\n            if (action.icon) {\r\n                actionButton.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('span', {classList: [action.icon]}));\r\n            } else {\r\n                actionButton.textContent = action.name;\r\n            }\r\n        }\r\n\r\n\r\n        tr.dataset.row = data.id;\r\n        tr.oncontextmenu = this.contextMenu.bind(this, tr);\r\n        tr.onclick = this.trOnClick.bind(this, data);\r\n        tr.ondblclick = this.trOnDblClick.bind(this, data, tr);\r\n        tr.onkeydown = this.trOnKeyDown.bind(this, data, tr);\r\n        tr.ondragstart = this.trOnDragStart.bind(this, data, tr);\r\n    }\r\n\r\n    setColumnsWidths() {\r\n        const widths = this.calculateColumnsWidths();\r\n        for (let tr of this.body?.children ?? []) {\r\n            for (let i = 0; i < widths.length; i++) {\r\n                if (tr.children[i]) {\r\n                    tr.children[i].style.width = widths[i] + 'px';\r\n                }\r\n            }\r\n        }\r\n        let sum = 0;\r\n        for (let i = 0; i < widths.length; i++) {\r\n            let node = this.head.children[i];\r\n            if (node) {\r\n                if (i + 1 < widths.length)\r\n                    node.style.width = widths[i] + 1 + 'px';\r\n                else\r\n                    node.style.width = widths[i] + 'px';\r\n                node.style.left = sum + 'px';\r\n            }\r\n            sum += widths[i];\r\n        }\r\n    }\r\n\r\n    calculateColumnsWidths() {\r\n        let needed = [{base: 30, grow: 0}];\r\n\r\n        for (let column of this.objectsList.visibleColumns) {\r\n            needed.push({base: column.width || 10, grow: typeof (column.widthGrow) == \"number\" ? column.widthGrow : 1});\r\n        }\r\n        let actionWidth = Math.ceil(Array.from(this.querySelectorAll('.td.actions')).map(x => {\r\n            if (x.lastElementChild)\r\n                return x.lastElementChild.getBoundingClientRect().right - x.getBoundingClientRect().left + parseFloat(getComputedStyle(x).paddingRight);\r\n            else\r\n                return 0;\r\n        }).reduce((a, b) => Math.max(a, b), 0));\r\n        needed.push({base: actionWidth, grow: 0});\r\n        let availableToGrow = this.clientWidth - needed.map(x => x.base).reduce((a, b) => a + b, 0);\r\n        let sumGrow = needed.map(x => x.grow).reduce((a, b) => a + b, 0);\r\n        if (this.params?.wide) {\r\n            return needed.map(x => x.base + x.grow * Math.max(100, availableToGrow / sumGrow));\r\n        } else {\r\n            if (availableToGrow > 0 && sumGrow > 0) {\r\n                return needed.map(x => x.base + x.grow / sumGrow * availableToGrow);\r\n            } else {\r\n                return needed.map(x => x.base);\r\n            }\r\n        }\r\n    }\r\n\r\n    refreshSortIndicators() {\r\n        this.head.querySelectorAll('[data-order]').forEach(x => delete x.dataset.order);\r\n        if (this.objectsList.sort)\r\n            this.head.querySelectorAll(`[data-sort-name=\"${this.objectsList.sort.col}\"]`).forEach(x => x.dataset.order = this.objectsList.sort.desc ? 'desc' : 'asc');\r\n    }\r\n\r\n    generateTableHtml(trs) {\r\n        const thead = '<thead><tr>' + Array.from(this.head.querySelectorAll('.column')).map(x => '<th>' + x.innerHTML + '</th>').join('') + '</tr></thead>';\r\n        const tbody = '<tbody>' + trs.map(tr => {\r\n            return '<tr>' + Array.from(tr.children).slice(1, -1).map(td => {\r\n                return '<td>' + td.innerHTML + '</td>';\r\n            }).join('') + '</tr>';\r\n        }).join('') + '</tbody>'\r\n        return '<table>' + thead + tbody + '</table>';\r\n    }\r\n\r\n    generateTableTextPlain(trs) {\r\n        const head = Array.from(this.head.querySelectorAll('.column')).map(x => x.textContent.replace(/\\r\\n/gm, ' ')).join(\"\\t\")\r\n        const body = trs.map(tr => Array.from(tr.children).slice(1).map(x => x.textContent.replace(/\\r\\n/gm, ' ')).join(\"\\t\")).join(\"\\r\\n\")\r\n        return head + \"\\r\\n\" + body;\r\n    }\r\n\r\n    calcMaxVisibleItems(height) {\r\n        return Math.floor((height - this.head.clientHeight) / this.rowHeight);\r\n    }\r\n\r\n    forceCopy(rows) {\r\n        this.copyForced = new Set(rows.map(x => x.id));\r\n        document.execCommand(\"copy\");\r\n        setTimeout(() => this.copyForced = null, 100);\r\n    }\r\n\r\n    startMultiEdit(selects) {\r\n        this.multiEdit = true;\r\n        this.selects = selects;\r\n    }\r\n\r\n    multiEditChanged(tr, save = false) {\r\n        let data = [...tr.querySelectorAll('[data-name]')].map(x => [x.dataset.name, x.value]);\r\n        let dataObj = Object.fromEntries(data);\r\n        this.objectsList.multiEditChanged(tr.dataset.id, dataObj, save);\r\n        this.fillRowContent(tr, {...tr.lastData, ...dataObj, __isMultirowEdited: true});\r\n        this.setColumnsWidths();\r\n    }\r\n}\r\n\r\ncustomElements.define('table-view', TableView);\r\n\n\n//# sourceURL=webpack://@green-code-studio/objects-list/./src/tableView.js?");
 
 /***/ }),
 

package/dist/index.mjs

@@ -194,7 +194,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \****************************/
 /***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ObjectsList: () => (/* binding */ ObjectsList)\n/* harmony export */ });\n/* harmony import */ var _tableView_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./tableView.js */ \"./src/tableView.js\");\n/* harmony import */ var _listView_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./listView.js */ \"./src/listView.js\");\n/* harmony import */ var _i18n_xml__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./i18n.xml */ \"./src/i18n.xml\");\n/* harmony import */ var _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./paginationButtons.js */ \"./src/paginationButtons.js\");\n/* harmony import */ var _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @green-code-studio/context-menu/dist/index.mjs */ \"./node_modules/@green-code-studio/context-menu/dist/index.mjs\");\n/* harmony import */ var _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./utils/concurencyLimiter.js */ \"./src/utils/concurencyLimiter.js\");\n/* harmony import */ var _idsSet_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./idsSet.js */ \"./src/idsSet.js\");\n/* harmony import */ var _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./ConfigPopup.js */ \"./src/ConfigPopup.js\");\n/* harmony import */ var fast_creator__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! fast-creator */ \"./node_modules/fast-creator/dist/entry.js\");\n/* harmony import */ var _calendarView_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./calendarView.js */ \"./src/calendarView.js\");\n/* harmony import */ var _graphView_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./graphView.js */ \"./src/graphView.js\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nclass ObjectsList extends HTMLElement {\r\n    constructor(datasource, defaultView = 'tableView') {\r\n        super();\r\n        this.columns = [];\r\n        this.columnsReordered = [];\r\n        this.columnsReorderedChanged = false;\r\n        this.hiddenColumns = new Set()\r\n        this.columnFilters = new Map();\r\n        this.generateActions = () => [];\r\n        this.insideViewClass = defaultView === 'calendarView' ? _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView : _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n        this.icon = 'icon-document';\r\n        this.loadConcurencyLimiter = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.loadConcurencyLimiterTotal = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.datasource = datasource;\r\n        this.datasource.onchange = () => this.refresh();\r\n        this.start = 0;\r\n        this.limit = 10\r\n        this.total = 0;\r\n        this.selected = new _idsSet_js__WEBPACK_IMPORTED_MODULE_6__.IdsSet();\r\n        this.selectedMain = null;\r\n        this.dataById = new Map();\r\n        this.initFoot();\r\n        this.addEventListener('contextmenu', e => this.showGlobalContextMenu(e));\r\n        this.resizeBinded = this.resize.bind(this);\r\n        this.popstateBinded = this.readUrl.bind(this);\r\n        this.readUrl()\r\n        this.addEventListener('keydown', e => this.onkeydown(e));\r\n        this.infiniteScrollEnabled = false;\r\n    }\r\n\r\n    connectedCallback() {\r\n        addEventListener('resize', this.resizeBinded);\r\n        addEventListener(\"popstate\", this.popstateBinded)\r\n        if (this.paramsInLocalStorage) {\r\n            this.applyParams(JSON.parse(localStorage['objectList_params_' + this.paramsInLocalStorage] ?? 'null'));\r\n        }\r\n    }\r\n\r\n    disconnectedCallback() {\r\n        removeEventListener('resize', this.resizeBinded);\r\n        removeEventListener(\"popstate\", this.popstateBinded)\r\n    }\r\n\r\n    get columns() {\r\n        return this._columns;\r\n    }\r\n\r\n    set columns(value) {\r\n        this._columns = value;\r\n        this.columnsReordered = value;\r\n        this.columnsReorderedChanged = false;\r\n    }\r\n\r\n    get visibleColumns() {\r\n        return this.columnsReordered.filter(x => !this.hiddenColumns.has(x.dataName ?? x.sortName))\r\n    }\r\n\r\n    refreshLimit() {\r\n        this.limit = this.insideView.calcMaxVisibleItems(this.clientHeight - this.foot.clientHeight - 2);\r\n        if (this.limit < 1) this.limit = 1;\r\n        if (this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView) {\r\n            this.start = 0;\r\n            this.limit = 1000000;\r\n        } else if (this.infiniteScrollEnabled) {\r\n            this.limit = Math.ceil(this.limit / 20) * 20 + 40;\r\n        } else {\r\n            this.start = Math.floor(Math.min(this.total, this.start) / this.limit) * this.limit;\r\n        }\r\n    }\r\n\r\n    async refresh() {\r\n        console.log('refresh')\r\n        this.classList.toggle('infiniteScrollEnabled', this.infiniteScrollEnabled);\r\n\r\n        if (!this.insideView || !(this.insideView instanceof this.insideViewClass))\r\n            this.initInsideView();\r\n        else if (this.insideView.refreshHeader) {\r\n            this.insideView.params = this.insideViewParams\r\n            this.insideView.refreshHeader()\r\n        }\r\n\r\n        this.refreshLimit();\r\n        const refreshSymbol = Symbol();\r\n        this.lastRefreshSymbol = refreshSymbol;\r\n        this.lastRefreshSymbolTotal = refreshSymbol;\r\n        this.pagination.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? 'none' : '';\r\n        this.dateInput.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? '' : 'none';\r\n        if (this.insideView instanceof _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView) {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.getSummary(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentSummary = data.summary;\r\n                this.insideView.loadData(data);\r\n            });\r\n        } else if (this.asyncTotal) {\r\n            const promise1 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                const data = await this.datasource.getRows(this);\r\n\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            const promise2 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                let dataTotal = this.datasource.getTotal(this);\r\n                const x = await dataTotal\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                this.total = x.total;\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            await promise1;\r\n            await promise2;\r\n        } else {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.get(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.total = data.total;\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n        }\r\n\r\n\r\n        while (this.filterShortContainer.firstChild) {\r\n            this.filterShortContainer.firstChild.remove()\r\n        }\r\n        if (this.columnFilters.size) {\r\n            this.filterShortContainer.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.filtersCount') + ': ' + this.columnFilters.size}));\r\n            const clearButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.clearFilters')});\r\n            clearButton.onclick = () => {\r\n                this.columnFilters.clear();\r\n                this.refresh();\r\n            }\r\n            this.filterShortContainer.append(clearButton);\r\n        }\r\n        if (this.paramsInUrl) {\r\n            this.setUrl();\r\n        }\r\n        if (this.paramsInLocalStorage) {\r\n            this.setLocalStorage();\r\n        }\r\n    }\r\n\r\n    setUrl() {\r\n        const query = new URLSearchParams(document.location.search)\r\n        const prev = Object.fromEntries([...query]);\r\n        const next = new URLSearchParams(this.serializeParams(prev))\r\n        console.log('dddddcccc')\r\n        console.log(query)\r\n        if (prev.toString() !== next.toString()) {\r\n            const url = new URL(document.location);\r\n            url.search = next.toString();\r\n            history.pushState(null, '', url.toString());\r\n        }\r\n    }\r\n\r\n    setLocalStorage() {\r\n        const prev = JSON.parse(localStorage.getItem('objectList_params_' + this.paramsInLocalStorage));\r\n        const next = this.serializeParams(prev);\r\n        if (JSON.stringify(prev) !== JSON.stringify(next)) {\r\n            localStorage.setItem('objectList_params_' + this.paramsInLocalStorage, JSON.stringify(next));\r\n        }\r\n    }\r\n\r\n    serializeParams(old = {}) {\r\n        old = old || {};\r\n        let ret = {};\r\n        let changed = false;\r\n        var visibleColumns = this.visibleColumns.map(x => x.dataName ?? x.sortName).join();\r\n        if (old.visibleColumns || this.hiddenColumns.size || this.columnsReorderedChanged) {\r\n            ret.visibleColumns = visibleColumns;\r\n            changed = true;\r\n\r\n        }\r\n        if (old.sort || this.sort?.col) {\r\n            ret.sort = this.sort?.col;\r\n\r\n        }\r\n        if (old.sortDesc == 'true' || this.sort?.desc) {\r\n            ret.sortDesc = this.sort?.desc ? 'true' : 'false';\r\n\r\n\r\n        }\r\n        if (old.columnFilters || this.columnFilters) {\r\n            ret.columnFilters = JSON.stringify(Array.from(this.columnFilters.entries()));\r\n\r\n        }\r\n\r\n        if (old.insideView || this.insideViewName) {\r\n            ret.insideView = this.insideViewName;\r\n        }\r\n        const currentDate = new Date().toISOString().substring(0, 7);\r\n        if (old.date || this.date != currentDate) {\r\n            ret.date = this.date;\r\n        }\r\n        return ret;\r\n    }\r\n\r\n    get insideViewName() {\r\n        if (this.insideViewClass == _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView) {\r\n            if (this.insideViewParams?.wide)\r\n                return 'tableWideView';\r\n            else\r\n                return 'tableView'\r\n        } else {\r\n            return 'listView'\r\n        }\r\n    }\r\n\r\n    set insideViewName(value) {\r\n        if (this.insideViewName == value) return;\r\n        if (value == 'tableView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: false}\r\n        } else if (value == 'tableWideView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: true}\r\n        } else if (value == 'listView') {\r\n            this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'calendarView') {\r\n            this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'graphView') {\r\n            this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView\r\n            this.insideViewParams = {}\r\n        }\r\n    }\r\n\r\n    readUrl() {\r\n\r\n        const query = new URLSearchParams(document.location.search)\r\n        const params = Object.fromEntries([...query]);\r\n        this.applyParams(params)\r\n    }\r\n\r\n    applyParams(params) {\r\n        if (params?.visibleColumns) {\r\n            const splitted = params.visibleColumns.split(',');\r\n            this.hiddenColumns = new Set(this.columns.map(x => x.dataName ?? x.sortName));\r\n            for (const name of splitted) {\r\n                this.hiddenColumns.delete(name);\r\n            }\r\n            for (let i = splitted.length - 1; i > 0; i--) {\r\n                const column = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i - 1]);\r\n                const next = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i]);\r\n                if (column) {\r\n                    this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n                    if (next)\r\n                        this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n                    else\r\n                        this.columnsReordered.push(column)\r\n                    this.columnsReorderedChanged = true;\r\n                }\r\n            }\r\n        }\r\n        if (params?.sort) {\r\n            this.sort = {\r\n                col: params.sort,\r\n                desc: params.sortDesc === 'true'\r\n            };\r\n        }\r\n        if (params?.columnFilters) {\r\n            this.columnFilters = new Map(JSON.parse(params.columnFilters));\r\n        }\r\n        if (params?.insideView) {\r\n            this.insideViewName = params.insideView;\r\n        }\r\n        if (params?.date) {\r\n            this.date = params.date;\r\n        }\r\n    }\r\n\r\n    initInsideView() {\r\n        if (this.insideView) {\r\n            this.insideView.remove();\r\n        }\r\n        this.insideView = new this.insideViewClass(this, this.insideViewParams);\r\n        this.insertBefore(this.insideView, this.foot);\r\n        this.insideView.refresh = () => this.refresh();\r\n        this.insideView.onPaginationChanged = (start, limit) => {\r\n            if (this.start != start) {\r\n                this.start = start;\r\n                //this.limit=limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n    fillDataById(rows) {\r\n        for (let row of rows) {\r\n            this.dataById.set(parseInt(row.id), row);\r\n        }\r\n    }\r\n\r\n    getSelectedData() {\r\n        let data = Array.from(this.dataById).filter(([id, row]) => this.selected.has(id)).map(([id, row]) => row);\r\n        if (data.length > 0) return data;\r\n        else if (this.dataById[this.selectedMain])\r\n            return [this.dataById[this.selectedMain]]\r\n        else return [];\r\n    }\r\n\r\n    initFoot() {\r\n        this.foot = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.foot');\r\n        this.append(this.foot);\r\n        let menuButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button.menuButton span.icon-settings');\r\n        this.foot.append(menuButton)\r\n        menuButton.onclick = e => this.showConfigPopup();\r\n        this.pagination = new _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__.PaginationButtons();\r\n        this.pagination.onpageclick = (page) => {\r\n            this.start = page * this.limit;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.pagination);\r\n        this.dateInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {type: 'month', value: new Date().toISOString().substring(0, 7)});\r\n        this.dateInput.onchange = date => {\r\n            this.start = 0;\r\n            this.date = this.dateInput.value;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.dateInput);\r\n        this.filterShortContainer = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.filterShortContainer');\r\n        this.foot.append(this.filterShortContainer);\r\n        this.searchForm = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('form', {className: 'search'});\r\n        this.foot.append(this.searchForm);\r\n        this.searchForm.onsubmit = e => e.preventDefault();\r\n        const searchInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {\r\n            name: 'search',\r\n            type: 'search',\r\n            placeholder: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.search')\r\n        });\r\n        this.searchForm.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)(searchInput));\r\n        searchInput.oninput = e => {\r\n            this.start = 0;\r\n            this.refresh();\r\n        }\r\n\r\n    }\r\n\r\n    get search() {\r\n        if (!this.foot) return '';\r\n        const searchForm = this.foot.querySelector('.search');\r\n        if (!searchForm) return '';\r\n        return searchForm.search.value;\r\n    }\r\n\r\n    showGlobalContextMenu(e) {\r\n        let elements = [{\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.paginationMode'),\r\n            icon: 'icon-pagination',\r\n            onclick: () => {\r\n                this.infiniteScrollEnabled = false;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.scrollMode'),\r\n            icon: 'icon-scroll',\r\n            onclick: () => {\r\n                this.infiniteScrollEnabled = true;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.tableView'),\r\n            icon: 'icon-table',\r\n            onclick: () => {\r\n                this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.listView'),\r\n            icon: 'icon-list',\r\n            onclick: () => {\r\n                this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView;\r\n                this.refresh();\r\n            }\r\n        }];\r\n        if (this.dateRowCallback != null) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.calendarView'),\r\n                 icon: 'icon-calendar',\r\n                onclick: () => {\r\n                    this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.datasource.canGetSummary != null) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.graphView'),\r\n                 icon: 'icon-graph',\r\n                onclick: () => {\r\n                    this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.allowTableEdit) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.startMultiEdit'),\r\n                icon: 'icon-edit',\r\n                onclick: () => {\r\n                    this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                    this.refresh();\r\n                    this.insideView.startMultiEdit();\r\n                }\r\n            });\r\n        }\r\n        _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__.ContextMenu.openContextMenu(e, elements);\r\n    }\r\n\r\n    resize() {\r\n        let limit = this.limit;\r\n        this.refreshLimit();\r\n        if (limit != this.limit) {\r\n            this.refresh();\r\n        }\r\n    }\r\n\r\n    multiEditChanged(id, data, save = false) {\r\n        this.datasource.multiEditChanged(id, data, save);\r\n    }\r\n\r\n    showConfigPopup() {\r\n        if (this.querySelector('config-popup')) {\r\n            this.querySelector('config-popup').remove()\r\n        } else {\r\n            const popup = new _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__.ConfigPopup(this)\r\n            this.append(popup)\r\n        }\r\n    }\r\n\r\n    gotoUrl(url) {\r\n        window.location.href = url;\r\n    }\r\n\r\n    onkeydown(e) {\r\n        if (e.ctrlKey) {\r\n            if (e.key == 'ArrowLeft' || e.key == 'ArrowRight') {\r\n                let page = Math.floor(this.start / this.limit);\r\n                page += (e.key == 'ArrowLeft' ? -1 : 1);\r\n                if (page < 0) page = 0;\r\n                else if (page > 0 && page > Math.ceil(this.total / this.limit) - 1) page = Math.ceil(this.total / this.limit) - 1;\r\n                this.start = page * this.limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n\r\n    reorderColumns(column, next) {\r\n        console.log('reorderColumns')\r\n        if (column) {\r\n            this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n            if (next)\r\n                this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n            else\r\n                this.columnsReordered.push(column)\r\n\r\n            this.columnsReorderedChanged = true;\r\n            if (this.insideView.setColumnsWidths) {\r\n                this.insideView.setColumnsWidths()\r\n            }\r\n        }\r\n    }\r\n}\r\n\r\ncustomElements\r\n    .define(\r\n        'data-view'\r\n        ,\r\n        ObjectsList\r\n    )\r\n;\r\n\n\n//# sourceURL=webpack://@green-code-studio/objects-list/./src/objectsList.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   ObjectsList: () => (/* binding */ ObjectsList)\n/* harmony export */ });\n/* harmony import */ var _tableView_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./tableView.js */ \"./src/tableView.js\");\n/* harmony import */ var _listView_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./listView.js */ \"./src/listView.js\");\n/* harmony import */ var _i18n_xml__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./i18n.xml */ \"./src/i18n.xml\");\n/* harmony import */ var _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./paginationButtons.js */ \"./src/paginationButtons.js\");\n/* harmony import */ var _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @green-code-studio/context-menu/dist/index.mjs */ \"./node_modules/@green-code-studio/context-menu/dist/index.mjs\");\n/* harmony import */ var _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./utils/concurencyLimiter.js */ \"./src/utils/concurencyLimiter.js\");\n/* harmony import */ var _idsSet_js__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./idsSet.js */ \"./src/idsSet.js\");\n/* harmony import */ var _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./ConfigPopup.js */ \"./src/ConfigPopup.js\");\n/* harmony import */ var fast_creator__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! fast-creator */ \"./node_modules/fast-creator/dist/entry.js\");\n/* harmony import */ var _calendarView_js__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./calendarView.js */ \"./src/calendarView.js\");\n/* harmony import */ var _graphView_js__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./graphView.js */ \"./src/graphView.js\");\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\n\r\nclass ObjectsList extends HTMLElement {\r\n    constructor(datasource, defaultView = 'tableView') {\r\n        super();\r\n        this.columns = [];\r\n        this.columnsReordered = [];\r\n        this.columnsReorderedChanged = false;\r\n        this.hiddenColumns = new Set()\r\n        this.columnFilters = new Map();\r\n        this.generateActions = () => [];\r\n        this.insideViewClass = defaultView === 'calendarView' ? _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView : _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n        this.icon = 'icon-document';\r\n        this.loadConcurencyLimiter = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.loadConcurencyLimiterTotal = new _utils_concurencyLimiter_js__WEBPACK_IMPORTED_MODULE_5__.ConcurencyLimiter();\r\n        this.datasource = datasource;\r\n        this.datasource.onchange = () => this.refresh();\r\n        this.start = 0;\r\n        this.limit = 10\r\n        this.total = 0;\r\n        this.selected = new _idsSet_js__WEBPACK_IMPORTED_MODULE_6__.IdsSet();\r\n        this.selectedMain = null;\r\n        this.dataById = new Map();\r\n        this.initFoot();\r\n        this.addEventListener('contextmenu', e => this.showGlobalContextMenu(e));\r\n        this.resizeBinded = this.resize.bind(this);\r\n        this.popstateBinded = this.readUrl.bind(this);\r\n        this.readUrl()\r\n        this.addEventListener('keydown', e => this.onkeydown(e));\r\n        this.infiniteScrollEnabled = false;\r\n    }\r\n\r\n    connectedCallback() {\r\n        addEventListener('resize', this.resizeBinded);\r\n        addEventListener(\"popstate\", this.popstateBinded)\r\n        if (this.paramsInLocalStorage) {\r\n            this.applyParams(JSON.parse(localStorage['objectList_params_' + this.paramsInLocalStorage] ?? 'null'));\r\n        }\r\n    }\r\n\r\n    disconnectedCallback() {\r\n        removeEventListener('resize', this.resizeBinded);\r\n        removeEventListener(\"popstate\", this.popstateBinded)\r\n    }\r\n\r\n    get columns() {\r\n        return this._columns;\r\n    }\r\n\r\n    set columns(value) {\r\n        this._columns = value;\r\n        this.columnsReordered = value;\r\n        this.columnsReorderedChanged = false;\r\n    }\r\n\r\n    get visibleColumns() {\r\n        return this.columnsReordered.filter(x => !this.hiddenColumns.has(x.dataName ?? x.sortName))\r\n    }\r\n\r\n    refreshLimit() {\r\n        this.limit = this.insideView.calcMaxVisibleItems(this.clientHeight - this.foot.clientHeight - 2);\r\n        if (this.limit < 1) this.limit = 1;\r\n        if (this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView) {\r\n            this.start = 0;\r\n            this.limit = 1000000;\r\n        } else if (this.infiniteScrollEnabled) {\r\n            this.limit = Math.ceil(this.limit / 20) * 20 + 40;\r\n        } else {\r\n            this.start = Math.floor(Math.min(this.total, this.start) / this.limit) * this.limit;\r\n        }\r\n    }\r\n\r\n    async refresh() {\r\n        console.log('refresh')\r\n        this.classList.toggle('infiniteScrollEnabled', this.infiniteScrollEnabled);\r\n\r\n        if (!this.insideView || !(this.insideView instanceof this.insideViewClass))\r\n            this.initInsideView();\r\n        else if (this.insideView.refreshHeader) {\r\n            this.insideView.params = this.insideViewParams\r\n            this.insideView.refreshHeader()\r\n        }\r\n\r\n        this.refreshLimit();\r\n        const refreshSymbol = Symbol();\r\n        this.lastRefreshSymbol = refreshSymbol;\r\n        this.lastRefreshSymbolTotal = refreshSymbol;\r\n        this.pagination.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? 'none' : '';\r\n        this.dateInput.style.display = this.insideView instanceof _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView ? '' : 'none';\r\n        if (this.insideView instanceof _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView) {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.getSummary(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentSummary = data.summary;\r\n                this.insideView.loadData(data);\r\n            });\r\n        } else if (this.asyncTotal) {\r\n            const promise1 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                const data = await this.datasource.getRows(this);\r\n\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            const promise2 = this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                let dataTotal = this.datasource.getTotal(this);\r\n                const x = await dataTotal\r\n                if (this.lastRefreshSymbolTotal != refreshSymbol) return;\r\n                this.total = x.total;\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n\r\n            await promise1;\r\n            await promise2;\r\n        } else {\r\n            await this.loadConcurencyLimiter.run(async () => {\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                let data = await this.datasource.get(this);\r\n                if (this.lastRefreshSymbol != refreshSymbol) return;\r\n\r\n                this.currentRows = data.rows;\r\n                this.fillDataById(data.rows);\r\n                this.total = data.total;\r\n                this.insideView.loadData(data, this.start, this.limit, this.infiniteScrollEnabled);\r\n                this.pagination.currentPage = Math.floor(this.start / this.limit);\r\n                this.pagination.totalPages = Math.ceil(this.total / this.limit);\r\n                this.pagination.render();\r\n            });\r\n        }\r\n\r\n\r\n        while (this.filterShortContainer.firstChild) {\r\n            this.filterShortContainer.firstChild.remove()\r\n        }\r\n        if (this.columnFilters.size) {\r\n            this.filterShortContainer.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('span', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.filtersCount') + ': ' + this.columnFilters.size}));\r\n            const clearButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button', {text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.clearFilters')});\r\n            clearButton.onclick = () => {\r\n                this.columnFilters.clear();\r\n                this.refresh();\r\n            }\r\n            this.filterShortContainer.append(clearButton);\r\n        }\r\n        if (this.paramsInUrl) {\r\n            this.setUrl();\r\n        }\r\n        if (this.paramsInLocalStorage) {\r\n            this.setLocalStorage();\r\n        }\r\n    }\r\n\r\n    setUrl() {\r\n        const query = new URLSearchParams(document.location.search)\r\n        const prev = Object.fromEntries([...query]);\r\n        const next = new URLSearchParams(this.serializeParams(prev))\r\n        console.log('dddddcccc')\r\n        console.log(query)\r\n        if (prev.toString() !== next.toString()) {\r\n            const url = new URL(document.location);\r\n            url.search = next.toString();\r\n            history.pushState(null, '', url.toString());\r\n        }\r\n    }\r\n\r\n    setLocalStorage() {\r\n        const prev = JSON.parse(localStorage.getItem('objectList_params_' + this.paramsInLocalStorage));\r\n        const next = this.serializeParams(prev);\r\n        if (JSON.stringify(prev) !== JSON.stringify(next)) {\r\n            localStorage.setItem('objectList_params_' + this.paramsInLocalStorage, JSON.stringify(next));\r\n        }\r\n    }\r\n\r\n    serializeParams(old = {}) {\r\n        old = old || {};\r\n        let ret = {};\r\n        let changed = false;\r\n        var visibleColumns = this.visibleColumns.map(x => x.dataName ?? x.sortName).join();\r\n        if (old.visibleColumns || this.hiddenColumns.size || this.columnsReorderedChanged) {\r\n            ret.visibleColumns = visibleColumns;\r\n            changed = true;\r\n\r\n        }\r\n        if (old.sort || this.sort?.col) {\r\n            ret.sort = this.sort?.col;\r\n\r\n        }\r\n        if (old.sortDesc == 'true' || this.sort?.desc) {\r\n            ret.sortDesc = this.sort?.desc ? 'true' : 'false';\r\n\r\n\r\n        }\r\n        if (old.columnFilters || this.columnFilters) {\r\n            ret.columnFilters = JSON.stringify(Array.from(this.columnFilters.entries()));\r\n\r\n        }\r\n\r\n        if (old.insideView || this.insideViewName) {\r\n            ret.insideView = this.insideViewName;\r\n        }\r\n        const currentDate = new Date().toISOString().substring(0, 7);\r\n        if (old.date || this.date != currentDate) {\r\n            ret.date = this.date;\r\n        }\r\n        return ret;\r\n    }\r\n\r\n    get insideViewName() {\r\n        if (this.insideViewClass == _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView) {\r\n            if (this.insideViewParams?.wide)\r\n                return 'tableWideView';\r\n            else\r\n                return 'tableView'\r\n        } else {\r\n            return 'listView'\r\n        }\r\n    }\r\n\r\n    set insideViewName(value) {\r\n        if (this.insideViewName == value) return;\r\n        if (value == 'tableView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: false}\r\n        } else if (value == 'tableWideView') {\r\n            this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView\r\n            this.insideViewParams = {wide: true}\r\n        } else if (value == 'listView') {\r\n            this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'calendarView') {\r\n            this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView\r\n            this.insideViewParams = {}\r\n        } else if (value == 'graphView') {\r\n            this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView\r\n            this.insideViewParams = {}\r\n        }\r\n    }\r\n\r\n    readUrl() {\r\n\r\n        const query = new URLSearchParams(document.location.search)\r\n        const params = Object.fromEntries([...query]);\r\n        this.applyParams(params)\r\n    }\r\n\r\n    applyParams(params) {\r\n        if (params?.visibleColumns) {\r\n            const splitted = params.visibleColumns.split(',');\r\n            this.hiddenColumns = new Set(this.columns.map(x => x.dataName ?? x.sortName));\r\n            for (const name of splitted) {\r\n                this.hiddenColumns.delete(name);\r\n            }\r\n            for (let i = splitted.length - 1; i > 0; i--) {\r\n                const column = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i - 1]);\r\n                const next = this.columnsReordered.find(x => (x.dataName ?? x.sortName) == splitted[i]);\r\n                if (column) {\r\n                    this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n                    if (next)\r\n                        this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n                    else\r\n                        this.columnsReordered.push(column)\r\n                    this.columnsReorderedChanged = true;\r\n                }\r\n            }\r\n        }\r\n        if (params?.sort) {\r\n            this.sort = {\r\n                col: params.sort,\r\n                desc: params.sortDesc === 'true'\r\n            };\r\n        }\r\n        if (params?.columnFilters) {\r\n            this.columnFilters = new Map(JSON.parse(params.columnFilters));\r\n        }\r\n        if (params?.insideView) {\r\n            this.insideViewName = params.insideView;\r\n        }\r\n        if (params?.date) {\r\n            this.date = params.date;\r\n        }\r\n    }\r\n\r\n    initInsideView() {\r\n        if (this.insideView) {\r\n            this.insideView.remove();\r\n        }\r\n        this.insideView = new this.insideViewClass(this, this.insideViewParams);\r\n        this.insertBefore(this.insideView, this.foot);\r\n        this.insideView.refresh = () => this.refresh();\r\n        this.insideView.onPaginationChanged = (start, limit) => {\r\n            if (this.start != start) {\r\n                this.start = start;\r\n                //this.limit=limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n    fillDataById(rows) {\r\n        for (let row of rows) {\r\n            this.dataById.set(parseInt(row.id), row);\r\n        }\r\n    }\r\n\r\n    getSelectedData() {\r\n        let data = Array.from(this.dataById).filter(([id, row]) => this.selected.has(id)).map(([id, row]) => row);\r\n        if (data.length > 0) return data;\r\n        else if (this.dataById[this.selectedMain])\r\n            return [this.dataById[this.selectedMain]]\r\n        else return [];\r\n    }\r\n\r\n    initFoot() {\r\n        this.foot = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.foot');\r\n        this.append(this.foot);\r\n        let menuButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('button.menuButton span.icon-settings');\r\n        this.foot.append(menuButton)\r\n        menuButton.onclick = e => this.showConfigPopup();\r\n        this.pagination = new _paginationButtons_js__WEBPACK_IMPORTED_MODULE_3__.PaginationButtons();\r\n        this.pagination.onpageclick = (page) => {\r\n            this.start = page * this.limit;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.pagination);\r\n        this.dateInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {type: 'month', value: new Date().toISOString().substring(0, 7)});\r\n        this.dateInput.onchange = date => {\r\n            this.start = 0;\r\n            this.date = this.dateInput.value;\r\n            this.refresh();\r\n        }\r\n        this.foot.append(this.dateInput);\r\n        this.filterShortContainer = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('.filterShortContainer');\r\n        this.foot.append(this.filterShortContainer);\r\n        this.searchForm = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('form', {className: 'search'});\r\n        this.foot.append(this.searchForm);\r\n        this.searchForm.onsubmit = e => e.preventDefault();\r\n        const searchInput = (0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)('input', {\r\n            name: 'search',\r\n            type: 'search',\r\n            placeholder: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.search')\r\n        });\r\n        this.searchForm.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_8__.create)(searchInput));\r\n        searchInput.oninput = e => {\r\n            this.start = 0;\r\n            this.refresh();\r\n        }\r\n\r\n    }\r\n\r\n    get search() {\r\n        if (!this.foot) return '';\r\n        const searchForm = this.foot.querySelector('.search');\r\n        if (!searchForm) return '';\r\n        return searchForm.search.value;\r\n    }\r\n\r\n    showGlobalContextMenu(e) {\r\n        let elements = [{\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.paginationMode'),\r\n            icon: 'icon-pagination',\r\n            onclick: () => {\r\n                this.infiniteScrollEnabled = false;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.scrollMode'),\r\n            icon: 'icon-scroll',\r\n            onclick: () => {\r\n                this.infiniteScrollEnabled = true;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.tableView'),\r\n            icon: 'icon-table',\r\n            onclick: () => {\r\n                this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                this.refresh();\r\n            }\r\n        }, {\r\n            text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.listView'),\r\n            icon: 'icon-list',\r\n            onclick: () => {\r\n                this.insideViewClass = _listView_js__WEBPACK_IMPORTED_MODULE_1__.ListView;\r\n                this.refresh();\r\n            }\r\n        }];\r\n        if (this.dateRowCallback != null) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.calendarView'),\r\n                 icon: 'icon-calendar',\r\n                onclick: () => {\r\n                    this.insideViewClass = _calendarView_js__WEBPACK_IMPORTED_MODULE_9__.CalendarView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.datasource.canGetSummary) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.graphView'),\r\n                 icon: 'icon-graph',\r\n                onclick: () => {\r\n                    this.insideViewClass = _graphView_js__WEBPACK_IMPORTED_MODULE_10__.GraphView;\r\n                    this.refresh();\r\n                }\r\n            });\r\n        }\r\n        if (this.allowTableEdit) {\r\n            elements.push({\r\n                text: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_2__.t)('objectList.startMultiEdit'),\r\n                icon: 'icon-edit',\r\n                onclick: async () => {\r\n                    this.insideViewClass = _tableView_js__WEBPACK_IMPORTED_MODULE_0__.TableView;\r\n                    const getSelects=datasource.getSelects?await datasource.getSelects(this):null;\r\n                    this.refresh();\r\n                    this.insideView.startMultiEdit(getSelects);\r\n                }\r\n            });\r\n        }\r\n        _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_4__.ContextMenu.openContextMenu(e, elements);\r\n    }\r\n\r\n    resize() {\r\n        let limit = this.limit;\r\n        this.refreshLimit();\r\n        if (limit != this.limit) {\r\n            this.refresh();\r\n        }\r\n    }\r\n\r\n    multiEditChanged(id, data, save = false) {\r\n        this.datasource.multiEditChanged(id, data, save);\r\n    }\r\n\r\n    showConfigPopup() {\r\n        if (this.querySelector('config-popup')) {\r\n            this.querySelector('config-popup').remove()\r\n        } else {\r\n            const popup = new _ConfigPopup_js__WEBPACK_IMPORTED_MODULE_7__.ConfigPopup(this)\r\n            this.append(popup)\r\n        }\r\n    }\r\n\r\n    gotoUrl(url) {\r\n        window.location.href = url;\r\n    }\r\n\r\n    onkeydown(e) {\r\n        if (e.ctrlKey) {\r\n            if (e.key == 'ArrowLeft' || e.key == 'ArrowRight') {\r\n                let page = Math.floor(this.start / this.limit);\r\n                page += (e.key == 'ArrowLeft' ? -1 : 1);\r\n                if (page < 0) page = 0;\r\n                else if (page > 0 && page > Math.ceil(this.total / this.limit) - 1) page = Math.ceil(this.total / this.limit) - 1;\r\n                this.start = page * this.limit;\r\n                this.refresh();\r\n            }\r\n        }\r\n    }\r\n\r\n\r\n    reorderColumns(column, next) {\r\n        console.log('reorderColumns')\r\n        if (column) {\r\n            this.columnsReordered.splice(this.columnsReordered.indexOf(column), 1);\r\n            if (next)\r\n                this.columnsReordered.splice(this.columnsReordered.indexOf(next), 0, column);\r\n            else\r\n                this.columnsReordered.push(column)\r\n\r\n            this.columnsReorderedChanged = true;\r\n            if (this.insideView.setColumnsWidths) {\r\n                this.insideView.setColumnsWidths()\r\n            }\r\n        }\r\n    }\r\n}\r\n\r\ncustomElements\r\n    .define(\r\n        'data-view'\r\n        ,\r\n        ObjectsList\r\n    )\r\n;\r\n\n\n//# sourceURL=webpack://@green-code-studio/objects-list/./src/objectsList.js?");
 
 /***/ }),
 
@@ -214,7 +214,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
   \**************************/
 /***/ ((__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) => {
 
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   TableView: () => (/* binding */ TableView)\n/* harmony export */ });\n/* harmony import */ var _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @green-code-studio/context-menu/dist/index.mjs */ \"./node_modules/@green-code-studio/context-menu/dist/index.mjs\");\n/* harmony import */ var fast_creator__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! fast-creator */ \"./node_modules/fast-creator/dist/entry.js\");\n/* harmony import */ var _abstractView_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./abstractView.js */ \"./src/abstractView.js\");\n/* harmony import */ var _i18n_xml__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./i18n.xml */ \"./src/i18n.xml\");\n\r\n\r\n\r\n\r\n\r\nclass TableView extends _abstractView_js__WEBPACK_IMPORTED_MODULE_2__.AbstractView {\r\n    constructor(objectsList, params) {\r\n        super();\r\n        this.objectsList = objectsList;\r\n        this.init();\r\n        window.dbgTable = this;\r\n        this.params = params ?? {};\r\n    }\r\n\r\n    init() {\r\n        this.head = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.head');\r\n        this.append(this.head);\r\n        this.refreshHeader();\r\n        const bodyContainer = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.bodyContainer')\r\n        this.body = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.body')\r\n        bodyContainer.append(this.body)\r\n        this.append(bodyContainer);\r\n        this.setColumnsWidths();\r\n        addEventListener('resize', this.setColumnsWidths.bind(this))\r\n        addEventListener('copy', this.onCopy.bind(this));\r\n        this.addEventListener('scroll', this.onScroll.bind(this));\r\n    }\r\n\r\n    refreshHeader() {\r\n        while (this.head.firstChild) this.head.firstChild.remove();\r\n\r\n        console.log('uuu')\r\n        this.head.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.column.icon'))\r\n        for (let column of this.objectsList.visibleColumns) {\r\n            let node = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.column')\r\n            node.__column = column\r\n            this.head.append(node);\r\n            node.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('span.name', {text: column.name}));\r\n            if (column.sortName) {\r\n                node.classList.add('ableToSort');\r\n                node.dataset.sortName = column.sortName\r\n                node.onclick = () => {\r\n                    let sortName = column.sortName || x.dataset.value;\r\n                    if (this.objectsList.sort && this.objectsList.sort.col === column.sortName) {\r\n                        this.objectsList.sort.desc = !this.objectsList.sort.desc;\r\n                    } else {\r\n                        this.objectsList.sort = {col: column.sortName, desc: false};\r\n                    }\r\n                    if (!this.objectsList.infiniteScrollEnabled) {\r\n                        this.objectsList.start = 0;\r\n                    }\r\n                    this.objectsList.refresh();\r\n                }\r\n            }\r\n            this.initColumnMovability(node)\r\n        }\r\n        this.head.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.column.actions'))\r\n\r\n\r\n        this.setColumnsWidths();\r\n    }\r\n\r\n    initColumnMovability(node) {\r\n        let startX = null;\r\n        let changed = false;\r\n        let onmove = (e) => {\r\n            const movement = (e.pageX - startX);\r\n            node.style.setProperty('--move-x', movement + 'px');\r\n            if (movement < -node.previousElementSibling.clientWidth / 2) {\r\n                if (node.previousElementSibling.__column) {\r\n                    startX -= node.previousElementSibling.clientWidth;\r\n                    const prev = node.previousElementSibling;\r\n                    node.parentNode.insertBefore(node, prev);\r\n                    this.objectsList.reorderColumns(node.__column, prev?.__column)\r\n                    changed = true;\r\n                }\r\n            } else if (movement > node.nextElementSibling.clientWidth / 2) {\r\n                if (node.nextElementSibling.__column) {\r\n                    startX += node.nextElementSibling.clientWidth;\r\n                    const next = node.nextElementSibling.nextElementSibling;\r\n                    node.parentNode.insertBefore(node, next);\r\n                    this.objectsList.reorderColumns(node.__column, next?.__column)\r\n                    changed = true;\r\n                }\r\n            }\r\n        }\r\n        const onup = e => {\r\n            const movement = (e.pageX - startX);\r\n            if (Math.abs(movement) < 10 && !changed) {\r\n                if (node.onclick)\r\n                    node.onclick();\r\n            }\r\n            startX = null;\r\n            node.style.setProperty('--move-x', 0 + 'px');\r\n            removeEventListener('mousemove', onmove);\r\n            removeEventListener('mouseup', onup);\r\n            if(changed) {\r\n                this.objectsList.refresh()\r\n            }\r\n        }\r\n        node.addEventListener('mousedown', (e) => {\r\n            startX = e.pageX;\r\n            addEventListener('mousemove', onmove)\r\n            addEventListener('mouseup', onup)\r\n        })\r\n    }\r\n\r\n    loadData(data, start, limit, infiniteScrollEnabled) {\r\n        this.refreshSortIndicators();\r\n        super.loadData(data, start, limit, infiniteScrollEnabled)\r\n        this.setColumnsWidths();\r\n    }\r\n\r\n    get rowHeight() {\r\n        return parseFloat(window.getComputedStyle(this).getPropertyValue('--rowHeight') ?? 31);\r\n    }\r\n\r\n    generateRow(data) {\r\n        let tr = this.body.querySelector(`.tr[data-row=\"${data.id}\"]`);\r\n        if (!tr) {\r\n            tr = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.tr');\r\n            tr.draggable = true;\r\n        }\r\n        tr.classList.toggle('selected', this.objectsList.selected.has(data.id))\r\n        this.fillRowContent(tr, data);\r\n        return tr;\r\n    }\r\n\r\n    fillRowContent(tr, data) {\r\n        tr.lastData = data;\r\n        while (tr.firstChild) {\r\n            tr.removeChild(tr.firstChild)\r\n        }\r\n        tr.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.td.icon', {className: this.objectsList.icon}));\r\n        for (let column of this.objectsList.visibleColumns) {\r\n            let td = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.td');\r\n            tr.append(td);\r\n            if (this.multiEdit && column.dataName) {\r\n                tr.dataset.id = data.id;\r\n                td.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('input', {\r\n                    data: {name: column.dataName},\r\n                    value: data[column.dataName],\r\n                    onclick: e => e.stopPropagation(),\r\n                    onchange: () => this.multiEditChanged(tr)\r\n                }));\r\n            } else {\r\n                td.append(column.content?.call(column, data) || data[column.dataName] || '');\r\n            }\r\n        }\r\n        let actionsTd = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.td.actions');\r\n        tr.append(actionsTd);\r\n        let actions = this.objectsList.generateActions([data], 'row');\r\n        if (this.multiEdit && data.__isMultirowEdited) {\r\n            actions = [\r\n                {\r\n                    name: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_3__.t)(\"objectList.saveRow\"),\r\n                    icon: 'icon-save',\r\n                    command: () => {\r\n                        this.multiEditChanged(tr, true)\r\n                    }\r\n                }\r\n            ]\r\n        }\r\n        for (let action of actions) {\r\n            let actionButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)(action.href ? 'a.button' : 'button', {\r\n                title: action.name\r\n            });\r\n            actionsTd.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)(actionButton));\r\n            actionButton.classList.add('action-' + (action.action ?? 'view'));\r\n\r\n            if (action.href) {\r\n                actionButton.href = action.href;\r\n            }\r\n            if (action.command) {\r\n                actionButton.onclick = action.command;\r\n            }\r\n            if (action.icon) {\r\n                actionButton.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('span', {classList: [action.icon]}));\r\n            } else {\r\n                actionButton.textContent = action.name;\r\n            }\r\n        }\r\n\r\n\r\n        tr.dataset.row = data.id;\r\n        tr.oncontextmenu = this.contextMenu.bind(this, tr);\r\n        tr.onclick = this.trOnClick.bind(this, data);\r\n        tr.ondblclick = this.trOnDblClick.bind(this, data, tr);\r\n        tr.onkeydown = this.trOnKeyDown.bind(this, data, tr);\r\n        tr.ondragstart = this.trOnDragStart.bind(this, data, tr);\r\n    }\r\n\r\n    setColumnsWidths() {\r\n        const widths = this.calculateColumnsWidths();\r\n        for (let tr of this.body?.children ?? []) {\r\n            for (let i = 0; i < widths.length; i++) {\r\n                if(tr.children[i]) {\r\n                    tr.children[i].style.width = widths[i] + 'px';\r\n                }\r\n            }\r\n        }\r\n        let sum = 0;\r\n        for (let i = 0; i < widths.length; i++) {\r\n            let node = this.head.children[i];\r\n            if (node) {\r\n                if (i + 1 < widths.length)\r\n                    node.style.width = widths[i] + 1 + 'px';\r\n                else\r\n                    node.style.width = widths[i] + 'px';\r\n                node.style.left = sum + 'px';\r\n            }\r\n            sum += widths[i];\r\n        }\r\n    }\r\n\r\n    calculateColumnsWidths() {\r\n        let needed = [{base: 30, grow: 0}];\r\n\r\n        for (let column of this.objectsList.visibleColumns) {\r\n            needed.push({base: column.width || 10, grow: typeof (column.widthGrow) == \"number\" ? column.widthGrow : 1});\r\n        }\r\n        let actionWidth = Math.ceil(Array.from(this.querySelectorAll('.td.actions')).map(x => {\r\n            if (x.lastElementChild)\r\n                return x.lastElementChild.getBoundingClientRect().right - x.getBoundingClientRect().left + parseFloat(getComputedStyle(x).paddingRight);\r\n            else\r\n                return 0;\r\n        }).reduce((a, b) => Math.max(a, b), 0));\r\n        needed.push({base: actionWidth, grow: 0});\r\n        let availableToGrow = this.clientWidth - needed.map(x => x.base).reduce((a, b) => a + b, 0);\r\n        let sumGrow = needed.map(x => x.grow).reduce((a, b) => a + b, 0);\r\n        if (this.params?.wide) {\r\n            return needed.map(x => x.base + x.grow * Math.max(100, availableToGrow / sumGrow));\r\n        } else {\r\n            if (availableToGrow > 0 && sumGrow > 0) {\r\n                return needed.map(x => x.base + x.grow / sumGrow * availableToGrow);\r\n            } else {\r\n                return needed.map(x => x.base);\r\n            }\r\n        }\r\n    }\r\n\r\n    refreshSortIndicators() {\r\n        this.head.querySelectorAll('[data-order]').forEach(x => delete x.dataset.order);\r\n        if (this.objectsList.sort)\r\n            this.head.querySelectorAll(`[data-sort-name=\"${this.objectsList.sort.col}\"]`).forEach(x => x.dataset.order = this.objectsList.sort.desc ? 'desc' : 'asc');\r\n    }\r\n\r\n    generateTableHtml(trs) {\r\n        const thead = '<thead><tr>' + Array.from(this.head.querySelectorAll('.column')).map(x => '<th>' + x.innerHTML + '</th>').join('') + '</tr></thead>';\r\n        const tbody = '<tbody>' + trs.map(tr => {\r\n            return '<tr>' + Array.from(tr.children).slice(1, -1).map(td => {\r\n                return '<td>' + td.innerHTML + '</td>';\r\n            }).join('') + '</tr>';\r\n        }).join('') + '</tbody>'\r\n        return '<table>' + thead + tbody + '</table>';\r\n    }\r\n\r\n    generateTableTextPlain(trs) {\r\n        const head = Array.from(this.head.querySelectorAll('.column')).map(x => x.textContent.replace(/\\r\\n/gm, ' ')).join(\"\\t\")\r\n        const body = trs.map(tr => Array.from(tr.children).slice(1).map(x => x.textContent.replace(/\\r\\n/gm, ' ')).join(\"\\t\")).join(\"\\r\\n\")\r\n        return head + \"\\r\\n\" + body;\r\n    }\r\n\r\n    calcMaxVisibleItems(height) {\r\n        return Math.floor((height - this.head.clientHeight) / this.rowHeight);\r\n    }\r\n\r\n    forceCopy(rows) {\r\n        this.copyForced = new Set(rows.map(x => x.id));\r\n        document.execCommand(\"copy\");\r\n        setTimeout(() => this.copyForced = null, 100);\r\n    }\r\n\r\n    startMultiEdit() {\r\n        this.multiEdit = true;\r\n    }\r\n\r\n    multiEditChanged(tr, save = false) {\r\n        let data = [...tr.querySelectorAll('[data-name]')].map(x => [x.dataset.name, x.value]);\r\n        let dataObj = Object.fromEntries(data);\r\n        this.objectsList.multiEditChanged(tr.dataset.id, dataObj, save);\r\n        this.fillRowContent(tr, {...tr.lastData, ...dataObj, __isMultirowEdited: true});\r\n        this.setColumnsWidths();\r\n    }\r\n}\r\n\r\ncustomElements.define('table-view', TableView);\r\n\n\n//# sourceURL=webpack://@green-code-studio/objects-list/./src/tableView.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   TableView: () => (/* binding */ TableView)\n/* harmony export */ });\n/* harmony import */ var _green_code_studio_context_menu_dist_index_mjs__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @green-code-studio/context-menu/dist/index.mjs */ \"./node_modules/@green-code-studio/context-menu/dist/index.mjs\");\n/* harmony import */ var fast_creator__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! fast-creator */ \"./node_modules/fast-creator/dist/entry.js\");\n/* harmony import */ var _abstractView_js__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./abstractView.js */ \"./src/abstractView.js\");\n/* harmony import */ var _i18n_xml__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./i18n.xml */ \"./src/i18n.xml\");\n\r\n\r\n\r\n\r\n\r\nclass TableView extends _abstractView_js__WEBPACK_IMPORTED_MODULE_2__.AbstractView {\r\n    constructor(objectsList, params) {\r\n        super();\r\n        this.objectsList = objectsList;\r\n        this.init();\r\n        window.dbgTable = this;\r\n        this.params = params ?? {};\r\n    }\r\n\r\n    init() {\r\n        this.head = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.head');\r\n        this.append(this.head);\r\n        this.refreshHeader();\r\n        const bodyContainer = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.bodyContainer')\r\n        this.body = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.body')\r\n        bodyContainer.append(this.body)\r\n        this.append(bodyContainer);\r\n        this.setColumnsWidths();\r\n        addEventListener('resize', this.setColumnsWidths.bind(this))\r\n        addEventListener('copy', this.onCopy.bind(this));\r\n        this.addEventListener('scroll', this.onScroll.bind(this));\r\n    }\r\n\r\n    refreshHeader() {\r\n        while (this.head.firstChild) this.head.firstChild.remove();\r\n\r\n        console.log('uuu')\r\n        this.head.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.column.icon'))\r\n        for (let column of this.objectsList.visibleColumns) {\r\n            let node = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.column')\r\n            node.__column = column\r\n            this.head.append(node);\r\n            node.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('span.name', {text: column.name}));\r\n            if (column.sortName) {\r\n                node.classList.add('ableToSort');\r\n                node.dataset.sortName = column.sortName\r\n                node.onclick = () => {\r\n                    let sortName = column.sortName || x.dataset.value;\r\n                    if (this.objectsList.sort && this.objectsList.sort.col === column.sortName) {\r\n                        this.objectsList.sort.desc = !this.objectsList.sort.desc;\r\n                    } else {\r\n                        this.objectsList.sort = {col: column.sortName, desc: false};\r\n                    }\r\n                    if (!this.objectsList.infiniteScrollEnabled) {\r\n                        this.objectsList.start = 0;\r\n                    }\r\n                    this.objectsList.refresh();\r\n                }\r\n            }\r\n            this.initColumnMovability(node)\r\n        }\r\n        this.head.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.column.actions'))\r\n\r\n\r\n        this.setColumnsWidths();\r\n    }\r\n\r\n    initColumnMovability(node) {\r\n        let startX = null;\r\n        let changed = false;\r\n        let onmove = (e) => {\r\n            const movement = (e.pageX - startX);\r\n            node.style.setProperty('--move-x', movement + 'px');\r\n            if (movement < -node.previousElementSibling.clientWidth / 2) {\r\n                if (node.previousElementSibling.__column) {\r\n                    startX -= node.previousElementSibling.clientWidth;\r\n                    const prev = node.previousElementSibling;\r\n                    node.parentNode.insertBefore(node, prev);\r\n                    this.objectsList.reorderColumns(node.__column, prev?.__column)\r\n                    changed = true;\r\n                }\r\n            } else if (movement > node.nextElementSibling.clientWidth / 2) {\r\n                if (node.nextElementSibling.__column) {\r\n                    startX += node.nextElementSibling.clientWidth;\r\n                    const next = node.nextElementSibling.nextElementSibling;\r\n                    node.parentNode.insertBefore(node, next);\r\n                    this.objectsList.reorderColumns(node.__column, next?.__column)\r\n                    changed = true;\r\n                }\r\n            }\r\n        }\r\n        const onup = e => {\r\n            const movement = (e.pageX - startX);\r\n            if (Math.abs(movement) < 10 && !changed) {\r\n                if (node.onclick)\r\n                    node.onclick();\r\n            }\r\n            startX = null;\r\n            node.style.setProperty('--move-x', 0 + 'px');\r\n            removeEventListener('mousemove', onmove);\r\n            removeEventListener('mouseup', onup);\r\n            if (changed) {\r\n                this.objectsList.refresh()\r\n            }\r\n        }\r\n        node.addEventListener('mousedown', (e) => {\r\n            startX = e.pageX;\r\n            addEventListener('mousemove', onmove)\r\n            addEventListener('mouseup', onup)\r\n        })\r\n    }\r\n\r\n    loadData(data, start, limit, infiniteScrollEnabled) {\r\n        this.refreshSortIndicators();\r\n        super.loadData(data, start, limit, infiniteScrollEnabled)\r\n        this.setColumnsWidths();\r\n    }\r\n\r\n    get rowHeight() {\r\n        return parseFloat(window.getComputedStyle(this).getPropertyValue('--rowHeight') ?? 31);\r\n    }\r\n\r\n    generateRow(data) {\r\n        let tr = this.body.querySelector(`.tr[data-row=\"${data.id}\"]`);\r\n        if (!tr) {\r\n            tr = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.tr');\r\n            tr.draggable = true;\r\n        }\r\n        tr.classList.toggle('selected', this.objectsList.selected.has(data.id))\r\n        this.fillRowContent(tr, data);\r\n        return tr;\r\n    }\r\n\r\n    fillRowContent(tr, data) {\r\n        tr.lastData = data;\r\n        while (tr.firstChild) {\r\n            tr.removeChild(tr.firstChild)\r\n        }\r\n        tr.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.td.icon', {className: this.objectsList.icon}));\r\n        for (let column of this.objectsList.visibleColumns) {\r\n            let td = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.td');\r\n            tr.append(td);\r\n            if (this.multiEdit && column.dataName) {\r\n                tr.dataset.id = data.id;\r\n                if (column.dataType === 'select') {\r\n                    let select = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('select', {\r\n                        data: {name: column.dataName},\r\n                        onchange: () => this.multiEditChanged(tr)\r\n                    }, ...this.selects[column.dataName].map(x => (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('option', {value: x.id, text: x.name})));\r\n                    select.value = data[column.dataName];\r\n                    td.append(select);\r\n                } else {\r\n                    td.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('input', {\r\n                        data: {name: column.dataName},\r\n                        value: data[column.dataName],\r\n                        onclick: e => e.stopPropagation(),\r\n                        onchange: () => this.multiEditChanged(tr)\r\n                    }));\r\n                }\r\n            } else {\r\n                td.append(column.content?.call(column, data) || data[column.dataName] || '');\r\n            }\r\n        }\r\n        let actionsTd = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('.td.actions');\r\n        tr.append(actionsTd);\r\n        let actions = this.objectsList.generateActions([data], 'row');\r\n        if (this.multiEdit && data.__isMultirowEdited) {\r\n            actions = [\r\n                {\r\n                    name: (0,_i18n_xml__WEBPACK_IMPORTED_MODULE_3__.t)(\"objectList.saveRow\"),\r\n                    icon: 'icon-save',\r\n                    command: () => {\r\n                        this.multiEditChanged(tr, true)\r\n                    }\r\n                }\r\n            ]\r\n        }\r\n        for (let action of actions) {\r\n            let actionButton = (0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)(action.href ? 'a.button' : 'button', {\r\n                title: action.name\r\n            });\r\n            actionsTd.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)(actionButton));\r\n            actionButton.classList.add('action-' + (action.action ?? 'view'));\r\n\r\n            if (action.href) {\r\n                actionButton.href = action.href;\r\n            }\r\n            if (action.command) {\r\n                actionButton.onclick = action.command;\r\n            }\r\n            if (action.icon) {\r\n                actionButton.append((0,fast_creator__WEBPACK_IMPORTED_MODULE_1__.create)('span', {classList: [action.icon]}));\r\n            } else {\r\n                actionButton.textContent = action.name;\r\n            }\r\n        }\r\n\r\n\r\n        tr.dataset.row = data.id;\r\n        tr.oncontextmenu = this.contextMenu.bind(this, tr);\r\n        tr.onclick = this.trOnClick.bind(this, data);\r\n        tr.ondblclick = this.trOnDblClick.bind(this, data, tr);\r\n        tr.onkeydown = this.trOnKeyDown.bind(this, data, tr);\r\n        tr.ondragstart = this.trOnDragStart.bind(this, data, tr);\r\n    }\r\n\r\n    setColumnsWidths() {\r\n        const widths = this.calculateColumnsWidths();\r\n        for (let tr of this.body?.children ?? []) {\r\n            for (let i = 0; i < widths.length; i++) {\r\n                if (tr.children[i]) {\r\n                    tr.children[i].style.width = widths[i] + 'px';\r\n                }\r\n            }\r\n        }\r\n        let sum = 0;\r\n        for (let i = 0; i < widths.length; i++) {\r\n            let node = this.head.children[i];\r\n            if (node) {\r\n                if (i + 1 < widths.length)\r\n                    node.style.width = widths[i] + 1 + 'px';\r\n                else\r\n                    node.style.width = widths[i] + 'px';\r\n                node.style.left = sum + 'px';\r\n            }\r\n            sum += widths[i];\r\n        }\r\n    }\r\n\r\n    calculateColumnsWidths() {\r\n        let needed = [{base: 30, grow: 0}];\r\n\r\n        for (let column of this.objectsList.visibleColumns) {\r\n            needed.push({base: column.width || 10, grow: typeof (column.widthGrow) == \"number\" ? column.widthGrow : 1});\r\n        }\r\n        let actionWidth = Math.ceil(Array.from(this.querySelectorAll('.td.actions')).map(x => {\r\n            if (x.lastElementChild)\r\n                return x.lastElementChild.getBoundingClientRect().right - x.getBoundingClientRect().left + parseFloat(getComputedStyle(x).paddingRight);\r\n            else\r\n                return 0;\r\n        }).reduce((a, b) => Math.max(a, b), 0));\r\n        needed.push({base: actionWidth, grow: 0});\r\n        let availableToGrow = this.clientWidth - needed.map(x => x.base).reduce((a, b) => a + b, 0);\r\n        let sumGrow = needed.map(x => x.grow).reduce((a, b) => a + b, 0);\r\n        if (this.params?.wide) {\r\n            return needed.map(x => x.base + x.grow * Math.max(100, availableToGrow / sumGrow));\r\n        } else {\r\n            if (availableToGrow > 0 && sumGrow > 0) {\r\n                return needed.map(x => x.base + x.grow / sumGrow * availableToGrow);\r\n            } else {\r\n                return needed.map(x => x.base);\r\n            }\r\n        }\r\n    }\r\n\r\n    refreshSortIndicators() {\r\n        this.head.querySelectorAll('[data-order]').forEach(x => delete x.dataset.order);\r\n        if (this.objectsList.sort)\r\n            this.head.querySelectorAll(`[data-sort-name=\"${this.objectsList.sort.col}\"]`).forEach(x => x.dataset.order = this.objectsList.sort.desc ? 'desc' : 'asc');\r\n    }\r\n\r\n    generateTableHtml(trs) {\r\n        const thead = '<thead><tr>' + Array.from(this.head.querySelectorAll('.column')).map(x => '<th>' + x.innerHTML + '</th>').join('') + '</tr></thead>';\r\n        const tbody = '<tbody>' + trs.map(tr => {\r\n            return '<tr>' + Array.from(tr.children).slice(1, -1).map(td => {\r\n                return '<td>' + td.innerHTML + '</td>';\r\n            }).join('') + '</tr>';\r\n        }).join('') + '</tbody>'\r\n        return '<table>' + thead + tbody + '</table>';\r\n    }\r\n\r\n    generateTableTextPlain(trs) {\r\n        const head = Array.from(this.head.querySelectorAll('.column')).map(x => x.textContent.replace(/\\r\\n/gm, ' ')).join(\"\\t\")\r\n        const body = trs.map(tr => Array.from(tr.children).slice(1).map(x => x.textContent.replace(/\\r\\n/gm, ' ')).join(\"\\t\")).join(\"\\r\\n\")\r\n        return head + \"\\r\\n\" + body;\r\n    }\r\n\r\n    calcMaxVisibleItems(height) {\r\n        return Math.floor((height - this.head.clientHeight) / this.rowHeight);\r\n    }\r\n\r\n    forceCopy(rows) {\r\n        this.copyForced = new Set(rows.map(x => x.id));\r\n        document.execCommand(\"copy\");\r\n        setTimeout(() => this.copyForced = null, 100);\r\n    }\r\n\r\n    startMultiEdit(selects) {\r\n        this.multiEdit = true;\r\n        this.selects = selects;\r\n    }\r\n\r\n    multiEditChanged(tr, save = false) {\r\n        let data = [...tr.querySelectorAll('[data-name]')].map(x => [x.dataset.name, x.value]);\r\n        let dataObj = Object.fromEntries(data);\r\n        this.objectsList.multiEditChanged(tr.dataset.id, dataObj, save);\r\n        this.fillRowContent(tr, {...tr.lastData, ...dataObj, __isMultirowEdited: true});\r\n        this.setColumnsWidths();\r\n    }\r\n}\r\n\r\ncustomElements.define('table-view', TableView);\r\n\n\n//# sourceURL=webpack://@green-code-studio/objects-list/./src/tableView.js?");
 
 /***/ }),
 

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@green-code-studio/objects-list",
-    "version": "1.13.1",
+    "version": "1.14.0",
     "main": "src/index.js",
     "author": "Mateusz Krawczyk",
     "license": "MIT",

package/src/objectsList.js

@@ -415,7 +415,7 @@ export class ObjectsList extends HTMLElement {
                 }
             });
         }
-        if (this.datasource.canGetSummary != null) {
+        if (this.datasource.canGetSummary) {
             elements.push({
                 text: t('objectList.graphView'),
                  icon: 'icon-graph',
@@ -429,10 +429,11 @@ export class ObjectsList extends HTMLElement {
             elements.push({
                 text: t('objectList.startMultiEdit'),
                 icon: 'icon-edit',
-                onclick: () => {
+                onclick: async () => {
                     this.insideViewClass = TableView;
+                    const getSelects=datasource.getSelects?await datasource.getSelects(this):null;
                     this.refresh();
-                    this.insideView.startMultiEdit();
+                    this.insideView.startMultiEdit(getSelects);
                 }
             });
         }

package/src/tableView.js

@@ -94,7 +94,7 @@ export class TableView extends AbstractView {
             node.style.setProperty('--move-x', 0 + 'px');
             removeEventListener('mousemove', onmove);
             removeEventListener('mouseup', onup);
-            if(changed) {
+            if (changed) {
                 this.objectsList.refresh()
             }
         }
@@ -137,12 +137,21 @@ export class TableView extends AbstractView {
             tr.append(td);
             if (this.multiEdit && column.dataName) {
                 tr.dataset.id = data.id;
-                td.append(create('input', {
-                    data: {name: column.dataName},
-                    value: data[column.dataName],
-                    onclick: e => e.stopPropagation(),
-                    onchange: () => this.multiEditChanged(tr)
-                }));
+                if (column.dataType === 'select') {
+                    let select = create('select', {
+                        data: {name: column.dataName},
+                        onchange: () => this.multiEditChanged(tr)
+                    }, ...this.selects[column.dataName].map(x => create('option', {value: x.id, text: x.name})));
+                    select.value = data[column.dataName];
+                    td.append(select);
+                } else {
+                    td.append(create('input', {
+                        data: {name: column.dataName},
+                        value: data[column.dataName],
+                        onclick: e => e.stopPropagation(),
+                        onchange: () => this.multiEditChanged(tr)
+                    }));
+                }
             } else {
                 td.append(column.content?.call(column, data) || data[column.dataName] || '');
             }
@@ -194,7 +203,7 @@ export class TableView extends AbstractView {
         const widths = this.calculateColumnsWidths();
         for (let tr of this.body?.children ?? []) {
             for (let i = 0; i < widths.length; i++) {
-                if(tr.children[i]) {
+                if (tr.children[i]) {
                     tr.children[i].style.width = widths[i] + 'px';
                 }
             }
@@ -271,8 +280,9 @@ export class TableView extends AbstractView {
         setTimeout(() => this.copyForced = null, 100);
     }
 
-    startMultiEdit() {
+    startMultiEdit(selects) {
         this.multiEdit = true;
+        this.selects = selects;
     }
 
     multiEditChanged(tr, save = false) {