@scayle/storefront-nuxt 8.61.1 โ†’ 8.61.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/CHANGELOG-V7.md +3 -11
  2. package/CHANGELOG.md +241 -255
  3. package/dist/module.json +1 -1
  4. package/dist/module.mjs +97 -39
  5. package/dist/runtime/api/rpcHandler.js +1 -4
  6. package/dist/runtime/cached.js +1 -6
  7. package/dist/runtime/campaignKey.js +15 -15
  8. package/dist/runtime/composables/core/useIDP.js +11 -13
  9. package/dist/runtime/composables/core/useSession.js +1 -3
  10. package/dist/runtime/composables/core/useUser.js +24 -30
  11. package/dist/runtime/composables/storefront/useBasket.d.ts +1 -1
  12. package/dist/runtime/composables/storefront/useBasket.js +32 -45
  13. package/dist/runtime/composables/storefront/useBrand.js +1 -6
  14. package/dist/runtime/composables/storefront/useBrands.js +1 -6
  15. package/dist/runtime/composables/storefront/useCampaign.js +1 -6
  16. package/dist/runtime/composables/storefront/useCategories.js +12 -19
  17. package/dist/runtime/composables/storefront/useCategoryById.js +1 -6
  18. package/dist/runtime/composables/storefront/useCategoryByPath.js +1 -6
  19. package/dist/runtime/composables/storefront/useCurrentPromotions.js +7 -12
  20. package/dist/runtime/composables/storefront/useFilters.js +1 -6
  21. package/dist/runtime/composables/storefront/useNavigationTree.js +2 -12
  22. package/dist/runtime/composables/storefront/useNavigationTrees.js +1 -6
  23. package/dist/runtime/composables/storefront/useProduct.js +1 -6
  24. package/dist/runtime/composables/storefront/useProducts.js +1 -6
  25. package/dist/runtime/composables/storefront/useProductsByIds.js +1 -6
  26. package/dist/runtime/composables/storefront/useProductsByReferenceKeys.js +1 -6
  27. package/dist/runtime/composables/storefront/useProductsCount.js +1 -6
  28. package/dist/runtime/composables/storefront/usePromotions.js +1 -6
  29. package/dist/runtime/composables/storefront/usePromotionsByIds.js +1 -6
  30. package/dist/runtime/composables/storefront/useShopConfiguration.js +1 -6
  31. package/dist/runtime/composables/storefront/useUserAddresses.js +1 -6
  32. package/dist/runtime/composables/storefront/useVariant.js +1 -6
  33. package/dist/runtime/composables/storefront/useWishlist.d.ts +1 -1
  34. package/dist/runtime/composables/storefront/useWishlist.js +11 -25
  35. package/dist/runtime/context.js +2 -10
  36. package/dist/runtime/nitro/plugins/configValidation.js +6 -4
  37. package/dist/runtime/nitro/plugins/nitroStorageConfig.js +1 -4
  38. package/dist/runtime/server/middleware/bootstrap.js +3 -14
  39. package/dist/runtime/server/middleware/redirects.js +1 -3
  40. package/dist/runtime/utils/storage.js +1 -4
  41. package/dist/runtime/utils/zodSchema.js +33 -25
  42. package/package.json +13 -12
package/CHANGELOG.md CHANGED
@@ -1,5 +1,40 @@
1
1
  # @scayle/storefront-nuxt
2
2
 
3
+ ## 8.61.3
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependency `@vercel/nft@1.4.0` to `@vercel/nft@1.5.0`
8
+ - Fix `updateTokens` and `updateUser` return type from `void` to `Promise<void>` in `ContextWithSession`. The underlying implementations were already async (`await session.save()`), but the incorrect `void` type prevented call sites from knowing they needed to await the result. All call sites in the RPC methods and customer API now correctly await these calls, ensuring session state is persisted before execution continues.
9
+
10
+ **Dependencies**
11
+
12
+ **@scayle/storefront-core v8.61.3**
13
+
14
+ - Patch
15
+ - Fix `updateTokens` and `updateUser` return type from `void` to `Promise<void>` in `ContextWithSession`. The underlying implementations were already async (`await session.save()`), but the incorrect `void` type prevented call sites from knowing they needed to await the result. All call sites in the RPC methods and customer API now correctly await these calls, ensuring session state is persisted before execution continues.
16
+
17
+ ## 8.61.2
18
+
19
+ ### Patch Changes
20
+
21
+ - Improved build-time loading of custom RPC modules when generating the
22
+ `#virtual/rpcHttpMethods` manifest so Nuxt string aliases (for example `#shared`) resolve the same way
23
+ as in app code during HTTP verb inference.
24
+ - Resolved aliases from `@nuxt/kit` `resolvePath` (including virtual templates)
25
+ are passed to Jiti together with an app-root parent URL so imports inside `rpcMethods` match dev
26
+ behavior.
27
+ - If a module still cannot be resolved or imported, those methods continue to default to `POST` with a
28
+ logged warning.
29
+
30
+ - Added dependency `jiti@^2.6.1`
31
+
32
+ **Dependencies**
33
+
34
+ **@scayle/storefront-core v8.61.2**
35
+
36
+ - No changes in this release.
37
+
3
38
  ## 8.61.1
4
39
 
5
40
  ### Patch Changes
@@ -23,13 +58,13 @@
23
58
 
24
59
  ```ts
25
60
  // Safe reads โ€” eligible for CDN / browser caching
26
- export const getNavigation = defineRpcHandler(handler, { method: "GET" });
61
+ export const getNavigation = defineRpcHandler(handler, { method: 'GET' })
27
62
 
28
63
  // Mutations
29
- export const updateBasketItem = defineRpcHandler(handler, { method: "PUT" });
64
+ export const updateBasketItem = defineRpcHandler(handler, { method: 'PUT' })
30
65
  export const deleteWishlistItem = defineRpcHandler(handler, {
31
- method: "DELETE",
32
- });
66
+ method: 'DELETE',
67
+ })
33
68
  ```
34
69
 
35
70
  RPCs returning user-specific data (basket, wishlist, tokens) should stay on `POST` to prevent unintended caching.
@@ -43,29 +78,28 @@
43
78
  **@scayle/storefront-core v8.61.0**
44
79
 
45
80
  - Minor
46
-
47
81
  - **[RPC]** `defineRpcHandler` now accepts an optional `method` option (`'GET' | 'POST' | 'PUT' | 'DELETE'`) to declare the HTTP method for the handler. Defaults to `'POST'`, so existing handlers behave exactly as before. 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.
48
82
 
49
83
  User- and session-specific RPCs (`getBasket`, `getUser`, `fetchUser`, `getWishlist`, `getAccessToken`, `getCheckoutToken`, `getOrderById`, `getCheckoutDataByCbd`, `getShopUserAddress`) intentionally stay on `POST` so their responses are never eligible for CDN or browser caching.
50
84
 
51
85
  ```ts
52
- import { defineRpcHandler, type RpcContext } from "@scayle/storefront-core";
86
+ import { defineRpcHandler, type RpcContext } from '@scayle/storefront-core'
53
87
 
54
88
  // Safe, public read โ€” eligible for CDN/browser caching
55
89
  export const getNavigation = defineRpcHandler(
56
90
  async (context: RpcContext) => {
57
91
  /* ... */
58
92
  },
59
- { method: "GET" }
60
- );
93
+ { method: 'GET' },
94
+ )
61
95
 
62
96
  // User-specific / Mutation โ€” uses POST to prevent cache leakage
63
97
  export const getBasket = defineRpcHandler(
64
98
  async (context: RpcContext) => {
65
99
  /* ... */
66
- }
100
+ },
67
101
  // method defaults to 'POST'
68
- );
102
+ )
69
103
  ```
70
104
 
71
105
  - Patch
@@ -97,7 +131,6 @@
97
131
  **@scayle/storefront-core v8.60.0**
98
132
 
99
133
  - Minor
