@gsc-basic/components 1.0.2 → 1.0.3

package/dist/es/src/Grid/src/components/Pager.css

@@ -1 +1 @@
-[data-v-8a0548c7],[data-v-8a0548c7]:before,[data-v-8a0548c7]:after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }[data-v-8a0548c7]::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }.text-sm[data-v-8a0548c7]{font-size:.875rem;line-height:1.25rem}
+[data-v-729972d8],[data-v-729972d8]:before,[data-v-729972d8]:after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }[data-v-729972d8]::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }.text-sm[data-v-729972d8]{font-size:.875rem;line-height:1.25rem}

package/dist/es/src/Grid/src/components/Pager.vue.js

@@ -1,8 +1,9 @@
-import { computed as p, createElementBlock as n, openBlock as l, createElementVNode as s, toDisplayString as i, unref as u, Fragment as c, renderList as m } from "vue";
+import { computed as v, openBlock as n, createElementBlock as l, createElementVNode as o, toDisplayString as r, unref as i, Fragment as f, renderList as z, createVNode as p, withCtx as c } from "vue";
 import { useLocale as b } from "../../../hooks/useLocale.js";
+import { GscButton as m } from "../../../Button/index.js";
 import './Pager.css';/* empty css           */
-import v from "../../../../_virtual/_plugin-vue_export-helper.js";
-const f = { class: "gsc-pager" }, y = { class: "text-sm gsc-text-secondary" }, z = ["value"], S = ["value"], N = ["disabled"], $ = { class: "gsc-pager-jumper text-sm" }, k = ["value"], h = { class: "gsc-text-secondary" }, x = ["disabled"], C = {
+import y from "../../../../_virtual/_plugin-vue_export-helper.js";
+const S = { class: "gsc-pager" }, N = { class: "text-sm gsc-text-secondary" }, $ = ["value"], k = ["value"], x = { class: "gsc-pager-jumper text-sm" }, C = ["value"], h = { class: "gsc-text-secondary" }, B = {
   __name: "Pager",
   props: {
     page: { type: Number, default: 1 },
@@ -12,44 +13,52 @@ const f = { class: "gsc-pager" }, y = { class: "text-sm gsc-text-secondary" }, z
   },
   emits: ["update:page", "update:pageSize"],
   setup(t) {
-    const g = t, { t: r } = b(), d = p(() => Math.max(1, Math.ceil((g.total || 0) / (g.pageSize || 1))));
-    return (o, e) => (l(), n("div", f, [
-      s("div", y, i(u(r)("gsc.grid.pager.total", { total: t.total })), 1),
-      s("select", {
+    const d = t, { t: u } = b(), g = v(() => Math.max(1, Math.ceil((d.total || 0) / (d.pageSize || 1))));
+    return (s, e) => (n(), l("div", S, [
+      o("div", N, r(i(u)("gsc.grid.pager.total", { total: t.total })), 1),
+      o("select", {
         class: "gsc-control gsc-control-auto",
         value: t.pageSize,
-        onChange: e[0] || (e[0] = (a) => o.$emit("update:pageSize", Number(a.target.value)))
+        onChange: e[0] || (e[0] = (a) => s.$emit("update:pageSize", Number(a.target.value)))
       }, [
-        (l(!0), n(c, null, m(t.pageSizeOptions, (a) => (l(), n("option", {
+        (n(!0), l(f, null, z(t.pageSizeOptions, (a) => (n(), l("option", {
           key: a,
           value: a
-        }, i(u(r)("gsc.grid.pager.pageSize", { size: a })), 9, S))), 128))
-      ], 40, z),
-      s("button", {
-        class: "gsc-btn gsc-btn-default gsc-btn-icon",
+        }, r(i(u)("gsc.grid.pager.pageSize", { size: a })), 9, k))), 128))
+      ], 40, $),
+      p(i(m), {
+        variant: "default",
+        size: "icon",
         disabled: t.page <= 1,
-        onClick: e[1] || (e[1] = (a) => o.$emit("update:page", t.page - 1))
-      }, [...e[4] || (e[4] = [
-        s("span", { "aria-hidden": "true" }, "‹", -1)
-      ])], 8, N),
-      s("div", $, [
-        s("input", {
+        onClick: e[1] || (e[1] = (a) => s.$emit("update:page", t.page - 1))
+      }, {
+        default: c(() => [...e[4] || (e[4] = [
+          o("span", { "aria-hidden": "true" }, "‹", -1)
+        ])]),
+        _: 1
+      }, 8, ["disabled"]),
+      o("div", x, [
+        o("input", {
           class: "gsc-control gsc-control-page gsc-control-center",
           value: t.page,
-          onChange: e[2] || (e[2] = (a) => o.$emit("update:page", Number(a.target.value || 1)))
-        }, null, 40, k),
-        s("span", h, "/ " + i(d.value), 1)
+          onChange: e[2] || (e[2] = (a) => s.$emit("update:page", Number(a.target.value || 1)))
+        }, null, 40, C),
+        o("span", h, "/ " + r(g.value), 1)
       ]),
-      s("button", {
-        class: "gsc-btn gsc-btn-default gsc-btn-icon",
-        disabled: t.page >= d.value,
-        onClick: e[3] || (e[3] = (a) => o.$emit("update:page", t.page + 1))
-      }, [...e[5] || (e[5] = [
-        s("span", { "aria-hidden": "true" }, "›", -1)
-      ])], 8, x)
+      p(i(m), {
+        variant: "default",
+        size: "icon",
+        disabled: t.page >= g.value,
+        onClick: e[3] || (e[3] = (a) => s.$emit("update:page", t.page + 1))
+      }, {
+        default: c(() => [...e[5] || (e[5] = [
+          o("span", { "aria-hidden": "true" }, "›", -1)
+        ])]),
+        _: 1
+      }, 8, ["disabled"])
     ]));
   }
-}, M = /* @__PURE__ */ v(C, [["__scopeId", "data-v-8a0548c7"]]);
+}, V = /* @__PURE__ */ y(B, [["__scopeId", "data-v-729972d8"]]);
 export {
-  M as default
+  V as default
 };

package/dist/es/src/Grid/src/components/QueryBar.css

@@ -1 +1 @@
-[data-v-e3036b77],[data-v-e3036b77]:before,[data-v-e3036b77]:after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }[data-v-e3036b77]::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }.grid-cols-1[data-v-e3036b77]{grid-template-columns:repeat(1,minmax(0,1fr))}@media(min-width:768px){.md\:grid-cols-2[data-v-e3036b77]{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(min-width:992px){.lg\:col-span-2[data-v-e3036b77]{grid-column:span 2/span 2}.lg\:col-span-3[data-v-e3036b77]{grid-column:span 3/span 3}.lg\:col-span-4[data-v-e3036b77]{grid-column:span 4/span 4}.lg\:grid-cols-3[data-v-e3036b77]{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(min-width:1200px){.xl\:col-span-4[data-v-e3036b77]{grid-column:span 4/span 4}.xl\:grid-cols-4[data-v-e3036b77]{grid-template-columns:repeat(4,minmax(0,1fr))}}
+[data-v-366b3fad],[data-v-366b3fad]:before,[data-v-366b3fad]:after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }[data-v-366b3fad]::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }.container[data-v-366b3fad]{width:100%}@media(min-width:576px){.container[data-v-366b3fad]{max-width:576px}}@media(min-width:768px){.container[data-v-366b3fad]{max-width:768px}}@media(min-width:992px){.container[data-v-366b3fad]{max-width:992px}}@media(min-width:1200px){.container[data-v-366b3fad]{max-width:1200px}}@media(min-width:1600px){.container[data-v-366b3fad]{max-width:1600px}}@media(min-width:2000px){.container[data-v-366b3fad]{max-width:2000px}}.flex[data-v-366b3fad]{display:flex}.resize[data-v-366b3fad]{resize:both}.items-center[data-v-366b3fad]{align-items:center}.gap-2[data-v-366b3fad]{gap:.5rem}

package/dist/es/src/Grid/src/components/QueryBar.vue.js

@@ -1,23 +1,20 @@
-import { ref as z, computed as m, watch as D, createElementBlock as i, openBlock as o, createElementVNode as l, renderSlot as O, normalizeClass as k, Fragment as x, renderList as S, toDisplayString as g, createBlock as h, resolveDynamicComponent as _, unref as s, withCtx as b, createCommentVNode as w } from "vue";
-import { useForm as Q } from "../../../../node_modules/@tanstack/vue-form/dist/esm/useForm.js";
-import { useLocale as A } from "../../../hooks/useLocale.js";
+import { ref as v, computed as s, onMounted as T, onBeforeUnmount as W, openBlock as N, createElementBlock as j, Fragment as I, createVNode as w, unref as r, withCtx as c, createElementVNode as g, normalizeStyle as L, createTextVNode as h, toDisplayString as x, createBlock as $, createCommentVNode as G, renderSlot as Q } from "vue";
+import { useLocale as U } from "../../../hooks/useLocale.js";
+import { GscForm as A } from "../../../Form/index.js";
+import { GscButton as k } from "../../../Button/index.js";
 import './QueryBar.css';/* empty css              */
-import G from "../../../../_virtual/_plugin-vue_export-helper.js";
-const H = { class: "gsc-card gsc-card-pad" }, J = ["title"], M = { class: "gsc-form-control" }, P = ["value", "onChange"], T = { value: "" }, U = ["value"], W = {
-  key: 1,
-  class: "gsc-range"
-}, X = ["value", "onInput"], Y = ["value", "onInput"], Z = ["placeholder", "value", "onInput"], ee = ["disabled"], te = ["disabled"], ae = {
+import D from "../../../../_virtual/_plugin-vue_export-helper.js";
+const O = { class: "actions-left" }, P = { class: "actions-right flex items-center gap-2" }, H = {
   __name: "QueryBar",
   props: {
     schema: { type: Array, default: () => [] },
     modelValue: { type: Object, default: () => ({}) },
-    loading: { type: Boolean, default: !1 },
-    collapsedCount: { type: Number, default: 4 }
+    loading: { type: Boolean, default: !1 }
   },
   emits: ["update:modelValue", "search", "reset"],
-  setup(V, { emit: F }) {
-    const u = V, p = F, { t: y } = A(), f = z(!0);
-    function q(t = []) {
+  setup(f, { emit: _ }) {
+    const b = f, i = _, { t: u } = U(), d = v(!0), m = v(null);
+    function z(t = []) {
       return (t || []).filter(Boolean).map((e) => ({
         key: e.key,
         label: e.label ?? e.title ?? e.key,
@@ -27,158 +24,133 @@ const H = { class: "gsc-card gsc-card-pad" }, J = ["title"], M = { class: "gsc-f
         span: e.span,
         startKey: e.startKey,
         endKey: e.endKey,
+        showTime: e.showTime || e.withTime || !1,
         defaultValue: e.defaultValue
       })).filter((e) => e.type === "dateRange" ? !!(e.startKey && e.endKey) : !!e.key);
     }
-    const v = m(() => q(u.schema));
+    const B = s(() => z(b.schema)), V = v(typeof window < "u" ? window.innerWidth : 1200);
     function C() {
-      const t = {};
-      return v.value.forEach((e) => {
-        e.type === "dateRange" ? (t[e.startKey] = u.modelValue?.[e.startKey] ?? "", t[e.endKey] = u.modelValue?.[e.endKey] ?? "") : t[e.key] = u.modelValue?.[e.key] ?? e.defaultValue ?? "";
-      }), t;
+      typeof window < "u" && (V.value = window.innerWidth);
     }
-    const r = Q({
-      defaultValues: C(),
-      onSubmit: ({ value: t }) => {
-        p("update:modelValue", t || {}), p("search", t || {});
-      }
-    }), K = r.useStore((t) => t.values);
-    D(
-      () => u.modelValue,
-      (t) => {
-        const e = t || {};
-        Object.keys(e).forEach((a) => {
-          try {
-            r.setFieldValue(a, e[a], { dontValidate: !0, dontRunListeners: !0 });
-          } catch {
-          }
-        });
-      },
-      { deep: !0 }
-    );
-    const B = m(() => v.value.length > u.collapsedCount), I = m(() => B.value && f.value ? v.value.slice(0, u.collapsedCount) : v.value), R = m(() => "grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4"), E = m(() => "lg:col-span-3 xl:col-span-4");
-    function j(t) {
-      const e = Number(t?.span || 0);
-      return e === 2 ? "lg:col-span-2" : e === 3 ? "lg:col-span-3" : e === 4 ? "lg:col-span-4" : "";
+    T(() => {
+      typeof window < "u" && window.addEventListener("resize", C);
+    }), W(() => {
+      typeof window < "u" && window.removeEventListener("resize", C);
+    });
+    const p = s(() => {
+      const t = V.value || 1200;
+      return t >= 3840 ? 8 : t >= 2560 ? 7 : t >= 1920 ? 6 : t >= 1536 ? 5 : t >= 1280 ? 4 : t >= 1024 ? 3 : t >= 768 ? 2 : 1;
+    });
+    function S(t) {
+      if (!t)
+        return 1;
+      if (t.type === "dateRange")
+        return 2;
+      const e = Number(t.span || 0);
+      return e >= 1 ? e : 1;
     }
-    function L(t) {
-      return t.type === "dateRange" ? `${t.startKey}__${t.endKey}` : t.key;
+    function F(t, e) {
+      let n = 1, o = 0;
+      for (const l of t) {
+        const a = Math.min(S(l), e);
+        o + a > e ? (n += 1, o = a) : o += a;
+      }
+      return n;
     }
-    function N() {
+    const K = s(() => {
+      const t = p.value;
+      return F(B.value, t) > 2;
+    }), R = s(() => {
+      const t = B.value, e = p.value;
+      if (!K.value || !d.value)
+        return t;
+      const n = [];
+      let o = 1, l = 0;
+      for (const a of t) {
+        const y = Math.min(S(a), e);
+        if (l + y > e ? (o += 1, l = y) : l += y, o > 2)
+          break;
+        n.push(a);
+      }
+      return n;
+    }), q = s(() => {
+      const t = p.value || 1;
+      return t <= 2 ? { gridColumn: "1 / -1", display: "flex", justifyContent: "flex-end", gap: "8px", alignItems: "center" } : { gridColumn: `${Math.max(1, t - 1)} / span 2`, display: "flex", justifyContent: "flex-end", gap: "6px", alignItems: "center" };
+    });
+    function E() {
       try {
-        r.handleSubmit();
+        m.value?.submit();
       } catch {
-        p("update:modelValue", K.value || {}), p("search", K.value || {});
       }
     }
-    function $() {
-      const t = C();
-      Object.keys(t).forEach((e) => {
-        try {
-          r.setFieldValue(e, t[e], { dontValidate: !0, dontRunListeners: !0 });
-        } catch {
-        }
-      }), p("update:modelValue", t), p("reset", t);
+    function M() {
+      try {
+        m.value?.reset();
+      } catch {
+      }
     }
-    return (t, e) => (o(), i("div", H, [
-      l("div", {
-        class: k(["gsc-querybar", R.value])
-      }, [
-        (o(!0), i(x, null, S(I.value, (a) => (o(), i("div", {
-          key: L(a),
-          class: k(["gsc-form-item", j(a)])
-        }, [
-          l("div", {
-            class: "gsc-form-label",
-            title: a.label
-          }, g(a.label), 9, J),
-          l("div", M, [
-            a.type === "select" ? (o(), h(_(s(r).Field), {
-              key: 0,
-              name: a.key
-            }, {
-              default: b(({ field: c, state: d }) => [
-                l("select", {
-                  class: "gsc-control",
-                  value: d.value ?? "",
-                  onChange: (n) => c.setValue(n.target.value)
-                }, [
-                  l("option", T, g(a.placeholder || s(y)("gsc.grid.queryBar.placeholder.select")), 1),
-                  (o(!0), i(x, null, S(a.options || [], (n) => (o(), i("option", {
-                    key: n.value,
-                    value: n.value
-                  }, g(n.label), 9, U))), 128))
-                ], 40, P)
-              ]),
-              _: 2
-            }, 1032, ["name"])) : a.type === "dateRange" ? (o(), i("div", W, [
-              (o(), h(_(s(r).Field), {
-                name: a.startKey
+    return (t, e) => (N(), j(I, null, [
+      w(r(A), {
+        ref_key: "innerForm",
+        ref: m,
+        schema: R.value,
+        "model-value": b.modelValue,
+        "show-actions": !1,
+        "onUpdate:modelValue": e[1] || (e[1] = (n) => i("update:modelValue", n)),
+        onSubmit: e[2] || (e[2] = (n) => {
+          i("update:modelValue", n), i("search", n);
+        }),
+        onReset: e[3] || (e[3] = (n) => {
+          i("update:modelValue", n), i("reset", n);
+        })
+      }, {
+        actions: c(() => [
+          g("div", {
+            class: "gsc-form-actions-unified",
+            style: L(q.value)
+          }, [
+            g("div", O, [
+              w(r(k), {
+                variant: "default",
+                disabled: f.loading,
+                onClick: M
+              }, {
+                default: c(() => [
+                  h(x(r(u)("gsc.grid.queryBar.action.reset")), 1)
+                ]),
+                _: 1
+              }, 8, ["disabled"])
+            ]),
+            g("div", P, [
+              w(r(k), {
+                variant: "primary",
+                disabled: f.loading,
+                onClick: E
               }, {
-                default: b(({ field: c, state: d }) => [
-                  l("input", {
-                    type: "date",
-                    class: "gsc-control",
-                    value: d.value ?? "",
-                    onInput: (n) => c.setValue(n.target.value)
-                  }, null, 40, X)
+                default: c(() => [
+                  h(x(r(u)("gsc.grid.queryBar.action.search")), 1)
                 ]),
                 _: 1
-              }, 8, ["name"])),
-              e[1] || (e[1] = l("div", { class: "gsc-range-sep" }, " — ", -1)),
-              (o(), h(_(s(r).Field), {
-                name: a.endKey
+              }, 8, ["disabled"]),
+              K.value ? (N(), $(r(k), {
+                key: 0,
+                variant: "link",
+                onClick: e[0] || (e[0] = (n) => d.value = !d.value)
               }, {
-                default: b(({ field: c, state: d }) => [
-                  l("input", {
-                    type: "date",
-                    class: "gsc-control",
-                    value: d.value ?? "",
-                    onInput: (n) => c.setValue(n.target.value)
-                  }, null, 40, Y)
+                default: c(() => [
+                  h(x(d.value ? r(u)("gsc.grid.queryBar.action.expand") : r(u)("gsc.grid.queryBar.action.collapse")), 1)
                 ]),
                 _: 1
-              }, 8, ["name"]))
-            ])) : (o(), h(_(s(r).Field), {
-              key: 2,
-              name: a.key
-            }, {
-              default: b(({ field: c, state: d }) => [
-                l("input", {
-                  class: "gsc-control",
-                  placeholder: a.placeholder || s(y)("gsc.grid.queryBar.placeholder.input"),
-                  value: d.value ?? "",
-                  onInput: (n) => c.setValue(n.target.value)
-                }, null, 40, Z)
-              ]),
-              _: 2
-            }, 1032, ["name"]))
-          ])
-        ], 2))), 128)),
-        l("div", {
-          class: k(["gsc-form-actions", E.value])
-        }, [
-          l("button", {
-            class: "gsc-btn gsc-btn-default",
-            disabled: V.loading,
-            onClick: $
-          }, g(s(y)("gsc.grid.queryBar.action.reset")), 9, ee),
-          l("button", {
-            class: "gsc-btn gsc-btn-primary",
-            disabled: V.loading,
-            onClick: N
-          }, g(s(y)("gsc.grid.queryBar.action.search")), 9, te),
-          B.value ? (o(), i("button", {
-            key: 0,
-            class: "gsc-btn gsc-btn-link",
-            onClick: e[0] || (e[0] = (a) => f.value = !f.value)
-          }, g(f.value ? s(y)("gsc.grid.queryBar.action.expand") : s(y)("gsc.grid.queryBar.action.collapse")), 1)) : w("", !0)
-        ], 2)
-      ], 2),
-      O(t.$slots, "extra", {}, void 0, !0)
-    ]));
+              })) : G("", !0)
+            ])
+          ], 4)
+        ]),
+        _: 1
+      }, 8, ["schema", "model-value"]),
+      Q(t.$slots, "extra", {}, void 0, !0)
+    ], 64));
   }
-}, ue = /* @__PURE__ */ G(ae, [["__scopeId", "data-v-e3036b77"]]);
+}, ne = /* @__PURE__ */ D(H, [["__scopeId", "data-v-366b3fad"]]);
 export {
-  ue as default
+  ne as default
 };

package/dist/es/src/Grid/src/composables/useGridTable.js

@@ -1,7 +1,7 @@
-import { ref as r, computed as v, watch as M } from "vue";
-import { useVueTable as H } from "../../../../node_modules/@tanstack/vue-table/build/lib/index.js";
-import { getPaginationRowModel as U, getFilteredRowModel as j, getSortedRowModel as B, getCoreRowModel as E, functionalUpdate as S } from "../../../../node_modules/@tanstack/table-core/build/lib/index.js";
-function A(f = []) {
+import { ref as u, computed as g, watch as M } from "vue";
+import { useVueTable as G } from "../../../../node_modules/@tanstack/vue-table/build/lib/index.js";
+import { getPaginationRowModel as H, getFilteredRowModel as U, getSortedRowModel as B, getCoreRowModel as E, functionalUpdate as h } from "../../../../node_modules/@tanstack/table-core/build/lib/index.js";
+function O(f = []) {
   return (f || []).map((t) => ({
     key: t.key,
     title: t.title ?? t.label ?? t.key,
@@ -18,7 +18,7 @@ function A(f = []) {
   }));
 }
 function J(f) {
-  return v(() => A(f.value).map((l) => ({
+  return g(() => O(f.value).map((l) => ({
     id: l.key,
     accessorKey: l.key,
     header: l.title,
@@ -29,11 +29,11 @@ function J(f) {
     enableHiding: !0,
     enablePinning: !0,
     meta: { col: l },
-    cell: (u) => {
-      const d = u.getValue();
+    cell: (v) => {
+      const d = v.getValue();
       if (typeof l.formatter == "function")
         try {
-          return l.formatter(d, { row: u.row.original, index: u.row.index });
+          return l.formatter(d, { row: v.row.original, index: v.row.index });
         } catch {
           return String(d ?? "");
         }
@@ -45,15 +45,15 @@ function Z(f = {}) {
   const {
     data: t = [],
     request: l,
-    mode: u = "server",
+    mode: v = "server",
     pageSize: d = 10,
     initialQuery: T = {},
     columns: q = [],
     rowKey: D = "id",
     enableRowSelection: F = !1
-  } = f, P = r(q || []), s = r(Array.isArray(t) ? (t || []).slice() : (t?.value || []).slice()), h = r({ ...T || {} }), c = r(0), z = r(!1), n = r({ pageIndex: 0, pageSize: d }), i = r([]), y = r({}), w = r({ left: [], right: [] }), b = r({}), N = J(P), o = v(() => u === "server" && typeof l == "function"), x = H({
+  } = f, P = u(q || []), r = u(Array.isArray(t) ? (t || []).slice() : (t?.value || []).slice()), S = u({ ...T || {} }), c = u(0), z = u(!1), n = u({ pageIndex: 0, pageSize: d }), i = u([]), y = u({}), w = u({ left: [], right: [] }), b = u({}), N = J(P), o = g(() => v === "server" && typeof l == "function"), x = G({
     get data() {
-      return s.value;
+      return r.value;
     },
     get columns() {
       return N.value;
@@ -79,26 +79,27 @@ function Z(f = {}) {
         return b.value;
       }
     },
+    // 服务端排序变更时，重置到第一页
     onSortingChange: (e) => {
-      i.value = S(e, i.value), o.value && (n.value = { ...n.value, pageIndex: 0 });
+      i.value = h(e, i.value), o.value && (n.value = { ...n.value, pageIndex: 0 });
     },
     onPaginationChange: (e) => {
-      n.value = S(e, n.value);
+      n.value = h(e, n.value);
     },
     onColumnVisibilityChange: (e) => {
-      y.value = S(e, y.value);
+      y.value = h(e, y.value);
     },
     onColumnPinningChange: (e) => {
-      w.value = S(e, w.value);
+      w.value = h(e, w.value);
     },
     enableRowSelection: !!F,
     onRowSelectionChange: (e) => {
-      b.value = S(e, b.value);
+      b.value = h(e, b.value);
     },
     manualPagination: o.value,
     manualSorting: o.value,
     manualFiltering: o.value,
-    pageCount: v(() => {
+    pageCount: g(() => {
       const e = n.value.pageSize || 1;
       return Math.max(1, Math.ceil((c.value || 0) / e));
     }),
@@ -106,27 +107,27 @@ function Z(f = {}) {
     columnResizeMode: "onChange",
     getCoreRowModel: E(),
     getSortedRowModel: B(),
-    getFilteredRowModel: j(),
-    getPaginationRowModel: U()
-  }), k = v({
+    getFilteredRowModel: U(),
+    getPaginationRowModel: H()
+  }), k = g({
     get: () => (n.value.pageIndex || 0) + 1,
     set: (e) => {
       const a = Math.max(1, Number(e || 1));
       n.value = { ...n.value, pageIndex: a - 1 };
     }
-  }), I = v({
+  }), I = g({
     get: () => n.value.pageSize,
     set: (e) => {
       const a = Math.max(1, Number(e || d));
       n.value = { pageIndex: 0, pageSize: a };
     }
-  }), R = v(() => {
+  }), R = g(() => {
     const e = i.value && i.value[0];
     return { id: e?.id ?? null, desc: !!e?.desc };
-  }), W = v(() => (x.getRowModel()?.rows || []).map((a) => a.original));
+  }), W = g(() => (x.getRowModel()?.rows || []).map((a) => a.original));
   async function C() {
     if (!o.value) {
-      c.value = s.value.length;
+      c.value = r.value.length;
       return;
     }
     z.value = !0;
@@ -134,31 +135,31 @@ function Z(f = {}) {
       const e = await l({
         page: k.value,
         pageSize: I.value,
-        query: h.value,
-        // Back-compat: keep single sort (first) and also provide multi-sort array.
+        query: S.value,
+        // 向后兼容：同时提供单列排序信息和多列排序数组。
         sort: R.value,
         sorts: i.value
       });
-      s.value = (e?.records || []).slice(), c.value = Number(e?.total ?? s.value.length);
+      r.value = (e?.records || []).slice(), c.value = Number(e?.total ?? r.value.length);
     } finally {
       z.value = !1;
     }
   }
-  function O(e = {}) {
-    h.value = { ...e || {} }, o.value && (n.value = { ...n.value, pageIndex: 0 });
+  function j(e = {}) {
+    S.value = { ...e || {} }, o.value && (n.value = { ...n.value, pageIndex: 0 });
   }
   function V(e = []) {
-    s.value = (e || []).slice(), o.value || (c.value = s.value.length);
+    r.value = (e || []).slice(), o.value || (c.value = r.value.length);
   }
-  function Q(e = []) {
+  function A(e = []) {
     P.value = (e || []).slice();
     try {
-      const a = A(e || []), m = a.filter((g) => g.fixed === "left").map((g) => g.key), p = a.filter((g) => g.fixed === "right").map((g) => g.key);
+      const a = O(e || []), m = a.filter((s) => s.fixed === "left").map((s) => s.key), p = a.filter((s) => s.fixed === "right").map((s) => s.key);
       x.setColumnPinning?.({ left: m, right: p });
     } catch {
     }
   }
-  function G(e) {
+  function Q(e) {
     if (!e)
       return;
     const a = x.getColumn(e);
@@ -169,10 +170,10 @@ function Z(f = {}) {
     const m = i.value?.[0];
     m?.id === e ? i.value = [{ id: e, desc: !m.desc }] : i.value = [{ id: e, desc: !1 }];
   }
-  return M(
-    () => [t, u],
-    () => {
-      Array.isArray(t) && V(t);
+  return t && typeof t == "object" && Object.prototype.hasOwnProperty.call(t, "value") && M(
+    () => t.value,
+    (e) => {
+      V(e || []);
     },
     { deep: !0 }
   ), M(
@@ -181,30 +182,30 @@ function Z(f = {}) {
       o.value && C();
     }
   ), M(
-    () => h.value,
+    () => S.value,
     () => {
       o.value && C();
     },
     { deep: !0 }
-  ), o.value ? C() : c.value = s.value.length, {
+  ), o.value ? C() : c.value = r.value.length, {
     table: x,
     loading: z,
-    query: h,
+    query: S,
     page: k,
     pageSize: I,
     total: c,
     rows: W,
-    sort: G,
+    sort: Q,
     sortState: R,
     sorting: i,
     columnVisibility: y,
     columnPinning: w,
     rowSelection: b,
     load: C,
-    setQuery: O,
+    setQuery: j,
     setData: V,
-    setColumns: Q,
-    mode: u
+    setColumns: A,
+    mode: v
   };
 }
 export {