@snowcone-app/ui 0.9.0 → 0.9.2

package/dist/index.d.cts

@@ -1510,7 +1510,7 @@ interface UseProductGalleryReturn {
  * ```tsx
  * // Fetch specific products
  * const { products, loading, error, refetch } = useProductGallery(
- *   ['BEEB77', 'AR2P3G'],
+ *   ['BC43BE', 'CAXHQC'],
  *   { endpoint: 'http://localhost:3000', mode: 'mock' }
  * );
  *
@@ -1599,7 +1599,7 @@ interface ProductGalleryProps extends UseProductGalleryOptions {
  * 2. List all products: Pass empty array or omit productIds
  *
  * @example Specific products
- * <ProductGallery productIds={["BEEB77", "AR2P3G", "KMYKUK"]}>
+ * <ProductGallery productIds={["BC43BE", "CAXHQC", "XTNA6J"]}>
  *   {(products, loading, error) => (
  *     <div className="grid grid-cols-3 gap-4">
  *       {products.map(product => (
@@ -1917,7 +1917,7 @@ interface CurrentSelectionDisplayProps {
  * ```tsx
  * import { Product, ProductOptions, CurrentSelectionDisplay } from '@yourorg/ui-react';
  *
- * <Product productId="BEEB77">
+ * <Product productId="BC43BE">
  *   <ProductOptions />
  *   <CurrentSelectionDisplay />
  * </Product>
@@ -2227,7 +2227,7 @@ interface ColorPickerProps {
  * ```tsx
  * import { Product, ColorPicker } from '@snowcone-app/ui';
  *
- * <Product productId="AR2P3G">
+ * <Product productId="CAXHQC">
  *   <ColorPicker placement="Crown" defaultColor="#ff0000" />
  * </Product>
  * ```
@@ -4265,7 +4265,7 @@ type ArtworkCustomizerProps = {
  * // CORRECT: Use with ArtSelector to manage artwork via context
  * import { Product, ArtSelector, ArtworkCustomizer } from '@snowcone-app/ui';
  *
- * <Product productId="BEEB77">
+ * <Product productId="BC43BE">
  *   <ArtSelector artworks={[
  *     { type: 'regular', src: 'https://example.com/photo.jpg' },
  *     { type: 'pattern', src: 'https://example.com/pattern.jpg', tileCount: 1 }
@@ -4279,7 +4279,7 @@ type ArtworkCustomizerProps = {
  * // CORRECT: Full example with ProductImage
  * import { Product, ProductImage, ArtSelector, ArtworkCustomizer } from '@snowcone-app/ui';
  *
- * <Product productId="BEEB77">
+ * <Product productId="BC43BE">
  *   <div className="grid grid-cols-2 gap-8">
  *     <ProductImage />
  *     <div>

package/dist/index.d.ts

@@ -1510,7 +1510,7 @@ interface UseProductGalleryReturn {
  * ```tsx
  * // Fetch specific products
  * const { products, loading, error, refetch } = useProductGallery(
- *   ['BEEB77', 'AR2P3G'],
+ *   ['BC43BE', 'CAXHQC'],
  *   { endpoint: 'http://localhost:3000', mode: 'mock' }
  * );
  *
@@ -1599,7 +1599,7 @@ interface ProductGalleryProps extends UseProductGalleryOptions {
  * 2. List all products: Pass empty array or omit productIds
  *
  * @example Specific products
- * <ProductGallery productIds={["BEEB77", "AR2P3G", "KMYKUK"]}>
+ * <ProductGallery productIds={["BC43BE", "CAXHQC", "XTNA6J"]}>
  *   {(products, loading, error) => (
  *     <div className="grid grid-cols-3 gap-4">
  *       {products.map(product => (
@@ -1917,7 +1917,7 @@ interface CurrentSelectionDisplayProps {
  * ```tsx
  * import { Product, ProductOptions, CurrentSelectionDisplay } from '@yourorg/ui-react';
  *
- * <Product productId="BEEB77">
+ * <Product productId="BC43BE">
  *   <ProductOptions />
  *   <CurrentSelectionDisplay />
  * </Product>
@@ -2227,7 +2227,7 @@ interface ColorPickerProps {
  * ```tsx
  * import { Product, ColorPicker } from '@snowcone-app/ui';
  *
- * <Product productId="AR2P3G">
+ * <Product productId="CAXHQC">
  *   <ColorPicker placement="Crown" defaultColor="#ff0000" />
  * </Product>
  * ```
@@ -4265,7 +4265,7 @@ type ArtworkCustomizerProps = {
  * // CORRECT: Use with ArtSelector to manage artwork via context
  * import { Product, ArtSelector, ArtworkCustomizer } from '@snowcone-app/ui';
  *
- * <Product productId="BEEB77">
+ * <Product productId="BC43BE">
  *   <ArtSelector artworks={[
  *     { type: 'regular', src: 'https://example.com/photo.jpg' },
  *     { type: 'pattern', src: 'https://example.com/pattern.jpg', tileCount: 1 }
@@ -4279,7 +4279,7 @@ type ArtworkCustomizerProps = {
  * // CORRECT: Full example with ProductImage
  * import { Product, ProductImage, ArtSelector, ArtworkCustomizer } from '@snowcone-app/ui';
  *
- * <Product productId="BEEB77">
+ * <Product productId="BC43BE">
  *   <div className="grid grid-cols-2 gap-8">
  *     <ProductImage />
  *     <div>

package/dist/index.js

@@ -5625,7 +5625,7 @@ import {
   useMemo as useMemo7
 } from "react";
 import { useRealtimeMockup as useRealtimeMockup2 } from "@snowcone-app/sdk/react";
-import { resolveVariantId as resolveVariantIdUtil } from "@snowcone-app/sdk";
+import { resolvePreviewVariantId, resolveVariantId as resolveVariantIdUtil } from "@snowcone-app/sdk";
 
 // src/patterns/MockupBackground.tsx
 import { createContext as createContext7, useContext as useContext5 } from "react";
@@ -6150,10 +6150,9 @@ function RealtimeProvider({
     const product = productContext.product;
     const productId = product.id;
     const placements = product.placements || [];
-    const variantId = resolveVariantIdUtil(
+    const variantId = resolvePreviewVariantId(
       productContext,
-      void 0,
-      void 0
+      resolveVariantIdUtil(productContext, void 0, void 0)
     );
     const isFirstSend = !configSentRef.current;
     const variantChanged = lastSentVariantIdRef.current !== null && lastSentVariantIdRef.current !== variantId;
@@ -10054,6 +10053,7 @@ import {
   createDesignForPlacements,
   getMockupUrl,
   resolveVariantId,
+  resolvePreviewVariantId as resolvePreviewVariantId2,
   resolveMockupId
 } from "@snowcone-app/sdk";
 
@@ -10174,12 +10174,15 @@ var HeroProductImage = memo3(function HeroProductImage2({
   const contextRef = useRef23(context);
   contextRef.current = context;
   const actualProductId = product?.id || productId || context?.product?.id;
-  const actualGvid = useMemo14(() => {
+  const selectedGvid = useMemo14(() => {
     return resolveVariantId(context, gvid, variantId);
   }, [gvid, variantId, context?.selection, context?.combinations]);
   const actualMockupId = useMemo14(() => {
-    return resolveMockupId(context, actualGvid, mockupId);
-  }, [mockupId, actualGvid, context]);
+    return resolveMockupId(context, selectedGvid, mockupId);
+  }, [mockupId, selectedGvid, context]);
+  const actualGvid = useMemo14(() => {
+    return gvid || variantId ? selectedGvid : resolvePreviewVariantId2(context, selectedGvid, actualMockupId);
+  }, [gvid, variantId, selectedGvid, actualMockupId, context]);
   const unavailable = actualMockupId ? realtimeContext?.unavailableMockups?.get(actualMockupId) ?? null : null;
   const artworkSrc = artwork?.src;
   const selectedArtworkSrc = designContext?.selectedArtwork?.src;