@vue-storefront/next 0.0.0-20250722194236

package/dist/index.mjs

@@ -0,0 +1,157 @@
+import {
+  __spreadProps,
+  __spreadValues
+} from "./chunk-FWCSY2DS.mjs";
+
+// src/logger/index.ts
+import { LoggerFactory, LoggerType } from "@alokai/connect/logger";
+
+// src/logger/injectMetadata.ts
+function injectMetadata(logger, externalData) {
+  return new Proxy(logger, {
+    get(target, prop) {
+      const targetProp = target[prop];
+      if (typeof targetProp === "function") {
+        return (...args) => {
+          const [logData, metadata] = args;
+          targetProp(logData, __spreadValues(__spreadValues({}, metadata), externalData));
+        };
+      }
+      return targetProp;
+    }
+  });
+}
+
+// src/logger/index.ts
+var createLogger = (options) => {
+  const logger = LoggerFactory.create(LoggerType.ConsolaGcp, options);
+  return injectMetadata(logger, {
+    alokai: {
+      context: "storefront"
+    }
+  });
+};
+
+// src/middleware.ts
+function createAlokaiMiddleware(middleware) {
+  return (request) => {
+    const nextUrl = request.nextUrl.clone();
+    request.headers.append("x-pathname", nextUrl.pathname);
+    request.headers.append("x-search", nextUrl.search);
+    return middleware(request);
+  };
+}
+
+// src/sdk/index.tsx
+import { buildModule, initSDK, middlewareModule } from "@alokai/connect/sdk";
+
+// src/sdk/helpers/defaultConfigs.ts
+var defaultMethodsRequestConfig = {
+  unifiedCms: {
+    middlewareModule: {
+      getEntries: { method: "GET" },
+      getPage: { method: "GET" }
+    }
+  },
+  unifiedCommerce: {
+    middlewareModule: {
+      getCategories: { method: "GET" },
+      getCategory: { method: "GET" },
+      getCurrencies: { method: "GET" },
+      getProductDetails: { method: "GET" },
+      getProductReviews: { method: "GET" },
+      getProducts: { method: "GET" },
+      searchProducts: { method: "GET" }
+    }
+  }
+};
+
+// src/sdk/helpers/resolveDynamicContext.ts
+var BLACKLISTED_HEADERS = /* @__PURE__ */ new Set(["host"]);
+function isAppRouterHeaders(headers) {
+  return !!headers && "entries" in headers;
+}
+function isFlatNextHeaders(headers) {
+  return !!headers && !("headers" in headers);
+}
+function normalizeRequestHeaders(requestHeaders) {
+  const { cookies, headers = {} } = isFlatNextHeaders(requestHeaders) ? { cookies: void 0, headers: requestHeaders } : {
+    cookies: requestHeaders == null ? void 0 : requestHeaders.cookies,
+    headers: requestHeaders == null ? void 0 : requestHeaders.headers
+  };
+  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 normalizedHeaders = normalizeRequestHeaders(
+        (_a = context.getRequestHeaders) == null ? void 0 : _a.call(context)
+      );
+      const requestHeaders = Object.fromEntries(
+        Object.entries(normalizedHeaders).filter(
+          ([key]) => !BLACKLISTED_HEADERS.has(key)
+        )
+      );
+      if (context.getLocale) {
+        requestHeaders["x-alokai-locale"] = context.getLocale();
+      }
+      return requestHeaders;
+    }
+  });
+}
+
+// src/sdk/index.tsx
+import { defineGetConfigSwitcherHeader } from "@alokai/connect/sdk";
+function createSdk(options, configDefinition) {
+  function getSdk(dynamicContext = {}) {
+    var _a;
+    const { getRequestHeaders } = resolveDynamicContext(dynamicContext);
+    const resolvedConfig = configDefinition({
+      buildModule,
+      config: {
+        apiUrl: options.middleware.apiUrl,
+        cdnCacheBustingId: (_a = options.middleware.cdnCacheBustingId) != null ? _a : "no-cache-busting-id-set",
+        defaultMethodsRequestConfig,
+        ssrApiUrl: options.middleware.ssrApiUrl
+      },
+      defaults: defaultMethodsRequestConfig,
+      getRequestHeaders,
+      middlewareModule
+    });
+    return initSDK(resolvedConfig);
+  }
+  return {
+    getSdk
+  };
+}
+function defineSdkConfig(config) {
+  if (typeof config === "function") {
+    return config;
+  }
+  return buildModules(config);
+}
+function resolveSdkOptions(input, _options = {}) {
+  return input;
+}
+function defineSdkModule(moduleDefinition) {
+  return moduleDefinition;
+}
+function buildModules(modules) {
+  return (context) => Object.fromEntries(
+    Object.entries(modules).map(([key, module]) => [key, module(context)])
+  );
+}
+export {
+  createAlokaiMiddleware,
+  createLogger,
+  createSdk,
+  defineGetConfigSwitcherHeader,
+  defineSdkConfig,
+  defineSdkModule,
+  resolveSdkOptions
+};