100
-
101
134
  - All packages now require Node.js 22 or later, in line with the current Node.js LTS release schedule. See the [Node.js release schedule](https://nodejs.org/en/about/previous-releases#release-schedule) for details.
102
135
 
103
136
  If your project is still running an older Node.js version, now is a good time to upgrade to Node.js 22 at minimum, or ideally Node.js 24, for the latest security patches and stability improvements.
@@ -151,7 +184,6 @@
151
184
  **@scayle/storefront-core v8.59.4**
152
185
 
153
186
  - Patch
154
-
155
187
  - Fixed error handling in `oauthRegister` and other OAuth-related RPC methods to properly propagate HTTP status codes like 409 Conflict instead of converting them to 500 Internal Server Error.
156
188
 
157
189
  The `convertErrorForRpcCall` function now correctly handles `OAuthRequestError` instances that wrap `FetchError` objects. Previously, when OAuth API errors occurred (such as attempting to register with an existing email), the error handling only checked for direct `FetchError` instances, causing wrapped errors to fall through to a generic 500 error response. Now the function extracts the underlying `FetchError` from `OAuthRequestError` instances, ensuring that the correct HTTP status codes are returned to the frontend.
@@ -179,7 +211,6 @@
179
211
  **@scayle/storefront-core v8.59.2**
180
212
 
181
213
  - Patch
182
-
183
214
  - Deprecated the `slugify` and `getProductPath` functions in `productHelpers.ts` due to compatibility issues with Nuxt 4.
184
215
 
185
216
  To maintain compatibility with Nuxt 4, these functions have been deprecated. Developers should migrate to using `useRouteHelpers().slugify()` instead. Additionally, the `slugify` package must be added as a direct dependency in your Storefront Application.
@@ -187,33 +218,33 @@
187
218
  **Migration:**
188
219
 
189
220
  ```ts
190
- import baseSlugify from "slugify";
221
+ import baseSlugify from 'slugify'
191
222
 
192
223
  const slugify = (url: string | undefined): string => {
193
- return baseSlugify(url ?? "", {
224
+ return baseSlugify(url ?? '', {
194
225
  lower: true,
195
226
  remove: /[*+~.()'"!:@/#?]/g,
196
- });
197
- };
227
+ })
228
+ }
198
229
 
199
- const localePath = useLocalePath();
230
+ const localePath = useLocalePath()
200
231
 
201
232
  const getProductDetailRoute = (
202
233
  id: number,
203
234
  name?: string,
204
- locale?: Locale
235
+ locale?: Locale,
205
236
  ): string => {
206
237
  return localePath(
207
238
  {
208
- name: "p-productName-id",
239
+ name: 'p-productName-id',
209
240
  params: {
210
241
  productName: slugify(name),
211
242
  id: `${id}`,
212
243
  },
213
244
  },
214
- locale
215
- );
216
- };
245
+ locale,
246
+ )
247
+ }
217
248
  ```
218
249
 
219
250
  ## 8.59.1
@@ -228,7 +259,6 @@
228
259
  **@scayle/storefront-core v8.59.1**
229
260
 
230
261
  - Patch
231
-
232
262
  - Fixed import compatibility issue with the `slugify` package in `productHelpers.ts` to support both ESM and CommonJS module formats.
233
263
 
234
264
  The import was changed from a default import to a namespace import with a fallback, ensuring the `baseSlugify` function works correctly across different module systems and build configurations.
@@ -252,7 +282,6 @@
252
282
 
253
283
  - Introduced support for Nuxt 4 while maintaining full backward compatibility with Nuxt 3.
254
284
  This enables consumers to migrate to Nuxt 4 ahead of the Nuxt 3 end of support on 31 Jan 2026.
255
-
256
285
  - **Version Requirements:**
257
286
  - Nuxt 3: `v3.13.0+`
258
287
  - Nuxt 4: `v4.2.0+`
@@ -336,11 +365,9 @@
336
365
  **@scayle/storefront-core v8.57.0**
337
366
 
338
367
  - Minor
339
-
340
368
  - **\[Navigation\]** Exported Navigation V2 API types to provide TypeScript support for the new navigation endpoints.
341
369
 
342
370
  The following types are now available from `@scayle/storefront-core`:
343
-
344
371
  - `GetNavigationV2Parameters` - Parameters for fetching navigation trees via the V2 API
345
372
  - `NavigationV2AllEndpointResponseData` - Response type for fetching all navigation trees
346
373
  - `NavigationV2ByReferenceEndpointResponseData` - Response type for fetching a navigation tree by reference key
@@ -356,7 +383,6 @@
356
383
  The `RpcContext` now exposes a `sessionCustomData` property to read custom session data and an `updateSessionCustomData` method to update it.
357
384
  The `sessionCustomData` property may be `undefined` when no session exists or when no custom data has been set.
358
385
  The `SessionCustomData` interface can be augmented with TypeScript module augmentation to provide type safety for custom session properties.
359
-
360
386
  - **Type Augmentation Example:**
361
387
 
362
388
  ```ts
@@ -374,39 +400,39 @@
374
400
 
375
401
  ```ts
376
402
  // server/plugins/session-plugin.ts
377
- import { hasSession } from "@scayle/storefront-nuxt";
378
- import { defineNitroPlugin } from "#imports";
403
+ import { hasSession } from '@scayle/storefront-nuxt'
404
+ import { defineNitroPlugin } from '#imports'
379
405
 
380
406
  export default defineNitroPlugin((nitroApp) => {
381
- nitroApp.hooks.hook("storefront:afterLogin", async (_data, context) => {
407
+ nitroApp.hooks.hook('storefront:afterLogin', async (_data, context) => {
382
408
  // Check if we actually have a RpcContext with proper session data
383
409
  if (!hasSession(context)) {
384
- return;
410
+ return
385
411
  }
386
412
 
387
413
  // Should you have set custom session data already in another hook,
388
414
  // it might be necessary to get existing data first.
389
- const sessionCustomData = context.sessionCustomData;
415
+ const sessionCustomData = context.sessionCustomData
390
416
 
391
417
  // The update functions overrides the customData object on a session.
392
418
  // Should you have set custom session data already in another hooks,
393
419
  // you need to pass it in addition to your new custom session data.
394
420
  context.updateSessionCustomData({
395
421
  ...sessionCustomData,
396
- yourCustomDataKey: "Your Session CustomData Value",
397
- });
422
+ yourCustomDataKey: 'Your Session CustomData Value',
423
+ })
398
424
 
399
425
  // Before accessing your session custom data, you might want to use an
400
426
  // explicit early return conditional.
401
427
  if (!sessionCustomData) {
402
- return;
428
+ return
403
429
  }
404
430
 
405
431
  // Your custom session data can also be accessedd directly via
406
432
  // nullish coalescing depending on your needs.
407
- console.log(context.sessionCustomData?.yourCustomDataKey);
408
- });
409
- });
433
+ console.log(context.sessionCustomData?.yourCustomDataKey)
434
+ })
435
+ })
410
436
  ```
411
437
 
412
438
  ### Patch Changes
@@ -418,7 +444,6 @@
418
444
  **@scayle/storefront-core v8.56.0**
419
445
 
420
446
  - Minor
421
-
422
447
  - Added support for custom session data in the RPC context type definitions.
423
448
 
424
449
  The `ContextWithSession` interface now includes a `sessionCustomData` property (which may be `undefined`) to read custom session data and an `updateSessionCustomData` method to update it.
@@ -460,26 +485,25 @@
460
485
  - 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).
461
486
 
462
487
  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.
463
-
464
488
  - **Before:** Keys were static strings.
465
489
  - **After:** Keys can be reactive, enabling dynamic caching and automatic updates.
466
490
 
467
491
  ```ts
468
492
  // Before
469
- const { data } = await useRpc("getProduct", "my-static-product-key", {
493
+ const { data } = await useRpc('getProduct', 'my-static-product-key', {
470
494
  productId: 123,
471
- });
495
+ })
472
496
 
473
497
  // After
474
- const productId = ref(123);
498
+ const productId = ref(123)
475
499
 
476
500
  // The key is now reactive. If `productId` changes, the key updates
477
501
  // to 'product-456' (for example) and triggers a new fetch.
478
502
  const { data } = await useRpc(
479
- "getProduct",
503
+ 'getProduct',
480
504
  () => `product-${productId.value}`,
481
- { productId }
482
- );
505
+ { productId },
506
+ )
483
507
  ```
484
508
 
485
509
  - Deprecated the `CheckoutEvent` type, which will be removed in the next major version.
@@ -491,22 +515,22 @@
491
515
  The type definition remains unchanged, so you can copy it directly:
492
516
 
493
517
  ```ts
494
- import type { ShopUser } from "@scayle/storefront-nuxt";
518
+ import type { ShopUser } from '@scayle/storefront-nuxt'
495
519
 
