@farris/ui-vue 1.6.5-beta.7 → 1.6.5

package/components/list-view/index.esm.js

@@ -1,6 +1,6 @@
 import { ref as f, computed as P, createVNode as t, Fragment as z, watch as Z, withModifiers as we, withDirectives as ye, vModelText as Ie, defineComponent as ee, createTextVNode as Y } from "vue";
-import { getCustomStyle as $, getCustomClass as W } from "../common/index.esm.js";
-import { useFilter as Se, useIdentify as ke, useHierarchy as be, useGroupData as Ve, useDataView as Fe, useSelection as De, usePagination as Me, useRow as Re, useEdit as Te, useVisualDataBound as Oe, useVisualDataCell as Be, useVisualDataRow as He, useVisualGroupRow as xe, useVisualSummaryRow as Pe, useVisualData as je, useSidebar as Le, useColumn as _e, useVirtualScroll as Ge, getPagination as Ae } from "../data-view/index.esm.js";
+import { getCustomClass as W, getCustomStyle as $ } from "../common/index.esm.js";
+import { useFilter as Se, useIdentify as ke, useHierarchy as be, useGroupData as Ve, useDataView as Fe, useSelection as De, usePagination as Me, useRow as Re, useEdit as Te, useVisualDataBound as Oe, useVisualDataCell as Be, useVisualDataRow as He, useVisualGroupRow as xe, useVisualSummaryRow as Pe, useVisualData as je, useSidebar as Le, useColumn as _e, useVirtualScroll as Ae, getPagination as Ge } from "../data-view/index.esm.js";
 import { useI18n as Ee } from "vue-i18n";
 import { FCheckbox as K } from "../checkbox/index.esm.js";
 const te = {
@@ -79,39 +79,39 @@ function ze(e, l) {
       s.push(h), h = a.nextNode();
     return s;
   }
-  function k(a, s) {
+  function S(a, s) {
     const h = document.createTreeWalker(a, NodeFilter.SHOW_TEXT);
     return w(h).map((p) => ({ textNode: p, text: (p.textContent || "").toLocaleLowerCase() })).map(({ textNode: p, text: i }) => {
       const u = [];
       let M = 0;
       for (; M < i.length; ) {
-        const y = i.indexOf(s, M);
-        if (y === -1)
+        const k = i.indexOf(s, M);
+        if (k === -1)
           break;
-        u.push(y), M = y + s.length;
+        u.push(k), M = k + s.length;
       }
-      return u.map((y) => {
-        const I = new Range();
-        return I.setStart(p, y), I.setEnd(p, y + s.length), I;
+      return u.map((k) => {
+        const y = new Range();
+        return y.setStart(p, k), y.setEnd(p, k + s.length), y;
       });
     }).flat();
   }
   function C(a) {
     if (!CSS.highlights || (CSS.highlights.clear(), !a || !l))
       return;
-    const s = k(l.value, a.toLocaleLowerCase()), h = new Highlight(...s);
+    const s = S(l.value, a.toLocaleLowerCase()), h = new Highlight(...s);
     CSS.highlights.set("search-result", h);
   }
   return { search: C };
 }
-function q(e, l, w, k, C, a, s, h, O, g) {
+function q(e, l, w, S, C, a, s, h, O, g) {
   const R = f(e.size), p = f(e.textField), i = f(e.titleField), u = f(e.disableField), M = P(() => {
     var n, m;
     return ((n = e.selection) == null ? void 0 : n.multiSelect) && ((m = e.selection) == null ? void 0 : m.showCheckbox);
   }), {
-    onMouseenterItem: y,
-    onMouseoverItem: I,
-    onMouseoutItem: F
+    onMouseenterItem: k,
+    onMouseoverItem: y,
+    onMouseoutItem: D
   } = a, {
     getKey: V,
     listViewItemClass: T,
@@ -136,9 +136,9 @@ function q(e, l, w, k, C, a, s, h, O, g) {
       key: V(n, m),
       style: H(n, m),
       onClick: (B) => c(n, m, B),
-      onMouseenter: (B) => y(B, n, m),
-      onMouseover: (B) => I(B, n, m),
-      onMouseout: (B) => F(B, n, m)
+      onMouseenter: (B) => k(B, n, m),
+      onMouseover: (B) => y(B, n, m),
+      onMouseout: (B) => D(B, n, m)
     }, [M.value && t("div", {
       class: "f-list-select",
       onClick: (B) => B.stopPropagation()
@@ -163,14 +163,14 @@ function q(e, l, w, k, C, a, s, h, O, g) {
     renderItem: v
   };
 }
-function Ne(e, l, w, k, C, a, s, h, O, g) {
+function Ne(e, l, w, S, C, a, s, h, O, g) {
   const R = f(e.multiSelect), p = f(e.disableField), i = f(e.textField), {
     onMouseenterItem: u,
     onMouseoverItem: M,
-    onMouseoutItem: y
+    onMouseoutItem: k
   } = a, {
-    getKey: I,
-    listViewItemClass: F,
+    getKey: y,
+    listViewItemClass: D,
     listViewItemStyle: V,
     onCheckItem: T,
     onClickItem: H
@@ -190,19 +190,19 @@ function Ne(e, l, w, k, C, a, s, h, O, g) {
   }
   function c(o, v, n) {
     return t("li", {
-      class: F(o, v),
-      id: I(o, v),
-      key: I(o, v),
+      class: D(o, v),
+      id: y(o, v),
+      key: y(o, v),
       style: V(o, v),
       onClick: (m) => H(o, v, m),
       onMouseenter: (m) => u(m, o, v),
       onMouseover: (m) => M(m, o, v),
-      onMouseout: (m) => y(m, o, v)
+      onMouseout: (m) => k(m, o, v)
     }, [R.value && t("div", {
       class: "f-list-select",
       onClick: (m) => m.stopPropagation()
     }, [t(K, {
-      id: "list-" + I(o, v),
+      id: "list-" + y(o, v),
       customClass: "listview-checkbox",
       disabled: o[p.value] || !o.checked,
       checked: o.checked,
@@ -216,14 +216,14 @@ function Ne(e, l, w, k, C, a, s, h, O, g) {
     renderItem: c
   };
 }
-function Ue(e, l, w, k, C, a, s, h, O, g) {
+function Ue(e, l, w, S, C, a, s, h, O, g) {
   const R = f(e.multiSelect), p = f(e.disableField), i = f(e.textField), {
     onMouseenterItem: u,
     onMouseoverItem: M,
-    onMouseoutItem: y
+    onMouseoutItem: k
   } = a, {
-    getKey: I,
-    listViewItemClass: F,
+    getKey: y,
+    listViewItemClass: D,
     onCheckItem: V,
     onClickItem: T
   } = s, {
@@ -231,7 +231,7 @@ function Ue(e, l, w, k, C, a, s, h, O, g) {
     dragenter: j,
     dragover: c,
     dragend: o
-  } = k, {
+  } = S, {
     removeItem: v
   } = O, n = P(() => ({
     margin: R.value ? "10px 0" : "10px 0px 10px 14px"
@@ -249,36 +249,38 @@ function Ue(e, l, w, k, C, a, s, h, O, g) {
   function B() {
     return l.slots.itemContent ? l.slots.itemContent : L;
   }
-  const G = B();
-  function S(r, d, x) {
+  const A = B();
+  function I(r, d, x) {
     return t("li", {
-      class: F(r, d),
-      id: I(r, d),
-      key: I(r, d),
-      onClick: (D) => T(r, d, D),
-      onMouseenter: (D) => u(D, r, d),
-      onMouseover: (D) => M(D, r, d),
-      onMouseout: (D) => y(D, r, d),
+      class: D(r, d),
+      id: y(r, d),
+      key: y(r, d),
+      onClick: (F) => T(r, d, F),
+      onMouseenter: (F) => u(F, r, d),
+      onMouseover: (F) => M(F, r, d),
+      onMouseout: (F) => k(F, r, d),
       draggable: "true",
-      onDragstart: (D) => H(D, r, d),
-      onDragenter: (D) => j(D, d),
-      onDragend: (D) => o(D, r),
-      onDragover: (D) => c(D)
+      onDragstart: (F) => H(F, r, d),
+      onDragenter: (F) => j(F, d),
+      onDragend: (F) => o(F, r),
+      onDragover: (F) => c(F)
     }, [R.value && t("div", {
       class: "f-list-select",
-      onClick: (D) => D.stopPropagation()
+      onClick: (F) => F.stopPropagation()
     }, [t(K, {
-      id: "list-" + I(r, d),
+      id: "list-" + y(r, d),
       customClass: "listview-checkbox",
       disabled: r[p.value] || !r.checked,
       checked: r.checked,
-      "onUpdate:checked": (D) => r.checked = D,
-      onChange: (D) => V(r, d, !D.checked)
+      "onUpdate:checked": (F) => r.checked = F,
+      onChange: (F) => V(r, d, !F.checked)
     }, null)]), t("div", {
       class: "f-list-content"
-    }, [G(r)]), t("div", {
+    }, [A(r)]), t("div", {
       class: "f-list-remove",
-      onClick: (D) => v(d)
+      onClick: (F) => {
+        F.stopPropagation(), v(d);
+      }
     }, [t("div", {
       class: "f-list-remove-icon"
     }, [t("i", {
@@ -290,44 +292,44 @@ function Ue(e, l, w, k, C, a, s, h, O, g) {
     }, null)])])]);
   }
   return {
-    renderItem: S
+    renderItem: I
   };
 }
-function We(e, l, w, k, C, a, s, h, O, g) {
-  var I;
-  const R = f(((I = e.group) == null ? void 0 : I.groupFields) || []), {
+function We(e, l, w, S, C, a, s, h, O, g) {
+  var y;
+  const R = f(((y = e.group) == null ? void 0 : y.groupFields) || []), {
     collpaseGroupIconClass: p
   } = C, {
     toggleGroupRow: i
   } = g;
-  function u(F, V) {
+  function u(D, V) {
     V.collapse = !V.collapse, w.value = i(V.collapse ? "collapse" : "expand", V, w.value);
   }
-  function M(F, V, T) {
+  function M(D, V, T) {
     return l.slots.group ? t(z, null, [l.slots.content && l.slots.group({
-      item: F.raw,
+      item: D.raw,
       index: V,
       selectedItem: T
     })]) : t("div", {
       class: "f-navlookup-recentHeader",
-      onClick: (H) => u(H, F)
+      onClick: (H) => u(H, D)
     }, [t("div", {
       class: "fv-grid-group-row-icon"
     }, [t("span", {
-      class: p(F)
+      class: p(D)
     }, null)]), t("div", {
       class: "f-navlookup-recommandLabel"
-    }, [F.raw[R.value[F.layer]]])]);
+    }, [D.raw[R.value[D.layer]]])]);
   }
-  function y(F, V, T) {
-    return F.layer > -1 && M(F, V, T);
+  function k(D, V, T) {
+    return D.layer > -1 && M(D, V, T);
   }
   return {
-    renderItem: y
+    renderItem: k
   };
 }
-function Ke(e, l, w, k) {
-  const { dataView: C } = w, { updateSelectedItems: a } = k;
+function Ke(e, l, w, S) {
+  const { dataView: C } = w, { updateSelectedItems: a } = S;
   function s(h) {
     if (h > -1 && h < C.value.length) {
       if (e != null && e.checkBeforeRemoveItem && !e.checkBeforeRemoveItem(C.value[h]))
@@ -338,24 +340,24 @@ function Ke(e, l, w, k) {
   }
   return { removeItem: s };
 }
-function Xe(e, l, w, k, C, a, s, h, O, g) {
+function Xe(e, l, w, S, C, a, s, h, O, g) {
   const {
     t: R
-  } = Ee(), p = f(e.view), i = f(e.view === "CardView"), u = f({}), M = f(R("listView.emptyMessage")), y = Ke(e, l, k, O), I = P(() => ({
+  } = Ee(), p = f(e.view), i = f(e.view === "CardView"), u = f({}), M = f(R("listView.emptyMessage")), k = Ke(e, l, S, O), y = P(() => ({
     "f-list-view-group": !0,
     "f-list-view-group-multiselect": e.multiSelect,
     "d-flex": i.value,
     "flex-wrap": i.value
-  })), F = P(() => !!w.value && w.value.length > 0), V = P(() => w.value.length === 0);
+  })), D = P(() => !!w.value && w.value.length > 0), V = P(() => w.value.length === 0);
   P(() => V.value && !l.slots.empty);
   function T() {
     return p.value === "SingleView" ? q : p.value === "DraggableView" ? Ue : (p.value === "ContentView" || p.value === "CardView") && (e.contentTemplate || l.slots.content) ? Ne : q;
   }
   const H = T(), {
     renderItem: j
-  } = H(e, l, w, g, C, a, O, s, y, h), {
+  } = H(e, l, w, g, C, a, O, s, k, h), {
     renderItem: c
-  } = We(e, l, w, g, C, a, O, s, y, h), o = [j, c];
+  } = We(e, l, w, g, C, a, O, s, k, h), o = [j, c];
   function v() {
     return w.value.filter((L) => L.visible !== !1).map((L, B) => o[L.type](L, B, u));
   }
@@ -369,26 +371,26 @@ function Xe(e, l, w, k, C, a, s, h, O, g) {
   }
   function m() {
     return t("ul", {
-      class: I.value,
+      class: y.value,
       style: "list-style: none;"
-    }, [F.value && v(), V.value && n()]);
+    }, [D.value && v(), V.value && n()]);
   }
   return {
     renderListArea: m
   };
 }
 function Ye(e, l, w) {
-  function k() {
+  function S() {
     return l.slots.header && t("div", {
       class: "f-list-view-header"
     }, [l.slots.header()]);
   }
   return {
-    renderHeader: k
+    renderHeader: S
   };
 }
 function J(e, l, w) {
-  const k = f(e.headerClass), C = f(e.placeholder), a = f(""), s = P(() => !a.value), h = P(() => !!a.value);
+  const S = f(e.headerClass), C = f(e.placeholder), a = f(""), s = P(() => !a.value), h = P(() => !!a.value);
   function O(i) {
     a.value = "";
   }
@@ -400,7 +402,7 @@ function J(e, l, w) {
       "form-group": !0,
       "farris-form-group": !0
     };
-    return k.value && k.value.split(" ").reduce((M, y) => (M[y] = !0, M), i), i;
+    return S.value && S.value.split(" ").reduce((M, k) => (M[k] = !0, M), i), i;
   });
   function R(i) {
   }
@@ -441,15 +443,15 @@ function J(e, l, w) {
   };
 }
 function $e() {
-  const e = f(""), l = f(-1), w = f(""), k = f(-1), C = f(!1);
+  const e = f(""), l = f(-1), w = f(""), S = f(-1), C = f(!1);
   function a(p, i, u) {
-    k.value = u;
+    S.value = u;
   }
   function s(p, i, u) {
-    C.value || (k.value = u);
+    C.value || (S.value = u);
   }
   function h(p, i, u) {
-    k.value = -1;
+    S.value = -1;
   }
   function O() {
     C.value = !0;
@@ -463,7 +465,7 @@ function $e() {
   return {
     activeIndex: l,
     focusedItemId: w,
-    hoverIndex: k,
+    hoverIndex: S,
     clearActiveItem: R,
     onMouseenterItem: a,
     onMouseoverItem: s,
@@ -472,14 +474,14 @@ function $e() {
     suspendHover: O
   };
 }
-function qe(e, l, w, k) {
-  const C = f(e.idField), { dataView: a } = w, s = f(-1), h = f(!1), { activeIndex: O, focusedItemId: g, hoverIndex: R, resumeHover: p, suspendHover: i } = k;
-  let u, M = 0, y = 0;
-  function I(c, o) {
-    const v = c - M, n = o - y;
-    u.style.left = parseInt(u.style.left) + v + "px", u.style.top = parseInt(u.style.top) + n + "px", M = c, y = o;
-  }
-  function F(c) {
+function qe(e, l, w, S) {
+  const C = f(e.idField), { dataView: a } = w, s = f(-1), h = f(!1), { activeIndex: O, focusedItemId: g, hoverIndex: R, resumeHover: p, suspendHover: i } = S;
+  let u, M = 0, k = 0;
+  function y(c, o) {
+    const v = c - M, n = o - k;
+    u.style.left = parseInt(u.style.left) + v + "px", u.style.top = parseInt(u.style.top) + n + "px", M = c, k = o;
+  }
+  function D(c) {
     const { left: o, top: v } = c.getBoundingClientRect(), n = c.cloneNode(!0);
     return n.style.cssText = `
         position:absolute;
@@ -504,11 +506,11 @@ function qe(e, l, w, k) {
   }
   function V(c, o, v) {
     if (c.stopPropagation(), i(), o) {
-      if (u = F(c.target), c.dataTransfer) {
+      if (u = D(c.target), c.dataTransfer) {
         const n = new Image();
         n.src = "", c.dataTransfer.setDragImage(n, 0, 0);
       }
-      M = c.pageX, y = c.pageY, setTimeout(() => {
+      M = c.pageX, k = c.pageY, setTimeout(() => {
         s.value = v, h.value = !0, o.moving = !0;
       });
     }
@@ -516,11 +518,11 @@ function qe(e, l, w, k) {
   function T(c, o) {
     if (c.preventDefault(), s.value !== o) {
       const v = a.value[s.value], n = a.value;
-      n.splice(s.value, 1), n.splice(o, 0, v), s.value = o, I(c.pageX, c.pageY);
+      n.splice(s.value, 1), n.splice(o, 0, v), s.value = o, y(c.pageX, c.pageY);
     }
   }
   function H(c) {
-    c.preventDefault(), c.dataTransfer && (c.dataTransfer.dropEffect = "move"), I(c.pageX, c.pageY);
+    c.preventDefault(), c.dataTransfer && (c.dataTransfer.dropEffect = "move"), y(c.pageX, c.pageY);
   }
   function j(c, o) {
     o && (o.moving = !1, u && (document.body.removeChild(u), u = null)), a.value.forEach((v, n) => {
@@ -535,66 +537,66 @@ function qe(e, l, w, k) {
     isDragging: h
   };
 }
-function Je(e, l, w, k, C, a) {
+function Je(e, l, w, S, C, a) {
   const s = f(e.idField), h = f(e.disableField), O = f(e.draggable);
   f(e.itemClass);
-  const g = f(e.selection.multiSelect ?? !1), R = f(e.selection.multiSelectMode), { isDragging: p } = k, { activeIndex: i, focusedItemId: u, hoverIndex: M } = C, { clearSelection: y, getSelectedItems: I, toggleSelectItem: F, currentSelectedDataId: V } = a, T = f(I()), H = (S) => T.value.length === 0 ? !1 : T.value.some((r) => {
+  const g = f(e.selection.multiSelect ?? !1), R = f(e.selection.multiSelectMode), { isDragging: p } = S, { activeIndex: i, focusedItemId: u, hoverIndex: M } = C, { clearSelection: k, getSelectedItems: y, toggleSelectItem: D, currentSelectedDataId: V } = a, T = f(y()), H = (I) => T.value.length === 0 ? !1 : T.value.some((r) => {
     let d = "";
-    return r.data ? d = r.data[s.value] : d = r[s.value], d === S;
+    return r.data ? d = r.data[s.value] : d = r[s.value], d === I;
   });
   function j() {
-    T.value = I();
+    T.value = y();
   }
-  function c(S, r) {
-    return S.raw[s.value] != null ? S.raw[s.value] : "";
+  function c(I, r) {
+    return I.raw[s.value] != null ? I.raw[s.value] : "";
   }
-  function o(S, r) {
+  function o(I, r) {
     const d = {
       "f-list-view-group-item": !0,
       "f-list-view-draggable-item": O.value,
-      "f-un-click": !S.checked,
-      "f-un-select": !!S.raw[h.value],
+      "f-un-click": !I.checked,
+      "f-un-select": !!I.raw[h.value],
       "f-listview-active": (
         // 多选
-        g.value && H(c(S)) || // 单选
-        !g.value && S.raw[s.value] === V.value
+        g.value && H(c(I)) || // 单选
+        !g.value && I.raw[s.value] === V.value
       ),
       "f-listview-hover": !p.value && r === M.value,
-      moving: !!S.moving
+      moving: !!I.moving
     };
     if (typeof e.itemClass == "string")
       return W(d, e.itemClass);
     if (typeof e.itemClass == "function") {
-      const x = e.itemClass(S);
+      const x = e.itemClass(I);
       return W(d, x);
     }
     return d;
   }
-  function v(S, r) {
+  function v(I, r) {
     const d = (
       // 多选
-      g.value && H(c(S)) || // 单选
-      !g.value && S.raw[s.value] === V.value
+      g.value && H(c(I)) || // 单选
+      !g.value && I.raw[s.value] === V.value
     ), x = {};
     if (d && (x.backgroundColor = "#dae9ff"), typeof e.itemStyle == "string")
       return $(x, e.itemStyle);
     if (typeof e.itemStyle == "function") {
-      const D = e.itemStyle(S);
-      return $(x, D);
+      const F = e.itemStyle(I);
+      return $(x, F);
     }
     return x;
   }
   const n = P(() => !g.value);
-  function m(S, r, d) {
-    S.checked = d, !S.raw[h.value] && (n.value && (u.value = S.raw[s.value]), F(S));
+  function m(I, r, d) {
+    I.checked = d, !I.raw[h.value] && (n.value && (u.value = I.raw[s.value]), D(I));
   }
   const L = P(() => g.value && R.value === "OnCheckClearByClick"), B = P(() => !g.value || g.value && (R.value === "OnCheckAndClick" || R.value === "OnClick"));
-  function G(S, r, d) {
-    if (S.raw[h.value]) {
+  function A(I, r, d) {
+    if (I.raw[h.value]) {
       d == null || d.preventDefault(), d == null || d.stopPropagation();
       return;
     }
-    u.value = S.raw[s.value], i.value = r, L.value && y(), B.value && (F(S), j()), l.emit("clickItem", { data: T.value, index: r, dataItem: S.raw }), l.emit("activeChange", T.value);
+    u.value = I.raw[s.value], i.value = r, L.value && k(), B.value && (D(I), j()), l.emit("clickItem", { data: T.value, index: r, dataItem: I.raw }), l.emit("activeChange", T.value);
   }
   return {
     getKey: c,
@@ -603,7 +605,7 @@ function Je(e, l, w, k, C, a) {
     listViewItemStyle: v,
     updateSelectedItems: j,
     onCheckItem: m,
-    onClickItem: G
+    onClickItem: A
   };
 }
 const U = /* @__PURE__ */ ee({
@@ -611,30 +613,30 @@ const U = /* @__PURE__ */ ee({
   props: te,
   emits: ["afterSearch", "checkValuesChange", "clickItem", "selectItem", "unSelectItem", "selectionChange", "removeItem", "change", "activeChange", "pageIndexChanged", "pageSizeChanged", "changed", "selectionUpdate"],
   setup(e, l) {
-    const w = f(), k = f(!0), C = f(!1), a = f([]), s = 0, h = f(e.columns), O = Se(e, l), g = ke(e), R = be(e), p = Ve(e, g), i = Fe(e, /* @__PURE__ */ new Map(), O, R, g), u = De(e, i, g, a, l), M = ze(e, w), y = Me(e, i), I = P(() => i.dataView.value.length), F = Re(e, l, u, g), V = Te(e, l, g, F, a), T = Oe(e), H = Be(e, {}, T), j = He(e, i, V, R, g, T, H), c = xe(e, g, H, j), o = Pe(e, g, H, j), v = je(e, h, i, I, s, j, c, o), {
+    const w = f(), S = f(!0), C = f(!1), a = f([]), s = 0, h = f(e.columns), O = Se(e, l), g = ke(e), R = be(e), p = Ve(e, g), i = Fe(e, /* @__PURE__ */ new Map(), O, R, g), u = De(e, i, g, a, l), M = ze(e, w), k = Me(e, i), y = P(() => i.dataView.value.length), D = Re(e, l, u, g), V = Te(e, l, g, D, a), T = Oe(e), H = Be(e, {}, T), j = He(e, i, V, R, g, T, H), c = xe(e, g, H, j), o = Pe(e, g, H, j), v = je(e, h, i, y, s, j, c, o), {
       getVisualData: n
     } = v;
-    a.value = n(0, I.value + s - 1);
+    a.value = n(0, y.value + s - 1);
     const m = P(() => {
       const b = {
         "f-list-view": !0,
         "f-list-view-multiple": e.multiSelect
       };
       return e.size !== "default" && (b[`${e.size}-item`] = !0), W(b, e.customClass);
-    }), L = P(() => !!l.slots.footer || k.value);
+    }), L = P(() => !!l.slots.footer || S.value);
     function B() {
       return e.header === "SearchBar" ? J : e.header === "ContentHeader" ? Ye : J;
     }
-    const G = B(), {
-      renderHeader: S
-    } = G(e, l, M), r = $e(), d = qe(e, l, i, r), x = Je(e, l, a, d, r, u), {
-      renderListArea: D
+    const A = B(), {
+      renderHeader: I
+    } = A(e, l, M), r = $e(), d = qe(e, l, i, r), x = Je(e, l, a, d, r, u), {
+      renderListArea: F
     } = Xe(e, l, a, i, p, r, u, v, x, d);
     function ne(b) {
       M.search(b);
     }
     function le(b) {
-      b && (i.load(b), a.value = n(0, I.value + s - 1));
+      b && (i.load(b), a.value = n(0, y.value + s - 1));
     }
     function ae() {
       u.clearSelection(), r.clearActiveItem();
@@ -652,18 +654,18 @@ const U = /* @__PURE__ */ ee({
       return u.currentSelectedDataId.value;
     }
     function ue(b) {
-      F.activeRowById(b);
+      D.activeRowById(b);
     }
     function ce(b) {
-      const _ = g.idField.value, A = a.value.find((N) => N.raw[_] === b), E = a.value.findIndex((N) => N.raw[_] === b);
-      A && E > -1 && x.onClickItem(A, E);
+      const _ = g.idField.value, G = a.value.find((N) => N.raw[_] === b), E = a.value.findIndex((N) => N.raw[_] === b);
+      G && E > -1 && x.onClickItem(G, E);
     }
     function re(b) {
-      const _ = g.idField.value, A = a.value.find((E) => E.raw[_] === b);
-      A && F.changeRow(A);
+      const _ = g.idField.value, G = a.value.find((E) => E.raw[_] === b);
+      G && D.changeRow(G);
     }
     function de(b) {
-      y.updatePagination(b);
+      k.updatePagination(b);
     }
     function fe(b) {
       return a.value.filter((_) => b.includes(_.raw[e.idField]));
@@ -695,15 +697,11 @@ const U = /* @__PURE__ */ ee({
       applyColumnSorter: Ze,
       columnContext: Ce,
       updateColumnRenderContext: et
-    } = he, pe = Ge(e, i, a, Ce, v, I, s, ge, V), {
-      shouldRenderPagination: tt
-    } = y, {
-      renderDataGridPagination: nt
-    } = Ae(e, l, i, pe, y, u);
-    return () => t("div", {
+    } = he, pe = Ae(e, i, a, Ce, v, y, s, ge, V);
+    return Ge(e, l, i, pe, k, u), () => t("div", {
       class: m.value,
       onClick: ve
-    }, [S(), t("div", {
+    }, [I(), t("div", {
       ref: w,
       class: "f-list-view-content",
       onMouseover: () => {
@@ -712,7 +710,7 @@ const U = /* @__PURE__ */ ee({
       onMouseleave: () => {
         C.value = !1;
       }
-    }, [D()]), L.value && t("div", {
+    }, [F()]), L.value && t("div", {
       class: "f-list-view-footer"
     }, [e.footerTemplate ? e.footerTemplate() : l.slots.footer && l.slots.footer()])]);
   }
@@ -756,10 +754,10 @@ const U = /* @__PURE__ */ ee({
       desc: "导游5",
       amount: 84.13,
       avatar: "./assets/avatar5.png"
-    }], k = P(() => e.data.length > 0 ? e.data : w);
+    }], S = P(() => e.data.length > 0 ? e.data : w);
     return () => {
       var C;
-      return t(z, null, [(C = k.value) == null ? void 0 : C.map((a) => t("div", {
+      return t(z, null, [(C = S.value) == null ? void 0 : C.map((a) => t("div", {
         class: "f-template-listview-row"
       }, [t("div", {
         class: "list-view-item-title"