@rufous/ui 0.1.68 → 0.1.70

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.
Files changed (19) hide show
  1. package/dist/DataGrid/DataGrid.cjs +143 -98
  2. package/dist/DataGrid/DataGrid.js +1 -1
  3. package/dist/DataGrid/index.cjs +143 -98
  4. package/dist/DataGrid/index.js +1 -1
  5. package/dist/Dialogs/BaseDialog.css +0 -1
  6. package/dist/Dialogs/BaseDialog.js +16 -16
  7. package/dist/Dialogs/index.css +0 -1
  8. package/dist/Dialogs/index.js +16 -16
  9. package/dist/TextFields/AddressLookup.js +3 -3
  10. package/dist/{chunk-B6EOV25J.js → chunk-7OMS6IWF.js} +143 -98
  11. package/dist/icons/index.js +16 -16
  12. package/dist/main.cjs +143 -98
  13. package/dist/main.css +0 -1
  14. package/dist/main.js +35 -35
  15. package/dist/style.css +0 -1
  16. package/dist/styles/datagrid.css +0 -1
  17. package/package.json +1 -1
  18. package/dist/{chunk-4GPYGFPP.js → chunk-K6626C4D.js} +3 -3
  19. package/dist/{chunk-EB6MPFGC.js → chunk-M5GFOGY5.js} +3 -3
