svelte-common 4.9.0 → 4.10.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "svelte-common",
-  "version": "4.9.0",
+  "version": "4.10.0",
   "publishConfig": {
     "access": "public"
   },

package/src/sorting.mjs

@@ -21,28 +21,41 @@ export function toggleOrderBy(orderBy) {
 
 /**
  * Add sortable toggle to a node.
- * cycles "aria-sort" though orderByCycle.
+ * Synchronizes store value with node sortable attribute.
  * @param {Node} node
- * @param {Store} where to put sorting info into
+ * @param {Store} where to keep in sync with sorting properties
  */
 export function sortable(node, store) {
   node.setAttribute("aria-sort", SORT_NONE);
 
+  store.subscribe(orderBy => {
+    for (const peer of node.parentElement.children) {
+      if (peer.getAttribute("aria-sort")) {
+        peer.setAttribute("aria-sort", orderBy[peer.id] || SORT_NONE);
+      }
+    }
+  });
+
   node.onclick = () => {
     const orderBy = {};
+
     node.setAttribute(
       "aria-sort",
       toggleOrderBy(node.getAttribute("aria-sort"))
     );
 
     for (const peer of node.parentElement.children) {
-      if (peer !== node) {
-        if (peer.getAttribute("aria-sort") !== SORT_NONE) {
-          peer.setAttribute("aria-sort", SORT_NONE);
+      const sort = peer.getAttribute("aria-sort");
+
+      if (sort) {
+        if (peer !== node) {
+          if (sort !== SORT_NONE) {
+            peer.setAttribute("aria-sort", SORT_NONE);
+          }
         }
-      }
 
-      orderBy[peer.id] = peer.getAttribute("aria-sort");
+        orderBy[peer.id] = sort;
+      }
     }
     store.set(orderBy);
   };