@owocow/saber-ui 0.1.12 → 0.1.14

package/dist/forms/index.d.ts

@@ -1,3 +1,4 @@
+export type { SaberControlSize } from '../control-size';
 export { default as SaberFilterBar } from './components/SaberFilterBar.vue';
 export { default as SaberFormModal } from './components/SaberFormModal.vue';
 export { default as SaberModal } from './components/SaberModal.vue';

package/dist/forms/pop-select.mjs

@@ -1,4 +1,4 @@
-import { _ as f } from "../SaberPopSelect.vue_vue_type_script_setup_true_lang-BcS27NXI.js";
+import { _ as f } from "../SaberPopSelect.vue_vue_type_script_setup_true_lang-eH8jkkzK.js";
 export {
   f as default
 };

package/dist/forms.mjs

@@ -1,10 +1,10 @@
-import { F as r, _ as s, a as o, b as t, c as i, d as c, e as m, f as S, g as p, h as b, i as l, j as u, k as D, l as f, r as x, u as n } from "./plugin-Dr3z0YFg.js";
+import { F as r, _ as s, a as o, b as t, c as i, d as c, e as m, f as S, g as p, h as b, i as l, j as u, k as D, l as f, r as x, u as n } from "./plugin-DvH6j00c.js";
 import { _ } from "./SaberModal.vue_vue_type_script_setup_true_lang-DJno3jA3.js";
 import { _ as g } from "./SaberDictCheckbox.vue_vue_type_script_setup_true_lang-DUbzy_C6.js";
 import { _ as v, a as R } from "./SaberDictRadio.vue_vue_type_script_setup_true_lang-DR6-jSID.js";
-import { _ as C } from "./SaberDictSelect.vue_vue_type_script_setup_true_lang-B8PTKNKX.js";
-import { _ as K } from "./SaberPopSelect.vue_vue_type_script_setup_true_lang-BcS27NXI.js";
-import { _ as U } from "./SaberDistrictSelect.vue_vue_type_script_setup_true_lang-BX8nLC35.js";
+import { _ as C } from "./SaberDictSelect.vue_vue_type_script_setup_true_lang-BKdOdlFX.js";
+import { _ as K } from "./SaberPopSelect.vue_vue_type_script_setup_true_lang-eH8jkkzK.js";
+import { _ as U } from "./SaberDistrictSelect.vue_vue_type_script_setup_true_lang-jkl2AOay.js";
 import { _ as k } from "./SaberUploadImage.vue_vue_type_script_setup_true_lang-CAwci2Vr.js";
 import { D as G, u as j } from "./use-dict-options-DjtbYYIa.js";
 import { U as N } from "./upload-image-source-On8NHgmx.js";

package/dist/index.d.ts

@@ -6,8 +6,10 @@ import { default as SaberConfirmProvider } from './components/SaberConfirmProvid
 import { default as SaberInfo } from './components/SaberInfo.vue';
 import { default as SaberInfoProvider } from './components/SaberInfoProvider.vue';
 import { default as SaberModalWithMobile } from './components/SaberModalWithMobile.vue';
+import { default as SaberPagination } from './components/SaberPagination.vue';
 import { default as SaberStatus } from './components/SaberStatus.vue';
 import { default as SaberSwitchBar } from './components/SaberSwitchBar.vue';
+import { default as SaberAppLayout } from './components/layout/SaberAppLayout.vue';
 import { default as SaberAppSidebar } from './components/navigation/SaberAppSidebar.vue';
 import { default as SaberNavigationSearch } from './components/navigation/SaberNavigationSearch.vue';
 import { default as SaberFilterBar } from './forms/components/SaberFilterBar.vue';
@@ -24,6 +26,7 @@ import { default as SaberRadioGroup } from './forms/components/fields/SaberRadio
 import { default as SaberSelect } from './forms/components/fields/SaberSelect.vue';
 import { default as SaberTextarea } from './forms/components/fields/SaberTextarea.vue';
 import { SaberFormsOptions } from './forms/plugin';
+export type { SaberControlSize } from './control-size';
 export interface SaberUIOptions {
     forms?: SaberFormsOptions;
 }