package/dist/types-B9h_AU7R.d.mts

@@ -0,0 +1,209 @@
+import { SDKApi, buildModule, middlewareModule } from '@alokai/connect/sdk';
+import { cookies } from 'next/headers';
+import React, { PropsWithChildren, ReactNode } from 'react';
+
+type Maybe<TType> = null | TType;
+
+type SfContract = {
+    SfCart: unknown;
+    SfCurrency: unknown;
+    SfCustomer: unknown;
+    SfLocale: unknown;
+};
+interface SfStateProps<TSfContract extends SfContract> {
+    currencies: TSfContract["SfCurrency"][];
+    currency: TSfContract["SfCurrency"];
+    locale: TSfContract["SfLocale"];
+    locales: TSfContract["SfLocale"][];
+}
+interface SfState<TSfContract extends SfContract> extends SfStateProps<TSfContract> {
+    cart: null | TSfContract["SfCart"] | undefined;
+    customer: null | TSfContract["SfCustomer"] | undefined;
+    setCart: (cart?: null | TSfContract["SfCart"]) => void;
+    setCurrencies: (currencies: TSfContract["SfCurrency"][]) => void;
+    setCurrency: (currency: TSfContract["SfCurrency"]) => void;
+    setCustomer: (customer?: null | TSfContract["SfCustomer"]) => void;
+    setLocale: (locale: TSfContract["SfLocale"]) => void;
+    setLocales: (locales: TSfContract["SfLocale"][]) => void;
+}
+declare function createSfStateProvider<TSfContract extends SfContract>(): {
+    SfStateProvider: ({ children, initialData, }: {
+        initialData: SfStateProps<TSfContract>;
+    } & PropsWithChildren) => React.JSX.Element;
+    useSfCartState: () => [null | TSfContract["SfCart"] | undefined, (cart?: null | TSfContract["SfCart"]) => void];
+    useSfCurrenciesState: () => [TSfContract["SfCurrency"][], (currencies: TSfContract["SfCurrency"][]) => void];
+    useSfCurrencyState: () => [TSfContract["SfCurrency"], (currency: TSfContract["SfCurrency"]) => void];
+    useSfCustomerState: () => [null | TSfContract["SfCustomer"] | undefined, (customer?: null | TSfContract["SfCustomer"]) => void];
+    useSfLocalesState: () => [TSfContract["SfLocale"][], (locales: TSfContract["SfLocale"][]) => void];
+    useSfLocaleState: () => [TSfContract["SfLocale"], (locale: TSfContract["SfLocale"]) => void];
+};
+
+declare const defaultMethodsRequestConfig: {
+    readonly unifiedCms: {
+        readonly middlewareModule: {
+            readonly getEntries: {
+                readonly method: "GET";
+            };
+            readonly getPage: {
+                readonly method: "GET";
+            };
+        };
+    };
+    readonly unifiedCommerce: {
+        readonly middlewareModule: {
+            readonly getCategories: {
+                readonly method: "GET";
+            };
+            readonly getCategory: {
+                readonly method: "GET";
+            };
+            readonly getCurrencies: {
+                readonly method: "GET";
+            };
+            readonly getProductDetails: {
+                readonly method: "GET";
+            };
+            readonly getProductReviews: {
+                readonly method: "GET";
+            };
+            readonly getProducts: {
+                readonly method: "GET";
+            };
+            readonly searchProducts: {
+                readonly method: "GET";
+            };
+        };
+    };
+};
+
+interface MiddlewareConfig {
+    /**
+     * The URL of the middleware.
+     * @example "http://localhost:4000"
+     */
+    apiUrl: string;
+    /**
+     * This is identifier used to invalidate the cache on CDN when the assets change.
+     * Usually it's a commit hash.
+     * @example "2c106d9619c71c3082c9b59b1d72817363c8ecb9"
+     * @default "no-cache-busting-id-set"
+     */
+    cdnCacheBustingId?: string;
+    /**
+     * The URL of the middleware for server-side rendering.
+     * @example "http://localhost:4000"
+     */
+    ssrApiUrl: string;
+}
+interface MultistoreConfig {
+    /**
+     * Whether the multistore is enabled or not.
+     * @example false
+     * @default false
+     */
+    enabled: boolean;
+}
+interface CreateSdkOptions {
+    middleware: MiddlewareConfig;
+    multistore?: MultistoreConfig;
+}
+type Cookies = ReturnType<typeof cookies>;
+type NextHeaders = Headers | Record<string, string | string[] | undefined>;
+type GetSdkContext = {
+    /**
+     * A function that returns the current locale string;
+     */
+    getLocale?: () => string;
+    /**
+     * A function that returns the request headers.
+     */
+    getRequestHeaders?: () => {
+        cookies: Cookies;
+        headers: NextHeaders;
+    } | NextHeaders;
+};
+type DynamicContext = {
+    getRequestHeaders: () => Record<string, string | string[]>;
+};
+type StaticContext = {
+    buildModule: typeof buildModule;
+    config: {
+        apiUrl: string;
+        cdnCacheBustingId: string;
+        defaultMethodsRequestConfig: typeof defaultMethodsRequestConfig;
+        ssrApiUrl: string;
+    };
+    /**
+     * @deprecated Use `config.defaultMethodsRequestConfig` instead.
+     */
+    defaults: typeof defaultMethodsRequestConfig;
+    middlewareModule: typeof middlewareModule;
+};
+type InjectedContext = DynamicContext & StaticContext;
+type Config<TConfig> = (context: InjectedContext) => TConfig;
+type AlokaiProviderProps<TSdk, TSfContract extends SfContract> = {
+    children: ReactNode;
+    initialData: SfStateProps<TSfContract>;
+    sdk: TSdk;
+};
+interface CreateSdkReturn<TConfig extends Record<string, any>> {
+    /**
+     * Creates a new SDK instance. This function is dedicated for server-side usage,
+     * where a new SDK instance should be created for each request.
+     * For the client side usage, use the `createSdkContext` function instead.
+     *
+     * @param dynamicContext - The dynamic, request-specific, context
+     *
+     * @returns The SDK instance.
+     *
+     * @example
+     * For the Pages Router, you can use the `getSdk` function in the `getServerSideProps` function:
+     * ```tsx
+     * import type { GetServerSideProps } from "next";
+     * import { getSdk } from "../../sdk.config";
+     *
+     * export const getServerSideProps: GetServerSideProps = async ({ req, locale }) => {
+     *  const sdk = await getSdk({
+     *    getRequestHeaders: () => req.headers,
+     *    getLocale: () => locale,
+     *  });
+     *  const { products } = await sdk.unified.getProducts();
+     *
+     *  return {
+     *    props: {...}
+     *  }
+     * };
+     * ```
+     *
+     * @example
+     * For the App Router, you can use the `getSdk` function in your React Server Component:
+     * ```tsx
+     * import { headers } from "next/headers";
+     * import { getSdk } from "../../sdk.config";
+     *
+     * export default async function SsrPage() {
+     *  const locale = await getLocale();
+     *  const sdk = await getSdk({
+     *    getRequestHeaders: () => headers(),
+     *    getLocale: () => locale,
+     *  });
+     *  const { products } = await sdk.unified.getProducts();
+     *
+     *  return <div>...</div>
+     * };
+     * ```
+     */
+    getSdk: (dynamicContext?: GetSdkContext) => SDKApi<TConfig>;
+}
+type CreateSdkContextReturn<TSdk extends SDKApi<any>, TSfContract extends SfContract> = Readonly<{
+    AlokaiProvider: ({ children, }: AlokaiProviderProps<TSdk, TSfContract>) => JSX.Element;
+    useSdk: () => TSdk;
+    useSfCartState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCartState"];
+    useSfCurrenciesState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCurrenciesState"];
+    useSfCurrencyState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCurrencyState"];
+    useSfCustomerState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCustomerState"];
+    useSfLocalesState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfLocalesState"];
+    useSfLocaleState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfLocaleState"];
+}>;
+
+export { type CreateSdkContextReturn as C, type InjectedContext as I, type Maybe as M, type SfContract as S, type SfStateProps as a, type SfState as b, createSfStateProvider as c, type CreateSdkOptions as d, type Config as e, type CreateSdkReturn as f };

