@vue-storefront/next 4.3.0 → 4.3.2

package/README.md

@@ -51,7 +51,7 @@ export const { getSdk, createSdkContext } = createSdk(
     contentful: buildModule<ContentfulModuleType>(contentfulModule, {
       apiUrl: middlewareUrl + "/cntf",
     }),
-  }),
+  })
 );
 ```
 

package/dist/client.d.mts

@@ -1,7 +1,8 @@
 import { SDKApi } from '@vue-storefront/sdk';
-import { S as SfContract, c as CreateSdkContextReturn } from './types-FxigqFRO.mjs';
-export { M as Maybe, e as SfState, d as SfStateProps, f as createSfStateProvider } from './types-FxigqFRO.mjs';
+import { S as SfContract, c as CreateSdkContextReturn } from './types-BdDsK6en.mjs';
+export { M as Maybe, e as SfState, d as SfStateProps, f as createSfStateProvider } from './types-BdDsK6en.mjs';
 import 'react';
+import 'next/headers';
 
 /**
  * Creates a new Alokai context which is a combination of SDK and state contexts.
@@ -11,16 +12,33 @@ import 'react';
  * Create a new Alokai context somewhere in your application. It may be the `hooks/sdk.ts` file.
  *
  * ```tsx
+ * 'use client';
+ *
  * import { createAlokaiContext } from "@vue-storefront/next/client";
  * import type { Sdk } from './sdk.server';
+ * import type { SfContract } from 'storefront-middleware/types';
  *
- * export const [AlokaiProvider, useSdk] = createAlokaiContext<Sdk>();
+ * export const {
+ *  AlokaiProvider,
+ *  useSdk,
+ *  useSfCartState,
+ *  useSfCurrenciesState,
+ *  useSfCurrencyState,
+ *  useSfCustomerState,
+ * } = createAlokaiContext<Sdk, SfContract>();
  * ```
+ * This is also a place where you can import hooks for handling the state management.
+ * You can read more about the state management in the documentation https://docs.alokai.com/sdk/getting-started/state-management.
  * Then use the `AlokaiProvider` in the root component of your application.
  * For Pages Router it would be the `pages/_app.tsx` file,
  * and for the App Router it would be the `app/layout.tsx` file.
  * Finally, you can use the `useSdk` in any client component of your application.
- * @returns [AlokaiProvider, useSdk] - The SDK provider and the `useSdk` hook.
+ * @returns AlokaiProvider - The Alokai Context Provider.
+ * @returns useSdk - The SDK provider and the `useSdk` hook.
+ * @returns useSfCartState - Hook that return Cart state with `SfCart` type.
+ * @returns useSfCurrenciesState - Hook that return Currencies state with `SfCurrency` type.
+ * @returns useSfCurrencyState - Hook that return Currency state with `SfCurrency[]` type.
+ * @returns useSfCustomerState - Hook that return Customer state with `SfCustomer` type.
  */
 declare function createAlokaiContext<TSdk extends SDKApi<any>, TSfContract extends SfContract>(): CreateSdkContextReturn<TSdk, TSfContract>;
 

package/dist/client.d.ts

@@ -1,7 +1,8 @@
 import { SDKApi } from '@vue-storefront/sdk';
-import { S as SfContract, c as CreateSdkContextReturn } from './types-FxigqFRO.js';
-export { M as Maybe, e as SfState, d as SfStateProps, f as createSfStateProvider } from './types-FxigqFRO.js';
+import { S as SfContract, c as CreateSdkContextReturn } from './types-BdDsK6en.js';
+export { M as Maybe, e as SfState, d as SfStateProps, f as createSfStateProvider } from './types-BdDsK6en.js';
 import 'react';
+import 'next/headers';
 
 /**
  * Creates a new Alokai context which is a combination of SDK and state contexts.
@@ -11,16 +12,33 @@ import 'react';
  * Create a new Alokai context somewhere in your application. It may be the `hooks/sdk.ts` file.
  *
  * ```tsx
+ * 'use client';
+ *
  * import { createAlokaiContext } from "@vue-storefront/next/client";
  * import type { Sdk } from './sdk.server';
+ * import type { SfContract } from 'storefront-middleware/types';
  *
