@thefittingroom/shop-ui 5.0.21 → 5.0.23

package/dist/index.js

@@ -14054,7 +14054,7 @@ function applyFrameBaseUrl(url, baseUrl2) {
   return `${cleanBase}${url.startsWith("/") ? "" : "/"}${url}`;
 }
 const STORAGE_KEY = "tfr:fitting-room:v1";
-const logger$h = getLogger("fitting-room");
+const logger$g = getLogger("fitting-room-storage");
 function readAll() {
   try {
     const raw = window.localStorage.getItem(STORAGE_KEY);
@@ -14067,7 +14067,7 @@ function readAll() {
     }
     return parsed;
   } catch (error) {
-    logger$h.logWarn("Failed to read fitting room from localStorage", {
+    logger$g.logWarn("Failed to read fitting room from localStorage", {
       error
     });
     return {};
@@ -14077,7 +14077,7 @@ function writeAll(all) {
   try {
     window.localStorage.setItem(STORAGE_KEY, JSON.stringify(all));
   } catch (error) {
-    logger$h.logWarn("Failed to write fitting room to localStorage", {
+    logger$g.logWarn("Failed to write fitting room to localStorage", {
       error
     });
   }
@@ -14105,13 +14105,13 @@ async function toggleFittingRoomItem(productId, handle, isPdp) {
   const state = useMainStore.getState();
   const isInFittingRoom = state.fittingRoom.some((item) => item.externalId === productId);
   if (isInFittingRoom) {
-    logger$h.logDebug("{{ts}} - Removing from fitting room", {
+    logger$g.logDebug("{{ts}} - Removing from fitting room", {
       productId
     });
     state.removeFromFittingRoom(productId);
     return;
   }
-  logger$h.logDebug("{{ts}} - Adding to fitting room", {
+  logger$g.logDebug("{{ts}} - Adding to fitting room", {
     productId,
     handle,
     isPdp
@@ -14133,7 +14133,7 @@ async function toggleFittingRoomItem(productId, handle, isPdp) {
         size = selection.size || null;
         color = selection.color;
       } catch (error) {
-        logger$h.logWarn("Failed to read selected options from currentProduct", {
+        logger$g.logWarn("Failed to read selected options from currentProduct", {
           error
         });
       }
@@ -23007,7 +23007,7 @@ function isVersionServiceProvider(provider) {
 }
 const name$q = "@firebase/app";
 const version$1$1 = "0.14.5";
-const logger$g = new Logger3("@firebase/app");
+const logger$f = new Logger3("@firebase/app");
 const name$p = "@firebase/app-compat";
 const name$o = "@firebase/analytics-compat";
 const name$n = "@firebase/analytics";
@@ -23074,13 +23074,13 @@ function _addComponent(app, component) {
   try {
     app.container.addComponent(component);
   } catch (e) {
-    logger$g.debug(`Component ${component.name} failed to register with FirebaseApp ${app.name}`, e);
+    logger$f.debug(`Component ${component.name} failed to register with FirebaseApp ${app.name}`, e);
   }
 }
 function _registerComponent(component) {
   const componentName = component.name;
   if (_components.has(componentName)) {
-    logger$g.debug(`There were multiple attempts to register component ${componentName}.`);
+    logger$f.debug(`There were multiple attempts to register component ${componentName}.`);
     return false;
   }
   _components.set(componentName, component);
@@ -23289,7 +23289,7 @@ function registerVersion(libraryKeyOrName, version2, variant) {
     if (versionMismatch) {
       warning.push(`version name "${version2}" contains illegal characters (whitespace or "/")`);
     }
-    logger$g.warn(warning.join(" "));
+    logger$f.warn(warning.join(" "));
     return;
   }
   _registerComponent(new Component(
@@ -23333,12 +23333,12 @@ async function readHeartbeatsFromIndexedDB(app) {
     return result;
   } catch (e) {
     if (e instanceof FirebaseError) {
-      logger$g.warn(e.message);
+      logger$f.warn(e.message);
     } else {
       const idbGetError = ERROR_FACTORY.create("idb-get", {
         originalErrorMessage: e?.message
       });
-      logger$g.warn(idbGetError.message);
+      logger$f.warn(idbGetError.message);
     }
   }
 }
@@ -23351,12 +23351,12 @@ async function writeHeartbeatsToIndexedDB(app, heartbeatObject) {
     await tx.done;
   } catch (e) {
     if (e instanceof FirebaseError) {
-      logger$g.warn(e.message);
+      logger$f.warn(e.message);
     } else {
       const idbGetError = ERROR_FACTORY.create("idb-set", {
         originalErrorMessage: e?.message
       });
-      logger$g.warn(idbGetError.message);
+      logger$f.warn(idbGetError.message);
     }
   }
 }
@@ -23405,7 +23405,7 @@ class HeartbeatServiceImpl {
       }
       return this._storage.overwrite(this._heartbeatsCache);
     } catch (e) {
-      logger$g.warn(e);
+      logger$f.warn(e);
     }
   }
   /**
@@ -23436,7 +23436,7 @@ class HeartbeatServiceImpl {
       }
       return headerString;
     } catch (e) {
-      logger$g.warn(e);
+      logger$f.warn(e);
       return "";
     }
   }
@@ -41004,7 +41004,7 @@ const firebaseDateToDayjs = (date) => {
   return dayjs(date.seconds * 1e3);
 };
 const LOGIN_TRACKING_PERIOD_SECONDS = 1800;
-const logger$f = getLogger("firebase");
+const logger$e = getLogger("firebase");
 let firebaseApp = null;
 class FirestoreManager {
   constructor(firestore) {
@@ -41132,7 +41132,7 @@ class AuthManager {
       this.listenToUserProfileUnsub = null;
     }
     if (authUser) {
-      logger$f.logDebug("User logged in:", {
+      logger$e.logDebug("User logged in:", {
         uid: authUser.uid
       });
       this.listenToUserProfileUnsub = getFirestoreManager().listenToDoc("users", authUser.uid, (doc2) => {
@@ -41166,7 +41166,7 @@ class AuthManager {
             await firestore.mergeDocData("user_logging", userLoggingDocId, userLoggingData);
           }
         } catch (error) {
-          logger$f.logError("Error logging user login activity:", {
+          logger$e.logError("Error logging user login activity:", {
             error
           });
         }
@@ -41364,7 +41364,7 @@ async function getStyleByExternalId(brandId, externalId) {
   recordCache[cacheKey] = record;
   return record;
 }
-const logger$e = getLogger("product");
+const logger$d = getLogger("product");
 function _init$2() {
   useMainStore.subscribe((state, prevState) => {
     if (state.userHasAvatar && !prevState.userHasAvatar) {
@@ -41397,11 +41397,11 @@ function loadProductDataToStore(externalId) {
     try {
       const productData2 = await loadProductData(externalId);
       useMainStore.getState().setProductData(productData2.externalId, productData2);
-      logger$e.logDebug(`Loaded product data for externalId: ${externalId}`, {
+      logger$d.logDebug(`Loaded product data for externalId: ${externalId}`, {
         productData: productData2
       });
     } catch (error) {
-      logger$e.logError(`Error loading product data for externalId: ${externalId}`, {
+      logger$d.logError(`Error loading product data for externalId: ${externalId}`, {
         error
       });
     }
@@ -41416,7 +41416,7 @@ function loadProductDataToStore(externalId) {
   }
   loadAndStore();
 }
-const logger$d = getLogger("style-categories");
+const logger$c = getLogger("style-categories");
 let cached = null;
 let inflight = null;
 function buildIndex(categories, groups) {
@@ -41460,7 +41460,7 @@ async function loadStyleCategoryIndex() {
   }
   inflight = (async () => {
     try {
-      logger$d.logDebug("{{ts}} - Loading style-category index");
+      logger$c.logDebug("{{ts}} - Loading style-category index");
       const [categories, groups] = await Promise.all([getStyleCategories(), getStyleCategoryGroups()]);
       cached = buildIndex(categories, groups);
       return cached;
@@ -41473,12 +41473,12 @@ async function loadStyleCategoryIndex() {
 function peekStyleCategoryIndex() {
   return cached;
 }
-const logger$c = getLogger("fitting-room-data");
+const logger$b = getLogger("fitting-room-data");
 async function loadFittingRoomData() {
   const state = useMainStore.getState();
   const items = state.fittingRoom;
   loadStyleCategoryIndex().catch((error) => {
-    logger$c.logError("Failed to load style-category index", {
+    logger$b.logError("Failed to load style-category index", {
       error
     });
   });
@@ -41526,7 +41526,7 @@ async function loadFittingRoomData() {
       }
     }
   } catch (error) {
-    logger$c.logError("productLookup batch failed", {
+    logger$b.logError("productLookup batch failed", {
       error,
       handles
     });
@@ -41561,7 +41561,7 @@ function resolveItem(item, merchantSlot, loadedSlot, index) {
     const found = loadedProduct.sizeFitRecommendation.available_sizes.some((sz) => sz.colorway_size_assets.some((csa) => csa.id === item.colorwaySizeAssetId));
     if (!found) {
       needsResize = true;
-      logger$c.logDebug("csa no longer in size rec, marking needsResize", {
+      logger$b.logDebug("csa no longer in size rec, marking needsResize", {
         externalId: item.externalId,
         csa: item.colorwaySizeAssetId
       });
@@ -41611,7 +41611,7 @@ function useResolvedFittingRoom() {
   }, []);
   reactExports.useEffect(() => {
     loadFittingRoomData().catch((error) => {
-      logger$c.logError("loadFittingRoomData failed", {
+      logger$b.logError("loadFittingRoomData failed", {
         error
       });
     });
@@ -41657,6 +41657,68 @@ function useResolvedFittingRoom() {
     };
   }, [fittingRoom, productData, merchantProductData, index, styleCategoryError]);
 }
+function buildVtoProductDataFromResolved(item) {
+  const {
+    merchantProduct,
+    loadedProduct
+  } = item;
+  if (!merchantProduct || !loadedProduct) return null;
+  const sizeRec = loadedProduct.sizeFitRecommendation;
+  const recommendedSizeId = sizeRec.recommended_size.id || null;
+  const recommendedSizeLabel = getSizeLabelFromSize(sizeRec.recommended_size);
+  if (recommendedSizeId == null || !recommendedSizeLabel) {
+    logger$b.logWarn("Missing recommended size for item", {
+      externalId: item.externalId
+    });
+    return null;
+  }
+  const sizes = [];
+  for (const sizeRecord of sizeRec.available_sizes) {
+    const sizeLabel = getSizeLabelFromSize(sizeRecord);
+    if (!sizeLabel) continue;
+    const fit = sizeRec.fits.find((f) => f.size_id === sizeRecord.id);
+    if (!fit) continue;
+    const colors = [];
+    for (const csa of sizeRecord.colorway_size_assets) {
+      const variant = merchantProduct.variants.find((v) => v.sku === csa.sku);
+      if (!variant) continue;
+      colors.push({
+        colorwaySizeAssetId: csa.id,
+        colorLabel: variant.color || null,
+        sku: csa.sku,
+        priceFormatted: variant.priceFormatted
+      });
+    }
+    if (colors.length === 0) continue;
+    sizes.push({
+      sizeId: sizeRecord.id,
+      sizeLabel,
+      isRecommended: sizeRecord.id === recommendedSizeId,
+      fit,
+      colors
+    });
+  }
+  if (sizes.length === 0) return null;
+  return {
+    productName: merchantProduct.productName,
+    productDescriptionHtml: merchantProduct.productDescriptionHtml,
+    fitClassification: sizeRec.fit_classification,
+    recommendedSizeId,
+    recommendedSizeLabel,
+    sizes,
+    styleCategoryLabel: item.styleCategory?.label_singular ?? loadedProduct.style.style_category_label ?? null
+  };
+}
+function findRecommendedColorSize(data, preferredColor) {
+  const recommended = data.sizes.find((s) => s.isRecommended);
+  if (!recommended || recommended.colors.length === 0) return null;
+  return recommended.colors.find((c) => c.colorLabel === preferredColor) ?? recommended.colors[0];
+}
+function findCsaByLabel(data, sizeLabel, preferredColor) {
+  const sizeRecord = data.sizes.find((s) => s.sizeLabel === sizeLabel);
+  if (!sizeRecord || sizeRecord.colors.length === 0) return null;
+  return sizeRecord.colors.find((c) => c.colorLabel === preferredColor) ?? sizeRecord.colors[0];
+}
 function useMobileSheetSnap(initial = "collapsed") {
   const [snap, setSnap] = reactExports.useState(initial);
   const handleTouchStart = reactExports.useCallback((e) => {
@@ -42501,69 +42563,6 @@ function SizeSelector({
   }), [loadedProductData.sizes, selectedSizeLabel, onChangeSize]);
   return /* @__PURE__ */ jsx$1("div", { css: css2.container, children: sizeSelectorNodeList });
 }
-const logger$b = getLogger("overlays/fitting-room/product-data");
-function buildVtoProductDataFromResolved(item) {
-  const {
-    merchantProduct,
-    loadedProduct
-  } = item;
-  if (!merchantProduct || !loadedProduct) return null;
-  const sizeRec = loadedProduct.sizeFitRecommendation;
-  const recommendedSizeId = sizeRec.recommended_size.id || null;
-  const recommendedSizeLabel = getSizeLabelFromSize(sizeRec.recommended_size);
-  if (recommendedSizeId == null || !recommendedSizeLabel) {
-    logger$b.logWarn("Missing recommended size for item", {
-      externalId: item.externalId
-    });
-    return null;
-  }
-  const sizes = [];
-  for (const sizeRecord of sizeRec.available_sizes) {
-    const sizeLabel = getSizeLabelFromSize(sizeRecord);
-    if (!sizeLabel) continue;
-    const fit = sizeRec.fits.find((f) => f.size_id === sizeRecord.id);
-    if (!fit) continue;
-    const colors = [];
-    for (const csa of sizeRecord.colorway_size_assets) {
-      const variant = merchantProduct.variants.find((v) => v.sku === csa.sku);
-      if (!variant) continue;
-      colors.push({
-        colorwaySizeAssetId: csa.id,
-        colorLabel: variant.color || null,
-        sku: csa.sku,
-        priceFormatted: variant.priceFormatted
-      });
-    }
-    if (colors.length === 0) continue;
-    sizes.push({
-      sizeId: sizeRecord.id,
-      sizeLabel,
-      isRecommended: sizeRecord.id === recommendedSizeId,
-      fit,
-      colors
-    });
-  }
-  if (sizes.length === 0) return null;
-  return {
-    productName: merchantProduct.productName,
-    productDescriptionHtml: merchantProduct.productDescriptionHtml,
-    fitClassification: sizeRec.fit_classification,
-    recommendedSizeId,
-    recommendedSizeLabel,
-    sizes,
-    styleCategoryLabel: item.styleCategory?.label_singular ?? loadedProduct.style.style_category_label ?? null
-  };
-}
-function findRecommendedColorSize(data, preferredColor) {
-  const recommended = data.sizes.find((s) => s.isRecommended);
-  if (!recommended || recommended.colors.length === 0) return null;
-  return recommended.colors.find((c) => c.colorLabel === preferredColor) ?? recommended.colors[0];
-}
-function findCsaByLabel(data, sizeLabel, preferredColor) {
-  const sizeRecord = data.sizes.find((s) => s.sizeLabel === sizeLabel);
-  if (!sizeRecord || sizeRecord.colors.length === 0) return null;
-  return sizeRecord.colors.find((c) => c.colorLabel === preferredColor) ?? sizeRecord.colors[0];
-}
 function DetailAccordionItem({
   item,
   isOpen,
@@ -43219,8 +43218,7 @@ function TryOnView({
     ] }) })
   ] });
 }
-const logger$a = getLogger("overlays/fitting-room/use-vto-requests");
-const NON_PRIORITY_REQUEST_DELAY_MS = 500;
+const logger$a = getLogger("use-vto-requests");
 function outfitKey(items) {
   return items.map((i) => `${i.colorway_size_asset_id}:${i.untucked ? 1 : 0}`).sort().join("|");
 }
@@ -43228,6 +43226,7 @@ function useVtoRequests() {
   const [framesByKey, setFramesByKey] = reactExports.useState({});
   const requestedKeysRef = reactExports.useRef(/* @__PURE__ */ new Set());
   const lastPriorityTimeRef = reactExports.useRef(null);
+  const pendingPrefetchTimersRef = reactExports.useRef(/* @__PURE__ */ new Set());
   const [lastError, setLastError] = reactExports.useState(null);
   const clearError = reactExports.useCallback(() => setLastError(null), []);
   const request = reactExports.useCallback((items, priority) => {
@@ -43261,6 +43260,8 @@ function useVtoRequests() {
       });
     };
     if (priority) {
+      for (const timer of pendingPrefetchTimersRef.current) clearTimeout(timer);
+      pendingPrefetchTimersRef.current.clear();
       lastPriorityTimeRef.current = Date.now();
       exec();
       return;
@@ -43269,15 +43270,26 @@ function useVtoRequests() {
     let delay = 0;
     if (last) {
       const now = Date.now();
-      const minNext = last + NON_PRIORITY_REQUEST_DELAY_MS;
+      const minNext = last + getStaticData().config.api.vtoPrefetchDelayMs;
       if (now < minNext) delay = minNext - now;
     }
     if (delay > 0) {
-      setTimeout(exec, delay);
+      const timer = setTimeout(() => {
+        pendingPrefetchTimersRef.current.delete(timer);
+        exec();
+      }, delay);
+      pendingPrefetchTimersRef.current.add(timer);
     } else {
       exec();
     }
   }, []);
+  reactExports.useEffect(() => {
+    const timers = pendingPrefetchTimersRef.current;
+    return () => {
+      for (const timer of timers) clearTimeout(timer);
+      timers.clear();
+    };
+  }, []);
   const framesForOutfit = reactExports.useCallback((items) => {
     if (items.length === 0) return null;
     const key = outfitKey(items);
@@ -44354,14 +44366,10 @@ function FitChart({
     ] })
   ] });
 }
-const NON_PRIORITY_VTO_REQUEST_DELAY_MS = 500;
 const AVATAR_IMAGE_ASPECT_RATIO = 2 / 3;
 const AVATAR_GUTTER_HEIGHT_PX = 100;
 const CONTENT_AREA_WIDTH_PX = 550;
 const logger$6 = getLogger("overlays/vto-single");
-function compositionKey(csaId, untucked) {
-  return `${csaId}:${0}`;
-}
 function VtoSingleOverlay() {
   const userIsLoggedIn = useMainStore((state) => state.userIsLoggedIn);
   const userHasAvatar = useMainStore((state) => state.userHasAvatar);
@@ -44374,9 +44382,10 @@ function VtoSingleOverlay() {
   const [selectedSizeLabel, setSelectedSizeLabel] = reactExports.useState(null);
   const [selectedColorLabel, setSelectedColorLabel] = reactExports.useState(null);
   const [modalStyle, setModalStyle] = reactExports.useState({});
-  const [framesByKey, setFramesByKey] = reactExports.useState({});
-  const requestedKeysRef = reactExports.useRef(/* @__PURE__ */ new Set());
-  const lastPriorityVtoRequestTimeRef = reactExports.useRef(null);
+  const {
+    request: vtoRequest,
+    framesForOutfit
+  } = useVtoRequests();
   reactExports.useEffect(() => {
     if (!userIsLoggedIn) {
       openOverlay(OverlayName.LANDING, {
@@ -44547,63 +44556,17 @@ function VtoSingleOverlay() {
       availableColorLabels: availableColorLabels2
     };
   }, [vtoProductData, selectedSizeLabel, selectedColorLabel]);
-  const requestVto$1 = reactExports.useCallback((sizeColorRecord, priority) => {
-    const csaId = sizeColorRecord.colorwaySizeAssetId;
-    const key = compositionKey(csaId);
-    if (requestedKeysRef.current.has(key)) {
-      return;
-    }
-    function executeRequest() {
-      logger$6.timerStart(`requestVto_${sizeColorRecord.sku}`);
-      logger$6.logDebug(`{{ts}} - Requesting VTO for sku: ${sizeColorRecord.sku}`, {
-        priority,
-        sizeColorRecord
-      });
-      requestedKeysRef.current.add(key);
-      requestVto([{
-        colorway_size_asset_id: csaId,
-        untucked: false
-      }]).then((resp) => {
-        logger$6.timerEnd(`requestVto_${sizeColorRecord.sku}`);
-        logger$6.logTimer(`requestVto_${sizeColorRecord.sku}`, `{{ts}} - VTO data is loaded for sku: ${sizeColorRecord.sku}`);
-        setFramesByKey((prev2) => ({
-          ...prev2,
-          [key]: resp.frames
-        }));
-      }).catch((error) => {
-        logger$6.logError(`Error requesting VTO for sku: ${sizeColorRecord.sku}`, {
-          error,
-          sizeColorRecord
-        });
-        requestedKeysRef.current.delete(key);
-      });
-    }
-    {
-      let delay = 0;
-      if (priority) {
-        lastPriorityVtoRequestTimeRef.current = Date.now();
-      } else {
-        const lastPriorityTime = lastPriorityVtoRequestTimeRef.current;
-        if (lastPriorityTime) {
-          const now = Date.now();
-          const minNextRequestTime = lastPriorityTime + NON_PRIORITY_VTO_REQUEST_DELAY_MS;
-          if (now < minNextRequestTime) {
-            delay = minNextRequestTime - now;
-          }
-        }
-      }
-      if (delay) {
-        setTimeout(executeRequest, delay);
-        return;
-      }
-    }
-    executeRequest();
-  }, []);
+  const requestVto2 = reactExports.useCallback((sizeColorRecord, priority) => {
+    vtoRequest([{
+      colorway_size_asset_id: sizeColorRecord.colorwaySizeAssetId,
+      untucked: false
+    }], priority);
+  }, [vtoRequest]);
   reactExports.useEffect(() => {
     if (selectedColorSizeRecord) {
-      requestVto$1(selectedColorSizeRecord, true);
+      requestVto2(selectedColorSizeRecord, true);
     }
-  }, [requestVto$1, selectedColorSizeRecord]);
+  }, [requestVto2, selectedColorSizeRecord]);
   reactExports.useEffect(() => {
     if (!getStaticData().config.features.vtoPrefetch) {
       return;
@@ -44614,28 +44577,28 @@ function VtoSingleOverlay() {
     for (const sizeRecord of vtoProductData.sizes) {
       const sizeColorRecord = sizeRecord.colors.find((c) => c.colorLabel === selectedColorLabel) ?? sizeRecord.colors[0];
       if (sizeColorRecord) {
-        requestVto$1(sizeColorRecord, false);
+        requestVto2(sizeColorRecord, false);
       }
     }
-  }, [requestVto$1, vtoProductData, selectedColorLabel]);
+  }, [requestVto2, vtoProductData, selectedColorLabel]);
   const frameUrls = reactExports.useMemo(() => {
     if (!selectedColorSizeRecord) {
       return null;
     }
-    const key = compositionKey(selectedColorSizeRecord.colorwaySizeAssetId);
-    const frames = framesByKey[key];
-    if (!frames || frames.length === 0) {
+    const rewritten = framesForOutfit([{
+      colorway_size_asset_id: selectedColorSizeRecord.colorwaySizeAssetId,
+      untucked: false
+    }]);
+    if (!rewritten) {
       return null;
     }
     logger$6.logDebug(`{{ts}} - Displaying VTO for sku: ${selectedColorSizeRecord.sku}`);
-    const baseUrl2 = getStaticData().config.frames.baseUrl;
-    const rewritten = frames.map((u) => applyFrameBaseUrl(u, baseUrl2));
     rewritten.forEach((url) => {
       const img = new Image();
       img.src = url;
     });
     return rewritten;
-  }, [selectedColorSizeRecord, framesByKey]);
+  }, [selectedColorSizeRecord, framesForOutfit]);
   const handleSignOutClick = reactExports.useCallback(() => {
     closeOverlay();
     const authManager2 = getAuthManager();
@@ -45968,6 +45931,7 @@ function Widget({
 var EnvName = /* @__PURE__ */ ((EnvName2) => {
   EnvName2["DEVELOPMENT"] = "development";
   EnvName2["PRODUCTION"] = "production";
+  EnvName2["DEMO"] = "demo";
   EnvName2["LOCAL"] = "local";
   return EnvName2;
 })(EnvName || {});
@@ -45977,9 +45941,9 @@ const SHARED_CONFIG = {
     appGooglePlayUrl: "https://play.google.com/store/apps/details?id=com.thefittingroom.marketplace"
   },
   build: {
-    version: `${"5.0.21"}`,
-    commitHash: `${"569efc2"}`,
-    date: `${"2026-05-16T22:11:51.951Z"}`
+    version: `${"5.0.23"}`,
+    commitHash: `${"ab793d5"}`,
+    date: `${"2026-05-19T13:40:12.965Z"}`
   }
 };
 const CONFIGS = {
@@ -45998,7 +45962,8 @@ const CONFIGS = {
     },
     api: {
       baseUrl: "https://tfr.dev.thefittingroom.xyz",
-      vtoTimeoutMs: 12e4
+      vtoTimeoutMs: 12e4,
+      vtoPrefetchDelayMs: 3e3
     },
     asset: {
       baseUrl: "https://assets.dev.thefittingroom.xyz/shop-sdk/assets/v5"
@@ -46007,7 +45972,7 @@ const CONFIGS = {
       baseUrl: "https://assets.dev.thefittingroom.xyz"
     },
     features: {
-      vtoPrefetch: false
+      vtoPrefetch: true
     },
     ...SHARED_CONFIG
   },
@@ -46026,7 +45991,8 @@ const CONFIGS = {
     },
     api: {
       baseUrl: "https://tfr.p.thefittingroom.xyz",
-      vtoTimeoutMs: 12e4
+      vtoTimeoutMs: 12e4,
+      vtoPrefetchDelayMs: 3e3
     },
     asset: {
       baseUrl: "https://assets.p.thefittingroom.xyz/shop-sdk/assets/v5"
@@ -46035,7 +46001,36 @@ const CONFIGS = {
       baseUrl: "https://assets.p.thefittingroom.xyz"
     },
     features: {
-      vtoPrefetch: false
+      vtoPrefetch: true
+    },
+    ...SHARED_CONFIG
+  },
+  [
+    "demo"
+    /* DEMO */
+  ]: {
+    firebase: {
+      apiKey: "AIzaSyDfjBWzpmzb-mhGN8VSURxzLg6nkzmKUD8",
+      authDomain: "fittingroom-dev-5d248.firebaseapp.com",
+      projectId: "fittingroom-dev-5d248",
+      storageBucket: "fittingroom-dev-5d248.appspot.com",
+      messagingSenderId: "2298664147",
+      appId: "1:2298664147:web:340bda75cd5d25f3997026",
+      measurementId: "G-B7GDQ1Y9LL"
+    },
+    api: {
+      baseUrl: "https://demo.thefittingroom.xyz/api",
+      vtoTimeoutMs: 12e4,
+      vtoPrefetchDelayMs: 3e3
+    },
+    asset: {
+      baseUrl: "http://demo.thefittingroom.xyz/s3/tfr-assets-dev/shop-sdk/assets/v5"
+    },
+    frames: {
+      baseUrl: "http://demo.thefittingroom.xyz/s3/tfr-assets-dev"
+    },
+    features: {
+      vtoPrefetch: true
     },
     ...SHARED_CONFIG
   },
@@ -46053,17 +46048,18 @@ const CONFIGS = {
       measurementId: "G-B7GDQ1Y9LL"
     },
     api: {
-      baseUrl: "https://minecraftbadapple.com/api",
-      vtoTimeoutMs: 12e4
+      baseUrl: "http://localhost:8080",
+      vtoTimeoutMs: 12e4,
+      vtoPrefetchDelayMs: 3e3
     },
     asset: {
-      baseUrl: "http://minecraftbadapple.com/s3/tfr-assets-dev/shop-sdk/assets/v5"
+      baseUrl: "http://localhost:9000/tfr-assets-dev/shop-sdk/assets/v5"
     },
     frames: {
-      baseUrl: "http://minecraftbadapple.com/s3/tfr-assets-dev"
+      baseUrl: "http://localhost:9000/tfr-assets-dev"
     },
     features: {
-      vtoPrefetch: false
+      vtoPrefetch: true
     },
     ...SHARED_CONFIG
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thefittingroom/shop-ui",
-  "version": "5.0.21",
+  "version": "5.0.23",
   "description": "the fitting room UI library",
   "type": "module",
   "main": "./dist/index.js",