vft 0.0.18 → 0.0.20

package/es/components/pagination/components/total.vue2.mjs

@@ -0,0 +1,26 @@
+import { defineComponent as i, openBlock as n, createElementBlock as r, normalizeClass as s, unref as t, toDisplayString as p } from "vue";
+import { useNamespace as m } from "../../../hooks/use-namespace/index.mjs";
+import "@popperjs/core";
+import "lodash";
+import "../../../hooks/use-z-index/index.mjs";
+import "@vueuse/core";
+import "@vue/shared";
+import "@vft/utils";
+import { usePagination as l } from "../usePagination.mjs";
+const c = ["disabled"], y = /* @__PURE__ */ i({
+  __name: "total",
+  props: {
+    total: { default: 1e3 }
+  },
+  setup(o) {
+    const e = m("pagination"), { disabled: a } = l();
+    return (d, f) => (n(), r("span", {
+      class: s(t(e).e("total")),
+      disabled: t(a)
+    }, p(o.total), 11, c));
+  }
+});
+export {
+  y as default
+};
+//# sourceMappingURL=total.vue2.mjs.map

package/es/components/pagination/components/total.vue2.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"total.vue2.mjs","sources":["../../../../../../packages/components/pagination/components/total.vue"],"sourcesContent":["<template>\n  <span :class=\"ns.e('total')\" :disabled=\"disabled\">\n    {{ total }}\n  </span>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useNamespace } from '@vft-ui/hooks';\nimport { usePagination } from '../usePagination';\n\nconst ns = useNamespace('pagination');\nconst { disabled } = usePagination();\n\ninterface Props {\n  total: number;\n}\n\ndefineProps({\n  \"total\": { default: 1000 }\n})\n</script>\n"],"names":["ns","useNamespace","disabled","usePagination"],"mappings":";;;;;;;;;;;;;;;AAUM,UAAAA,IAAKC,EAAa,YAAY,GAC9B,EAAE,UAAAC,MAAaC;;;;;;;"}

package/es/components/pagination/index.d.ts

@@ -0,0 +1,121 @@
+export declare const VftPagination: import("vft/es/utils").SFCWithInstall<import("vue").DefineComponent<{
+    total: NumberConstructor;
+    pageSize: NumberConstructor;
+    defaultPageSize: NumberConstructor;
+    currentPage: NumberConstructor;
+    defaultCurrentPage: NumberConstructor;
+    pageCount: NumberConstructor;
+    pagerCount: {
+        type: NumberConstructor;
+        validator: (value: unknown) => boolean;
+        default: number;
+    };
+    layout: {
+        type: StringConstructor;
+        default: string;
+    };
+    pageSizes: {
+        type: ArrayConstructor;
+        default: number[];
+    };
+    popperClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    prevText: {
+        type: StringConstructor;
+        default: string;
+    };
+    prevIcon: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    nextText: {
+        type: StringConstructor;
+        default: string;
+    };
+    nextIcon: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    small: BooleanConstructor;
+    background: BooleanConstructor;
+    disabled: BooleanConstructor;
+    hideOnSinglePage: BooleanConstructor;
+}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    'update:current-page': (val: number) => boolean;
+    'update:page-size': (val: number) => boolean;
+    'size-change': (val: number) => boolean;
+    'current-change': (val: number) => boolean;
+    'prev-click': (val: number) => boolean;
+    'next-click': (val: number) => boolean;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    total: NumberConstructor;
+    pageSize: NumberConstructor;
+    defaultPageSize: NumberConstructor;
+    currentPage: NumberConstructor;
+    defaultCurrentPage: NumberConstructor;
+    pageCount: NumberConstructor;
+    pagerCount: {
+        type: NumberConstructor;
+        validator: (value: unknown) => boolean;
+        default: number;
+    };
+    layout: {
+        type: StringConstructor;
+        default: string;
+    };
+    pageSizes: {
+        type: ArrayConstructor;
+        default: number[];
+    };
+    popperClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    prevText: {
+        type: StringConstructor;
+        default: string;
+    };
+    prevIcon: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    nextText: {
+        type: StringConstructor;
+        default: string;
+    };
+    nextIcon: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    small: BooleanConstructor;
+    background: BooleanConstructor;
+    disabled: BooleanConstructor;
+    hideOnSinglePage: BooleanConstructor;
+}>> & {
+    "onUpdate:current-page"?: ((val: number) => any) | undefined;
+    "onUpdate:page-size"?: ((val: number) => any) | undefined;
+    "onSize-change"?: ((val: number) => any) | undefined;
+    "onCurrent-change"?: ((val: number) => any) | undefined;
+    "onPrev-click"?: ((val: number) => any) | undefined;
+    "onNext-click"?: ((val: number) => any) | undefined;
+}, {
+    small: boolean;
+    pagerCount: number;
+    layout: string;
+    pageSizes: unknown[];
+    popperClass: string;
+    prevText: string;
+    prevIcon: string;
+    nextText: string;
+    nextIcon: string;
+    background: boolean;
+    disabled: boolean;
+    hideOnSinglePage: boolean;
+}>> & Record<string, any>;
+export default VftPagination;
+export * from './pagination';
+export * from './usePagination';