package/dist/types-B9h_AU7R.d.ts

@@ -0,0 +1,209 @@
+import { SDKApi, buildModule, middlewareModule } from '@alokai/connect/sdk';
+import { cookies } from 'next/headers';
+import React, { PropsWithChildren, ReactNode } from 'react';
+
+type Maybe<TType> = null | TType;
+
+type SfContract = {
+    SfCart: unknown;
+    SfCurrency: unknown;
+    SfCustomer: unknown;
+    SfLocale: unknown;
+};
+interface SfStateProps<TSfContract extends SfContract> {
+    currencies: TSfContract["SfCurrency"][];
+    currency: TSfContract["SfCurrency"];
+    locale: TSfContract["SfLocale"];
+    locales: TSfContract["SfLocale"][];
+}
+interface SfState<TSfContract extends SfContract> extends SfStateProps<TSfContract> {
+    cart: null | TSfContract["SfCart"] | undefined;
+    customer: null | TSfContract["SfCustomer"] | undefined;
+    setCart: (cart?: null | TSfContract["SfCart"]) => void;
+    setCurrencies: (currencies: TSfContract["SfCurrency"][]) => void;
+    setCurrency: (currency: TSfContract["SfCurrency"]) => void;
+    setCustomer: (customer?: null | TSfContract["SfCustomer"]) => void;
+    setLocale: (locale: TSfContract["SfLocale"]) => void;
+    setLocales: (locales: TSfContract["SfLocale"][]) => void;
+}
+declare function createSfStateProvider<TSfContract extends SfContract>(): {
+    SfStateProvider: ({ children, initialData, }: {
+        initialData: SfStateProps<TSfContract>;
+    } & PropsWithChildren) => React.JSX.Element;
+    useSfCartState: () => [null | TSfContract["SfCart"] | undefined, (cart?: null | TSfContract["SfCart"]) => void];
+    useSfCurrenciesState: () => [TSfContract["SfCurrency"][], (currencies: TSfContract["SfCurrency"][]) => void];
+    useSfCurrencyState: () => [TSfContract["SfCurrency"], (currency: TSfContract["SfCurrency"]) => void];
+    useSfCustomerState: () => [null | TSfContract["SfCustomer"] | undefined, (customer?: null | TSfContract["SfCustomer"]) => void];
+    useSfLocalesState: () => [TSfContract["SfLocale"][], (locales: TSfContract["SfLocale"][]) => void];
+    useSfLocaleState: () => [TSfContract["SfLocale"], (locale: TSfContract["SfLocale"]) => void];
+};
+
+declare const defaultMethodsRequestConfig: {
+    readonly unifiedCms: {
+        readonly middlewareModule: {
+            readonly getEntries: {
+                readonly method: "GET";
+            };
+            readonly getPage: {
+                readonly method: "GET";
+            };
+        };
+    };
+    readonly unifiedCommerce: {
+        readonly middlewareModule: {
+            readonly getCategories: {
+                readonly method: "GET";
+            };
+            readonly getCategory: {
+                readonly method: "GET";
+            };
+            readonly getCurrencies: {
+                readonly method: "GET";
+            };
+            readonly getProductDetails: {
+                readonly method: "GET";
+            };
+            readonly getProductReviews: {
+                readonly method: "GET";
+            };
+            readonly getProducts: {
+                readonly method: "GET";
+            };
+            readonly searchProducts: {
+                readonly method: "GET";
+            };
+        };
+    };
+};
+
+interface MiddlewareConfig {
+    /**
+     * The URL of the middleware.
+     * @example "http://localhost:4000"
+     */
+    apiUrl: string;
+    /**
+     * This is identifier used to invalidate the cache on CDN when the assets change.
+     * Usually it's a commit hash.
+     * @example "2c106d9619c71c3082c9b59b1d72817363c8ecb9"
+     * @default "no-cache-busting-id-set"
+     */
+    cdnCacheBustingId?: string;
+    /**
+     * The URL of the middleware for server-side rendering.
+     * @example "http://localhost:4000"
+     */
+    ssrApiUrl: string;
+}
+interface MultistoreConfig {
+    /**
+     * Whether the multistore is enabled or not.
+     * @example false
+     * @default false
+     */
+    enabled: boolean;
+}
+interface CreateSdkOptions {
+    middleware: MiddlewareConfig;
+    multistore?: MultistoreConfig;
+}
+type Cookies = ReturnType<typeof cookies>;
+type NextHeaders = Headers | Record<string, string | string[] | undefined>;
+type GetSdkContext = {
+    /**
+     * A function that returns the current locale string;
+     */
+    getLocale?: () => string;
+    /**
+     * A function that returns the request headers.
+     */
+    getRequestHeaders?: () => {
+        cookies: Cookies;
+        headers: NextHeaders;
+    } | NextHeaders;
+};
+type DynamicContext = {
+    getRequestHeaders: () => Record<string, string | string[]>;
+};
+type StaticContext = {
+    buildModule: typeof buildModule;
+    config: {
+        apiUrl: string;
+        cdnCacheBustingId: string;
+        defaultMethodsRequestConfig: typeof defaultMethodsRequestConfig;
+        ssrApiUrl: string;
+    };
+    /**
+     * @deprecated Use `config.defaultMethodsRequestConfig` instead.
+     */
+    defaults: typeof defaultMethodsRequestConfig;
+    middlewareModule: typeof middlewareModule;
+};
+type InjectedContext = DynamicContext & StaticContext;
+type Config<TConfig> = (context: InjectedContext) => TConfig;
+type AlokaiProviderProps<TSdk, TSfContract extends SfContract> = {
+    children: ReactNode;
+    initialData: SfStateProps<TSfContract>;
+    sdk: TSdk;
+};
+interface CreateSdkReturn<TConfig extends Record<string, any>> {
+    /**
+     * Creates a new SDK instance. This function is dedicated for server-side usage,
+     * where a new SDK instance should be created for each request.
+     * For the client side usage, use the `createSdkContext` function instead.
+     *
+     * @param dynamicContext - The dynamic, request-specific, context
+     *
+     * @returns The SDK instance.
+     *
+     * @example
+     * For the Pages Router, you can use the `getSdk` function in the `getServerSideProps` function:
+     * ```tsx
+     * import type { GetServerSideProps } from "next";
+     * import { getSdk } from "../../sdk.config";
+     *
+     * export const getServerSideProps: GetServerSideProps = async ({ req, locale }) => {
+     *  const sdk = await getSdk({
+     *    getRequestHeaders: () => req.headers,
+     *    getLocale: () => locale,
+     *  });
+     *  const { products } = await sdk.unified.getProducts();
+     *
+     *  return {
+     *    props: {...}
+     *  }
+     * };
+     * ```
+     *
+     * @example
+     * For the App Router, you can use the `getSdk` function in your React Server Component:
+     * ```tsx
+     * import { headers } from "next/headers";
+     * import { getSdk } from "../../sdk.config";
+     *
+     * export default async function SsrPage() {
+     *  const locale = await getLocale();
+     *  const sdk = await getSdk({
+     *    getRequestHeaders: () => headers(),
+     *    getLocale: () => locale,
+     *  });
+     *  const { products } = await sdk.unified.getProducts();
+     *
+     *  return <div>...</div>
+     * };
+     * ```
+     */
+    getSdk: (dynamicContext?: GetSdkContext) => SDKApi<TConfig>;
+}
+type CreateSdkContextReturn<TSdk extends SDKApi<any>, TSfContract extends SfContract> = Readonly<{
+    AlokaiProvider: ({ children, }: AlokaiProviderProps<TSdk, TSfContract>) => JSX.Element;
+    useSdk: () => TSdk;
+    useSfCartState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCartState"];
+    useSfCurrenciesState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCurrenciesState"];
+    useSfCurrencyState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCurrencyState"];
+    useSfCustomerState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfCustomerState"];
+    useSfLocalesState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfLocalesState"];
+    useSfLocaleState: ReturnType<typeof createSfStateProvider<TSfContract>>["useSfLocaleState"];
+}>;
+
+export { type CreateSdkContextReturn as C, type InjectedContext as I, type Maybe as M, type SfContract as S, type SfStateProps as a, type SfState as b, createSfStateProvider as c, type CreateSdkOptions as d, type Config as e, type CreateSdkReturn as f };