496
520
  export interface CheckoutEvent {
497
521
  /** Action. */
498
- action?: "authenticated";
522
+ action?: 'authenticated'
499
523
  /** Type. */
500
- type?: "tracking";
524
+ type?: 'tracking'
501
525
  /** User. */
502
- user: ShopUser;
526
+ user: ShopUser
503
527
  /**
504
528
  * The OAuth 2.0 access token for the authenticated user.
505
529
  * This token can be used to access protected resources on behalf of the user.
506
530
  *
507
531
  * @see https://www.rfc-editor.org/rfc/rfc6749
508
532
  */
509
- accessToken: string;
533
+ accessToken: string
510
534
  /**
511
535
  * Details about a specific event within the checkout process.
512
536
  * This field is optional and is only used when tracking specific actions
@@ -516,25 +540,25 @@
516
540
  */
517
541
  event?: {
518
542
  /** Event name. */
519
- event: "login" | "add_to_cart" | "remove_from_cart";
543
+ event: 'login' | 'add_to_cart' | 'remove_from_cart'
520
544
  /** Event status. */
521
- status: "successful" | "error";
522
- };
545
+ status: 'successful' | 'error'
546
+ }
523
547
  }
524
548
  ```
525
549
 
526
550
  - Updated the `StorefrontRuntimeConfig` type to ensure configured `shops` correctly incorporates all extended properties from `AdditionalShopConfig`.
527
551
 
528
552
  ```ts
529
- declare module "@scayle/storefront-nuxt" {
553
+ declare module '@scayle/storefront-nuxt' {
530
554
  // Extend the shop config
531
555
  export interface AdditionalShopConfig {
532
- extendedProp: string;
556
+ extendedProp: string
533
557
  }
534
558
  }
535
559
 
536
560
  // `extendedProp` is now properly typed
537
- useRuntimeConfig().storefront.shops?.[shopId]?.extendedProp;
561
+ useRuntimeConfig().storefront.shops?.[shopId]?.extendedProp
538
562
  ```
539
563
 
540
564
  **Dependencies**
@@ -554,11 +578,11 @@
554
578
  ```ts
555
579
  // Before (or when `rpcDefaultLazy: false`)
556
580
  // You had to explicitly opt-in to lazy behavior
557
- const { data } = useRpc("someMethod", { some: "param" }, { lazy: true });
581
+ const { data } = useRpc('someMethod', { some: 'param' }, { lazy: true })
558
582
 
559
583
  // After (when `rpcDefaultLazy: true`)
560
584
  // Lazy behavior is now the default
561
- const { data } = useRpc("someMethod", { some: "param" });
585
+ const { data } = useRpc('someMethod', { some: 'param' })
562
586
  ```
563
587
 
564
588
  **Dependencies**
@@ -591,7 +615,6 @@
591
615
  **@scayle/storefront-core v8.53.0**
592
616
 
593
617
  - Minor
594
-
595
618
  - Added support for promotions on order items by introducing the `OrderItemPromotion` interface and extending the `OrderItem` type with an optional `promotions` field.
596
619
 
597
620
  This enables developers to access promotion information (`id`, `name`, and `version`) directly from order items, improving visibility into which promotions were applied to each item in an order.
@@ -621,7 +644,6 @@
621
644
  **@scayle/storefront-core v8.51.0**
622
645
 
623
646
  - Minor
624
-
625
647
  - Added an email hash (`emailHash`) property to the user object returned by the `fetchUser` RPC method.
626
648
 
627
649
  The `emailHash` property is automatically included in all user objects returned by the RPCs.
@@ -633,7 +655,6 @@
633
655
  ### Minor Changes
634
656
 
635
657
  - Introduced validation for domain configuration when `shopSelector: 'domain'` is enabled. This ensures that any domain-related misconfigurations are detected early during development. The validation requires the use of `@nuxtjs/i18n` and includes the following checks:
636
-
637
658
  - Ensures every shop has a domain property configured
638
659
  - Verifies that domains configured in the shop config are also present in the `@nuxtjs/i18n` configuration
639
660
  - Checks that all domains in the i18n configuration are unique (no duplicates)
@@ -661,7 +682,6 @@
661
682
  **@scayle/storefront-core v8.49.0**
662
683
 
663
684
  - Minor
664
-
665
685
  - Exported the `sha256` utility function as part of the public API.
666
686
 
667
687
  This function provides a convenient way to calculate SHA256 hashes of strings using the Web Crypto API, returning hexadecimal strings.
@@ -670,10 +690,10 @@
670
690
  Example:
671
691
 
672
692
  ```ts
673
- import { sha256 } from "@scayle/storefront-core";
693
+ import { sha256 } from '@scayle/storefront-core'
674
694
 
675
- const hash = await sha256("hello");
676
- console.log(hash); // '2cf24dba5fb0a30e26e83b2ac5b9e29e1b161e5c1fa7425e73043362938b9824'
695
+ const hash = await sha256('hello')
696
+ console.log(hash) // '2cf24dba5fb0a30e26e83b2ac5b9e29e1b161e5c1fa7425e73043362938b9824'
677
697
  ```
678
698
 
679
699
  ## 8.48.1
@@ -687,11 +707,9 @@
687
707
  **@scayle/storefront-core v8.48.1**
688
708
 
689
709
  - Patch
690
-
691
710
  - Export `SmartSortingKey` constant containing all predefined smart sorting keys for intelligent product sorting. Smart sorting keys provide advanced sorting algorithms that consider multiple factors like discounts, inventory levels, sales performance, and recency to optimize product listings.
692
711
 
693
712
  Available keys:
694
-
695
713
  - `SmartSortingKey.SALES_PUSH` - Promotes items with highest discounts and oldest inventory
696
714
  - `SmartSortingKey.NEW_ARRIVALS` - Prioritizes recently added products with good availability
697
715
  - `SmartSortingKey.BALANCED_OFFERINGS` - Balances recency, availability, discounts, and sales data
@@ -734,7 +752,6 @@
734
752
  **@scayle/storefront-core v8.47.0**
735
753
 
736
754
  - Minor
737
-
738
755
  - Enhanced basket RPC methods to support order custom data functionality.
739
756
 
740
757
  All basket RPC methods now integrate with the `getOrderCustomData` RPC method to fetch and include order custom data in SAPI requests.
@@ -753,12 +770,11 @@
753
770
  customer: {
754
771
  groups: context.user?.groups,
755
772
  },
756
- };
757
- });
773
+ }
774
+ })
758
775
  ```
759
776
 
760
777
  For further information, please refer to the [Overriding Core RPC Methods](https://scayle.dev/en/core-documentation/storefront-guide/storefront-application/technical-foundation/rpc-methods?sourceText=RPC%2520Methods#overriding-core-rpc-methods).
761
-
762
778
  - Updated all basket RPC methods to pass the customer access token to the SAPI client, enabling the `X-Customer-Token` header for promotion validation.
763
779
 
764
780
  The customer access token is now automatically included in basket requests when available.
@@ -775,7 +791,6 @@
775
791
  **@scayle/storefront-core v8.46.0**
776
792
 
777
793
  - Minor
778
-
779
794
  - Added `getAttributeValuesByGroupId` function to the `attributeHelpers` helper for retrieving attribute values by their numeric attribute group ID.
780
795
 
781
796
  This function allows you to retrieve attribute values filtered by a specific attribute group ID, providing a more targeted approach when working with grouped product attributes.
@@ -788,37 +803,36 @@
788
803
  #### Looking up by name (existing, now renamed):
789
804
 
790
805
  ```typescript
791
- import { getAttributeValuesByName } from "@scayle/storefront-core";
806
+ import { getAttributeValuesByName } from '@scayle/storefront-core'
792
807
 
793
808
  // Single-select attribute
794
- const sizes = getAttributeValuesByName(product.attributes, "size");
809
+ const sizes = getAttributeValuesByName(product.attributes, 'size')
795
810
  // Returns: [{ id: 1, label: 'M', value: 'medium' }]
796
811
 
797
812
  // Multi-select attribute
798
- const colors = getAttributeValuesByName(product.attributes, "color");
813
+ const colors = getAttributeValuesByName(product.attributes, 'color')
799
814
  // Returns: [{ id: 1, label: 'Red' }, { id: 2, label: 'Blue' }]
800
815
 
801
816
  // Non-existent attribute
802
- const missing = getAttributeValuesByName(product.attributes, "doesNotExist");
817
+ const missing = getAttributeValuesByName(product.attributes, 'doesNotExist')
803
818
  // Returns: []
804
819
  ```
805
820
 
806
821
  #### Looking up by group ID (new):
807
822
 
808
823
  ```typescript
809
- import { getAttributeValuesByGroupId } from "@scayle/storefront-core";
824
+ import { getAttributeValuesByGroupId } from '@scayle/storefront-core'
810
825
 
811
826
  // Look up attribute by its numeric ID from the SCAYLE API
812
- const promotionValues = getAttributeValuesByGroupId(product.attributes, 42);
827
+ const promotionValues = getAttributeValuesByGroupId(product.attributes, 42)
813
828
  // Returns: [{ id: 123, label: 'Summer Sale', value: 'summer-2024' }]
814
829
 
815
830
  // Non-existent attribute group
816
- const missing = getAttributeValuesByGroupId(product.attributes, 9999);
831
+ const missing = getAttributeValuesByGroupId(product.attributes, 9999)
817
832
  // Returns: []
818
833
  ```
819
834
 
820
835
  ### When to Use Each Function
821
-
822
836
  - **`getAttributeValuesByName`**: Use when you know the attribute name key (e.g., 'color', 'size'). This is the most common use case in application code.
823
837
  - **`getAttributeValuesByGroupId`**: Use when you have the numeric attribute group ID from the SCAYLE API, such as when processing API configurations, handling dynamic attribute mappings, or working with attribute group references.
824
838
 
@@ -876,27 +890,27 @@
876
890
  // nuxt.config.ts
877
891
  export default defineNuxtConfig({
878
892
  storefront: {
879
- apiBasePath: "/custom-api", // โœ… Configure globally for all shops
893
+ apiBasePath: '/custom-api', // โœ… Configure globally for all shops
880
894
  },
881
895
  runtimeConfig: {
882
896
  storefront: {
883
897
  shops: {
884
898
  1001: {
885
899
  shopId: 1001,
886
- path: "de",
900
+ path: 'de',
887
901
  // โœ… apiBasePath removed from shop config
888
902
  // ... other shop config
889
903
  },
890
904
  1002: {
891
905
  shopId: 1002,
892
- path: "en",
906
+ path: 'en',
893
907
  // โœ… apiBasePath removed from shop config
894
908
  // ... other shop config
895
909
  },
896
910
  },
897
911
  },
898
912
  },
899
- });
913
+ })
900
914
  ```
901
915
 
902
916
  Additionally, the types for the Storefront module options and Storefront runtime configuration have been cleaned up to properly reflect which settings can be set at runtime and which cannot. This clarifies the distinction between configuration that is static (set at build/module level) and configuration that is dynamic (set at runtime), improving type safety and developer experience.
@@ -1003,7 +1017,6 @@
1003
1017
  **@scayle/storefront-core v8.43.0**
1004
1018
 
1005
1019
  - Minor
1006
-
1007
1020
  - Added an export of the new promotion type `ComboDealEffect`
1008
1021
 
1009
1022
  This type is also included in the `PromotionEffectType` type and can be used to check if the promotion is of type `ComboDealEffect`.
@@ -1012,10 +1025,10 @@
1012
1025
 
1013
1026
  ```ts
