globuswebcomponents 2.10.7 → 2.10.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -63,69 +63,98 @@ const GbTable$1 = /*@__PURE__*/ proxyCustomElement(class GbTable extends H {
63
63
  this.applyFilters = createEvent(this, "applyFilters");
64
64
  this.loading = false;
65
65
  this.columns = [
66
- // { key: 'id', label: '#', width: '70px', sortable: true, sortType: 'string', mobile: { position: 'top_left' } },
67
- // { key: 'date', label: 'Date', value: row => row.date.toLocaleString(), mobile: { position: 'bottom_left' } },
68
- // { key: 'name', label: 'Name', sortable: true, sortType: 'string', helpIcon: true, supportingText: row => row.role, mobile: { position: 'top_right' } },
69
- // { key: 'role', label: 'Role' },
70
- // { key: 'amount', label: 'Amount', align: 'right', sortable: true, sortType: 'number' },
71
- // {
72
- // key: 'status',
73
- // label: 'Status',
74
- // cellComponent: 'gb-badge',
75
- // cellProps: row => ({ color: row.status === 'Completed' ? 'success' : 'error', type: 'badge_modern', size: 'sm', icon: 'dot' }),
76
- // cellSlots: {
77
- // default: {
78
- // tag: 'p',
79
- // content: row => row.status,
80
- // },
81
- // },
82
- // },
66
+ { key: 'id', label: '#', width: '70px', sortable: true, sortType: 'string', mobile: { position: 'top_left' } },
67
+ { key: 'date', label: 'Date', value: row => row.date.toLocaleString(), mobile: { position: 'bottom_left' } },
68
+ { key: 'name', label: 'Name', sortable: true, sortType: 'string', helpIcon: true, supportingText: row => row.role, mobile: { position: 'top_right' } },
69
+ { key: 'role', label: 'Role' },
70
+ { key: 'amount', label: 'Amount', align: 'right', sortable: true, sortType: 'number' },
71
+ {
72
+ key: 'status',
73
+ label: 'Status',
74
+ cellComponent: 'gb-badge',
75
+ cellProps: row => ({ color: row.status === 'Completed' ? 'success' : 'error', type: 'badge_modern', size: 'sm', icon: 'dot' }),
76
+ cellSlots: {
77
+ default: {
78
+ tag: 'p',
79
+ content: row => row.status,
80
+ },
81
+ },
82
+ },
83
83
  ];
84
84
  this.data = [
85
- // {
86
- // id: '#30011111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111',
87
- // date: 'Jan 1, 2022',
88
- // name: 'Emma Johnson',
89
- // role: 'Frontend Developer',
90
- // level: 'Today',
91
- // customer: 'John Doe',
92
- // amount: '$120.00',
93
- // status: 'Completed',
94
- // },
95
- // { id: '#3002', date: new Date(), name: 'Liam Smith', role: 'Backend Developer', level: 'Today', customer: 'Sarah Wilson', amount: '$85.50', status: 'Pending' },
96
- // { id: '#3003', date: new Date(), name: 'Liam Smith', role: 'Frontend Developer', level: 'Today', customer: 'Sarah Wilson', amount: '$85.50', status: 'Pending' },
97
- // { id: '#3004', date: new Date(), name: 'Liam Smith', role: 'Backend Developer', level: 'Today', customer: 'Sarah Wilson', amount: '$85.50', status: 'Pending' },
98
- // { id: '#3005', date: new Date(), name: 'Liam Smith', role: 'Backend Developer', level: 'Today', customer: 'Sarah Wilson', amount: '$85.50', status: 'Pending' },
99
- // { id: '#3006', date: new Date(), name: 'Liam Smith', role: 'Backend Developer', level: 'Today', customer: 'Sarah Wilson', amount: '$85.50', status: 'Pending' },
100
- // { id: '#3003', date: 'Jan 3, 2022', name: 'Olivia Brown', role: 'UI Designer', level: 'Today', customer: 'Michael Lee', amount: '$230.75', status: 'Cancelled' },
101
- // { id: '#3004', date: 'Jan 4, 2022', name: 'Noah Davis', role: 'DevOps Engineer', level: 'Today', customer: 'Emily Clark', amount: '$59.99', status: 'Completed' },
102
- // { id: '#3005', date: 'Jan 5, 2022', name: 'Ava Martinez', role: 'Product Manager', level: 'Today', customer: 'Daniel Harris', amount: '$410.00', status: 'Pending' },
103
- // { id: '#3006', date: 'Jan 6, 2022', name: 'William Garcia', role: 'QA Engineer', level: 'Today', customer: 'Sophia Lewis', amount: '$150.20', status: 'Completed' },
104
- // { id: '#3007', date: 'Jan 7, 2022', name: 'Isabella Rodriguez', role: 'Business Analyst', level: 'Today', customer: 'James Walker', amount: '$78.40', status: 'Pending' },
105
- // { id: '#3008', date: 'Jan 8, 2022', name: 'James Wilson', role: 'Fullstack Developer', level: 'Today', customer: 'Mia Hall', amount: '$300.00', status: 'Completed' },
106
- // { id: '#3009', date: 'Jan 9, 2022', name: 'Sophia Anderson', role: 'UX Researcher', level: 'Today', customer: 'Benjamin Allen', amount: '$95.60', status: 'Cancelled' },
107
- // { id: '#3010', date: 'Jan 10, 2022', name: 'Benjamin Thomas', role: 'Mobile Developer', level: 'Today', customer: 'Charlotte Young', amount: '$210.10', status: 'Completed' },
108
- // { id: '#3011', date: 'Jan 11, 2022', name: 'Mia Taylor', role: 'Data Analyst', level: 'Today', customer: 'Lucas King', amount: '$180.00', status: 'Pending' },
109
- // { id: '#3012', date: 'Jan 12, 2022', name: 'Lucas Moore', role: 'Cloud Engineer', level: 'Today', customer: 'Amelia Scott', amount: '$420.75', status: 'Completed' },
110
- // { id: '#3013', date: 'Jan 13, 2022', name: 'Charlotte Jackson', role: 'Security Engineer', level: 'Today', customer: 'Elijah Green', amount: '$65.90', status: 'Cancelled' },
111
- // { id: '#3014', date: 'Jan 14, 2022', name: 'Elijah Martin', role: 'Technical Lead', level: 'Today', customer: 'Harper Adams', amount: '$510.30', status: 'Completed' },
112
- // { id: '#3015', date: 'Jan 15, 2022', name: 'Amelia Lee', role: 'Scrum Master', level: 'Today', customer: 'Alexander Baker', amount: '$99.99', status: 'Pending' },
113
- // { id: '#3016', date: 'Jan 16, 2022', name: 'Harper Perez', role: 'Frontend Developer', level: 'Today', customer: 'Ella Nelson', amount: '$275.45', status: 'Completed' },
114
- // { id: '#3017', date: 'Jan 17, 2022', name: 'Alexander White', role: 'Backend Developer', level: 'Today', customer: 'Matthew Carter', amount: '$340.00', status: 'Pending' },
115
- // { id: '#3018', date: 'Jan 18, 2022', name: 'Ella Harris', role: 'UI Designer', level: 'Today', customer: 'Avery Mitchell', amount: '$88.80', status: 'Completed' },
116
- // { id: '#3019', date: 'Jan 19, 2022', name: 'Matthew Clark', role: 'DevOps Engineer', level: 'Today', customer: 'Evelyn Perez', amount: '$190.25', status: 'Cancelled' },
117
- // { id: '#3020', date: 'Jan 20, 2022', name: 'Avery Lewis', role: 'Product Manager', level: 'Today', customer: 'Henry Roberts', amount: '$600.00', status: 'Completed' },
118
- // { id: '#3021', date: 'Jan 21, 2022', name: 'Evelyn Walker', role: 'QA Engineer', level: 'Today', customer: 'Luna Turner', amount: '$72.30', status: 'Pending' },
119
- // { id: '#3022', date: 'Jan 22, 2022', name: 'Henry Hall', role: 'Business Analyst', level: 'Today', customer: 'Jack Phillips', amount: '$310.40', status: 'Completed' },
120
- // { id: '#3023', date: 'Jan 23, 2022', name: 'Luna Allen', role: 'Fullstack Developer', level: 'Today', customer: 'Sofia Campbell', amount: '$145.00', status: 'Cancelled' },
121
- // { id: '#3024', date: 'Jan 24, 2022', name: 'Jack Young', role: 'UX Researcher', level: 'Today', customer: 'David Parker', amount: '$260.70', status: 'Completed' },
122
- // { id: '#3025', date: 'Jan 25, 2022', name: 'Sofia Hernandez', role: 'Mobile Developer', level: 'Today', customer: 'Grace Evans', amount: '$89.10', status: 'Pending' },
123
- // { id: '#3026', date: 'Jan 26, 2022', name: 'David King', role: 'Data Analyst', level: 'Today', customer: 'Samuel Edwards', amount: '$410.90', status: 'Completed' },
124
- // { id: '#3027', date: 'Jan 27, 2022', name: 'Grace Wright', role: 'Cloud Engineer', level: 'Today', customer: 'Chloe Collins', amount: '$130.55', status: 'Cancelled' },
125
- // { id: '#3028', date: 'Jan 28, 2022', name: 'Samuel Scott', role: 'Security Engineer', level: 'Today', customer: 'Victoria Stewart', amount: '$555.00', status: 'Completed' },
126
- // { id: '#3029', date: 'Jan 29, 2022', name: 'Chloe Green', role: 'Technical Lead', level: 'Today', customer: 'Nathan Morris', amount: '$205.25', status: 'Pending' },
127
- // { id: '#3030', date: 'Jan 30, 2022', name: 'Nathan Adams', role: 'Scrum Master', level: 'Today', customer: 'Zoe Rogers', amount: '$320.80', status: 'Completed' },
85
+ // {
86
+ // id: '#30011111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111',
87
+ // date: 'Jan 1, 2022',
88
+ // name: 'Emma Johnson',
89
+ // role: 'Frontend Developer',
90
+ // level: 'Today',
91
+ // customer: 'John Doe',
92
+ // amount: '$120.00',
93
+ // status: 'Completed',
94
+ // },
95
+ // { id: '#3002', date: new Date(), name: 'Liam Smith', role: 'Backend Developer', level: 'Today', customer: 'Sarah Wilson', amount: '$85.50', status: 'Pending' },
96
+ // { id: '#3003', date: new Date(), name: 'Liam Smith', role: 'Frontend Developer', level: 'Today', customer: 'Sarah Wilson', amount: '$85.50', status: 'Pending' },
97
+ // { id: '#3004', date: new Date(), name: 'Liam Smith', role: 'Backend Developer', level: 'Today', customer: 'Sarah Wilson', amount: '$85.50', status: 'Pending' },
98
+ // { id: '#3005', date: new Date(), name: 'Liam Smith', role: 'Backend Developer', level: 'Today', customer: 'Sarah Wilson', amount: '$85.50', status: 'Pending' },
99
+ // { id: '#3006', date: new Date(), name: 'Liam Smith', role: 'Backend Developer', level: 'Today', customer: 'Sarah Wilson', amount: '$85.50', status: 'Pending' },
100
+ { id: '#3003', date: 'Jan 3, 2022', name: 'Olivia Brown', role: 'UI Designer', level: 'Today', customer: 'Michael Lee', amount: '$230.75', status: 'Cancelled' },
101
+ { id: '#3004', date: 'Jan 4, 2022', name: 'Noah Davis', role: 'DevOps Engineer', level: 'Today', customer: 'Emily Clark', amount: '$59.99', status: 'Completed' },
102
+ { id: '#3005', date: 'Jan 5, 2022', name: 'Ava Martinez', role: 'Product Manager', level: 'Today', customer: 'Daniel Harris', amount: '$410.00', status: 'Pending' },
103
+ { id: '#3006', date: 'Jan 6, 2022', name: 'William Garcia', role: 'QA Engineer', level: 'Today', customer: 'Sophia Lewis', amount: '$150.20', status: 'Completed' },
104
+ { id: '#3007', date: 'Jan 7, 2022', name: 'Isabella Rodriguez', role: 'Business Analyst', level: 'Today', customer: 'James Walker', amount: '$78.40', status: 'Pending' },
105
+ { id: '#3008', date: 'Jan 8, 2022', name: 'James Wilson', role: 'Fullstack Developer', level: 'Today', customer: 'Mia Hall', amount: '$300.00', status: 'Completed' },
106
+ { id: '#3009', date: 'Jan 9, 2022', name: 'Sophia Anderson', role: 'UX Researcher', level: 'Today', customer: 'Benjamin Allen', amount: '$95.60', status: 'Cancelled' },
107
+ { id: '#3010', date: 'Jan 10, 2022', name: 'Benjamin Thomas', role: 'Mobile Developer', level: 'Today', customer: 'Charlotte Young', amount: '$210.10', status: 'Completed' },
108
+ { id: '#3011', date: 'Jan 11, 2022', name: 'Mia Taylor', role: 'Data Analyst', level: 'Today', customer: 'Lucas King', amount: '$180.00', status: 'Pending' },
109
+ { id: '#3012', date: 'Jan 12, 2022', name: 'Lucas Moore', role: 'Cloud Engineer', level: 'Today', customer: 'Amelia Scott', amount: '$420.75', status: 'Completed' },
110
+ { id: '#3013', date: 'Jan 13, 2022', name: 'Charlotte Jackson', role: 'Security Engineer', level: 'Today', customer: 'Elijah Green', amount: '$65.90', status: 'Cancelled' },
111
+ { id: '#3014', date: 'Jan 14, 2022', name: 'Elijah Martin', role: 'Technical Lead', level: 'Today', customer: 'Harper Adams', amount: '$510.30', status: 'Completed' },
112
+ { id: '#3015', date: 'Jan 15, 2022', name: 'Amelia Lee', role: 'Scrum Master', level: 'Today', customer: 'Alexander Baker', amount: '$99.99', status: 'Pending' },
113
+ { id: '#3016', date: 'Jan 16, 2022', name: 'Harper Perez', role: 'Frontend Developer', level: 'Today', customer: 'Ella Nelson', amount: '$275.45', status: 'Completed' },
114
+ { id: '#3017', date: 'Jan 17, 2022', name: 'Alexander White', role: 'Backend Developer', level: 'Today', customer: 'Matthew Carter', amount: '$340.00', status: 'Pending' },
115
+ { id: '#3018', date: 'Jan 18, 2022', name: 'Ella Harris', role: 'UI Designer', level: 'Today', customer: 'Avery Mitchell', amount: '$88.80', status: 'Completed' },
116
+ { id: '#3019', date: 'Jan 19, 2022', name: 'Matthew Clark', role: 'DevOps Engineer', level: 'Today', customer: 'Evelyn Perez', amount: '$190.25', status: 'Cancelled' },
117
+ { id: '#3020', date: 'Jan 20, 2022', name: 'Avery Lewis', role: 'Product Manager', level: 'Today', customer: 'Henry Roberts', amount: '$600.00', status: 'Completed' },
118
+ { id: '#3021', date: 'Jan 21, 2022', name: 'Evelyn Walker', role: 'QA Engineer', level: 'Today', customer: 'Luna Turner', amount: '$72.30', status: 'Pending' },
119
+ { id: '#3022', date: 'Jan 22, 2022', name: 'Henry Hall', role: 'Business Analyst', level: 'Today', customer: 'Jack Phillips', amount: '$310.40', status: 'Completed' },
120
+ { id: '#3023', date: 'Jan 23, 2022', name: 'Luna Allen', role: 'Fullstack Developer', level: 'Today', customer: 'Sofia Campbell', amount: '$145.00', status: 'Cancelled' },
121
+ { id: '#3024', date: 'Jan 24, 2022', name: 'Jack Young', role: 'UX Researcher', level: 'Today', customer: 'David Parker', amount: '$260.70', status: 'Completed' },
122
+ { id: '#3025', date: 'Jan 25, 2022', name: 'Sofia Hernandez', role: 'Mobile Developer', level: 'Today', customer: 'Grace Evans', amount: '$89.10', status: 'Pending' },
123
+ { id: '#3026', date: 'Jan 26, 2022', name: 'David King', role: 'Data Analyst', level: 'Today', customer: 'Samuel Edwards', amount: '$410.90', status: 'Completed' },
124
+ { id: '#3027', date: 'Jan 27, 2022', name: 'Grace Wright', role: 'Cloud Engineer', level: 'Today', customer: 'Chloe Collins', amount: '$130.55', status: 'Cancelled' },
125
+ { id: '#3028', date: 'Jan 28, 2022', name: 'Samuel Scott', role: 'Security Engineer', level: 'Today', customer: 'Victoria Stewart', amount: '$555.00', status: 'Completed' },
126
+ { id: '#3029', date: 'Jan 29, 2022', name: 'Chloe Green', role: 'Technical Lead', level: 'Today', customer: 'Nathan Morris', amount: '$205.25', status: 'Pending' },
127
+ { id: '#3030', date: 'Jan 30, 2022', name: 'Nathan Adams', role: 'Scrum Master', level: 'Today', customer: 'Zoe Rogers', amount: '$320.80', status: 'Completed' },
128
128
  ];
129
+ this.tableHeaderConfig = {
130
+ tableHeading: false,
131
+ tableHeadingLabel: 'Suspicious outflows',
132
+ showDateFilter: true,
133
+ showFilter: true,
134
+ showColumnOptions: true,
135
+ showSearch: true,
136
+ showExport: true,
137
+ showRefreshButton: false,
138
+ datePickerMode: 'range',
139
+ inputPlaceholder: 'Transaction reference',
140
+ };
141
+ this.paginationConfig = {
142
+ paginationMode: 'internal',
143
+ entriesDropdownMenuPosition: 'top',
144
+ currentPage: 1,
145
+ pageSize: 10,
146
+ };
147
+ this.emptyStateConfig = {
148
+ size: 'md',
149
+ background: true,
150
+ backgroundType: 'grid',
151
+ mainText: 'No data available',
152
+ supportingText: 'Try adjusting your filters or check back later.',
153
+ color: 'gray',
154
+ illustrationIcon: 'assets/alert-circle.svg',
155
+ illustrationStyle: 'box',
156
+ theme: 'light',
157
+ };
129
158
  this.showActionsColumn = true;
130
159
  this.rowActions = [
131
160
  // { label: '', action: '', icon: 'assets/more-horizontal.svg', type: 'dropdown' },
@@ -197,11 +226,6 @@ const GbTable$1 = /*@__PURE__*/ proxyCustomElement(class GbTable extends H {
197
226
  componentWillLoad() {
198
227
  this.initializeColumns(this.columns);
199
228
  this.internalLoading = this.loading;
200
- // Initialize internal pagination state from config
201
- if (this.paginationConfig) {
202
- this.internalPageSize = this.paginationConfig.pageSize || 10;
203
- this.internalCurrentPage = this.paginationConfig.currentPage || 1;
204
- }
205
229
  }
206
230
  componentWillRender() {
207
231
  this.checkViewport();
@@ -403,7 +427,19 @@ const GbTable$1 = /*@__PURE__*/ proxyCustomElement(class GbTable extends H {
403
427
  return Math.max(1, Math.ceil(totalItems / pageSize));
404
428
  }
405
429
  onDataChange() {
406
- this.internalCurrentPage = 1;
430
+ if (this.paginationConfig.paginationMode === 'internal') {
431
+ this.internalCurrentPage = 1;
432
+ }
433
+ }
434
+ handlePaginationConfigChange(newValue) {
435
+ if (newValue) {
436
+ if (newValue.pageSize !== undefined) {
437
+ this.internalPageSize = newValue.pageSize;
438
+ }
439
+ if (newValue.paginationMode === 'external' && newValue.currentPage) {
440
+ this.internalCurrentPage = newValue.currentPage;
441
+ }
442
+ }
407
443
  }
408
444
  onLoadingChange(newValue, _oldValue) {
409
445
  this.internalLoading = newValue;
@@ -439,7 +475,7 @@ const GbTable$1 = /*@__PURE__*/ proxyCustomElement(class GbTable extends H {
439
475
  sticky_right: this.stickyLastColumn,
440
476
  has_border: this.isScrollable,
441
477
  [`table_header_${this.tableHeadColor}`]: true,
442
- } }, h("div", { class: "empty_div" }))))), h("tbody", null, this.displayedData.map((row, rowIndex) => (h("tr", { class: "table_body" }, this.showCheckbox && (h("td", { class: `table_detail ${this.showCheckbox ? 'checkbox' : ''}` }, h("gb-checkbox", { type: "checkbox", checked: this.selectedRowIds.has(this.getRowId(row)), indeterminate: false, size: "sm", onClick: () => this.toggleRow(row) }))), this.internalColumns
478
+ } }, h("div", { class: "empty_div" }))))), h("tbody", null, this.displayedData, this.displayedData.map((row, rowIndex) => (h("tr", { class: "table_body" }, this.showCheckbox && (h("td", { class: `table_detail ${this.showCheckbox ? 'checkbox' : ''}` }, h("gb-checkbox", { type: "checkbox", checked: this.selectedRowIds.has(this.getRowId(row)), indeterminate: false, size: "sm", onClick: () => this.toggleRow(row) }))), this.internalColumns
443
479
  .filter(col => col.visible)
444
480
  .map((col, index) => (h(Fragment, null, h("td", { style: { textAlign: col.align || 'left' }, class: `table_detail ${this.stickyFirstColumn && index === 0 ? 'sticky_left' : ''} ${this.isScrollable ? 'has_border' : ''}` }, this.renderCell(col, row))))), this.showActionsColumn && (h("td", { class: { table_detail: true, actions_cell: true, sticky_right: this.stickyLastColumn, has_border: this.isScrollable }, style: { width: '50px' } }, h(Fragment, null, h("div", { class: "action_buttons" }, this.rowActions.map(action => (h(Fragment, null, action.type === 'dropdown' ? (h("gb-button", { id: `gb-table-trigger-${rowIndex}`, ref: el => (this.actionButtonRefs[rowIndex] = el), class: "dropdown_button", hierarchy: "tertiary_gray", size: "md", icon: "only", iconLeading: true, iconLeadingSwap: "assets/more-horizontal.svg", onClick: () => this.toggleDropdown(rowIndex) })) : (h("gb-button", { hierarchy: "tertiary_gray", size: "md", icon: "only", destructive: action.destructive, iconLeading: true, iconLeadingSwap: action.icon, onClick: () => 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: () => {
445
481
  this.handleAction(action.action, row);
@@ -517,16 +553,16 @@ const GbTable$1 = /*@__PURE__*/ proxyCustomElement(class GbTable extends H {
517
553
  window.removeEventListener('resize', this.checkViewport);
518
554
  }
519
555
  render() {
520
- return (h("div", { key: '4fa6ff6724d6807868bcd631c01c4fcd4c3076c7', class: `table_wrapper` }, h("gb-table-header", { key: 'f759266620da3b0a28aa97dfe6a4fc86b3e2b470', 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": this.tableHeaderConfig.filterState, "filter-count": this.tableHeaderConfig.filterCount, "export-button-state": this.tableHeaderConfig.exportButtonState, "pdf-state": this.tableHeaderConfig.pdfState, "csv-state": this.tableHeaderConfig.csvState, onInputValueChanged: this.emitSearchValue.bind(this), onDateChange: this.emitDateChange.bind(this), onColumnOptionsButtonClicked: this.columnOptionsButtonClicked(), onExportClicked: e => this.exportButtonClicked(e), onFilterButtonClicked: () => this.openFilterModal() }), this.showColumnsPanel && (h("div", { key: '31eb9725068a7960966c6a6b8860ab0454520893', class: "dialog", style: {
556
+ return (h("div", { key: '3bff3528f989d76c611a5a6235ea865718ce6ba4', class: `table_wrapper` }, h("gb-table-header", { key: 'fb5be5b8b7f4325bd09219868918549b7389c214', 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": this.tableHeaderConfig.filterState, "filter-count": this.tableHeaderConfig.filterCount, "export-button-state": this.tableHeaderConfig.exportButtonState, "pdf-state": this.tableHeaderConfig.pdfState, "csv-state": this.tableHeaderConfig.csvState, onInputValueChanged: this.emitSearchValue.bind(this), onDateChange: this.emitDateChange.bind(this), onColumnOptionsButtonClicked: this.columnOptionsButtonClicked(), onExportClicked: e => this.exportButtonClicked(e), onFilterButtonClicked: () => this.openFilterModal() }), this.showColumnsPanel && (h("div", { key: '7c68c52733ab3e3ef55d26ffee712e791d4d4cd9', class: "dialog", style: {
521
557
  transform: `translate(${this.modalPosition.x}px, ${this.modalPosition.y}px)`,
522
- } }, h("div", { key: 'e784c2ade77f50a5ea019f10e2a376aea51eccd5', class: "column-modal" }, h("div", { key: 'c640c202c05ed38a923476801c8cfefb99c6a114', class: "modal_header" }, h("div", { key: 'b5c44b795c684b23405d1e957c15fec9fd52605c', class: "modal_header_content", onPointerDown: this.onModalPointerDown }, h("h4", { key: '5bed673bd118262fb9dab57fcc084103cba0b841', class: "heading display-xs-semi-bold" }, "Column Options"), h("gb-button-close", { key: '3b59163c1a5a7208cd39f12ad1eff0fe533dca18', class: "close_button", color: "gray", size: "sm", onClick: () => (this.showColumnsPanel = false) }))), h("div", { key: '3f58970b56175e2fcacd921b0c2c42af46433c76', class: "content_wrapper" }, h("div", { key: '5a6dd8d10012b991009868c63fb11b16d0d1beff', class: "modal_content" }, this.internalColumns.map((col, index) => (h("div", { class: "column_option", draggable: true, onDragStart: () => (this.draggedIndex = index), onDragOver: e => e.preventDefault(), onDrop: () => {
558
+ } }, h("div", { key: '751f230fd260240daa80ac376c38fe61900aff0f', class: "column-modal" }, h("div", { key: '83dfbcddaf9d27ad70a7c30281a565a71eae0210', class: "modal_header" }, h("div", { key: 'afbed44ee72dbd0e7465a98d3dccb1a0b9c49aeb', class: "modal_header_content", onPointerDown: this.onModalPointerDown }, h("h4", { key: 'ad7f0c5692e1d80c10f734669c6ed207b30ad05c', class: "heading display-xs-semi-bold" }, "Column Options"), h("gb-button-close", { key: '44f32b3e299b9bd6db9a00524382919fa1366703', class: "close_button", color: "gray", size: "sm", onClick: () => (this.showColumnsPanel = false) }))), h("div", { key: '00df07ffe52d61b62b4decf95c5b891b38451b6b', class: "content_wrapper" }, h("div", { key: 'ea9a1c920a8f8a61398c10d3756291b29bf1f9a8', class: "modal_content" }, this.internalColumns.map((col, index) => (h("div", { class: "column_option", draggable: true, onDragStart: () => (this.draggedIndex = index), onDragOver: e => e.preventDefault(), onDrop: () => {
523
559
  if (this.draggedIndex !== null && this.draggedIndex !== index) {
524
560
  this.reorderColumns(this.draggedIndex, index);
525
561
  }
526
562
  this.draggedIndex = null;
527
563
  } }, 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 => {
528
564
  this.toggleColumn(e, col.key);
529
- } })))), h("div", { key: '3bcaafefbb890f4fce646189a6c1b16630300850', class: "modal-actions" })))))), this.showFilterModalInternal && (h("div", { key: '4e676a43ee3149de0a7f695f2644eb9cabc1a4db', class: `filter_modal_wrapper ${this.isFilterModalVisible ? 'open' : 'closing'}` }, h("gb-filter-modal", { key: '26fc8c94ea318218e9c98d1cfa68971d73671630', class: "filter_modal", filterConfig: this.filterConfig, onClose: e => {
565
+ } })))), h("div", { key: 'ab28da10858e6134c0c68e5ec90aef28eb972e33', class: "modal-actions" })))))), this.showFilterModalInternal && (h("div", { key: 'd2e1e798808f99d767fcb0a0687d7d0610d7c492', class: `filter_modal_wrapper ${this.isFilterModalVisible ? 'open' : 'closing'}` }, h("gb-filter-modal", { key: '1e5642a51b1f714aff962ea58125585babe3657f', class: "filter_modal", filterConfig: this.filterConfig, onClose: e => {
530
566
  e.stopPropagation();
531
567
  this.closeFilterModal();
532
568
  }, onApplyFilters: e => this.onApplyFilters(e) }))), this.internalLoading ? (
@@ -565,10 +601,11 @@ const GbTable$1 = /*@__PURE__*/ proxyCustomElement(class GbTable extends H {
565
601
  // ✅ No loading + no data = empty state
566
602
  h("div", { class: "empty_state_wrapper" }, h("gb-empty-state", { size: "sm", "main-text": this.emptyStateConfig.mainText, "supporting-text": this.emptyStateConfig.supportingText, color: this.emptyStateConfig.color, theme: this.emptyStateConfig.theme, "primary-button-icon-leading-swap": "assets/plus.svg", "illustration-icon": this.emptyStateConfig.illustrationIcon, background: true, "background-type": "grid", icon: "illustration", "illustration-style": "cloud" }))) : (
567
603
  // ✅ Has data + not loading
568
- h(Fragment, null, this.isMobile ? this.renderMobileView() : this.renderDesktopView())), this.paginationConfig && this.data.length > 0 && (h("gb-pagination", { key: '08668a3a60f9a3b1f95c504c29ba6413165d7d7f', "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) }))));
604
+ h(Fragment, null, this.isMobile ? this.renderMobileView() : this.renderDesktopView())), this.paginationConfig && this.data.length > 0 && (h("gb-pagination", { key: 'fbaa4fef24c0f945761971376c184cd49a8dfcbe', "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) }))));
569
605
  }
570
606
  static get watchers() { return {
571
607
  "data": ["onDataChange"],
608
+ "paginationConfig": ["handlePaginationConfigChange"],
572
609
  "loading": ["onLoadingChange"],
573
610
  "columns": ["validateMobilePositions"]
574
611
  }; }
@@ -609,6 +646,7 @@ const GbTable$1 = /*@__PURE__*/ proxyCustomElement(class GbTable extends H {
609
646
  "internalLoading": [32]
610
647
  }, [[9, "resize", "checkViewport"]], {
611
648
  "data": ["onDataChange"],
649
+ "paginationConfig": ["handlePaginationConfigChange"],
612
650
  "loading": ["onLoadingChange"],
613
651
  "columns": ["validateMobilePositions"]
614
652
  }]);