@farris/ui-vue 1.7.0-beta.4 → 1.7.0

package/components/pagination/index.esm.js

@@ -1,205 +1,7 @@
-import { computed as o, ref as f, watch as k, createVNode as a, defineComponent as Q, watchEffect as ne, Fragment as F, createTextVNode as $, inject as le, onMounted as se } from "vue";
-import { resolveAppearance as ie, createPropsResolver as oe } from "../dynamic-resolver/index.esm.js";
-import { LocaleService as B } from "../locale/index.esm.js";
-import { useDesignerComponent as ue } from "../designer-canvas/index.esm.js";
-import { withInstall as re } from "../common/index.esm.js";
-const ce = /* @__PURE__ */ new Map([
-  ["appearance", ie]
-]), pe = "https://json-schema.org/draft/2020-12/schema", de = "https://farris-design.gitee.io/pagination.schema.json", ve = "pagination", ge = "A Farris Component", fe = "object", me = {
-  id: {
-    description: "The unique identifier for a pagination",
-    type: "string"
-  },
-  type: {
-    description: "The type string of pagination component",
-    type: "string",
-    default: "pagination"
-  },
-  appearance: {
-    description: "",
-    type: "object",
-    properties: {
-      class: {
-        type: "string"
-      },
-      style: {
-        type: "string"
-      }
-    },
-    default: {}
-  },
-  binding: {
-    description: "",
-    type: "object",
-    default: {}
-  },
-  editable: {
-    description: "",
-    type: "boolean",
-    default: !0
-  },
-  enableLinkLabel: {
-    description: "",
-    type: "boolean",
-    default: !1
-  },
-  label: {
-    description: "",
-    type: "string",
-    default: ""
-  },
-  lableWidth: {
-    description: "",
-    type: "number"
-  },
-  placeholder: {
-    description: "",
-    type: "string",
-    default: ""
-  },
-  readonly: {
-    description: "",
-    type: "boolean",
-    default: !1
-  },
-  required: {
-    description: "",
-    type: "boolean",
-    default: !1
-  },
-  tabindex: {
-    description: "",
-    type: "number",
-    default: -1
-  },
-  textAlign: {
-    description: "",
-    type: "string",
-    enum: [
-      "left",
-      "middle",
-      "right"
-    ],
-    default: "left"
-  },
-  visible: {
-    description: "",
-    type: "boolean",
-    default: !0
-  },
-  onBlur: {
-    description: "",
-    type: "string",
-    default: ""
-  },
-  onClickLinkLabel: {
-    description: "",
-    type: "string",
-    default: ""
-  }
-}, he = [
-  "id",
-  "type"
-], be = {
-  $schema: pe,
-  $id: de,
-  title: ve,
-  description: ge,
-  type: fe,
-  properties: me,
-  required: he
-}, ye = "pagination", xe = "A Farris Component", we = "object", Ie = {
-  basic: {
-    description: "Basic Infomation",
-    title: "基本信息",
-    properties: {
-      id: {
-        description: "组件标识",
-        title: "标识",
-        type: "string",
-        readonly: !0
-      },
-      type: {
-        description: "组件类型",
-        title: "控件类型",
-        type: "select",
-        editor: {
-          type: "waiting for modification",
-          enum: []
-        }
-      }
-    }
-  },
-  behavior: {
-    description: "Basic Infomation",
-    title: "行为",
-    properties: {
-      editable: {
-        description: "",
-        title: "允许编辑",
-        type: "boolean"
-      },
-      readonly: {
-        description: "",
-        title: "只读",
-        type: "string"
-      },
-      required: {
-        description: "",
-        title: "必填",
-        type: "boolean"
-      },
-      visible: {
-        description: "",
-        title: "可见",
-        type: "boolean"
-      },
-      placeholder: {
-        description: "",
-        title: "提示文本",
-        type: "string"
-      },
-      tabindex: {
-        description: "",
-        title: "tab索引",
-        type: "number"
-      },
-      textAlign: {
-        description: "",
-        title: "对齐方式",
-        type: "enum",
-        editor: {
-          type: "combo-list",
-          textField: "name",
-          valueField: "value",
-          data: [
-            {
-              value: "left",
-              name: "左对齐"
-            },
-            {
-              value: "center",
-              name: "居中"
-            },
-            {
-              value: "right",
-              name: "右对齐"
-            }
-          ]
-        }
-      }
-    }
-  }
-}, Ce = {
-  title: ye,
-  description: xe,
-  type: we,
-  categories: Ie
-};
-function Se(e, t, v) {
-  return t;
-}
-const J = {
+import { computed as v, ref as x, watch as S, createVNode as a, defineComponent as K, watchEffect as q, Fragment as P, createTextVNode as E } from "vue";
+import { LocaleService as k } from "../locale/index.esm.js";
+import { withInstall as J } from "../common/index.esm.js";
+const Q = {
   /**
    * 当前页码
    */
@@ -244,27 +46,27 @@ const J = {
    * 是否展示分页汇总信息
    */
   showPageInfo: { type: Boolean, default: !1 }
-}, U = oe(J, be, ce, Se, Ce);
-function X(e, t, v, r) {
-  const s = o(() => B.getLocaleValue("pagination.goto.prefix")), p = f(""), n = f(e.value);
-  k(e, (d) => {
+};
+function U(e, l, p, i) {
+  const t = v(() => k.getLocaleValue("pagination.goto.prefix")), s = x(""), n = x(e.value);
+  S(e, (d) => {
     n.value !== d && (n.value = d);
   });
-  function l(d) {
-    return !isNaN(d) && d >= 1 && d <= t.value;
+  function o(d) {
+    return !isNaN(d) && d >= 1 && d <= l.value;
   }
-  function u(d) {
+  function r(d) {
     const y = e.value;
-    n.value = d.target.valueAsNumber, l(n.value) ? e.value = n.value : n.value = y, r.emit("update:currentPage", e.value), r.emit("changed", {
+    n.value = d.target.valueAsNumber, o(n.value) ? e.value = n.value : n.value = y, i.emit("update:currentPage", e.value), i.emit("changed", {
       pageIndex: e.value,
-      pageSize: v.value
-    }), r.emit("pageIndexChanged", {
+      pageSize: p.value
+    }), i.emit("pageIndexChanged", {
       pageIndex: e.value,
-      pageSize: v.value
+      pageSize: p.value
     });
   }
-  function i(d) {
-    d.key === "Enter" && u(d);
+  function u(d) {
+    d.key === "Enter" && r(d);
   }
   function c() {
     return a("li", {
@@ -272,145 +74,145 @@ function X(e, t, v, r) {
       style: "padding-left: 10px; white-space: nowrap;"
     }, [a("span", {
       class: "pagination-message"
-    }, [s.value]), a("input", {
+    }, [t.value]), a("input", {
       title: "page-index-spinner",
       type: "number",
       class: "form-control farris-gotopagenumber",
       value: n.value,
       min: 1,
-      max: t.value,
+      max: l.value,
       style: "display: inline-block;margin-left:3px;",
-      onBlur: (d) => u(d),
-      onKeyup: (d) => i(d)
-    }, null), p.value]);
+      onBlur: (d) => r(d),
+      onKeyup: (d) => u(d)
+    }, null), s.value]);
   }
   return {
     renderGotoButton: c
   };
 }
-function Y(e, t, v, r, s) {
-  const p = o(() => ({
+function X(e, l, p, i, t) {
+  const s = v(() => ({
     "page-item": !0,
-    disabled: t.value
+    disabled: l.value
   }));
   function n(c) {
-    e.value = e.value < v.value ? e.value + 1 : v.value, s.emit("update:currentPage", e.value), s.emit("changed", {
+    e.value = e.value < p.value ? e.value + 1 : p.value, t.emit("update:currentPage", e.value), t.emit("changed", {
       pageIndex: e.value,
-      pageSize: r.value
-    }), s.emit("pageIndexChanged", {
+      pageSize: i.value
+    }), t.emit("pageIndexChanged", {
       pageIndex: e.value,
-      pageSize: r.value
+      pageSize: i.value
     });
   }
-  function l(c) {
-    e.value = v.value, s.emit("update:currentPage", e.value), s.emit("changed", {
+  function o(c) {
+    e.value = p.value, t.emit("update:currentPage", e.value), t.emit("changed", {
       pageIndex: e.value,
-      pageSize: r.value
-    }), s.emit("pageIndexChanged", {
+      pageSize: i.value
+    }), t.emit("pageIndexChanged", {
       pageIndex: e.value,
-      pageSize: r.value
+      pageSize: i.value
     });
   }
-  function u() {
+  function r() {
     return a("li", {
-      class: p.value
-    }, [!t.value && a("a", {
+      class: s.value
+    }, [!l.value && a("a", {
       class: "page-link",
       tabindex: "0",
       onClick: (c) => n()
     }, [a("span", {
       class: "f-icon f-page-next"
-    }, null)]), t.value && a("span", {
+    }, null)]), l.value && a("span", {
       class: "page-link"
     }, [a("span", {
       class: "f-icon f-page-next"
     }, null)])]);
   }
-  function i() {
+  function u() {
     return a("li", {
-      class: p.value
-    }, [!t.value && a("a", {
+      class: s.value
+    }, [!l.value && a("a", {
       class: "page-link",
       tabindex: "0",
-      onClick: (c) => l()
+      onClick: (c) => o()
     }, [a("span", {
       class: "f-icon f-page-last"
-    }, null)]), t.value && a("span", {
+    }, null)]), l.value && a("span", {
       class: "page-link"
     }, [a("span", {
       class: "f-icon f-page-last"
     }, null)])]);
   }
   return {
-    renderLastPage: i,
-    renderNextPage: u
+    renderLastPage: u,
+    renderNextPage: r
   };
 }
-function Z(e, t) {
-  const v = o(() => B.getLocaleValue("pagination.totalInfo.firstText")), r = o(() => B.getLocaleValue("pagination.totalInfo.lastText")), s = o(() => ({
+function Y(e, l) {
+  const p = v(() => k.getLocaleValue("pagination.totalInfo.firstText")), i = v(() => k.getLocaleValue("pagination.totalInfo.lastText")), t = v(() => ({
     "pagination-message": !0,
     "text-truncate": !0,
     "d-flex": !0,
     "ml-auto": e.value === "right",
     "flex-fill": e.value === "right"
   }));
-  function p() {
+  function s() {
     return a("li", {
-      class: s.value
+      class: t.value
     }, [a("div", {
       class: "text-truncate"
     }, [a("span", {
       class: "pg-message-text"
-    }, [v.value]), a("b", {
+    }, [p.value]), a("b", {
       class: "pg-message-total"
-    }, [t.value]), a("span", {
+    }, [l.value]), a("span", {
       class: "pg-message-text"
-    }, [r.value])])]);
+    }, [i.value])])]);
   }
   return {
-    renderPageInfo: p
+    renderPageInfo: s
   };
 }
-function _(e, t, v, r, s) {
-  const p = f(!1), n = o(() => B.getLocaleValue("pagination.show")), l = o(() => B.getLocaleValue("pagination.totalInfo.lastText")), u = o(() => ({
+function Z(e, l, p, i, t) {
+  const s = x(!1), n = v(() => k.getLocaleValue("pagination.show")), o = v(() => k.getLocaleValue("pagination.totalInfo.lastText")), r = v(() => ({
     dropup: !0,
     "dropdown-right": !0,
     "pg-pagelist": !0,
-    "pagelist-disabled": r.value === 0,
-    show: p.value
-  })), i = o(() => ({
+    "pagelist-disabled": i.value === 0,
+    show: s.value
+  })), u = v(() => ({
     "dropdown-menu": !0,
-    show: p.value
+    show: s.value
   })), c = (g) => ({
     "w-100": !0,
     "dropdown-item": !0,
-    active: t.value === g
+    active: l.value === g
   });
   function d(g) {
-    p.value = !0;
+    s.value = !0;
   }
   function y(g) {
-    p.value = !1;
+    s.value = !1;
   }
-  function C(g, h, S) {
-    const N = g * h - h + 1;
-    return Math.ceil(N / S);
+  function h(g, f, C) {
+    const j = g * f - f + 1;
+    return Math.ceil(j / C);
   }
-  function x(g, h) {
-    const S = e.value;
-    e.value = C(e.value, t.value, h), S !== e.value && s.emit("update:currentPage", e.value), t.value = h, p.value = !1, s.emit("update:pageSize", t.value), s.emit("changed", {
+  function I(g, f) {
+    const C = e.value;
+    e.value = h(e.value, l.value, f), C !== e.value && t.emit("update:currentPage", e.value), l.value = f, s.value = !1, t.emit("update:pageSize", l.value), t.emit("changed", {
       pageIndex: e.value,
-      pageSize: t.value
-    }), s.emit("pageSizeChanged", {
+      pageSize: l.value
+    }), t.emit("pageSizeChanged", {
       pageIndex: e.value,
-      pageSize: t.value
+      pageSize: l.value
     });
   }
-  function m() {
+  function b() {
     return a("li", {
       class: "pagination-pagelist"
     }, [a("div", {
-      class: u.value,
+      class: r.value,
       onMouseenter: (g) => d(),
       onMouseleave: (g) => y()
     }, [a("div", {
@@ -419,306 +221,227 @@ function _(e, t, v, r, s) {
       class: "pagelist-text"
     }, [n.value]), a("b", {
       class: "cur-pagesize"
-    }, [t.value]), a("span", {
+    }, [l.value]), a("span", {
       class: "pagelist-text"
-    }, [l.value]), a("i", {
+    }, [o.value]), a("i", {
       class: "f-icon f-icon-dropdown"
     }, null)]), a("div", {
-      class: i.value,
+      class: u.value,
       style: "margin-bottom: -1px;"
-    }, [v.value.map((g) => a("li", {
+    }, [p.value.map((g) => a("li", {
       class: c(g),
-      onClick: (h) => x(h, g)
+      onClick: (f) => I(f, g)
     }, [a("span", null, [g])]))])])]);
   }
   return {
-    renderPageList: m
+    renderPageList: b
   };
 }
-function ee(e, t, v, r, s) {
-  const p = (i) => ({
+function _(e, l, p, i, t) {
+  const s = (u) => ({
     "page-item": !0,
-    current: t.value === i.value,
-    ellipsis: i.label === "...",
+    current: l.value === u.value,
+    ellipsis: u.label === "...",
     disabled: e.disabled
-  }), n = (i) => ({
+  }), n = (u) => ({
     "f-icon": !0,
-    "f-icon-arrow-seek-left": i.value < t.value,
-    "f-icon-arrow-seek-right": i.value > t.value
+    "f-icon-arrow-seek-left": u.value < l.value,
+    "f-icon-arrow-seek-right": u.value > l.value
   });
-  function l(i, c) {
-    t.value = c, s.emit("update:currentPage", t.value), s.emit("changed", {
-      pageIndex: t.value,
-      pageSize: r.value
-    }), s.emit("pageIndexChanged", {
-      pageIndex: t.value,
-      pageSize: r.value
+  function o(u, c) {
+    l.value = c, t.emit("update:currentPage", l.value), t.emit("changed", {
+      pageIndex: l.value,
+      pageSize: i.value
+    }), t.emit("pageIndexChanged", {
+      pageIndex: l.value,
+      pageSize: i.value
     });
   }
-  function u() {
-    return v.value.map((i) => a("li", {
-      class: p(i),
-      key: i.value + ""
-    }, [t.value !== i.value && a("a", {
+  function r() {
+    return p.value.map((u) => a("li", {
+      class: s(u),
+      key: u.value + ""
+    }, [l.value !== u.value && a("a", {
       class: "page-link",
       tabindex: "0",
-      onClick: (c) => l(c, i.value)
+      onClick: (c) => o(c, u.value)
     }, [a("span", {
       class: "page-link-label"
-    }, [i.label]), i.label === "..." && a("i", {
-      class: n(i)
-    }, null)]), t.value === i.value && a("span", {
+    }, [u.label]), u.label === "..." && a("i", {
+      class: n(u)
+    }, null)]), l.value === u.value && a("span", {
       class: "page-link"
-    }, [i.label])]));
+    }, [u.label])]));
   }
   return {
-    renderPageNumbers: u
+    renderPageNumbers: r
   };
 }
-function ae(e, t, v, r, s) {
-  const p = o(() => ({
+function R(e, l, p, i, t) {
+  const s = v(() => ({
     "page-item": !0,
-    disabled: t.value
+    disabled: l.value
   }));
   function n(c) {
-    e.value = 1, s.emit("update:currentPage", e.value), s.emit("changed", {
+    e.value = 1, t.emit("update:currentPage", e.value), t.emit("changed", {
       pageIndex: e.value,
-      pageSize: r.value
-    }), s.emit("pageIndexChanged", {
+      pageSize: i.value
+    }), t.emit("pageIndexChanged", {
       pageIndex: e.value,
-      pageSize: r.value
+      pageSize: i.value
     });
   }
-  function l(c) {
-    e.value = e.value > 2 ? e.value - 1 : 1, s.emit("update:currentPage", e.value), s.emit("changed", {
+  function o(c) {
+    e.value = e.value > 2 ? e.value - 1 : 1, t.emit("update:currentPage", e.value), t.emit("changed", {
       pageIndex: e.value,
-      pageSize: r.value
-    }), s.emit("pageIndexChanged", {
+      pageSize: i.value
+    }), t.emit("pageIndexChanged", {
       pageIndex: e.value,
-      pageSize: r.value
+      pageSize: i.value
     });
   }
-  function u() {
+  function r() {
     return a("li", {
-      class: p.value
-    }, [v.value && a("a", {
+      class: s.value
+    }, [p.value && a("a", {
       tabindex: "0",
       class: "page-link",
       onClick: (c) => n()
     }, [a("span", {
       class: "f-icon f-page-first"
-    }, null)]), t.value && a("span", {
+    }, null)]), l.value && a("span", {
       class: "page-link"
     }, [a("span", {
       class: "f-icon f-page-first"
     }, null)])]);
   }
-  function i() {
+  function u() {
     return a("li", {
-      class: p.value
-    }, [v.value && a("a", {
+      class: s.value
+    }, [p.value && a("a", {
       tabindex: "0",
       class: "page-link",
-      onClick: (c) => l()
+      onClick: (c) => o()
     }, [a("span", {
       class: "f-icon f-page-pre"
-    }, null)]), t.value && a("span", {
+    }, null)]), l.value && a("span", {
       class: "page-link"
     }, [a("span", {
       class: "f-icon f-page-pre"
     }, null)])]);
   }
   return {
-    renderFirstPage: u,
-    renderPreviousPage: i
+    renderFirstPage: r,
+    renderPreviousPage: u
   };
 }
-function te(e) {
-  const t = f([]);
-  function v(s, p, n, l) {
-    const u = Math.ceil(n / 2);
-    return s === n ? l : s === 1 ? s : n < l ? l - u < p ? l - n + s : u < p ? p - u + s : s : s;
+function ee(e) {
+  const l = x([]);
+  function p(t, s, n, o) {
+    const r = Math.ceil(n / 2);
+    return t === n ? o : t === 1 ? t : n < o ? o - r < s ? o - n + t : r < s ? s - r + t : t : t;
   }
-  function r(s, p, n, l) {
-    const u = [], i = Math.ceil(n / p), c = Math.ceil(l / 2), d = s <= c, y = i - c < s, C = !d && !y, x = l < i;
-    let m = 1;
-    for (; m <= i && m <= l; ) {
-      const g = v(m, s, l, i), h = m === 2 && (C || y), S = m === l - 1 && (C || d), j = x && (h || S) ? "..." : "" + g;
-      u.push({ label: j, value: g }), m++;
+  function i(t, s, n, o) {
+    const r = [], u = Math.ceil(n / s), c = Math.ceil(o / 2), d = t <= c, y = u - c < t, h = !d && !y, I = o < u;
+    let b = 1;
+    for (; b <= u && b <= o; ) {
+      const g = p(b, t, o, u), f = b === 2 && (h || y), C = b === o - 1 && (h || d), N = I && (f || C) ? "..." : "" + g;
+      r.push({ label: N, value: g }), b++;
     }
-    t.value = u;
+    l.value = r;
   }
-  return { pages: t, updatePages: r };
+  return { pages: l, updatePages: i };
 }
-const V = /* @__PURE__ */ Q({
+const ae = /* @__PURE__ */ K({
   name: "FPagination",
-  props: J,
+  props: Q,
   emits: ["changed", "pageIndexChanged", "pageSizeChanged", "update:currentPage", "update:pageSize"],
-  setup(e, t) {
-    const v = f(!1), r = f(e.mode), s = f(""), p = f(!1), n = f(e.pageSize), l = f(e.currentPage), u = f(e.totalItems), {
-      pages: i,
-      updatePages: c
-    } = te(), d = {
+  setup(e, l) {
+    const p = x(!1), i = x(""), t = x(!1), s = x(e.pageSize), n = x(e.currentPage), o = x(e.totalItems), {
+      pages: r,
+      updatePages: u
+    } = ee(), c = {
       position: "relative"
-    }, y = {
+    }, d = {
       position: "absolute",
       right: "0",
       zIndex: 1,
       background: "rgba(250,250,252,.6)",
       width: "100%",
       height: "100%"
-    }, C = o(() => !u.value || l.value === 1), x = o(() => e.pageList), m = o(() => Math.ceil(u.value / n.value)), g = o(() => !u.value || l.value === m.value), h = o(() => e.showGoButton), S = o(() => !!u.value && l.value > 1), j = o(() => !(p.value && i.value.length <= 1)), N = o(() => e.showPageInfo), M = o(() => e.showPageList), G = o(() => e.showPageNumbers), I = o(() => !0), {
-      renderFirstPage: w,
-      renderPreviousPage: P
-    } = ae(l, C, S, n, t), {
-      renderLastPage: L,
-      renderNextPage: O
-    } = Y(l, g, m, n, t), {
-      renderPageInfo: z
-    } = Z(s, u), {
-      renderPageList: A
-    } = _(l, n, x, u, t), {
-      renderPageNumbers: E
-    } = ee(e, l, i, n, t), {
-      renderGotoButton: T
-    } = X(l, m, n, t);
-    c(l.value, n.value, u.value, 7), k(() => e.totalItems, (b) => {
-      u.value = b, c(l.value, n.value, u.value, 7);
-    }), k(() => e.currentPage, (b, K) => {
-      b !== K && (l.value = b, c(l.value, n.value, u.value, 7));
-    }), k(() => e.pageSize, (b, K) => {
-      b !== K && (n.value = b, c(l.value, n.value, u.value, 7));
-    }), ne(() => {
-      if (!x.value || !x.value.length)
+    }, y = v(() => !o.value || n.value === 1), h = v(() => e.pageList), I = v(() => Math.ceil(o.value / s.value)), b = v(() => !o.value || n.value === I.value), g = v(() => e.showGoButton), f = v(() => !!o.value && n.value > 1), C = v(() => !(t.value && r.value.length <= 1)), N = v(() => e.showPageInfo), j = v(() => e.showPageList), O = v(() => e.showPageNumbers), w = v(() => !0), {
+      renderFirstPage: B,
+      renderPreviousPage: T
+    } = R(n, y, f, s, l), {
+      renderLastPage: z,
+      renderNextPage: M
+    } = X(n, b, I, s, l), {
+      renderPageInfo: $
+    } = Y(i, o), {
+      renderPageList: G
+    } = Z(n, s, h, o, l), {
+      renderPageNumbers: F
+    } = _(e, n, r, s, l), {
+      renderGotoButton: V
+    } = U(n, I, s, l);
+    u(n.value, s.value, o.value, 7), S(() => e.totalItems, (m) => {
+      o.value = m, u(n.value, s.value, o.value, 7);
+    }), S(() => e.currentPage, (m, L) => {
+      m !== L && (n.value = m, u(n.value, s.value, o.value, 7));
+    }), S(() => e.pageSize, (m, L) => {
+      m !== L && (s.value = m, u(n.value, s.value, o.value, 7));
+    }), q(() => {
+      if (!h.value || !h.value.length)
         return;
-      const b = x.value.includes(n.value);
-      n.value = b ? n.value : x.value[0], b || t.emit("update:pageSize", n.value);
+      const m = h.value.includes(s.value);
+      s.value = m ? s.value : h.value[0], m || l.emit("update:pageSize", s.value);
     })();
-    const D = o(() => ({
+    const A = v(() => ({
       "d-flex": !0,
       "flex-wrap": !0,
       "justify-content-end": !0,
       "w-100": !0,
       "ngx-pagination": !0,
       pagination: !0,
-      responsive: v.value,
-      "pager-viewmode-default": r.value === "default",
-      "pager-viewmode-simple": r.value === "simple"
-    })), R = o(() => ({
+      responsive: p.value,
+      "pager-viewmode-default": e.mode === "default",
+      "pager-viewmode-simple": e.mode === "simple"
+    })), W = v(() => ({
       position: "relative",
-      "justify-content": s.value === "center" ? "center" : "start"
+      "justify-content": i.value === "center" ? "center" : "start"
     }));
-    function W() {
-      return a(F, null, [N.value && z(), M.value && A(), I.value && w(), I.value && P(), G.value && E(), I.value && O(), I.value && L(), h.value && T()]);
+    function D() {
+      return a(P, null, [N.value && $(), j.value && G(), w.value && B(), w.value && T(), O.value && F(), w.value && M(), w.value && z(), g.value && V()]);
     }
     function H() {
-      return a(F, null, [a("li", {
+      return a(P, null, [a("li", {
         class: "page-item d-flex flex-fill"
-      }, null), I.value && w(), I.value && P(), T(), a("li", {
+      }, null), w.value && B(), w.value && T(), V(), a("li", {
         class: "page-item page-separator",
         style: "margin-left: 10px"
       }, [a("span", {
         style: "font-size: 15px; font-weight: 200;"
-      }, [$(" /")])]), a("li", {
+      }, [E(" /")])]), a("li", {
         class: "page-item page-total",
         style: "margin-left: 5px"
       }, [a("span", {
         style: "font-size: 16px; font-weight: 600;"
-      }, [$(" "), m.value])]), I.value && O(), I.value && L()]);
+      }, [E(" "), I.value])]), w.value && M(), w.value && z()]);
     }
     return () => a("div", {
       class: "pagination-container",
-      style: d
+      style: c
     }, [e.disabled && a("div", {
-      style: y
-    }, null), j.value && a("ul", {
-      role: "navigation",
-      class: D.value,
-      style: R.value
-    }, [r.value === "default" ? W() : H()])]);
-  }
-}), ke = /* @__PURE__ */ Q({
-  name: "FPagination",
-  props: J,
-  emits: ["pageIndexChanged", "pageSizeChanged"],
-  setup(e, t) {
-    const v = f(!1), r = f(e.mode), s = f(""), p = f(!1), n = f(e.pageSize), l = f(e.currentPage), u = f(e.totalItems), i = f(), c = le("design-item-context"), d = ue(i, c);
-    se(() => {
-      i.value.componentInstance = d;
-    }), t.expose(d.value);
-    const {
-      pages: y,
-      updatePages: C
-    } = te(), x = o(() => l.value === 1), m = o(() => [20, 50, 100]), g = o(() => Math.ceil(u.value / n.value)), h = o(() => l.value === g.value), S = o(() => !0), j = o(() => l.value > 1), N = o(() => !(p.value && y.value.length <= 1)), M = o(() => !0), G = o(() => !0), I = o(() => !0), w = o(() => !0), {
-      renderFirstPage: P,
-      renderPreviousPage: L
-    } = ae(l, x, j, n, t), {
-      renderLastPage: O,
-      renderNextPage: z
-    } = Y(l, h, g, n, t), {
-      renderPageInfo: A
-    } = Z(s, u), {
-      renderPageList: E
-    } = _(l, n, m, u, t), {
-      renderPageNumbers: T
-    } = ee(e, l, y, n, t), {
-      renderGotoButton: q
-    } = X(l, g, n, t);
-    C(l.value, n.value, u.value, 7), k([l, n], () => {
-      C(l.value, n.value, u.value, 7);
-    }), k(l, () => {
-      t.emit("pageIndexChanged", l.value);
-    }), k(n, () => {
-      t.emit("pageSizeChanged", n.value);
-    });
-    const D = o(() => ({
-      "ngx-pagination": !0,
-      pagination: !0,
-      responsive: v.value,
-      "pager-viewmode-default": r.value === "default",
-      "pager-viewmode-simple": r.value === "simple"
-    })), R = o(() => ({
-      position: "relative",
-      "justify-content": s.value === "center" ? "center" : "start"
-    }));
-    function W() {
-      return a(F, null, [M.value && A(), G.value && E(), w.value && P(), w.value && L(), I.value && T(), w.value && z(), w.value && O(), S.value && q()]);
-    }
-    function H() {
-      return a(F, null, [a("li", {
-        class: "page-item d-flex flex-fill"
-      }, null), w.value && P(), w.value && L(), q(), a("li", {
-        class: "page-item page-separator",
-        style: "margin-left: 10px"
-      }, [a("span", {
-        style: "font-size: 15px; font-weight: 200;"
-      }, [$(" /")])]), a("li", {
-        class: "page-item page-total",
-        style: "margin-left: 5px"
-      }, [a("span", {
-        style: "font-size: 16px; font-weight: 600;"
-      }, [$(" "), g.value])]), w.value && z(), w.value && O()]);
-    }
-    return () => a("div", {
-      ref: i,
-      class: "pagination-container"
-    }, [N.value && a("ul", {
+      style: d
+    }, null), C.value && a("ul", {
       role: "navigation",
-      class: D.value,
-      style: R.value
-    }, [r.value === "default" ? W() : H()])]);
+      class: A.value,
+      style: W.value
+    }, [e.mode === "default" ? D() : H()])]);
   }
-});
-V.register = (e, t, v) => {
-  e.pagination = V, t.pagination = U;
-};
-V.registerDesigner = (e, t, v) => {
-  e.pagination = ke, t.pagination = U;
-};
-const Be = re(V);
+}), ue = J(ae);
 export {
-  V as FPagination,
-  Be as default,
-  J as paginationProps,
-  U as propsResolver
+  ae as FPagination,
+  ue as default,
+  Q as paginationProps
 };