1014
1027
  const isComboDealType = (
1015
- promotion?: Promotion | null
1028
+ promotion?: Promotion | null,
1016
1029
  ): promotion is Promotion<ComboDealEffect> => {
1017
- return promotion?.effect?.type === PromotionEffectType.COMBO_DEAL;
1018
- };
1030
+ return promotion?.effect?.type === PromotionEffectType.COMBO_DEAL
1031
+ }
1019
1032
  ```
1020
1033
 
1021
1034
  ## 8.42.2
@@ -1079,68 +1092,68 @@
1079
1092
  Before:
1080
1093
 
1081
1094
  ```ts
1082
- const updateBasketItemRpc = useRpcCall("updateBasketItem");
1083
- const addItemToBasketRpc = useRpcCall("addItemToBasket");
1095
+ const updateBasketItemRpc = useRpcCall('updateBasketItem')
1096
+ const addItemToBasketRpc = useRpcCall('addItemToBasket')
1084
1097
 
1085
1098
  updateBasketItemRpc({
1086
1099
  // ...
1087
- promotionId: "promotionId",
1088
- promotionCode: "promotionCode",
1089
- });
1100
+ promotionId: 'promotionId',
1101
+ promotionCode: 'promotionCode',
1102
+ })
1090
1103
 
1091
1104
  addItemToBasketRpc({
1092
1105
  // ...
1093
- promotionId: "promotionId",
1094
- promotionCode: "promotionCode",
1095
- });
1106
+ promotionId: 'promotionId',
1107
+ promotionCode: 'promotionCode',
1108
+ })
1096
1109
 
1097
1110
  // Or with useBasket composable
1098
1111
 
1099
- const { addItem } = useBasket();
1112
+ const { addItem } = useBasket()
1100
1113
  addItem({
1101
1114
  // ...
1102
- promotionId: "promotionId",
1103
- });
1115
+ promotionId: 'promotionId',
1116
+ })
1104
1117
  ```
1105
1118
 
1106
1119
  After:
1107
1120
 
1108
1121
  ```ts
1109
- const updateBasketItemRpc = useRpcCall("updateBasketItem");
1110
- const addItemToBasketRpc = useRpcCall("addItemToBasket");
1122
+ const updateBasketItemRpc = useRpcCall('updateBasketItem')
1123
+ const addItemToBasketRpc = useRpcCall('addItemToBasket')
1111
1124
 
1112
1125
  updateBasketItemRpc({
1113
1126
  // ...
1114
1127
  promotions: [
1115
- { id: "promotionId", code: "promotionCode" },
1128
+ { id: 'promotionId', code: 'promotionCode' },
1116
1129
  {
1117
- id: "promotionId2",
1130
+ id: 'promotionId2',
1118
1131
  },
1119
1132
  ],
1120
- });
1133
+ })
1121
1134
 
1122
1135
  addItemToBasketRpc({
1123
1136
  // ...
1124
1137
  promotions: [
1125
- { id: "promotionId", code: "promotionCode" },
1138
+ { id: 'promotionId', code: 'promotionCode' },
1126
1139
  {
1127
- id: "promotionId2",
1140
+ id: 'promotionId2',
1128
1141
  },
1129
1142
  ],
1130
- });
1143
+ })
1131
1144
 
1132
1145
  // Or for useBasket with composable
1133
1146
 
1134
- const { addItem } = useBasket();
1147
+ const { addItem } = useBasket()
1135
1148
  addItem({
1136
1149
  // ...
1137
1150
  promotions: [
1138
- { id: "promotionId", code: "promotionCode" },
1151
+ { id: 'promotionId', code: 'promotionCode' },
1139
1152
  {
1140
- id: "promotionId2",
1153
+ id: 'promotionId2',
1141
1154
  },
1142
1155
  ],
1143
- });
1156
+ })
1144
1157
  ```
1145
1158
 
1146
1159
  For more details, see the [Add a variant](https://scayle.dev/en/api-guides/storefront-api/resources/baskets/add-a-variant) and [Update an item](https://scayle.dev/en/api-guides/storefront-api/resources/baskets/update-an-item) guides.
@@ -1152,7 +1165,6 @@
1152
1165
  **@scayle/storefront-core v8.42.0**
1153
1166
 
1154
1167
  - Minor
1155
-
1156
1168
  - Added `promotions` field to `BasketItem` type to support multiple promotions per basket item.
1157
1169
 
1158
1170
  The `promotions` field is an array of `BasketItemPromotion` objects.
@@ -1260,7 +1272,7 @@
1260
1272
  </template>
1261
1273
 
1262
1274
  <script setup lang="ts">
1263
- const { relativeReductions } = useProductPrice(price);
1275
+ const { relativeReductions } = useProductPrice(price)
1264
1276
  </script>
1265
1277
  ```
1266
1278
 
@@ -1275,7 +1287,7 @@
1275
1287
  </template>
1276
1288
 
1277
1289
  <script setup lang="ts">
1278
- const { appliedReductions } = useProductPrice(price);
1290
+ const { appliedReductions } = useProductPrice(price)
1279
1291
  </script>
