@wix/himalaya-cli 0.1096.0 → 0.1097.0

package/dist/authoring-runtime/node_modules/@wix/himalaya/dist/_types/stdlib/wix-sdk/stores-v1/src/display.d.ts

@@ -66,6 +66,17 @@ export interface StoreProduct {
             currency?: string;
         };
     };
+    /** Option groups, both spellings: V1 `productOptions`, V3 `options`. Declared
+     *  because the wire carries them on BOTH catalogs and this type denying them is
+     *  what let every template product screen drop the colour/size picker. Shapes
+     *  differ per catalog, so read them with `productOptions()` from ./options. */
+    productOptions?: unknown[];
+    options?: unknown[];
+    /** V3 purchasable variants. The cart addresses a V3 option choice by `variantId`,
+     *  which `cartOptionsPayload()` resolves out of this. */
+    variantsInfo?: {
+        variants?: unknown[];
+    };
 }
 export interface StoreProductsResponse {
     products?: StoreProduct[];

package/dist/authoring-runtime/node_modules/@wix/himalaya/dist/_types/stdlib/wix-sdk/stores-v1/src/extensions.d.ts

@@ -43,6 +43,7 @@ export declare function queryInventory(productId: string): Promise<WixQueryInven
  *  Only the supplied fields change (e.g. trackQuantity + a variant's quantity). */
 export declare function updateInventory(inventoryItemId: string, inventoryItem: WixInventoryItemWrite): Promise<WixUpdateInventoryResponse>;
 export * from "./display.js";
+export * from "./options.js";
 /** Forget the resolved Stores catalog version, in this worker and app-wide.
  *  Call this when the app points itself at a DIFFERENT Wix site. */
 export declare function forgetCatalogVersion(): void;

package/dist/authoring-runtime/node_modules/@wix/himalaya/dist/_types/stdlib/wix-sdk/stores-v1/src/options.d.ts

@@ -0,0 +1,74 @@
+import type { StoreProduct } from "./display.js";
+import { type WixImageSize } from "@wix/himalaya/wix-media";
+/** One selectable choice inside an option group. */
+export interface StoreOptionChoice {
+    /** Stable id within the group. V3: the `choiceId`. V1: the choice's own label,
+     *  which is what V1 has and what its cart payload carries. */
+    id: string;
+    /** What the shopper reads on the chip — "BEIGE", "M". */
+    label: string;
+    /** Is at least one variant carrying this choice in stock? */
+    inStock: boolean;
+    /** HEX swatch the site configured for this choice ("#e1bfc5"), or "" — a colour
+     *  group carries one, a size group does not. */
+    colorCode: string;
+    /** Choice-linked image, sized, or "" when the choice has none. */
+    image: string;
+}
+/** One option group, e.g. `COLOR` with `BEIGE` / `PINK`. */
+export interface StoreOption {
+    /** V3: the option id, used to resolve the variant. V1: the option name. */
+    id: string;
+    name: string;
+    /** `color` groups are the ones worth rendering as swatches — the choices carry
+     *  a `colorCode`. Everything else is a list of words. */
+    kind: "color" | "list";
+    choices: StoreOptionChoice[];
+}
+/** The shopper's pick: option id → choice id. A group the shopper has not chosen
+ *  yet is absent (or maps to ""). */
+export type StoreOptionSelection = Record<string, string>;
+/**
+ * Every offerable option group on a product, in site order, from either catalog.
+ *
+ * `[]` for a product with no options — the common case, so a caller must render
+ * nothing rather than an empty picker.
+ *
+ * `size` sizes the per-choice swatch image, like `productImage`; pass `null` for
+ * the stored original.
+ */
+export declare function productOptions(product: StoreProduct | undefined, size?: WixImageSize | null): StoreOption[];
+/** The choice to preselect for a group: the only one when there is exactly one,
+ *  otherwise "" so the shopper picks deliberately. */
+export declare function defaultChoice(option: StoreOption): string;
+/** A selection with every single-choice group pre-filled — what a product screen
+ *  starts from. */
+export declare function defaultSelection(options: StoreOption[]): StoreOptionSelection;
+/** Has the shopper chosen in EVERY group? Add to cart stays disabled until this
+ *  is true — a half-chosen product is the unfulfillable order. */
+export declare function isSelectionComplete(options: StoreOption[], selection: StoreOptionSelection): boolean;
+/** Human summary of the current selection, e.g. "BEIGE · M" ("" when nothing is
+ *  chosen). Labels, not ids — this is shopper-facing text. */
+export declare function selectionSummary(options: StoreOption[], selection: StoreOptionSelection): string;
+/**
+ * The V3 variant matching the shopper's choices, or "" when none does.
+ *
+ * Set equality on `{optionId, choiceId}` pairs, not order — V3 does not promise
+ * the variant's `choices` array is in the product's option order, and a positional
+ * compare passes on a two-option product until the day the site reorders it.
+ */
+export declare function resolveVariantId(product: StoreProduct | undefined, selection: StoreOptionSelection): string;
+/**
+ * The `catalogReference.options` value for `addToCurrentCart`, built for whichever
+ * catalog this product came from — V3 `{ variantId }`, V1 `{ options: {…} }`.
+ *
+ * `undefined` for a product with no options at all, which is what the cart wants
+ * (the line needs no `options` object).
+ *
+ * THROWS on V3 when the selection matches no variant, rather than returning a
+ * payload that adds an un-fulfillable line. The two ways to get here are a
+ * selection that is still incomplete (guard with `isSelectionComplete`) and a read
+ * whose `variantsInfo` did not come back — both are the caller's to fix, and both
+ * are invisible if this returns a plausible-looking payload instead.
+ */
+export declare function cartOptionsPayload(product: StoreProduct | undefined, options: StoreOption[], selection: StoreOptionSelection): Record<string, unknown> | undefined;

package/dist/authoring-runtime/node_modules/@wix/himalaya/dist/wix-stores.mjs

@@ -577,6 +577,131 @@ function plainText(value) {
   return (value || "").replace(/<[^>]+>/g, "").replace(/\s+/g, " ").trim();
 }
 
+// ../../stdlib/wix-sdk/stores-v1/src/options.ts
+function str(v) {
+  return typeof v === "string" ? v.trim() : "";
+}
+function choiceImage(raw, size) {
+  const m = raw;
+  const slot = m?.mainMedia ?? m?.items?.[0] ?? raw;
+  return slot ? mediaSlotUrl(slot, size) : "";
+}
+function hex(raw) {
+  const v = str(raw);
+  return /^#[0-9a-fA-F]{3}([0-9a-fA-F]{3})?$/.test(v) ? v.toLowerCase() : "";
+}
+function v1Choices(raw, size) {
+  const out = [];
+  for (const c of Array.isArray(raw) ? raw : []) {
+    const o = c;
+    if (o.visible === false) continue;
+    const label = str(o.description) || str(o.value);
+    if (!label || out.some((x) => x.id === label)) continue;
+    out.push({
+      id: label,
+      label,
+      inStock: o.inStock !== false,
+      colorCode: hex(o.value),
+      image: choiceImage(o.media, size)
+    });
+  }
+  return out;
+}
+function v3Choices(raw, size) {
+  const settings = raw;
+  const out = [];
+  for (const c of Array.isArray(settings?.choices) ? settings.choices : []) {
+    const o = c;
+    if (o.visible === false) continue;
+    const label = str(o.name) || str(o.key);
+    const id = str(o.choiceId);
+    if (!id || !label || out.some((x) => x.id === id)) continue;
+    const linked = Array.isArray(o.linkedMedia) ? o.linkedMedia[0] : void 0;
+    out.push({
+      id,
+      label,
+      inStock: o.inStock !== false,
+      colorCode: hex(o.colorCode) || hex(o.value?.colorCode),
+      image: choiceImage(o.displayImage ?? linked, size)
+    });
+  }
+  return out;
+}
+function kindOf(raw) {
+  const v = str(raw).toUpperCase();
+  return v.includes("COLOR") || v.includes("COLOUR") || v === "SWATCH_CHOICES" ? "color" : "list";
+}
+function productOptions(product, size = WIX_LIST_IMAGE) {
+  const p = product;
+  const out = [];
+  for (const raw of Array.isArray(p?.productOptions) ? p.productOptions : []) {
+    const o = raw;
+    const name = str(o.name);
+    const choices = v1Choices(o.choices, size);
+    if (name) out.push({ id: name, name, kind: kindOf(o.optionType), choices });
+  }
+  if (out.length) return out;
+  for (const raw of Array.isArray(p?.options) ? p.options : []) {
+    const o = raw;
+    const name = str(o.name);
+    const id = str(o.id) || name;
+    const choices = v3Choices(o.choicesSettings, size);
+    if (name) out.push({ id, name, kind: kindOf(o.optionRenderType), choices });
+  }
+  return out;
+}
+function defaultChoice(option) {
+  return option.choices.length === 1 ? option.choices[0].id : "";
+}
+function defaultSelection(options) {
+  const out = {};
+  for (const o of options) {
+    const choice = defaultChoice(o);
+    if (choice) out[o.id] = choice;
+  }
+  return out;
+}
+function isSelectionComplete(options, selection) {
+  return options.every((o) => !!selection[o.id]);
+}
+function selectionSummary(options, selection) {
+  return options.map((o) => o.choices.find((c) => c.id === selection[o.id])?.label ?? "").filter(Boolean).join(" \xB7 ");
+}
+function isV3(p) {
+  return Array.isArray(p.options) || !!p.variantsInfo;
+}
+function resolveVariantId(product, selection) {
+  const p = product;
+  const variants = p?.variantsInfo?.variants ?? [];
+  const want = Object.entries(selection).filter(([, choice]) => !!choice);
+  for (const v of variants) {
+    if (v.visible === false) continue;
+    const pairs = (v.choices ?? []).map((c) => [str(c.optionChoiceIds?.optionId), str(c.optionChoiceIds?.choiceId)]);
+    if (pairs.length !== want.length) continue;
+    if (want.every(([optionId, choiceId]) => pairs.some(([o, c]) => o === optionId && c === choiceId))) {
+      return str(v.id);
+    }
+  }
+  return "";
+}
+function cartOptionsPayload(product, options, selection) {
+  const p = product ?? {};
+  if (isV3(p)) {
+    const variantId = resolveVariantId(product, selection);
+    if (variantId) return { variantId };
+    if (options.length === 0) return void 0;
+    throw new Error(
+      "cartOptionsPayload: no Catalog V3 variant matches the chosen options \u2014 check every option group has a choice (isSelectionComplete) and that the product was read with its variantsInfo."
+    );
+  }
+  const picked = {};
+  for (const o of options) {
+    const choice = selection[o.id];
+    if (choice) picked[o.name] = choice;
+  }
+  return Object.keys(picked).length ? { options: picked } : void 0;
+}
+
 // ../../stdlib/wix-sdk/stores-v1/src/extensions.ts
 function queryProducts(req = {}) {
   return readWithCatalogFallback(async (v) => {
@@ -685,21 +810,28 @@ export {
   WIX_DETAIL_IMAGE,
   WIX_LIST_IMAGE,
   addProductMedia,
+  cartOptionsPayload,
   createProduct,
+  defaultChoice,
+  defaultSelection,
   deleteProduct,
   forgetCatalogVersion2 as forgetCatalogVersion,
   getProduct,
   getStoreProduct,
+  isSelectionComplete,
   isUnsizedWixMedia,
   mediaSlotUrl,
   plainText,
   productGallery,
   productImage,
+  productOptions,
   productPrice,
   queryInventory,
   queryProducts,
   queryStoreProducts,
+  resolveVariantId,
   searchStoreProducts,
+  selectionSummary,
   updateInventory,
   updateProduct,
   wixCall,

package/guides/sdk-reference.json

@@ -21651,7 +21651,7 @@
         "name": "StoreProduct",
         "kind": "interface",
         "jsdoc": "",
-        "decl": "export interface StoreProduct {\n  id?: string;\n  name?: string;\n  slug?: string;\n  description?: string;\n  plainDescription?: string;\n  /** Both gallery layouts: V1 `mainMedia`/`items`, V3 `main`/`itemsInfo.items`. */\n  media?: {\n    mainMedia?: WixMediaSlot;\n    main?: WixMediaSlot;\n    items?: WixMediaSlot[];\n    itemsInfo?: { items?: WixMediaSlot[] };\n  };\n  price?: { formatted?: { price?: string }; price?: number; currency?: string };\n  priceData?: { formatted?: { price?: string }; price?: number; currency?: string };\n  currency?: string;\n  actualPriceRange?: {\n    minValue?: { amount?: string; formattedAmount?: string; currency?: string };\n    maxValue?: { amount?: string; formattedAmount?: string; currency?: string };\n  };\n}"
+        "decl": "export interface StoreProduct {\n  id?: string;\n  name?: string;\n  slug?: string;\n  description?: string;\n  plainDescription?: string;\n  /** Both gallery layouts: V1 `mainMedia`/`items`, V3 `main`/`itemsInfo.items`. */\n  media?: {\n    mainMedia?: WixMediaSlot;\n    main?: WixMediaSlot;\n    items?: WixMediaSlot[];\n    itemsInfo?: { items?: WixMediaSlot[] };\n  };\n  price?: { formatted?: { price?: string }; price?: number; currency?: string };\n  priceData?: { formatted?: { price?: string }; price?: number; currency?: string };\n  currency?: string;\n  actualPriceRange?: {\n    minValue?: { amount?: string; formattedAmount?: string; currency?: string };\n    maxValue?: { amount?: string; formattedAmount?: string; currency?: string };\n  };\n  /** Option groups, both spellings: V1 `productOptions`, V3 `options`. Declared\n   *  because the wire carries them on BOTH catalogs and this type denying them is\n   *  what let every template product screen drop the colour/size picker. Shapes\n   *  differ per catalog, so read them with `productOptions()` from ./options. */\n  productOptions?: unknown[];\n  options?: unknown[];\n  /** V3 purchasable variants. The cart addresses a V3 option choice by `variantId`,\n   *  which `cartOptionsPayload()` resolves out of this. */\n  variantsInfo?: { variants?: unknown[] };\n}"
       },
       {
         "name": "StoreProductsResponse",
@@ -21696,6 +21696,66 @@
         "jsdoc": "",
         "decl": "export function plainText(value?: string): string;"
       },
+      {
+        "name": "StoreOptionChoice",
+        "kind": "interface",
+        "jsdoc": "/** One selectable choice inside an option group. */",
+        "decl": "export interface StoreOptionChoice {\n  /** Stable id within the group. V3: the `choiceId`. V1: the choice's own label,\n   *  which is what V1 has and what its cart payload carries. */\n  id: string;\n  /** What the shopper reads on the chip — \"BEIGE\", \"M\". */\n  label: string;\n  /** Is at least one variant carrying this choice in stock? */\n  inStock: boolean;\n  /** HEX swatch the site configured for this choice (\"#e1bfc5\"), or \"\" — a colour\n   *  group carries one, a size group does not. */\n  colorCode: string;\n  /** Choice-linked image, sized, or \"\" when the choice has none. */\n  image: string;\n}"
+      },
+      {
+        "name": "StoreOption",
+        "kind": "interface",
+        "jsdoc": "/** One option group, e.g. `COLOR` with `BEIGE` / `PINK`. */",
+        "decl": "export interface StoreOption {\n  /** V3: the option id, used to resolve the variant. V1: the option name. */\n  id: string;\n  name: string;\n  /** `color` groups are the ones worth rendering as swatches — the choices carry\n   *  a `colorCode`. Everything else is a list of words. */\n  kind: \"color\" | \"list\";\n  choices: StoreOptionChoice[];\n}"
+      },
+      {
+        "name": "StoreOptionSelection",
+        "kind": "type",
+        "jsdoc": "/** The shopper's pick: option id → choice id. A group the shopper has not chosen\n *  yet is absent (or maps to \"\"). */",
+        "decl": "export type StoreOptionSelection = Record<string, string>;"
+      },
+      {
+        "name": "productOptions",
+        "kind": "function",
+        "jsdoc": "/**\n * Every offerable option group on a product, in site order, from either catalog.\n *\n * `[]` for a product with no options — the common case, so a caller must render\n * nothing rather than an empty picker.\n *\n * `size` sizes the per-choice swatch image, like `productImage`; pass `null` for\n * the stored original.\n */",
+        "decl": "export function productOptions(\n  product: StoreProduct | undefined,\n  size: WixImageSize | null = WIX_LIST_IMAGE,\n): StoreOption[];"
+      },
+      {
+        "name": "defaultChoice",
+        "kind": "function",
+        "jsdoc": "/** The choice to preselect for a group: the only one when there is exactly one,\n *  otherwise \"\" so the shopper picks deliberately. */",
+        "decl": "export function defaultChoice(option: StoreOption): string;"
+      },
+      {
+        "name": "defaultSelection",
+        "kind": "function",
+        "jsdoc": "/** A selection with every single-choice group pre-filled — what a product screen\n *  starts from. */",
+        "decl": "export function defaultSelection(options: StoreOption[]): StoreOptionSelection;"
+      },
+      {
+        "name": "isSelectionComplete",
+        "kind": "function",
+        "jsdoc": "/** Has the shopper chosen in EVERY group? Add to cart stays disabled until this\n *  is true — a half-chosen product is the unfulfillable order. */",
+        "decl": "export function isSelectionComplete(options: StoreOption[], selection: StoreOptionSelection): boolean;"
+      },
+      {
+        "name": "selectionSummary",
+        "kind": "function",
+        "jsdoc": "/** Human summary of the current selection, e.g. \"BEIGE · M\" (\"\" when nothing is\n *  chosen). Labels, not ids — this is shopper-facing text. */",
+        "decl": "export function selectionSummary(options: StoreOption[], selection: StoreOptionSelection): string;"
+      },
+      {
+        "name": "resolveVariantId",
+        "kind": "function",
+        "jsdoc": "/**\n * The V3 variant matching the shopper's choices, or \"\" when none does.\n *\n * Set equality on `{optionId, choiceId}` pairs, not order — V3 does not promise\n * the variant's `choices` array is in the product's option order, and a positional\n * compare passes on a two-option product until the day the site reorders it.\n */",
+        "decl": "export function resolveVariantId(product: StoreProduct | undefined, selection: StoreOptionSelection): string;"
+      },
+      {
+        "name": "cartOptionsPayload",
+        "kind": "function",
+        "jsdoc": "/**\n * The `catalogReference.options` value for `addToCurrentCart`, built for whichever\n * catalog this product came from — V3 `{ variantId }`, V1 `{ options: {…} }`.\n *\n * `undefined` for a product with no options at all, which is what the cart wants\n * (the line needs no `options` object).\n *\n * THROWS on V3 when the selection matches no variant, rather than returning a\n * payload that adds an un-fulfillable line. The two ways to get here are a\n * selection that is still incomplete (guard with `isSelectionComplete`) and a read\n * whose `variantsInfo` did not come back — both are the caller's to fix, and both\n * are invisible if this returns a plausible-looking payload instead.\n */",
+        "decl": "export function cartOptionsPayload(\n  product: StoreProduct | undefined,\n  options: StoreOption[],\n  selection: StoreOptionSelection,\n): Record<string, unknown> | undefined;"
+      },
       {
         "name": "forgetCatalogVersion",
         "kind": "function",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wix/himalaya-cli",
-  "version": "0.1096.0",
+  "version": "0.1097.0",
   "type": "module",
   "description": "himi — the Himalaya authoring CLI. Build a Tier-5 content package on your own machine, push it to the production serve as a draft, preview it on web + Himi Player, and read worker logs back — the remote dev loop. Wraps @himalaya/serve-cli for transport.",
   "keywords": [
@@ -67,5 +67,5 @@
       "artifactId": "himalaya-cli"
     }
   },
-  "falconPackageHash": "8c3d412276bbc440753d0cea961d942686f0bc403cf0c4552ef2f12c"
+  "falconPackageHash": "a14970a4ab0b5e14659e9a75dc3d4ddbcaa2a0955fc287caf553d82c"
 }

package/templates/beauty-salon/dev/index.ts

@@ -25998,6 +25998,219 @@ const TEMPLATED: { pattern: string; display: string; liveSeed?: LiveSeed; static
                         }
                       }
                     },
+                    {
+                      "id": "himi_product.options_card",
+                      "body": {
+                        "package": "himalaya",
+                        "type": "VStack",
+                        "props": {
+                          "spacing": 12,
+                          "alignment": "leading",
+                          "children": [
+                            {
+                              "id": "himi_product.opt1_row",
+                              "body": {
+                                "package": "himalaya",
+                                "type": "VStack",
+                                "props": {
+                                  "spacing": 8,
+                                  "alignment": "leading",
+                                  "children": [
+                                    {
+                                      "id": "",
+                                      "body": {
+                                        "package": "himalaya",
+                                        "type": "Text",
+                                        "props": {
+                                          "text": "$service:himiStoreProduct.opt1Label",
+                                          "style": "bodyEmphasis",
+                                          "collapseWhenEmpty": true
+                                        }
+                                      }
+                                    },
+                                    {
+                                      "id": "himi_product.opt1",
+                                      "body": {
+                                        "package": "himalaya",
+                                        "type": "FilterChips",
+                                        "props": {
+                                          "chips": [],
+                                          "optionsPath": "$service:himiStoreProduct.opt1Chips",
+                                          "selectedIds": [
+                                            "$service:himiStoreProduct.opt1Selected"
+                                          ],
+                                          "onChange": {
+                                            "actionId": "tier5.himiStoreProduct.selectOption",
+                                            "params": {
+                                              "group": "1"
+                                            }
+                                          }
+                                        }
+                                      },
+                                      "modifiers": {
+                                        "accessibilityLabel": "$service:himiStoreProduct.opt1Label"
+                                      }
+                                    }
+                                  ]
+                                }
+                              },
+                              "modifiers": {
+                                "hiddenPath": "$service:himiStoreProduct.noOpt1"
+                              }
+                            },
+                            {
+                              "id": "himi_product.opt2_row",
+                              "body": {
+                                "package": "himalaya",
+                                "type": "VStack",
+                                "props": {
+                                  "spacing": 8,
+                                  "alignment": "leading",
+                                  "children": [
+                                    {
+                                      "id": "",
+                                      "body": {
+                                        "package": "himalaya",
+                                        "type": "Text",
+                                        "props": {
+                                          "text": "$service:himiStoreProduct.opt2Label",
+                                          "style": "bodyEmphasis",
+                                          "collapseWhenEmpty": true
+                                        }
+                                      }
+                                    },
+                                    {
+                                      "id": "himi_product.opt2",
+                                      "body": {
+                                        "package": "himalaya",
+                                        "type": "FilterChips",
+                                        "props": {
+                                          "chips": [],
+                                          "optionsPath": "$service:himiStoreProduct.opt2Chips",
+                                          "selectedIds": [
+                                            "$service:himiStoreProduct.opt2Selected"
+                                          ],
+                                          "onChange": {
+                                            "actionId": "tier5.himiStoreProduct.selectOption",
+                                            "params": {
+                                              "group": "2"
+                                            }
+                                          }
+                                        }
+                                      },
+                                      "modifiers": {
+                                        "accessibilityLabel": "$service:himiStoreProduct.opt2Label"
+                                      }
+                                    }
+                                  ]
+                                }
+                              },
+                              "modifiers": {
+                                "hiddenPath": "$service:himiStoreProduct.noOpt2"
+                              }
+                            },
+                            {
+                              "id": "himi_product.opt3_row",
+                              "body": {
+                                "package": "himalaya",
+                                "type": "VStack",
+                                "props": {
+                                  "spacing": 8,
+                                  "alignment": "leading",
+                                  "children": [
+                                    {
+                                      "id": "",
+                                      "body": {
+                                        "package": "himalaya",
+                                        "type": "Text",
+                                        "props": {
+                                          "text": "$service:himiStoreProduct.opt3Label",
+                                          "style": "bodyEmphasis",
+                                          "collapseWhenEmpty": true
+                                        }
+                                      }
+                                    },
+                                    {
+                                      "id": "himi_product.opt3",
+                                      "body": {
+                                        "package": "himalaya",
+                                        "type": "FilterChips",
+                                        "props": {
+                                          "chips": [],
+                                          "optionsPath": "$service:himiStoreProduct.opt3Chips",
+                                          "selectedIds": [
+                                            "$service:himiStoreProduct.opt3Selected"
+                                          ],
+                                          "onChange": {
+                                            "actionId": "tier5.himiStoreProduct.selectOption",
+                                            "params": {
+                                              "group": "3"
+                                            }
+                                          }
+                                        }
+                                      },
+                                      "modifiers": {
+                                        "accessibilityLabel": "$service:himiStoreProduct.opt3Label"
+                                      }
+                                    }
+                                  ]
+                                }
+                              },
+                              "modifiers": {
+                                "hiddenPath": "$service:himiStoreProduct.noOpt3"
+                              }
+                            },
+                            {
+                              "id": "himi_product.options_hint",
+                              "body": {
+                                "package": "himalaya",
+                                "type": "Text",
+                                "props": {
+                                  "text": "$service:himiStoreProduct.optionsHint",
+                                  "style": "footnote",
+                                  "color": "textSecondary",
+                                  "collapseWhenEmpty": true
+                                }
+                              }
+                            },
+                            {
+                              "id": "",
+                              "body": {
+                                "package": "himalaya",
+                                "type": "Text",
+                                "props": {
+                                  "text": "This product has more options than this screen can show. Open it on the website to order.",
+                                  "style": "footnote",
+                                  "color": "textSecondary"
+                                }
+                              },
+                              "modifiers": {
+                                "hiddenPath": "$service:himiStoreProduct.noOptionsOverflow"
+                              }
+                            }
+                          ]
+                        }
+                      },
+                      "modifiers": {
+                        "background": {
+                          "token": "surfaceElevated"
+                        },
+                        "border": {
+                          "width": 1,
+                          "color": {
+                            "token": "border"
+                          }
+                        },
+                        "cornerRadius": 8,
+                        "padding": {
+                          "leading": 14,
+                          "trailing": 14,
+                          "top": 14,
+                          "bottom": 14
+                        },
+                        "hiddenPath": "$service:himiStoreProduct.noOptions"
+                      }
+                    },
                     {
                       "id": "himi_product.qty_card",
                       "body": {
@@ -26282,7 +26495,8 @@ const TEMPLATED: { pattern: string; display: string; liveSeed?: LiveSeed; static
                   "fullWidth": true,
                   "action": {
                     "actionId": "tier5.himiStoreProduct.addToCart"
-                  }
+                  },
+                  "disabledPath": "$service:himiStoreProduct.optionsIncomplete"
                 }
               },
               "modifiers": {