@shifl-inc/ui 0.2.0 → 0.3.0

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 (7) hide show
  1. package/dist/composables/useGridActionMenu.d.ts +1 -1
  2. package/dist/composables/useGridColumns.d.ts +3 -0
  3. package/dist/shifl-ui.js +490 -471
  4. package/dist/shifl-ui.umd +8 -4
  5. package/dist/style.css +1 -1
  6. package/dist/types/grid.d.ts +1 -0
  7. package/package.json +3 -2
package/dist/shifl-ui.js CHANGED
@@ -1,6 +1,6 @@
1
- import { ref as k, computed as v, onMounted as X, onUnmounted as q, defineComponent as _e, createElementBlock as a, openBlock as s, withModifiers as B, createElementVNode as u, createCommentVNode as P, createTextVNode as O, toDisplayString as b, Fragment as M, renderList as z, normalizeClass as V, watch as Y, nextTick as Pe, createBlock as R, Teleport as me, normalizeStyle as G, createVNode as he, unref as S, resolveDynamicComponent as pe, createStaticVNode as gt, provide as ht, inject as pt } from "vue";
2
- function vt(r) {
3
- const c = (r.columns || []).map((l) => ({
1
+ import { ref as y, computed as v, onMounted as U, onUnmounted as X, defineComponent as _e, createElementBlock as a, openBlock as s, withModifiers as B, createElementVNode as c, createCommentVNode as T, createTextVNode as F, toDisplayString as k, Fragment as x, renderList as z, normalizeClass as R, watch as J, nextTick as Ae, createBlock as V, Teleport as me, normalizeStyle as Z, createVNode as he, unref as P, resolveDynamicComponent as pe, createStaticVNode as pt, provide as vt, inject as mt } from "vue";
2
+ function _t(r) {
3
+ const f = (r.columns || []).map((l) => ({
4
4
  ...l,
5
5
  frozen: l.frozen ?? l.fixed ?? !1,
6
6
  visible: l.visible ?? !0,
@@ -8,7 +8,7 @@ function vt(r) {
8
8
  }));
9
9
  return {
10
10
  ...r,
11
- columns: c,
11
+ columns: f,
12
12
  rows: r.rows ?? [],
13
13
  search: r.search ?? [],
14
14
  filters: r.filters ?? [],
@@ -23,93 +23,94 @@ function vt(r) {
23
23
  } : void 0
24
24
  };
25
25
  }
26
- function mt(r) {
27
- const c = [...r], l = k([...r]);
28
- function m(h) {
26
+ function Ct(r) {
27
+ const f = [...r], l = y([...r]);
28
+ function m(d) {
29
29
  l.value = l.value.map(
30
- (f) => f.key === h ? { ...f, visible: !f.visible } : f
30
+ (u) => u.key === d ? { ...u, visible: !u.visible } : u
31
31
  );
32
32
  }
33
- function d(h) {
34
- l.value = l.value.map((f) => ({ ...f, visible: h }));
33
+ function g(d) {
34
+ l.value = l.value.map((u) => ({ ...u, visible: d }));
35
35
  }
36
- function _(h) {
37
- const f = l.value.map(
38
- (C) => C.key === h ? { ...C, frozen: !C.frozen } : C
39
- ), g = f.filter((C) => C.frozen), L = f.filter((C) => !C.frozen);
40
- l.value = [...g, ...L];
36
+ function _(d) {
37
+ const u = l.value.map(
38
+ (C) => C.key === d ? { ...C, frozen: !C.frozen } : C
39
+ ), h = u.filter((C) => C.frozen), S = u.filter((C) => !C.frozen);
40
+ l.value = [...h, ...S];
41
41
  }
42
- function T(h, f) {
43
- if (h === f || f < 0 || f >= l.value.length) return;
44
- const g = l.value.findIndex((J) => !J.frozen), L = g === -1 ? l.value.length : g;
45
- if (h < L || f < L) return;
46
- const C = [...l.value], [H] = C.splice(h, 1);
47
- C.splice(f, 0, H), l.value = C;
42
+ function b(d, u) {
43
+ if (d === u || u < 0 || u >= l.value.length) return;
44
+ const h = l.value.findIndex((N) => !N.frozen), S = h === -1 ? l.value.length : h;
45
+ if (d < S || u < S) return;
46
+ const C = [...l.value], [H] = C.splice(d, 1);
47
+ C.splice(u, 0, H), l.value = C;
48
48
  }
49
- function y() {
50
- l.value = [...c];
49
+ function w() {
50
+ l.value = [...f];
51
51
  }
52
- const x = v(() => l.value.filter((h) => h.visible));
52
+ const L = v(() => l.value.filter((d) => d.visible));
53
53
  return {
54
54
  columns: l,
55
- visibleColumns: x,
55
+ visibleColumns: L,
56
56
  toggleColumnVisibility: m,
57
- setAllVisible: d,
57
+ setAllVisible: g,
58
58
  toggleFrozen: _,
59
- moveColumn: T,
60
- resetColumns: y
59
+ moveColumn: b,
60
+ resetColumns: w
61
61
  };
62
62
  }
63
- function _t(r) {
64
- const c = k(r);
65
- function l(d) {
63
+ function yt(r) {
64
+ const f = y(r);
65
+ function l(g) {
66
66
  var _;
67
- c.value = ((_ = c.value) == null ? void 0 : _.key) === d && c.value.order === "asc" ? { key: d, order: "desc" } : { key: d, order: "asc" };
67
+ f.value = ((_ = f.value) == null ? void 0 : _.key) === g && f.value.order === "asc" ? { key: g, order: "desc" } : { key: g, order: "asc" };
68
68
  }
69
- function m(d) {
70
- if (!c.value) return d;
71
- const { key: _, order: T } = c.value;
72
- return [...d].sort((y, x) => {
73
- const h = y[_], f = x[_];
74
- if (h === f) return 0;
75
- if (h == null) return 1;
76
- if (f == null) return -1;
77
- const g = String(h).localeCompare(String(f), void 0, {
69
+ function m(g) {
70
+ if (!f.value) return g;
71
+ const { key: _, order: b } = f.value;
72
+ return [...g].sort((w, L) => {
73
+ const d = w[_], u = L[_];
74
+ if (d === u) return 0;
75
+ if (d == null) return 1;
76
+ if (u == null) return -1;
77
+ const h = String(d).localeCompare(String(u), void 0, {
78
78
  numeric: !0
79
79
  });
80
- return T === "asc" ? g : -g;
80
+ return b === "asc" ? h : -h;
81
81
  });
82
82
  }
83
83
  return {
84
- sort: c,
84
+ sort: f,
85
85
  setSort: l,
86
86
  applySort: m
87
87
  };
88
88
  }
89
- function Ct() {
90
- function r(c, l, m) {
91
- const d = (m || "").trim().toLowerCase();
92
- return d ? c.filter((_) => (l && l.length ? l.map((y) => _[y]) : Object.values(_)).some(
93
- (y) => String(y ?? "").toLowerCase().includes(d)
94
- )) : c;
89
+ function kt() {
90
+ function r(f, l, m) {
91
+ const g = (m || "").trim().toLowerCase();
92
+ return g ? f.filter((_) => (l && l.length ? l.map((w) => _[w]) : Object.values(_)).some(
93
+ (w) => String(w ?? "").toLowerCase().includes(g)
94
+ )) : f;
95
95
  }
96
96
  return {
97
97
  applyGlobalFilter: r
98
98
  };
99
99
  }
100
- function yt() {
101
- const r = k({
100
+ function bt() {
101
+ const r = y({
102
102
  rowIndex: null,
103
103
  position: null
104
104
  });
105
- function c(_, T) {
106
- const y = T.getBoundingClientRect();
107
- r.value = {
105
+ function f(_, b, w = 200) {
106
+ const L = b.getBoundingClientRect();
107
+ let d = L.left;
108
+ d + w > window.innerWidth - 8 && (d = window.innerWidth - w + 8), r.value = {
108
109
  rowIndex: _,
109
110
  position: {
110
- top: y.bottom + 4,
111
- // 4px gap below icon
112
- left: y.left
111
+ top: L.bottom,
112
+ // 4px below trigger
113
+ left: d
113
114
  }
114
115
  };
115
116
  }
@@ -122,143 +123,145 @@ function yt() {
122
123
  function m(_) {
123
124
  return r.value.rowIndex === _;
124
125
  }
125
- function d(_) {
126
+ function g(_) {
126
127
  _.key === "Escape" && r.value.rowIndex !== null && l();
127
128
  }
128
- return X(() => {
129
- document.addEventListener("keydown", d);
130
- }), q(() => {
131
- document.removeEventListener("keydown", d);
129
+ return U(() => {
130
+ document.addEventListener("keydown", g);
131
+ }), X(() => {
132
+ document.removeEventListener("keydown", g);
132
133
  }), {
133
134
  menuState: r,
134
- openMenu: c,
135
+ openMenu: f,
135
136
  closeMenu: l,
136
137
  isMenuOpen: m
137
138
  };
138
139
  }
139
- const kt = { class: "shifl-column-manager__header" }, bt = { class: "shifl-column-manager__title-wrapper" }, wt = { class: "shifl-column-manager__title" }, Mt = { key: 0 }, Tt = { class: "shifl-column-manager__controls" }, $t = { class: "shifl-column-manager__controls-left" }, xt = { class: "shifl-column-manager__content" }, Lt = { class: "shifl-column-manager__list" }, St = ["draggable", "onDragstart", "onDragover", "onDrop"], Pt = ["aria-label", "disabled"], At = ["checked", "disabled", "onChange"], zt = { class: "shifl-column-manager__label-text" }, Ht = { class: "shifl-column-manager__footer" }, Rt = /* @__PURE__ */ _e({
140
+ const wt = { class: "shifl-column-manager__header" }, Mt = { class: "shifl-column-manager__title-wrapper" }, xt = { class: "shifl-column-manager__title" }, $t = { key: 0 }, Tt = { key: 1 }, Lt = { class: "shifl-column-manager__controls" }, St = { class: "shifl-column-manager__controls-left" }, Pt = { class: "shifl-column-manager__content" }, At = { class: "shifl-column-manager__list" }, zt = ["draggable", "onDragstart", "onDragover", "onDrop"], Ht = ["aria-label", "disabled"], Rt = ["checked", "disabled", "onChange"], Vt = { class: "shifl-column-manager__label-text" }, Et = { class: "shifl-column-manager__footer" }, Dt = /* @__PURE__ */ _e({
140
141
  __name: "GridColumnManager",
141
142
  props: {
142
143
  titlePrefix: {},
143
144
  columns: {}
144
145
  },
145
146
  emits: ["close", "toggle", "move", "toggleFrozen", "selectAll", "deselectAll", "restoreDefault"],
146
- setup(r, { emit: c }) {
147
- const l = r, m = v(() => l.columns), d = c, _ = k(null);
148
- function T(h) {
149
- var f, g;
150
- (f = l.columns[h]) != null && f.frozen || (g = l.columns[h]) != null && g.protected || (_.value = h);
147
+ setup(r, { emit: f }) {
148
+ const l = r, m = v(() => l.columns), g = f, _ = y(null);
149
+ function b(d) {
150
+ var u, h;
151
+ (u = l.columns[d]) != null && u.frozen || (h = l.columns[d]) != null && h.protected || (_.value = d);
151
152
  }
152
- function y(h) {
153
+ function w(d) {
153
154
  }
154
- function x(h) {
155
- _.value === null || _.value === h || (d("move", _.value, h), _.value = null);
155
+ function L(d) {
156
+ _.value === null || _.value === d || (g("move", _.value, d), _.value = null);
156
157
  }
157
- return (h, f) => (s(), a("div", {
158
+ return (d, u) => (s(), a("div", {
158
159
  class: "shifl-column-manager__backdrop",
159
- onClick: f[7] || (f[7] = B((g) => h.$emit("close"), ["self"]))
160
+ onClick: u[7] || (u[7] = B((h) => d.$emit("close"), ["self"]))
160
161
  }, [
161
- u("div", {
162
+ c("div", {
162
163
  class: "shifl-column-manager__dialog",
163
164
  role: "dialog",
164
165
  "aria-modal": "true",
165
- onClick: f[6] || (f[6] = B(() => {
166
+ onClick: u[6] || (u[6] = B(() => {
166
167
  }, ["stop"]))
167
168
  }, [
168
- u("header", kt, [
169
- u("div", bt, [
170
- u("h2", wt, [
171
- r.titlePrefix ? (s(), a("span", Mt, b(r.titlePrefix) + " > ", 1)) : P("", !0),
172
- f[8] || (f[8] = O("Edit Columns ", -1))
169
+ c("header", wt, [
170
+ c("div", Mt, [
171
+ c("h2", xt, [
172
+ r.titlePrefix ? (s(), a("span", $t, k(r.titlePrefix), 1)) : T("", !0),
173
+ r.titlePrefix ? (s(), a("span", Tt, ">")) : T("", !0),
174
+ u[8] || (u[8] = F("Edit Columns ", -1))
173
175
  ])
174
176
  ]),
175
- u("button", {
177
+ c("button", {
176
178
  type: "button",
177
179
  class: "shifl-column-manager__close",
178
- onClick: f[0] || (f[0] = (g) => h.$emit("close"))
179
- }, [...f[9] || (f[9] = [
180
- u("span", null, "✕", -1)
180
+ onClick: u[0] || (u[0] = (h) => d.$emit("close"))
181
+ }, [...u[9] || (u[9] = [
182
+ c("span", null, "✕", -1)
181
183
  ])])
182
184
  ]),
183
- u("div", Tt, [
184
- u("div", $t, [
185
- u("button", {
185
+ c("div", Lt, [
186
+ c("div", St, [
187
+ c("button", {
186
188
  type: "button",
187
189
  class: "shifl-column-manager__link-button",
188
- onClick: f[1] || (f[1] = (g) => h.$emit("selectAll"))
190
+ onClick: u[1] || (u[1] = (h) => d.$emit("selectAll"))
189
191
  }, " Select All "),
190
- u("button", {
192
+ c("button", {
191
193
  type: "button",
192
194
  class: "shifl-column-manager__link-button",
193
- onClick: f[2] || (f[2] = (g) => h.$emit("deselectAll"))
195
+ onClick: u[2] || (u[2] = (h) => d.$emit("deselectAll"))
194
196
  }, " Deselect All ")
195
197
  ]),
196
- u("button", {
198
+ c("button", {
197
199
  type: "button",
198
200
  class: "shifl-column-manager__link-button shifl-column-manager__link-button--primary",
199
- onClick: f[3] || (f[3] = (g) => h.$emit("restoreDefault"))
201
+ onClick: u[3] || (u[3] = (h) => d.$emit("restoreDefault"))
200
202
  }, " Restore Default ")
201
203
  ]),
202
- u("div", xt, [
203
- u("ul", Lt, [
204
- (s(!0), a(M, null, z(m.value, (g, L) => (s(), a("li", {
205
- key: g.key,
206
- class: V(["shifl-column-manager__item", {
207
- "shifl-column-manager__item--disabled": g.frozen || g.protected
204
+ c("div", Pt, [
205
+ c("ul", At, [
206
+ (s(!0), a(x, null, z(m.value, (h, S) => (s(), a("li", {
207
+ key: h.key,
208
+ class: R(["shifl-column-manager__item", {
209
+ "shifl-column-manager__item--disabled": h.frozen || h.protected
208
210
  }]),
209
- draggable: !g.frozen && !g.protected,
210
- onDragstart: (C) => T(L),
211
+ draggable: !h.frozen && !h.protected,
212
+ onDragstart: (C) => b(S),
211
213
  onDragover: B((C) => void 0, ["prevent"]),
212
- onDrop: B((C) => x(L), ["prevent"])
214
+ onDrop: B((C) => L(S), ["prevent"])
213
215
  }, [
214
- u("button", {
216
+ c("button", {
215
217
  type: "button",
216
- class: V(["shifl-column-manager__drag-handle", {
217
- "shifl-column-manager__drag-handle--disabled": g.frozen || g.protected
218
+ class: R(["shifl-column-manager__drag-handle", {
219
+ "shifl-column-manager__drag-handle--disabled": h.frozen || h.protected
218
220
  }]),
219
- "aria-label": `Move ${g.label}`,
220
- disabled: g.frozen || g.protected
221
- }, [...f[10] || (f[10] = [
222
- u("span", null, "⋮⋮", -1)
223
- ])], 10, Pt),
224
- u("label", {
225
- class: V(["shifl-column-manager__checkbox-label", {
226
- "shifl-column-manager__checkbox-label--disabled": g.frozen || g.protected
221
+ "aria-label": `Move ${h.label}`,
222
+ disabled: h.frozen || h.protected
223
+ }, [...u[10] || (u[10] = [
224
+ c("span", null, "⋮⋮", -1)
225
+ ])], 10, Ht),
226
+ c("label", {
227
+ class: R(["shifl-column-manager__checkbox-label", {
228
+ "shifl-column-manager__checkbox-label--disabled": h.frozen || h.protected
227
229
  }])
228
230
  }, [
229
- u("input", {
231
+ c("input", {
230
232
  type: "checkbox",
231
233
  class: "shifl-column-manager__checkbox",
232
- checked: g.visible,
233
- disabled: g.frozen || g.protected,
234
- onChange: (C) => h.$emit("toggle", g.key)
235
- }, null, 40, At),
236
- u("span", zt, b(g.label), 1)
234
+ checked: h.visible,
235
+ disabled: h.frozen || h.protected,
236
+ onChange: (C) => d.$emit("toggle", h.key)
237
+ }, null, 40, Rt),
238
+ u[11] || (u[11] = c("span", { class: "shifl-column-manager__checkbox-custom" }, null, -1)),
239
+ c("span", Vt, k(h.label), 1)
237
240
  ], 2)
238
- ], 42, St))), 128))
241
+ ], 42, zt))), 128))
239
242
  ])
240
243
  ]),
241
- u("footer", Ht, [
242
- u("button", {
243
- type: "button",
244
- class: "shifl-column-manager__button shifl-column-manager__button--secondary",
245
- onClick: f[4] || (f[4] = (g) => h.$emit("close"))
246
- }, " Cancel "),
247
- u("button", {
244
+ c("footer", Et, [
245
+ c("button", {
248
246
  type: "button",
249
247
  class: "shifl-column-manager__button shifl-column-manager__button--primary",
250
- onClick: f[5] || (f[5] = (g) => h.$emit("close"))
251
- }, " Update ")
248
+ onClick: u[4] || (u[4] = (h) => d.$emit("close"))
249
+ }, " Update "),
250
+ c("button", {
251
+ type: "button",
252
+ class: "shifl-column-manager__button shifl-column-manager__button--secondary",
253
+ onClick: u[5] || (u[5] = (h) => d.$emit("close"))
254
+ }, " Cancel ")
252
255
  ])
253
256
  ])
254
257
  ]));
255
258
  }
256
- }), D = (r, c) => {
259
+ }), G = (r, f) => {
257
260
  const l = r.__vccOpts || r;
258
- for (const [m, d] of c)
259
- l[m] = d;
261
+ for (const [m, g] of f)
262
+ l[m] = g;
260
263
  return l;
261
- }, Vt = /* @__PURE__ */ D(Rt, [["__scopeId", "data-v-70b33c44"]]), Et = { class: "shifl-grid__tooltip-content" }, Zt = /* @__PURE__ */ _e({
264
+ }, Zt = /* @__PURE__ */ G(Dt, [["__scopeId", "data-v-e57fe743"]]), Gt = { class: "shifl-grid__tooltip-content" }, It = /* @__PURE__ */ _e({
262
265
  __name: "GridTooltip",
263
266
  props: {
264
267
  content: {},
@@ -266,48 +269,56 @@ const kt = { class: "shifl-column-manager__header" }, bt = { class: "shifl-colum
266
269
  triggerElement: {}
267
270
  },
268
271
  setup(r) {
269
- const c = r, l = k(null), m = k({}), d = v(() => c.content.includes(`
270
- `)), _ = v(() => d.value ? c.content.split(`
271
- `).filter((y) => y.trim().length > 0) : []);
272
- function T() {
273
- if (!c.triggerElement || !l.value) return;
274
- const y = c.triggerElement.getBoundingClientRect(), x = l.value.getBoundingClientRect(), h = window.innerWidth, f = window.innerHeight, g = window.scrollX || window.pageXOffset, L = window.scrollY || window.pageYOffset;
275
- let C = y.bottom + L + 8, H = y.left + g;
276
- H + x.width > h + g && (H = h + g - x.width - 16), H < g + 16 && (H = g + 16), C + x.height > f + L && (C = y.top + L - x.height - 8), m.value = {
272
+ const f = r, l = y(null), m = y({}), g = v(() => f.content.includes(`
273
+ `)), _ = v(() => g.value ? f.content.split(`
274
+ `).filter((d) => d.trim().length > 0) : []), b = y("top"), w = y({});
275
+ function L() {
276
+ if (!f.triggerElement || !l.value) return;
277
+ const d = f.triggerElement.getBoundingClientRect(), u = l.value.getBoundingClientRect(), h = window.innerWidth, S = window.innerHeight;
278
+ let C = d.bottom + 8, H = d.left + scrollX;
279
+ H + u.width > h - 16 && (H = h - u.width - 16), H < 16 && (H = 16), C + u.height > S - 16 ? (C = d.top - u.height - 8, b.value = "bottom") : b.value = "top", m.value = {
277
280
  position: "fixed",
278
281
  top: `${C}px`,
279
282
  left: `${H}px`,
280
283
  zIndex: "10000"
281
284
  };
285
+ const N = d.left + d.width / 2 - H;
286
+ w.value = {
287
+ left: `${N}px`
288
+ };
282
289
  }
283
- return Y(
284
- () => c.visible,
285
- async (y) => {
286
- y && (await Pe(), T());
290
+ return J(
291
+ () => f.visible,
292
+ async (d) => {
293
+ d && (await Ae(), L());
287
294
  }
288
- ), X(() => {
289
- c.visible && Pe(() => T());
290
- }), q(() => {
291
- }), (y, x) => (s(), R(me, { to: "body" }, [
295
+ ), U(() => {
296
+ f.visible && Ae(() => L());
297
+ }), X(() => {
298
+ }), (d, u) => (s(), V(me, { to: "body" }, [
292
299
  r.visible ? (s(), a("div", {
293
300
  key: 0,
294
301
  ref_key: "tooltipRef",
295
302
  ref: l,
296
303
  class: "shifl-grid__tooltip",
297
- style: G(m.value)
304
+ style: Z(m.value)
298
305
  }, [
299
- u("div", Et, [
300
- d.value ? (s(!0), a(M, { key: 0 }, z(_.value, (h, f) => (s(), a("div", {
301
- key: f,
306
+ c("div", {
307
+ class: R(["shifl-grid__tooltip-arrow", b.value]),
308
+ style: Z(w.value)
309
+ }, null, 6),
310
+ c("div", Gt, [
311
+ g.value ? (s(!0), a(x, { key: 0 }, z(_.value, (h, S) => (s(), a("div", {
312
+ key: S,
302
313
  class: "shifl-grid__tooltip-line"
303
- }, b(h), 1))), 128)) : (s(), a(M, { key: 1 }, [
304
- O(b(r.content), 1)
314
+ }, k(h), 1))), 128)) : (s(), a(x, { key: 1 }, [
315
+ F(k(r.content), 1)
305
316
  ], 64))
306
317
  ])
307
- ], 4)) : P("", !0)
318
+ ], 4)) : T("", !0)
308
319
  ]));
309
320
  }
310
- }), Dt = /* @__PURE__ */ D(Zt, [["__scopeId", "data-v-601cf0b0"]]), It = {}, Gt = {
321
+ }), Bt = /* @__PURE__ */ G(It, [["__scopeId", "data-v-44347dc9"]]), Nt = {}, Wt = {
311
322
  width: "14",
312
323
  height: "15",
313
324
  viewBox: "0 0 14 15",
@@ -315,24 +326,24 @@ const kt = { class: "shifl-column-manager__header" }, bt = { class: "shifl-colum
315
326
  xmlns: "http://www.w3.org/2000/svg",
316
327
  class: "shifl-smart-tracking-icon"
317
328
  };
318
- function Bt(r, c) {
319
- return s(), a("svg", Gt, [...c[0] || (c[0] = [
320
- u("path", {
329
+ function Ft(r, f) {
330
+ return s(), a("svg", Wt, [...f[0] || (f[0] = [
331
+ c("path", {
321
332
  d: "M1.03223 9.27441C1.22778 9.27445 1.40954 9.32951 1.57812 9.43066L3.86523 10.8594C4.1957 11.0618 4.3916 11.4202 4.3916 11.8047C4.39151 12.189 4.19562 12.5467 3.86523 12.749L1.57812 14.1797C1.41642 14.2806 1.22754 14.334 1.03223 14.334V14.3408C0.465713 14.3408 0.000165713 13.8751 0 13.3086V10.3066C0.000236867 9.74022 0.465756 9.27443 1.03223 9.27441ZM1.01172 13.3018L3.3252 11.8916C3.32796 11.8884 3.3728 11.8374 3.37305 11.8047C3.37305 11.771 3.35218 11.737 3.3252 11.7168L1.03906 10.2871L1.01172 13.3018ZM6.07129 3.37305C6.35041 3.37318 6.5771 3.59977 6.57715 3.87891C6.57715 4.15809 6.35044 4.38463 6.07129 4.38477H5.05957C4.03708 4.38477 3.20433 5.06537 3.2041 5.90234C3.2041 6.73947 4.03694 7.4209 5.05957 7.4209H7.08301C8.66344 7.42096 9.95019 8.55525 9.9502 9.9502C9.95009 11.3451 8.66338 12.4794 7.08301 12.4795H6.07129C5.79202 12.4795 5.56543 12.2529 5.56543 11.9736C5.56548 11.6944 5.79205 11.4678 6.07129 11.4678H7.08301C8.10552 11.4677 8.93739 10.7872 8.9375 9.9502C8.93749 9.11311 8.10558 8.43267 7.08301 8.43262H5.05957C3.47908 8.43262 2.19238 7.29733 2.19238 5.90234C2.19259 4.50751 3.4792 3.37305 5.05957 3.37305H6.07129ZM10.7939 0C12.0694 0.000131868 13.2591 0.779675 13.7549 1.94043C14.6093 3.9666 13.0453 5.42741 11.9033 6.49316L11.8818 6.51367C11.7964 6.59308 11.711 6.67193 11.6289 6.75C11.4057 6.96444 11.1095 7.08195 10.7939 7.08203C10.4783 7.08203 10.1803 6.9642 9.95703 6.74902C9.86266 6.65937 9.76511 6.56666 9.66602 6.47363L9.66016 6.46875C8.53029 5.40836 6.98418 3.95585 7.83203 1.94238C8.32854 0.77953 9.51841 6.29203e-06 10.7939 0ZM10.7939 1.01172C9.91775 1.01173 9.10234 1.54537 8.76367 2.33789C8.22961 3.60525 9.04604 4.50453 10.3525 5.73145L10.4229 5.79688C10.5024 5.87104 10.5804 5.94604 10.6572 6.01953C10.7267 6.08617 10.861 6.08446 10.9277 6.02051L10.9307 6.01758C11.0223 5.93066 11.1172 5.84284 11.2129 5.75391C12.5356 4.51951 13.3612 3.61352 12.8223 2.33594C12.4849 1.54493 11.6691 1.0127 10.793 1.0127L10.7939 1.01172ZM10.7998 2.53027C11.1719 2.53041 11.4734 2.83199 11.4736 3.2041C11.4736 3.57637 11.172 3.87877 10.7998 3.87891C10.4275 3.87882 10.1221 3.57641 10.1221 3.2041C10.1223 2.8319 10.4207 2.53027 10.793 2.53027H10.7998Z",
322
333
  fill: "#05963F"
323
334
  }, null, -1)
324
335
  ])]);
325
336
  }
326
- const Nt = /* @__PURE__ */ D(It, [["render", Bt]]), Ot = {}, Wt = {
337
+ const Ot = /* @__PURE__ */ G(Nt, [["render", Ft]]), jt = {}, Kt = {
327
338
  width: "14",
328
339
  height: "10",
329
340
  viewBox: "0 0 14 10",
330
341
  fill: "none",
331
342
  xmlns: "http://www.w3.org/2000/svg"
332
343
  };
333
- function Ft(r, c) {
334
- return s(), a("svg", Wt, [...c[0] || (c[0] = [
335
- u("path", {
344
+ function qt(r, f) {
345
+ return s(), a("svg", Kt, [...f[0] || (f[0] = [
346
+ c("path", {
336
347
  "fill-rule": "evenodd",
337
348
  "clip-rule": "evenodd",
338
349
  d: "M0 0.666667C0 0.298477 0.314186 2.98023e-08 0.701754 2.98023e-08H4.2807C4.66827 2.98023e-08 4.98246 0.298477 4.98246 0.666667C4.98246 1.03486 4.66827 1.33333 4.2807 1.33333H0.701754C0.314186 1.33333 0 1.03486 0 0.666667ZM10.0301 0.195262C10.3042 -0.0650874 10.7485 -0.0650874 11.0225 0.195262L13.1278 2.19526C13.4018 2.45561 13.4018 2.87772 13.1278 3.13807C12.8537 3.39842 12.4094 3.39842 12.1354 3.13807L11.2281 2.27614V8.66667C11.2281 9.03486 10.9139 9.33333 10.5263 9.33333C10.1387 9.33333 9.82456 9.03486 9.82456 8.66667V2.27614L8.91727 3.13807C8.64322 3.39842 8.19889 3.39842 7.92484 3.13807C7.65079 2.87772 7.65079 2.45561 7.92484 2.19526L10.0301 0.195262ZM0 4.66667C0 4.29848 0.314186 4 0.701754 4H5.61404C6.0016 4 6.31579 4.29848 6.31579 4.66667C6.31579 5.03486 6.0016 5.33333 5.61404 5.33333H0.701754C0.314186 5.33333 0 5.03486 0 4.66667ZM0 8.66667C0 8.29848 0.314186 8 0.701754 8H7.01754C7.40511 8 7.7193 8.29848 7.7193 8.66667C7.7193 9.03486 7.40511 9.33333 7.01754 9.33333H0.701754C0.314186 9.33333 0 9.03486 0 8.66667Z",
@@ -340,82 +351,82 @@ function Ft(r, c) {
340
351
  }, null, -1)
341
352
  ])]);
342
353
  }
343
- const jt = /* @__PURE__ */ D(Ot, [["render", Ft]]), Kt = {}, Yt = {
354
+ const Jt = /* @__PURE__ */ G(jt, [["render", qt]]), Ut = {}, Xt = {
344
355
  width: "14",
345
356
  height: "10",
346
357
  viewBox: "0 0 14 10",
347
358
  fill: "none",
348
359
  xmlns: "http://www.w3.org/2000/svg"
349
360
  };
350
- function Xt(r, c) {
351
- return s(), a("svg", Yt, [...c[0] || (c[0] = [
352
- u("path", {
361
+ function Yt(r, f) {
362
+ return s(), a("svg", Xt, [...f[0] || (f[0] = [
363
+ c("path", {
353
364
  d: "M4.28125 8C4.66872 8.00011 4.98242 8.29887 4.98242 8.66699C4.98242 9.03511 4.66872 9.33387 4.28125 9.33398H0.702148C0.314581 9.33398 8.1338e-07 9.03518 0 8.66699C0 8.2988 0.31458 8 0.702148 8H4.28125ZM10.5264 0C10.9139 0 11.2285 0.298802 11.2285 0.666992V7.05762L12.1357 6.19531C12.4097 5.93519 12.8539 5.93524 13.1279 6.19531C13.402 6.45566 13.402 6.87832 13.1279 7.13867L11.0225 9.13867C10.7484 9.39867 10.3042 9.39886 10.0303 9.13867L7.9248 7.13867C7.65082 6.87834 7.65082 6.45565 7.9248 6.19531C8.19886 5.93496 8.64392 5.93496 8.91797 6.19531L9.8252 7.05762V0.666992C9.8252 0.298891 10.1389 0.000143144 10.5264 0ZM5.61426 4C6.00183 4 6.31641 4.2988 6.31641 4.66699C6.31641 5.03518 6.00183 5.33398 5.61426 5.33398H0.702148C0.314581 5.33398 6.77817e-07 5.03518 0 4.66699C0 4.2988 0.31458 4 0.702148 4H5.61426ZM7.01758 0C7.40515 0 7.71973 0.298802 7.71973 0.666992C7.71973 1.03518 7.40515 1.33398 7.01758 1.33398H0.702148C0.31458 1.33398 5.42254e-07 1.03518 0 0.666992C0 0.298802 0.31458 0 0.702148 0H7.01758Z",
354
365
  fill: "#1A6D9E"
355
366
  }, null, -1)
356
367
  ])]);
357
368
  }
358
- const qt = /* @__PURE__ */ D(Kt, [["render", Xt]]), Jt = {}, Ut = {
369
+ const Qt = /* @__PURE__ */ G(Ut, [["render", Yt]]), en = {}, tn = {
359
370
  width: "21",
360
371
  height: "13",
361
372
  viewBox: "0 0 21 13",
362
373
  fill: "none",
363
374
  xmlns: "http://www.w3.org/2000/svg"
364
375
  };
365
- function Qt(r, c) {
366
- return s(), a("svg", Ut, [...c[0] || (c[0] = [
367
- u("path", {
376
+ function nn(r, f) {
377
+ return s(), a("svg", tn, [...f[0] || (f[0] = [
378
+ c("path", {
368
379
  d: "M19.6426 4.61523C19.9311 4.61524 20.1317 4.90139 20.0342 5.17285L17.499 12.2246C17.4395 12.3899 17.2821 12.5 17.1064 12.5H1.5459C1.35628 12.5 1.19044 12.3719 1.14258 12.1885L0.0136719 7.83887C-0.0548101 7.575 0.14438 7.31738 0.416992 7.31738H12.6016L14.71 4.61523H19.6426ZM3.51465 8.82324C3.11322 8.82324 2.78728 9.15265 2.78711 9.55859C2.78711 9.96468 3.11312 10.2939 3.51465 10.2939C3.9161 10.2938 4.24121 9.96462 4.24121 9.55859C4.24104 9.15271 3.91599 8.82334 3.51465 8.82324ZM7.87695 8.82324C7.47553 8.82324 7.14958 9.15265 7.14941 9.55859C7.14941 9.96468 7.47542 10.2939 7.87695 10.2939C8.27846 10.2939 8.60352 9.96466 8.60352 9.55859C8.60335 9.15267 8.27835 8.82327 7.87695 8.82324ZM12.2393 8.82324C11.8378 8.82324 11.5119 9.15265 11.5117 9.55859C11.5117 9.96468 11.8377 10.2939 12.2393 10.2939C12.6407 10.2938 12.9658 9.96458 12.9658 9.55859C12.9657 9.15275 12.6405 8.82341 12.2393 8.82324ZM10.3291 3.67676C10.5591 3.67679 10.7459 3.86283 10.7461 4.09277V5.46582C10.746 5.69585 10.5591 5.88278 10.3291 5.88281H1.75C1.51993 5.88281 1.33309 5.69587 1.33301 5.46582V4.09277C1.3332 3.86282 1.52 3.67676 1.75 3.67676H10.3291ZM8.91406 0C9.14418 0 9.33105 0.186874 9.33105 0.416992V1.78906C9.33105 2.01918 9.14418 2.20605 8.91406 2.20605H3.2041C2.97398 2.20605 2.78711 2.01918 2.78711 1.78906V0.416992C2.78711 0.186874 2.97398 1.52829e-06 3.2041 0H8.91406Z",
369
380
  fill: "#9CA5B4"
370
381
  }, null, -1)
371
382
  ])]);
372
383
  }
373
- const Ae = /* @__PURE__ */ D(Jt, [["render", Qt]]), en = {}, tn = {
374
- width: "11",
375
- height: "11",
376
- viewBox: "0 0 11 11",
384
+ const ze = /* @__PURE__ */ G(en, [["render", nn]]), on = {}, rn = {
385
+ width: "16",
386
+ height: "16",
387
+ viewBox: "0 0 16 16",
377
388
  fill: "none",
378
389
  xmlns: "http://www.w3.org/2000/svg"
379
390
  };
380
- function nn(r, c) {
381
- return s(), a("svg", tn, [...c[0] || (c[0] = [
382
- u("path", {
383
- d: "M5.39941 0C8.38169 0 10.7997 2.41717 10.7998 5.39941C10.7998 8.38175 8.38175 10.7998 5.39941 10.7998C2.41717 10.7997 0 8.38169 0 5.39941C0.000106094 2.41723 2.41723 0.000105613 5.39941 0ZM5.39941 0.80957C2.86451 0.809676 0.809676 2.86451 0.80957 5.39941C0.80957 7.93441 2.86445 9.98915 5.39941 9.98926C7.93447 9.98926 9.98926 7.93447 9.98926 5.39941C9.98915 2.86445 7.9344 0.80957 5.39941 0.80957ZM5.39746 4.58887C5.60229 4.58873 5.77167 4.74108 5.79883 4.93848L5.80273 4.99414L5.80469 7.96387C5.80483 8.18742 5.6239 8.36885 5.40039 8.36914C5.19539 8.36927 5.02597 8.21716 4.99902 8.01953L4.99512 7.96484L4.99316 4.99414C4.99317 4.77069 5.174 4.58911 5.39746 4.58887ZM5.39941 2.70117C5.6972 2.70117 5.93945 2.94245 5.93945 3.24023C5.93928 3.53787 5.69709 3.7793 5.39941 3.7793C5.10194 3.77906 4.86053 3.53773 4.86035 3.24023C4.86035 2.94259 5.10183 2.70141 5.39941 2.70117Z",
391
+ function sn(r, f) {
392
+ return s(), a("svg", rn, [...f[0] || (f[0] = [
393
+ c("path", {
394
+ d: "M7.99976 0.799561C11.9761 0.799561 15.1998 4.0234 15.2 7.99976C15.2 11.9762 11.9762 15.2 7.99976 15.2C4.0234 15.1998 0.799561 11.9761 0.799561 7.99976C0.799666 4.02346 4.02346 0.799666 7.99976 0.799561ZM7.99976 1.87964C4.61984 1.87974 1.87974 4.61984 1.87964 7.99976C1.87964 11.3798 4.61977 14.1198 7.99976 14.1199C11.3798 14.1199 14.1199 11.3798 14.1199 7.99976C14.1198 4.61977 11.3798 1.87964 7.99976 1.87964ZM7.9978 6.91968C8.27087 6.91973 8.49698 7.12223 8.53296 7.3855L8.53784 7.45874L8.53979 11.4197C8.5399 11.7178 8.29882 11.9595 8.00073 11.9597C7.72754 11.9599 7.50169 11.7572 7.46558 11.4939L7.46069 11.4207L7.45776 7.45972C7.45757 7.16153 7.69962 6.91987 7.9978 6.91968ZM8.00073 4.40112C8.39742 4.40137 8.71923 4.72319 8.71948 5.11987C8.71948 5.51677 8.39757 5.83935 8.00073 5.8396C7.60368 5.8396 7.28101 5.51692 7.28101 5.11987C7.28126 4.72304 7.60384 4.40112 8.00073 4.40112Z",
384
395
  fill: "#69758C"
385
396
  }, null, -1)
386
397
  ])]);
387
398
  }
388
- const on = /* @__PURE__ */ D(en, [["render", nn]]), rn = { class: "shifl-grid relative" }, sn = { class: "shifl-grid__controls" }, ln = { class: "shifl-grid__table" }, an = ["onClick"], un = { class: "shifl-grid__header-content" }, cn = {
399
+ const ln = /* @__PURE__ */ G(on, [["render", sn]]), an = { class: "shifl-grid relative" }, un = { class: "shifl-grid__controls" }, cn = { class: "shifl-grid__table" }, fn = ["onClick"], dn = { class: "shifl-grid__header-content" }, gn = {
389
400
  key: 0,
390
401
  class: "shifl-grid__header-label"
391
- }, fn = {
402
+ }, hn = {
392
403
  key: 1,
393
404
  class: "shifl-grid__sort-icon"
394
- }, dn = { key: 0 }, gn = ["colspan"], hn = {
405
+ }, pn = { key: 0 }, vn = ["colspan"], mn = {
395
406
  key: 0,
396
407
  class: "shifl-grid__smart-tracking-icon"
397
- }, pn = ["onClick"], vn = { key: 0 }, mn = ["innerHTML"], _n = {
408
+ }, _n = ["onClick"], Cn = { key: 0 }, yn = ["innerHTML"], kn = {
398
409
  key: 2,
399
410
  class: "shifl-grid__type-cell"
400
- }, Cn = {
411
+ }, bn = {
401
412
  key: 0,
402
413
  class: "shifl-grid__container-badge"
403
- }, yn = {
414
+ }, wn = {
404
415
  key: 3,
405
416
  class: "shifl-grid__tags-cell"
406
- }, kn = { class: "shifl-grid__tags-wrapper" }, bn = ["onMouseenter"], wn = {
417
+ }, Mn = { class: "shifl-grid__tags-wrapper" }, xn = ["onMouseenter"], $n = {
407
418
  key: 4,
408
419
  class: "shifl-grid__truncated-cell"
409
- }, Mn = ["onMouseenter"], Tn = ["onMouseenter"], $n = {
420
+ }, Tn = ["onMouseenter"], Ln = ["onMouseenter"], Sn = {
410
421
  key: 5,
411
422
  class: "shifl-grid__chips-container"
412
- }, xn = {
423
+ }, Pn = {
413
424
  key: 0,
414
425
  class: "shifl-grid__pagination"
415
- }, Ln = { class: "shifl-grid__pagination-left" }, Sn = { class: "shifl-grid__pagination-range" }, Pn = { class: "shifl-grid__pagination-range-numbers" }, An = { class: "shifl-grid__pagination-right" }, zn = { class: "shifl-grid__pagination-rows" }, Hn = ["value", "disabled"], Rn = { class: "shifl-grid__pagination-nav" }, Vn = ["disabled"], En = { class: "shifl-grid__pagination-pages" }, Zn = ["disabled", "onClick"], Dn = {
426
+ }, An = { class: "shifl-grid__pagination-left" }, zn = { class: "shifl-grid__pagination-range" }, Hn = { class: "shifl-grid__pagination-range-numbers" }, Rn = { class: "shifl-grid__pagination-right" }, Vn = { class: "shifl-grid__pagination-rows" }, En = ["value", "disabled"], Dn = { class: "shifl-grid__pagination-nav" }, Zn = ["disabled"], Gn = { class: "shifl-grid__pagination-pages" }, In = ["disabled", "onClick"], Bn = {
416
427
  key: 1,
417
428
  class: "shifl-grid__pagination-ellipsis"
418
- }, In = ["disabled"], Gn = ["onClick"], Bn = ["innerHTML"], Nn = /* @__PURE__ */ _e({
429
+ }, Nn = ["disabled"], Wn = ["onClick"], Fn = ["innerHTML"], On = 8, jn = /* @__PURE__ */ _e({
419
430
  __name: "ShiflGrid",
420
431
  props: {
421
432
  config: {},
@@ -423,75 +434,75 @@ const on = /* @__PURE__ */ D(en, [["render", nn]]), rn = { class: "shifl-grid re
423
434
  loading: { type: Boolean }
424
435
  },
425
436
  emits: ["action-click", "search-change", "pagination-change"],
426
- setup(r, { emit: c }) {
427
- const l = r, m = c, d = v(() => vt(l.config)), _ = v(() => d.value.columns.filter((e) => !e.smartTrackingColumn)), {
428
- columns: T,
429
- visibleColumns: y,
430
- toggleColumnVisibility: x,
431
- setAllVisible: h,
432
- toggleFrozen: f,
433
- moveColumn: g,
434
- resetColumns: L
435
- } = mt(_.value), { sort: C, setSort: H, applySort: J } = _t(d.value.sort), { applyGlobalFilter: Re } = Ct(), { menuState: E, openMenu: Ve, closeMenu: U } = yt(), Q = k(!1), Ce = k({}), ye = k(null), ke = k(null), ee = k(null), te = k(!1), be = k(""), ne = k(null), Ee = k({});
436
- k({});
437
- const ie = k({});
438
- Y(
439
- () => d.value.columns,
437
+ setup(r, { emit: f }) {
438
+ const l = r, m = f, g = v(() => _t(l.config)), _ = v(() => g.value.columns.filter((e) => !e.smartTrackingColumn)), {
439
+ columns: b,
440
+ visibleColumns: w,
441
+ toggleColumnVisibility: L,
442
+ setAllVisible: d,
443
+ toggleFrozen: u,
444
+ moveColumn: h,
445
+ resetColumns: S
446
+ } = Ct(_.value), { sort: C, setSort: H, applySort: N } = yt(g.value.sort), { applyGlobalFilter: Ve } = kt(), { menuState: E, openMenu: Ee, closeMenu: Y } = bt(), Q = y(!1), Ce = y({}), ye = y(null), ke = y(null), ee = y(null), te = y(!1), be = y(""), ne = y(null), De = y({});
447
+ y({});
448
+ const ie = y({});
449
+ J(
450
+ () => g.value.columns,
440
451
  (e) => {
441
452
  const n = e.filter((t) => !t.smartTrackingColumn);
442
- T.value = [...n];
453
+ b.value = [...n];
443
454
  },
444
455
  { deep: !0 }
445
- ), Y(
446
- () => d.value.sort,
456
+ ), J(
457
+ () => g.value.sort,
447
458
  (e) => {
448
459
  e && (C.value = e);
449
460
  },
450
461
  { deep: !0 }
451
- ), Y(
462
+ ), J(
452
463
  () => l.search,
453
464
  (e, n) => {
454
465
  var t;
455
- if (d.value.searchMode === "server")
466
+ if (g.value.searchMode === "server")
456
467
  m("search-change", e || "");
457
- else if (d.value.searchMode === "client" && e !== n) {
468
+ else if (g.value.searchMode === "client" && e !== n) {
458
469
  const i = ((t = $.value) == null ? void 0 : t.perPage) || 20;
459
470
  m("pagination-change", 1, i);
460
471
  }
461
472
  }
462
473
  );
463
474
  const we = v(() => {
464
- if ((d.value.searchMode || "client") === "server")
465
- return d.value.rows;
475
+ if ((g.value.searchMode || "client") === "server")
476
+ return g.value.rows;
466
477
  const n = l.search || "";
467
- return Re(d.value.rows, d.value.search, n);
478
+ return Ve(g.value.rows, g.value.search, n);
468
479
  }), oe = v(() => {
469
480
  var n;
470
- return (d.value.searchMode || "client") === "client" ? we.value.length : ((n = $.value) == null ? void 0 : n.total) || 0;
471
- }), re = v(() => J(we.value)), Me = v(() => {
472
- if ((d.value.searchMode || "client") === "server")
481
+ return (g.value.searchMode || "client") === "client" ? we.value.length : ((n = $.value) == null ? void 0 : n.total) || 0;
482
+ }), re = v(() => N(we.value)), Me = v(() => {
483
+ if ((g.value.searchMode || "client") === "server")
473
484
  return re.value;
474
485
  const n = $.value;
475
486
  if (!n || !n.show)
476
487
  return re.value;
477
488
  const t = n.perPage || 20, o = ((n.currentPage || 1) - 1) * t, p = o + t;
478
489
  return re.value.slice(o, p);
479
- }), $ = v(() => d.value.paginationMeta), Ze = v(() => {
490
+ }), $ = v(() => g.value.paginationMeta), Ze = v(() => {
480
491
  var e;
481
492
  return ((e = $.value) == null ? void 0 : e.perPage) === 100;
482
- }), De = v(() => {
493
+ }), Ge = v(() => {
483
494
  var e;
484
495
  return ((e = $.value) == null ? void 0 : e.perPage) || 10;
485
- }), Te = v(() => {
496
+ }), xe = v(() => {
486
497
  const e = $.value;
487
498
  if (!e || !e.show)
488
499
  return { from: 0, to: 0 };
489
500
  const n = oe.value, t = e.perPage || 20, i = e.currentPage || 1;
490
- if ((d.value.searchMode || "client") === "server" && e.from !== void 0 && e.to !== void 0)
501
+ if ((g.value.searchMode || "client") === "server" && e.from !== void 0 && e.to !== void 0)
491
502
  return { from: e.from, to: e.to };
492
- const p = (i - 1) * t + 1, w = Math.min(i * t, n);
493
- return n === 0 ? { from: 0, to: 0 } : { from: p, to: w };
494
- }), Z = v(() => {
503
+ const p = (i - 1) * t + 1, M = Math.min(i * t, n);
504
+ return n === 0 ? { from: 0, to: 0 } : { from: p, to: M };
505
+ }), D = v(() => {
495
506
  var e;
496
507
  return ((e = $.value) == null ? void 0 : e.currentPage) || 1;
497
508
  }), se = v(() => {
@@ -501,8 +512,8 @@ const on = /* @__PURE__ */ D(en, [["render", nn]]), rn = { class: "shifl-grid re
501
512
  if (n === 0) return 1;
502
513
  const t = e.perPage || 20, i = Math.ceil(n / t);
503
514
  return Math.max(1, i);
504
- }), $e = v(() => Z.value <= 1), xe = v(() => Z.value >= se.value), Ie = v(() => {
505
- const e = se.value, n = Z.value, t = [];
515
+ }), $e = v(() => D.value <= 1), Te = v(() => D.value >= se.value), Ie = v(() => {
516
+ const e = se.value, n = D.value, t = [];
506
517
  if (e <= 7)
507
518
  for (let i = 1; i <= e; i++)
508
519
  t.push(i);
@@ -522,42 +533,42 @@ const on = /* @__PURE__ */ D(en, [["render", nn]]), rn = { class: "shifl-grid re
522
533
  }
523
534
  return t;
524
535
  });
525
- function Ge(e) {
536
+ function Be(e) {
526
537
  var t;
527
- if (e < 1 || e > se.value || e === Z.value || l.loading) return;
538
+ if (e < 1 || e > se.value || e === D.value || l.loading) return;
528
539
  const n = ((t = $.value) == null ? void 0 : t.perPage) || 20;
529
540
  m("pagination-change", e, n);
530
541
  }
531
- function Be() {
542
+ function Ne() {
532
543
  var n;
533
544
  if ($e.value || l.loading) return;
534
545
  const e = ((n = $.value) == null ? void 0 : n.perPage) || 20;
535
- m("pagination-change", Z.value - 1, e);
546
+ m("pagination-change", D.value - 1, e);
536
547
  }
537
- function Ne() {
548
+ function We() {
538
549
  var n;
539
- if (xe.value || l.loading) return;
550
+ if (Te.value || l.loading) return;
540
551
  const e = ((n = $.value) == null ? void 0 : n.perPage) || 20;
541
- m("pagination-change", Z.value + 1, e);
552
+ m("pagination-change", D.value + 1, e);
542
553
  }
543
- function Oe(e) {
554
+ function Fe(e) {
544
555
  var i;
545
556
  if (l.loading) return;
546
557
  const n = e.target, t = parseInt(n.value, 10);
547
558
  t && t !== (((i = $.value) == null ? void 0 : i.perPage) || 20) && m("pagination-change", 1, t);
548
559
  }
549
- const We = v(() => {
550
- const e = d.value.columns.find((t) => t.smartTrackingColumn);
560
+ const Oe = v(() => {
561
+ const e = g.value.columns.find((t) => t.smartTrackingColumn);
551
562
  if (!(e != null && e.smartTrackingColumn)) return !1;
552
563
  const n = e.smartTrackingColumn.dataKey;
553
- return d.value.rows.some((t) => {
564
+ return g.value.rows.some((t) => {
554
565
  const i = t[n];
555
566
  return i === !0 || i === 1 || i === "true" || i === "1";
556
567
  });
557
- }), le = v(() => d.value.columns.find((e) => e.smartTrackingColumn)), I = v(() => {
568
+ }), le = v(() => g.value.columns.find((e) => e.smartTrackingColumn)), I = v(() => {
558
569
  var t;
559
- const e = y.value.filter((i) => !i.smartTrackingColumn);
560
- if (We.value && le.value) {
570
+ const e = w.value.filter((i) => !i.smartTrackingColumn);
571
+ if (Oe.value && le.value) {
561
572
  const i = {
562
573
  key: "_smart_tracking",
563
574
  label: "",
@@ -575,53 +586,57 @@ const on = /* @__PURE__ */ D(en, [["render", nn]]), rn = { class: "shifl-grid re
575
586
  }
576
587
  const n = e.find((i) => i.key === "ref");
577
588
  return n && (n.frozen = !0, n.protected = !0), e;
578
- }), Fe = v(() => {
589
+ }), je = v(() => {
579
590
  let e = 0;
580
591
  const n = {};
581
592
  for (const t of I.value) {
582
593
  t.frozen && (n[t.key] = e);
583
594
  const i = parseInt(t.width ?? "160", 10);
584
- Number.isNaN(i) || (e += i);
595
+ Number.isNaN(i) || (e += i + On * 2);
585
596
  }
586
597
  return n;
587
- });
588
- function je(e) {
589
- const n = T.value.find((t) => t.key === e);
590
- !(n != null && n.sortable) || F(n) || ge(n) || H(e);
591
- }
598
+ }), Le = y(0);
592
599
  function Ke(e) {
600
+ const n = e.target;
601
+ Le.value = n.scrollLeft;
602
+ }
603
+ function qe(e) {
604
+ const n = b.value.find((t) => t.key === e);
605
+ !(n != null && n.sortable) || j(n) || ge(n) || H(e);
606
+ }
607
+ function Je(e) {
593
608
  return e == null ? "" : typeof e == "object" ? JSON.stringify(e) : String(e);
594
609
  }
595
- function Ye(e) {
596
- return typeof e == "string" && e.toLowerCase() === "ocean", Ae;
610
+ function Ue(e) {
611
+ return typeof e == "string" && e.toLowerCase() === "ocean", ze;
597
612
  }
598
613
  function Xe(e) {
599
614
  const n = e.toLowerCase();
600
615
  return ["supplier", "suppliers", "po", "pos", "product_description"].includes(n);
601
616
  }
602
- function qe(e) {
617
+ function Ye(e) {
603
618
  if (e == null) return "";
604
619
  if (Array.isArray(e)) {
605
620
  if (e.length === 0) return "";
606
621
  const n = e.join(", ");
607
- return Le(n, 45);
622
+ return Se(n, 45);
608
623
  }
609
- return typeof e == "string" ? Le(e, 45) : String(e);
624
+ return typeof e == "string" ? Se(e, 45) : String(e);
610
625
  }
611
- function Le(e, n) {
626
+ function Se(e, n) {
612
627
  return e.length <= n ? e : e.substring(0, n) + "...";
613
628
  }
614
629
  function ae(e) {
615
630
  const n = e.toLowerCase();
616
631
  return ["po", "pos", "supplier", "suppliers", "tag", "tags"].includes(n);
617
632
  }
618
- function Je(e, n) {
633
+ function Qe(e, n) {
619
634
  return e == null || ae(n) ? !1 : Array.isArray(e) ? e.length === 0 ? !1 : e.join(", ").length > 30 : typeof e == "string" ? e.length > 30 : !1;
620
635
  }
621
- function Ue(e) {
636
+ function et(e) {
622
637
  return e == null ? !1 : Array.isArray(e) ? e.length === 0 ? !1 : e.join(", ").length > 45 : typeof e == "string" ? e.length > 45 : !1;
623
638
  }
624
- function Qe(e) {
639
+ function tt(e) {
625
640
  if (e == null) return 0;
626
641
  if (Array.isArray(e)) {
627
642
  if (e.length === 0 || e.join(", ").length <= 45) return 0;
@@ -645,48 +660,48 @@ const on = /* @__PURE__ */ D(en, [["render", nn]]), rn = { class: "shifl-grid re
645
660
  function ce() {
646
661
  te.value = !1, ne.value = null;
647
662
  }
648
- function et(e, n, t) {
649
- t && (Ee.value[`${e}-${n}`] = t);
663
+ function nt(e, n, t) {
664
+ t && (De.value[`${e}-${n}`] = t);
650
665
  }
651
- function W(e) {
666
+ function O(e) {
652
667
  return e == null ? [] : Array.isArray(e) ? e.map((n) => String(n)).filter((n) => n.length > 0) : typeof e == "string" ? e.split(",").map((n) => n.trim()).filter((n) => n.length > 0) : [String(e)];
653
668
  }
654
669
  function fe(e, n, t) {
655
- const i = W(e);
670
+ const i = O(e);
656
671
  if (i.length === 0) return [];
657
672
  const o = `${n}-${t}`;
658
673
  if (ie.value[o])
659
674
  return ie.value[o];
660
- const p = I.value.find((K) => K.key === n), A = (p != null && p.width ? parseInt(p.width) : 200) - 32, N = tt(i, A);
661
- return ie.value[o] = N, N;
675
+ const p = I.value.find((q) => q.key === n), A = (p != null && p.width ? parseInt(p.width) : 200) - 32, W = it(i, A);
676
+ return ie.value[o] = W, W;
662
677
  }
663
- function tt(e, n) {
678
+ function it(e, n) {
664
679
  if (e.length === 0) return [];
665
680
  const t = document.createElement("div");
666
681
  t.style.cssText = "position: absolute; visibility: hidden; display: flex; flex-wrap: nowrap; gap: 6px;", t.className = "shifl-grid__chips-container", document.body.appendChild(t);
667
682
  let i = 0, o = 0;
668
683
  const p = 40;
669
- for (let w = 0; w < e.length; w++) {
684
+ for (let M = 0; M < e.length; M++) {
670
685
  const A = document.createElement("span");
671
- A.className = "shifl-grid__chip shifl-grid__chip--tag", A.textContent = e[w], A.style.cssText = "padding: 4px 8px; border-left: 3px solid; border: 1px solid; background: white; white-space: nowrap;", t.appendChild(A);
672
- const N = A.offsetWidth, K = w > 0 ? 6 : 0, dt = w < e.length - 1;
673
- if (o + K + N + (dt ? p : 0) > n && w > 0) {
686
+ A.className = "shifl-grid__chip shifl-grid__chip--tag", A.textContent = e[M], A.style.cssText = "padding: 4px 8px; border-left: 3px solid; border: 1px solid; background: white; white-space: nowrap;", t.appendChild(A);
687
+ const W = A.offsetWidth, q = M > 0 ? 6 : 0, ht = M < e.length - 1;
688
+ if (o + q + W + (ht ? p : 0) > n && M > 0) {
674
689
  t.removeChild(A);
675
690
  break;
676
691
  }
677
- o += K + N, i++;
692
+ o += q + W, i++;
678
693
  }
679
694
  return document.body.removeChild(t), e.slice(0, i);
680
695
  }
681
- function nt(e, n, t) {
682
- const i = W(e), o = fe(e, n, t);
696
+ function ot(e, n, t) {
697
+ const i = O(e), o = fe(e, n, t);
683
698
  return i.length > o.length;
684
699
  }
685
- function it(e, n, t) {
686
- const i = W(e), o = fe(e, n, t);
700
+ function rt(e, n, t) {
701
+ const i = O(e), o = fe(e, n, t);
687
702
  return i.length - o.length;
688
703
  }
689
- function ot(e) {
704
+ function st(e) {
690
705
  const n = e.toLowerCase(), t = {
691
706
  "high priority": "var(--shifl-color-error-r70)",
692
707
  express: "var(--shifl-color-primary-b80)",
@@ -704,9 +719,9 @@ const on = /* @__PURE__ */ D(en, [["render", nn]]), rn = { class: "shifl-grid re
704
719
  for (const [i, o] of Object.entries(t))
705
720
  if (n.includes(i) || i.includes(n))
706
721
  return o;
707
- return rt(e);
722
+ return lt(e);
708
723
  }
709
- function rt(e) {
724
+ function lt(e) {
710
725
  let n = 0;
711
726
  for (let i = 0; i < e.length; i++)
712
727
  n = e.charCodeAt(i) + ((n << 5) - n);
@@ -723,28 +738,24 @@ const on = /* @__PURE__ */ D(en, [["render", nn]]), rn = { class: "shifl-grid re
723
738
  return t[Math.abs(n) % t.length];
724
739
  }
725
740
  function de(e, n = !0) {
726
- const t = {
741
+ const i = { ...{
727
742
  width: e.width ?? "160px",
728
743
  minWidth: e.width ?? "160px"
729
- };
730
- if (!e.frozen) return t;
731
- const i = Fe.value[e.key] ?? 0;
732
- return {
733
- ...t,
734
- position: "sticky",
735
- left: `${i}px`,
736
- zIndex: n ? 30 : 10,
737
- background: "var(--shifl-color-surface)"
738
- };
744
+ } }, o = Le.value > 0;
745
+ if (e.frozen) {
746
+ const p = je.value[e.key] ?? 0;
747
+ i.position = "sticky", i.left = `${p}px`, i.background = "#ffffff", i.boxShadow = o ? "2px 0 6px rgba(0, 0, 0, 0.12)" : "none", i.zIndex = n ? 40 : 10;
748
+ }
749
+ return n && (i.position = "sticky", i.top = "0px"), i;
739
750
  }
740
- const st = v(() => T.value.filter((e) => !e.smartTrackingColumn));
741
- function F(e) {
751
+ const at = v(() => b.value.filter((e) => !e.smartTrackingColumn));
752
+ function j(e) {
742
753
  return !!e.actionColumn;
743
754
  }
744
755
  function ge(e) {
745
756
  return !!e.smartTrackingColumn;
746
757
  }
747
- function lt(e, n) {
758
+ function ut(e, n) {
748
759
  if (!e.smartTrackingColumn) return !1;
749
760
  const t = e.smartTrackingColumn.dataKey, i = n[t];
750
761
  if (i === !0 || i === 1) return !0;
@@ -754,140 +765,149 @@ const on = /* @__PURE__ */ D(en, [["render", nn]]), rn = { class: "shifl-grid re
754
765
  }
755
766
  return !1;
756
767
  }
757
- function j(e, n) {
768
+ function K(e, n) {
758
769
  if (!e.actionColumn) return null;
759
770
  const t = e.actionColumn.icon;
760
771
  return t ? typeof t == "function" ? t(n) : t : null;
761
772
  }
762
- function at(e, n, t, i) {
773
+ function ct(e, n, t, i) {
763
774
  if (!t.actionColumn) return;
764
775
  const o = i.currentTarget;
765
776
  if (E.value.rowIndex === e) {
766
- U();
777
+ Y();
767
778
  return;
768
779
  }
769
- ke.value = t, ee.value = n, Ve(e, o);
780
+ ke.value = t, ee.value = n, Ee(e, o);
770
781
  }
771
- function ut(e, n) {
782
+ function ft(e, n) {
772
783
  return !(e != null && e.actionColumn) || !n ? [] : (typeof e.actionColumn.actions == "function" ? e.actionColumn.actions(n) : e.actionColumn.actions).filter((i) => i.show ? i.show(n) : !0);
773
784
  }
774
- function ct(e, n, t) {
775
- m("action-click", e.key, n, t), U();
785
+ function dt(e, n, t) {
786
+ m("action-click", e.key, n, t), Y();
776
787
  }
777
- function ft(e, n) {
788
+ function gt(e, n) {
778
789
  n && (Ce.value[e] = n);
779
790
  }
780
- function Se(e) {
791
+ function Pe(e) {
781
792
  if (E.value.rowIndex === null) return;
782
- const n = e.target, t = ye.value, i = Object.values(Ce.value), o = t == null ? void 0 : t.contains(n), p = i.some((w) => w.contains(n));
783
- !o && !p && U();
793
+ const n = e.target, t = ye.value, i = Object.values(Ce.value), o = t == null ? void 0 : t.contains(n), p = i.some((M) => M.contains(n));
794
+ !o && !p && Y();
784
795
  }
785
- return X(() => {
786
- document.addEventListener("click", Se);
787
- }), q(() => {
788
- document.removeEventListener("click", Se);
789
- }), (e, n) => (s(), a("div", rn, [
790
- u("div", sn, [
791
- u("button", {
796
+ return U(() => {
797
+ document.addEventListener("click", Pe);
798
+ }), X(() => {
799
+ document.removeEventListener("click", Pe);
800
+ }), (e, n) => (s(), a("div", an, [
801
+ c("div", un, [
802
+ c("button", {
792
803
  type: "button",
793
804
  class: "shifl-grid__pill-button whitespace-nowrap",
794
805
  onClick: n[0] || (n[0] = (t) => Q.value = !0)
795
- }, " Edit Columns ")
806
+ }, " Edit Column ")
796
807
  ]),
797
- u("div", {
798
- class: V(["shifl-grid__viewport", { "shifl-grid__viewport--scroll": Ze.value }])
808
+ c("div", {
809
+ class: R(["shifl-grid__viewport", { "shifl-grid__viewport--scroll": Ze.value }]),
810
+ onScroll: Ke
799
811
  }, [
800
- u("table", ln, [
801
- u("thead", null, [
802
- u("tr", null, [
803
- (s(!0), a(M, null, z(I.value, (t) => {
812
+ c("table", cn, [
813
+ c("thead", null, [
814
+ c("tr", null, [
815
+ (s(!0), a(x, null, z(I.value, (t) => {
804
816
  var i;
805
817
  return s(), a("th", {
806
818
  key: t.key,
807
- style: G(de(t, !0)),
808
- onClick: () => je(t.key),
809
- class: V(["shifl-grid__header-cell", { "shifl-grid__cell--sticky": t.frozen }])
819
+ style: Z(de(t, !0)),
820
+ onClick: () => qe(t.key),
821
+ class: R([
822
+ "shifl-grid__header-cell",
823
+ `shifl-grid__header-align-${t != null && t.align ? t.align : "left"}`,
824
+ {
825
+ "shifl-grid__cell--sticky": t.frozen,
826
+ "shifl-grid__sortable-col": t.sortable
827
+ }
828
+ ])
810
829
  }, [
811
- u("div", un, [
812
- t.label ? (s(), a("span", cn, b(t.label), 1)) : P("", !0),
813
- ((i = S(C)) == null ? void 0 : i.key) === t.key && !F(t) && !ge(t) ? (s(), a("span", fn, [
814
- S(C).order === "asc" ? (s(), R(jt, { key: 0 })) : (s(), R(qt, { key: 1 }))
815
- ])) : P("", !0)
830
+ c("div", dn, [
831
+ t.label ? (s(), a("span", gn, k(t.label), 1)) : T("", !0),
832
+ ((i = P(C)) == null ? void 0 : i.key) === t.key && !j(t) && !ge(t) ? (s(), a("span", hn, [
833
+ P(C).order === "asc" ? (s(), V(Jt, { key: 0 })) : (s(), V(Qt, { key: 1 }))
834
+ ])) : T("", !0)
816
835
  ])
817
- ], 14, an);
836
+ ], 14, fn);
818
837
  }), 128))
819
838
  ])
820
839
  ]),
821
- u("tbody", null, [
822
- l.loading ? (s(!0), a(M, { key: 0 }, z(De.value, (t) => (s(), a("tr", {
840
+ c("tbody", null, [
841
+ l.loading ? (s(!0), a(x, { key: 0 }, z(Ge.value, (t) => (s(), a("tr", {
823
842
  key: `skeleton-${t}`,
824
843
  class: "shifl-grid__skeleton-row"
825
844
  }, [
826
- (s(!0), a(M, null, z(I.value, (i) => (s(), a("td", {
845
+ (s(!0), a(x, null, z(I.value, (i) => (s(), a("td", {
827
846
  key: i.key,
828
- style: G(de(i, !1)),
829
- class: V({ "shifl-grid__cell--sticky": i.frozen })
847
+ style: Z(de(i, !1)),
848
+ class: R({ "shifl-grid__cell--sticky": i.frozen })
830
849
  }, [...n[5] || (n[5] = [
831
- u("div", { class: "shifl-grid__skeleton-cell" }, null, -1)
850
+ c("div", { class: "shifl-grid__skeleton-cell" }, null, -1)
832
851
  ])], 6))), 128))
833
- ]))), 128)) : (s(), a(M, { key: 1 }, [
834
- Me.value.length ? P("", !0) : (s(), a("tr", dn, [
835
- u("td", {
852
+ ]))), 128)) : (s(), a(x, { key: 1 }, [
853
+ Me.value.length ? T("", !0) : (s(), a("tr", pn, [
854
+ c("td", {
836
855
  colspan: I.value.length,
837
856
  class: "text-center text-gray-500 py-6"
838
- }, " No data ", 8, gn)
857
+ }, " No data ", 8, vn)
839
858
  ])),
840
- (s(!0), a(M, null, z(Me.value, (t, i) => (s(), a("tr", { key: i }, [
841
- (s(!0), a(M, null, z(I.value, (o) => (s(), a("td", {
859
+ (s(!0), a(x, null, z(Me.value, (t, i) => (s(), a("tr", { key: i }, [
860
+ (s(!0), a(x, null, z(I.value, (o) => (s(), a("td", {
842
861
  key: o.key,
843
- style: G(de(o, !1)),
844
- class: V([
862
+ style: Z(de(o, !1)),
863
+ class: R([
845
864
  { "shifl-grid__cell--sticky": o.frozen },
846
- { "shifl-grid__cell--action": F(o) }
865
+ { "shifl-grid__cell--action": j(o) },
866
+ `shifl-grid__cell-align-${o != null && o.align ? o.align : "left"}`
847
867
  ])
848
868
  }, [
849
- ge(o) ? (s(), a(M, { key: 0 }, [
850
- lt(o, t) ? (s(), a("div", hn, [
851
- he(Nt)
852
- ])) : P("", !0)
853
- ], 64)) : F(o) ? (s(), a("button", {
869
+ ge(o) ? (s(), a(x, { key: 0 }, [
870
+ ut(o, t) ? (s(), a("div", mn, [
871
+ he(Ot)
872
+ ])) : T("", !0)
873
+ ], 64)) : j(o) ? (s(), a("button", {
854
874
  key: 1,
855
875
  type: "button",
856
876
  class: "shifl-grid__action-icon",
857
877
  ref_for: !0,
858
- ref: (p) => ft(i, p),
859
- onClick: B((p) => at(i, t, o, p), ["stop"])
878
+ ref: (p) => gt(i, p),
879
+ onClick: B((p) => ct(i, t, o, p), ["stop"])
860
880
  }, [
861
- j(o, t) ? typeof j(o, t) == "string" ? (s(), a("span", {
881
+ K(o, t) ? typeof K(o, t) == "string" ? (s(), a("span", {
862
882
  key: 1,
863
- innerHTML: j(o, t),
883
+ innerHTML: K(o, t),
864
884
  class: "w-4 h-4 inline-block"
865
- }, null, 8, mn)) : (s(), R(pe(j(o, t)), {
885
+ }, null, 8, yn)) : (s(), V(pe(K(o, t)), {
866
886
  key: 2,
867
887
  class: "w-4 h-4"
868
- })) : (s(), a("span", vn, "⋯"))
869
- ], 8, pn)) : o.key.toLowerCase() === "type" ? (s(), a("div", _n, [
870
- (s(), R(pe(Ye(t[o.key])), { class: "shifl-grid__type-icon" })),
871
- t.container_count != null ? (s(), a("span", Cn, " (" + b(t.container_count) + ") ", 1)) : P("", !0)
872
- ])) : o.key.toLowerCase() === "tag" || o.key.toLowerCase() === "tags" ? (s(), a("div", yn, [
873
- u("div", kn, [
874
- u("div", {
888
+ })) : (s(), a("span", Cn, "⋯"))
889
+ ], 8, _n)) : o.key.toLowerCase() === "type" ? (s(), a("div", kn, [
890
+ (s(), V(pe(Ue(t[o.key])), { class: "shifl-grid__type-icon" })),
891
+ t.container_count != null ? (s(), a("span", bn, " (" + k(t.container_count) + ") ", 1)) : T("", !0)
892
+ ])) : o.key.toLowerCase() === "tag" || o.key.toLowerCase() === "tags" ? (s(), a("div", wn, [
893
+ c("div", Mn, [
894
+ c("div", {
875
895
  ref_for: !0,
876
896
  ref: "(el) => setTagsRef(col.key, rowIndex, el as HTMLElement)",
877
897
  class: "shifl-grid__chips-container shifl-grid__chips-container--single-line"
878
898
  }, [
879
- (s(!0), a(M, null, z(fe(
899
+ (s(!0), a(x, null, z(fe(
880
900
  t[o.key],
881
901
  o.key,
882
902
  i
883
- ), (p, w) => (s(), a("span", {
884
- key: w,
903
+ ), (p, M) => (s(), a("span", {
904
+ key: M,
885
905
  class: "shifl-grid__chip shifl-grid__chip--tag",
886
- style: G({ borderLeftColor: ot(p) })
887
- }, b(p), 5))), 128))
906
+ style: Z({ borderLeftColor: st(p) })
907
+ }, k(p), 5))), 128))
888
908
  ], 512)
889
909
  ]),
890
- nt(t[o.key], o.key, i) ? (s(), a("button", {
910
+ ot(t[o.key], o.key, i) ? (s(), a("button", {
891
911
  key: 0,
892
912
  type: "button",
893
913
  class: "shifl-grid__counter-button",
@@ -898,14 +918,14 @@ const on = /* @__PURE__ */ D(en, [["render", nn]]), rn = { class: "shifl-grid re
898
918
  p.currentTarget
899
919
  ),
900
920
  onMouseleave: ce
901
- }, " +" + b(it(t[o.key], o.key, i)), 41, bn)) : P("", !0)
902
- ])) : Xe(o.key) ? (s(), a("div", wn, [
903
- u("span", {
921
+ }, " +" + k(rt(t[o.key], o.key, i)), 41, xn)) : T("", !0)
922
+ ])) : Xe(o.key) ? (s(), a("div", $n, [
923
+ c("span", {
904
924
  class: "shifl-grid__truncated-text",
905
925
  ref_for: !0,
906
- ref: (p) => et(o.key, i, p)
907
- }, b(qe(t[o.key])), 513),
908
- ae(o.key) && Ue(t[o.key]) ? (s(), a("button", {
926
+ ref: (p) => nt(o.key, i, p)
927
+ }, k(Ye(t[o.key])), 513),
928
+ ae(o.key) && et(t[o.key]) ? (s(), a("button", {
909
929
  key: 0,
910
930
  type: "button",
911
931
  class: "shifl-grid__counter-button",
@@ -916,7 +936,7 @@ const on = /* @__PURE__ */ D(en, [["render", nn]]), rn = { class: "shifl-grid re
916
936
  p.currentTarget
917
937
  ),
918
938
  onMouseleave: ce
919
- }, " +" + b(Qe(t[o.key])), 41, Mn)) : !ae(o.key) && Je(t[o.key], o.key) ? (s(), a("button", {
939
+ }, " +" + k(tt(t[o.key])), 41, Tn)) : !ae(o.key) && Qe(t[o.key], o.key) ? (s(), a("button", {
920
940
  key: 1,
921
941
  type: "button",
922
942
  class: "shifl-grid__info-icon-button",
@@ -928,143 +948,142 @@ const on = /* @__PURE__ */ D(en, [["render", nn]]), rn = { class: "shifl-grid re
928
948
  ),
929
949
  onMouseleave: ce
930
950
  }, [
931
- he(on)
932
- ], 40, Tn)) : P("", !0)
933
- ])) : o.key.toLowerCase() === "status" ? (s(), a("div", $n, [
934
- (s(!0), a(M, null, z(W(t[o.key]), (p, w) => (s(), a("span", {
935
- key: w,
936
- class: "shifl-grid__chip"
937
- }, b(p), 1))), 128))
938
- ])) : (s(), a(M, { key: 6 }, [
939
- O(b(Ke(t[o.key])), 1)
951
+ he(ln)
952
+ ], 40, Ln)) : T("", !0)
953
+ ])) : o.key.toLowerCase() === "status" ? (s(), a("div", Sn, [
954
+ (s(!0), a(x, null, z(O(t[o.key]), (p, M) => (s(), a("span", {
955
+ key: M,
956
+ class: "shifl-grid__chip shifl-grid__chip--status"
957
+ }, k(p), 1))), 128))
958
+ ])) : (s(), a(x, { key: 6 }, [
959
+ F(k(Je(t[o.key])), 1)
940
960
  ], 64))
941
961
  ], 6))), 128))
942
962
  ]))), 128))
943
963
  ], 64))
944
964
  ])
945
965
  ])
946
- ], 2),
947
- $.value && $.value.show !== !1 ? (s(), a("div", xn, [
948
- u("div", Ln, [
949
- u("span", Sn, [
950
- n[6] || (n[6] = O(" Showing ", -1)),
951
- u("span", Pn, b(Te.value.from) + "–" + b(Te.value.to), 1),
952
- O(" of " + b(oe.value), 1)
966
+ ], 34),
967
+ $.value && $.value.show !== !1 ? (s(), a("div", Pn, [
968
+ c("div", An, [
969
+ c("span", zn, [
970
+ n[6] || (n[6] = F(" Showing ", -1)),
971
+ c("span", Hn, k(xe.value.from) + "–" + k(xe.value.to), 1),
972
+ F(" of " + k(oe.value), 1)
953
973
  ])
954
974
  ]),
955
- u("div", An, [
956
- u("div", zn, [
957
- n[8] || (n[8] = u("label", { class: "shifl-grid__pagination-label" }, "Rows per page", -1)),
958
- u("select", {
975
+ c("div", Rn, [
976
+ c("div", Vn, [
977
+ n[8] || (n[8] = c("label", { class: "shifl-grid__pagination-label" }, "Row per page", -1)),
978
+ c("select", {
959
979
  value: $.value.perPage || 20,
960
980
  disabled: l.loading,
961
- onChange: Oe,
981
+ onChange: Fe,
962
982
  class: "shifl-grid__pagination-select"
963
983
  }, [...n[7] || (n[7] = [
964
- gt('<option value="20">20</option><option value="30">30</option><option value="50">50</option><option value="75">75</option><option value="100">100</option>', 5)
965
- ])], 40, Hn)
984
+ pt('<option value="20">20</option><option value="30">30</option><option value="50">50</option><option value="75">75</option><option value="100">100</option>', 5)
985
+ ])], 40, En)
966
986
  ]),
967
- u("div", Rn, [
968
- u("button", {
987
+ c("div", Dn, [
988
+ c("button", {
969
989
  type: "button",
970
990
  class: "shifl-grid__pagination-button",
971
991
  disabled: $e.value || l.loading,
972
- onClick: Be,
992
+ onClick: Ne,
973
993
  "aria-label": "Previous page"
974
- }, " ‹ ", 8, Vn),
975
- u("div", En, [
976
- (s(!0), a(M, null, z(Ie.value, (t) => (s(), a(M, { key: t }, [
994
+ }, " ‹ ", 8, Zn),
995
+ c("div", Gn, [
996
+ (s(!0), a(x, null, z(Ie.value, (t) => (s(), a(x, { key: t }, [
977
997
  t !== -1 ? (s(), a("button", {
978
998
  key: 0,
979
999
  type: "button",
980
- class: V(["shifl-grid__pagination-page", { "shifl-grid__pagination-page--active": t === Z.value }]),
1000
+ class: R(["shifl-grid__pagination-page", { "shifl-grid__pagination-page--active": t === D.value }]),
981
1001
  disabled: l.loading,
982
- onClick: (i) => Ge(t)
983
- }, b(t), 11, Zn)) : (s(), a("span", Dn, "…"))
1002
+ onClick: (i) => Be(t)
1003
+ }, k(t), 11, In)) : (s(), a("span", Bn, "…"))
984
1004
  ], 64))), 128))
985
1005
  ]),
986
- u("button", {
1006
+ c("button", {
987
1007
  type: "button",
988
1008
  class: "shifl-grid__pagination-button",
989
- disabled: xe.value || l.loading,
990
- onClick: Ne,
1009
+ disabled: Te.value || l.loading,
1010
+ onClick: We,
991
1011
  "aria-label": "Next page"
992
- }, " › ", 8, In)
1012
+ }, " › ", 8, Nn)
993
1013
  ])
994
1014
  ])
995
- ])) : P("", !0),
996
- (s(), R(me, { to: "body" }, [
997
- S(E).rowIndex !== null && S(E).position ? (s(), a("div", {
1015
+ ])) : T("", !0),
1016
+ (s(), V(me, { to: "body" }, [
1017
+ P(E).rowIndex !== null && P(E).position ? (s(), a("div", {
998
1018
  key: 0,
999
1019
  ref_key: "actionMenuRef",
1000
1020
  ref: ye,
1001
1021
  class: "shifl-grid__action-menu",
1002
- style: G({
1003
- position: "fixed",
1004
- top: `${S(E).position.top}px`,
1005
- left: `${S(E).position.left}px`,
1006
- zIndex: 1e3
1007
- }),
1022
+ style: Z(`
1023
+ position: fixed !important;
1024
+ top: ${P(E).position.top}px !important;
1025
+ left: ${P(E).position.left}px !important;
1026
+ z-index: 1000 !important;`),
1008
1027
  onClick: n[1] || (n[1] = B(() => {
1009
1028
  }, ["stop"]))
1010
1029
  }, [
1011
- (s(!0), a(M, null, z(ut(ke.value, ee.value), (t) => (s(), a("div", {
1030
+ (s(!0), a(x, null, z(ft(ke.value, ee.value), (t) => (s(), a("div", {
1012
1031
  key: t.key,
1013
- class: V(["shifl-grid__action-menu-item", { "shifl-grid__action-menu-item--danger": t.danger }]),
1014
- onClick: () => ct(t, ee.value, S(E).rowIndex)
1032
+ class: R(["shifl-grid__action-menu-item", { "shifl-grid__action-menu-item--danger": t.danger }]),
1033
+ onClick: () => dt(t, ee.value, P(E).rowIndex)
1015
1034
  }, [
1016
1035
  t.icon && typeof t.icon == "string" ? (s(), a("span", {
1017
1036
  key: 0,
1018
1037
  innerHTML: t.icon,
1019
1038
  class: "w-4 h-4 inline-block"
1020
- }, null, 8, Bn)) : t.icon ? (s(), R(pe(typeof t.icon == "function" ? t.icon() : t.icon), {
1039
+ }, null, 8, Fn)) : t.icon ? (s(), V(pe(typeof t.icon == "function" ? t.icon() : t.icon), {
1021
1040
  key: 1,
1022
1041
  class: "w-4 h-4"
1023
- })) : P("", !0),
1024
- u("span", null, b(t.label), 1)
1025
- ], 10, Gn))), 128))
1026
- ], 4)) : P("", !0)
1042
+ })) : T("", !0),
1043
+ c("span", null, k(t.label), 1)
1044
+ ], 10, Wn))), 128))
1045
+ ], 4)) : T("", !0)
1027
1046
  ])),
1028
- he(Dt, {
1047
+ he(Bt, {
1029
1048
  content: be.value,
1030
1049
  visible: te.value,
1031
1050
  "trigger-element": ne.value
1032
1051
  }, null, 8, ["content", "visible", "trigger-element"]),
1033
- (s(), R(me, { to: "body" }, [
1034
- Q.value ? (s(), R(Vt, {
1052
+ (s(), V(me, { to: "body" }, [
1053
+ Q.value ? (s(), V(Zt, {
1035
1054
  key: 0,
1036
1055
  "title-prefix": r.config.name,
1037
- columns: st.value,
1056
+ columns: at.value,
1038
1057
  onClose: n[2] || (n[2] = (t) => Q.value = !1),
1039
- onToggle: S(x),
1040
- onToggleFrozen: S(f),
1041
- onMove: S(g),
1042
- onSelectAll: n[3] || (n[3] = (t) => S(h)(!0)),
1043
- onDeselectAll: n[4] || (n[4] = (t) => S(h)(!1)),
1044
- onRestoreDefault: S(L)
1045
- }, null, 8, ["title-prefix", "columns", "onToggle", "onToggleFrozen", "onMove", "onRestoreDefault"])) : P("", !0)
1058
+ onToggle: P(L),
1059
+ onToggleFrozen: P(u),
1060
+ onMove: P(h),
1061
+ onSelectAll: n[3] || (n[3] = (t) => P(d)(!0)),
1062
+ onDeselectAll: n[4] || (n[4] = (t) => P(d)(!1)),
1063
+ onRestoreDefault: P(S)
1064
+ }, null, 8, ["title-prefix", "columns", "onToggle", "onToggleFrozen", "onMove", "onRestoreDefault"])) : T("", !0)
1046
1065
  ]))
1047
1066
  ]));
1048
1067
  }
1049
- }), Fn = {
1068
+ }), Jn = {
1050
1069
  install(r) {
1051
- r.component("ShiflGrid", Nn);
1070
+ r.component("ShiflGrid", jn);
1052
1071
  }
1053
1072
  };
1054
- function jn(r) {
1073
+ function Un(r) {
1055
1074
  return {
1056
1075
  rows: r.rows
1057
1076
  };
1058
1077
  }
1059
- function Kn() {
1060
- const r = k(/* @__PURE__ */ new Set());
1061
- function c(l) {
1062
- const m = l.id ?? JSON.stringify(l), d = new Set(r.value);
1063
- d.has(m) ? d.delete(m) : d.add(m), r.value = d;
1078
+ function Xn() {
1079
+ const r = y(/* @__PURE__ */ new Set());
1080
+ function f(l) {
1081
+ const m = l.id ?? JSON.stringify(l), g = new Set(r.value);
1082
+ g.has(m) ? g.delete(m) : g.add(m), r.value = g;
1064
1083
  }
1065
1084
  return {
1066
1085
  selectedKeys: r,
1067
- toggleRow: c
1086
+ toggleRow: f
1068
1087
  };
1069
1088
  }
1070
1089
  function Yn() {
@@ -1072,7 +1091,7 @@ function Yn() {
1072
1091
  // placeholder
1073
1092
  };
1074
1093
  }
1075
- const ze = Symbol("shifl-grid-theme"), He = {
1094
+ const He = Symbol("shifl-grid-theme"), Re = {
1076
1095
  surface: "var(--shifl-surface)",
1077
1096
  surfaceAlt: "var(--shifl-surface-alt)",
1078
1097
  border: "var(--shifl-border)",
@@ -1082,61 +1101,61 @@ const ze = Symbol("shifl-grid-theme"), He = {
1082
1101
  accentStrong: "var(--shifl-accent-strong)",
1083
1102
  focus: "var(--shifl-focus)"
1084
1103
  };
1085
- function Xn(r) {
1086
- const c = k({ ...He, ...r });
1087
- return ht(ze, c), c;
1104
+ function Qn(r) {
1105
+ const f = y({ ...Re, ...r });
1106
+ return vt(He, f), f;
1088
1107
  }
1089
- function qn() {
1090
- const r = pt(ze);
1091
- return v(() => (r == null ? void 0 : r.value) ?? He);
1108
+ function ei() {
1109
+ const r = mt(He);
1110
+ return v(() => (r == null ? void 0 : r.value) ?? Re);
1092
1111
  }
1093
1112
  const ve = {
1094
1113
  sm: 640,
1095
1114
  lg: 1024
1096
1115
  };
1097
- function Jn() {
1098
- const r = k(typeof window < "u" ? window.innerWidth : 0);
1099
- function c() {
1116
+ function ti() {
1117
+ const r = y(typeof window < "u" ? window.innerWidth : 0);
1118
+ function f() {
1100
1119
  r.value = window.innerWidth;
1101
1120
  }
1102
- return X(() => {
1103
- window.addEventListener("resize", c);
1104
- }), q(() => {
1105
- window.removeEventListener("resize", c);
1121
+ return U(() => {
1122
+ window.addEventListener("resize", f);
1123
+ }), X(() => {
1124
+ window.removeEventListener("resize", f);
1106
1125
  }), {
1107
1126
  width: r,
1108
1127
  isMobile: v(() => r.value < ve.sm),
1109
1128
  isTablet: v(() => r.value >= ve.sm && r.value < ve.lg)
1110
1129
  };
1111
1130
  }
1112
- function Un() {
1131
+ function ni() {
1113
1132
  return {
1114
1133
  // placeholder
1115
1134
  };
1116
1135
  }
1117
- function Qn() {
1136
+ function ii() {
1118
1137
  return {
1119
1138
  // placeholder
1120
1139
  };
1121
1140
  }
1122
- function ei() {
1141
+ function oi() {
1123
1142
  return {
1124
1143
  // placeholder
1125
1144
  };
1126
1145
  }
1127
1146
  export {
1128
- Nn as ShiflGrid,
1129
- Fn as ShiflGridPlugin,
1130
- Xn as provideGridTheme,
1131
- Jn as useBreakpoints,
1132
- mt as useGridColumns,
1133
- jn as useGridData,
1147
+ jn as ShiflGrid,
1148
+ Jn as ShiflGridPlugin,
1149
+ Qn as provideGridTheme,
1150
+ ti as useBreakpoints,
1151
+ Ct as useGridColumns,
1152
+ Un as useGridData,
1134
1153
  Yn as useGridEditing,
1135
- Ct as useGridFilter,
1136
- Un as useGridInfiniteScroll,
1137
- Kn as useGridSelection,
1138
- _t as useGridSort,
1139
- qn as useGridTheme,
1140
- ei as useGridTour,
1141
- Qn as useVirtualScroll
1154
+ kt as useGridFilter,
1155
+ ni as useGridInfiniteScroll,
1156
+ Xn as useGridSelection,
1157
+ yt as useGridSort,
1158
+ ei as useGridTheme,
1159
+ oi as useGridTour,
1160
+ ii as useVirtualScroll
1142
1161
  };