1280
1292
  ```
1281
1293
 
@@ -1413,7 +1425,6 @@
1413
1425
  **@scayle/storefront-core v8.36.0**
1414
1426
 
1415
1427
  - Minor
1416
-
1417
1428
  - Created a new RPC method `getCampaign` to retrieve the first active campaign.
1418
1429
 
1419
1430
  More details can be found in the official SCAYLE Resource Center under [API Guides / Storefront API / Campaigns / List Campaigns](https://scayle.dev/en/api-guides/storefront-api/resources/campaigns/list-campaigns).
@@ -1501,7 +1512,6 @@
1501
1512
  **@scayle/storefront-core v8.33.0**
1502
1513
 
1503
1514
  - Minor
1504
-
1505
1515
  - Added test factories for order and all related types.
1506
1516
 
1507
1517
  It is now possible to build orders with factory functions for testing purposes.
@@ -1541,27 +1551,26 @@
1541
1551
  **@scayle/storefront-core v8.31.0**
1542
1552
 
1543
1553
  - Minor
1544
-
1545
1554
  - Added `minReduction` and `maxReduction` filter parameters to `FetchProductsByCategoryParams.where` and `FetchFiltersParams.where` types, and updated the `getProductsByCategory` and `getFilters` RPC methods to accept and handle these new reduction-based filtering conditions.
1546
1555
 
1547
1556
  ```ts
1548
- const { data } = useRpc("getFilters", "getFiltersKey", () => ({
1557
+ const { data } = useRpc('getFilters', 'getFiltersKey', () => ({
1549
1558
  where: {
1550
1559
  minReduction: 10,
1551
1560
  maxReduction: 20,
1552
1561
  },
1553
- }));
1562
+ }))
1554
1563
 
1555
1564
  const { data } = useRpc(
1556
- "getProductsByCategory",
1557
- "getProductsByCategoryKey",
1565
+ 'getProductsByCategory',
1566
+ 'getProductsByCategoryKey',
1558
1567
  () => ({
1559
1568
  where: {
1560
1569
  minReduction: 10,
1561
1570
  maxReduction: 20,
1562
1571
  },
1563
- })
1564
- );
1572
+ }),
1573
+ )
1565
1574
  ```
1566
1575
 
1567
1576
  ## 8.30.3
@@ -1606,35 +1615,34 @@
1606
1615
  **@scayle/storefront-core v8.30.0**
1607
1616
 
1608
1617
  - Minor
1609
-
1610
1618
  - Added `defineRpcHandler` utility function that enhances RPC handlers with type-safe metadata for improved registration and invocation of RPC handlers. While defining RPC handlers without this utility remains supported, its usage is recommended and may become mandatory in a future major release.
1611
1619
 
1612
1620
  Existing RPC handlers can be easily migrated to use `defineRpcHandler` by passing the existing handler to `defineRpcHandler`.
1613
1621
 
1614
1622
  ```ts
1615
1623
  export const existingHandlerWithoutParams = async (_context: RpcContext) => {
1616
- return "existing handler";
1617
- };
1624
+ return 'existing handler'
1625
+ }
1618
1626
 
1619
1627
  export const existingHandlerWithParams = async (
1620
1628
  { name }: { name: string },
1621
- _context: RpcContext
1629
+ _context: RpcContext,
1622
1630
  ) => {
1623
- return name;
1624
- };
1631
+ return name
1632
+ }
1625
1633
 
1626
1634
  // will become
1627
1635
 
1628
1636
  export const existingHandlerWithoutParams = defineRpcHandler(
1629
1637
  async (_context: RpcContext) => {
1630
- return "existing handler";
1631
- }
1632
- );
1638
+ return 'existing handler'
1639
+ },
1640
+ )
1633
1641
  export const existingHandlerWithParams = defineRpcHandler(
1634
1642
  async ({ name }: { name: string }, _context: RpcContext) => {
1635
- return name;
1636
- }
1637
- );
1643
+ return name
1644
+ },
1645
+ )
1638
1646
  ```
1639
1647
 
1640
1648
  - Patch
@@ -1649,22 +1657,21 @@
1649
1657
  **@scayle/storefront-core v8.29.0**
1650
1658
 
1651
1659
  - Minor
1652
-
1653
1660
  - Added an `includeProductSorting` boolean parameter to all category RPC method endpoints (`getRootCategories`, `getCategoryByPath`, `getCategoriesByPath`, `getCategoryById`, `getCategoryTree`).
1654
1661
  This flag allows consumers to retrieve product sorting data, including the `smartSortingKey` and `customSortingKey` properties.
1655
1662
  Developers can leverage this data to seamlessly apply smart sorting keys on the product listing page by passing those parameters when fetching products.
1656
1663
  - Added an optional `hideEmptyCategories` parameter to `getCategoryTree`. When enabled, the product count for each category is retrieved, and categories (including their children) without any products are removed. Enabling this option may increase response times, especially for large category trees.
1657
1664
 
1658
1665
  ```ts
1659
- import { rpcMethods } from "@scayle/storefront-core";
1666
+ import { rpcMethods } from '@scayle/storefront-core'
1660
1667
 
1661
- rpcMethods.getCategoryTree({ hideEmptyCategories: true }, rpcContext);
1668
+ rpcMethods.getCategoryTree({ hideEmptyCategories: true }, rpcContext)
1662
1669
  ```
1663
1670
 
1664
1671
  or
1665
1672
 
1666
1673
  ```ts
1667
- import { useCategoryTree } from "#storefront/composables";
1674
+ import { useCategoryTree } from '#storefront/composables'
1668
1675
 
1669
1676
  const { data: rootCategories, status } = useCategoryTree(
1670
1677
  {
@@ -1672,8 +1679,8 @@
1672
1679
  hideEmptyCategories: true,
1673
1680
  },
1674
1681
  },
1675
- "category-navigation-tree"
1676
- );
1682
+ 'category-navigation-tree',
1683
+ )
1677
1684
  ```
1678
1685
 
1679
1686
  ## 8.28.7
@@ -1770,9 +1777,9 @@
1770
1777
  params: {
1771
1778
  children: 10,
1772
1779
  includeHidden: true,
1773
- properties: { withName: ["sale"] },
1780
+ properties: { withName: ['sale'] },
1774
1781
  },
1775
- });
1782
+ })
1776
1783
  ```
1777
1784
 
1778
1785
  ### Patch Changes
@@ -1943,16 +1950,16 @@
1943
1950
  nitro: {
1944
1951
  storage: {
1945
1952
  redis: {
1946
- driver: "redis",
1947
- host: "localhost",
1953
+ driver: 'redis',
1954
+ host: 'localhost',
1948
1955
  },
1949
1956
  db: {
1950
- driver: "fs",
1951
- base: "./.data/db",
1957
+ driver: 'fs',
1958
+ base: './.data/db',
1952
1959
  },
1953
1960
  },
1954
1961
  },
1955
- });
1962
+ })
1956
1963
  ```
1957
1964
 
1958
1965
  With the introduction of the new approach for configuring storefront storage mounts, the global and shop-specific `storage` option within the `@scayle/storefront-nuxt` runtime configuration has been deprecated.
@@ -2008,7 +2015,6 @@
2008
2015
  **@scayle/storefront-core v8.23.0**
2009
2016
 
2010
2017
  - Minor
2011
-
2012
2018
  - Deprecated attribute group specific utilities `getFlattenedVariantCrosssellings` and
2013
2019
  `getFlattenedMaterialComposition`.
2014
2020
 
@@ -2025,9 +2031,9 @@
2025
2031
  ```typescript
2026
2032
  const idp = useIDP({
2027
2033
  authUrlParameters: {
2028
- theme: "dark",
2034
+ theme: 'dark',
2029
2035
  },
2030
- });
2036
+ })
2031
2037
  ```
2032
2038
 
2033
2039
  ### Patch Changes
@@ -2049,7 +2055,6 @@
2049
2055
  **@scayle/storefront-core v8.21.0**
2050
2056
 
2051
2057
  - Minor
2052
-
2053
2058
  - Expose the following filter types from `storefront-api`:
2054
2059
 
2055
2060
  - `FilterItemWithValues`
@@ -2169,25 +2174,22 @@
2169
2174
  storefront: {
2170
2175
  redirects: {
2171
2176
  enabled: true,
2172
- strategy: "on-missing",
2177
+ strategy: 'on-missing',
2173
2178
  },
2174
2179
  },
2175
2180
  },
2176
- });
2181
+ })
2177
2182
  ```
