svelte-common 6.1.2 → 6.2.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "svelte-common",
-  "version": "6.1.2",
+  "version": "6.2.1",
   "publishConfig": {
     "access": "public"
   },
@@ -48,7 +48,7 @@
     "ava": "^5.3.1",
     "c8": "^8.0.0",
     "documentation": "^14.0.2",
-    "mf-styling": "^2.0.2",
+    "mf-styling": "^2.0.3",
     "npm-pkgbuild": "^11.8.14",
     "semantic-release": "^21.0.7",
     "stylelint": "^15.10.1",

package/src/pagination.mjs

@@ -1,16 +1,18 @@
-
 /**
  * Pagination support store.
  * Pages go from 1 ... numberOfPages
  * @param {Map|Array|Store} data
  * @param {Object} options
  * @param {number} [options.itemsPerPage]
+ * @param {Function} [options.sorter]
+ * @param {Function} [options.filter]
  */
 export class Pagination {
   #subscriptions = new Set();
   #data;
   #unsubscribeData;
   #filter;
+  #sorter;
   #itemsPerPage = 20;
   #page = 1;
 
@@ -20,18 +22,26 @@ export class Pagination {
     Object.assign(this, options);
   }
 
-  set filter(filter)
-  {
+  set filter(filter) {
     this.#filter = filter;
 
     this.#subscriptions.forEach(subscription => subscription(this));
   }
 
-  get filter()
-  {
+  get filter() {
     return this.#filter;
   }
 
+  set sorter(sorter) {
+    this.#sorter = sorter;
+
+    this.#subscriptions.forEach(subscription => subscription(this));
+  }
+
+  get sorter() {
+    return this.#sorter;
+  }
+
   set data(data) {
     if (this.#unsubscribeData) {
       this.#unsubscribeData();
@@ -87,14 +97,13 @@ export class Pagination {
   get numberOfPages() {
     let n;
 
-    if(this.filter) {
+    if (this.filter) {
       let data = Array.isArray(this.data)
-      ? this.#data
-      : [...this.#data.values()];
+        ? this.#data
+        : [...this.#data.values()];
       data = data.filter(this.filter);
       n = data.length;
-    }
-    else {
+    } else {
       n = Array.isArray(this.#data) ? this.#data.length : this.#data.size;
     }
 
@@ -106,16 +115,18 @@ export class Pagination {
   }
 
   *[Symbol.iterator]() {
-    const n = this.page - 1;
+    let data = Array.isArray(this.data) ? this.#data : [...this.#data.values()];
 
-    let data = Array.isArray(this.data)
-      ? this.#data
-      : [...this.#data.values()];
-
-    if(this.filter) {
+    if (this.filter) {
       data = data.filter(this.filter);
     }
 
+    if (this.sorter) {
+      data = data.sort(this.sorter);
+    }
+
+    const n = this.page - 1;
+
     for (const item of data.slice(
       n * this.itemsPerPage,
       (n + 1) * this.itemsPerPage
@@ -152,7 +163,10 @@ export class Pagination {
             a.classList.add("active");
             a.setAttribute("aria-current", "page");
           } else {
-            a.onclick = () => (this.page = targetPage);
+            a.onclick = e => {
+              e.preventDefault();
+              this.page = targetPage;
+            };
           }
         }
         items.push(a);
@@ -189,12 +203,12 @@ export function pageNavigation(elem, pg) {
  */
 export function* navigationItems(nunmberOfPages, currentPage) {
   const pageJumps = [
-    { maxPages: 10,       side: 1, edge: 2 },
-    { maxPages: 100,      side: 1, edge: 2, step: 10 },
-    { maxPages: 1000,     side: 1, edge: 2, step: 100 },
-    { maxPages: 10000,    side: 1, edge: 2, step: 1000 },
-    { maxPages: 100000,   side: 1, edge: 2, step: 10000 },
-    { maxPages: 1000000,  side: 1, edge: 2, step: 100000 },
+    { maxPages: 10, side: 1, edge: 2 },
+    { maxPages: 100, side: 1, edge: 2, step: 10 },
+    { maxPages: 1000, side: 1, edge: 2, step: 100 },
+    { maxPages: 10000, side: 1, edge: 2, step: 1000 },
+    { maxPages: 100000, side: 1, edge: 2, step: 10000 },
+    { maxPages: 1000000, side: 1, edge: 2, step: 100000 },
     { maxPages: 10000000, side: 1, edge: 2, step: 1000000 }
   ];