@salesforce/storefront-next-dev 1.1.0-alpha.0 → 1.1.0-alpha.2

package/dist/index.js

@@ -5,7 +5,7 @@ import { createRequire } from "module";
 import path$1, { dirname, join, relative, resolve as resolve$1 } from "path";
 import { fileURLToPath } from "url";
 import { parse } from "@babel/parser";
-import { booleanLiteral, identifier, importDeclaration, importSpecifier, isArrayPattern, isClassDeclaration, isExportSpecifier, isFunctionDeclaration, isIdentifier, isJSXAttribute, isJSXElement, isJSXFragment, isJSXIdentifier, isMemberExpression, isObjectPattern, isObjectProperty, isRestElement, isStringLiteral, isVariableDeclaration, jsxAttribute, jsxClosingElement, jsxClosingFragment, jsxElement, jsxExpressionContainer, jsxFragment, jsxIdentifier, jsxOpeningElement, jsxOpeningFragment, jsxText, stringLiteral } from "@babel/types";
+import { isArrayPattern, isClassDeclaration, isExportSpecifier, isFunctionDeclaration, isIdentifier, isJSXAttribute, isJSXElement, isJSXFragment, isJSXIdentifier, isMemberExpression, isObjectPattern, isObjectProperty, isRestElement, isVariableDeclaration, jsxClosingElement, jsxClosingFragment, jsxElement, jsxFragment, jsxIdentifier, jsxOpeningElement, jsxOpeningFragment, jsxText } from "@babel/types";
 import { generate } from "@babel/generator";
 import traverseModule from "@babel/traverse";
 import { existsSync, readFileSync, writeFileSync } from "fs";
@@ -15,6 +15,7 @@ import fs$1, { existsSync as existsSync$1, readFileSync as readFileSync$1 } from
 import { deadCodeElimination, findReferencedIdentifiers } from "babel-dead-code-elimination";
 import httpProxy from "http-proxy";
 import { brotliDecompressSync, gunzipSync, inflateSync } from "zlib";
