laif-ds 0.1.38 → 0.1.40

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 (4) hide show
  1. package/dist/components/ui/tables/data-cross-table/data-cross-table.js +467 -309
  2. package/dist/styles.v3.css +1 -1
  3. package/package.json +1 -1
  4. package/dist/components/ui/tables/data-cross-table/editable-input.js +0 -102
package/dist/components/ui/tables/data-cross-table/data-cross-table.js CHANGED
@@ -1,368 +1,526 @@
1
1
  "use client";
2
- import { jsxs as B, jsx as i } from "react/jsx-runtime";
3
- import { useState as g, useEffect as Y, useMemo as F, useRef as ce } from "react";
4
- import { useReactTable as fe, flexRender as q } from "../../../../node_modules/@tanstack/react-table/build/lib/index.js";
5
- import { useVirtualizer as me } from "../../../../node_modules/@tanstack/react-virtual/dist/esm/index.js";
6
- import { TableSkeleton as pe } from "../../table-skeleton.js";
7
- import { TruncatedText as N } from "./truncated-text.js";
8
- import { EditControls as ge } from "./edit-controls.js";
9
- import { EditableInput as he } from "./editable-input.js";
10
- import { Button as G } from "../../button.js";
11
- import { TableRow as _, TableCell as J, Table as xe, TableHeader as be, TableHead as ve, TableBody as ye } from "../../table.js";
12
- import { getSortedRowModel as Ce, getCoreRowModel as Se } from "../../../../node_modules/@tanstack/table-core/build/lib/index.js";
13
- function Ae({
14
- crossTableData: z,
15
- filterable: h = !1,
16
- loading: Q = !1,
17
- emptyComponent: X,
18
- className: T,
19
- notFoundMessage: Z = "Nessun risultato trovato.",
20
- cornerHeaderFrom: D = "Da",
21
- cornerHeaderTo: V = "A",
22
- maxHeaderLength: x = 15,
23
- minWidthCell: E = 160,
2
+ import { jsxs as d, jsx as r } from "react/jsx-runtime";
3
+ import { useState as c, useRef as oe, useEffect as X, useCallback as I, useMemo as Y } from "react";
4
+ import { useReactTable as Re, flexRender as re } from "../../../../node_modules/@tanstack/react-table/build/lib/index.js";
5
+ import { useVirtualizer as Te } from "../../../../node_modules/@tanstack/react-virtual/dist/esm/index.js";
6
+ import { TableSkeleton as Ee } from "../../table-skeleton.js";
7
+ import { TruncatedText as D } from "./truncated-text.js";
8
+ import { EditControls as De } from "./edit-controls.js";
9
+ import { Icon as U } from "../../icon.js";
10
+ import { Popover as $e, PopoverTrigger as Oe, PopoverContent as Ae } from "../../popover.js";
11
+ import { Button as k } from "../../button.js";
12
+ import { TableRow as q, TableCell as se, Table as Ke, TableHeader as Le, TableHead as Me, TableBody as Pe } from "../../table.js";
13
+ import { getSortedRowModel as Be, getCoreRowModel as Fe } from "../../../../node_modules/@tanstack/table-core/build/lib/index.js";
14
+ function nt({
15
+ crossTableData: $,
16
+ filterable: b = !1,
17
+ loading: ie = !1,
18
+ emptyComponent: ae,
19
+ className: O,
20
+ notFoundMessage: de = "Nessun risultato trovato.",
21
+ cornerHeaderFrom: A = "Da",
22
+ cornerHeaderTo: K = "A",
23
+ maxHeaderLength: w = 15,
24
+ minWidthCell: L = 160,
24
25
  editable: M = !1,
25
- editMode: H = !1,
26
- editConfirmLabel: W = "Conferma",
27
- editCancelLabel: ee = "Annulla",
28
- onConfirmedCells: w,
29
- onEditModeChange: $,
30
- onSelectedRow: K,
31
- selectedRow: a,
32
- rowSortAsc: te = !0
26
+ editMode: ce = !1,
27
+ editConfirmLabel: ue = "Conferma",
28
+ editCancelLabel: fe = "Annulla",
29
+ onConfirmedCells: z,
30
+ onEditModeChange: P,
31
+ onSelectedRow: G,
32
+ selectedRow: u,
33
+ rowSortAsc: me = !0
33
34
  }) {
34
- const [re, oe] = g([]), u = z.headerTop, d = z.headerLeft, m = z.data, [b, A] = g(
35
- (a == null ? void 0 : a.id) ?? null
36
- ), [L, O] = g(te), [I, ne] = g(M && H);
37
- Y(() => {
38
- $ && $(!!I);
39
- }, [I, $]), Y(() => {
40
- a != null && a.id && A(a.id);
41
- }, [a]);
42
- const [v, j] = g({}), [y, k] = g({}), le = (l) => l && typeof l == "object" && "value" in l ? l.value : l, c = F(() => {
43
- if (!b || !d.find((e) => e.id === b)) return u;
44
- const t = d.findIndex(
45
- (e) => e.id === b
35
+ var ee, te;
36
+ const [pe, he] = c([]), m = $.headerTop, f = $.headerLeft, v = $.data, [C, B] = c(
37
+ (u == null ? void 0 : u.id) ?? null
38
+ ), [F, W] = c(me), [V, ge] = c(M && ce), [J, Q] = c(0), j = oe(null);
39
+ X(() => {
40
+ const t = () => {
41
+ if (j.current && j.current.parentElement) {
42
+ const e = j.current.parentElement.clientWidth, o = window.getComputedStyle(
43
+ j.current.parentElement
44
+ ), n = parseInt(o.paddingLeft, 10) || 0, s = parseInt(o.paddingRight, 10) || 0;
45
+ Q(e - n - s);
46
+ } else
47
+ Q(document.body.clientWidth - 40);
48
+ };
49
+ return window.addEventListener("resize", t), setTimeout(t, 0), () => window.removeEventListener("resize", t);
50
+ }, []), X(() => {
51
+ P && P(!!V);
52
+ }, [V, P]), X(() => {
53
+ u != null && u.id && B(u.id);
54
+ }, [u]);
55
+ const [S, N] = c({}), [p, x] = c({}), [l, ve] = c(null), [xe, y] = c(!1), [R, T] = c(null), ye = I(
56
+ (t) => {
57
+ t && l && T(l.value), y(t);
58
+ },
59
+ [l]
60
+ ), be = I(() => {
61
+ l && R !== null ? (N((t) => ({
62
+ ...t,
63
+ [l.cellKey]: {
64
+ value: R,
65
+ cell: l.cellData
66
+ }
67
+ })), p[l.cellKey] && x((t) => {
68
+ const e = { ...t };
69
+ return delete e[l.cellKey], e;
70
+ }), setTimeout(() => {
71
+ y(!1);
72
+ }, 300)) : y(!1);
73
+ }, [l, R, p]), we = I(() => {
74
+ l && (T(l.originalValue), N((t) => {
75
+ const e = { ...t };
76
+ return e[l.cellKey] && delete e[l.cellKey], e;
77
+ }), x((t) => {
78
+ const e = { ...t };
79
+ return e[l.cellKey] && delete e[l.cellKey], e;
80
+ })), y(!1);
81
+ }, [l]), Ce = I(() => {
82
+ l && (N((t) => {
83
+ const e = { ...t };
84
+ return e[l.cellKey] && delete e[l.cellKey], e;
85
+ }), x((t) => ({
86
+ ...t,
87
+ [l.cellKey]: {
88
+ value: l.originalValue,
89
+ cell: l.cellData
90
+ }
91
+ }))), y(!1);
92
+ }, [l]), Se = I(
93
+ (t) => {
94
+ T(t.target.value);
95
+ },
96
+ []
97
+ ), Ne = (t) => t && typeof t == "object" && "value" in t ? t.value : t, h = Y(() => {
98
+ if (!C || !f.find((n) => n.id === C)) return m;
99
+ const e = f.findIndex(
100
+ (n) => n.id === C
46
101
  );
47
- if (t === -1) return u;
48
- const r = u.map((e, n) => {
49
- var f;
50
- const o = ((f = m[t]) == null ? void 0 : f[n]) ?? null, s = le(o);
51
- return { header: e, value: s };
102
+ if (e === -1) return m;
103
+ const o = m.map((n, s) => {
104
+ var g;
105
+ const i = ((g = v[e]) == null ? void 0 : g[s]) ?? null, a = Ne(i);
106
+ return { header: n, value: a };
52
107
  });
53
- return r.sort((e, n) => {
54
- if (typeof e.value == "number" && typeof n.value == "number")
55
- return L ? e.value - n.value : n.value - e.value;
56
- const o = String(e.value ?? ""), s = String(n.value ?? "");
57
- return L ? o.localeCompare(s) : s.localeCompare(o);
58
- }), r.map((e) => e.header);
59
- }, [u, d, m, b, L]), se = F(() => {
60
- const l = [
108
+ return o.sort((n, s) => {
109
+ if (typeof n.value == "number" && typeof s.value == "number")
110
+ return F ? n.value - s.value : s.value - n.value;
111
+ const i = String(n.value ?? ""), a = String(s.value ?? "");
112
+ return F ? i.localeCompare(a) : a.localeCompare(i);
113
+ }), o.map((n) => n.header);
114
+ }, [m, f, v, C, F]), Ie = Y(() => {
115
+ const t = [
61
116
  {
62
117
  id: "cross-header",
63
- header: () => /* @__PURE__ */ B("div", { className: "relative", children: [
64
- /* @__PURE__ */ i("div", { className: "absolute top-0 left-2 text-xs", children: D }),
65
- /* @__PURE__ */ i("div", { className: "absolute right-2 bottom-0 text-xs", children: V })
118
+ header: () => /* @__PURE__ */ d("div", { className: "relative", children: [
119
+ /* @__PURE__ */ r("div", { className: "absolute top-0 left-2 text-xs", children: A }),
120
+ /* @__PURE__ */ r("div", { className: "absolute right-2 bottom-0 text-xs", children: K })
66
121
  ] }),
67
- accessorFn: (t) => t.item,
68
- cell: (t) => {
69
- const r = t.getValue();
70
- if (!h)
71
- return /* @__PURE__ */ i(
72
- N,
122
+ accessorFn: (e) => e.item,
123
+ cell: (e) => {
124
+ const o = e.getValue();
125
+ if (!b)
126
+ return /* @__PURE__ */ r(
127
+ D,
73
128
  {
74
- text: r.label,
75
- maxLength: x,
129
+ text: o.label,
130
+ maxLength: w,
76
131
  className: "w-full"
77
132
  }
78
133
  );
79
- const e = b === r.id;
80
- return /* @__PURE__ */ i(
81
- G,
134
+ const n = C === o.id;
135
+ return /* @__PURE__ */ r(
136
+ k,
82
137
  {
83
138
  variant: "ghost",
84
139
  size: "sm",
85
140
  iconLeft: "ArrowLeftRight",
86
141
  className: "text-right",
87
142
  onClick: () => {
88
- h && (e ? O((n) => !n) : (A(d[t.row.index].id), O(!0), K && K(d[t.row.index])));
143
+ b && (n ? W((s) => !s) : (B(f[e.row.index].id), W(!0), G && G(f[e.row.index])));
89
144
  },
90
- children: /* @__PURE__ */ i(N, { text: r.label, maxLength: x })
145
+ children: /* @__PURE__ */ r(D, { text: o.label, maxLength: w })
91
146
  }
92
147
  );
93
148
  }
94
149
  }
95
150
  ];
96
- return c.forEach((t) => {
97
- l.push({
98
- id: t.id,
99
- accessorFn: (r) => r[t.id],
100
- header: ({ column: r }) => h ? /* @__PURE__ */ i(
101
- G,
151
+ return h.forEach((e) => {
152
+ t.push({
153
+ id: e.id,
154
+ accessorFn: (o) => o[e.id],
155
+ header: ({ column: o }) => b ? /* @__PURE__ */ r(
156
+ k,
102
157
  {
103
158
  variant: "ghost",
104
159
  size: "sm",
105
160
  iconLeft: "ArrowUpDown",
106
- onClick: h ? () => r.toggleSorting(r.getIsSorted() === "asc") : void 0,
107
- children: /* @__PURE__ */ i(N, { text: t.label, maxLength: x })
161
+ onClick: b ? () => o.toggleSorting(o.getIsSorted() === "asc") : void 0,
162
+ children: /* @__PURE__ */ r(D, { text: e.label, maxLength: w })
108
163
  }
109
- ) : /* @__PURE__ */ i(
110
- N,
164
+ ) : /* @__PURE__ */ r(
165
+ D,
111
166
  {
112
- text: t.label,
113
- maxLength: x,
167
+ text: e.label,
168
+ maxLength: w,
114
169
  className: "font-medium"
115
170
  }
116
171
  ),
117
- sortingFn: (r, e, n) => {
118
- let o = r.getValue(n), s = e.getValue(n);
119
- return o == null && s == null ? 0 : o == null ? 1 : s == null ? -1 : (o && typeof o == "object" && "value" in o && (o = o.value), s && typeof s == "object" && "value" in s && (s = s.value), typeof o == "number" && typeof s == "number" ? o - s : String(o).localeCompare(String(s)));
172
+ sortingFn: (o, n, s) => {
173
+ let i = o.getValue(s), a = n.getValue(s);
174
+ return i == null && a == null ? 0 : i == null ? 1 : a == null ? -1 : (i && typeof i == "object" && "value" in i && (i = i.value), a && typeof a == "object" && "value" in a && (a = a.value), typeof i == "number" && typeof a == "number" ? i - a : String(i).localeCompare(String(a)));
120
175
  },
121
- cell: (r) => {
122
- const e = r.getValue();
123
- return e ? e.render ? e.render(e.fromId, e.toId, e.id) : /* @__PURE__ */ i("div", { children: e.value }) : null;
176
+ cell: (o) => {
177
+ const n = o.getValue();
178
+ return n ? n.render ? n.render(n.fromId, n.toId, n.id) : /* @__PURE__ */ r("div", { children: n.value }) : null;
124
179
  }
125
180
  });
126
- }), l;
181
+ }), t;
127
182
  }, [
128
- c,
129
- D,
130
- V,
131
- a,
132
183
  h,
133
- x,
134
184
  A,
135
- O
136
- ]), ie = F(() => d.map((l, t) => {
137
- const r = { item: l };
138
- return c.forEach((e) => {
139
- var o;
140
- const n = u.findIndex((s) => s.id === e.id);
141
- r[e.id] = n !== -1 ? ((o = m[t]) == null ? void 0 : o[n]) ?? null : null;
142
- }), r;
143
- }), [d, c, m, u]), R = fe({
144
- data: ie,
145
- columns: se,
146
- state: { sorting: re },
147
- onSortingChange: oe,
148
- getCoreRowModel: Se(),
149
- getSortedRowModel: Ce()
185
+ K,
186
+ u,
187
+ b,
188
+ w,
189
+ B,
190
+ W
191
+ ]), ke = Y(() => f.map((t, e) => {
192
+ const o = { item: t };
193
+ return h.forEach((n) => {
194
+ var i;
195
+ const s = m.findIndex((a) => a.id === n.id);
196
+ o[n.id] = s !== -1 ? ((i = v[e]) == null ? void 0 : i[s]) ?? null : null;
197
+ }), o;
198
+ }), [f, h, v, m]), _ = Re({
199
+ data: ke,
200
+ columns: Ie,
201
+ state: { sorting: pe },
202
+ onSortingChange: he,
203
+ getCoreRowModel: Fe(),
204
+ getSortedRowModel: Be()
150
205
  });
151
- if (!m || m.length === 0)
152
- return /* @__PURE__ */ i("div", { className: T, children: /* @__PURE__ */ i(_, { children: /* @__PURE__ */ i(J, { colSpan: c.length + 1, children: X || Z }) }) });
153
- if (Q)
154
- return /* @__PURE__ */ i(
155
- pe,
206
+ if (!v || v.length === 0)
207
+ return /* @__PURE__ */ r("div", { className: O, children: /* @__PURE__ */ r(q, { children: /* @__PURE__ */ r(se, { colSpan: h.length + 1, children: ae || de }) }) });
208
+ if (ie)
209
+ return /* @__PURE__ */ r(
210
+ Ee,
156
211
  {
157
- headerRow: c.map((l) => l.label),
158
- rowCount: d.length || 5,
159
- columnCount: c.length || 5,
160
- className: T,
161
- cornerHeaderFrom: D,
162
- cornerHeaderTo: V
212
+ headerRow: h.map((t) => t.label),
213
+ rowCount: f.length || 5,
214
+ columnCount: h.length || 5,
215
+ className: O,
216
+ cornerHeaderFrom: A,
217
+ cornerHeaderTo: K
163
218
  }
164
219
  );
165
- const ae = (l) => {
166
- const t = l.column.id === "cross-header", r = t, e = ["bg-d-secondary"];
167
- t || e.push("border-r"), t && e.push("sticky left-0"), e.push("sticky top-0 z-20"), r ? e.push("z-40") : t && e.push("z-30");
168
- let n = "none";
169
- return t && (n = "inset -1px 0 0 0 var(--d-border), 0 1px 0 0 var(--d-border)"), {
170
- className: e.join(" "),
171
- style: { boxShadow: n, width: `${E}px` }
220
+ const ze = (t) => {
221
+ const e = t.column.id === "cross-header", o = e, n = ["bg-d-secondary"];
222
+ e || n.push("border-r"), e && n.push("sticky left-0"), n.push("sticky top-0 z-20"), o ? n.push("z-40") : e && n.push("z-30");
223
+ let s = "none";
224
+ return e && (s = "inset -1px 0 0 0 var(--d-border), 0 1px 0 0 var(--d-border)"), {
225
+ className: n.join(" "),
226
+ style: { boxShadow: s, width: `${L}px` }
172
227
  };
173
- }, P = ce(null), U = me({
174
- count: R.getRowModel().rows.length,
175
- getScrollElement: () => P.current,
228
+ }, Z = oe(null), H = Te({
229
+ count: _.getRowModel().rows.length,
230
+ getScrollElement: () => Z.current,
176
231
  estimateSize: () => 40,
177
232
  overscan: 5,
178
- measureElement: typeof window < "u" ? (l) => l.getBoundingClientRect().height : void 0
233
+ measureElement: typeof window < "u" ? (t) => t.getBoundingClientRect().height : void 0
179
234
  });
180
- return /* @__PURE__ */ B("div", { className: `w-[900px] ${T || ""}`, children: [
181
- M && /* @__PURE__ */ i(
182
- ge,
183
- {
184
- editable: M,
185
- editConfirmLabel: W,
186
- editCancelLabel: ee,
187
- editRestoreDefaultLabel: "Ripristina Default",
188
- editMode: I,
189
- setEditMode: ne,
190
- editedCount: Object.keys(v).length,
191
- defaultCount: Object.keys(y).length,
192
- restoreDefault: () => {
193
- if (w) {
194
- const l = Object.entries(y).map(
195
- ([r, { value: e, cell: n }]) => ({
196
- fromId: n.fromId,
197
- toId: n.toId,
198
- id: n.id,
199
- value: e
200
- })
201
- );
202
- w({
203
- editedCells: [],
204
- toDefaultCells: l
205
- });
206
- }
207
- k({});
208
- },
209
- confirmAll: () => {
210
- if (w && (Object.keys(v).length > 0 || Object.keys(y).length > 0)) {
211
- const t = Object.entries(v).map(
212
- ([n, { value: o, cell: s }]) => ({
213
- fromId: s.fromId,
214
- toId: s.toId,
215
- id: s.id,
216
- value: o
217
- })
218
- ), r = Object.entries(y).map(
219
- ([n, { value: o, cell: s }]) => ({
220
- fromId: s.fromId,
221
- toId: s.toId,
222
- id: s.id,
223
- value: o
224
- })
225
- );
226
- w({
227
- editedCells: t,
228
- toDefaultCells: r
229
- });
230
- }
231
- j({}), k({});
232
- },
233
- cancelAll: () => {
234
- j({}), k({});
235
- }
236
- }
237
- ),
238
- /* @__PURE__ */ i(
239
- "div",
240
- {
241
- ref: P,
242
- className: "max-h-[600px] overflow-auto rounded-md border",
243
- children: /* @__PURE__ */ B(xe, { className: "relative w-full table-fixed border-collapse", children: [
244
- /* @__PURE__ */ i(
245
- be,
246
- {
247
- className: "bg-d-secondary sticky top-0 z-20",
248
- style: { boxShadow: "0 1px 0 0 var(--d-border)" },
249
- children: R.getHeaderGroups().map((l) => /* @__PURE__ */ i(
250
- _,
251
- {
252
- className: "bg-d-secondary sticky top-0 z-20",
253
- children: l.headers.map((t) => {
254
- const r = ae(t);
255
- return /* @__PURE__ */ i(
256
- ve,
257
- {
258
- className: r.className,
259
- style: r.style,
260
- children: t.isPlaceholder ? null : q(
261
- t.column.columnDef.header,
262
- t.getContext()
263
- )
264
- },
265
- t.id
266
- );
235
+ return /* @__PURE__ */ d(
236
+ "div",
237
+ {
238
+ className: O || "",
239
+ style: { width: `${J}px`, overflowX: "auto" },
240
+ children: [
241
+ M && /* @__PURE__ */ r(
242
+ De,
243
+ {
244
+ editable: M,
245
+ editConfirmLabel: ue,
246
+ editCancelLabel: fe,
247
+ editRestoreDefaultLabel: "Ripristina Default",
248
+ editMode: V,
249
+ setEditMode: ge,
250
+ editedCount: Object.keys(S).length,
251
+ defaultCount: Object.keys(p).length,
252
+ restoreDefault: () => {
253
+ if (z) {
254
+ const t = Object.entries(p).map(
255
+ ([o, { value: n, cell: s }]) => ({
256
+ fromId: s.fromId,
257
+ toId: s.toId,
258
+ id: s.id,
259
+ value: n
260
+ })
261
+ );
262
+ z({
263
+ editedCells: [],
264
+ toDefaultCells: t
265
+ });
266
+ }
267
+ x({});
268
+ },
269
+ confirmAll: () => {
270
+ if (z && (Object.keys(S).length > 0 || Object.keys(p).length > 0)) {
271
+ const e = Object.entries(S).map(
272
+ ([s, { value: i, cell: a }]) => ({
273
+ fromId: a.fromId,
274
+ toId: a.toId,
275
+ id: a.id,
276
+ value: i
277
+ })
278
+ ), o = Object.entries(p).map(
279
+ ([s, { value: i, cell: a }]) => ({
280
+ fromId: a.fromId,
281
+ toId: a.toId,
282
+ id: a.id,
283
+ value: i
267
284
  })
268
- },
269
- l.id
270
- ))
285
+ );
286
+ z({
287
+ editedCells: e,
288
+ toDefaultCells: o
289
+ });
290
+ }
291
+ N({}), x({});
292
+ },
293
+ cancelAll: () => {
294
+ N({}), x({});
271
295
  }
272
- ),
273
- /* @__PURE__ */ i(
274
- ye,
275
- {
276
- style: {
277
- height: `${U.getTotalSize()}px`,
278
- position: "relative",
279
- width: "100%"
280
- },
281
- children: U.getVirtualItems().map((l) => {
282
- const t = R.getRowModel().rows[l.index];
283
- return /* @__PURE__ */ i(
284
- _,
285
- {
286
- "data-index": l.index,
287
- style: {
288
- position: "absolute",
289
- top: 0,
290
- left: 0,
291
- transform: `translateY(${l.start}px)`,
292
- width: "100%",
293
- height: `${l.size}px`,
294
- display: "flex"
295
- },
296
- children: t.getVisibleCells().map((r, e) => {
297
- const n = e === 0, o = r.getValue(), s = n ? "var(--d-secondary)" : (o == null ? void 0 : o.color) || "transparent";
298
- return /* @__PURE__ */ i(
299
- J,
296
+ }
297
+ ),
298
+ /* @__PURE__ */ r(
299
+ "div",
300
+ {
301
+ ref: Z,
302
+ className: "max-h-[600px] overflow-auto rounded-md border",
303
+ children: /* @__PURE__ */ d(
304
+ Ke,
305
+ {
306
+ className: "relative table-fixed border-collapse",
307
+ style: { width: `${J}px` },
308
+ children: [
309
+ /* @__PURE__ */ r(
310
+ Le,
311
+ {
312
+ className: "bg-d-secondary sticky top-0 z-20",
313
+ style: { boxShadow: "0 1px 0 0 var(--d-border)" },
314
+ children: _.getHeaderGroups().map((t) => /* @__PURE__ */ r(
315
+ q,
300
316
  {
301
- className: `text-center ${n ? "sticky left-0 z-10" : "border-r"}`,
302
- style: {
303
- boxShadow: n ? "inset -1px 0 0 0 var(--d-border)" : "none",
304
- backgroundColor: s,
305
- width: `${E}px`,
306
- flex: n ? "0 0 auto" : `1 0 ${E}px`,
307
- display: "flex",
308
- alignItems: "center",
309
- justifyContent: "center"
310
- },
311
- children: n || !I || !o ? (
312
- // Rendering normale per la prima colonna o quando non siamo in modalità edit
313
- q(
314
- r.column.columnDef.cell,
315
- r.getContext()
316
- )
317
- ) : (
318
- // Rendering con EditableInput per le celle modificabili
319
- (() => {
320
- const f = `${t.index}-${r.column.id}`, de = f in v ? v[f].value : o.value || "";
321
- return /* @__PURE__ */ i(
322
- he,
317
+ className: "bg-d-secondary sticky top-0 z-20",
318
+ children: t.headers.map((e) => {
319
+ const o = ze(e);
320
+ return /* @__PURE__ */ r(
321
+ Me,
322
+ {
323
+ className: o.className,
324
+ style: o.style,
325
+ children: e.isPlaceholder ? null : re(
326
+ e.column.columnDef.header,
327
+ e.getContext()
328
+ )
329
+ },
330
+ e.id
331
+ );
332
+ })
333
+ },
334
+ t.id
335
+ ))
336
+ }
337
+ ),
338
+ /* @__PURE__ */ r(
339
+ Pe,
340
+ {
341
+ style: {
342
+ height: `${H.getTotalSize()}px`,
343
+ position: "relative",
344
+ width: "100%"
345
+ },
346
+ children: H.getVirtualItems().map((t) => {
347
+ const e = _.getRowModel().rows[t.index];
348
+ return /* @__PURE__ */ r(
349
+ q,
350
+ {
351
+ "data-index": t.index,
352
+ style: {
353
+ position: "absolute",
354
+ top: 0,
355
+ left: 0,
356
+ transform: `translateY(${t.start}px)`,
357
+ width: "100%",
358
+ height: `${t.size}px`,
359
+ display: "flex"
360
+ },
361
+ children: e.getVisibleCells().map((o, n) => {
362
+ const s = n === 0, i = o.getValue(), a = s ? "var(--d-secondary)" : (i == null ? void 0 : i.color) || "transparent";
363
+ return /* @__PURE__ */ r(
364
+ se,
323
365
  {
324
- value: de,
325
- originalValue: o.value || "",
326
- cellKey: f,
327
- cellData: o,
328
- isMarkedForReset: f in y,
329
- onChange: (C, S) => {
330
- j((p) => ({
331
- ...p,
332
- [C]: { value: S, cell: o }
333
- }));
334
- },
335
- resetCell: (C) => {
336
- j((S) => {
337
- const p = { ...S };
338
- return delete p[C], p;
339
- });
366
+ className: `text-center ${s ? "sticky left-0 z-10" : "border-r"}`,
367
+ style: {
368
+ boxShadow: s ? "inset -1px 0 0 0 var(--d-border)" : "none",
369
+ backgroundColor: a,
370
+ width: `${L}px`,
371
+ flex: s ? "0 0 auto" : `1 0 ${L}px`,
372
+ display: "flex",
373
+ alignItems: "center",
374
+ justifyContent: "center"
340
375
  },
341
- resetToDefault: (C, S, p) => {
342
- k((ue) => ({
343
- ...ue,
344
- [C]: { value: S, cell: p }
345
- }));
346
- }
347
- }
376
+ children: s || !V || !i ? (
377
+ // Rendering normale per la prima colonna o quando non siamo in modalità edit
378
+ re(
379
+ o.column.columnDef.cell,
380
+ o.getContext()
381
+ )
382
+ ) : (
383
+ // Rendering con cella modificabile
384
+ (() => {
385
+ const g = `${e.index}-${o.column.id}`, E = g in S ? S[g].value : i.value || "", Ve = E !== i.value, ne = g in p;
386
+ return /* @__PURE__ */ r(
387
+ "div",
388
+ {
389
+ className: "flex w-full cursor-pointer items-center justify-center",
390
+ onClick: (je) => {
391
+ const le = je.currentTarget.getBoundingClientRect();
392
+ ve({
393
+ cellKey: g,
394
+ value: E,
395
+ originalValue: i.value || "",
396
+ cellData: i,
397
+ position: {
398
+ top: le.bottom + window.scrollY + 5,
399
+ left: le.left + window.scrollX
400
+ }
401
+ }), T(E), y(!0);
402
+ },
403
+ children: /* @__PURE__ */ d("div", { className: "relative w-full flex-1 items-center justify-center text-center", children: [
404
+ E || "",
405
+ Ve && !ne && /* @__PURE__ */ r(
406
+ "div",
407
+ {
408
+ className: "bg-d-primary absolute top-0 left-0 rounded p-1",
409
+ title: "Valore modificato"
410
+ }
411
+ ),
412
+ ne && /* @__PURE__ */ r(
413
+ "div",
414
+ {
415
+ className: "bg-d-destructive absolute top-0 right-0 rounded p-1",
416
+ title: "Ripristino richiesto"
417
+ }
418
+ ),
419
+ /* @__PURE__ */ r("span", { className: "text-d-muted-foreground ml-1 inline-flex items-center", children: /* @__PURE__ */ r(
420
+ U,
421
+ {
422
+ name: "Pencil",
423
+ size: "sm",
424
+ className: "h-3 w-3"
425
+ }
426
+ ) })
427
+ ] })
428
+ }
429
+ );
430
+ })()
431
+ )
432
+ },
433
+ o.id
348
434
  );
349
- })()
350
- )
351
- },
352
- r.id
353
- );
354
- })
355
- },
356
- t.id
357
- );
358
- })
435
+ })
436
+ },
437
+ e.id
438
+ );
439
+ })
440
+ }
441
+ )
442
+ ]
443
+ }
444
+ )
445
+ }
446
+ ),
447
+ /* @__PURE__ */ d($e, { open: xe, onOpenChange: ye, children: [
448
+ /* @__PURE__ */ r(Oe, { asChild: !0, children: /* @__PURE__ */ r("div", { style: { display: "none" } }) }),
449
+ /* @__PURE__ */ r(
450
+ Ae,
451
+ {
452
+ className: "w-[400px] p-4",
453
+ style: {
454
+ position: l != null && l.position ? "absolute" : "fixed",
455
+ top: (ee = l == null ? void 0 : l.position) != null && ee.top ? `${l.position.top}px` : "50%",
456
+ left: (te = l == null ? void 0 : l.position) != null && te.left ? `${l.position.left}px` : "50%",
457
+ transform: l != null && l.position ? "none" : "translate(-50%, -50%)"
458
+ },
459
+ children: /* @__PURE__ */ d("div", { className: "space-y-4", children: [
460
+ /* @__PURE__ */ d("div", { className: "flex items-center justify-between", children: [
461
+ /* @__PURE__ */ r("div", { className: "font-medium", children: "Modifica valore" }),
462
+ l && l.value !== l.originalValue && /* @__PURE__ */ r("div", { className: "text-d-muted-foreground text-xs", children: "Valore modificato" })
463
+ ] }),
464
+ /* @__PURE__ */ r(
465
+ "input",
466
+ {
467
+ type: "text",
468
+ className: "bg-d-secondary w-full rounded border p-2",
469
+ value: R || "",
470
+ onChange: Se,
471
+ autoFocus: !0
472
+ }
473
+ ),
474
+ /* @__PURE__ */ d("div", { className: "flex items-center justify-between", children: [
475
+ /* @__PURE__ */ d(
476
+ k,
477
+ {
478
+ variant: "destructive",
479
+ size: "sm",
480
+ onClick: Ce,
481
+ className: "text-xs",
482
+ title: "Ripristina il valore originale e segna la cella come da ripristinare",
483
+ children: [
484
+ /* @__PURE__ */ r(U, { name: "RotateCcw", className: "mr-1 h-3 w-3" }),
485
+ "Ripristina"
486
+ ]
487
+ }
488
+ ),
489
+ /* @__PURE__ */ d("div", { className: "flex space-x-2", children: [
490
+ /* @__PURE__ */ r(
491
+ k,
492
+ {
493
+ variant: "ghost",
494
+ size: "sm",
495
+ onClick: we,
496
+ className: "text-xs",
497
+ title: "Annulla le modifiche correnti e chiudi",
498
+ children: "Annulla"
499
+ }
500
+ ),
501
+ /* @__PURE__ */ d(
502
+ k,
503
+ {
504
+ size: "sm",
505
+ onClick: be,
506
+ className: "text-xs",
507
+ title: "Conferma le modifiche e salva",
508
+ children: [
509
+ /* @__PURE__ */ r(U, { name: "Check", className: "mr-1 h-3 w-3" }),
510
+ "Conferma"
511
+ ]
512
+ }
513
+ )
514
+ ] })
515
+ ] })
516
+ ] })
359
517
  }
360
518
  )
361
519
  ] })
362
- }
363
- )
364
- ] });
520
+ ]
521
+ }
522
+ );
365
523
  }
366
524
  export {
367
- Ae as DataCrossTable
525
+ nt as DataCrossTable
368
526
  };