- * export const [AlokaiProvider, useSdk] = createAlokaiContext<Sdk>();
+ * export const {
+ *  AlokaiProvider,
+ *  useSdk,
+ *  useSfCartState,
+ *  useSfCurrenciesState,
+ *  useSfCurrencyState,
+ *  useSfCustomerState,
+ * } = createAlokaiContext<Sdk, SfContract>();
  * ```
+ * This is also a place where you can import hooks for handling the state management.
+ * You can read more about the state management in the documentation https://docs.alokai.com/sdk/getting-started/state-management.
  * Then use the `AlokaiProvider` in the root component of your application.
  * For Pages Router it would be the `pages/_app.tsx` file,
  * and for the App Router it would be the `app/layout.tsx` file.
  * Finally, you can use the `useSdk` in any client component of your application.
- * @returns [AlokaiProvider, useSdk] - The SDK provider and the `useSdk` hook.
+ * @returns AlokaiProvider - The Alokai Context Provider.
+ * @returns useSdk - The SDK provider and the `useSdk` hook.
+ * @returns useSfCartState - Hook that return Cart state with `SfCart` type.
+ * @returns useSfCurrenciesState - Hook that return Currencies state with `SfCurrency` type.
+ * @returns useSfCurrencyState - Hook that return Currency state with `SfCurrency[]` type.
+ * @returns useSfCustomerState - Hook that return Customer state with `SfCustomer` type.
  */
 declare function createAlokaiContext<TSdk extends SDKApi<any>, TSfContract extends SfContract>(): CreateSdkContextReturn<TSdk, TSfContract>;
 

package/dist/index.d.mts

@@ -1,7 +1,8 @@
-import { C as CreateSdkOptions, a as Config, b as CreateSdkReturn } from './types-FxigqFRO.mjs';
+import { C as CreateSdkOptions, a as Config, b as CreateSdkReturn } from './types-BdDsK6en.mjs';
 import * as _vue_storefront_logger from '@vue-storefront/logger';
 import '@vue-storefront/sdk';
 import 'react';
+import 'next/headers';
 
 /**
  * Creates an SDK for the given configuration definition.

package/dist/index.d.ts

@@ -1,7 +1,8 @@
-import { C as CreateSdkOptions, a as Config, b as CreateSdkReturn } from './types-FxigqFRO.js';
+import { C as CreateSdkOptions, a as Config, b as CreateSdkReturn } from './types-BdDsK6en.js';
 import * as _vue_storefront_logger from '@vue-storefront/logger';
 import '@vue-storefront/sdk';
 import 'react';
+import 'next/headers';
 
 /**
  * Creates an SDK for the given configuration definition.

package/dist/index.js

@@ -47,16 +47,31 @@ module.exports = __toCommonJS(src_exports);
 // src/sdk/helpers/resolveDynamicContext.ts
 var BLACKLISTED_HEADERS = /* @__PURE__ */ new Set(["host"]);
 function isAppRouterHeaders(headers) {
-  return headers && "entries" in headers;
+  return !!headers && "entries" in headers;
+}
+function isFlatNextHeaders(headers) {
+  return !!headers && !("headers" in headers);
+}
+function normalizeRequestHeaders(requestHeaders) {
+  const { headers = {}, cookies } = isFlatNextHeaders(requestHeaders) ? { headers: requestHeaders, cookies: void 0 } : {
+    headers: requestHeaders == null ? void 0 : requestHeaders.headers,
+    cookies: requestHeaders == null ? void 0 : requestHeaders.cookies
+  };
+  const normalizedHeaders = isAppRouterHeaders(headers) ? Object.fromEntries(headers.entries()) : headers;
+  if (cookies) {
+    normalizedHeaders.cookie = cookies.toString();
+  }
+  return normalizedHeaders;
 }
 function resolveDynamicContext(context) {
   return __spreadProps(__spreadValues({}, context), {
     getRequestHeaders() {
       var _a;
-      const headers = ((_a = context.getRequestHeaders) == null ? void 0 : _a.call(context)) || {};
-      const resolvedHeaders = isAppRouterHeaders(headers) ? Object.fromEntries(headers.entries()) : headers;
+      const normalizedHeaders = normalizeRequestHeaders(
+        (_a = context.getRequestHeaders) == null ? void 0 : _a.call(context)
+      );
       return Object.fromEntries(
-        Object.entries(resolvedHeaders).filter(
+        Object.entries(normalizedHeaders).filter(
           ([key]) => !BLACKLISTED_HEADERS.has(key)
         )
       );

package/dist/index.mjs

@@ -6,16 +6,31 @@ import {
 // src/sdk/helpers/resolveDynamicContext.ts
 var BLACKLISTED_HEADERS = /* @__PURE__ */ new Set(["host"]);
 function isAppRouterHeaders(headers) {
-  return headers && "entries" in headers;
+  return !!headers && "entries" in headers;
+}
+function isFlatNextHeaders(headers) {
+  return !!headers && !("headers" in headers);
+}
+function normalizeRequestHeaders(requestHeaders) {
+  const { headers = {}, cookies } = isFlatNextHeaders(requestHeaders) ? { headers: requestHeaders, cookies: void 0 } : {
+    headers: requestHeaders == null ? void 0 : requestHeaders.headers,
+    cookies: requestHeaders == null ? void 0 : requestHeaders.cookies
+  };
+  const normalizedHeaders = isAppRouterHeaders(headers) ? Object.fromEntries(headers.entries()) : headers;
+  if (cookies) {
+    normalizedHeaders.cookie = cookies.toString();
+  }
+  return normalizedHeaders;
 }
 function resolveDynamicContext(context) {
   return __spreadProps(__spreadValues({}, context), {
     getRequestHeaders() {
       var _a;
-      const headers = ((_a = context.getRequestHeaders) == null ? void 0 : _a.call(context)) || {};
-      const resolvedHeaders = isAppRouterHeaders(headers) ? Object.fromEntries(headers.entries()) : headers;
+      const normalizedHeaders = normalizeRequestHeaders(
+        (_a = context.getRequestHeaders) == null ? void 0 : _a.call(context)
+      );
       return Object.fromEntries(
-        Object.entries(resolvedHeaders).filter(
+        Object.entries(normalizedHeaders).filter(
           ([key]) => !BLACKLISTED_HEADERS.has(key)
         )
       );

package/dist/{types-FxigqFRO.d.mts → types-BdDsK6en.d.mts}

@@ -1,5 +1,6 @@
 import { SDKApi, buildModule, middlewareModule } from '@vue-storefront/sdk';
 import React, { PropsWithChildren, ReactNode } from 'react';
+import { cookies } from 'next/headers';
 
 declare const defaultMethodsRequestConfig: {
     readonly unifiedCommerce: {
@@ -124,11 +125,16 @@ interface CreateSdkOptions {
     multistore?: MultistoreConfig;
     middleware: MiddlewareConfig;
 }
+type Cookies = ReturnType<typeof cookies>;
+type NextHeaders = Record<string, string | string[] | undefined> | Headers;
 type GetSdkContext = {
     /**
      * A function that returns the request headers.
      */
-    getRequestHeaders?: () => Record<string, string | string[] | undefined> | Headers;
+    getRequestHeaders?: () => NextHeaders | {
+        headers: NextHeaders;
+        cookies: Cookies;
+    };
 };
 type DynamicContext = {
     getRequestHeaders: () => Record<string, string | string[]>;

package/dist/{types-FxigqFRO.d.ts → types-BdDsK6en.d.ts}

@@ -1,5 +1,6 @@
 import { SDKApi, buildModule, middlewareModule } from '@vue-storefront/sdk';
 import React, { PropsWithChildren, ReactNode } from 'react';
+import { cookies } from 'next/headers';
 
 declare const defaultMethodsRequestConfig: {
     readonly unifiedCommerce: {
@@ -124,11 +125,16 @@ interface CreateSdkOptions {
     multistore?: MultistoreConfig;
     middleware: MiddlewareConfig;
 }
+type Cookies = ReturnType<typeof cookies>;
+type NextHeaders = Record<string, string | string[] | undefined> | Headers;
 type GetSdkContext = {
     /**
      * A function that returns the request headers.
      */
-    getRequestHeaders?: () => Record<string, string | string[] | undefined> | Headers;
+    getRequestHeaders?: () => NextHeaders | {
+        headers: NextHeaders;
+        cookies: Cookies;
+    };
 };
 type DynamicContext = {
     getRequestHeaders: () => Record<string, string | string[]>;

package/package.json

@@ -2,17 +2,17 @@
   "name": "@vue-storefront/next",
   "description": "Alokai dedicated features for Next.js",
   "license": "MIT",
-  "version": "4.3.0",
+  "version": "4.3.2",
   "exports": {
     ".": {
+      "types": "./dist/index.d.ts",
       "import": "./dist/index.mjs",
-      "require": "./dist/index.js",
-      "types": "./dist/index.d.ts"
+      "require": "./dist/index.js"
     },
     "./client": {
+      "types": "./dist/client.d.ts",
       "import": "./dist/client.js",
-      "require": "./dist/client.js",
-      "types": "./dist/client.d.ts"
+      "require": "./dist/client.js"
     }
   },
   "files": [
@@ -22,7 +22,8 @@
     "build": "tsup",
     "lint": "biome ci .",
     "format": "prettier --write .",
-    "test:unit": "vitest run"
+    "test:unit": "vitest run",
+    "version": "cp CHANGELOG.md ../../docs/content/storefront/6.change-log/next.md"
   },
   "dependencies": {
     "zustand": "^4.5.4",
@@ -31,16 +32,16 @@
   "devDependencies": {
     "@types/react": "18.3.2",
     "@types/react-dom": "18.3.0",
-    "@vue-storefront/sdk": "3.3.0",
-    "react-dom": "18.3.0",
+    "@vue-storefront/sdk": "3.4.1",
+    "react-dom": "18.3.1",
     "start-server-and-test": "^2.0.3",
     "tsup": "8.3.0",
-    "vitest": "2.0.3",
+    "vitest": "2.1.5",
     "react": "18.3.1",
-    "next": "14.2.5"
+    "next": "14.2.23"
   },
   "peerDependencies": {
-    "@vue-storefront/sdk": "3.3.0",
+    "@vue-storefront/sdk": "3.4.1",
     "react": "^18.2.0",
     "next": "^13.4.7 || ^14.0.0"
   },