@nuskin/react-search-sdk 1.0.1-code-cleanup.1 → 1.1.0-pa-1255.1

package/dist/index.js

@@ -3,11 +3,11 @@
 var react = require('react');
 var configurationSdk = require('@nuskin/configuration-sdk');
 var reactSearchComponents = require('@nuskin/react-search-components');
+var jsxRuntime = require('react/jsx-runtime');
 var reactNuiChatSdk = require('@nuskin/react-nui-chat-sdk');
 require('@nuskin/react-nui-chat-sdk/styles.css');
 var reactProductSdk = require('@nuskin/react-product-sdk');
 var styled = require('@emotion/styled');
-var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
@@ -23,36 +23,53 @@ var CATALOG_SUGGESTIONS_PATH = "/storefront/catalogs/search/suggestions";
 var RECENT_SEARCHES_PREFIX = "nuskin:header:recentSearches";
 var RECENT_SEARCHES_DEFAULT_LIMIT = 10;
 var DEFAULT_SUGGESTION_PAGE = 1;
-var DEFAULT_SUGGESTION_SIZE = 6;
 var DEFAULT_SEARCH_PATH = "/search";
 var DEBOUNCE_MS = 220;
 var MINIMUM_SEARCH_CHAR_LENGTH = 2;
-var MAX_VISIBLE_SUGGESTIONS = 6;
+var DEFAULT_MAX_SUGGESTIONS = 6;
+var MAX_SUGGESTIONS_CEILING = 20;
 var EQUINOX_MARKETS_MAP = "Equinox_Markets";
-var DEFAULT_EQUINOX_CLIENT_ID = "63056848d7532f9923f3d08cb48c423b";
+var COMMERCE_SEARCH_MAP = "Commerce_Search";
 
 // src/config/commerceSearchConfig.ts
 var COMMERCE_SEARCH_CONFIG_DEFAULTS = Object.freeze({
-  minimumSearchLength: MINIMUM_SEARCH_CHAR_LENGTH
+  minimumSearchLength: MINIMUM_SEARCH_CHAR_LENGTH,
+  maxSuggestions: DEFAULT_MAX_SUGGESTIONS,
+  agentEnabledFor: Object.freeze({
+    guest: false,
+    brandAffiliate: false,
+    preferredCustomer: false,
+    retailCustomer: false
+  })
 });
