@snowcone-app/ui 0.4.9 → 0.4.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +7 -0
- package/dist/index.cjs +335 -95
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +33 -1
- package/dist/index.d.ts +33 -1
- package/dist/index.js +335 -95
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
- package/src/composed/HeroProductImage.tsx +39 -25
- package/src/composed/carousels/MobileProductCarousel.tsx +38 -0
- package/src/patterns/RealtimeProvider.tsx +341 -82
- package/src/patterns/__tests__/RealtimeProvider.cropDelivery.test.tsx +240 -0
- package/src/patterns/__tests__/croppedFrameComposite.test.ts +56 -0
- package/src/patterns/croppedFrameComposite.ts +122 -0
package/dist/index.d.cts
CHANGED
|
@@ -3030,13 +3030,25 @@ interface RealtimeProviderProps {
|
|
|
3030
3030
|
* via a renewable token. Without them, the legacy seal path runs (shim).
|
|
3031
3031
|
*/
|
|
3032
3032
|
grantUrl?: string;
|
|
3033
|
+
/**
|
|
3034
|
+
* Frame delivery strategy. `"cropped"` (default, the fast path): once every
|
|
3035
|
+
* configured mockup has rendered one full frame (frozen internally as its
|
|
3036
|
+
* background), the session flips to `overlayCrop: 'auto'` — the server ships
|
|
3037
|
+
* only the product-region pixels per edit and the provider composites them
|
|
3038
|
+
* over the frozen background before notifying consumers, so subscribers and
|
|
3039
|
+
* the URL cache only ever see full-frame images. Opt out with
|
|
3040
|
+
* `"full-frame"` to ship the whole scene on every render (the pre-crop
|
|
3041
|
+
* behavior). Any composite failure falls back to full-frame delivery for
|
|
3042
|
+
* the rest of the session automatically.
|
|
3043
|
+
*/
|
|
3044
|
+
delivery?: "cropped" | "full-frame";
|
|
3033
3045
|
}
|
|
3034
3046
|
/**
|
|
3035
3047
|
* RealtimeProvider - Manages realtime mockup WebSocket connection
|
|
3036
3048
|
*
|
|
3037
3049
|
* Must be used inside a <Product> provider to access product data.
|
|
3038
3050
|
*/
|
|
3039
|
-
declare function RealtimeProvider({ children, wsUrl, mockupWidth, autoEnable, shop, grantUrl, }: RealtimeProviderProps): react_jsx_runtime.JSX.Element;
|
|
3051
|
+
declare function RealtimeProvider({ children, wsUrl, mockupWidth, autoEnable, shop, grantUrl, delivery, }: RealtimeProviderProps): react_jsx_runtime.JSX.Element;
|
|
3040
3052
|
/**
|
|
3041
3053
|
* Hook to access realtime context
|
|
3042
3054
|
* Throws if not inside RealtimeProvider
|
|
@@ -4243,6 +4255,13 @@ interface HeroProductImageProps {
|
|
|
4243
4255
|
shimmerDelay?: number;
|
|
4244
4256
|
shimmerFadeDuration?: number;
|
|
4245
4257
|
darkShimmerFadeInDuration?: number;
|
|
4258
|
+
/** Label shown when no artwork is applied. Host apps pass a localized
|
|
4259
|
+
* string (this package stays i18n-framework-free). */
|
|
4260
|
+
emptyText?: string;
|
|
4261
|
+
/** Label shown when mockup generation fails. */
|
|
4262
|
+
errorText?: string;
|
|
4263
|
+
/** Label shown when the image fails to load with no stale image to keep. */
|
|
4264
|
+
unavailableText?: string;
|
|
4246
4265
|
}
|
|
4247
4266
|
/**
|
|
4248
4267
|
* Hero-compatible version of ProductImage that renders as a simple img element
|
|
@@ -4664,6 +4683,19 @@ interface MobileProductCarouselProps {
|
|
|
4664
4683
|
* provider's mockup cache themselves.
|
|
4665
4684
|
*/
|
|
4666
4685
|
onMockupUrlGenerated?: (mockupId: string, url: string) => void;
|
|
4686
|
+
/**
|
|
4687
|
+
* Per-image action overlay, floated top-right of the slide (e.g. the
|
|
4688
|
+
* draft preview's Pass button). Return null for images without actions.
|
|
4689
|
+
* Taps on the action stop propagating so they don't trigger the
|
|
4690
|
+
* carousel's tap-to-zoom or swipe handling.
|
|
4691
|
+
*/
|
|
4692
|
+
renderImageAction?: (image: CarouselImage, index: number) => React__default.ReactNode;
|
|
4693
|
+
/** Passed through to HeroProductImage — label when mockup generation
|
|
4694
|
+
* fails. Host apps pass a localized string. */
|
|
4695
|
+
errorText?: string;
|
|
4696
|
+
/** Passed through to HeroProductImage — label when the image fails to
|
|
4697
|
+
* load with no stale image to keep. */
|
|
4698
|
+
unavailableText?: string;
|
|
4667
4699
|
}
|
|
4668
4700
|
/**
|
|
4669
4701
|
* MobileProductCarousel - Memoized for performance
|
package/dist/index.d.ts
CHANGED
|
@@ -3030,13 +3030,25 @@ interface RealtimeProviderProps {
|
|
|
3030
3030
|
* via a renewable token. Without them, the legacy seal path runs (shim).
|
|
3031
3031
|
*/
|
|
3032
3032
|
grantUrl?: string;
|
|
3033
|
+
/**
|
|
3034
|
+
* Frame delivery strategy. `"cropped"` (default, the fast path): once every
|
|
3035
|
+
* configured mockup has rendered one full frame (frozen internally as its
|
|
3036
|
+
* background), the session flips to `overlayCrop: 'auto'` — the server ships
|
|
3037
|
+
* only the product-region pixels per edit and the provider composites them
|
|
3038
|
+
* over the frozen background before notifying consumers, so subscribers and
|
|
3039
|
+
* the URL cache only ever see full-frame images. Opt out with
|
|
3040
|
+
* `"full-frame"` to ship the whole scene on every render (the pre-crop
|
|
3041
|
+
* behavior). Any composite failure falls back to full-frame delivery for
|
|
3042
|
+
* the rest of the session automatically.
|
|
3043
|
+
*/
|
|
3044
|
+
delivery?: "cropped" | "full-frame";
|
|
3033
3045
|
}
|
|
3034
3046
|
/**
|
|
3035
3047
|
* RealtimeProvider - Manages realtime mockup WebSocket connection
|
|
3036
3048
|
*
|
|
3037
3049
|
* Must be used inside a <Product> provider to access product data.
|
|
3038
3050
|
*/
|
|
3039
|
-
declare function RealtimeProvider({ children, wsUrl, mockupWidth, autoEnable, shop, grantUrl, }: RealtimeProviderProps): react_jsx_runtime.JSX.Element;
|
|
3051
|
+
declare function RealtimeProvider({ children, wsUrl, mockupWidth, autoEnable, shop, grantUrl, delivery, }: RealtimeProviderProps): react_jsx_runtime.JSX.Element;
|
|
3040
3052
|
/**
|
|
3041
3053
|
* Hook to access realtime context
|
|
3042
3054
|
* Throws if not inside RealtimeProvider
|
|
@@ -4243,6 +4255,13 @@ interface HeroProductImageProps {
|
|
|
4243
4255
|
shimmerDelay?: number;
|
|
4244
4256
|
shimmerFadeDuration?: number;
|
|
4245
4257
|
darkShimmerFadeInDuration?: number;
|
|
4258
|
+
/** Label shown when no artwork is applied. Host apps pass a localized
|
|
4259
|
+
* string (this package stays i18n-framework-free). */
|
|
4260
|
+
emptyText?: string;
|
|
4261
|
+
/** Label shown when mockup generation fails. */
|
|
4262
|
+
errorText?: string;
|
|
4263
|
+
/** Label shown when the image fails to load with no stale image to keep. */
|
|
4264
|
+
unavailableText?: string;
|
|
4246
4265
|
}
|
|
4247
4266
|
/**
|
|
4248
4267
|
* Hero-compatible version of ProductImage that renders as a simple img element
|
|
@@ -4664,6 +4683,19 @@ interface MobileProductCarouselProps {
|
|
|
4664
4683
|
* provider's mockup cache themselves.
|
|
4665
4684
|
*/
|
|
4666
4685
|
onMockupUrlGenerated?: (mockupId: string, url: string) => void;
|
|
4686
|
+
/**
|
|
4687
|
+
* Per-image action overlay, floated top-right of the slide (e.g. the
|
|
4688
|
+
* draft preview's Pass button). Return null for images without actions.
|
|
4689
|
+
* Taps on the action stop propagating so they don't trigger the
|
|
4690
|
+
* carousel's tap-to-zoom or swipe handling.
|
|
4691
|
+
*/
|
|
4692
|
+
renderImageAction?: (image: CarouselImage, index: number) => React__default.ReactNode;
|
|
4693
|
+
/** Passed through to HeroProductImage — label when mockup generation
|
|
4694
|
+
* fails. Host apps pass a localized string. */
|
|
4695
|
+
errorText?: string;
|
|
4696
|
+
/** Passed through to HeroProductImage — label when the image fails to
|
|
4697
|
+
* load with no stale image to keep. */
|
|
4698
|
+
unavailableText?: string;
|
|
4667
4699
|
}
|
|
4668
4700
|
/**
|
|
4669
4701
|
* MobileProductCarousel - Memoized for performance
|