+import { extractPrefixParamValues, stripPathPrefix } from "@salesforce/storefront-next-runtime/site-context";
 
 //#region src/utils/logger.ts
 const LEVEL_PRIORITY = {
@@ -368,7 +369,7 @@ const patchReactRouterPlugin = () => {
 
 //#endregion
 //#region src/extensibility/target-utils.ts
-const traverse$2 = traverseModule.default || traverseModule;
+const traverse$1 = traverseModule.default || traverseModule;
 const TARGET_COMPONENT_TAG = "UITarget";
 const TARGET_PROVIDERS_TAG = "UITargetProviders";
 const TARGET_ID_ATTRIBUTE = "targetId";
@@ -443,7 +444,7 @@ function runReplacementPass(ast, tagName, targetRegistry = null, contextProvider
 			if (replacedId) targetIdsReplaced.add(replacedId);
 		} else if (contextProviders) findAndReplaceProviders(pathToReplace, contextProviders);
 	};
-	traverse$2(ast, {
+	traverse$1(ast, {
 		VariableDeclaration(nodePath) {
 			const declarationPaths = nodePath.get("declarations");
 			const declarationsArray = Array.isArray(declarationPaths) ? declarationPaths : [declarationPaths];
@@ -496,7 +497,7 @@ function transformTargets(code, targetRegistry, contextProviders) {
 	});
 	if (TARGET_COMPONENT_JSX_RE.test(code)) {
 		const replacementImportStatements = buildReplacementImportStatements(runReplacementPass(ast, TARGET_COMPONENT_TAG, targetRegistry, null), targetRegistry);
-		traverse$2(ast, { ImportDeclaration(nodePath) {
+		traverse$1(ast, { ImportDeclaration(nodePath) {
 			if (nodePath.node.source.value === "@/targets/ui-target") nodePath.replaceWith(jsxText(replacementImportStatements));
 		} });
 	}
@@ -504,7 +505,7 @@ function transformTargets(code, targetRegistry, contextProviders) {
 		const importStatements = /* @__PURE__ */ new Set();
 		for (const contextProvider of contextProviders) importStatements.add(`import ${contextProvider.componentName} from '@/${contextProvider.path.replace(".tsx", "")}';`);
 		const replacementImportStatements = Array.from(importStatements).join("\n");
-		traverse$2(ast, { ImportDeclaration(nodePath) {
+		traverse$1(ast, { ImportDeclaration(nodePath) {
 			if (nodePath.node.source.value === "@/targets/ui-target-providers") nodePath.replaceWith(jsxText(replacementImportStatements));
 		} });
 		runReplacementPass(ast, TARGET_PROVIDERS_TAG, null, contextProviders);
@@ -607,7 +608,6 @@ function buildTargetRegistry(rootDir, options = {}) {
 	};
 }
 const TARGET_ID_PATTERN = /<UITarget[\s][^>]*targetId=["']([^"']+)["']/g;
-const EXCLUDED_DIRS = new Set(["ui-target-dev-mode", "ui-target-smoke-test"]);
 /**
 * Recursively collect all UITarget IDs declared in template source files.
 * Excludes extension directories so only "real" UITarget placements are counted.
@@ -619,7 +619,7 @@ function collectUITargetIds(sourceDir) {
 		for (const entry of entries) {
 			const fullPath = path$1.join(dir, entry.name);
 			if (entry.isDirectory()) {
-				if (entry.name === "extensions" || EXCLUDED_DIRS.has(entry.name)) continue;
+				if (entry.name === "extensions") continue;
 				walk(fullPath);
 			} else if (entry.isFile() && /\.(tsx?|jsx?)$/.test(entry.name) && !/\.test\.(tsx?|jsx?)$/.test(entry.name)) {
 				const content = fs.readFileSync(fullPath, "utf-8");
@@ -670,7 +670,6 @@ function transformTargetPlaceholderPlugin() {
 			}
 		},
 		transform(code, id) {
-			if (process.env.VITE_UI_TARGET_DEV_MODE === "true") return null;
 			try {
 				const transformedCode = transformTargets(code, componentRegistry, contextProviders);
 				if (transformedCode) return {
@@ -1438,7 +1437,7 @@ export * from ${importPath};
 export default _composed.default;
 export const handleDataRequest = _composed.handleDataRequest;
 export const handleError = _composed.handleError;
-export const unstable_instrumentations = _composed.unstable_instrumentations;
+export const instrumentations = _composed.instrumentations;
 export const streamTimeout = _composed.streamTimeout;
 `.trim();
 }
@@ -1583,7 +1582,7 @@ const workspacePlugin = () => {
 
 //#endregion
 //#region src/plugins/componentLoaders.ts
-const traverse$1 = traverseModule.default || traverseModule;
+const traverse = traverseModule.default || traverseModule;
 const generate$1 = generate.default || generate;
 /**
 * Names of exports to strip per environment.
@@ -1613,7 +1612,7 @@ function hasExportCandidate(code, names) {
 */
 function hasComponentDecorator(ast) {
 	let found = false;
-	traverse$1(ast, { ClassDeclaration(path$2) {
+	traverse(ast, { ClassDeclaration(path$2) {
 		const decorators = path$2.node.decorators;
 		if (!decorators) return;
 		for (const decorator of decorators) if (decorator.expression.type === "CallExpression" && isIdentifier(decorator.expression.callee) && decorator.expression.callee.name === "Component") {
@@ -1660,7 +1659,7 @@ function stripExports(code, exportsToStrip, preParsedAst) {
 	let changed = false;
 	const previouslyReferencedIdentifiers = findReferencedIdentifiers(ast);
 	const removedExportLocalNames = /* @__PURE__ */ new Set();
-	traverse$1(ast, { ExportNamedDeclaration(path$2) {
+	traverse(ast, { ExportNamedDeclaration(path$2) {
 		const { declaration, specifiers } = path$2.node;
 		if (declaration && isVariableDeclaration(declaration)) {
 			const remaining = declaration.declarations.filter((decl) => {
@@ -1718,7 +1717,7 @@ function stripExports(code, exportsToStrip, preParsedAst) {
 			}
 		}
 	} });
-	if (changed) traverse$1(ast, { ExpressionStatement(path$2) {
+	if (changed) traverse(ast, { ExpressionStatement(path$2) {
 		if (!path$2.parentPath?.isProgram()) return;
 		if (path$2.node.expression.type === "AssignmentExpression") {
 			const left = path$2.node.expression.left;
@@ -2037,93 +2036,19 @@ function storefrontNextTargets(config = {}) {
 
 //#endregion
 //#region src/plugins/uiTargetDevMode.ts
-const traverse = traverseModule.default || traverseModule;
-const UI_TARGET_JSX_RE = /<UITarget[\s/>]/;
 /**
-* Vite plugin that adds visual markers to UITarget components in development.
+* @deprecated This plugin has been removed. It was an internal-only debugging aid
+* that could cause build failures when extensions were trimmed. The export is kept
+* as a no-op for backward compatibility and will be removed in v2.
 *
-* PRODUCTION: This plugin is completely inactive - zero overhead.
-* DEVELOPMENT: Transforms UITarget JSX to add visual debugging markers.
+* **Migration:** Remove any `uiTargetDevMode()` plugin from your `vite.config.ts`,
+* delete `vite-plugins/ui-target-dev-mode.ts` if it exists, and remove the plugin
+* from the Vite plugins array.
 *
-* @example
-* // Source code:
-* <UITarget targetId="pdp.loyalty.badge">
-*   <Widget />
-* </UITarget>
-*
-* // Transformed in DEV mode:
-* <UITargetDevMarker
-*   targetId="pdp.loyalty.badge"
-*   __file__="/src/components/product.tsx"
-*   __hasChildren__={true}
-* >
-*   <Widget />
-* </UITargetDevMarker>
-*/
-function uiTargetDevModePlugin(config = {}) {
-	if (process.env.NODE_ENV === "production") return { name: "storefront-next:ui-target-dev-mode-noop" };
-	if (!(config.enabled ?? process.env.VITE_UI_TARGET_DEV_MODE === "true")) return { name: "storefront-next:ui-target-dev-mode-disabled" };
-	logger.info("🎯 UITarget Dev Mode enabled");
-	if (config.filterCategory) logger.info(`   Filtering to category: ${config.filterCategory} (build-time)`);
-	return {
-		name: "storefront-next:ui-target-dev-mode",
-		enforce: "pre",
-		transform(code, id) {
-			if (!id.match(/\.(tsx|jsx)$/)) return null;
-			if (id.includes("node_modules")) return null;
-			if (id.includes("/targets/ui-target.tsx")) return null;
-			if (!UI_TARGET_JSX_RE.test(code) || !code.includes("from '@/targets/ui-target'")) return null;
-			try {
-				const ast = parse(code, {
-					sourceType: "module",
-					plugins: [
-						"typescript",
-						"jsx",
-						"decorators-legacy"
-					]
-				});
-				let hasTransforms = false;
-				const targetIds = [];
-				traverse(ast, { JSXElement(path$2) {
-					const openingElement = path$2.node.openingElement;
-					if (!isJSXIdentifier(openingElement.name) || openingElement.name.name !== "UITarget") return;
-					const targetIdAttr = openingElement.attributes.find((attr) => isJSXAttribute(attr) && isJSXIdentifier(attr.name) && attr.name.name === "targetId");
-					if (!targetIdAttr) {
-						logger.warn(`UITarget without targetId in ${id}`);
-						return;
-					}
-					const targetId = isStringLiteral(targetIdAttr.value) ? targetIdAttr.value.value : null;
-					if (!targetId) {
-						logger.warn(`UITarget with non-string targetId in ${id}`);
-						return;
-					}
-					if (config.filterCategory && !targetId.startsWith(`${config.filterCategory}.`)) return;
-					const hasChildren = path$2.node.children.length > 0;
-					openingElement.name = jsxIdentifier("UITargetDevMarker");
-					if (path$2.node.closingElement) path$2.node.closingElement.name = jsxIdentifier("UITargetDevMarker");
-					const hint = config.hintMap?.[targetId];
-					openingElement.attributes.push(jsxAttribute(jsxIdentifier("__file__"), stringLiteral(id)), jsxAttribute(jsxIdentifier("__hasChildren__"), jsxExpressionContainer(booleanLiteral(hasChildren))), ...hint ? [jsxAttribute(jsxIdentifier("__hint__"), stringLiteral(hint))] : []);
-					hasTransforms = true;
-					targetIds.push(targetId);
-				} });
-				if (!hasTransforms) return null;
-				const devMarkerImport = importDeclaration([importSpecifier(identifier("UITargetDevMarker"), identifier("UITargetDevMarker"))], stringLiteral("@/lib/ui-target-dev-mode/marker"));
-				ast.program.body.unshift(devMarkerImport);
-				const output = generate(ast, {
-					retainLines: true,
-					compact: false
-				}, code);
-				logger.debug(`Transformed ${targetIds.length} targets in ${id.split("/").pop()}`);
-				return {
-					code: output.code,
-					map: output.map
-				};
-			} catch (error) {
-				logger.error(`Failed to transform UITarget in ${id}:`, error);
-				return null;
-			}
-		}
-	};
+* @returns A no-op Vite plugin
+*/
+function uiTargetDevModePlugin(_config) {
+	return { name: "storefront-next:ui-target-dev-mode-deprecated-noop" };
 }
 
 //#endregion
@@ -2228,6 +2153,82 @@ function escapeRegExp(str) {
 	return str.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
 }
 /**
+* Resolve a captured prefix segment to its canonical-cased alias, case-insensitively.
+* Returns the matching entry from `aliases` (preserving the catalog's casing) so the value
+* forwarded to SFRA is always the expected canonical form, or `undefined` when the segment
+* isn't a known site/locale identifier.
+*/
+function matchAlias(segment, aliases) {
+	if (segment === void 0) return void 0;
+	const lower = segment.toLowerCase();
+	return aliases.find((alias) => alias.toLowerCase() === lower);
+}
+/**
+* Rewrite an incoming proxy pathname to the SFRA `/s/{siteId}/{locale}/…` shape.
+*
+* This is the OOTB path transform. It is `url.prefix`-aware: when `urlPrefix` is set
+* it strips the configured prefix to recover the bare functional path AND reuses the
+* site/locale the path already carried — so a prefixed request like `/uk/cart` becomes
+* `/s/{siteId}/uk/cart` rather than the double-stacked `/s/{siteId}/{locale}/uk/cart`.
+*
+* It handles every standard prefix shape uniformly:
+* - no prefix (`''`/`/`):     `/cart`            → `/s/{site}/{locale}/cart`
+* - `/:localeId`:             `/uk/cart`         → `/s/{site}/uk/cart`
+* - `/:siteId/:localeId`:     `/global/uk/cart`  → `/s/global/uk/cart`
+*
+* Disambiguation: a captured prefix segment is only treated as a site/locale when it is
+* a known identifier (`siteAliases`/`localeAliases`). This stops a bare path like `/cart`
+* under a `/:localeId` prefix — which is structurally indistinguishable from a locale
+* home `/uk` — from being mis-stripped (here `cart` isn't a known locale, so the whole
+* path is treated as the bare functional path and decorated with the `defaultSiteId`/
+* `defaultLocale` fallbacks). When a prefix segment IS a known site/locale, that value is
+* passed straight through as the SFRA path segment; SFRA resolves both the BM site-path
+* alias (`uk`) and the canonical id (`en-GB`).
+*
+* Paths already in SFCC shape (`/s/…`, `/on/demandware.…`) are returned unchanged — the
+* caller is expected to skip them, but this stays defensive.
+*
+* Pure function (query string handled by the caller) so it's unit-testable in isolation.
+*
+* @param pathname - Incoming pathname on the proxy (no query string).
+* @param opts.defaultSiteId - Site to use when the path doesn't carry one.
+* @param opts.defaultLocale - Locale to use when the path doesn't carry one.
+* @param opts.urlPrefix - The storefront's `url.prefix` (e.g. `'/:siteId/:localeId'`).
+* @param opts.localeAliases - Known locale ids + aliases.
+* @param opts.siteAliases - Known site ids + aliases.
+*/
+function rewriteToSfraPath(pathname, opts) {
+	const { defaultSiteId, defaultLocale, urlPrefix, localeAliases = [], siteAliases = [] } = opts;
+	if (pathname.startsWith("/s/") || pathname.startsWith("/on/demandware.")) return pathname;
+	let site = defaultSiteId;
+	let locale = defaultLocale;
+	let barePath = pathname;
+	let localeFromPath = false;
+	if (urlPrefix && urlPrefix !== "/") {
+		const captured = extractPrefixParamValues({
+			pathname,
+			prefix: urlPrefix
+		});
+		const matchedSite = "siteId" in captured ? matchAlias(captured.siteId, siteAliases) : void 0;
+		const matchedLocale = "localeId" in captured ? matchAlias(captured.localeId, localeAliases) : void 0;
+		const siteOk = !("siteId" in captured) || matchedSite !== void 0;
+		const localeOk = !("localeId" in captured) || matchedLocale !== void 0;
+		if (Object.keys(captured).length > 0 && siteOk && localeOk) {
+			if (matchedSite) site = matchedSite;
+			if (matchedLocale) {
+				locale = matchedLocale;
+				localeFromPath = true;
+			}
+			barePath = stripPathPrefix({
+				pathname,
+				prefix: urlPrefix
+			}) || "/";
+		}
+	}
+	if (barePath === "/") return localeFromPath ? `/s/${site}/${locale}/` : `/s/${site}`;
+	return `/s/${site}/${locale}${barePath}`;
+}
+/**
 * Rewrite an SFCC Location header so the user stays on the proxy origin AND so
 * any query params from the original request survive an SFCC redirect.
 *
@@ -2303,7 +2304,8 @@ function hybridProxyPlugin(options) {
 	logger.debug(`Hybrid proxy routing rules: ${options.routingRules.slice(0, 100)}...`);
 	const locale = options.locale || "default";
 	const defaultSiteId = options.defaultSiteId;
-	logger.debug(`Hybrid proxy path transformation: / → /s/${defaultSiteId}, /path → /s/${defaultSiteId}/${locale}/path`);
+	const { urlPrefix, localeAliases, siteAliases, rewritePath } = options;
+	logger.debug(urlPrefix ? `Hybrid proxy path transformation: url.prefix=${urlPrefix} → /s/${defaultSiteId}/{locale}/{bare path}` : `Hybrid proxy path transformation: / → /s/${defaultSiteId}, /path → /s/${defaultSiteId}/${locale}/path`);
 	const targetOriginPattern = new RegExp(escapeRegExp(options.targetOrigin), "g");
 	const proxy = httpProxy.createProxyServer({
 		changeOrigin: true,
@@ -2315,13 +2317,13 @@ function hybridProxyPlugin(options) {
 		const pathname = url.pathname;
 		if (!pathname.startsWith("/s/") && !pathname.startsWith("/on/demandware.")) {
 			const originalPath = proxyReq.path;
-			/**
-			* "/" maps to the SFRA/SiteGenesis site root — no locale in the path
-			* This would simply proxy to SFCC hostname (eg.: https://zzrf-001.dx.commercecloud.salesforce.com/s/{siteId}/{locale}/) which is not a valid storefront URL.
-			* We need to rewrite the path to /s/{siteId} so that it can be proxied to the correct SFCC URL.
-			*/
-			if (pathname === "/") proxyReq.path = `/s/${defaultSiteId}${url.search}`;
-			else proxyReq.path = `/s/${defaultSiteId}/${locale}${pathname}${url.search}`;
+			proxyReq.path = `${rewritePath?.(pathname) ?? null ?? rewriteToSfraPath(pathname, {
+				defaultSiteId,
+				defaultLocale: locale,
+				urlPrefix,
+				localeAliases,
+				siteAliases
+			})}${url.search}`;
 			logger.debug(`Hybrid proxy path rewrite: ${originalPath} → ${proxyReq.path}`);
 		}
 	});