-var TEST_ENVIRONMENT_VALUES = {
-  agent: {
-    appKey: "pk_commerce_product_advisor_624aea4305b09240e8c8f41d0f6527b2",
-    apiBaseUrl: "https://nui.tst.nuskin.ai/"
-  },
-  // Open to visitors who are not signed in, so the handoff can be tried where signing in is not
-  // possible (for example local development). Sign-in stays required everywhere else.
-  allowGuestAgent: true
+var FIELDS = {
+  minimumLength: "commerceSearchMinimumLength",
+  maxSuggestions: "commerceSearchMaxSuggestions",
+  agentAppKey: "commerceSearchAgentAppKey",
+  agentApiBaseUrl: "commerceSearchAgentApiBaseUrl",
+  enabledGuest: "commerceSearchAgentEnabledGuest",
+  enabledBrandAffiliate: "commerceSearchAgentEnabledBrandAffiliate",
+  enabledPreferredCustomer: "commerceSearchAgentEnabledPreferredCustomer",
+  enabledRetailCustomer: "commerceSearchAgentEnabledRetailCustomer"
 };
 function nonEmptyString(value) {
   return typeof value === "string" ? value.trim() : "";
 }
+function wholeNumber(value) {
+  const number = typeof value === "string" && value.trim() !== "" ? Number(value) : value;
+  return typeof number === "number" && Number.isInteger(number) ? number : void 0;
+}
+function positiveWholeNumber(value) {
+  const number = wholeNumber(value);
+  return number !== void 0 && number >= 1 ? number : void 0;
+}
 function normalizeCommerceSearchConfig(raw, { language } = {}) {
-  const minimumSearchLength = Number(raw?.minimumSearchLength);
-  const appKey = nonEmptyString(raw?.agent?.appKey);
-  const apiBaseUrl = nonEmptyString(raw?.agent?.apiBaseUrl);
+  const appKey = nonEmptyString(raw?.[FIELDS.agentAppKey]);
+  const apiBaseUrl = nonEmptyString(raw?.[FIELDS.agentApiBaseUrl]);
+  const maxSuggestions = positiveWholeNumber(raw?.[FIELDS.maxSuggestions]);
   return {
-    minimumSearchLength: Number.isInteger(minimumSearchLength) && minimumSearchLength >= 1 ? minimumSearchLength : COMMERCE_SEARCH_CONFIG_DEFAULTS.minimumSearchLength,
+    minimumSearchLength: positiveWholeNumber(raw?.[FIELDS.minimumLength]) ?? COMMERCE_SEARCH_CONFIG_DEFAULTS.minimumSearchLength,
+    maxSuggestions: maxSuggestions === void 0 ? COMMERCE_SEARCH_CONFIG_DEFAULTS.maxSuggestions : Math.min(maxSuggestions, MAX_SUGGESTIONS_CEILING),
     ...appKey && apiBaseUrl ? {
       agent: {
         appKey,
@@ -60,13 +77,36 @@ function normalizeCommerceSearchConfig(raw, { language } = {}) {
         ...language ? { language } : {}
       }
     } : {},
-    ...raw?.allowGuestAgent === true ? { allowGuestAgent: true } : {}
+    agentEnabledFor: {
+      guest: raw?.[FIELDS.enabledGuest] === true,
+      brandAffiliate: raw?.[FIELDS.enabledBrandAffiliate] === true,
+      preferredCustomer: raw?.[FIELDS.enabledPreferredCustomer] === true,
+      retailCustomer: raw?.[FIELDS.enabledRetailCustomer] === true
+    }
   };
 }
 async function fetchCommerceSearchConfig({
-  language
-} = {}) {
-  const raw = getEnvironmentCode() === "test" ? TEST_ENVIRONMENT_VALUES : {};
+  country,
+  language,
+  clientId
+}) {
+  const configuration = await getConfiguration([COMMERCE_SEARCH_MAP], {
+    country: country.trim().toUpperCase(),
+    ...clientId ? { clientId } : {}
+  });
+  const raw = configuration?.[COMMERCE_SEARCH_MAP];
+  if (!raw || Object.keys(raw).length === 0) {
+    throw new Error(
+      `the configuration service returned no ${COMMERCE_SEARCH_MAP} for market ${country}`
+    );
+  }
+  const hasKey = nonEmptyString(raw[FIELDS.agentAppKey]) !== "";
+  const hasUrl = nonEmptyString(raw[FIELDS.agentApiBaseUrl]) !== "";
+  if (hasKey !== hasUrl) {
+    console.warn(
+      `[search] The agent is half configured: ${FIELDS.agentAppKey} and ${FIELDS.agentApiBaseUrl} must both be set, or both empty. Using plain search.`
+    );
+  }
   return normalizeCommerceSearchConfig(raw, language ? { language } : {});
 }
 
@@ -74,30 +114,39 @@ async function fetchCommerceSearchConfig({
 function useCommerceSearchConfig({
   country,
   language,
-  enabled
+  clientId,
+  isOpen
 }) {
-  const [config, setConfig] = react.useState(
-    COMMERCE_SEARCH_CONFIG_DEFAULTS
-  );
+  const market = `${country}|${language}|${clientId ?? ""}`;
+  const [loaded, setLoaded] = react.useState(null);
+  const currentMarket = react.useRef(market);
   react.useEffect(() => {
-    if (!enabled) return void 0;
-    let isStale = false;
+    currentMarket.current = market;
+  }, [market]);
+  const reading = react.useRef(null);
+  react.useEffect(() => {
+    if (!isOpen || loaded?.market === market || reading.current === market) {
+      return;
+    }
+    reading.current = market;
     fetchCommerceSearchConfig({
-      ...country ? { country } : {},
-      ...language ? { language } : {}
-    }).then((next) => {
-      if (!isStale) setConfig(next);
+      country,
+      language,
+      ...clientId ? { clientId } : {}
+    }).then((config) => {
+      if (currentMarket.current === market) {
+        setLoaded({ market, config });
+      }
     }).catch((error) => {
       console.warn(
         "[search] Could not load the product search configuration:",
         error
       );
+    }).finally(() => {
+      if (reading.current === market) reading.current = null;
     });
-    return () => {
-      isStale = true;
-    };
-  }, [enabled, country, language]);
-  return config;
+  }, [isOpen, market, loaded, country, language, clientId]);
+  return loaded?.market === market ? loaded.config : COMMERCE_SEARCH_CONFIG_DEFAULTS;
 }
 
 // src/copy/searchPanelCopy.ts
@@ -180,25 +229,38 @@ function useSearchPanelCopy({
 }
 
 // src/services/localeParts.ts
-function normalizeLocaleParts({
+var TWO_LETTERS = /^[A-Za-z]{2}$/;
+function marketProblem(country, language) {
+  const countryText = String(country ?? "").trim();
+  const languageText = String(language ?? "").trim();
+  if (TWO_LETTERS.test(countryText) && TWO_LETTERS.test(languageText)) {
+    return void 0;
+  }
+  return `the market is not valid (country ${JSON.stringify(countryText)}, language ${JSON.stringify(languageText)}): each must be two letters, for example US and en`;
+}
+function isValidMarket(country, language) {
+  return marketProblem(country, language) === void 0;
+}
+function createLocaleParts({
   country,
-  language,
-  locale
+  language
 }) {
-  const normalizedCountry = String(country ?? "").trim().toUpperCase();
-  const normalizedLanguage = String(language ?? "").trim().toLowerCase();
-  const normalizedLocale = String(locale ?? "").trim() || "UNKNOWN";
+  const problem = marketProblem(country, language);
+  if (problem) throw new Error(problem);
+  const normalizedCountry = country.trim().toUpperCase();
+  const normalizedLanguage = language.trim().toLowerCase();
   return {
-    country: normalizedCountry || "UNKNOWN",
-    language: normalizedLanguage || "unknown",
-    locale: normalizedLocale
+    country: normalizedCountry,
+    language: normalizedLanguage,
+    locale: `${normalizedCountry}-${normalizedLanguage}`
   };
 }
-function toCatalogLocale(localeParts) {
-  const language = String(localeParts.language ?? "en").toLowerCase();
-  const country = String(localeParts.country ?? "US").toUpperCase();
+function toCatalogLocale({ country, language }) {
   return `${language}_${country}`;
 }
+function toPathPrefix({ country, language }) {
+  return `/${country.toLowerCase()}/${language}`;
+}
 
 // src/services/catalogRequest.ts
 function resolveApiGatewayPath(apiGatewayPath, apiName = STOREFRONT_SHOPPING_CONTEXT) {
@@ -223,13 +285,14 @@ function buildCatalogSuggestionsUrl(apiBaseUrl) {
 function buildSuggestionsRequestUrl({
   suggestionsUrl,
   searchTerm,
+  size,
   storeId,
   localeParts
 }) {
   const queryParams = new URLSearchParams({
     searchTerm,
     page: String(DEFAULT_SUGGESTION_PAGE),
-    size: String(DEFAULT_SUGGESTION_SIZE),
+    size: String(size),
     locale: toCatalogLocale(localeParts),
     storeId
   });
@@ -241,12 +304,21 @@ async function resolveCatalogRequestConfig({
   getMarketConfig
 }) {
   const marketConfig = getMarketConfig ? await getMarketConfig({ locationLike, country }) ?? null : null;
-  return {
-    suggestionsUrl: buildCatalogSuggestionsUrl(
-      resolveCatalogApiBaseUrl(marketConfig)
-    ),
-    storeId: resolveCatalogStoreId(marketConfig)
-  };
+  const suggestionsUrl = buildCatalogSuggestionsUrl(
+    resolveCatalogApiBaseUrl(marketConfig)
+  );
+  if (!suggestionsUrl) {
+    throw new Error(
+      `no suggestions API for market ${country}: the market configuration has no gateway`
+    );
+  }
+  const storeId = resolveCatalogStoreId(marketConfig);
+  if (!storeId) {
+    throw new Error(
+      `no suggestions API for market ${country}: the market configuration has no store`
+    );
+  }
+  return { suggestionsUrl, storeId };
 }
 function resolveCustomerTypeHeaders(getCustomerType) {
   const customerType = getCustomerType?.()?.trim();
@@ -291,7 +363,7 @@ function getSessionStorage(providedStorage) {
   return null;
 }
 function getRecentHeaderSearchesStorageKey(localeParts) {
-  const { country, language, locale } = normalizeLocaleParts(localeParts);
+  const { country, language, locale } = localeParts;
   return `${RECENT_SEARCHES_PREFIX}:${locale}:${country}:${language}`;
 }
 function getRecentHeaderSearches(localeParts, storage) {
@@ -354,13 +426,14 @@ function buildSearchResultsPath(query, localeParts) {
     /%2D/gi,
     "-"
   );
-  const country = localeParts.country.toLowerCase();
-  const language = localeParts.language.toLowerCase();
-  return `/${country}/${language}${DEFAULT_SEARCH_PATH}/${encodedQuery}`;
+  return `${toPathPrefix(localeParts)}${DEFAULT_SEARCH_PATH}/${encodedQuery}`;
 }
+var SCHEME = /^[a-z][a-z0-9+.-]*:/i;
 function normalizeOptionUrl(rawValue) {
   if (typeof rawValue !== "string") return "";
-  return rawValue.trim();
+  const value = rawValue.trim();
+  if (!value || value.startsWith("/") || SCHEME.test(value)) return value;
+  return `/${value}`;
 }
 function safeDecodeURIComponent(value) {
   try {
@@ -390,16 +463,14 @@ function slugifyPathSegment(value) {
 function buildProductSlugPath(slugValue, localeParts) {
   const slug = slugifyPathSegment(slugValue);
   if (!slug) return "";
-  const country = String(localeParts.country ?? "US").toLowerCase();
-  const language = String(localeParts.language ?? "en").toLowerCase();
-  return `/${country}/${language}/product/${slug}`;
+  return `${toPathPrefix(localeParts)}/product/${slug}`;
 }
 function isNavigableUrl(value) {
   if (!value) return false;
   return value.startsWith("/") || /^https?:\/\//i.test(value);
 }
 function stripLocalePrefix(path, localeParts) {
-  const prefix = `/${localeParts.country.toLowerCase()}/${localeParts.language.toLowerCase()}`;
+  const prefix = toPathPrefix(localeParts);
   return path.startsWith(prefix) ? path.slice(prefix.length) || "/" : path;
 }
 function resolveOptionHref(option, localeParts) {
@@ -453,26 +524,21 @@ function getBrowserLocation(providedLocation) {
     return window.location;
   return null;
 }
-function resolveFetch(fetchImplOption) {
-  if (fetchImplOption !== void 0) return fetchImplOption;
-  return typeof fetch === "function" ? fetch.bind(globalThis) : null;
-}
-function createSearchService(options = {}) {
+function createSearchService(options) {
   const {
     fetchImpl: fetchImplOption,
     location: providedLocation,
     storage: providedStorage,
     country,
     language,
-    locale,
     getMarketConfig,
     getCustomerType,
-    minimumSearchLength = MINIMUM_SEARCH_CHAR_LENGTH
+    minimumSearchLength = MINIMUM_SEARCH_CHAR_LENGTH,
+    maxSuggestions = DEFAULT_MAX_SUGGESTIONS
   } = options;
-  const fetchImpl = resolveFetch(fetchImplOption);
   const locationLike = getBrowserLocation(providedLocation);
   const storage = getSessionStorage(providedStorage);
-  const localeParts = normalizeLocaleParts({ country, language, locale });
+  const localeParts = createLocaleParts({ country, language });
   let catalogRequestConfigPromise = null;
   function loadCatalogRequestConfig() {
     if (!catalogRequestConfigPromise) {
@@ -494,16 +560,16 @@ function createSearchService(options = {}) {
   const service = {
     async fetchSuggestions(searchTerm) {
       const trimmedSearchTerm = String(searchTerm ?? "").trim();
-      if (!trimmedSearchTerm || trimmedSearchTerm.length < minimumSearchLength || !fetchImpl) {
+      if (!trimmedSearchTerm || trimmedSearchTerm.length < minimumSearchLength) {
         return emptySuggestions();
       }
       const { suggestionsUrl, storeId } = await loadCatalogRequestConfig();
-      if (!suggestionsUrl || !storeId) return emptySuggestions();
       const responsePayload = await fetchJson(
-        fetchImpl,
+        fetchImplOption ?? fetch.bind(globalThis),
         buildSuggestionsRequestUrl({
           suggestionsUrl,
           searchTerm: trimmedSearchTerm,
+          size: maxSuggestions,
           storeId,
           localeParts
         }),
@@ -553,12 +619,15 @@ function createSearchService(options = {}) {
 }
 
 // src/services/marketConfig.ts
-var fetchMarketConfig = async ({ country }) => {
-  const countryCode = String(country ?? "").trim().toUpperCase() || "US";
+var fetchMarketConfig = async ({
+  country,
+  clientId
+}) => {
+  const countryCode = country.trim().toUpperCase();
   const configuration = await getConfiguration([EQUINOX_MARKETS_MAP], {
     country: countryCode,
     ...getEnvironmentCode() ? { environment: getEnvironmentCode() } : {},
-    clientId: DEFAULT_EQUINOX_CLIENT_ID,
+    ...clientId ? { clientId } : {},
     shoppingContext: STOREFRONT_SHOPPING_CONTEXT
   });
   return configuration?.[EQUINOX_MARKETS_MAP] ?? null;
@@ -577,14 +646,25 @@ var SEARCH_GTM_USER_STATUS = {
 var GTM_FALLBACK_NA = "NA";
 
 // src/utils/navigationTarget.ts
+var EXTERNAL_URL = /^https?:\/\//i;
+var INTERNAL_PATH = /^\/(?![/\\])[^\t\n\r]*$/;
 function toNavigationTarget(path) {
-  return /^https?:\/\//i.test(path) ? { type: "external", url: path } : { type: "internal", path };
+  if (EXTERNAL_URL.test(path)) return { type: "external", url: path };
+  if (INTERNAL_PATH.test(path)) return { type: "internal", path };
+  return void 0;
 }
 
 // src/utils/productEnvironment.ts
-var PRODUCT_ENVIRONMENTS = ["dev", "test", "prod"];
+var PRODUCT_ENVIRONMENTS = {
+  dev: true,
+  test: true,
+  prod: true
+};
+function isProductEnvironment(code) {
+  return Object.keys(PRODUCT_ENVIRONMENTS).includes(code);
+}
 function toProductEnvironment(environmentCode) {
-  return environmentCode && PRODUCT_ENVIRONMENTS.includes(environmentCode) ? environmentCode : void 0;
+  return environmentCode !== void 0 && isProductEnvironment(environmentCode) ? environmentCode : void 0;
 }
 function getProductEnvironment() {
   try {
@@ -593,6 +673,47 @@ function getProductEnvironment() {
     return void 0;
   }
 }
+var NOTHING = () => void 0;
+function CommerceSearchUnavailable({
+  isOpen,
+  onClose,
+  country,
+  language,
+  logo
+}) {
+  react.useEffect(() => {
+    console.error(
+      `[search] Search is unavailable: ${marketProblem(country, language)}`
+    );
+  }, [country, language]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    reactSearchComponents.SearchPanel,
+    {
+      isOpen,
+      onClose,
+      copy: SEARCH_PANEL_COPY_EN,
+      logo,
+      input: { value: "", onChange: NOTHING, onSubmit: NOTHING },
+      suggestions: {
+        items: [],
+        loading: false,
+        showNoResults: false,
+        showDidYouMean: false,
+        hasMore: false,
+        query: "",
+        onSelect: NOTHING,
+        onRunAction: NOTHING,
+        onSeeMore: NOTHING
+      },
+      recentSearches: {
+        items: [],
+        onSelect: NOTHING,
+        onClear: NOTHING
+      },
+      agentPanel: /* @__PURE__ */ jsxRuntime.jsx("p", { role: "alert", children: "Search is unavailable right now." })
+    }
+  );
+}
 
 // src/utils/nuiSearchGate.ts
 var NUI_SEARCH_FLAG = "enableNuiSearch";
@@ -624,29 +745,23 @@ function resolveNuiSearchFlag(env = {}) {
   return parseFlagValue(new URLSearchParams(search).get(NUI_SEARCH_FLAG)) ?? readCookieFlag(cookie);
 }
 function isNuiSearchEnabled({
-  isAuthenticated,
   flag,
-  allowGuests = false
+  enabledForCustomer
 }) {
-  return flag === true && (isAuthenticated === true || allowGuests);
+  return flag === true && enabledForCustomer;
 }
 
 // src/hooks/useNuiAgentGate.ts
 function useNuiAgentGate({
   hasAgent,
   isOpen,
-  isAuthenticated,
-  allowGuestAgent
+  enabledForCustomer
 }) {
   const [flag, setFlag] = react.useState(void 0);
   react.useEffect(() => {
     if (isOpen) setFlag(resolveNuiSearchFlag());
   }, [isOpen]);
-  return hasAgent && isNuiSearchEnabled({
-    isAuthenticated,
-    flag,
-    allowGuests: allowGuestAgent
-  });
+  return hasAgent && isNuiSearchEnabled({ flag, enabledForCustomer });
 }
 function uniqueRecentSearches(queries) {
   const seen = /* @__PURE__ */ new Set();
@@ -980,7 +1095,7 @@ var FETCH_FAILED = {
   emptyFetched: true,
   failed: true
 };
-function toSettledResults(response) {
+function toSettledResults(response, maxSuggestions) {
   const { suggestions: allSuggestions, didYouMean } = normalizeSuggestionsResponse(response);
   if (didYouMean.length > 0) {
     return {
@@ -995,18 +1110,19 @@ function toSettledResults(response) {
     resolveTotalResultsCount2(response, allSuggestions.length),
     allSuggestions.length
   );
-  const suggestions = allSuggestions.slice(0, MAX_VISIBLE_SUGGESTIONS);
+  const suggestions = allSuggestions.slice(0, maxSuggestions);
   return {
     suggestions,
     didYouMean,
-    hasMoreResults: total > MAX_VISIBLE_SUGGESTIONS,
+    hasMoreResults: total > maxSuggestions,
     emptyFetched: suggestions.length === 0,
     failed: false
   };
 }
 function useSearchSuggestions({
   service,
-  enabled = true
+  enabled = true,
+  maxSuggestions = DEFAULT_MAX_SUGGESTIONS
 }) {
   const [query, setQuery] = react.useState("");
   const [suggestions, setSuggestions] = react.useState([]);
@@ -1063,7 +1179,8 @@ function useSearchSuggestions({
       let results;
       try {
         results = toSettledResults(
-          await service.fetchSuggestions(trimmedQuery)
+          await service.fetchSuggestions(trimmedQuery),
+          maxSuggestions
         );
       } catch (error) {
         console.warn("[search] Could not load suggestions:", error);
@@ -1073,9 +1190,10 @@ function useSearchSuggestions({
       settle(results, trimmedQuery);
       setLoading(false);
     },
-    [enabled, service, resetSuggestionsState, settle]
+    [enabled, maxSuggestions, service, resetSuggestionsState, settle]
   );
   react.useEffect(() => {
+    latestRequestId.current += 1;
     if (!enabled) {
       resetSuggestionsState();
       return void 0;
@@ -1083,7 +1201,6 @@ function useSearchSuggestions({
     if (fetchDebounced.current) {
       clearTimeout(fetchDebounced.current);
     }
-    latestRequestId.current += 1;
     fetchDebounced.current = setTimeout(() => {
       void runFetch(query);
     }, DEBOUNCE_MS);
@@ -1365,11 +1482,11 @@ function useHandoff({
     onUnavailableRef.current = onUnavailable;
   });
   react.useEffect(() => {
-    let cancelled = false;
+    let canceled = false;
     let timer;
     const startedAt = Date.now();
     const tryOpen = () => {
-      if (cancelled) return;
+      if (canceled) return;
       const handle = getSalesAIHandle();
       if (handle) {
         handle.open({
@@ -1389,7 +1506,7 @@ function useHandoff({
     };
     tryOpen();
     return () => {
-      cancelled = true;
+      canceled = true;
       if (timer !== void 0) clearTimeout(timer);
     };
   }, [query]);
@@ -1430,12 +1547,12 @@ function CommerceSearchView({
   onClose,
   service,
   navigate,
-  isAuthenticated,
   agent,
-  allowGuestAgent = false,
+  agentEnabledForCustomer,
   agentProducts,
   logo,
   minimumSearchLength = MINIMUM_SEARCH_CHAR_LENGTH,
+  maxSuggestions = DEFAULT_MAX_SUGGESTIONS,
   gtmContext
 }) {
   const [handoff, setHandoff] = react.useState(null);
@@ -1443,6 +1560,7 @@ function CommerceSearchView({
   const [pendingTerm, setPendingTerm] = react.useState(null);
   const search = useSearchSuggestions({
     service,
+    maxSuggestions,
     enabled: isOpen && agentQuery === null
   });
   const {
@@ -1458,8 +1576,7 @@ function CommerceSearchView({
   const agentEnabled = useNuiAgentGate({
     hasAgent: agent !== void 0,
     isOpen,
-    isAuthenticated,
-    allowGuestAgent
+    enabledForCustomer: agentEnabledForCustomer
   });
   const { recentSearches, clearRecentSearches } = useRecentSearches({
     service,
@@ -1617,43 +1734,89 @@ function CommerceSearchView({
   );
 }
 var GUEST = "guest";
-function CommerceSearch({
+var AGENT_SWITCH_FOR = {
+  guest: "guest",
+  "Brand Affiliate": "brandAffiliate",
+  "Retail Customer": "retailCustomer",
+  "Preferred Customer/Member": "preferredCustomer"
+};
+var AGENT_SWITCHES = new Map(
+  Object.entries(AGENT_SWITCH_FOR)
+);
+function CommerceSearch(props) {
+  if (!isValidMarket(props.country, props.language)) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      CommerceSearchUnavailable,
+      {
+        isOpen: props.isOpen,
+        onClose: props.onClose,
+        country: props.country,
+        language: props.language,
+        logo: props.logo
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(ValidMarketSearch, { ...props });
+}
+function ValidMarketSearch({
   isOpen,
   onClose,
   navigate,
   customer,
   country,
   language,
+  clientId,
   logo
 }) {
-  const [hasOpened, setHasOpened] = react.useState(false);
-  react.useEffect(() => {
-    if (isOpen) setHasOpened(true);
-  }, [isOpen]);
   const copy = useSearchPanelCopy({ language });
-  const { minimumSearchLength, agent, allowGuestAgent } = useCommerceSearchConfig({
+  const { minimumSearchLength, maxSuggestions, agent, agentEnabledFor } = useCommerceSearchConfig({
     country,
     language,
-    enabled: hasOpened
+    ...clientId ? { clientId } : {},
+    isOpen
   });
   const customerType = customer.isAuthenticated ? customer.accountType ?? GUEST : GUEST;
   const customerTypeRef = react.useRef(customerType);
   react.useEffect(() => {
     customerTypeRef.current = customerType;
   }, [customerType]);
+  const agentEnabledForCustomer = agentEnabledFor[AGENT_SWITCHES.get(customerType) ?? "guest"];
+  const getMarketConfig = react.useCallback(
+    (context) => fetchMarketConfig({
+      ...context,
+      ...clientId ? { clientId } : {}
+    }),
+    [clientId]
+  );
   const service = react.useMemo(
     () => createSearchService({
       country,
       language,
-      locale: `${country.toUpperCase()}-${language.toLowerCase()}`,
-      getMarketConfig: fetchMarketConfig,
+      getMarketConfig,
       minimumSearchLength,
+      maxSuggestions,
       getCustomerType: () => customerTypeRef.current
     }),
-    [country, language, minimumSearchLength]
+    [
+      country,
+      language,
+      getMarketConfig,
+      minimumSearchLength,
+      maxSuggestions
+    ]
   );
   const navigateToPath = react.useCallback(
-    (path) => navigate(toNavigationTarget(path)),
+    (path) => {
+      const target = toNavigationTarget(path);
+      if (target) {
+        navigate(target);
+      } else {
+        console.warn(
+          "[search] Not navigating to a path the SDK does not recognize:",
+          path
+        );
+      }
+    },
     [navigate]
   );
   const { isAuthenticated, accountType, userId } = customer;
@@ -1683,13 +1846,13 @@ function CommerceSearch({
       onClose,
       service,
       navigate: navigateToPath,
-      isAuthenticated,
       ...agent ? { agent } : {},
-      ...allowGuestAgent ? { allowGuestAgent } : {},
+      agentEnabledForCustomer,
       ...agentProducts ? { agentProducts } : {},
       copy,
       logo,
       minimumSearchLength,
+      maxSuggestions,
       gtmContext
     }
   );