2178
2183
 
2179
2184
  Also, keep in mind that when this option is enabled, the redirect logic will only be executed when the request would otherwise result in a 404. There are three ways in which a 404 can occur.
2180
-
2181
2185
  1. No route found
2182
2186
 
2183
- If there is no matching route for the request's path, the framework will return a 404 response.
2184
-
2185
- 2. `Response` with 404 status
2187
+ If there is no matching route for the request's path, the framework will return a 404 response. 2. `Response` with 404 status
2186
2188
 
2187
2189
  If the request handler returns a `Response` object with a `status` of 404, a 404 response will be returned to the client.
2188
2190
 
2189
2191
  ```typescript
2190
- return new Response(null, { status: 404 });
2192
+ return new Response(null, { status: 404 })
2191
2193
  ```
2192
2194
 
2193
2195
  3. Thrown H3Error with 404 status
@@ -2195,8 +2197,8 @@
2195
2197
  If the request handler throws an H3Error with a `statusCode` 404, a 404 response will be returned to the client.
2196
2198
 
2197
2199
  ```typescript
2198
- import { createError } from "h3";
2199
- throw createError({ statusCode: 404 });
2200
+ import { createError } from 'h3'
2201
+ throw createError({ statusCode: 404 })
2200
2202
  ```
2201
2203
 
2202
2204
  ### Patch Changes
@@ -2431,7 +2433,6 @@
2431
2433
  - Deprecate `key`, `packages`, `shippingDates`, `isEmpty`, `countWithoutSoldOutItems`, `removeItem`, `contains`, `findItem`, `products`, `generateBasketKey` and `mergeBaskets` from `useBasket`.
2432
2434
 
2433
2435
  Required updates:
2434
-
2435
2436
  - `key`:
2436
2437
 
2437
2438
  ```TypeScript
@@ -2638,28 +2639,28 @@
2638
2639
  **rpc-methods.ts**
2639
2640
 
2640
2641
  ```typescript
2641
- import type { RpcContext, RpcHandler } from "@scayle/storefront-nuxt";
2642
+ import type { RpcContext, RpcHandler } from '@scayle/storefront-nuxt'
2642
2643
 
2643
2644
  export const foo: RpcHandler<string, number> = function testing(
2644
2645
  param: string,
2645
- _: RpcContext
2646
+ _: RpcContext,
2646
2647
  ) {
2647
- return param.length;
2648
- };
2648
+ return param.length
2649
+ }
2649
2650
  ```
2650
2651
 
2651
2652
  **module.ts**
2652
2653
 
2653
2654
  ```typescript
2654
2655
  function setup() {
2655
- const resolver = createResolver(import.meta.url);
2656
+ const resolver = createResolver(import.meta.url)
2656
2657
 
2657
- nuxt.hook("storefront:custom-rpc:extend", (customRpcImports) => {
2658
+ nuxt.hook('storefront:custom-rpc:extend', (customRpcImports) => {
2658
2659
  customRpcImports.push({
2659
- source: resolver.resolve("./rpc-methods.ts"),
2660
- names: ["foo"],
2661
- });
2662
- });
2660
+ source: resolver.resolve('./rpc-methods.ts'),
2661
+ names: ['foo'],
2662
+ })
2663
+ })
2663
2664
  }
2664
2665
  ```
2665
2666
 
@@ -2870,7 +2871,6 @@
2870
2871
 
2871
2872
  You'll need to migrate your existing storage settings to the new `storefront.storage` format.
2872
2873
  Check the [SCAYLE Resource Center](https://scayle.dev/en/core-documentation/storefront-guide/storefront-application/technical-foundation/storage) for more details.
2873
-
2874
2874
  - _No Longer Supported: Legacy Storage Setup in (`nuxt.config.ts`):_
2875
2875
 
2876
2876
  ```ts
@@ -2881,23 +2881,23 @@
2881
2881
  storefront: {
2882
2882
  // ...
2883
2883
  redis: {
2884
- host: "localhost",
2884
+ host: 'localhost',
2885
2885
  port: 6379,
2886
- prefix: "",
2887
- user: "",
2888
- password: "",
2886
+ prefix: '',
2887
+ user: '',
2888
+ password: '',
2889
2889
  sslTransit: false,
2890
2890
  },
2891
2891
  // ...
2892
2892
  session: {
2893
2893
  // ...
2894
- provider: "redis",
2894
+ provider: 'redis',
2895
2895
  },
2896
2896
  },
2897
2897
  // ...
2898
2898
  },
2899
2899
  // ...
2900
- });
2900
+ })
2901
2901
  ```
2902
2902
 
2903
2903
  - _Current Unified Storage Approach (`nuxt.config.ts`):_
@@ -2911,13 +2911,13 @@
2911
2911
  // ...
2912
2912
  storage: {
2913
2913
  cache: {
2914
- driver: "redis",
2915
- host: "localhost",
2914
+ driver: 'redis',
2915
+ host: 'localhost',
2916
2916
  port: 6379,
2917
2917
  },
2918
2918
  session: {
2919
- driver: "redis",
2920
- host: "localhost",
2919
+ driver: 'redis',
2920
+ host: 'localhost',
2921
2921
  port: 6379,
2922
2922
  },
2923
2923
  // ...
@@ -2927,11 +2927,10 @@
2927
2927
  // ...
2928
2928
  },
2929
2929
  // ...
2930
- });
2930
+ })
2931
2931
  ```
2932
2932
 
2933
2933
  - **\[๐Ÿ’ฅ BREAKING\]** The composable `useSearch` has been replaced by `useStorefrontSearch`, consolidating and transitioning to SCAYLE Search v2.
2934
-
2935
2934
  - _Previous Usage of `useSearch`:_
2936
2935
 
2937
2936
  ```ts
@@ -2953,7 +2952,6 @@
2953
2952
  ```
2954
2953
 
2955
2954
  - **\[๐Ÿ’ฅ BREAKING\]** The previous use of the `useFacet` composable for category-related product listings was overly complex and difficult to customize. To simplify things, dedicated composables are being introduced:
2956
-
2957
2955
  - `useProductsByCategory`: Replaces `useFacet` for fetching products within a specific category.
2958
2956
  - `useFilters` or `useProductListFilters`: Provide focused filter management capabilities.
2959
2957
 
@@ -2989,14 +2987,13 @@
2989
2987
 
2990
2988
  - **\[๐Ÿ’ฅ BREAKING\]** We've renamed the `useNavigationTree` composable to `useNavigationTreeById` for better clarity. Its functionality, parameters and return values stay identical.
2991
2989
  - **\[๐Ÿ’ฅ BREAKING\]** The composable `useQueryFilterState` has been superseded by the `useFilter` and `useAppliedFilters` (part of `@scayle/storefront-product-listing`) composables.
2992
-
2993
2990
  - _Previous Usage of `useQueryFilterState`:_
2994
2991
 
2995
2992
  ```ts
2996
2993
  const { activeFilters, applyFilters, resetFilterUrl, productConditions } =
2997
- useQueryFilterState();
2994
+ useQueryFilterState()
2998
2995
 
2999
- applyFilters({ brand: 23, sale: true, maxPrice: 100, minPrice: 0 });
2996
+ applyFilters({ brand: 23, sale: true, maxPrice: 100, minPrice: 0 })
3000
2997
  ```
3001
2998
 
3002
2999
  - _Current Usage of `useFilter` and `useAppliedFilters`:_
@@ -3009,70 +3006,68 @@
3009
3006
  resetFilters,
3010
3007
  resetPriceFilter,
3011
3008
  resetFilter,
3012
- } = useFilter();
3009
+ } = useFilter()
3013
3010
 
3014
- applyPriceFilter([0, 100]);
3015
- applyBooleanFilter("sale", true);
3016
- applyAttributeFilter("brand", 23);
3011
+ applyPriceFilter([0, 100])
3012
+ applyBooleanFilter('sale', true)
3013
+ applyAttributeFilter('brand', 23)
3017
3014
 