@@ -33,10 +36,11 @@ export { BadgeStatus as SaberBadgeStatus };
 export type { BadgeStatusProps } from './BadgeStatus.types';
 export { SaberNoData };
 export type { SaberNoDataProps } from './SaberNoData.types';
-export { SaberConfirmModal, SaberConfirmProvider, SaberInfo, SaberInfoProvider, SaberModalWithMobile, SaberAppSidebar, SaberNavigationSearch, SaberStatus, SaberSwitchBar, };
+export { SaberConfirmModal, SaberConfirmProvider, SaberInfo, SaberInfoProvider, SaberModalWithMobile, SaberPagination, SaberAppLayout, SaberAppSidebar, SaberNavigationSearch, SaberStatus, SaberSwitchBar, };
 export type { SaberInfoContext, SaberInfoMode, SaberInfoProps, SaberInfoVariant } from './components/SaberInfo.types';
 export type { SaberStatusType } from './components/SaberStatus.types';
 export type { SaberSwitchBarItem, SaberSwitchBarUI, SaberSwitchBarValue } from './components/SaberSwitchBar.types';
+export type { SaberAppLayoutMaxWidth, SaberAppLayoutMode, SaberAppLayoutNavigationSlotContext, SaberAppLayoutProps, SaberAppLayoutUI, } from './components/layout/SaberAppLayout.types';
 export type { SaberAppSidebarUI, SaberNavigationGroup, SaberNavigationItem, SaberNavigationSearchGroup, SaberNavigationSearchUI, SaberNavigationSection, SaberNavigationSelectPayload, SaberNavigationSelectSource, } from './components/navigation/SaberAppSidebar.types';
 export { SaberFilterBar, SaberFormModal, SaberDictCheckbox, SaberDictRadio, SaberDictSelect, SaberDistrictSelect, SaberInput, SaberInputNumber, SaberModal, SaberPopSelect, SaberRadioGroup, SaberSelect, SaberTextarea, };
 export { installSaberForms, type SaberFormsOptions } from './forms/plugin';