package/es/components/pagination/index.mjs

@@ -0,0 +1,16 @@
+import { withInstall as t } from "../../utils/vue/install.mjs";
+import "vue";
+import "@vue/shared";
+import "@vft/utils";
+import o from "./pagination.mjs";
+import { paginationEmits as g } from "./pagination.mjs";
+import { elPaginationKey as l, usePagination as P } from "./usePagination.mjs";
+const p = t(o);
+export {
+  p as VftPagination,
+  p as default,
+  l as elPaginationKey,
+  g as paginationEmits,
+  P as usePagination
+};
+//# sourceMappingURL=index.mjs.map

package/es/components/pagination/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../../packages/components/pagination/index.ts"],"sourcesContent":["import { withInstall } from '@vft-ui/utils'\n\nimport Pagination from './pagination'\n\nexport const VftPagination = withInstall(Pagination)\nexport default VftPagination\n\nexport * from './pagination'\nexport * from './usePagination'\n"],"names":["VftPagination","withInstall","Pagination"],"mappings":";;;;;;;AAIa,MAAAA,IAAgBC,EAAYC,CAAU;"}

package/es/components/pagination/pagination.d.ts

@@ -0,0 +1,237 @@
+import type { VNode } from 'vue';
+export declare const paginationEmits: {
+    'update:current-page': (val: number) => boolean;
+    'update:page-size': (val: number) => boolean;
+    'size-change': (val: number) => boolean;
+    'current-change': (val: number) => boolean;
+    'prev-click': (val: number) => boolean;
+    'next-click': (val: number) => boolean;
+};
+export type PaginationEmits = typeof paginationEmits;
+declare const _default: import("vue").DefineComponent<{
+    /**
+     * @description total item count
+     */
+    total: NumberConstructor;
+    /**
+     * @description options of item count per page
+     */
+    pageSize: NumberConstructor;
+    /**
+     * @description default initial value of page size
+     */
+    defaultPageSize: NumberConstructor;
+    /**
+     * @description current page number
+     */
+    currentPage: NumberConstructor;
+    /**
+     * @description default initial value of current-page
+     */
+    defaultCurrentPage: NumberConstructor;
+    /**
+     * @description total page count. Set either `total` or `page-count` and pages will be displayed; if you need `page-sizes`, `total` is required
+     */
+    pageCount: NumberConstructor;
+    /**
+     * @description number of pagers. Pagination collapses when the total page count exceeds this value
+     */
+    pagerCount: {
+        type: NumberConstructor;
+        validator: (value: unknown) => boolean;
+        default: number;
+    };
+    /**
+     * @description layout of Pagination, elements separated with a comma
+     */
+    layout: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * @description item count of each page
+     */
+    pageSizes: {
+        type: ArrayConstructor;
+        default: number[];
+    };
+    /**
+     * @description custom class name for the page size Select's dropdown
+     */
+    popperClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * @description text for the prev button
+     */
+    prevText: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * @description icon for the prev button, higher priority of `prev-text`
+     */
+    prevIcon: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    /**
+     * @description text for the next button
+     */
+    nextText: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * @description icon for the next button, higher priority of `next-text`
+     */
+    nextIcon: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    /**
+     * @description whether to use small pagination
+     */
+    small: BooleanConstructor;
+    /**
+     * @description whether the buttons have a background color
+     */
+    background: BooleanConstructor;
+    /**
+     * @description whether Pagination is disabled
+     */
+    disabled: BooleanConstructor;
+    /**
+     * @description whether to hide when there's only one page
+     */
+    hideOnSinglePage: BooleanConstructor;
+}, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}> | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    'update:current-page': (val: number) => boolean;
+    'update:page-size': (val: number) => boolean;
+    'size-change': (val: number) => boolean;
+    'current-change': (val: number) => boolean;
+    'prev-click': (val: number) => boolean;
+    'next-click': (val: number) => boolean;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * @description total item count
+     */
+    total: NumberConstructor;
+    /**
+     * @description options of item count per page
+     */
+    pageSize: NumberConstructor;
+    /**
+     * @description default initial value of page size
+     */
+    defaultPageSize: NumberConstructor;
+    /**
+     * @description current page number
+     */
+    currentPage: NumberConstructor;
+    /**
+     * @description default initial value of current-page
+     */
+    defaultCurrentPage: NumberConstructor;
+    /**
+     * @description total page count. Set either `total` or `page-count` and pages will be displayed; if you need `page-sizes`, `total` is required
+     */
+    pageCount: NumberConstructor;
+    /**
+     * @description number of pagers. Pagination collapses when the total page count exceeds this value
+     */
+    pagerCount: {
+        type: NumberConstructor;
+        validator: (value: unknown) => boolean;
+        default: number;
+    };
+    /**
+     * @description layout of Pagination, elements separated with a comma
+     */
+    layout: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * @description item count of each page
+     */
+    pageSizes: {
+        type: ArrayConstructor;
+        default: number[];
+    };
+    /**
+     * @description custom class name for the page size Select's dropdown
+     */
+    popperClass: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * @description text for the prev button
+     */
+    prevText: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * @description icon for the prev button, higher priority of `prev-text`
+     */
+    prevIcon: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    /**
+     * @description text for the next button
+     */
+    nextText: {
+        type: StringConstructor;
+        default: string;
+    };
+    /**
+     * @description icon for the next button, higher priority of `next-text`
+     */
+    nextIcon: {
+        type: StringConstructor;
+        default: () => string;
+    };
+    /**
+     * @description whether to use small pagination
+     */
+    small: BooleanConstructor;
+    /**
+     * @description whether the buttons have a background color
+     */
+    background: BooleanConstructor;
+    /**
+     * @description whether Pagination is disabled
+     */
+    disabled: BooleanConstructor;
+    /**
+     * @description whether to hide when there's only one page
+     */
+    hideOnSinglePage: BooleanConstructor;
+}>> & {
+    "onUpdate:current-page"?: ((val: number) => any) | undefined;
+    "onUpdate:page-size"?: ((val: number) => any) | undefined;
+    "onSize-change"?: ((val: number) => any) | undefined;
+    "onCurrent-change"?: ((val: number) => any) | undefined;
+    "onPrev-click"?: ((val: number) => any) | undefined;
+    "onNext-click"?: ((val: number) => any) | undefined;
+}, {
+    small: boolean;
+    pagerCount: number;
+    layout: string;
+    pageSizes: unknown[];
+    popperClass: string;
+    prevText: string;
+    prevIcon: string;
+    nextText: string;
+    nextIcon: string;
+    background: boolean;
+    disabled: boolean;
+    hideOnSinglePage: boolean;
+}>;
+export default _default;

