@nuskin/react-search-sdk 1.0.0-trying-again.7 → 1.0.0-trying-again.9

package/README.md

@@ -51,8 +51,11 @@ import { CommerceSearch } from '@nuskin/react-search-sdk';
 | `language` | yes      | ISO 639-1 language, for example `en`.                                                                                                                               |
 | `logo`     | no       | An element shown at the top of the panel.                                                                                                                           |
 
-The NUi agent also needs the `enableNuiSearch` cookie, or `?enableNuiSearch=true` in the URL, while
-that is the on/off switch. It is for signed-in visitors only, unless the configuration sets
+The NUi agent also needs the `enableNuiSearch` flag, while that is the on/off switch: either
+`?enableNuiSearch=true` in the URL of the page the panel is opened on, or a cookie `enableNuiSearch=true`
+that you set by hand. The library only reads them and never copies the parameter into the cookie, so the
+parameter applies to that page alone. If both are present the parameter wins, so `?enableNuiSearch=false`
+switches the agent off for a page. It is for signed-in visitors only, unless the configuration sets
 `allowGuestAgent` (today only the test environment does, so the handoff can be tried where signing in
 is not possible).
 

package/dist/index.d.mts

@@ -58,6 +58,6 @@ interface CommerceSearchProps {
  * The package works out the rest itself: the market's catalog lookup, the minimum search length,
  * which NUi app to use, the panel's text and the analytics fields.
  */
-declare function CommerceSearch({ isOpen, onClose, navigate, customer, country, language, logo, }: Readonly<CommerceSearchProps>): ReactElement;
+declare function CommerceSearch({ isOpen, onClose, navigate, customer, country, language, logo, }: Readonly<CommerceSearchProps>): ReactElement | null;
 
 export { CommerceSearch, type CommerceSearchCustomer, type CommerceSearchProps, type CustomerAccountType, type NavigationTarget };

package/dist/index.d.ts

@@ -58,6 +58,6 @@ interface CommerceSearchProps {
  * The package works out the rest itself: the market's catalog lookup, the minimum search length,
  * which NUi app to use, the panel's text and the analytics fields.
  */
-declare function CommerceSearch({ isOpen, onClose, navigate, customer, country, language, logo, }: Readonly<CommerceSearchProps>): ReactElement;
+declare function CommerceSearch({ isOpen, onClose, navigate, customer, country, language, logo, }: Readonly<CommerceSearchProps>): ReactElement | null;
 
 export { CommerceSearch, type CommerceSearchCustomer, type CommerceSearchProps, type CustomerAccountType, type NavigationTarget };

package/dist/index.js

@@ -100,6 +100,65 @@ function useCommerceSearchConfig({
   return config;
 }
 
+// src/copy/searchPanelCopy.ts
+var SEARCH_PANEL_COPY_EN = {
+  cancel: "Cancel",
+  searchPlaceholder: "Search",
+  didYouMean: "Did You Mean?",
+  noSuggestions: "No suggestions",
+  seeMoreResults: "See More Results",
+  recentSearches: "Recent searches",
+  clearRecentSearches: "Clear all",
+  moreRecentSearches: (count) => `+${count} More`,
+  searchLabel: "Search",
+  submitSearch: "Submit search",
+  clearInput: "Clear search",
+  suggestionsLabel: "Suggestions",
+  addToCart: (productName) => `Add ${productName} to cart`,
+  openBundle: (productName) => `Open bundle action for ${productName}`,
+  suggestionsLoading: "Loading suggestions",
+  suggestionsCount: (count) => `${count} suggestions available`
+};
+
+// src/copy/fetchSearchPanelCopy.ts
+async function fetchSearchPanelCopy(_options = {}) {
+  return SEARCH_PANEL_COPY_EN;
+}
+
+// src/copy/loadSearchPanelCopy.ts
+var copyByLanguage = /* @__PURE__ */ new Map();
+function loadSearchPanelCopy(language) {
+  const key = (language ?? "").toLowerCase();
+  const cached = copyByLanguage.get(key);
+  if (cached) return cached;
+  const pending = fetchSearchPanelCopy(language ? { } : {});
+  copyByLanguage.set(key, pending);
+  pending.catch(() => copyByLanguage.delete(key));
+  return pending;
+}
+
+// src/hooks/useSearchPanelCopy.ts
+function useSearchPanelCopy({
+  language
+}) {
+  const [copy, setCopy] = react.useState(void 0);
+  react.useEffect(() => {
+    let isStale = false;
+    loadSearchPanelCopy(language).then((next) => {
+      if (!isStale) setCopy(next);
+    }).catch((error) => {
+      console.warn(
+        "[search] Could not load the search panel text:",
+        error
+      );
+    });
+    return () => {
+      isStale = true;
+    };
+  }, [language]);
+  return copy;
+}
+
 // src/services/SearchApiService.ts
 function canUseStorage(storage) {
   return Boolean(storage) && typeof storage.getItem === "function";
@@ -1013,9 +1072,10 @@ function readCookieFlag(cookie) {
     const separator = part.indexOf("=");
     if (separator < 0) continue;
     if (part.slice(0, separator).trim() !== NUI_SEARCH_FLAG) continue;
-    const rawValue = part.slice(separator + 1);
     try {
-      return parseFlagValue(decodeURIComponent(rawValue));
+      return parseFlagValue(
+        decodeURIComponent(part.slice(separator + 1))
+      );
     } catch {
       return void 0;
     }
@@ -1026,20 +1086,7 @@ function resolveNuiSearchFlag(env = {}) {
   const inBrowser = typeof window !== "undefined" && typeof document !== "undefined";
   const search = env.search ?? (inBrowser ? window.location.search : "");
   const cookie = env.cookie ?? (inBrowser ? document.cookie : "");
-  const setCookie = env.setCookie ?? (inBrowser ? (value) => {
-    document.cookie = value;
-  } : void 0);
-  const fromQuery = parseFlagValue(
-    new URLSearchParams(search).get(NUI_SEARCH_FLAG)
-  );
-  if (fromQuery !== void 0) {
-    const secure = inBrowser && window.location.protocol === "https:" ? "; Secure" : "";
-    setCookie?.(
-      `${NUI_SEARCH_FLAG}=${fromQuery}; path=/; SameSite=Lax${secure}`
-    );
-    return fromQuery;
-  }
-  return readCookieFlag(cookie);
+  return parseFlagValue(new URLSearchParams(search).get(NUI_SEARCH_FLAG)) ?? readCookieFlag(cookie);
 }
 function isNuiSearchEnabled({
   isAuthenticated,
@@ -1209,6 +1256,7 @@ function uniqueRecentSearches(queries) {
   });
 }
 function CommerceSearchView({
+  copy,
   isOpen,
   onClose,
   service,
@@ -1435,10 +1483,11 @@ function CommerceSearchView({
     );
   }
   return /* @__PURE__ */ jsxRuntime.jsx(
-    reactSearchComponents.SearchModal,
+    reactSearchComponents.SearchPanel,
     {
       isOpen,
       onClose: close,
+      copy,
       logo,
       input: {
         value: query,
@@ -1479,6 +1528,7 @@ function CommerceSearch({
   react.useEffect(() => {
     if (isOpen) setHasOpened(true);
   }, [isOpen]);
+  const copy = useSearchPanelCopy({ language });
   const { minimumSearchLength, agent, allowGuestAgent } = useCommerceSearchConfig({
     country,
     language,
@@ -1520,6 +1570,7 @@ function CommerceSearch({
       language: language.toLowerCase()
     } : void 0;
   }, [country, language]);
+  if (!copy) return null;
   return /* @__PURE__ */ jsxRuntime.jsx(
     CommerceSearchView,
     {
@@ -1531,6 +1582,7 @@ function CommerceSearch({
       ...agent ? { agent } : {},
       ...allowGuestAgent ? { allowGuestAgent } : {},
       ...agentProducts ? { agentProducts } : {},
+      copy,
       logo,
       minimumSearchLength,
       gtmContext