@@ -51,10 +55,12 @@ declare module 'vue' {
         SaberInfo: typeof SaberInfo;
         SaberInfoProvider: typeof SaberInfoProvider;
         SaberModalWithMobile: typeof SaberModalWithMobile;
+        SaberPagination: typeof SaberPagination;
         SaberStatus: typeof SaberStatus;
         SaberSwitchBar: typeof SaberSwitchBar;
         SaberAppSidebar: typeof SaberAppSidebar;
         SaberNavigationSearch: typeof SaberNavigationSearch;
+        SaberAppLayout: typeof SaberAppLayout;
         SaberFilterBar: typeof SaberFilterBar;
         SaberFormModal: typeof SaberFormModal;
         SaberModal: typeof SaberModal;

package/dist/index.mjs

@@ -1,25 +1,29 @@
-import h from "@nuxt/ui/vue-plugin";
-import y from "@nuxt/ui/components/Badge.vue";
-import { defineComponent as _, computed as f, openBlock as s, createBlock as $, normalizeStyle as v, withCtx as C, createTextVNode as k, toDisplayString as d, createElementBlock as i, normalizeClass as B, createElementVNode as l, createVNode as I, createCommentVNode as m, renderSlot as u } from "vue";
-import N from "@nuxt/ui/runtime/vue/components/Icon.vue";
-import { _ as D } from "./SaberConfirmModal.vue_vue_type_script_setup_true_lang-Cqp9krYl.js";
-import { _ as M } from "./SaberConfirmProvider.vue_vue_type_script_setup_true_lang-DUJ6ftNJ.js";
-import { _ as w } from "./SaberInfo.vue_vue_type_script_setup_true_lang-B3W5VsGR.js";
-import { _ as P } from "./SaberInfoProvider.vue_vue_type_script_setup_true_lang-3rF6bSCn.js";
-import { _ as z } from "./SaberModalWithMobile.vue_vue_type_script_setup_true_lang-aQlToncY.js";
-import { _ as A } from "./SaberStatus.vue_vue_type_script_setup_true_lang-D9aRVCow.js";
-import { _ as F } from "./SaberSwitchBar.vue_vue_type_script_setup_true_lang-CDx3Dcas.js";
-import { _ as U } from "./SaberAppSidebar.vue_vue_type_script_setup_true_lang-HXyIXiau.js";
-import { _ as V } from "./SaberNavigationSearch.vue_vue_type_script_setup_true_lang-Bj96kMla.js";
-import { k as W } from "./plugin-Dr3z0YFg.js";
-import { _ as be, a as fe, b as ue, c as Se, d as _e, e as pe } from "./plugin-Dr3z0YFg.js";
-import { _ as xe } from "./SaberModal.vue_vue_type_script_setup_true_lang-DJno3jA3.js";
-import { _ as ye } from "./SaberDictCheckbox.vue_vue_type_script_setup_true_lang-DUbzy_C6.js";
-import { _ as ve, a as Ce } from "./SaberDictRadio.vue_vue_type_script_setup_true_lang-DR6-jSID.js";
-import { _ as Be } from "./SaberDictSelect.vue_vue_type_script_setup_true_lang-B8PTKNKX.js";
-import { _ as Ne } from "./SaberDistrictSelect.vue_vue_type_script_setup_true_lang-BX8nLC35.js";
-import { _ as Me } from "./SaberPopSelect.vue_vue_type_script_setup_true_lang-BcS27NXI.js";
-const b = {
+import A from "@nuxt/ui/vue-plugin";
+import V from "@nuxt/ui/components/Badge.vue";
+import { defineComponent as h, computed as m, openBlock as u, createBlock as F, normalizeStyle as L, withCtx as O, createTextVNode as v, toDisplayString as S, createElementBlock as d, normalizeClass as c, createElementVNode as p, createVNode as $, createCommentVNode as b, renderSlot as y } from "vue";
+import R from "@nuxt/ui/runtime/vue/components/Icon.vue";
+import { _ as E } from "./SaberConfirmModal.vue_vue_type_script_setup_true_lang-Cqp9krYl.js";
+import { _ as T } from "./SaberConfirmProvider.vue_vue_type_script_setup_true_lang-DUJ6ftNJ.js";
+import { _ as W } from "./SaberInfo.vue_vue_type_script_setup_true_lang-B3W5VsGR.js";
+import { _ as j } from "./SaberInfoProvider.vue_vue_type_script_setup_true_lang-3rF6bSCn.js";
+import { _ as H } from "./SaberModalWithMobile.vue_vue_type_script_setup_true_lang-aQlToncY.js";
+import G from "@nuxt/ui/components/Pagination.vue";
+import K from "@nuxt/ui/components/Select.vue";
+import { S as Z } from "./SaberPopSelect.vue_vue_type_script_setup_true_lang-eH8jkkzK.js";
+import { _ as De } from "./SaberPopSelect.vue_vue_type_script_setup_true_lang-eH8jkkzK.js";
+import { _ as q } from "./SaberStatus.vue_vue_type_script_setup_true_lang-D9aRVCow.js";
+import { _ as J } from "./SaberSwitchBar.vue_vue_type_script_setup_true_lang-CIbFBx5r.js";
+import { _ as Q } from "./SaberAppLayout.vue_vue_type_script_setup_true_lang-DaxscIFe.js";
+import { _ as X } from "./SaberAppSidebar.vue_vue_type_script_setup_true_lang-Cwuj9VNi.js";
+import { _ as Y } from "./SaberNavigationSearch.vue_vue_type_script_setup_true_lang-Bj96kMla.js";
+import { k as ee } from "./plugin-DvH6j00c.js";
+import { _ as Ae, a as Ve, b as Fe, c as Le, d as Oe, e as Re } from "./plugin-DvH6j00c.js";
+import { _ as Te } from "./SaberModal.vue_vue_type_script_setup_true_lang-DJno3jA3.js";
+import { _ as je } from "./SaberDictCheckbox.vue_vue_type_script_setup_true_lang-DUbzy_C6.js";
+import { _ as Ge, a as Ke } from "./SaberDictRadio.vue_vue_type_script_setup_true_lang-DR6-jSID.js";
+import { _ as qe } from "./SaberDictSelect.vue_vue_type_script_setup_true_lang-BKdOdlFX.js";
+import { _ as Qe } from "./SaberDistrictSelect.vue_vue_type_script_setup_true_lang-jkl2AOay.js";
+const z = {
   red: { 500: "#ef4444", 600: "#dc2626" },
   orange: { 500: "#f97316", 600: "#ea580c" },
   amber: { 500: "#f59e0b", 600: "#d97706" },
@@ -42,16 +46,16 @@ const b = {
   zinc: { 500: "#71717a", 600: "#52525b" },
   neutral: { 500: "#737373", 600: "#525252" },
   stone: { 500: "#78716c", 600: "#57534e" }
-}, H = b.gray;
-function S(e, t) {
-  var o, a;
-  return ((o = b[e]) == null ? void 0 : o[t]) ?? ((a = b[e]) == null ? void 0 : a[500]) ?? H[500];
+}, te = z.gray;
+function D(e, a) {
+  var t, s;
+  return ((t = z[e]) == null ? void 0 : t[a]) ?? ((s = z[e]) == null ? void 0 : s[500]) ?? te[500];
 }
-function R(e, t) {
-  const o = parseInt(e.slice(1, 3), 16), a = parseInt(e.slice(3, 5), 16), r = parseInt(e.slice(5, 7), 16);
-  return `rgba(${o}, ${a}, ${r}, ${t / 100})`;
+function ae(e, a) {
+  const t = parseInt(e.slice(1, 3), 16), s = parseInt(e.slice(3, 5), 16), n = parseInt(e.slice(5, 7), 16);
+  return `rgba(${t}, ${s}, ${n}, ${a / 100})`;
 }
-const T = /* @__PURE__ */ _({
+const oe = /* @__PURE__ */ h({
   __name: "BadgeStatus",
   props: {
     value: {},
@@ -60,40 +64,40 @@ const T = /* @__PURE__ */ _({
     textColorWeight: { default: 500 }
   },
   setup(e) {
-    const t = e, o = f(() => {
-      const r = String(t.value);
-      for (const c of t.config) {
-        const n = c.split(":");
-        if (n.length < 2) continue;
-        const p = n[0], g = n[1], x = n[2] || "gray";
-        if (g === r)
-          return { label: p, color: x };
+    const a = e, t = m(() => {
+      const n = String(a.value);
+      for (const l of a.config) {
+        const r = l.split(":");
+        if (r.length < 2) continue;
+        const g = r[0], _ = r[1], o = r[2] || "gray";
+        if (_ === n)
+          return { label: g, color: o };
       }
-      return { label: r, color: "gray" };
-    }), a = f(() => {
-      const { color: r } = o.value, c = S(r, 500), n = S(r, t.textColorWeight);
+      return { label: n, color: "gray" };
+    }), s = m(() => {
+      const { color: n } = t.value, l = D(n, 500), r = D(n, a.textColorWeight);
       return {
-        backgroundColor: R(c, t.bgOpacity),
-        color: n
+        backgroundColor: ae(l, a.bgOpacity),
+        color: r
       };
     });
-    return (r, c) => {
-      const n = y;
-      return s(), $(n, {
-        style: v(a.value),
+    return (n, l) => {
+      const r = V;
+      return u(), F(r, {
+        style: L(s.value),
         class: "inline-flex items-center rounded-full border-0 pt-0.75 pb-0.75 px-2 text-xs font-medium"
       }, {
-        default: C(() => [
-          k(d(o.value.label), 1)
+        default: O(() => [
+          v(S(t.value.label), 1)
         ]),
         _: 1
       }, 8, ["style"]);
     };
   }
-}), E = { class: "rounded-md border border-accented p-3" }, L = { class: "flex flex-col gap-1" }, O = { class: "text-base font-semibold mb-2 text-highlighted w-60" }, j = {
+}), re = { class: "rounded-md border border-accented p-3" }, se = { class: "flex flex-col gap-1" }, ne = { class: "text-base font-semibold mb-2 text-highlighted w-60" }, ie = {
   key: 0,
   class: "text-sm text-muted w-60"
-}, G = { key: 0 }, K = { key: 1 }, q = /* @__PURE__ */ _({
+}, le = { key: 0 }, ce = { key: 1 }, me = /* @__PURE__ */ h({
   name: "SaberNoData",
   __name: "SaberNoData",
   props: {
@@ -104,64 +108,140 @@ const T = /* @__PURE__ */ _({
     description: { default: "当前列表为空，还没有任何数据" }
   },
   setup(e) {
-    return (t, o) => {
-      const a = N;
-      return s(), i("div", {
-        class: B([
+    return (a, t) => {
+      const s = R;
+      return u(), d("div", {
+        class: c([
           "flex flex-col items-center justify-center gap-6 rounded-md p-10 text-center bg-default",
           e.border && "border border-accented",
-          t.$props.class
+          a.$props.class
         ])
       }, [
-        l("div", E, [
-          I(a, {
+        p("div", re, [
+          $(s, {
             name: e.icon,
             class: "size-5"
           }, null, 8, ["name"])
         ]),
-        l("div", L, [
-          l("h4", O, d(e.title), 1),
-          e.description ? (s(), i("p", j, d(e.description), 1)) : m("", !0)
+        p("div", se, [
+          p("h4", ne, S(e.title), 1),
+          e.description ? (u(), d("p", ie, S(e.description), 1)) : b("", !0)
         ]),
-        t.$slots.default ? (s(), i("div", G, [
-          u(t.$slots, "default")
-        ])) : m("", !0),
-        t.$slots.extra ? (s(), i("p", K, [
-          u(t.$slots, "extra")
-        ])) : m("", !0)
+        a.$slots.default ? (u(), d("div", le, [
+          y(a.$slots, "default")
+        ])) : b("", !0),
+        a.$slots.extra ? (u(), d("p", ce, [
+          y(a.$slots, "extra")
+        ])) : b("", !0)
       ], 2);
     };
   }
-}), le = {
-  install(e, t = {}) {
-    e.use(h), e.component("SaberBadgeStatus", T), e.component("SaberNoData", q), e.component("SaberConfirmModal", D), e.component("SaberConfirmProvider", M), e.component("SaberInfo", w), e.component("SaberInfoProvider", P), e.component("SaberModalWithMobile", z), e.component("SaberStatus", A), e.component("SaberSwitchBar", F), e.component("SaberAppSidebar", U), e.component("SaberNavigationSearch", V), W(e, t.forms);
+}), ue = /* @__PURE__ */ h({
+  __name: "SaberPagination",
+  props: {
+    page: { default: 1 },
+    pageSize: { default: 10 },
+    total: {},
+    pageSizes: { default: () => [10, 20, 50, 100] },
+    size: { default: "lg" },
+    ui: {}
+  },
+  emits: ["update:page", "update:pageSize"],
+  setup(e, { emit: a }) {
+    const t = e, s = a, n = m({
+      get: () => t.page,
+      set: (o) => s("update:page", o)
+    }), l = m({
+      get: () => t.pageSize,
+      set: (o) => s("update:pageSize", o)
+    }), r = m(() => Z[t.size]), g = m(() => t.pageSizes.map((o) => ({ label: `${o} 条/页`, value: o }))), _ = m(() => {
+      var o, i, f;
+      return {
+        ...(o = t.ui) == null ? void 0 : o.pageSizeUi,
+        base: [r.value.height, "text-sm rounded-sm saberButton", (f = (i = t.ui) == null ? void 0 : i.pageSizeUi) == null ? void 0 : f.base].filter(Boolean).join(" ")
+      };
+    });
+    return (o, i) => {
+      var B, C, I, k, N, U, P, w;
+      const f = K, M = G;
+      return u(), d("div", {
+        class: c(["flex w-full items-center justify-between", (B = t.ui) == null ? void 0 : B.root])
+      }, [
+        p("div", {
+          class: c(["flex flex-col gap-1", (C = t.ui) == null ? void 0 : C.info])
+        }, [
+          p("span", {
+            class: c(["text-xs mr-4", (I = t.ui) == null ? void 0 : I.total])
+          }, [
+            i[2] || (i[2] = v("总计 ", -1)),
+            p("b", null, S(t.total), 1),
+            i[3] || (i[3] = v(" 条", -1))
+          ], 2),
+          o.$slots.tips ? (u(), d("div", {
+            key: 0,
+            class: c((k = t.ui) == null ? void 0 : k.tips)
+          }, [
+            y(o.$slots, "tips")
+          ], 2)) : b("", !0)
+        ], 2),
+        p("div", {
+          class: c(["flex items-center gap-2", (N = t.ui) == null ? void 0 : N.controls])
+        }, [
+          $(f, {
+            modelValue: l.value,
+            "onUpdate:modelValue": i[0] || (i[0] = (x) => l.value = x),
+            items: g.value,
+            ui: _.value,
+            size: r.value.nuxtSize,
+            class: c(["w-28", (U = t.ui) == null ? void 0 : U.pageSize])
+          }, null, 8, ["modelValue", "items", "ui", "size", "class"]),
+          $(M, {
+            page: n.value,
+            "onUpdate:page": i[1] || (i[1] = (x) => n.value = x),
+            size: r.value.nuxtSize,
+            "active-color": "primary",
+            "active-variant": "subtle",
+            total: t.total,
+            "items-per-page": l.value,
+            ui: (P = t.ui) == null ? void 0 : P.paginationUi,
+            class: c([r.value.paginationButtons, (w = t.ui) == null ? void 0 : w.pagination])
+          }, null, 8, ["page", "size", "total", "items-per-page", "ui", "class"])
+        ], 2)
+      ], 2);
+    };
+  }
+}), Ue = {
+  install(e, a = {}) {
+    e.use(A), e.component("SaberBadgeStatus", oe), e.component("SaberNoData", me), e.component("SaberConfirmModal", E), e.component("SaberConfirmProvider", T), e.component("SaberInfo", W), e.component("SaberInfoProvider", j), e.component("SaberModalWithMobile", H), e.component("SaberPagination", ue), e.component("SaberStatus", q), e.component("SaberSwitchBar", J), e.component("SaberAppSidebar", X), e.component("SaberNavigationSearch", Y), e.component("SaberAppLayout", Q), ee(e, a.forms);
   }
 };
 export {
-  U as SaberAppSidebar,
-  T as SaberBadgeStatus,
-  D as SaberConfirmModal,
-  M as SaberConfirmProvider,
-  ye as SaberDictCheckbox,
-  ve as SaberDictRadio,
-  Be as SaberDictSelect,
-  Ne as SaberDistrictSelect,
-  be as SaberFilterBar,
-  fe as SaberFormModal,
-  w as SaberInfo,
-  P as SaberInfoProvider,
-  ue as SaberInput,
-  Se as SaberInputNumber,
-  xe as SaberModal,
-  z as SaberModalWithMobile,
-  V as SaberNavigationSearch,
-  q as SaberNoData,
-  Me as SaberPopSelect,
-  Ce as SaberRadioGroup,
-  _e as SaberSelect,
-  A as SaberStatus,
-  F as SaberSwitchBar,
-  pe as SaberTextarea,
-  le as default,
-  W as installSaberForms
+  Q as SaberAppLayout,
+  X as SaberAppSidebar,
+  oe as SaberBadgeStatus,
+  E as SaberConfirmModal,
+  T as SaberConfirmProvider,
+  je as SaberDictCheckbox,
+  Ge as SaberDictRadio,
+  qe as SaberDictSelect,
+  Qe as SaberDistrictSelect,
+  Ae as SaberFilterBar,
+  Ve as SaberFormModal,
+  W as SaberInfo,
+  j as SaberInfoProvider,
+  Fe as SaberInput,
+  Le as SaberInputNumber,
+  Te as SaberModal,
+  H as SaberModalWithMobile,
+  Y as SaberNavigationSearch,
+  me as SaberNoData,
+  ue as SaberPagination,
+  De as SaberPopSelect,
+  Ke as SaberRadioGroup,
+  Oe as SaberSelect,
+  q as SaberStatus,
+  J as SaberSwitchBar,
+  Re as SaberTextarea,
+  Ue as default,
+  ee as installSaberForms
 };