3018
- const route = useRoute();
3015
+ const route = useRoute()
3019
3016
  const {
3020
3017
  appliedFilter,
3021
3018
  appliedFiltersCount,
3022
3019
  appliedAttributeValues,
3023
3020
  appliedBooleanValues,
3024
3021
  areFiltersApplied,
3025
- } = useAppliedFilters(route);
3022
+ } = useAppliedFilters(route)
3026
3023
  ```
3027
3024
 
3028
3025
  - **\[๐Ÿ’ฅ BREAKING\]** The `getBadgeLabel` helper function has been removed, giving you more control over badge label display.
3029
-
3030
3026
  - **Note:** This change doesn't affect projects using SCAYLE Storefront Boilerplate v1.0 or later.
3031
3027
  - For applications based on older versions or using `getBadgeLabel`, you can refer to the previous implementation below:
3032
3028
 
3033
3029
  ```ts
3034
3030
  const BadgeLabel = {
3035
- NEW: "new",
3036
- SOLD_OUT: "sold_out",
3037
- ONLINE_EXCLUSIVE: "online_exclusive",
3038
- SUSTAINABLE: "sustainable",
3039
- PREMIUM: "premium",
3040
- DEFAULT: "",
3041
- } as const;
3031
+ NEW: 'new',
3032
+ SOLD_OUT: 'sold_out',
3033
+ ONLINE_EXCLUSIVE: 'online_exclusive',
3034
+ SUSTAINABLE: 'sustainable',
3035
+ PREMIUM: 'premium',
3036
+ DEFAULT: '',
3037
+ } as const
3042
3038
 
3043
3039
  type BadgeLabelParamsKeys =
3044
- | "isNew"
3045
- | "isSoldOut"
3046
- | "isOnlineOnly"
3047
- | "isSustainable"
3048
- | "isPremium";
3049
- type BadgeLabelParams = Partial<Record<BadgeLabelParamsKeys, boolean>>;
3040
+ | 'isNew'
3041
+ | 'isSoldOut'
3042
+ | 'isOnlineOnly'
3043
+ | 'isSustainable'
3044
+ | 'isPremium'
3045
+ type BadgeLabelParams = Partial<Record<BadgeLabelParamsKeys, boolean>>
3050
3046
 
3051
3047
  const getBadgeLabel = (params: BadgeLabelParams = {}): string => {
3052
3048
  if (!params) {
3053
- return BadgeLabel.DEFAULT;
3049
+ return BadgeLabel.DEFAULT
3054
3050
  }
3055
3051
  const { isNew, isSoldOut, isOnlineOnly, isSustainable, isPremium } =
3056
- params;
3052
+ params
3057
3053
 
3058
3054
  if (isNew) {
3059
- return BadgeLabel.NEW;
3055
+ return BadgeLabel.NEW
3060
3056
  } else if (isSoldOut) {
3061
- return BadgeLabel.SOLD_OUT;
3057
+ return BadgeLabel.SOLD_OUT
3062
3058
  } else if (isOnlineOnly) {
3063
- return BadgeLabel.ONLINE_EXCLUSIVE;
3059
+ return BadgeLabel.ONLINE_EXCLUSIVE
3064
3060
  } else if (isSustainable) {
3065
- return BadgeLabel.SUSTAINABLE;
3061
+ return BadgeLabel.SUSTAINABLE
3066
3062
  } else if (isPremium) {
3067
- return BadgeLabel.PREMIUM;
3063
+ return BadgeLabel.PREMIUM
3068
3064
  } else {
3069
- return BadgeLabel.DEFAULT;
3065
+ return BadgeLabel.DEFAULT
3070
3066
  }
3071
- };
3067
+ }
3072
3068
  ```
3073
3069
 
3074
3070
  - **\[๐Ÿ’ฅ BREAKING\]** The `store` option in the module configuration has been removed. `@scayle/storefront-nuxt@7.84.0` introduced the `shops` option as a replacement, but maintained backward compatibility with the `store` option. Going forward, configuring shops must be done using the `shops` keyword.
3075
-
3076
3071
  - For more information, please refer to the [documentation](https://scayle.dev/en/core-documentation/storefront-guide/storefront-application/technical-foundation/configuration#shops).
3077
3072
  - **NOTE:** These changes might impact your environment variables used for deployments. Please check your infrastructure and deployment setup and adapt accordingly!
3078
3073
  - _Previous Store Configuration in `nuxt.config.ts`:_
@@ -3092,7 +3087,7 @@
3092
3087
  // ...
3093
3088
  },
3094
3089
  // ...
3095
- });
3090
+ })
3096
3091
  ```
3097
3092
 
3098
3093
  - _Previous Environment Variables for Store Configuration:_
@@ -3121,7 +3116,7 @@
3121
3116
  // ...
3122
3117
  },
3123
3118
  // ...
3124
- });
3119
+ })
3125
3120
  ```
3126
3121
 
3127
3122
  - _Current Environment Variables for Shops Configuration:_
@@ -3135,14 +3130,13 @@
3135
3130
 
3136
3131
  - **\[๐Ÿ’ฅ BREAKING\]** To better align with the current Nuxt 3 architecture make key handling more explicit, we've simplified how you interact with the key parameter in RPC composables from version 8 onwards.
3137
3132
  Instead of placing the key within the composable's options object, you'll now provide it as the second argument when calling the composable.
3138
-
3139
3133
  - _Previous `key` as options parameter:_
3140
3134
 
3141
3135
  ```ts
3142
3136
  useProduct({
3143
3137
  // ...
3144
- key: "productKey",
3145
- });
3138
+ key: 'productKey',
3139
+ })
3146
3140
  ```
3147
3141
 
3148
3142
  - _Current `key` as dedicated composables argument:_
@@ -3152,13 +3146,12 @@
3152
3146
  {
3153
3147
  // ...
3154
3148
  },
3155
- "productKey"
3156
- );
3149
+ 'productKey',
3150
+ )
3157
3151
  ```
3158
3152
 
3159
3153
  - **\[๐Ÿ’ฅ BREAKING\]** Introducing a new feature flag `storefront.legacy.enableSessionMigration` to control the automatic migration of legacy session data, set to `false` by default. Starting with `@scayle/storefront-nuxt@7.68.0` Storefront uses unique session cookie names for each shop, simplifying implementation and enhancing stability.
3160
3154
  Instead of relying on the Path attribute, each shop receives a distinct cookie name. This change is internal and should not require code modifications.
3161
-
3162
3155
  - _Cookie format before `@scayle/storefront-nuxt@7.68.0`:_
3163
3156
  - `Set-Cookie: $session=s:fa3746f9-88c8-4065-a6c9-0c7bee473dd8.pSoaN6Q7iFHHyWKE7s9gQAqdDzGb9fS8a478P7PHLxw; Path=/de`
3164
3157
  - _Cookie format after `@scayle/storefront-nuxt@7.68.0`:_
@@ -3166,61 +3159,57 @@
3166
3159
  - **NOTE:** Upgrading directly to this version from a version prior to `@scayle/storefront-nuxt@7.68.0` without enabling the `storefront.legacy.enableSessionMigration` feature flag will lead to loss of user sessions. Ensure version `@scayle/storefront-nuxt@7.68.0` or higher has been deployed in production for a period exceeding the configured session TTL before upgrading to this version. This ensures all legacy sessions have been migrated. Consult the updated documentation for details on the cookie format changes and migration procedures.
3167
3160
 
3168
3161
  - **\[๐Ÿ’ฅ BREAKING\]** We've optimized the way Identity Provider (IDP) logins are handled. Instead of using the `handleIDPLoginCallback` RPC method, which has been removed, from the `useIDP` composable, you'll now use the `loginIDP` function, which has been moved to the `useAuthentication` composable. This change consolidates IDP login functionality within `useAuthentication` for a more unified approach.
3169
-
3170
3162
  - _Previous Usage of `handleIDPLoginCallback`:_
3171
3163
 
3172
3164
  ```ts
3173
- const { handleIDPLoginCallback } = await useIDP();
3165
+ const { handleIDPLoginCallback } = await useIDP()
3174
3166
 
3175
3167
  watch(
3176
3168
  () => route.query,
3177
3169
  async (query) => {
3178
3170
  if (query.code && isString(query.code)) {
3179
- await handleIDPLoginCallback(query.code);
3171
+ await handleIDPLoginCallback(query.code)
3180
3172
  }
3181
3173
  },
3182
- { immediate: true }
3183
- );
3174
+ { immediate: true },
3175
+ )
3184
3176
  ```
