@scayle/storefront-product-listing 2.4.0 → 2.5.1

package/CHANGELOG.md

@@ -1,12 +1,25 @@
 # @scayle/storefront-product-listing
 
+## 2.5.1
+
+### Patch Changes
+
+- **\[Security\]** Use the patched Nuxt for build — `nuxt@3.21.8` (3.x) / `nuxt@4.4.8` (4.x), with matching `@nuxt/kit` and `@nuxt/schema` — which includes the fix for [CVE-2026-53721](https://nvd.nist.gov/vuln/detail/CVE-2026-53721) ([GHSA-mm7m-92g8-7m47](https://github.com/nuxt/nuxt/security/advisories/GHSA-mm7m-92g8-7m47)), a route-rule middleware bypass.
+
+  Compatibility with previously-supported Nuxt versions is unchanged and remains specified via each package's `peerDependencies` and the Nuxt compatibility flag. `@scayle/storefront-core` is released in lockstep with `@scayle/storefront-nuxt`.
+
+## 2.5.0
+
+### Minor Changes
+
+- **[RPC]** Updated built-in RPC methods to use `GET` for safe, cacheable reads and `PUT`/`POST`/`DELETE` for mutations, enabling CDN and browser caching for public data fetches.
+
 ## 2.4.0
 
 ### Minor Changes
 
 - Introduced support for Nuxt 4 while maintaining full backward compatibility with Nuxt 3.
   This enables consumers to migrate to Nuxt 4 ahead of the Nuxt 3 end of support on 31 Jan 2026.
-
   - **Version Requirements:**
     - Nuxt 3: `v3.13.0+`
     - Nuxt 4: `v4.2.0+`
@@ -40,7 +53,6 @@
   By removing href attributes from sort controls and using click handlers with programmatic navigation instead, we ensure that sorting doesn't create separate indexable pages, improving SEO performance.
 
   **Migration Required:** Replace usage of `sortLinks` with direct handling of `sortingOptions` and implement click handlers that use `router.push()` to update query parameters.
-
   - **Before:**
 
     ```ts
@@ -122,7 +134,6 @@
 - Enhanced data fetching composables to support reactive keys, aligning with [Nuxt 3.17 data fetching improvements](https://nuxt.com/blog/v3-17#data-fetching-improvements).
 
   You can now pass a `ref`, `computed`, or getter function as the `key` parameter to `useRpc` and derived composables (like `useProducts`, `useBrand` etc.). When the reactive key changes, the data will automatically re-fetch.
-
   - **Before:** Keys were static strings.
   - **After:** Keys can be reactive, enabling dynamic caching and automatic updates.
 
@@ -178,7 +189,6 @@
 - Added support for custom filter prefix for filter utility functions.
 
   Following functions now accept a `filterPrefix` parameter that can be used to customize the filter prefix.
-
   - `parseFilterDataFromRoute`
   - `createNewAttributeQuery`
   - `createNewPriceQuery`
@@ -404,7 +414,6 @@
 
 - This release introduces the `@scayle/storefront-product-listing` package, decoupling composables and utilities of the Product Listing Page (PLP) functionality from the SCAYLE Storefront Boilerplate for enhanced modularity and integration.
   This separation empowers developers with greater control over PLP updates and simplifies its integration into existing Storefront-based projects.
-
   - [Discover more about the Product Listing Page for SCAYLE Storefront in our SCAYLE Resource Center.](https://scayle.dev/en/core-documentation/storefront-guide/storefront-application/features/product-listing-page)
 
 - This release requires `@scayle/storefront-nuxt@8.x` or higher. Support for `@scayle/storefront-nuxt@7.x` has been discontinued. Please update your dependencies accordingly. The `peerDependency` range has been updated to `^8.0.0`.
@@ -412,7 +421,6 @@
 ### Minor Changes
 
 - Compared to the original implementation within the SCAYLE Storefront Boilerplate, the `@scayle/storefront-product-detail` package has received some improvements and refactoring:
-
   - The `useAppliedFilters` composable has been added to the `storefront-product-listing` package.
     It now accepts a `filtersPrefix` parameter, allowing you to specify a custom prefix for filter-related query parameters.
   - The `useProductListSort` composable has been added to the `storefront-product-listing` package.

package/dist/index.mjs

@@ -7,8 +7,8 @@ const breadcrumbsFactory = Factory.define(() => [
   { to: "/de/c/women/clothing-2048", value: "clothing" }
 ]);
 
-const filtersFactory = Factory.define(
-  () => [{
+const filtersFactory = Factory.define(() => [
+  {
     id: 1,
     slug: "brand",
     name: "Brand",
@@ -22,7 +22,8 @@ const filtersFactory = Factory.define(
     ],
     type: FilterTypes.ATTRIBUTES,
     attributeGroupType: "group-type"
-  }, {
+  },
+  {
     id: null,
     slug: "sale",
     name: "Sale",
@@ -37,7 +38,8 @@ const filtersFactory = Factory.define(
       }
     ],
     type: FilterTypes.BOOLEAN
-  }, {
+  },
+  {
     id: null,
     slug: "prices",
     name: "Prices",
@@ -49,7 +51,7 @@ const filtersFactory = Factory.define(
       }
     ],
     type: FilterTypes.RANGE
-  }]
-);
+  }
+]);
 
 export { breadcrumbsFactory, filtersFactory };

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@scayle/storefront-product-listing",
   "configKey": "product-listing",
-  "version": "2.4.0",
+  "version": "2.5.1",
   "compatibility": {
     "bridge": false,
     "nuxt": ">=3.13"

package/dist/module.mjs

@@ -1,7 +1,7 @@
 import { defineNuxtModule, createResolver, addImportsDir } from '@nuxt/kit';
 
 const PACKAGE_NAME = "@scayle/storefront-product-listing";
-const PACKAGE_VERSION = "2.4.0";
+const PACKAGE_VERSION = "2.5.1";
 const module$1 = defineNuxtModule({
   meta: {
     name: PACKAGE_NAME,

package/dist/runtime/composables/useAllShopCategoriesForId.js

@@ -3,10 +3,5 @@ export function useAllShopCategoriesForId({
   params,
   options
 } = {}, key = "useAllShopCategoriesForId") {
-  return useRpc(
-    "getAllShopCategoriesForId",
-    key,
-    params,
-    options
-  );
+  return useRpc("getAllShopCategoriesForId", key, params, options);
 }

package/dist/runtime/composables/useAppliedFilters.js

@@ -5,9 +5,13 @@ export function useAppliedFilters(route, { filtersPrefix } = { filtersPrefix: "f
   const parsedFilterQuery = computed(
     () => parseFilterDataFromRoute(route.query, filtersPrefix)
   );
-  watch(() => JSON.stringify(parsedFilterQuery.value), () => {
-    appliedFilter.value = parsedFilterQuery.value;
-  }, { immediate: true });
+  watch(
+    () => JSON.stringify(parsedFilterQuery.value),
+    () => {
+      appliedFilter.value = parsedFilterQuery.value;
+    },
+    { immediate: true }
+  );
   const appliedFiltersCount = computed(() => {
     let count = 0;
     count += appliedFilter.value.attributes?.length ?? 0;
@@ -19,17 +23,15 @@ export function useAppliedFilters(route, { filtersPrefix } = { filtersPrefix: "f
     }
     return count;
   });
-  const appliedAttributeValues = computed(
-    () => {
-      const attributes = appliedFilter.value?.attributes ?? [];
-      return attributes.reduce((values, attribute) => {
-        if (attribute.type === "attributes" && attribute.key) {
-          values[attribute.key] = attribute.values;
-        }
-        return values;
-      }, {});
-    }
-  );
+  const appliedAttributeValues = computed(() => {
+    const attributes = appliedFilter.value?.attributes ?? [];
+    return attributes.reduce((values, attribute) => {
+      if (attribute.type === "attributes" && attribute.key) {
+        values[attribute.key] = attribute.values;
+      }
+      return values;
+    }, {});
+  });
   const appliedBooleanValues = computed(() => {
     const attributes = appliedFilter.value?.attributes ?? [];
     return attributes.reduce((values, attribute) => {

package/dist/runtime/composables/useFiltersForListing.js

@@ -16,12 +16,7 @@ export function useFiltersForListing({
     },
     fetchingKey ?? params?.value.categoryId ? `${params?.value.categoryId}-filters` : "search-filters"
   );
-  const {
-    data,
-    refresh,
-    status,
-    error
-  } = filterData;
+  const { data, refresh, status, error } = filterData;
   const availableFilters = computed(() => {
     return data.value?.filters.filter((filter) => {
       if (filter.type !== "boolean") {
@@ -39,11 +34,14 @@ export function useFiltersForListing({
   const filteredProductCount = computed(() => {
     return data.value?.unfilteredCount ?? 0;
   });
-  return extendPromise(filterData.then(() => ({})), {
-    refresh,
-    status,
-    error,
-    availableFilters,
-    filteredProductCount
-  });
+  return extendPromise(
+    filterData.then(() => ({})),
+    {
+      refresh,
+      status,
+      error,
+      availableFilters,
+      filteredProductCount
+    }
+  );
 }

package/dist/runtime/composables/useProductListingSeoData.js

@@ -11,11 +11,13 @@ export function useProductListingSeoData(breadcrumbs, route, { baseUrl, fullPath
     return !areFiltersApplied.value && toValue(isDefaultSortSelected) && pageNumber === 1 ? "index,follow" : "noindex,follow";
   });
   const canonicalLink = computed(
-    () => robots.value.includes("noindex") ? [] : [{
-      rel: "canonical",
-      key: "canonical",
-      href: sanitizeCanonicalURL(`${baseUrl}${fullPath}`)
-    }]
+    () => robots.value.includes("noindex") ? [] : [
+      {
+        rel: "canonical",
+        key: "canonical",
+        href: sanitizeCanonicalURL(`${baseUrl}${fullPath}`)
+      }
+    ]
   );
   const title = computed(() => {
     return toValue(breadcrumbs).map(({ value }) => value).join(" - ");

package/dist/runtime/composables/useProductsForListing.js

@@ -11,17 +11,20 @@ export function useProductsForListing({
   fetchingKey,
   fetchingOptions
 } = {}) {
-  const productsData = useProducts({
-    params: () => ({
-      // NOTE: We don't want to include trackSearchAnalyticsEvent parameter when paginating,
-      // as this logs the search term on every page request.
-      // Instead, we log the term only once, when the search is first performed.
-      // See: https://scayle.dev/en/core-documentation/the-basics/shops/search#scayle-search-analytics
-      trackSearchAnalyticsEvent: !!(params.value.page === 1 && params.value?.where?.term),
-      ...params.value
-    }),
-    options: fetchingOptions
-  }, fetchingKey ?? `${params?.value?.categoryId ?? 0}-products`);
+  const productsData = useProducts(
+    {
+      params: () => ({
+        // NOTE: We don't want to include trackSearchAnalyticsEvent parameter when paginating,
+        // as this logs the search term on every page request.
+        // Instead, we log the term only once, when the search is first performed.
+        // See: https://scayle.dev/en/core-documentation/the-basics/shops/search#scayle-search-analytics
+        trackSearchAnalyticsEvent: !!(params.value.page === 1 && params.value?.where?.term),
+        ...params.value
+      }),
+      options: fetchingOptions
+    },
+    fetchingKey ?? `${params?.value?.categoryId ?? 0}-products`
+  );
   const products = computed(() => {
     return productsData.data.value?.products ?? [];
   });

package/dist/runtime/rpc/methods/categories.js

@@ -4,44 +4,47 @@ import {
   HttpStatusMessage,
   defineRpcHandler
 } from "@scayle/storefront-nuxt";
-export const getAllShopCategoriesForId = defineRpcHandler(async ({ id, properties }, context) => {
-  if (typeof id !== "number" || isNaN(id)) {
-    return new ErrorResponse(
-      HttpStatusCode.BAD_REQUEST,
-      HttpStatusMessage.BAD_REQUEST,
-      "Invalid category id"
-    );
-  }
-  const { runtimeConfiguration, sapiClient, log, cached } = context;
-  const fetchAllCategories = async () => {
-    const categories = [];
-    const shops = Object.values(
-      runtimeConfiguration.storefront.shops
-    );
-    await Promise.all(
-      shops.map(async (shop) => {
-        try {
-          const category = await sapiClient.clone({ shopId: shop.shopId }).categories.getById(id, {
-            with: {
-              properties
-            }
-          });
-          categories.push({
-            locale: shop.locale,
-            path: Array.isArray(shop.path) ? shop.path[0] : shop.path,
-            category
-          });
-        } catch (error) {
-          log.error(error instanceof Error ? error : String(error));
-        }
-      })
-    );
-    return categories;
-  };
-  const result = await cached(fetchAllCategories, {
-    cacheKeyPrefix: `getAllShopCategoriesForId-${id}`,
-    ttl: 12 * 60 * 60
-    // 12 hours
-  })();
-  return result;
-});
+export const getAllShopCategoriesForId = defineRpcHandler(
+  async ({ id, properties }, context) => {
+    if (typeof id !== "number" || isNaN(id)) {
+      return new ErrorResponse(
+        HttpStatusCode.BAD_REQUEST,
+        HttpStatusMessage.BAD_REQUEST,
+        "Invalid category id"
+      );
+    }
+    const { runtimeConfiguration, sapiClient, log, cached } = context;
+    const fetchAllCategories = async () => {
+      const categories = [];
+      const shops = Object.values(
+        runtimeConfiguration.storefront.shops
+      );
+      await Promise.all(
+        shops.map(async (shop) => {
+          try {
+            const category = await sapiClient.clone({ shopId: shop.shopId }).categories.getById(id, {
+              with: {
+                properties
+              }
+            });
+            categories.push({
+              locale: shop.locale,
+              path: Array.isArray(shop.path) ? shop.path[0] : shop.path,
+              category
+            });
+          } catch (error) {
+            log.error(error instanceof Error ? error : String(error));
+          }
+        })
+      );
+      return categories;
+    };
+    const result = await cached(fetchAllCategories, {
+      cacheKeyPrefix: `getAllShopCategoriesForId-${id}`,
+      ttl: 12 * 60 * 60
+      // 12 hours
+    })();
+    return result;
+  },
+  { method: "GET" }
+);

package/dist/runtime/utils/filters.js

@@ -9,10 +9,7 @@ export const parseFilterDataFromRoute = (query, filtersPrefix) => {
     if (!queryKey.includes(filtersPrefix)) {
       return;
     }
-    const filterName = queryKey.replace(filtersPrefix, "").replace(
-      /[\[\]]/g,
-      ""
-    );
+    const filterName = queryKey.replace(filtersPrefix, "").replace(/[\[\]]/g, "");
     switch (filterName) {
       case "minPrice":
       case "maxPrice":

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scayle/storefront-product-listing",
-  "version": "2.4.0",
+  "version": "2.5.1",
   "description": "Collection of essential composables and utilities to work with product listing",
   "author": "SCAYLE Commerce Engine",
   "license": "MIT",
@@ -28,6 +28,9 @@
     "CHANGELOG.md",
     "dist"
   ],
+  "engines": {
+    "node": ">= 22.0.0"
+  },
   "imports": {
     "#storefront-product-listing": "./dist/runtime/index.js"
   },
@@ -41,29 +44,29 @@
   },
   "devDependencies": {
     "@arethetypeswrong/cli": "0.18.2",
-    "@nuxt/kit": "3.20.0",
+    "@nuxt/kit": "^3.21.7",
     "@nuxt/module-builder": "1.0.2",
-    "@nuxt/schema": "3.20.0",
-    "@nuxt/test-utils": "3.23.0",
-    "@types/node": "22.19.5",
-    "@vitest/coverage-v8": "4.0.16",
-    "@vueuse/core": "14.1.0",
-    "dprint": "0.51.1",
-    "eslint-formatter-gitlab": "7.0.1",
-    "eslint": "9.39.2",
+    "@nuxt/schema": "^3.21.7",
+    "@nuxt/test-utils": "4.0.0",
+    "@scayle/eslint-config-storefront": "^4.8.0",
+    "@types/node": "24.12.2",
+    "@vitest/coverage-v8": "4.1.9",
+    "@vueuse/core": "14.3.0",
+    "eslint-formatter-gitlab": "7.1.0",
+    "eslint": "10.5.0",
     "fishery": "2.4.0",
-    "happy-dom": "20.1.0",
-    "nuxt": "3.20.0",
-    "publint": "0.3.16",
+    "h3": "1.15.11",
+    "happy-dom": "20.10.6",
+    "nuxt": "^3.21.7",
+    "publint": "0.3.21",
     "schema-dts": "1.1.5",
-    "typescript": "5.9.3",
+    "typescript": "6.0.3",
     "unbuild": "3.6.1",
-    "vitest": "4.0.16",
+    "vitest": "4.1.9",
     "vue-router": "4.6.4",
-    "vue-tsc": "3.2.2",
-    "vue": "3.5.26",
-    "@scayle/eslint-config-storefront": "4.7.20",
-    "@scayle/storefront-nuxt": "8.58.0",
+    "vue-tsc": "3.3.5",
+    "vue": "3.5.38",
+    "@scayle/storefront-nuxt": "8.62.1",
     "@scayle/vitest-config-storefront": "1.0.0"
   },
   "scripts": {
@@ -74,11 +77,6 @@
     "lint": "eslint .",
     "lint:ci": "eslint . --format gitlab",
     "lint:fix": "eslint . --fix",
-    "format": "dprint check",
-    "format:fix": "dprint fmt",
-    "test": "vitest --run",
-    "test:watch": "vitest",
-    "test:ci": "vitest --run --coverage --reporter=default --reporter=junit --outputFile=./coverage/junit.xml",
     "typecheck": "vue-tsc --noEmit && cd playground && vue-tsc --noEmit",
     "package:lint": "publint",
     "verify-packaging": "attw --pack . --profile esm-only"