@quoreadmin/ui 1.10.9 → 1.10.11

package/dist/index90.js

@@ -1,16 +1,16 @@
-import { defineComponent as U, ref as a, computed as v, onMounted as q, onUnmounted as A, nextTick as M } from "vue";
-import C from "./index6.js";
-import O from "./index15.js";
-import { useDrag as j } from "./index181.js";
-import { useMotionProperties as G, useMotionTransitions as I } from "./index182.js";
-import { useWindowScroll as J, useScroll as K } from "./index173.js";
-import H from "./index57.js";
-import X from "./index58.js";
-const ne = U({
+import { defineComponent as G, ref as l, computed as i, onMounted as I, onUnmounted as J, nextTick as F } from "vue";
+import K from "./index6.js";
+import X from "./index15.js";
+import { useDrag as _ } from "./index181.js";
+import { useMotionProperties as ee, useMotionTransitions as te } from "./index182.js";
+import { useWindowScroll as le, useScroll as Q } from "./index173.js";
+import V from "./index57.js";
+import ae from "./index58.js";
+const de = G({
   name: "QDataList",
   components: {
-    QBadge: C,
-    QDataFilter: O
+    QBadge: K,
+    QDataFilter: X
   },
   props: {
     /** Pass in an ID unique to the list. */
@@ -63,79 +63,113 @@ const ne = U({
       type: String,
       default: "row"
       // row, ordered, unordered
+    },
+    /** Scroll container: element ref, or CSS selector (e.g. '.page-layout__sidebar-inner') resolved via closest from list root. When null/undefined, uses window. */
+    scrollTarget: {
+      type: [Object, String],
+      default: null
     }
   },
   emits: ["filters-action", "page-updated", "click:list-item"],
-  setup(l, { emit: R }) {
-    const { deviceType: T } = X(), { y: t } = J(), { y: f } = K(window, { behavior: "smooth" }), g = a(0), n = a("down"), m = a(null), L = a(0), r = a(!1), P = a(!0), s = a(H.md ? !1 : l.hideSearch), p = a(!s.value), i = a(null), b = {
+  setup(n, { emit: R }) {
+    const { deviceType: E } = ae(), { y: P } = le(), { y: B } = Q(window, { behavior: "smooth" }), h = l(0), f = l("down"), a = l(null), { y: b } = Q(a), W = () => {
+      const e = n.scrollTarget;
+      if (e == null) {
+        a.value = null;
+        return;
+      }
+      if (typeof e == "string") {
+        const o = /^[.#\[a-zA-Z]/.test(e) ? e : `.${e}`, r = s.value?.closest(o) ?? null;
+        a.value = r;
+        return;
+      }
+      a.value = e;
+    }, w = i(() => a.value != null), t = i({
+      get: () => w.value ? b.value : P.value,
+      set: (e) => {
+        w.value ? b.value = e : B.value = e;
+      }
+    }), s = l(null), M = l(0), g = l(!1), k = l(!0), c = l(V.md ? !1 : n.hideSearch), y = l(!c.value), x = {
       type: "keyframe",
       ease: "linear",
       duration: 0,
       delay: 0
-    }, u = a(null), c = a(1), F = a(null), h = a(window.innerHeight), { motionProperties: Q } = G(u), { push: V } = I(), W = v(() => T.value === "desktop"), Y = v(() => c.value * l.itemsPerPage - 1), w = v(() => t.value <= 0 ? 70 : t.value > 70 ? 0 : 70 - t.value), k = v(() => Math.ceil(l.modelValue?.length / l.itemsPerPage) || 1), x = (e) => {
-      !e.dragging && t.value <= 24 && t.value >= 0 && (f.value = 0), !e.dragging && t.value > 24 && t.value < 70 && (f.value = 70), !(t.value > 0) && (r.value ? N(e) : z(e));
+    }, m = l(null), v = l(1), A = l(null), S = l(window.innerHeight), { motionProperties: N } = ee(m), { push: O } = te(), u = l(null), T = l(null), U = i(() => E.value === "desktop"), j = i(() => v.value * n.itemsPerPage - 1), D = i(() => t.value <= 0 ? 70 : t.value > 70 ? 0 : 70 - t.value), Y = i(() => Math.ceil(n.modelValue?.length / n.itemsPerPage) || 1), q = (e) => {
+      !e.dragging && t.value <= 24 && t.value >= 0 && (t.value = 0), !e.dragging && t.value > 24 && t.value < 70 && (t.value = 70), !(t.value > 0) && (g.value ? $(e) : Z(e));
     };
-    s.value && j(x, {
-      domTarget: u,
+    c.value && _(q, {
+      domTarget: m,
       filterTaps: !0,
       useTouch: !0,
       delay: 100
     });
-    const z = (e) => {
-      e.tap || e.axis === "x" || (r.value = !0);
-    }, N = (e) => {
+    const Z = (e) => {
+      e.tap || e.axis === "x" || (g.value = !0);
+    }, $ = (e) => {
       if (e.tap || e.axis === "x")
         return;
-      const o = e.direction[1], D = o >= 0, E = o <= 0 && t.value <= 0;
-      !p.value && (D || E) && y(!E, "drag"), r.value = !1;
-    }, d = async () => {
-      const e = t.value + h.value, o = m.value.offsetTop + m.value.offsetHeight;
-      e > o - 400 && c.value < k.value && (c.value++, R("page-updated"));
-    }, y = async (e, o) => {
-      if (p.value = e, await M(), P.value && n.value === "up" && t.value <= 0 || o === "drag") {
-        const D = w.value ? w.value : 0;
-        V("y", D, Q, b), P.value = !1;
+      const o = e.direction[1], r = o >= 0, z = o <= 0 && t.value <= 0;
+      !y.value && (r || z) && L(!z, "drag"), g.value = !1;
+    }, d = () => {
+      if (!(!s.value || v.value >= Y.value))
+        if (w.value && a.value) {
+          const e = a.value.getBoundingClientRect(), r = s.value.getBoundingClientRect().bottom - 400;
+          e.bottom > r && (v.value++, R("page-updated"));
+        } else {
+          const e = P.value + S.value, o = s.value.offsetTop + s.value.offsetHeight;
+          e > o - 400 && (v.value++, R("page-updated"));
+        }
+    }, L = async (e, o) => {
+      if (y.value = e, await F(), k.value && f.value === "up" && t.value <= 0 || o === "drag") {
+        const r = D.value ? D.value : 0;
+        O("y", r, N, x), k.value = !1;
       }
-    }, S = () => {
-      const e = Math.max(0, t.value) > g.value ? "down" : "up";
-      e !== n.value && (n.value = e), t.value < 70 && y(!0, "scroll"), g.value = Math.max(0, t.value), d();
-    }, B = async () => {
-      h.value = window.innerHeight, await M();
+    }, p = () => {
+      const e = Math.max(0, t.value) > h.value ? "down" : "up";
+      e !== f.value && (f.value = e), t.value < 70 && L(!0, "scroll"), h.value = Math.max(0, t.value), d();
+    }, H = async () => {
+      S.value = window.innerHeight, await F();
+    }, C = () => {
+      c.value ? p() : d();
     };
-    return q(() => {
-      s.value ? (L.value = u.value.offsetTop - 16, window.addEventListener("scroll", S), i.value = "onScroll") : (window.addEventListener("scroll", d), i.value = "scrollWatcher"), window.addEventListener("resize", B);
-    }), A(() => {
-      i.value === "onScroll" ? window.removeEventListener("scroll", S) : i.value === "scrollWatcher" && window.removeEventListener("scroll", d), window.removeEventListener("resize", B);
+    return I(() => {
+      if (c.value ? (M.value = m.value.offsetTop - 16, n.scrollTarget || (window.addEventListener("scroll", p), u.value = "onScroll")) : n.scrollTarget || (window.addEventListener("scroll", d), u.value = "scrollWatcher"), W(), n.scrollTarget && a.value) {
+        const e = a.value;
+        e.addEventListener("scroll", C), T.value = e, u.value = "custom";
+      }
+      window.addEventListener("resize", H);
+    }), J(() => {
+      u.value === "onScroll" ? window.removeEventListener("scroll", p) : u.value === "scrollWatcher" ? window.removeEventListener("scroll", d) : u.value === "custom" && T.value && T.value.removeEventListener("scroll", C), window.removeEventListener("resize", H);
     }), {
       // Refs
-      dataListRef: m,
-      defaultSearchTop: L,
-      isDragging: r,
-      isSearchVisible: p,
-      hiddenSearch: s,
-      listRef: u,
-      page: c,
-      prevScrollY: g,
+      dataListRef: s,
+      defaultSearchTop: M,
+      isDragging: g,
+      isSearchVisible: y,
+      hiddenSearch: c,
+      listRef: m,
+      page: v,
+      prevScrollY: h,
       scrollY: t,
-      scrollToY: f,
-      searchRef: F,
-      windowHeight: h,
+      scrollToY: B,
+      searchRef: A,
+      windowHeight: S,
       // Computed
-      direction: n,
-      isDesktop: W,
-      lastOnPage: Y,
-      searchHeight: w,
-      totalPages: k,
+      direction: f,
+      isDesktop: U,
+      lastOnPage: j,
+      searchHeight: D,
+      totalPages: Y,
       // Methods
-      onScroll: S,
+      onScroll: p,
       scrollWatcher: d,
-      toggleSearch: y,
+      toggleSearch: L,
       // Composable
-      deviceType: T,
-      mq: H
+      deviceType: E,
+      mq: V
     };
   }
 });
 export {
-  ne as default
+  de as default
 };

package/dist/index92.js

@@ -3,7 +3,7 @@ import { useScroll as G, useWindowScroll as me, useElementBounding as he } from
 import ye from "./index18.js";
 import ge from "./index19.js";
 import be from "./index52.js";
-import we from "./index185.js";
+import we from "./index184.js";
 import Se from "./index57.js";
 import xe from "./index58.js";
 const Pe = de({

package/dist/index98.js

@@ -1,11 +1,11 @@
 import { defineComponent as g, ref as l, computed as n, watch as f, nextTick as w, onUnmounted as v } from "vue";
-import D from "./index186.js";
+import D from "./index185.js";
 /* empty css         */
+import "./index187.js";
 import "./index188.js";
 import "./index189.js";
 import "./index190.js";
 import "./index191.js";
-import "./index192.js";
 const A = g({
   name: "QDatePicker",
   components: {

package/dist/src/components/data-list/data-list.d.ts

@@ -1,3 +1,4 @@
+import { PropType } from 'vue';
 declare const QDataList: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
     /** Pass in an ID unique to the list. */
     id: {
@@ -47,6 +48,11 @@ declare const QDataList: import('vue').DefineComponent<import('vue').ExtractProp
         type: StringConstructor;
         default: string;
     };
+    /** Scroll container: element ref, or CSS selector (e.g. '.page-layout__sidebar-inner') resolved via closest from list root. When null/undefined, uses window. */
+    scrollTarget: {
+        type: PropType<HTMLElement | string | null | undefined>;
+        default: null;
+    };
 }>, {
     dataListRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
     defaultSearchTop: import('vue').Ref<number, number>;
@@ -66,7 +72,7 @@ declare const QDataList: import('vue').DefineComponent<import('vue').ExtractProp
     searchHeight: import('vue').ComputedRef<number>;
     totalPages: import('vue').ComputedRef<number>;
     onScroll: () => void;
-    scrollWatcher: () => Promise<void>;
+    scrollWatcher: () => void;
     toggleSearch: (value: any, type: any) => Promise<void>;
     deviceType: import('vue').Ref<string, string>;
     mq: {
@@ -129,6 +135,11 @@ declare const QDataList: import('vue').DefineComponent<import('vue').ExtractProp
         type: StringConstructor;
         default: string;
     };
+    /** Scroll container: element ref, or CSS selector (e.g. '.page-layout__sidebar-inner') resolved via closest from list root. When null/undefined, uses window. */
+    scrollTarget: {
+        type: PropType<HTMLElement | string | null | undefined>;
+        default: null;
+    };
 }>> & Readonly<{
     "onFilters-action"?: ((...args: any[]) => any) | undefined;
     "onPage-updated"?: ((...args: any[]) => any) | undefined;
@@ -144,6 +155,7 @@ declare const QDataList: import('vue').DefineComponent<import('vue').ExtractProp
     isFixed: boolean;
     itemsPerPage: number;
     noResultMessage: string;
+    scrollTarget: string | HTMLElement | null | undefined;
 }, {}, {
     QBadge: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
         color: {
@@ -172,7 +184,7 @@ declare const QDataList: import('vue').DefineComponent<import('vue').ExtractProp
     }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
     QDataFilter: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
         data: {
-            type: import('vue').PropType<any[]>;
+            type: PropType<any[]>;
             default: () => never[];
         };
         id: {
@@ -180,11 +192,11 @@ declare const QDataList: import('vue').DefineComponent<import('vue').ExtractProp
             default: string;
         };
         excludedFields: {
-            type: import('vue').PropType<string[]>;
+            type: PropType<string[]>;
             default: () => never[];
         };
         filters: {
-            type: import('vue').PropType<any[]>;
+            type: PropType<any[]>;
             default: () => never[];
         };
         hasSearch: {
@@ -257,7 +269,7 @@ declare const QDataList: import('vue').DefineComponent<import('vue').ExtractProp
         };
     }, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, ("update:data" | "update:search" | "click:filters" | "popover:close" | "bottom-sheet:close")[], "update:data" | "update:search" | "click:filters" | "popover:close" | "bottom-sheet:close", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
         data: {
-            type: import('vue').PropType<any[]>;
+            type: PropType<any[]>;
             default: () => never[];
         };
         id: {
@@ -265,11 +277,11 @@ declare const QDataList: import('vue').DefineComponent<import('vue').ExtractProp
             default: string;
         };
         excludedFields: {
-            type: import('vue').PropType<string[]>;
+            type: PropType<string[]>;
             default: () => never[];
         };
         filters: {
-            type: import('vue').PropType<any[]>;
+            type: PropType<any[]>;
             default: () => never[];
         };
         hasSearch: {

package/dist/src/views/lists.vue.d.ts

@@ -1258,6 +1258,10 @@ declare const _default: import('vue').DefineComponent<{}, {
             type: StringConstructor;
             default: string;
         };
+        scrollTarget: {
+            type: import('vue').PropType<HTMLElement | string | null | undefined>;
+            default: null;
+        };
     }>, {
         dataListRef: import('vue').Ref<HTMLElement | null, HTMLElement | null>;
         defaultSearchTop: import('vue').Ref<number, number>;
@@ -1277,7 +1281,7 @@ declare const _default: import('vue').DefineComponent<{}, {
         searchHeight: import('vue').ComputedRef<number>;
         totalPages: import('vue').ComputedRef<number>;
         onScroll: () => void;
-        scrollWatcher: () => Promise<void>;
+        scrollWatcher: () => void;
         toggleSearch: (value: any, type: any) => Promise<void>;
         deviceType: import('vue').Ref<string, string>;
         mq: {
@@ -1332,6 +1336,10 @@ declare const _default: import('vue').DefineComponent<{}, {
             type: StringConstructor;
             default: string;
         };
+        scrollTarget: {
+            type: import('vue').PropType<HTMLElement | string | null | undefined>;
+            default: null;
+        };
     }>> & Readonly<{
         "onFilters-action"?: ((...args: any[]) => any) | undefined;
         "onPage-updated"?: ((...args: any[]) => any) | undefined;
@@ -1347,6 +1355,7 @@ declare const _default: import('vue').DefineComponent<{}, {
         isFixed: boolean;
         itemsPerPage: number;
         noResultMessage: string;
+        scrollTarget: string | HTMLElement | null | undefined;
     }, {}, {
         QBadge: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
             color: {

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@quoreadmin/ui",
     "private": false,
-    "version": "1.10.9",
+    "version": "1.10.11",
     "type": "module",
     "sideEffects": [
         "**/*.css",