package/package.json

@@ -0,0 +1,58 @@
+{
+  "name": "@vue-storefront/next",
+  "description": "Alokai dedicated features for Next.js",
+  "license": "MIT",
+  "version": "0.0.0-20250722194236",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    },
+    "./client": {
+      "types": "./dist/client.d.ts",
+      "import": "./dist/client.js",
+      "require": "./dist/client.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "lint": "eslint",
+    "lint:fix": "eslint --fix",
+    "format": "prettier --write .",
+    "test:unit": "vitest run",
+    "version": "cp CHANGELOG.md ../../docs/enterprise/content/storefront/6.change-log/next.md"
+  },
+  "dependencies": {
+    "@alokai/instrumentation-next-component": "0.0.0-20250722194236",
+    "zustand": "^4.5.4"
+  },
+  "devDependencies": {
+    "@alokai/connect": "0.0.0-20250722194236",
+    "@types/react": "18.3.2",
+    "@types/react-dom": "18.3.0",
+    "eslint": "9.23.0",
+    "next": "14.2.25",
+    "prettier": "3.3.2",
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
+    "start-server-and-test": "^2.0.11",
+    "tsup": "8.3.0",
+    "vitest": "2.1.9"
+  },
+  "peerDependencies": {
+    "@alokai/connect": "0.0.0-20250722194236",
+    "next": "^13.4.7 || ^14.0.0",
+    "react": "^18.2.0"
+  },
+  "engines": {
+    "npm": ">=8.0.0",
+    "node": ">=18.0.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}