@wix/himalaya-cli 0.1580.0 → 0.1582.0

package/templates/branded-lite/l10n/en.json

@@ -1,6 +1,6 @@
 {
   "$source": "en",
-  "$generated": "2026-11-05T13:12:33.176Z",
+  "$generated": "2026-11-05T19:49:25.752Z",
   "messages": {
     "h_042c862e4467": {
       "source": "Try again",
@@ -8,7 +8,7 @@
       "occurrences": [
         "himi_branded_home#payload.body.props.children[0].body.props.children[1].body.props.title",
         "himi_account_settings#payload.body.props.children[3].body.props.children[1].body.props.title",
-        "himi_shop#payload.body.props.children[7].body.props.children[3].body.props.title",
+        "himi_shop#payload.body.props.children[6].body.props.children[3].body.props.title",
         "himi_saved_products#payload.body.props.children[3].body.props.children[2].body.props.title",
         "himi_collections#payload.body.props.children[4].body.props.ctaLabel",
         "himi_collection#payload.body.props.children[0].body.props.children[8].body.props.ctaLabel",

package/templates/branded-lite/tier5-src/himi-store-product/index.ts

@@ -33,6 +33,7 @@ async function cartItemCount(): Promise<number> {
 }
 
 interface GalleryItem {
+  id: string;
   url: string;
 }
 
@@ -104,8 +105,8 @@ function slotsOf(groups: StoreOption[], selection: StoreOptionSelection, showErr
     out[`opt${n}Chips`] = (g?.choices ?? []).map((c) => ({ id: c.id, label: c.label, ...(g.kind === "color" && c.colorCode ? { swatch: c.colorCode } : {}), disabled: c.inStock === false }));
     out[`opt${n}Selected`] = chosen ? [chosen] : [];
     out[`opt${n}SelectedId`] = chosen;
-    out[`opt${n}Placeholder`] = g?.choices.find(c => c.id === chosen)?.label ?? copyTemplate("product.optionPlaceholder", "Choose {option}", { option: displayName || "option" });
-    const error = showErrors && g && !chosen ? copyTemplate("product.optionRequired", "Choose a {option}", { option: g.name.toLowerCase() }) : "";
+    out[`opt${n}Placeholder`] = g?.choices.find(c => c.id === chosen)?.label ?? copyTemplate("product.optionPlaceholder", "Select {option}", { option: displayName || "option" });
+    const error = showErrors && g && !chosen ? copyTemplate("product.optionRequired", "Select a {option}", { option: g.name.toLowerCase() }) : "";
     out[`opt${n}Error`] = error;
     out[`noOpt${n}Error`] = !error;
     out[`hasOpt${n}Error`] = !!error;
@@ -231,6 +232,8 @@ interface S {
   /** FULL media gallery (media.items[] with the main image first) — the detail
    *  screen renders a Carousel over it when 2+ images exist. */
   gallery: GalleryItem[];
+  galleryIndex: number;
+  galleryLabel: string;
   hasGallery: boolean;
   noGallery: boolean;
   initial: string;
@@ -240,6 +243,7 @@ interface S {
   cartCount: number;
   /** An add-to-cart write is in flight (pending line under the CTA). */
   adding: boolean;
+  addLabel: string;
   notAdding: boolean;
   /** The last add succeeded (confirmation + View cart under the CTA). */
   added: boolean;
@@ -276,6 +280,11 @@ interface S {
   /** Add to cart is blocked: this product has options and they are not all chosen. */
   optionsIncomplete: boolean;
   showOptionErrors: boolean;
+  optionValidationRequest: number;
+  optionValidationTarget: string;
+  opt1ScrollRequest: string;
+  opt2ScrollRequest: string;
+  opt3ScrollRequest: string;
   addDisabled: boolean;
   /** The product was served from the offline cache, which carries no option groups.
    *  "No groups" here means UNKNOWN, not "none" — so the CTA must stay blocked rather
@@ -323,7 +332,8 @@ export function productGallery(p: StoreProduct): GalleryItem[] {
   // image no matter what the read asked for. One reader, not a private copy per
   // worker — that is how the two layouts drifted apart in the first place.
   for (const url of sdkProductGallery(p, WIX_DETAIL_IMAGE)) push(url);
-  return urls.map((url) => ({ url }));
+  for (const group of productOptions(p, WIX_DETAIL_IMAGE)) for (const choice of group.choices) push(choice.image);
+  return urls.map((url) => ({ id: url, url }));
 }
 
 /** The product's public page URL when the payload carries one ("" otherwise) —
@@ -361,6 +371,7 @@ function parseQuantity(raw: string): number | undefined {
 
 function derive(s: S): S {
   const empty = s.status === "ready" && !s.name;
+  const galleryIndex = Math.min(Math.max(0, Math.floor(Number(s.galleryIndex) || 0)), Math.max(0, s.gallery.length - 1));
   const hasGallery = s.gallery.length > 1;
   const hasSingleImage = !!s.image && !hasGallery;
   const groups = s.optionGroups;
@@ -368,6 +379,8 @@ function derive(s: S): S {
   const optionsIncomplete = s.optionsUnknown || !!outOfStockPick(groups, s.selection) || (groups.length > 0 && (overflow || !isSelectionComplete(groups, s.selection)));
   return {
     ...s,
+    galleryIndex,
+    galleryLabel: s.gallery.length ? copyTemplate("product.galleryPage", "Image {index} of {count}", { index: String(galleryIndex + 1), count: String(s.gallery.length) }) : "",
     notOnSale: !s.wasPrice,
     wasPriceEmpty: !!s.wasPrice,
     noSku: !s.skuLabel,
@@ -396,9 +409,12 @@ function derive(s: S): S {
     // indistinguishable from one with none, and adding it would post the variant-less
     // line this whole feature exists to prevent.
     optionsIncomplete,
-    addDisabled: optionsIncomplete,
+    ...Object.fromEntries([1, 2, 3].map(n => [`opt${n}ScrollRequest`,
+      s.showOptionErrors && groups[n - 1]?.id === s.optionValidationTarget && !s.selection[groups[n - 1].id] ? String(s.optionValidationRequest || "") : ""])),
+    addDisabled: s.adding || s.optionsUnknown || overflow || !!outOfStockPick(groups, s.selection),
     optionsHint: groups.length ? optionsHint(groups, s.selection) : "",
     saveLabel: s.saved ? copyParam("savedProducts.removeLabel", "Remove from wishlist") : copyParam("savedProducts.addLabel", "Add to wishlist"),
+    addLabel: s.adding ? copyParam("product.adding", "Adding to cart…") : copyParam("product.addToCart", "Add to cart"),
     notAdding: !s.adding,
     notAdded: !s.added,
     isLoading: s.status === "loading",
@@ -433,7 +449,7 @@ const registerProduct = withIapPresentation<S>({
   register: withOnlineWrites(registerState, ["beginAdd", "addToCart", "buy"], { derive, messageFields: action => action === "buy" ? ["buyNote"] : ["cartHint"] }),
   adapters: SELLS_THROUGH_APPLE ? [storesProductOrders] : [],
   onCreate: commerce => { productPricing = commerce; }, prefix: "product",
-  transientKeys: ["price", "optionsIncomplete", "cartHint", "cartHidden", "buyHidden", "buyLabel", "buyDisabled", "buyNote", "purchasedNote", "addedSheetPresented", "shareHint"], contentActions: ["load", "readChanged"], concurrentPublishActions: ["buy"],
+  transientKeys: ["optionValidationTarget", "optionValidationRequest", "opt1ScrollRequest", "opt2ScrollRequest", "opt3ScrollRequest", "galleryIndex", "price", "optionsIncomplete", "cartHint", "cartHidden", "buyHidden", "buyLabel", "buyDisabled", "buyNote", "purchasedNote", "addedSheetPresented", "shareHint"], contentActions: ["load", "readChanged"], concurrentPublishActions: ["buy"],
   items: state => inputId() ? [{ reference: { kind: "storesProduct", id: inputId() }, commerceDisplayPrice: state.price }] : [],
   present: (state, price, allowed) => {
     const purchase = applePurchase(state);
@@ -441,9 +457,10 @@ const registerProduct = withIapPresentation<S>({
     const blocked = lastProduct?.productType?.toLowerCase() === "digital" || (!state.optionsUnknown && !allowed(inputId()));
     const cartHint = state.cartHint === offlineWriteMessage ? state.cartHint
       : !purchase.appleRoute && blocked ? unavailable : state.cartHint === unavailable ? "" : state.cartHint;
+    const productState = derive(state);
     return {
-      ...state, price: price(inputId()), ...(purchase.appleRoute ? { wasPrice: "", wasPriceEmpty: false, notOnSale: true } : {}), optionsIncomplete: derive(state).optionsIncomplete || !allowed(inputId()) || lastProduct?.productType?.toLowerCase() === "digital",
-      cartHint, noCartHint: !cartHint || state.added, addDisabled: state.addDisabled || blocked,
+      ...state, price: price(inputId()), ...(purchase.appleRoute ? { wasPrice: "", wasPriceEmpty: false, notOnSale: true } : {}), optionsIncomplete: productState.optionsIncomplete || !allowed(inputId()) || lastProduct?.productType?.toLowerCase() === "digital",
+      cartHint, noCartHint: !cartHint || state.added, addDisabled: productState.addDisabled || blocked,
       cartHidden: state.status !== "ready" || !state.name || purchase.appleRoute,
       buyHidden: state.status !== "ready" || !state.name || !purchase.appleRoute || purchase.accessReady, buyLabel: purchase.buyLabel, buyDisabled: purchase.buyDisabled,
       buyNote: state.buyNote === offlineWriteMessage ? state.buyNote : purchase.buyNote,
@@ -497,6 +514,7 @@ const svc = onlineService<S, {
   toggleReturnPolicy: (s: S) => S;
   toggleShippingInfo: (s: S) => S;
   selectOption: (s: S, arg?: unknown) => S;
+  setGalleryIndex: (s: S, arg?: unknown) => S;
   addToCart: (s: S) => Promise<S>;
   beginAdd: (s: S, arg?: unknown) => S;
   setCartCount: (s: S, arg?: unknown) => S;
@@ -541,6 +559,8 @@ const svc = onlineService<S, {
     shippingInfoExpanded: false,
     image: "",
     gallery: [],
+    galleryIndex: 0,
+    galleryLabel: "",
     hasGallery: false,
     noGallery: true,
     initial: "",
@@ -548,6 +568,7 @@ const svc = onlineService<S, {
     cartHint: "",
     cartCount: 0,
     adding: false,
+    addLabel: "",
     notAdding: true,
     added: false,
     notAdded: true,
@@ -573,6 +594,9 @@ const svc = onlineService<S, {
     noOptionsOverflow: true,
     optionsIncomplete: false,
     showOptionErrors: false,
+    optionValidationRequest: 0,
+    optionValidationTarget: "",
+    opt1ScrollRequest: "", opt2ScrollRequest: "", opt3ScrollRequest: "",
     addDisabled: false,
     optionsUnknown: false,
     optionsHint: "",
@@ -600,7 +624,8 @@ const svc = onlineService<S, {
       let saved = false;
       try { saved = isProductSaved(id); } catch { /* save action reports a retryable error */ }
       s = { ...s, saved, saveHint: "",
-        ...(id !== lastLoadedId ? { adding: false, added: false, shareHint: "", addedSheetPresented: false, quantity: 1, showOptionErrors: false, returnPolicyExpanded: false, shippingInfoExpanded: false } : {}) };
+        optionValidationTarget: "",
+        ...(id !== lastLoadedId ? { adding: false, added: false, shareHint: "", addedSheetPresented: false, quantity: 1, showOptionErrors: false, optionValidationRequest: 0, galleryIndex: 0, returnPolicyExpanded: false, shippingInfoExpanded: false } : {}) };
       // A fresh navigation into the product resets any quantity left over
       // from a previous visit to the same worker instance.
       if (!id) {
@@ -617,8 +642,8 @@ const svc = onlineService<S, {
       void cartCount.then((n) => { cartKnown = n; }, () => {});
       // The live product read goes out FIRST too — the local-db read below must never delay it.
       // Settled into a value so a failure is handled where it is awaited, never unhandled.
-      // DESCRIPTION widens the default fieldset with the V3 Ricos description (a V1 catalog ignores it).
-      const live = getStoreProduct(id, ["DESCRIPTION"], readOptions(arg)).then(
+      // Read both the Ricos description and choice-linked images; V3 omits these fields by default.
+      const live = getStoreProduct(id, ["DESCRIPTION", "PRODUCT_CHOICES_DISPLAY_IMAGE"], readOptions(arg)).then(
         (r) => ({ ok: true as const, r }),
         (error) => ({ ok: false as const, error }),
       );
@@ -646,11 +671,12 @@ const svc = onlineService<S, {
       if (outcome.ok) {
         const p = (outcome.r.product ?? (outcome.r as unknown as StoreProduct)) as StoreProduct;
         const name = cleanTitle(p.name) || "Product";
-        const image = productImage(p, WIX_DETAIL_IMAGE);
+        const gallery = productGallery(p);
+        const image = productImage(p, WIX_DETAIL_IMAGE) || gallery[0]?.url || "";
         lastProduct = p;
         // A group with exactly one choice is chosen for the shopper; a real choice
         // is left blank so the pick is deliberate.
-        const optionGroups = productOptions(p);
+        const optionGroups = productOptions(p, WIX_DETAIL_IMAGE);
         const sale = productSale(p);
         // A pooled screen re-appearing re-runs `load`. Wiping `selection` there means a
         // trip to the cart and back silently clears the size the shopper picked and
@@ -680,7 +706,7 @@ const svc = onlineService<S, {
           shippingInfoBody: productPolicyBody(p, "shipping") || copyParam("product.shippingInfoBody", "") || copyParam("product.policyUnavailable", "Policy details have not been provided by this store."),
           ...productBody(p),
           image,
-          gallery: productGallery(p),
+          gallery,
           initial: (name[0] || "#").toUpperCase(),
           shareUrl: productShareUrl(p),
           cartCount: badge(),
@@ -700,6 +726,11 @@ const svc = onlineService<S, {
     // One chip row per option group. `group` is the descriptor slot ("1".."3");
     // FilterChips sends back the WHOLE selected set, which for a single-select row
     // is either one id or none (re-tapping the active chip clears it).
+    setGalleryIndex: (s, arg) => {
+      const raw = argValue(arg, "index") || argValue(arg, "value");
+      const index = raw.trim() ? Number(raw) : NaN;
+      return Number.isInteger(index) && index >= 0 && index < s.gallery.length ? derive({ ...s, galleryIndex: index }) : s;
+    },
     selectOption: (s, arg) => {
       const slot = Math.floor(Number(argValue(arg, "group")));
       const group = s.optionGroups[slot - 1];
@@ -714,7 +745,9 @@ const svc = onlineService<S, {
       if (choice) selection[group.id] = choice; else delete selection[group.id];
       // A new choice invalidates the last add's confirmation — it was for the
       // previous variant.
-      return derive({ ...s, selection, added: false, addedSheetPresented: false, cartHint: "" });
+      const image = group.choices.find(c => c.id === choice)?.image;
+      const imageIndex = image ? s.gallery.findIndex(page => page.url === image) : -1;
+      return derive({ ...s, selection, optionValidationTarget: "", ...(imageIndex >= 0 ? { galleryIndex: imageIndex } : {}), added: false, addedSheetPresented: false, cartHint: "" });
     },
     // The pending half of addToCart, as its own reducer so it PUBLISHES before the
     // network write starts: the pending line shows and the top-bar badge ticks up in the same
@@ -743,12 +776,11 @@ const svc = onlineService<S, {
       if (!id) return derive({ ...s, cartHint: copyParam("product.cartHintNoProduct", "No product to add.") });
       // A second tap while the first write is in flight must not add the line twice.
       if (s.adding) return s;
-      // The CTA is already disabled on this state; this is the second gate, because
-      // a voice-control/deep-link dispatch reaches the action without the button.
+      // Missing choices show field errors; unavailable products still fail closed.
       if (s.optionsIncomplete) {
         // With no groups in hand there is nothing for `optionsHint` to name, so the
         // offline case needs its own reason rather than an empty string.
-        return derive({ ...s, showOptionErrors: true, cartHint: s.optionsUnknown
+        return derive({ ...s, showOptionErrors: true, optionValidationTarget: s.optionGroups.find(g => !s.selection[g.id])?.id ?? "", optionValidationRequest: (s.optionValidationRequest || 0) + 1, cartHint: s.optionsUnknown
           ? copyParam("product.cartHintOffline", "Reconnect to choose options and add this to your cart.")
           : optionsHint(s.optionGroups, s.selection) || copyParam("product.cartHintNoVariant", "That combination is not available. Try another.") });
       }