globuswebcomponents 2.18.4 → 2.18.5

package/dist/collection/components/gb-table/gb-table.js

@@ -29,9 +29,9 @@ export class GbTable {
         //   key: 'status',
         //   label: 'Status',
         //   cellComponent: 'gb-button',
-        //   cellProps: row => ({ 
-        //     hierarchy: 'link_gray', 
-        //     size: 'md', 
+        //   cellProps: row => ({
+        //     hierarchy: 'link_gray',
+        //     size: 'md',
         //     icon: 'default',
         //     iconLeading: true,
         //     iconLeadingSwap: 'assets/view.svg'
@@ -600,9 +600,9 @@ export class GbTable {
             this.isScrollable = newScrollable; // only update if different
         }
     }
-    async handleAction(action, row) {
+    async handleAction(action, row, disabled) {
         // console.log('Action clicked:', action, row);
-        this.rowActionClicked.emit({ action, row });
+        this.rowActionClicked.emit({ action, row, disabled });
     }
     renderCell(col, row) {
         var _a, _b, _c, _d, _e, _f;
@@ -941,8 +941,10 @@ export class GbTable {
                 e.stopPropagation();
                 this.handleAction(action.action, row);
             } })))))), h(Fragment, null, this.openRowIndex === rowIndex && (h("gb-portal", { "anchor-id": `gb-table-trigger-${rowIndex}`, placement: this.dropdownPlacement, anchorEl: this.currentAnchorEl, boundaryEl: this.scrollContainer, dropdownHeight: requestAnimationFrame(() => this.dropdownRef.scrollHeight), open: true }, h("div", { class: "portal_dropdown_wrapper", ref: el => (this.dropdownRef = el) }, this.dropdownOptions.map(action => (h("gb-dropdown-items-with-shortcut", { icon: action.icon ? true : false, state: action.disabled ? StateEnum.Disabled : StateEnum.Default, label: action.label, "icon-src": action.icon, onClick: () => {
-                this.handleAction(action.action, row);
-                this.openRowIndex = null;
+                if (!action.disabled) {
+                    this.handleAction(action.action, row, action.disabled ? true : false);
+                    this.openRowIndex = null;
+                }
             } })))))))))))))))));
     }
     renderGridView() {
@@ -1158,16 +1160,16 @@ export class GbTable {
         window.removeEventListener('resize', this.checkViewport);
     }
     render() {
-        return (h("div", { key: 'ae2fa96cbec415c81f3da4bf23be2d554f647191', class: `table_wrapper ${this.currentTableLayout}` }, this.tableHeaderConfig && (h("div", { key: '0b1adf00e958704ac66bb7668cf7aad5d9ce9eb4', class: `table-header ${this.currentTableLayout}` }, h("gb-table-header", { key: '917206d14c27e5c6950ecbd2a9aa97400fec96a8', type: this.tableHeaderConfig.type, mode: this.tableHeaderConfig.datePickerMode, "table-heading": this.tableHeaderConfig.tableHeading, "table-heading-label": this.tableHeaderConfig.tableHeadingLabel, "show-search": this.tableHeaderConfig.showSearch, "show-date-filter": this.tableHeaderConfig.showDateFilter, "show-filter": this.tableHeaderConfig.showFilter, "show-export": this.tableHeaderConfig.showExport, "show-column-options": this.tableHeaderConfig.showColumnOptions, "show-refresh-button": this.tableHeaderConfig.showRefreshButton, "input-placeholder": this.tableHeaderConfig.inputPlaceholder, "date-picker-placeholder": this.tableHeaderConfig.datePickerPlaceholder, "show-entire-data": this.tableHeaderConfig.showEntireData, "show-layout-toggle": this.tableHeaderConfig.showLayoutToggle, "filter-state": Object.keys(this.appliedFilterValues).length > 0 ? 'applied' : 'default', "filter-count": Object.keys(this.appliedFilterValues).length, "export-button-state": this.tableHeaderConfig.exportButtonState, "pdf-state": this.tableHeaderConfig.pdfState, "csv-state": this.tableHeaderConfig.csvState, "pdf-sub-dropdown": this.tableHeaderConfig.pdfSubDropdown, "csv-sub-dropdown": this.tableHeaderConfig.csvSubDropdown, onInputValueChanged: this.emitSearchValue.bind(this), onDateChange: this.emitDateChange.bind(this), onColumnOptionsButtonClicked: this.columnOptionsButtonClicked(), onExportClicked: e => this.exportButtonClicked(e), onFilterButtonClicked: () => this.openFilterModal(), onRefreshButtonClicked: () => this.onRefreshButtonClicked(), onLayoutButtonClicked: e => this.switchTableLayout(e), onTableControlClicked: e => this.emitTableContolClickedEvent(e) }))), this.showColumnsPanel && this.columns.length > 0 && (h("div", { key: '9a99f15120f1a1911fd03bf44d26ac4beb961d4e', class: "dialog", style: {
+        return (h("div", { key: '7a7d945137c7931afafaf113cc45a9319f892339', class: `table_wrapper ${this.currentTableLayout}` }, this.tableHeaderConfig && (h("div", { key: 'd894bcf70764a845479d3743c5edcf76845c7755', class: `table-header ${this.currentTableLayout}` }, h("gb-table-header", { key: '553cd6160919a3f0fae9e0e2aa2d658b679f81dc', type: this.tableHeaderConfig.type, mode: this.tableHeaderConfig.datePickerMode, "table-heading": this.tableHeaderConfig.tableHeading, "table-heading-label": this.tableHeaderConfig.tableHeadingLabel, "show-search": this.tableHeaderConfig.showSearch, "show-date-filter": this.tableHeaderConfig.showDateFilter, "show-filter": this.tableHeaderConfig.showFilter, "show-export": this.tableHeaderConfig.showExport, "show-column-options": this.tableHeaderConfig.showColumnOptions, "show-refresh-button": this.tableHeaderConfig.showRefreshButton, "input-placeholder": this.tableHeaderConfig.inputPlaceholder, "date-picker-placeholder": this.tableHeaderConfig.datePickerPlaceholder, "show-entire-data": this.tableHeaderConfig.showEntireData, "show-layout-toggle": this.tableHeaderConfig.showLayoutToggle, "filter-state": Object.keys(this.appliedFilterValues).length > 0 ? 'applied' : 'default', "filter-count": Object.keys(this.appliedFilterValues).length, "export-button-state": this.tableHeaderConfig.exportButtonState, "pdf-state": this.tableHeaderConfig.pdfState, "csv-state": this.tableHeaderConfig.csvState, "pdf-sub-dropdown": this.tableHeaderConfig.pdfSubDropdown, "csv-sub-dropdown": this.tableHeaderConfig.csvSubDropdown, onInputValueChanged: this.emitSearchValue.bind(this), onDateChange: this.emitDateChange.bind(this), onColumnOptionsButtonClicked: this.columnOptionsButtonClicked(), onExportClicked: e => this.exportButtonClicked(e), onFilterButtonClicked: () => this.openFilterModal(), onRefreshButtonClicked: () => this.onRefreshButtonClicked(), onLayoutButtonClicked: e => this.switchTableLayout(e), onTableControlClicked: e => this.emitTableContolClickedEvent(e) }))), this.showColumnsPanel && this.columns.length > 0 && (h("div", { key: '31c5fc8987f26c3605c7459a0a991eccc803e5d1', class: "dialog", style: {
                 transform: `translate(${this.modalPosition.x}px, ${this.modalPosition.y}px)`,
-            } }, h("div", { key: 'a7ab27435df71be5087bfc4fcfec3d7571252ca9', class: "column-modal" }, h("div", { key: '5d5bb605cd2d05e68ef259563c61a2aab3352c14', class: "modal_header" }, h("div", { key: '26ec42334edc975df4fb532bb840ca870b7faeca', class: "modal_header_content", onPointerDown: this.onModalPointerDown }, h("h4", { key: '717f8d2ddbae5935e228e13ccec7f26b2bfefde9', class: "heading display-xs-semi-bold" }, "Column Options"), h("gb-button-close", { key: '5ca9b3c7824e3c0ffe619c921766eace57614a54', class: "close_button", color: "gray", size: "sm", onClick: () => (this.showColumnsPanel = false) }))), h("div", { key: '087b3ca005357c088688648ea84421065164f21e', class: "content_wrapper" }, h("div", { key: '50da6717460160dbaa5ce2523a8ec6d4d24002ff', class: "modal_content" }, this.internalColumns.map((col, index) => (h("div", { class: "column_option", draggable: true, onDragStart: () => (this.draggedIndex = index), onDragOver: e => e.preventDefault(), onDrop: () => {
+            } }, h("div", { key: '9ca28599f58c771a6bf7e08eb47ed4a422713759', class: "column-modal" }, h("div", { key: '34ccfe595dddc0c83c087745efc159b962b01b3e', class: "modal_header" }, h("div", { key: '48f8227eafeef3882788bc6781deb712ae7f051c', class: "modal_header_content", onPointerDown: this.onModalPointerDown }, h("h4", { key: '18108400f492ecf1d15fda27443a7f1a9a870427', class: "heading display-xs-semi-bold" }, "Column Options"), h("gb-button-close", { key: '4c737ca0fa8ad27f9f719046d991ad9006e1c657', class: "close_button", color: "gray", size: "sm", onClick: () => (this.showColumnsPanel = false) }))), h("div", { key: '0c2eed39994de713dd8b51116e69472503d69601', class: "content_wrapper" }, h("div", { key: 'a116a5141c64a7adcc01a0f84d7f936c61daa485', class: "modal_content" }, this.internalColumns.map((col, index) => (h("div", { class: "column_option", draggable: true, onDragStart: () => (this.draggedIndex = index), onDragOver: e => e.preventDefault(), onDrop: () => {
                 if (this.draggedIndex !== null && this.draggedIndex !== index) {
                     this.reorderColumns(this.draggedIndex, index);
                 }
                 this.draggedIndex = null;
             } }, h("div", { class: "label_and_dragger" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, h("path", { d: "M8 6H8.00635M8 12H8.00635M8 18H8.00635M15.9937 6H16M15.9937 12H16M15.9937 18H16", stroke: "var(--color-icon, #4B5565)", "stroke-width": "2.5", "stroke-linecap": "round", "stroke-linejoin": "round" })), h("p", { class: "label text-md-regular" }, col.label)), h("gb-toggle", { size: "sm", state: StateEnum.Default, position: "right", pressed: col.visible, text: false, onToggleClicked: e => {
                 this.toggleColumn(e, col.key);
-            } })))), h("div", { key: '7e98353adfc9b47ca063b678b3146cab71c20dde', class: "modal-actions" })))))), this.showFilterModalInternal && this.filterConfig && (h("div", { key: 'ff2d7ab91b0e3038402c126fddddbab3490945d5', class: `filter_modal_wrapper ${this.isFilterModalVisible ? 'open' : 'closing'}` }, h("gb-filter-modal", { key: 'e850525900a5a5056d22a49456d1f9eaf36bab45', class: "filter_modal", filterConfig: this.mergedFilterConfig, onClose: e => {
+            } })))), h("div", { key: '16ebf2a250eaa9d622344451ce1ed6f741c2cbf3', class: "modal-actions" })))))), this.showFilterModalInternal && this.filterConfig && (h("div", { key: 'b6c28aa9011a895e28b4378eff32521c915bc9dc', class: `filter_modal_wrapper ${this.isFilterModalVisible ? 'open' : 'closing'}` }, h("gb-filter-modal", { key: 'eebbb0e57b77ea6462e99c4b2865327cd25b3adf', class: "filter_modal", filterConfig: this.mergedFilterConfig, onClose: e => {
                 e.stopPropagation();
                 this.closeFilterModal();
             }, onApplyFilters: e => this.onApplyFilters(e), onClearFilters: () => this.handleClearFilters() }))), this.internalLoading ? (
@@ -1214,7 +1216,7 @@ export class GbTable {
                 ? this.renderDesktopView()
                 : this.currentTableLayout === 'grid'
                     ? this.renderGridView()
-                    : null)), this.paginationConfig && (h("div", { key: '9aabe280c5be2024301df78a00aa9bc64d520375', class: `pagination ${this.currentTableLayout}` }, h("gb-pagination", { key: 'd007afb510d97a2d96abf9fa3bfb3b0e8cf7b20f', "entries-dropdown-menu-position": this.paginationConfig.entriesDropdownMenuPosition, "page-size": this.paginationConfig.paginationMode === 'internal' ? this.internalPageSize : this.paginationConfig.pageSize, "current-page": this.paginationConfig.paginationMode === 'internal' ? this.internalCurrentPage : this.paginationConfig.currentPage, "total-pages": this.totalPages, onPageItemSelected: this.handlePageChange.bind(this) }))), this.showToast && (h("gb-toast", { key: '725b91f6037e2ca8496d326f60919489e16c9fe4', class: `toast ${this.toastVisible ? 'visible' : ''}`, color: "information", "main-text": this.filterMessage, breakpoint: "desktop", size: "floating", onClose: () => this.hideToast() }))));
+                    : null)), this.paginationConfig && (h("div", { key: '2514588eedcb7fbc2a823e0a15f975af414ee7a9', class: `pagination ${this.currentTableLayout}` }, h("gb-pagination", { key: 'fa371043084ebb51bd3e81f8a9079c8c43b85a33', "entries-dropdown-menu-position": this.paginationConfig.entriesDropdownMenuPosition, "page-size": this.paginationConfig.paginationMode === 'internal' ? this.internalPageSize : this.paginationConfig.pageSize, "current-page": this.paginationConfig.paginationMode === 'internal' ? this.internalCurrentPage : this.paginationConfig.currentPage, "total-pages": this.totalPages, onPageItemSelected: this.handlePageChange.bind(this) }))), this.showToast && (h("gb-toast", { key: '7e9e75ae2726ecc6284801dbaaafb080667cb9c8', class: `toast ${this.toastVisible ? 'visible' : ''}`, color: "information", "main-text": this.filterMessage, breakpoint: "desktop", size: "floating", onClose: () => this.hideToast() }))));
     }
     static get is() { return "gb-table"; }
     static get encapsulation() { return "shadow"; }
@@ -1272,7 +1274,7 @@ export class GbTable {
                 },
                 "getter": false,
                 "setter": false,
-                "defaultValue": "[\r\n    // { key: 'id', label: '#', width: '10rem', sortable: true, sortType: 'string', truncate: true, mobile: { position: 'top_left' } },\r\n    // { key: 'date', label: 'Date', value: row => row.date.toLocaleString(), mobile: { position: 'bottom_left' } },\r\n    // {\r\n    //   key: 'name',\r\n    //   label: 'Name',\r\n    //   sortable: true,\r\n    //   sortType: 'string',\r\n    //   helpIcon: true,\r\n    //   searchable: true,\r\n    //   hasAvatar: true,\r\n    //   cellAvatar: {\r\n    //     // image: '',\r\n    //     slots: {\r\n    //       // initials: row => row.name.split(' ').map((nm: string) => nm.charAt(0)),\r\n    //       image: row => row.image,\r\n    //     },\r\n    //   },\r\n    //   mobile: { position: 'top_right' },\r\n    // },\r\n    // { key: 'role', label: 'Role', searchable: true },\r\n    // { key: 'amount', label: 'Amount', align: 'right', sortable: true, sortType: 'number', cellStyle: row => ({ color: row.amount > 200 ? 'green' : '' }) },\r\n    // {\r\n    //   key: 'status',\r\n    //   label: 'Status',\r\n    //   cellComponent: 'gb-button',\r\n    //   cellProps: row => ({ \r\n    //     hierarchy: 'link_gray', \r\n    //     size: 'md', \r\n    //     icon: 'default',\r\n    //     iconLeading: true,\r\n    //     iconLeadingSwap: 'assets/view.svg'\r\n    //   }),\r\n    //   cellEvent: 'buttonClicked',\r\n    //   cellSlots: {\r\n    //     default: {\r\n    //       tag: 'p',\r\n    //       content: row => row.status,\r\n    //     },\r\n    //   },\r\n    // },\r\n  ]"
+                "defaultValue": "[\r\n    // { key: 'id', label: '#', width: '10rem', sortable: true, sortType: 'string', truncate: true, mobile: { position: 'top_left' } },\r\n    // { key: 'date', label: 'Date', value: row => row.date.toLocaleString(), mobile: { position: 'bottom_left' } },\r\n    // {\r\n    //   key: 'name',\r\n    //   label: 'Name',\r\n    //   sortable: true,\r\n    //   sortType: 'string',\r\n    //   helpIcon: true,\r\n    //   searchable: true,\r\n    //   hasAvatar: true,\r\n    //   cellAvatar: {\r\n    //     // image: '',\r\n    //     slots: {\r\n    //       // initials: row => row.name.split(' ').map((nm: string) => nm.charAt(0)),\r\n    //       image: row => row.image,\r\n    //     },\r\n    //   },\r\n    //   mobile: { position: 'top_right' },\r\n    // },\r\n    // { key: 'role', label: 'Role', searchable: true },\r\n    // { key: 'amount', label: 'Amount', align: 'right', sortable: true, sortType: 'number', cellStyle: row => ({ color: row.amount > 200 ? 'green' : '' }) },\r\n    // {\r\n    //   key: 'status',\r\n    //   label: 'Status',\r\n    //   cellComponent: 'gb-button',\r\n    //   cellProps: row => ({\r\n    //     hierarchy: 'link_gray',\r\n    //     size: 'md',\r\n    //     icon: 'default',\r\n    //     iconLeading: true,\r\n    //     iconLeadingSwap: 'assets/view.svg'\r\n    //   }),\r\n    //   cellEvent: 'buttonClicked',\r\n    //   cellSlots: {\r\n    //     default: {\r\n    //       tag: 'p',\r\n    //       content: row => row.status,\r\n    //     },\r\n    //   },\r\n    // },\r\n  ]"
             },
             "data": {
                 "type": "unknown",
@@ -1676,8 +1678,8 @@ export class GbTable {
                     "text": ""
                 },
                 "complexType": {
-                    "original": "{ action: string; row: any }",
-                    "resolved": "{ action: string; row: any; }",
+                    "original": "{ action: string; row: any; disabled: boolean }",
+                    "resolved": "{ action: string; row: any; disabled: boolean; }",
                     "references": {}
                 }
             }, {
@@ -1856,7 +1858,7 @@ export class GbTable {
                     "text": ""
                 },
                 "complexType": {
-                    "original": "{ row: any; }",
+                    "original": "{ row: any }",
                     "resolved": "{ row: any; }",
                     "references": {}
                 }
@@ -1866,7 +1868,7 @@ export class GbTable {
         return {
             "handleAction": {
                 "complexType": {
-                    "signature": "(action: string, row: any) => Promise<void>",
+                    "signature": "(action: string, row: any, disabled?: boolean) => Promise<void>",
                     "parameters": [{
                             "name": "action",
                             "type": "string",
@@ -1875,6 +1877,10 @@ export class GbTable {
                             "name": "row",
                             "type": "any",
                             "docs": ""
+                        }, {
+                            "name": "disabled",
+                            "type": "boolean",
+                            "docs": ""
                         }],
                     "references": {
                         "Promise": {