package/es/components/pagination/pagination.mjs

@@ -0,0 +1,251 @@
+import { isNumber as g } from "@vft/utils";
+import { defineComponent as w, getCurrentInstance as A, computed as s, ref as y, watch as E, provide as M, h as l } from "vue";
+import { useNamespace as U } from "../../hooks/use-namespace/index.mjs";
+import "@popperjs/core";
+import "lodash";
+import "../../hooks/use-z-index/index.mjs";
+import "@vueuse/core";
+import "@vue/shared";
+import $ from "./components/prev.vue2.mjs";
+import j from "./components/next.vue2.mjs";
+import L from "./components/sizes.vue2.mjs";
+import R from "./components/jumper.vue2.mjs";
+import W from "./components/total.vue2.mjs";
+import O from "./components/pager.vue2.mjs";
+import { elPaginationKey as V } from "./usePagination.mjs";
+const n = (e) => typeof e != "number", K = {
+  "update:current-page": (e) => g(e),
+  "update:page-size": (e) => g(e),
+  "size-change": (e) => g(e),
+  "current-change": (e) => g(e),
+  "prev-click": (e) => g(e),
+  "next-click": (e) => g(e)
+}, q = "VftPagination", ue = w({
+  name: q,
+  props: {
+    /**
+     * @description total item count
+     */
+    total: Number,
+    /**
+     * @description options of item count per page
+     */
+    pageSize: Number,
+    /**
+     * @description default initial value of page size
+     */
+    defaultPageSize: Number,
+    /**
+     * @description current page number
+     */
+    currentPage: Number,
+    /**
+     * @description default initial value of current-page
+     */
+    defaultCurrentPage: Number,
+    /**
+     * @description total page count. Set either `total` or `page-count` and pages will be displayed; if you need `page-sizes`, `total` is required
+     */
+    pageCount: Number,
+    /**
+     * @description number of pagers. Pagination collapses when the total page count exceeds this value
+     */
+    pagerCount: {
+      type: Number,
+      validator: (e) => g(e) && Math.trunc(e) === e && e > 4 && e < 22 && e % 2 === 1,
+      default: 7
+    },
+    /**
+     * @description layout of Pagination, elements separated with a comma
+     */
+    layout: {
+      type: String,
+      default: ["prev", "pager", "next", "jumper", "->", "total"].join(", ")
+    },
+    /**
+     * @description item count of each page
+     */
+    pageSizes: {
+      type: Array,
+      default: [10, 20, 30, 40, 50, 100]
+    },
+    /**
+     * @description custom class name for the page size Select's dropdown
+     */
+    popperClass: {
+      type: String,
+      default: ""
+    },
+    /**
+     * @description text for the prev button
+     */
+    prevText: {
+      type: String,
+      default: ""
+    },
+    /**
+     * @description icon for the prev button, higher priority of `prev-text`
+     */
+    prevIcon: {
+      type: String,
+      default: () => "ArrowLeft"
+    },
+    /**
+     * @description text for the next button
+     */
+    nextText: {
+      type: String,
+      default: ""
+    },
+    /**
+     * @description icon for the next button, higher priority of `next-text`
+     */
+    nextIcon: {
+      type: String,
+      default: () => "ArrowRight"
+    },
+    /**
+     * @description whether to use small pagination
+     */
+    small: Boolean,
+    /**
+     * @description whether the buttons have a background color
+     */
+    background: Boolean,
+    /**
+     * @description whether Pagination is disabled
+     */
+    disabled: Boolean,
+    /**
+     * @description whether to hide when there's only one page
+     */
+    hideOnSinglePage: Boolean
+  },
+  emits: K,
+  setup(e, { emit: o, slots: f }) {
+    const r = U("pagination"), c = A().vnode.props || {}, v = "onUpdate:currentPage" in c || "onUpdate:current-page" in c || "onCurrentChange" in c, p = "onUpdate:pageSize" in c || "onUpdate:page-size" in c || "onSizeChange" in c, _ = s(() => {
+      if (n(e.total) && n(e.pageCount) || !n(e.currentPage) && !v)
+        return !1;
+      if (e.layout.includes("sizes")) {
+        if (n(e.pageCount)) {
+          if (!n(e.total) && !n(e.pageSize) && !p)
+            return !1;
+        } else if (!p)
+          return !1;
+      }
+      return !0;
+    }), P = y(n(e.defaultPageSize) ? 10 : e.defaultPageSize), b = y(n(e.defaultCurrentPage) ? 1 : e.defaultCurrentPage), C = s({
+      get() {
+        return n(e.pageSize) ? P.value : e.pageSize;
+      },
+      set(a) {
+        n(e.pageSize) && (P.value = a), p && (o("update:page-size", a), o("size-change", a));
+      }
+    }), u = s(() => {
+      let a = 0;
+      return n(e.pageCount) ? n(e.total) || (a = Math.max(1, Math.ceil(e.total / C.value))) : a = e.pageCount, a;
+    }), i = s({
+      get() {
+        return n(e.currentPage) ? b.value : e.currentPage;
+      },
+      set(a) {
+        let t = a;
+        a < 1 ? t = 1 : a > u.value && (t = u.value), n(e.currentPage) && (b.value = t), v && (o("update:current-page", t), o("current-change", t));
+      }
+    });
+    E(u, (a) => {
+      i.value > a && (i.value = a);
+    });
+    function z(a) {
+      i.value = a;
+    }
+    function N(a) {
+      C.value = a;
+      const t = u.value;
+      i.value > t && (i.value = t);
+    }
+    function k() {
+      e.disabled || (i.value -= 1, o("prev-click", i.value));
+    }
+    function T() {
+      e.disabled || (i.value += 1, o("next-click", i.value));
+    }
+    function m(a, t) {
+      a && (a.props || (a.props = {}), a.props.class = [a.props.class, t].join(" "));
+    }
+    return M(V, {
+      pageCount: u,
+      disabled: s(() => e.disabled),
+      currentPage: i,
+      changeEvent: z,
+      handleSizeChange: N
+    }), () => {
+      var x;
+      if (!_.value || !e.layout || e.hideOnSinglePage && u.value <= 1)
+        return null;
+      const a = [], t = [], B = l("div", { class: r.e("rightwrapper") }, t), S = {
+        prev: l($, {
+          disabled: e.disabled,
+          currentPage: i.value,
+          prevText: e.prevText,
+          prevIcon: e.prevIcon,
+          onClick: k
+        }),
+        jumper: l(R, {
+          size: e.small ? "small" : "default"
+        }),
+        pager: l(O, {
+          currentPage: i.value,
+          pageCount: u.value,
+          pagerCount: e.pagerCount,
+          onChange: z,
+          disabled: e.disabled
+        }),
+        next: l(j, {
+          disabled: e.disabled,
+          currentPage: i.value,
+          pageCount: u.value,
+          nextText: e.nextText,
+          nextIcon: e.nextIcon,
+          onClick: T
+        }),
+        sizes: l(L, {
+          pageSize: C.value,
+          pageSizes: e.pageSizes,
+          popperClass: e.popperClass,
+          disabled: e.disabled,
+          size: e.small ? "small" : "default"
+        }),
+        slot: ((x = f == null ? void 0 : f.default) == null ? void 0 : x.call(f)) ?? null,
+        total: l(W, { total: n(e.total) ? 0 : e.total })
+      }, I = e.layout.split(",").map((d) => d.trim());
+      let h = !1;
+      return I.forEach((d) => {
+        if (d === "->") {
+          h = !0;
+          return;
+        }
+        h ? t.push(S[d]) : a.push(S[d]);
+      }), m(a[0], r.is("first")), m(a[a.length - 1], r.is("last")), h && t.length > 0 && (m(t[0], r.is("first")), m(t[t.length - 1], r.is("last")), a.push(B)), l(
+        "div",
+        {
+          role: "pagination",
+          "aria-label": "pagination",
+          class: [
+            r.b(),
+            r.is("background", e.background),
+            {
+              [r.m("small")]: e.small
+            }
+          ]
+        },
+        a
+      );
+    };
+  }
+});
+export {
+  ue as default,
+  K as paginationEmits
+};
+//# sourceMappingURL=pagination.mjs.map