package/dist/DataGrid/index.cjs CHANGED
@@ -44,22 +44,31 @@ function DataGrid({
44
44
  pageSizeOptions = [5, 10, 25, 50],
45
45
  title
46
46
  }) {
47
- const initialColumns = (0, import_react.useMemo)(() => initialColumnsProp.map((col) => ({
48
- ...col,
49
- key: col.key || col.field || "",
50
- header: col.header || col.headerName || ""
51
- })), [initialColumnsProp]);
52
- const [columns, setColumns] = (0, import_react.useState)(initialColumns);
47
+ const [columnOverrides, setColumnOverrides] = (0, import_react.useState)({});
48
+ const resolvedColumns = (0, import_react.useMemo)(() => {
49
+ return initialColumnsProp.map((col) => {
50
+ const field = String(col.field || col.key || "");
51
+ const override = columnOverrides[field] || {};
52
+ return {
53
+ ...col,
54
+ field,
55
+ headerName: col.headerName || col.header || "",
56
+ hidden: override.hidden !== void 0 ? override.hidden : col.hidden,
57
+ pinned: override.pinned !== void 0 ? override.pinned : col.pinned
58
+ };
59
+ });
60
+ }, [initialColumnsProp, columnOverrides]);
53
61
  const [columnWidths, setColumnWidths] = (0, import_react.useState)(() => {
54
62
  const widths = {};
55
- initialColumns.forEach((col) => {
63
+ initialColumnsProp.forEach((col) => {
64
+ const field = String(col.field || col.key || "");
56
65
  const w = col.width || 200;
57
- widths[String(col.key)] = typeof w === "number" ? w : parseInt(w);
66
+ widths[field] = typeof w === "number" ? w : parseInt(w);
58
67
  });
59
68
  return widths;
60
69
  });
61
70
  const [pageSize, setPageSize] = (0, import_react.useState)(initialPageSize);
62
- const [sortKey, setSortKey] = (0, import_react.useState)(null);
71
+ const [sortField, setSortField] = (0, import_react.useState)(null);
63
72
  const [sortDirection, setSortDirection] = (0, import_react.useState)(null);
64
73
  const [filterText, setFilterText] = (0, import_react.useState)("");
65
74
  const [currentPage, setCurrentPage] = (0, import_react.useState)(1);
@@ -72,40 +81,15 @@ function DataGrid({
72
81
  const menuRef = (0, import_react.useRef)(null);
73
82
  const [showManageColumns, setShowManageColumns] = (0, import_react.useState)(false);
74
83
  const [showAdvancedFilter, setShowAdvancedFilter] = (0, import_react.useState)(false);
84
+ const initialFilterCol = String(initialColumnsProp[0]?.field || initialColumnsProp[0]?.key || "");
75
85
  const [advancedFilters, setAdvancedFilters] = (0, import_react.useState)([
76
- { column: String(initialColumns[0]?.key || ""), operator: "contains", value: "", logic: "AND" }
86
+ { column: initialFilterCol, operator: "contains", value: "", logic: "AND" }
77
87
  ]);
78
- (0, import_react.useEffect)(() => {
79
- setColumns((prevColumns) => {
80
- return initialColumns.map((newCol) => {
81
- const prevCol = prevColumns.find((c) => (c.key || c.field) === (newCol.key || newCol.field));
82
- if (!prevCol) return newCol;
83
- return {
84
- ...newCol,
85
- hidden: prevCol.hidden !== void 0 ? prevCol.hidden : newCol.hidden,
86
- pinned: prevCol.pinned !== void 0 ? prevCol.pinned : newCol.pinned
87
- };
88
- });
89
- });
90
- }, [initialColumns]);
91
- (0, import_react.useEffect)(() => {
92
- setColumnWidths((prev) => {
93
- const next = { ...prev };
94
- initialColumns.forEach((col) => {
95
- const key = String(col.key);
96
- if (next[key] === void 0) {
97
- const w = col.width || 200;
98
- next[key] = typeof w === "number" ? w : parseInt(w);
99
- }
100
- });
101
- return next;
102
- });
103
- }, [initialColumns]);
104
88
  const [colSearch, setColSearch] = (0, import_react.useState)("");
105
89
  (0, import_react.useEffect)(() => {
106
90
  const handleMouseMove = (e) => {
107
91
  if (!resizingColumn) return;
108
- const col = columns.find((c) => String(c.key) === resizingColumn);
92
+ const col = resolvedColumns.find((c) => String(c.field) === resizingColumn);
109
93
  const diff = e.clientX - startX;
110
94
  const minW = col?.minWidth ? typeof col.minWidth === "number" ? col.minWidth : parseInt(col.minWidth) : 80;
111
95
  const maxW = col?.maxWidth ? typeof col.maxWidth === "number" ? col.maxWidth : parseInt(col.maxWidth) : Infinity;
@@ -121,7 +105,7 @@ function DataGrid({
121
105
  document.removeEventListener("mousemove", handleMouseMove);
122
106
  document.removeEventListener("mouseup", handleMouseUp);
123
107
  };
124
- }, [resizingColumn, startX, startWidth, columns]);
108
+ }, [resizingColumn, startX, startWidth, resolvedColumns]);
125
109
  (0, import_react.useEffect)(() => {
126
110
  const handleClickOutside = (e) => {
127
111
  if (menuRef.current && !menuRef.current.contains(e.target)) {
@@ -131,32 +115,55 @@ function DataGrid({
131
115
  document.addEventListener("mousedown", handleClickOutside);
132
116
  return () => document.removeEventListener("mousedown", handleClickOutside);
133
117
  }, []);
134
- const handleSort = (key, dir) => {
118
+ (0, import_react.useEffect)(() => {
119
+ setColumnWidths((prev) => {
120
+ const next = { ...prev };
121
+ initialColumnsProp.forEach((col) => {
122
+ const field = String(col.field || col.key || "");
123
+ if (next[field] === void 0) {
124
+ const w = col.width || 200;
125
+ next[field] = typeof w === "number" ? w : parseInt(w);
126
+ }
127
+ });
128
+ return next;
129
+ });
130
+ }, [initialColumnsProp]);
131
+ const handleSort = (fieldKey, dir) => {
135
132
  if (dir !== void 0) {
136
- setSortKey(key);
133
+ setSortField(fieldKey);
137
134
  setSortDirection(dir);
138
- } else if (sortKey === key) {
135
+ } else if (sortField === fieldKey) {
139
136
  if (sortDirection === "asc") setSortDirection("desc");
140
137
  else {
141
- setSortKey(null);
138
+ setSortField(null);
142
139
  setSortDirection(null);
143
140
  }
144
141
  } else {
145
- setSortKey(key);
142
+ setSortField(fieldKey);
146
143
  setSortDirection("asc");
147
144
  }
148
145
  setActiveMenu(null);
149
146
  };
150
- const togglePin = (key, side) => {
151
- setColumns((prev) => prev.map(
152
- (col) => String(col.key) === key ? { ...col, pinned: col.pinned === side ? void 0 : side } : col
153
- ));
147
+ const togglePin = (fieldKey, side) => {
148
+ setColumnOverrides((prev) => {
149
+ const current = prev[fieldKey] || {};
150
+ return {
151
+ ...prev,
152
+ [fieldKey]: { ...current, pinned: current.pinned === side ? void 0 : side }
153
+ };
154
+ });
154
155
  setActiveMenu(null);
155
156
  };
156
- const toggleHide = (key) => {
157
- setColumns((prev) => prev.map(
158
- (col) => String(col.key) === key ? { ...col, hidden: !col.hidden } : col
159
- ));
157
+ const toggleHide = (fieldKey) => {
158
+ setColumnOverrides((prev) => {
159
+ const current = prev[fieldKey] || {};
160
+ const col = resolvedColumns.find((c) => String(c.field) === fieldKey);
161
+ if (col?.hideable === false) return prev;
162
+ return {
163
+ ...prev,
164
+ [fieldKey]: { ...current, hidden: !current.hidden }
165
+ };
166
+ });
160
167
  setActiveMenu(null);
161
168
  };
162
169
  const filteredData = (0, import_react.useMemo)(() => {
@@ -198,30 +205,30 @@ function DataGrid({
198
205
  });
199
206
  }, [data, filterText, advancedFilters]);
200
207
  const sortedData = (0, import_react.useMemo)(() => {
201
- if (!sortKey || !sortDirection) return filteredData;
202
- const col = columns.find((c) => c.key === sortKey);
208
+ if (!sortField || !sortDirection) return filteredData;
209
+ const col = resolvedColumns.find((c) => c.field === sortField);
203
210
  return [...filteredData].sort((a, b) => {
204
- let aVal = a[sortKey];
205
- let bVal = b[sortKey];
211
+ let aVal = a[sortField];
212
+ let bVal = b[sortField];
206
213
  if (col?.valueGetter) {
207
- aVal = col.valueGetter({ value: aVal, row: a, field: String(sortKey) });
208
- bVal = col.valueGetter({ value: bVal, row: b, field: String(sortKey) });
214
+ aVal = col.valueGetter({ value: aVal, row: a, field: String(sortField) });
215
+ bVal = col.valueGetter({ value: bVal, row: b, field: String(sortField) });
209
216
  }
210
217
  if (aVal < bVal) return sortDirection === "asc" ? -1 : 1;
211
218
  if (aVal > bVal) return sortDirection === "asc" ? 1 : -1;
212
219
  return 0;
213
220
  });
214
- }, [filteredData, sortKey, sortDirection, columns]);
221
+ }, [filteredData, sortField, sortDirection, resolvedColumns]);
215
222
  const totalPages = Math.max(1, Math.ceil(sortedData.length / pageSize));
216
223
  const paginatedData = (0, import_react.useMemo)(() => {
217
224
  const start = (currentPage - 1) * pageSize;
218
225
  return sortedData.slice(start, start + pageSize);
219
226
  }, [sortedData, currentPage, pageSize]);
220
227
  const handleExport = () => {
221
- const visibleCols = columns.filter((c) => !c.hidden);
222
- const headers = visibleCols.map((c) => c.header).join(",");
228
+ const visibleCols = resolvedColumns.filter((c) => !c.hidden);
229
+ const headers = visibleCols.map((c) => c.headerName).join(",");
223
230
  const rows = sortedData.map(
224
- (item) => visibleCols.map((c) => `"${String(item[c.key]).replace(/"/g, '""')}"`).join(",")
231
+ (item) => visibleCols.map((c) => `"${String(item[c.field]).replace(/"/g, '""')}"`).join(",")
225
232
  );
226
233
  const csv = [headers, ...rows].join("\n");
227
234
  const blob = new Blob([csv], { type: "text/csv;charset=utf-8;" });
@@ -232,24 +239,34 @@ function DataGrid({
232
239
  link.click();
233
240
  document.body.removeChild(link);
234
241
  };
235
- const handleMenuOpen = (e, key) => {
242
+ const handleMenuOpen = (e, keyStr) => {
236
243
  e.stopPropagation();
237
244
  const rect = e.currentTarget.getBoundingClientRect();
238
- setMenuPosition({ top: rect.bottom + 4, left: rect.left });
239
- setActiveMenu(key);
245
+ let position = {
246
+ top: rect.bottom + 4,
247
+ left: rect.left
248
+ };
249
+ if (rect.left + 150 > window.innerWidth) {
250
+ position = {
251
+ top: rect.bottom + 4,
252
+ right: window.innerWidth - rect.right
253
+ };
254
+ }
255
+ setMenuPosition(position);
256
+ setActiveMenu(keyStr);
240
257
  };
241
258
  const visibleColumns = (0, import_react.useMemo)(() => {
242
- const left = columns.filter((c) => !c.hidden && c.pinned === "left");
243
- const mid = columns.filter((c) => !c.hidden && !c.pinned);
244
- const right = columns.filter((c) => !c.hidden && c.pinned === "right");
259
+ const left = resolvedColumns.filter((c) => !c.hidden && c.pinned === "left");
260
+ const mid = resolvedColumns.filter((c) => !c.hidden && !c.pinned);
261
+ const right = resolvedColumns.filter((c) => !c.hidden && c.pinned === "right");
245
262
  return [...left, ...mid, ...right];
246
- }, [columns]);
263
+ }, [resolvedColumns]);
247
264
  const getLeftOffset = (col, idx) => {
248
265
  if (col.pinned !== "left") return void 0;
249
266
  let offset = 0;
250
267
  for (let i = 0; i < idx; i++) {
251
268
  if (visibleColumns[i].pinned === "left") {
252
- offset += columnWidths[String(visibleColumns[i].key)] || 200;
269
+ offset += columnWidths[String(visibleColumns[i].field)] || 200;
253
270
  }
254
271
  }
255
272
  return offset;
@@ -283,14 +300,14 @@ function DataGrid({
283
300
  },
284
301
  /* @__PURE__ */ import_react.default.createElement(import_lucide_react.Columns, { size: 16 })
285
302
  ), /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-action-btn", onClick: handleExport }, /* @__PURE__ */ import_react.default.createElement(import_lucide_react.Download, { size: 14 }), " Export CSV"))), /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-table-wrap" }, /* @__PURE__ */ import_react.default.createElement("table", { className: "dg-table" }, /* @__PURE__ */ import_react.default.createElement("thead", null, /* @__PURE__ */ import_react.default.createElement("tr", null, visibleColumns.map((col, idx) => {
286
- const colKey = String(col.key);
287
- const width = columnWidths[colKey] || 200;
303
+ const colField = String(col.field);
304
+ const width = columnWidths[colField] || 200;
288
305
  const leftOffset = getLeftOffset(col, idx);
289
- const isSorted = sortKey === col.key;
306
+ const isSorted = sortField === col.field;
290
307
  return /* @__PURE__ */ import_react.default.createElement(
291
308
  "th",
292
309
  {
293
- key: colKey,
310
+ key: colField,
294
311
  className: `dg-thead-cell${col.pinned === "left" ? " pinned-left" : col.pinned === "right" ? " pinned-right" : ""} ${col.headerClassName || ""}`,
295
312
  style: { width, minWidth: width, left: leftOffset, flex: col.flex }
296
313
  },
@@ -298,25 +315,25 @@ function DataGrid({
298
315
  "div",
299
316
  {
300
317
  className: `dg-th-label${col.sortable === false ? " no-sort" : ""}`,
301
- onClick: () => col.sortable !== false && handleSort(col.key)
318
+ onClick: () => col.sortable !== false && handleSort(col.field || "")
302
319
  },
303
- col.header,
320
+ col.headerName,
304
321
  isSorted && sortDirection === "asc" && /* @__PURE__ */ import_react.default.createElement(import_lucide_react.ChevronUp, { size: 12 }),
305
322
  isSorted && sortDirection === "desc" && /* @__PURE__ */ import_react.default.createElement(import_lucide_react.ChevronDown, { size: 12 })
306
323
  ), /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-th-actions" }, !col.disableColumnMenu && /* @__PURE__ */ import_react.default.createElement(
307
324
  "button",
308
325
  {
309
326
  className: "dg-th-menu-btn",
310
- onClick: (e) => handleMenuOpen(e, colKey)
327
+ onClick: (e) => handleMenuOpen(e, colField)
311
328
  },
312
329
  /* @__PURE__ */ import_react.default.createElement(import_lucide_react.MoreVertical, { size: 13 })
313
330
  ), /* @__PURE__ */ import_react.default.createElement(
314
331
  "div",
315
332
  {
316
- className: `dg-resizer${resizingColumn === colKey ? " resizing" : ""}`,
333
+ className: `dg-resizer${resizingColumn === colField ? " resizing" : ""}`,
317
334
  onMouseDown: (e) => {
318
335
  e.preventDefault();
319
- setResizingColumn(colKey);
336
+ setResizingColumn(colField);
320
337
  setStartX(e.clientX);
321
338
  setStartWidth(width);
322
339
  }
@@ -324,19 +341,19 @@ function DataGrid({
324
341
  )))
325
342
  );
326
343
  }), actions && /* @__PURE__ */ import_react.default.createElement("th", { style: { width: 0, padding: 0 } }))), /* @__PURE__ */ import_react.default.createElement("tbody", null, paginatedData.length === 0 ? /* @__PURE__ */ import_react.default.createElement("tr", null, /* @__PURE__ */ import_react.default.createElement("td", { colSpan: visibleColumns.length + (actions ? 1 : 0), className: "dg-empty" }, "No records found")) : paginatedData.map((item) => /* @__PURE__ */ import_react.default.createElement("tr", { key: item.id, className: "dg-tbody-row" }, visibleColumns.map((col, idx) => {
327
- const colKey = String(col.key);
328
- const width = columnWidths[colKey] || 200;
344
+ const colField = String(col.field);
345
+ const width = columnWidths[colField] || 200;
329
346
  const leftOffset = getLeftOffset(col, idx);
330
347
  return /* @__PURE__ */ import_react.default.createElement(
331
348
  "td",
332
349
  {
333
- key: `${item.id}-${colKey}`,
350
+ key: `${item.id}-${colField}`,
334
351
  className: `dg-td${col.pinned === "left" ? " pinned-left" : ""} ${col.cellClassName || ""}`,
335
352
  style: { width, minWidth: width, maxWidth: width, left: leftOffset, flex: col.flex }
336
353
  },
337
354
  (() => {
338
- const field = String(col.key);
339
- const rawValue = item[col.key];
355
+ const field = String(col.field);
356
+ const rawValue = item[col.field || ""];
340
357
  let value = col.valueGetter ? col.valueGetter({ value: rawValue, row: item, field }) : rawValue;
341
358
  const formattedValue = col.valueFormatter ? col.valueFormatter({ value, row: item, field }) : value;
342
359
  if (col.renderCell) {
@@ -383,8 +400,11 @@ function DataGrid({
383
400
  /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-menu-item", onClick: () => handleSort(activeMenu, "asc") }, /* @__PURE__ */ import_react.default.createElement(import_lucide_react.ArrowUp, { size: 14 }), " Sort ascending"),
384
401
  /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-menu-item", onClick: () => handleSort(activeMenu, "desc") }, /* @__PURE__ */ import_react.default.createElement(import_lucide_react.ArrowDown, { size: 14 }), " Sort descending"),
385
402
  /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-menu-divider" }),
386
- /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-menu-item", onClick: () => togglePin(activeMenu, "left") }, /* @__PURE__ */ import_react.default.createElement(import_lucide_react.Pin, { size: 14, style: { transform: "rotate(45deg)" } }), " Pin left"),
387
- /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-menu-item", onClick: () => togglePin(activeMenu, "right") }, /* @__PURE__ */ import_react.default.createElement(import_lucide_react.Pin, { size: 14, style: { transform: "rotate(-45deg)" } }), " Pin right"),
403
+ (() => {
404
+ const col = resolvedColumns.find((c) => c.field === activeMenu);
405
+ if (!col) return null;
406
+ return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, col.pinned === "left" ? /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-menu-item", onClick: () => togglePin(activeMenu, "left") }, /* @__PURE__ */ import_react.default.createElement(import_lucide_react.Pin, { size: 14, style: { transform: "rotate(0deg)", opacity: 0.5 } }), " Unpin") : /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-menu-item", onClick: () => togglePin(activeMenu, "left") }, /* @__PURE__ */ import_react.default.createElement(import_lucide_react.Pin, { size: 14, style: { transform: "rotate(45deg)" } }), " Pin left"), col.pinned === "right" ? /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-menu-item", onClick: () => togglePin(activeMenu, "right") }, /* @__PURE__ */ import_react.default.createElement(import_lucide_react.Pin, { size: 14, style: { transform: "rotate(0deg)", opacity: 0.5 } }), " Unpin") : /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-menu-item", onClick: () => togglePin(activeMenu, "right") }, /* @__PURE__ */ import_react.default.createElement(import_lucide_react.Pin, { size: 14, style: { transform: "rotate(-45deg)" } }), " Pin right"));
407
+ })(),
388
408
  /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-menu-divider" }),
389
409
  /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-menu-item", onClick: () => {
390
410
  setShowAdvancedFilter(true);
@@ -404,7 +424,27 @@ function DataGrid({
404
424
  value: colSearch,
405
425
  onChange: (e) => setColSearch(e.target.value)
406
426
  }
407
- )), columns.filter((c) => c.header.toLowerCase().includes(colSearch.toLowerCase()) && c.hideable !== false).map((col) => /* @__PURE__ */ import_react.default.createElement("div", { key: String(col.key), className: "dg-col-row" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-col-label" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-col-dot", style: { background: col.hidden ? "var(--border-color)" : "var(--primary-color)" } }), col.header), /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-icon-btn", onClick: () => toggleHide(String(col.key)) }, col.hidden ? /* @__PURE__ */ import_react.default.createElement(import_lucide_react.EyeOff, { size: 14 }) : /* @__PURE__ */ import_react.default.createElement(import_lucide_react.EyeOff, { size: 14, style: { opacity: 0.4 } }))))), /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-modal-footer" }, /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-action-btn", onClick: () => setColumns((p) => p.map((c) => ({ ...c, hidden: false }))) }, "Show All"), /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-action-btn", onClick: () => setColumns((p) => p.map((c) => c.hideable !== false ? { ...c, hidden: true } : c)) }, "Hide All")))), showAdvancedFilter && /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-modal-overlay", onClick: () => setShowAdvancedFilter(false) }, /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-modal dg-modal-wide", onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-modal-header" }, /* @__PURE__ */ import_react.default.createElement("h3", null, "Filters"), /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-icon-btn", onClick: () => setShowAdvancedFilter(false) }, /* @__PURE__ */ import_react.default.createElement(import_lucide_react.X, { size: 18 }))), /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-modal-body" }, advancedFilters.map((f, idx) => /* @__PURE__ */ import_react.default.createElement("div", { key: idx }, idx > 0 && /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-filter-logic" }, /* @__PURE__ */ import_react.default.createElement(
427
+ )), resolvedColumns.filter((c) => c.header.toLowerCase().includes(colSearch.toLowerCase())).map((col) => {
428
+ const key = String(col.key);
429
+ const isUnhideable = col.hideable === false;
430
+ return /* @__PURE__ */ import_react.default.createElement("div", { key, className: `dg-col-row${isUnhideable ? " disabled" : ""}` }, /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-col-label" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-col-dot", style: { background: col.hidden ? "var(--border-color)" : "var(--primary-color)" } }), col.header), !isUnhideable && /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-icon-btn", onClick: () => toggleHide(key) }, col.hidden ? /* @__PURE__ */ import_react.default.createElement(import_lucide_react.EyeOff, { size: 14 }) : /* @__PURE__ */ import_react.default.createElement(import_lucide_react.EyeOff, { size: 14, style: { opacity: 0.4 } })));
431
+ })), /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-modal-footer" }, /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-action-btn", onClick: () => setColumnOverrides((prev) => {
432
+ const next = { ...prev };
433
+ resolvedColumns.forEach((c) => {
434
+ const k = String(c.key);
435
+ next[k] = { ...next[k], hidden: false };
436
+ });
437
+ return next;
438
+ }) }, "Show All"), /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-action-btn", onClick: () => {
439
+ const newOverrides = { ...columnOverrides };
440
+ resolvedColumns.forEach((c) => {
441
+ if (c.hideable !== false) {
442
+ const key = String(c.key);
443
+ newOverrides[key] = { ...newOverrides[key], hidden: true };
444
+ }
445
+ });
446
+ setColumnOverrides(newOverrides);
447
+ } }, "Hide All")))), showAdvancedFilter && /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-modal-overlay", onClick: () => setShowAdvancedFilter(false) }, /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-modal dg-modal-wide", onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-modal-header" }, /* @__PURE__ */ import_react.default.createElement("h3", null, "Filters"), /* @__PURE__ */ import_react.default.createElement("button", { className: "dg-icon-btn", onClick: () => setShowAdvancedFilter(false) }, /* @__PURE__ */ import_react.default.createElement(import_lucide_react.X, { size: 18 }))), /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-modal-body" }, advancedFilters.map((f, idx) => /* @__PURE__ */ import_react.default.createElement("div", { key: idx }, idx > 0 && /* @__PURE__ */ import_react.default.createElement("div", { className: "dg-filter-logic" }, /* @__PURE__ */ import_react.default.createElement(
408
448
  "button",
409
449
  {
410
450
  className: `dg-logic-btn${f.logic === "AND" ? " active" : ""}`,
@@ -425,7 +465,7 @@ function DataGrid({
425
465
  value: f.column,
426
466
  onChange: (e) => setAdvancedFilters((p) => p.map((fi, i) => i === idx ? { ...fi, column: e.target.value } : fi))
427
467
  },
428
- columns.map((c) => /* @__PURE__ */ import_react.default.createElement("option", { key: String(c.key), value: String(c.key) }, c.header))
468
+ resolvedColumns.map((c) => /* @__PURE__ */ import_react.default.createElement("option", { key: String(c.key), value: String(c.key) }, c.header))
429
469
  ), /* @__PURE__ */ import_react.default.createElement(
430
470
  "select",
431
471
  {
@@ -439,20 +479,25 @@ function DataGrid({
439
479
  /* @__PURE__ */ import_react.default.createElement("option", { value: "ends with" }, "ends with"),
440
480
  /* @__PURE__ */ import_react.default.createElement("option", { value: "is empty" }, "is empty"),
441
481
  /* @__PURE__ */ import_react.default.createElement("option", { value: "is not empty" }, "is not empty")
442
- ), /* @__PURE__ */ import_react.default.createElement(
443
- "input",
444
- {
445
- className: "dg-filter-input",
446
- placeholder: "Value\u2026",
447
- value: f.value,
448
- onChange: (e) => setAdvancedFilters((p) => p.map((fi, i) => i === idx ? { ...fi, value: e.target.value } : fi))
449
- }
450
- )))), /* @__PURE__ */ import_react.default.createElement(
482
+ ), (() => {
483
+ const col = resolvedColumns.find((c) => String(c.field) === f.column);
484
+ const isDate = col?.type === "date";
485
+ return /* @__PURE__ */ import_react.default.createElement(
486
+ "input",
487
+ {
488
+ type: isDate ? "date" : "text",
489
+ className: "dg-filter-input",
490
+ placeholder: "Value\u2026",
491
+ value: f.value,
492
+ onChange: (e) => setAdvancedFilters((p) => p.map((fi, i) => i === idx ? { ...fi, value: e.target.value } : fi))
493
+ }
494
+ );
495
+ })()))), /* @__PURE__ */ import_react.default.createElement(
451
496
  "button",
452
497
  {
453
498
  className: "dg-action-btn",
454
499
  style: { alignSelf: "flex-start", marginTop: 4 },
455
- onClick: () => setAdvancedFilters((p) => [...p, { column: String(columns[0].key), operator: "contains", value: "", logic: "AND" }])
500
+ onClick: () => setAdvancedFilters((p) => [...p, { column: String(resolvedColumns[0].key), operator: "contains", value: "", logic: "AND" }])
456
501
  },
457
502
  /* @__PURE__ */ import_react.default.createElement(import_lucide_react.Plus, { size: 14 }),
458
503
  " Add Filter"
@@ -460,7 +505,7 @@ function DataGrid({
460
505
  "button",
461
506
  {
462
507
  className: "dg-action-btn",
463
- onClick: () => setAdvancedFilters([{ column: String(columns[0].key), operator: "contains", value: "", logic: "AND" }])
508
+ onClick: () => setAdvancedFilters([{ column: String(resolvedColumns[0].key), operator: "contains", value: "", logic: "AND" }])
464
509
  },
465
510
  /* @__PURE__ */ import_react.default.createElement(import_lucide_react.Trash2, { size: 14 }),
466
511
  " Reset"
package/dist/DataGrid/index.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import "../chunk-7KRG7VNW.js";
2
2
  import {
3
3
  DataGrid
4
- } from "../chunk-B6EOV25J.js";
4
+ } from "../chunk-7OMS6IWF.js";
5
5
  import "../chunk-LI4N7JWK.js";
6
6
  export {
7
7
  DataGrid
package/dist/Dialogs/BaseDialog.css CHANGED
@@ -443,7 +443,6 @@
443
443
  padding: 0;
444
444
  font-size: 0.72rem;
445
445
  font-weight: 700;
446
- text-transform: uppercase;
447
446
  letter-spacing: 0.06em;
448
447
  color: var(--text-secondary);
449
448
  position: relative;
package/dist/Dialogs/BaseDialog.js CHANGED
@@ -1,13 +1,11 @@
1
1
  import {
2
2
  BaseDialog_default
3
- } from "../chunk-4GPYGFPP.js";
3
+ } from "../chunk-K6626C4D.js";
4
4
  import "../chunk-E5RTHYCU.js";
5
- import "../chunk-EZI3QGYJ.js";
6
5
  import "../chunk-QTGVW36I.js";
7
6
  import "../chunk-G2GZDPUL.js";
8
7
  import "../chunk-CTWVJQJ5.js";
9
8
  import "../chunk-QJPQC544.js";
10
- import "../chunk-3Y6QBRGD.js";
11
9
  import "../chunk-JVN6QVET.js";
12
10
  import "../chunk-R4ISYGEP.js";
13
11
  import "../chunk-5JWTJ5PY.js";
@@ -15,7 +13,7 @@ import "../chunk-763IHEJ2.js";
15
13
  import "../chunk-XHY3OCAQ.js";
16
14
  import "../chunk-6KIFTMUN.js";
17
15
  import "../chunk-ZJAV3FEQ.js";
18
- import "../chunk-Q4DHI3B5.js";
16
+ import "../chunk-EZI3QGYJ.js";
19
17
  import "../chunk-YTVUM76D.js";
20
18
  import "../chunk-WG3Q6GZN.js";
21
19
  import "../chunk-RJ43D3XB.js";
@@ -23,7 +21,7 @@ import "../chunk-QDMNCTXT.js";
23
21
  import "../chunk-DMP72IAP.js";
24
22
  import "../chunk-QZFGQ5JM.js";
25
23
  import "../chunk-DK3DA5LH.js";
26
- import "../chunk-UTBCFDOX.js";
24
+ import "../chunk-3Y6QBRGD.js";
27
25
  import "../chunk-4Y7SQ5EP.js";
28
26
  import "../chunk-B2LVMM55.js";
29
27
  import "../chunk-2AJACSJ3.js";
@@ -31,7 +29,7 @@ import "../chunk-WHGVO3HV.js";
31
29
  import "../chunk-7II4Q2WY.js";
32
30
  import "../chunk-5GK5B3FD.js";
33
31
  import "../chunk-Z7USRFM2.js";
34
- import "../chunk-4BTXGP7U.js";
32
+ import "../chunk-Q4DHI3B5.js";
35
33
  import "../chunk-6SUKO6QW.js";
36
34
  import "../chunk-UTYIBUY2.js";
37
35
  import "../chunk-N4EJKMJK.js";
@@ -39,14 +37,14 @@ import "../chunk-FPRXN3DS.js";
39
37
  import "../chunk-GESVGIAP.js";
40
38
  import "../chunk-QIEQRNBE.js";
41
39
  import "../chunk-DLJHWFNG.js";
42
- import "../chunk-XCE3QE6Q.js";
40
+ import "../chunk-UTBCFDOX.js";
43
41
  import "../chunk-H372BAXA.js";
44
42
  import "../chunk-ZLJDOLXZ.js";
45
43
  import "../chunk-OJV6F5JC.js";
46
44
  import "../chunk-AXSFVJ3H.js";
47
45
  import "../chunk-WZAU77G7.js";
48
46
  import "../chunk-77QDKDFI.js";
49
- import "../chunk-6FEUS4CQ.js";
47
+ import "../chunk-4BTXGP7U.js";
50
48
  import "../chunk-5XKFPQLH.js";
51
49
  import "../chunk-JI5XMLWT.js";
52
50
  import "../chunk-WXANSSXF.js";
@@ -54,25 +52,27 @@ import "../chunk-XPJVVKOU.js";
54
52
  import "../chunk-GL43GPEM.js";
55
53
  import "../chunk-FZCFFVXW.js";
56
54
  import "../chunk-N26C33E6.js";
55
+ import "../chunk-XCE3QE6Q.js";
56
+ import "../chunk-M5GFOGY5.js";
57
+ import "../chunk-BOE27BFQ.js";
58
+ import "../chunk-S7BNFVQO.js";
59
+ import "../chunk-UPCMMCPQ.js";
57
60
  import "../chunk-AH6RCYDL.js";
58
61
  import "../chunk-3IBCGGN3.js";
59
62
  import "../chunk-MNPAE2ZF.js";
60
63
  import "../chunk-Q5XKCUE3.js";
61
- import "../chunk-EB6MPFGC.js";
62
- import "../chunk-UPCMMCPQ.js";
63
- import "../chunk-X357WQOT.js";
64
- import "../chunk-7KRG7VNW.js";
65
- import "../chunk-B6EOV25J.js";
64
+ import "../chunk-6FEUS4CQ.js";
66
65
  import "../chunk-GJGRMMAQ.js";
67
- import "../chunk-66HHM7VI.js";
66
+ import "../chunk-X357WQOT.js";
68
67
  import "../chunk-QPGJCRBS.js";
69
68
  import "../chunk-U7SARO5B.js";
70
69
  import "../chunk-BMMDUQDJ.js";
71
70
  import "../chunk-R3GARAVJ.js";
72
71
  import "../chunk-YRLN3TBF.js";
73
72
  import "../chunk-CTBYVXFP.js";
74
- import "../chunk-BOE27BFQ.js";
75
- import "../chunk-S7BNFVQO.js";
73
+ import "../chunk-7KRG7VNW.js";
74
+ import "../chunk-7OMS6IWF.js";
75
+ import "../chunk-66HHM7VI.js";
76
76
  import "../chunk-LI4N7JWK.js";
77
77
  export {
78
78
  BaseDialog_default as default
package/dist/Dialogs/index.css CHANGED
@@ -443,7 +443,6 @@
443
443
  padding: 0;
444
444
  font-size: 0.72rem;
445
445
  font-weight: 700;
446
- text-transform: uppercase;
447
446
  letter-spacing: 0.06em;
448
447
  color: var(--text-secondary);
449
448
  position: relative;
package/dist/Dialogs/index.js CHANGED
@@ -1,13 +1,11 @@
1
1
  import {
2
2
  BaseDialog_default
3
- } from "../chunk-4GPYGFPP.js";
3
+ } from "../chunk-K6626C4D.js";
4
4
  import "../chunk-E5RTHYCU.js";
5
- import "../chunk-EZI3QGYJ.js";
6
5
  import "../chunk-QTGVW36I.js";
7
6
  import "../chunk-G2GZDPUL.js";
8
7
  import "../chunk-CTWVJQJ5.js";
9
8
  import "../chunk-QJPQC544.js";
10
- import "../chunk-3Y6QBRGD.js";
11
9
  import "../chunk-JVN6QVET.js";
12
10
  import "../chunk-R4ISYGEP.js";
13
11
  import "../chunk-5JWTJ5PY.js";
@@ -15,7 +13,7 @@ import "../chunk-763IHEJ2.js";
15
13
  import "../chunk-XHY3OCAQ.js";
16
14
  import "../chunk-6KIFTMUN.js";
17
15
  import "../chunk-ZJAV3FEQ.js";
18
- import "../chunk-Q4DHI3B5.js";
16
+ import "../chunk-EZI3QGYJ.js";
19
17
  import "../chunk-YTVUM76D.js";
20
18
  import "../chunk-WG3Q6GZN.js";
21
19
  import "../chunk-RJ43D3XB.js";
@@ -23,7 +21,7 @@ import "../chunk-QDMNCTXT.js";
23
21
  import "../chunk-DMP72IAP.js";
24
22
  import "../chunk-QZFGQ5JM.js";
25
23
  import "../chunk-DK3DA5LH.js";
26
- import "../chunk-UTBCFDOX.js";
24
+ import "../chunk-3Y6QBRGD.js";
27
25
  import "../chunk-4Y7SQ5EP.js";
28
26
  import "../chunk-B2LVMM55.js";
29
27
  import "../chunk-2AJACSJ3.js";
@@ -31,7 +29,7 @@ import "../chunk-WHGVO3HV.js";
31
29
  import "../chunk-7II4Q2WY.js";
32
30
  import "../chunk-5GK5B3FD.js";
33
31
  import "../chunk-Z7USRFM2.js";
34
- import "../chunk-4BTXGP7U.js";
32
+ import "../chunk-Q4DHI3B5.js";
35
33
  import "../chunk-6SUKO6QW.js";
36
34
  import "../chunk-UTYIBUY2.js";
37
35
  import "../chunk-N4EJKMJK.js";
@@ -39,14 +37,14 @@ import "../chunk-FPRXN3DS.js";
39
37
  import "../chunk-GESVGIAP.js";
40
38
  import "../chunk-QIEQRNBE.js";
41
39
  import "../chunk-DLJHWFNG.js";
42
- import "../chunk-XCE3QE6Q.js";
40
+ import "../chunk-UTBCFDOX.js";
43
41
  import "../chunk-H372BAXA.js";
44
42
  import "../chunk-ZLJDOLXZ.js";
45
43
  import "../chunk-OJV6F5JC.js";
46
44
  import "../chunk-AXSFVJ3H.js";
47
45
  import "../chunk-WZAU77G7.js";
48
46
  import "../chunk-77QDKDFI.js";
49
- import "../chunk-6FEUS4CQ.js";
47
+ import "../chunk-4BTXGP7U.js";
50
48
  import "../chunk-5XKFPQLH.js";
51
49
  import "../chunk-JI5XMLWT.js";
52
50
  import "../chunk-WXANSSXF.js";
@@ -54,25 +52,27 @@ import "../chunk-XPJVVKOU.js";
54
52
  import "../chunk-GL43GPEM.js";
55
53
  import "../chunk-FZCFFVXW.js";
56
54
  import "../chunk-N26C33E6.js";
55
+ import "../chunk-XCE3QE6Q.js";
56
+ import "../chunk-M5GFOGY5.js";
57
+ import "../chunk-BOE27BFQ.js";
58
+ import "../chunk-S7BNFVQO.js";
59
+ import "../chunk-UPCMMCPQ.js";
57
60
  import "../chunk-AH6RCYDL.js";
58
61
  import "../chunk-3IBCGGN3.js";
59
62
  import "../chunk-MNPAE2ZF.js";
60
63
  import "../chunk-Q5XKCUE3.js";
61
- import "../chunk-EB6MPFGC.js";
62
- import "../chunk-UPCMMCPQ.js";
63
- import "../chunk-X357WQOT.js";
64
- import "../chunk-7KRG7VNW.js";
65
- import "../chunk-B6EOV25J.js";
64
+ import "../chunk-6FEUS4CQ.js";
66
65
  import "../chunk-GJGRMMAQ.js";
67
- import "../chunk-66HHM7VI.js";
66
+ import "../chunk-X357WQOT.js";
68
67
  import "../chunk-QPGJCRBS.js";
69
68
  import "../chunk-U7SARO5B.js";
70
69
  import "../chunk-BMMDUQDJ.js";
71
70
  import "../chunk-R3GARAVJ.js";
72
71
  import "../chunk-YRLN3TBF.js";
73
72
  import "../chunk-CTBYVXFP.js";
74
- import "../chunk-BOE27BFQ.js";
75
- import "../chunk-S7BNFVQO.js";
73
+ import "../chunk-7KRG7VNW.js";
74
+ import "../chunk-7OMS6IWF.js";
75
+ import "../chunk-66HHM7VI.js";
76
76
  import "../chunk-LI4N7JWK.js";
77
77
  export {
78
78
  BaseDialog_default as BaseDialog