3185
3177
 
3186
3178
  - _Current Usage of `loginIDP`:_
3187
3179
 
3188
3180
  ```ts
3189
- const { loginIDP } = useAuthentication("login");
3181
+ const { loginIDP } = useAuthentication('login')
3190
3182
 
3191
3183
  onMounted(async () => {
3192
- await loginIDP(props.code);
3193
- });
3184
+ await loginIDP(props.code)
3185
+ })
3194
3186
  ```
3195
3187
 
3196
3188
  - **\[๐Ÿงน NON-BREAKING\]** Addressed various type resolution errors that were present when using the `@scayle/storefront-nuxt` package with different Node.js versions and module systems. These errors manifested as internal resolution errors or ESM dynamic import only warnings. With this fix, the package now more consistently resolves types correctly across Node.js 16 (CJS and ESM), and bundlers, ensuring a smoother developer experience.
3197
3189
  - **\[๐Ÿ’ฅ BREAKING\]** The `useBasket` composable now gracefully handles cases where adding items to the basket results in a smaller quantity being added than originally requested by checking against `AddToBasketFailureKind`.
3198
3190
  - **\[๐Ÿ’ฅ BREAKING\]** The deprecated `autoFetch` option of `useRpc` has been removed in favor of the `immediate` option. This also applies to all data fetching composables provided by `@scayle/storefront-nuxt`.
3199
-
3200
3191
  - _Previous `useRpc` with `autoFetch`:_
3201
3192
 
3202
3193
  ```ts
3203
- useRpc("rpcMethod", key, params, { autoFetch: true });
3194
+ useRpc('rpcMethod', key, params, { autoFetch: true })
3204
3195
 
3205
- useUser({ autoFetch: true });
3196
+ useUser({ autoFetch: true })
3206
3197
  ```
3207
3198
 
3208
3199
  - _Current `useRpc` with `immediate`:_
3209
3200
 
3210
3201
  ```ts
3211
- useRpc("rpcMethod", key, params, { immediate: true });
3202
+ useRpc('rpcMethod', key, params, { immediate: true })
3212
3203
 
3213
- useUser({ immediate: true });
3204
+ useUser({ immediate: true })
3214
3205
  ```
3215
3206
 
3216
3207
  - **\[๐Ÿ’ฅ BREAKING\]** The attribute `isCmsPreview` has been removed from `RpcContext`.
3217
3208
  - **\[๐Ÿ’ฅ BREAKING\]** The attribute `storeCampaignKeyword` has been removed from `RpcContext`.
3218
-
3219
3209
  - The `campaignKey` is now automatically determined by fetching campaign data through the Storefront API client by retrieving a list of all campaigns from the API. It then narrows down the list by filtering for campaigns that are still active, ensuring any returned campaign is currently running. These active campaigns are then sorted by their start date, ensuring chronological order. Finally, it iterates through the sorted campaigns to find the first one that is currently active, returning its key as an identifier. If no active campaign is found or an error occurs, it returns nothing.
3220
3210
  - The `storeCampaignKeyword` is also no longer used to determine the active campaign key. The functionality to run only certain campaigns for specific countries is now supported through the SCAYLE Panel out of the box.
3221
3211
 
3222
3212
  - **\[๐Ÿ’ฅ BREAKING\]** The composable `useStorefrontSearch` is now consistent with `useRpc` return values. The `fetching` boolean is replaced by `status` with states `idle`, `pending`, `error` or `success`.
3223
-
3224
3213
  - _Previous `useStorefrontSearch` returning `fetching`:_
3225
3214
 
3226
3215
  ```ts
@@ -3230,24 +3219,23 @@
3230
3219
  getSearchSuggestions,
3231
3220
  fetching,
3232
3221
  ...searchData
3233
- } = useStorefrontSearch(searchQuery, { key });
3222
+ } = useStorefrontSearch(searchQuery, { key })
3234
3223
 
3235
- fetching.value; // true or false
3224
+ fetching.value // true or false
3236
3225
  ```
3237
3226
 
3238
3227
  - _Current `useStorefrontSearch` returning `status`:_
3239
3228
 
3240
3229
  ```ts
3241
3230
  const { data, resolveSearch, getSearchSuggestions, status, ...searchData } =
3242
- useStorefrontSearch(searchQuery, {}, key);
3231
+ useStorefrontSearch(searchQuery, {}, key)
3243
3232
 
3244
- status.value; // 'idle', 'pending', 'error' or 'success'
3233
+ status.value // 'idle', 'pending', 'error' or 'success'
3245
3234
  ```
3246
3235
 
3247
3236
  - **\[๐Ÿ’ฅ BREAKING\]** We've simplified composable caching and clarified the control you have over shared state behavior. The configuration option `disableDefaultGetCachedDataOverride` has been replaced with `legacy.enableDefaultGetCachedDataOverride`, and its logic has been reversed. Now, when `legacy.enableDefaultGetCachedDataOverride` is not set or set to `false`, the default behavior maintains the shared state functionality of `useRpc`, where multiple calls with the same key use the same cached data. Setting the option to `true` bypasses this shared caching, providing data isolation between calls. To maintain your existing caching behavior, simply change the value of `disableDefaultGetCachedDataOverride` to its opposite in your `nuxt.config.ts` file.
3248
3237
 
3249
3238
  Old config
3250
-
3251
3239
  - _Previous `disableDefaultGetCachedDataOverride` in `nuxt.config.ts`:_
3252
3240
 
3253
3241
  ```ts
@@ -3266,7 +3254,7 @@
3266
3254
  // ...
3267
3255
  },
3268
3256
  // ...
3269
- });
3257
+ })
3270
3258
  ```
3271
3259
 
3272
3260
  - _Current `enableDefaultGetCachedDataOverride`in `nuxt.config.ts`:_
@@ -3291,14 +3279,13 @@
3291
3279
  // ...
3292
3280
  },
3293
3281
  // ...
3294
- });
3282
+ })
3295
3283
  ```
3296
3284
 
3297
3285
  - **\[๐Ÿ’ฅ BREAKING\]** The `useRpc` composable has been updated to provide a more modern and robust data fetching experience, aligning its interface with the current and underlying [Nuxt 3 `useAsyncData`.](https://nuxt.com/docs/api/composables/use-async-data#return-values).
3298
3286
  The separate `fetch` function has been replaced with a single, intuitive `refresh` function that can be used to refresh the data returned by the `handler` function.
3299
3287
  Additionally, the boolean `pending` flag has been superseded by a more informative `status` return value, offering greater insight into the fetching lifecycle with possible states: `idle`, `pending`, `success`, and `error`.
3300
3288
  These changes enhance the developer experience and provide greater clarity and control over data fetching operations within components.
3301
-
3302
3289
  - **NOTE:** This update not only impacts the `useRpc` composable directly, but also extends to other RPC composables relying on it, such as `useProducts` and `useCategories`!
3303
3290
 
3304
3291
  - **\[๐Ÿ’ฅ BREAKING\]** Removed special handling for `BAPIError` and `BaseError` thrown in RPC methods. These custom `Error` classes were previously used in RPC methods to allow customizing the status code and message of errors.
@@ -3306,14 +3293,13 @@
3306
3293
  In this release, the legacy special handling for `BAPIError` and `BaseError` has been removed. Now they will be treated like any other `Error`. If they are thrown uncaught during the execution of an RPC method, a 500 status code will be used in the response. They have also been removed from `@scayle/storefront-nuxt`.
3307
3294
  For most users, this change will have no impact as the core RPC methods have been updated for some time. However, if you have custom RPC methods you should review their implementation.
3308
3295
  In order to have an RPC method use a specific status code, it should return a `Response` object.
3309
-
3310
3296
  - _Previous Usage with `BaseError`:_
3311
3297
 
3312
3298
  ```ts
3313
3299
  function myCustomRpc() {
3314
3300
  // ...
3315
3301
 
3316
- throw new BaseError(404);
3302
+ throw new BaseError(404)
3317
3303
  }
3318
3304
  ```
3319
3305
 
@@ -3323,7 +3309,7 @@
3323
3309
  function myCustomRpc() {
3324
3310
  // ...
3325
3311
 
3326
- return new Response(null, { status: 404 });
3312
+ return new Response(null, { status: 404 })
3327
3313
  }
3328
3314
  ```
3329
3315