@jetshop/ui 6.5.6 → 6.5.8-alpha.0

package/CloudflareImage/FlightImage.d.ts

@@ -29,6 +29,14 @@ interface ImageParameters {
      * default of 85 applies — same intent as Akamai's server-side default.
      */
     quality?: number;
+    /**
+     * Cloudflare sharpen amount, 0–10. Omitted = no sharpen filter applied
+     * (CF default). Useful when the source is below the requested ladder rung
+     * and gets upscaled; sharpen restores some perceived crispness lost to the
+     * resampler. Values ≥ 5 produce visible edge halos on detailed photography
+     * — start at 1.
+     */
+    sharpen?: number;
     /** An array of image sizes, will be mapped against breakpoints.
      * @see https://docs.dev.jetshop.se/ui/image#the-sizes-prop
      */

package/CloudflareImage/FlightImage.js

@@ -31,8 +31,8 @@ function Error() {
         } }, t('Image Not Found')));
 }
 function FlightImage(props) {
-    const { gravity, crop, src: originalSrc, sizes: sizesArray = [1], aspect, quality, critical, modifiedDate, error: ErrorComp = Error, focalPointX, focalPointY } = props, rest = __rest(props, ["gravity", "crop", "src", "sizes", "aspect", "quality", "critical", "modifiedDate", "error", "focalPointX", "focalPointY"]);
-    const { theme: { breakpoints }, useMobileImageSizes = false } = useShopConfig();
+    const { gravity, crop, src: originalSrc, sizes: sizesArray = [1], aspect, quality, sharpen, critical, modifiedDate, error: ErrorComp = Error, focalPointX, focalPointY } = props, rest = __rest(props, ["gravity", "crop", "src", "sizes", "aspect", "quality", "sharpen", "critical", "modifiedDate", "error", "focalPointX", "focalPointY"]);
+    const { theme: { breakpoints }, useMobileImageSizes = false, useLowQualityImagePlaceholder = false } = useShopConfig();
     // The baseUrl will change based on the currently-selected channel.
     // We need it to correctly construct the image url
     const { selectedChannel } = React.useContext(ChannelContext);
@@ -46,7 +46,9 @@ function FlightImage(props) {
         sizes: sizesArray,
         aspect,
         quality,
+        sharpen,
         critical,
+        isPlaceholderEnabled: useLowQualityImagePlaceholder,
         modifiedDate,
         breakpoints,
         baseUrl,

package/CloudflareImage/FlightImage.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlightImage.js","sourceRoot":"","sources":["FlightImage.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"FlightImage.js","sourceRoot":"","sources":["FlightImage.tsx"],"names":[],"mappings":"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"}

package/CloudflareImage/FlightImage.test.js

@@ -28,22 +28,37 @@ const transparent =
 
 global.__IN_SERVER__ = false;
 
+// The framework no longer requests a placeholder unless the shop opts in, so the
+// tests that read transform parameters off the placeholder URL ask for one.
+const withPlaceholder = { useLowQualityImagePlaceholder: true };
+
 describe('Hooks image component', () => {
   describe('on initial load', () => {
     beforeAll(() => {
       useInView.mockImplementation(() => [null, false]);
     });
-    it('renders a lqip version of the image by default', () => {
+    it('does not request a lqip by default', () => {
       const { placeholderImage } = setup();
 
       const src = placeholderImage.getAttribute('src');
 
+      expect(src).toEqual(transparent);
+    });
+
+    it('renders a lqip version of the image when the shop opts in', () => {
+      const { placeholderImage } = setup({ shopConfig: withPlaceholder });
+
+      const src = placeholderImage.getAttribute('src');
+
       expect(src).toEqual(expect.stringContaining('sigma=2.5'));
       expect(src).toEqual(expect.stringContaining('minampl=0.5'));
     });
 
     it('sets the lqip to the smallest of the calculated sizes', () => {
-      const { placeholderImage } = setup({ sizes: [0.5, 0.85, 1] });
+      const { placeholderImage } = setup({
+        sizes: [0.5, 0.85, 1],
+        shopConfig: withPlaceholder
+      });
       // Should be 160
       // The smallest breakpoint is 20rem, which is 360px.
       // 0.5 x 360 = 160
@@ -54,7 +69,10 @@ describe('Hooks image component', () => {
     });
 
     it('does not render an lqip if critical is true', () => {
-      const { placeholderImage } = setup({ critical: true });
+      const { placeholderImage } = setup({
+        critical: true,
+        shopConfig: withPlaceholder
+      });
 
       const src = placeholderImage.getAttribute('src');
 
@@ -63,7 +81,10 @@ describe('Hooks image component', () => {
     });
 
     it('accepts sizes as pixel values', () => {
-      const { placeholderImage } = setup({ sizes: [123] });
+      const { placeholderImage } = setup({
+        sizes: [123],
+        shopConfig: withPlaceholder
+      });
 
       const src = placeholderImage.getAttribute('src');
 
@@ -82,7 +103,10 @@ describe('Hooks image component', () => {
       const { placeholderImage } = setup();
     });
     it('to fit if an aspect ratio is provided', () => {
-      const { placeholderImage } = setup({ aspect: '1:1' });
+      const { placeholderImage } = setup({
+        aspect: '1:1',
+        shopConfig: withPlaceholder
+      });
 
       expect(placeholderImage.getAttribute('src')).toEqual(
         expect.stringContaining('&height=320')
@@ -92,7 +116,11 @@ describe('Hooks image component', () => {
       );
     });
     it('to crop if crop prop is true', () => {
-      const { placeholderImage } = setup({ aspect: '1:1', crop: true });
+      const { placeholderImage } = setup({
+        aspect: '1:1',
+        crop: true,
+        shopConfig: withPlaceholder
+      });
 
       expect(placeholderImage.getAttribute('src')).toEqual(
         expect.stringContaining('&method=crop')
@@ -242,6 +270,7 @@ function setup({
   sizes,
   aspect,
   cover,
+  shopConfig,
   ...rest
 } = {}) {
   const channelHandler = new ChannelHandler({
@@ -250,7 +279,7 @@ function setup({
   });
   const utils = render(
     <ChannelProvider channelHandler={channelHandler}>
-      <ConfigProvider config={mockShopConfig}>
+      <ConfigProvider config={{ ...mockShopConfig, ...shopConfig }}>
         <Image
           src={falsySrc ? imageSrc : imageSrc || 'default.png'}
           error={error}

package/CloudflareImage/useConstructImage.d.ts

@@ -15,6 +15,11 @@ interface ImageParameters {
     crop?: boolean;
     gravity?: Gravity;
     quality?: number;
+    /**
+     * Cloudflare sharpen amount, 0–10. Omitted = no sharpen filter applied.
+     * Useful for upscaled-source slots where the resampler softens edges.
+     */
+    sharpen?: number;
     /** An array of image sizes, will be mapped against breakpoints.
      * @see https://docs.dev.jetshop.se/ui/image#the-sizes-prop
      */
@@ -25,6 +30,12 @@ interface ImageParameters {
      */
     aspect?: string;
     critical?: boolean;
+    /**
+     * Whether to request a blurred placeholder to show while the full image
+     * loads. Off by default. The placeholder is a separate transform request per
+     * image, so leaving it on roughly doubles the image requests a page makes.
+     */
+    isPlaceholderEnabled?: boolean;
     modifiedDate?: string;
     breakpoints: Record<string, string>;
     baseUrl: string;
@@ -33,9 +44,10 @@ interface ImageParameters {
 }
 /**
  * Dynamically constructs the query parameters used by ImageMagick to size the image appropriately.
- * Also generates a LQIP using query parameters, to display while the full image loads.
+ * Also generates a LQIP using query parameters, to display while the full image
+ * loads, when the shop has opted into one.
  */
-export declare function useConstructImage({ gravity, crop, src, sizes, aspect, critical, quality, modifiedDate, breakpoints, baseUrl, focalPointX, focalPointY }: ImageParameters): {
+export declare function useConstructImage({ gravity, crop, src, sizes, aspect, critical, isPlaceholderEnabled, quality, sharpen, modifiedDate, breakpoints, baseUrl, focalPointX, focalPointY }: ImageParameters): {
     srcset: string;
     sizes: string;
     sizesMobile: string;

package/CloudflareImage/useConstructImage.js

@@ -8,9 +8,10 @@ import { getSrcSetFromWidths } from './utils/getSrcSetFromWidths';
 import React from 'react';
 /**
  * Dynamically constructs the query parameters used by ImageMagick to size the image appropriately.
- * Also generates a LQIP using query parameters, to display while the full image loads.
+ * Also generates a LQIP using query parameters, to display while the full image
+ * loads, when the shop has opted into one.
  */
-export function useConstructImage({ gravity, crop, src, sizes, aspect, critical, quality, modifiedDate, breakpoints, baseUrl, focalPointX, focalPointY }) {
+export function useConstructImage({ gravity, crop, src, sizes, aspect, critical, isPlaceholderEnabled = false, quality, sharpen, modifiedDate, breakpoints, baseUrl, focalPointX, focalPointY }) {
     // Warn if gravity was provided but crop was not
     useWarningInDev(gravity && !crop, 'You have provided a gravity without setting crop to true. Your image will not be cropped, and the `gravity` prop will do nothing. Please remove the `gravity` prop.');
     // Warn if the src is a falsy value
@@ -64,13 +65,15 @@ export function useConstructImage({ gravity, crop, src, sizes, aspect, critical,
             crop,
             gravity,
             quality,
+            sharpen,
             focalPointX,
             focalPointY
         };
         const srcset = getSrcSetFromWidths(imageSrc, widths, aspect, imageOptions, modifiedDate, baseUrl);
         const srcsetMobile = getSrcSetFromWidths(imageSrc, mobileWidths, aspect, imageOptions, modifiedDate, baseUrl);
-        // If this is a critical image, don't calculate LQIP
-        const lqip = critical
+        // A critical image renders its real source straight away, and every other
+        // image only gets a placeholder if the shop asked for one.
+        const lqip = critical || !isPlaceholderEnabled
             ? null
             : getLQIP(imageSrc, widths, aspect, crop, modifiedDate, baseUrl);
         const sizesMap = getSizesMap(breakpoints, sizes);
@@ -90,8 +93,10 @@ export function useConstructImage({ gravity, crop, src, sizes, aspect, critical,
         hasFalsySrc,
         imageSrc,
         quality,
+        sharpen,
         sizes,
         critical,
+        isPlaceholderEnabled,
         modifiedDate,
         focalPointX,
         focalPointY

package/CloudflareImage/useConstructImage.js.map

@@ -1 +1 @@
-{"version":3,"file":"useConstructImage.js","sourceRoot":"","sources":["useConstructImage.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"useConstructImage.js","sourceRoot":"","sources":["useConstructImage.tsx"],"names":[],"mappings":"AAAA,OAAO,eAAe,MAAM,qCAAqC,CAAC;AAClE,OAAO,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAE,cAAc,EAAE,MAAM,wBAAwB,CAAC;AACxD,OAAO,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,KAAK,MAAM,OAAO,CAAC;AAiD1B;;;;GAIG;AACH,MAAM,UAAU,iBAAiB,CAAC,EAChC,OAAO,EACP,IAAI,EACJ,GAAG,EACH,KAAK,EACL,MAAM,EACN,QAAQ,EACR,oBAAoB,GAAG,KAAK,EAC5B,OAAO,EACP,OAAO,EACP,YAAY,EACZ,WAAW,EACX,OAAO,EACP,WAAW,EACX,WAAW,EACK;IAChB,gDAAgD;IAChD,eAAe,CACb,OAAO,IAAI,CAAC,IAAI,EAChB,qKAAqK,CACtK,CAAC;IACF,mCAAmC;IACnC,eAAe,CACb,CAAC,CAAC,CAAC,GAAG,EACN,sNAAsN,CACvN,CAAC;IAEF;;;;;;;;;;;;;;;;;;MAkBE;IACF,IAAI,WAAW,GAAG,IAAI,CAAC;IACvB,IAAI,QAAQ,GAAG,EAAE,CAAC;IAClB,IAAI,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE;QACtB,oDAAoD;QACpD,WAAW,GAAG,KAAK,CAAC;QACpB,QAAQ,GAAG,UAAU,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE,OAAO,CAAC,CAAC;KACrD;IACD,oCAAoC;IACpC,IAAI,CAAC,CAAC,GAAG,IAAI,OAAO,GAAG,KAAK,QAAQ,EAAE;QACpC,WAAW,GAAG,KAAK,CAAC;QACpB,QAAQ,GAAG,UAAU,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;KACrC;IACD,IAAI,CAAC,CAAC,GAAG,IAAI,OAAO,GAAG,KAAK,QAAQ,IAAK,GAAkB,CAAC,KAAK,EAAE;QACjE,WAAW,GAAG,KAAK,CAAC;QACpB,QAAQ,GAAG,UAAU,CAAE,GAAkB,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC;KAC3D;IACD,yEAAyE;IACzE,6EAA6E;IAC7E,4EAA4E;IAC5E,qEAAqE;IACrE,MAAM,EACJ,QAAQ,EACR,cAAc,EACd,MAAM,EACN,IAAI,EACJ,YAAY,EACb,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE;QACrB,IAAI,WAAW,EAAE;YACf,OAAO,EAAE,CAAC;SACX;QACD,MAAM,MAAM,GAAG,cAAc,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC;QAClD,MAAM,YAAY,GAAG,cAAc,CAAC,WAAW,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC;QAE9D,MAAM,YAAY,GAAG;YACnB,IAAI;YACJ,OAAO;YACP,OAAO;YACP,OAAO;YACP,WAAW;YACX,WAAW;SACZ,CAAC;QAEF,MAAM,MAAM,GAAG,mBAAmB,CAChC,QAAQ,EACR,MAAM,EACN,MAAM,EACN,YAAY,EACZ,YAAY,EACZ,OAAO,CACR,CAAC;QACF,MAAM,YAAY,GAAG,mBAAmB,CACtC,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,YAAY,EACZ,YAAY,EACZ,OAAO,CACR,CAAC;QAEF,0EAA0E;QAC1E,2DAA2D;QAC3D,MAAM,IAAI,GACR,QAAQ,IAAI,CAAC,oBAAoB;YAC/B,CAAC,CAAC,IAAI;YACN,CAAC,CAAC,OAAO,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,YAAY,EAAE,OAAO,CAAC,CAAC;QAErE,MAAM,QAAQ,GAAG,WAAW,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC;QACjD,MAAM,cAAc,GAAG,WAAW,CAAC,WAAW,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC;QAE7D,OAAO;YACL,QAAQ;YACR,cAAc;YACd,MAAM;YACN,IAAI;YACJ,YAAY;SACb,CAAC;IACJ,CAAC,EAAE;QACD,MAAM;QACN,WAAW;QACX,IAAI;QACJ,OAAO;QACP,WAAW;QACX,QAAQ;QACR,OAAO;QACP,OAAO;QACP,KAAK;QACL,QAAQ;QACR,oBAAoB;QACpB,YAAY;QACZ,WAAW;QACX,WAAW;KACZ,CAAC,CAAC;IACH,OAAO;QACL,MAAM;QACN,KAAK,EAAE,QAAQ;QACf,WAAW,EAAE,cAAc;QAC3B,IAAI;QACJ,GAAG,EAAE,QAAQ;QACb,WAAW;QACX,YAAY;KACb,CAAC;AACJ,CAAC"}

package/CloudflareImage/utils/getImageWidths.js

@@ -8,7 +8,7 @@ import { getSizeForBreakpoint } from './getSizeForBreakpoint';
 // on widths that fall just above a rung. Fixed-pixel `sizes` (e.g.
 // sizes={[200]} for a logo) bypass the ladder; their literal pixel intent is
 // preserved.
-const WIDTH_LADDER = [160, 320, 640, 960, 1280, 1600, 1920, 2560];
+const WIDTH_LADDER = [160, 320, 640, 960, 1280, 1600, 1920, 2560, 3840];
 function snapToLadder(width) {
     for (const rung of WIDTH_LADDER) {
         if (width <= rung)

package/CloudflareImage/utils/getImageWidths.js.map

@@ -1 +1 @@
-{"version":3,"file":"getImageWidths.js","sourceRoot":"","sources":["getImageWidths.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAG9D,qEAAqE;AACrE,6EAA6E;AAC7E,6EAA6E;AAC7E,6EAA6E;AAC7E,mEAAmE;AACnE,6EAA6E;AAC7E,aAAa;AACb,MAAM,YAAY,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAU,CAAC;AAE3E,SAAS,YAAY,CAAC,KAAa;IACjC,KAAK,MAAM,IAAI,IAAI,YAAY,EAAE;QAC/B,IAAI,KAAK,IAAI,IAAI;YAAE,OAAO,IAAI,CAAC;KAChC;IACD,OAAO,YAAY,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;AAC/C,CAAC;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,CAC5B,WAAmC,EACnC,KAA2B,EAC3B,MAAM,GAAG,KAAK,EACd,EAAE;IACF,MAAM,GAAG,GAAG,IAAI,GAAG,EAAU,CAAC;IAE9B,MAAM,eAAe,GAAG,MAAM,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC;QACzE,GAAG;QACH,KAAK;KACN,CAAC,CAAC,CAAC;IAEJ,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,eAAe,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QAE/C,MAAM,MAAM,GAAG,oBAAoB,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QAC9C,MAAM,EAAE,GAAG,OAAO,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;QAE7C,MAAM,EAAE,GAAG,aAAa,CAAC,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC;QACxC,MAAM,EAAE,GAAG,aAAa,CAAC,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC;QAExC,uEAAuE;QACvE,uEAAuE;QACvE,oEAAoE;QACpE,MAAM,OAAO,GAAG,MAAM,GAAG,CAAC,CAAC;QAC3B,GAAG,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC,CAAC;QACzC,GAAG,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC,CAAC;QAEzC,IAAI,MAAM,IAAI,eAAe,CAAC,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,EAAE;YAC7C,MAAM;SACP;KACF;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC;AAChC,CAAC,CAAC"}
+{"version":3,"file":"getImageWidths.js","sourceRoot":"","sources":["getImageWidths.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAG9D,qEAAqE;AACrE,6EAA6E;AAC7E,6EAA6E;AAC7E,6EAA6E;AAC7E,mEAAmE;AACnE,6EAA6E;AAC7E,aAAa;AACb,MAAM,YAAY,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,CAAU,CAAC;AAEjF,SAAS,YAAY,CAAC,KAAa;IACjC,KAAK,MAAM,IAAI,IAAI,YAAY,EAAE;QAC/B,IAAI,KAAK,IAAI,IAAI;YAAE,OAAO,IAAI,CAAC;KAChC;IACD,OAAO,YAAY,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;AAC/C,CAAC;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,CAC5B,WAAmC,EACnC,KAA2B,EAC3B,MAAM,GAAG,KAAK,EACd,EAAE;IACF,MAAM,GAAG,GAAG,IAAI,GAAG,EAAU,CAAC;IAE9B,MAAM,eAAe,GAAG,MAAM,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC;QACzE,GAAG;QACH,KAAK;KACN,CAAC,CAAC,CAAC;IAEJ,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,eAAe,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QAE/C,MAAM,MAAM,GAAG,oBAAoB,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;QAC9C,MAAM,EAAE,GAAG,OAAO,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;QAE7C,MAAM,EAAE,GAAG,aAAa,CAAC,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC;QACxC,MAAM,EAAE,GAAG,aAAa,CAAC,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC;QAExC,uEAAuE;QACvE,uEAAuE;QACvE,oEAAoE;QACpE,MAAM,OAAO,GAAG,MAAM,GAAG,CAAC,CAAC;QAC3B,GAAG,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC,CAAC;QACzC,GAAG,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC,CAAC;QAEzC,IAAI,MAAM,IAAI,eAAe,CAAC,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,EAAE;YAC7C,MAAM;SACP;KACF;IAED,OAAO,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC;AAChC,CAAC,CAAC"}

package/CloudflareImage/utils/getSrcSetFromWidths.d.ts

@@ -5,5 +5,7 @@ export interface ImageParamOptions {
     quality?: number;
     focalPointX?: number;
     focalPointY?: number;
+    /** Cloudflare sharpen amount, 0–10. Omitted = no sharpen filter. */
+    sharpen?: number;
 }
 export declare const getSrcSetFromWidths: (src: string, widths: number[], aspect: AspectRatio, options?: ImageParamOptions, modifiedDate?: string, baseUrl?: string) => string;

package/CloudflareImage/utils/getSrcSetFromWidths.js.map

@@ -1 +1 @@
-{"version":3,"file":"getSrcSetFromWidths.js","sourceRoot":"","sources":["getSrcSetFromWidths.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,uBAAuB,EAAE,MAAM,oBAAoB,CAAC;AAU7D,MAAM,CAAC,MAAM,mBAAmB,GAAG,CACjC,GAAW,EACX,MAAgB,EAChB,MAAmB,EACnB,UAA6B,EAAE,IAAI,EAAE,KAAK,EAAE,EAC5C,YAAqB,EACrB,OAAgB,EAChB,EAAE;IACF,MAAM,CAAC,GAAG,EAAE,CAAC;IAEb,KAAK,MAAM,CAAC,IAAI,MAAM,EAAE;QACtB,MAAM,IAAI,GAAG,uBAAuB,CAClC,CAAC,EACD,MAAM,EACN,GAAG,EACH,IAAI,EACJ,OAAO,EACP,YAAY,CACb,CAAC;QACF,CAAC,CAAC,IAAI,CACJ,GAAG,OAAO,kBAAkB,IAAI,IAAI,GAAG,GACrC,YAAY,CAAC,CAAC,CAAC,cAAc,YAAY,EAAE,CAAC,CAAC,CAAC,EAChD,IAAI,CAAC,GAAG,CACT,CAAC;KACH;IAED,OAAO,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AACtB,CAAC,CAAC"}
+{"version":3,"file":"getSrcSetFromWidths.js","sourceRoot":"","sources":["getSrcSetFromWidths.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,uBAAuB,EAAE,MAAM,oBAAoB,CAAC;AAY7D,MAAM,CAAC,MAAM,mBAAmB,GAAG,CACjC,GAAW,EACX,MAAgB,EAChB,MAAmB,EACnB,UAA6B,EAAE,IAAI,EAAE,KAAK,EAAE,EAC5C,YAAqB,EACrB,OAAgB,EAChB,EAAE;IACF,MAAM,CAAC,GAAG,EAAE,CAAC;IAEb,KAAK,MAAM,CAAC,IAAI,MAAM,EAAE;QACtB,MAAM,IAAI,GAAG,uBAAuB,CAClC,CAAC,EACD,MAAM,EACN,GAAG,EACH,IAAI,EACJ,OAAO,EACP,YAAY,CACb,CAAC;QACF,CAAC,CAAC,IAAI,CACJ,GAAG,OAAO,kBAAkB,IAAI,IAAI,GAAG,GACrC,YAAY,CAAC,CAAC,CAAC,cAAc,YAAY,EAAE,CAAC,CAAC,CAAC,EAChD,IAAI,CAAC,GAAG,CACT,CAAC;KACH;IAED,OAAO,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AACtB,CAAC,CAAC"}

package/CloudflareImage/utils/getSrcWithParams.js

@@ -52,6 +52,15 @@ timestamp) {
     if (quality) {
         properties.push(`quality=${quality}`);
     }
+    // Opt-in post-resample sharpening. Useful when the source asset is below the
+    // requested ladder rung and gets upscaled (by CF or the browser); the resample
+    // softens edges, sharpen=N restores some perceived crispness. CF range is
+    // 0–10; sharpen=1 is the lowest non-zero value, ≥ 5 produces visible edge
+    // halos on detailed photography. Omitted by default — explicit opt-in per
+    // call site.
+    if (options.sharpen) {
+        properties.push(`sharpen=${options.sharpen}`);
+    }
     // `format=auto` lets Cloudflare content-negotiate AVIF/WebP/JPEG per the request's
     // Accept header. Counts as one billable transformation regardless of which output
     // format is served (per developers.cloudflare.com/images/pricing). On URL

package/CloudflareImage/utils/getSrcWithParams.js.map

@@ -1 +1 @@
-{"version":3,"file":"getSrcWithParams.js","sourceRoot":"","sources":["getSrcWithParams.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAIhE,uEAAuE;AAEvE,uDAAuD;AACvD,sFAAsF;AACtF,wDAAwD;AACxD,MAAM,WAAW,GAA4B;IAC3C,KAAK,EAAE,KAAK;IACZ,KAAK,EAAE,QAAQ;IACf,IAAI,EAAE,OAAO;IACb,IAAI,EAAE,MAAM;IACZ,MAAM,EAAE,SAAS;IACjB,KAAK,EAAE,MAAM;CACd,CAAC;AAEF,MAAM,UAAU,uBAAuB,CACrC,KAAa,EACb,MAAmB;AACnB,aAAa;AACb,GAAW;AACX,aAAa;AACb,mBAAmB,GAAG,IAAI,EAC1B,UAA6B,EAAE,IAAI,EAAE,KAAK,EAAE;AAC5C,aAAa;AACb,SAAkB;IAElB,4EAA4E;IAC5E,2EAA2E;IAC3E,iEAAiE;IACjE,qEAAqE;IACrE,6DAA6D;IAC7D,MAAM,GAAG,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC;IAC/C,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;IAChC,MAAM,MAAM,GAAG,MAAM;QACnB,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,qBAAqB,CAAC,MAAM,CAAC,CAAC;QACnD,CAAC,CAAC,IAAI,CAAC;IAET,MAAM,UAAU,GAAG,EAAE,CAAC;IAEtB,IAAI,MAAM,EAAE;QACV,UAAU,CAAC,IAAI,CAAC,SAAS,KAAK,WAAW,MAAM,QAAQ,GAAG,EAAE,CAAC,CAAC;KAC/D;SAAM;QACL,UAAU,CAAC,IAAI,CAAC,SAAS,KAAK,QAAQ,GAAG,EAAE,CAAC,CAAC;KAC9C;IAED,kFAAkF;IAClF,iFAAiF;IACjF,gFAAgF;IAChF,4BAA4B;IAC5B,IAAI,MAAM,EAAE;QACV,IAAI,OAAO,CAAC,WAAW,IAAI,OAAO,CAAC,WAAW,EAAE;YAC9C,UAAU,CAAC,IAAI,CACb,WAAW,OAAO,CAAC,WAAW,IAAI,OAAO,CAAC,WAAW,EAAE,CACxD,CAAC;SACH;aAAM,IAAI,OAAO,CAAC,OAAO,EAAE;YAC1B,UAAU,CAAC,IAAI,CAAC,WAAW,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;SAC5D;KACF;IAED,mFAAmF;IACnF,oFAAoF;IACpF,IAAI,OAAO,EAAE;QACX,UAAU,CAAC,IAAI,CAAC,WAAW,OAAO,EAAE,CAAC,CAAC;KACvC;IAED,mFAAmF;IACnF,kFAAkF;IAClF,0EAA0E;IAC1E,gFAAgF;IAChF,8CAA8C;IAC9C,UAAU,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;IAE/B,OAAO,UAAU,CAAC,QAAQ,EAAE,CAAC;AAC/B,CAAC"}
+{"version":3,"file":"getSrcWithParams.js","sourceRoot":"","sources":["getSrcWithParams.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAIhE,uEAAuE;AAEvE,uDAAuD;AACvD,sFAAsF;AACtF,wDAAwD;AACxD,MAAM,WAAW,GAA4B;IAC3C,KAAK,EAAE,KAAK;IACZ,KAAK,EAAE,QAAQ;IACf,IAAI,EAAE,OAAO;IACb,IAAI,EAAE,MAAM;IACZ,MAAM,EAAE,SAAS;IACjB,KAAK,EAAE,MAAM;CACd,CAAC;AAEF,MAAM,UAAU,uBAAuB,CACrC,KAAa,EACb,MAAmB;AACnB,aAAa;AACb,GAAW;AACX,aAAa;AACb,mBAAmB,GAAG,IAAI,EAC1B,UAA6B,EAAE,IAAI,EAAE,KAAK,EAAE;AAC5C,aAAa;AACb,SAAkB;IAElB,4EAA4E;IAC5E,2EAA2E;IAC3E,iEAAiE;IACjE,qEAAqE;IACrE,6DAA6D;IAC7D,MAAM,GAAG,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC;IAC/C,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC;IAChC,MAAM,MAAM,GAAG,MAAM;QACnB,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,qBAAqB,CAAC,MAAM,CAAC,CAAC;QACnD,CAAC,CAAC,IAAI,CAAC;IAET,MAAM,UAAU,GAAG,EAAE,CAAC;IAEtB,IAAI,MAAM,EAAE;QACV,UAAU,CAAC,IAAI,CAAC,SAAS,KAAK,WAAW,MAAM,QAAQ,GAAG,EAAE,CAAC,CAAC;KAC/D;SAAM;QACL,UAAU,CAAC,IAAI,CAAC,SAAS,KAAK,QAAQ,GAAG,EAAE,CAAC,CAAC;KAC9C;IAED,kFAAkF;IAClF,iFAAiF;IACjF,gFAAgF;IAChF,4BAA4B;IAC5B,IAAI,MAAM,EAAE;QACV,IAAI,OAAO,CAAC,WAAW,IAAI,OAAO,CAAC,WAAW,EAAE;YAC9C,UAAU,CAAC,IAAI,CACb,WAAW,OAAO,CAAC,WAAW,IAAI,OAAO,CAAC,WAAW,EAAE,CACxD,CAAC;SACH;aAAM,IAAI,OAAO,CAAC,OAAO,EAAE;YAC1B,UAAU,CAAC,IAAI,CAAC,WAAW,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC,CAAC;SAC5D;KACF;IAED,mFAAmF;IACnF,oFAAoF;IACpF,IAAI,OAAO,EAAE;QACX,UAAU,CAAC,IAAI,CAAC,WAAW,OAAO,EAAE,CAAC,CAAC;KACvC;IAED,6EAA6E;IAC7E,+EAA+E;IAC/E,0EAA0E;IAC1E,0EAA0E;IAC1E,0EAA0E;IAC1E,aAAa;IACb,IAAI,OAAO,CAAC,OAAO,EAAE;QACnB,UAAU,CAAC,IAAI,CAAC,WAAW,OAAO,CAAC,OAAO,EAAE,CAAC,CAAC;KAC/C;IAED,mFAAmF;IACnF,kFAAkF;IAClF,0EAA0E;IAC1E,gFAAgF;IAChF,8CAA8C;IAC9C,UAAU,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;IAE/B,OAAO,UAAU,CAAC,QAAQ,EAAE,CAAC;AAC/B,CAAC"}

package/Image/FlightImage.js

@@ -32,7 +32,7 @@ function Error() {
 }
 function FlightImage(props) {
     const { gravity, crop, src: originalSrc, sizes: sizesArray = [1], aspect, quality, critical, modifiedDate, error: ErrorComp = Error, focalPointX, focalPointY } = props, rest = __rest(props, ["gravity", "crop", "src", "sizes", "aspect", "quality", "critical", "modifiedDate", "error", "focalPointX", "focalPointY"]);
-    const { theme: { breakpoints }, useMobileImageSizes = false } = useShopConfig();
+    const { theme: { breakpoints }, useMobileImageSizes = false, useLowQualityImagePlaceholder = false } = useShopConfig();
     // The baseUrl will change based on the currently-selected channel.
     // We need it to correctly construct the image url
     const { selectedChannel } = React.useContext(ChannelContext);
@@ -47,6 +47,7 @@ function FlightImage(props) {
         aspect,
         quality,
         critical,
+        isPlaceholderEnabled: useLowQualityImagePlaceholder,
         modifiedDate,
         breakpoints,
         baseUrl,

package/Image/FlightImage.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlightImage.js","sourceRoot":"","sources":["FlightImage.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"FlightImage.js","sourceRoot":"","sources":["FlightImage.tsx"],"names":[],"mappings":"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"}

package/Image/FlightImage.test.js

@@ -28,22 +28,37 @@ const transparent =
 
 global.__IN_SERVER__ = false;
 
+// The framework no longer requests a placeholder unless the shop opts in, so the
+// tests that read transform parameters off the placeholder URL ask for one.
+const withPlaceholder = { useLowQualityImagePlaceholder: true };
+
 describe('Hooks image component', () => {
   describe('on initial load', () => {
     beforeAll(() => {
       useInView.mockImplementation(() => [null, false]);
     });
-    it('renders a lqip version of the image by default', () => {
+    it('does not request a lqip by default', () => {
       const { placeholderImage } = setup();
 
       const src = placeholderImage.getAttribute('src');
 
+      expect(src).toEqual(transparent);
+    });
+
+    it('renders a lqip version of the image when the shop opts in', () => {
+      const { placeholderImage } = setup({ shopConfig: withPlaceholder });
+
+      const src = placeholderImage.getAttribute('src');
+
       expect(src).toEqual(expect.stringContaining('sigma=2.5'));
       expect(src).toEqual(expect.stringContaining('minampl=0.5'));
     });
 
     it('sets the lqip to the smallest of the calculated sizes', () => {
-      const { placeholderImage } = setup({ sizes: [0.5, 0.85, 1] });
+      const { placeholderImage } = setup({
+        sizes: [0.5, 0.85, 1],
+        shopConfig: withPlaceholder
+      });
       // Should be 160
       // The smallest breakpoint is 20rem, which is 360px.
       // 0.5 x 360 = 160
@@ -54,7 +69,10 @@ describe('Hooks image component', () => {
     });
 
     it('does not render an lqip if critical is true', () => {
-      const { placeholderImage } = setup({ critical: true });
+      const { placeholderImage } = setup({
+        critical: true,
+        shopConfig: withPlaceholder
+      });
 
       const src = placeholderImage.getAttribute('src');
 
@@ -63,7 +81,10 @@ describe('Hooks image component', () => {
     });
 
     it('accepts sizes as pixel values', () => {
-      const { placeholderImage } = setup({ sizes: [123] });
+      const { placeholderImage } = setup({
+        sizes: [123],
+        shopConfig: withPlaceholder
+      });
 
       const src = placeholderImage.getAttribute('src');
 
@@ -82,7 +103,10 @@ describe('Hooks image component', () => {
       const { placeholderImage } = setup();
     });
     it('to fit if an aspect ratio is provided', () => {
-      const { placeholderImage } = setup({ aspect: '1:1' });
+      const { placeholderImage } = setup({
+        aspect: '1:1',
+        shopConfig: withPlaceholder
+      });
 
       expect(placeholderImage.getAttribute('src')).toEqual(
         expect.stringContaining('&height=320')
@@ -92,7 +116,11 @@ describe('Hooks image component', () => {
       );
     });
     it('to crop if crop prop is true', () => {
-      const { placeholderImage } = setup({ aspect: '1:1', crop: true });
+      const { placeholderImage } = setup({
+        aspect: '1:1',
+        crop: true,
+        shopConfig: withPlaceholder
+      });
 
       expect(placeholderImage.getAttribute('src')).toEqual(
         expect.stringContaining('&method=crop')
@@ -242,6 +270,7 @@ function setup({
   sizes,
   aspect,
   cover,
+  shopConfig,
   ...rest
 } = {}) {
   const channelHandler = new ChannelHandler({
@@ -250,7 +279,7 @@ function setup({
   });
   const utils = render(
     <ChannelProvider channelHandler={channelHandler}>
-      <ConfigProvider config={mockShopConfig}>
+      <ConfigProvider config={{ ...mockShopConfig, ...shopConfig }}>
         <Image
           src={falsySrc ? imageSrc : imageSrc || 'default.png'}
           error={error}

package/Image/useConstructImage.d.ts

@@ -25,6 +25,12 @@ interface ImageParameters {
      */
     aspect?: string;
     critical?: boolean;
+    /**
+     * Whether to request a blurred placeholder to show while the full image
+     * loads. Off by default. The placeholder is a separate transform request per
+     * image, so leaving it on roughly doubles the image requests a page makes.
+     */
+    isPlaceholderEnabled?: boolean;
     modifiedDate?: string;
     breakpoints: Record<string, string>;
     baseUrl: string;
@@ -33,9 +39,10 @@ interface ImageParameters {
 }
 /**
  * Dynamically constructs the query parameters used by ImageMagick to size the image appropriately.
- * Also generates a LQIP using query parameters, to display while the full image loads.
+ * Also generates a LQIP using query parameters, to display while the full image
+ * loads, when the shop has opted into one.
  */
-export declare function useConstructImage({ gravity, crop, src, sizes, aspect, critical, quality, modifiedDate, breakpoints, baseUrl, focalPointX, focalPointY }: ImageParameters): {
+export declare function useConstructImage({ gravity, crop, src, sizes, aspect, critical, isPlaceholderEnabled, quality, modifiedDate, breakpoints, baseUrl, focalPointX, focalPointY }: ImageParameters): {
     srcset: string;
     webpSrcset: string;
     sizes: string;

package/Image/useConstructImage.js

@@ -8,9 +8,10 @@ import { getSrcSetFromWidths } from './utils/getSrcSetFromWidths';
 import React from 'react';
 /**
  * Dynamically constructs the query parameters used by ImageMagick to size the image appropriately.
- * Also generates a LQIP using query parameters, to display while the full image loads.
+ * Also generates a LQIP using query parameters, to display while the full image
+ * loads, when the shop has opted into one.
  */
-export function useConstructImage({ gravity, crop, src, sizes, aspect, critical, quality, modifiedDate, breakpoints, baseUrl, focalPointX, focalPointY }) {
+export function useConstructImage({ gravity, crop, src, sizes, aspect, critical, isPlaceholderEnabled = false, quality, modifiedDate, breakpoints, baseUrl, focalPointX, focalPointY }) {
     // Warn if gravity was provided but crop was not
     useWarningInDev(gravity && !crop, 'You have provided a gravity without setting crop to true. Your image will not be cropped, and the `gravity` prop will do nothing. Please remove the `gravity` prop.');
     // Warn if the src is a falsy value
@@ -78,8 +79,9 @@ export function useConstructImage({ gravity, crop, src, sizes, aspect, critical,
         const webpSrcset = srcSetFromWidths({ webp: true });
         const srcsetMobile = mobileSrcSetFromWidths({ webp: false });
         const webpSrcsetMobile = mobileSrcSetFromWidths({ webp: true });
-        // If this is a critical image, don't calculate LQIP
-        const lqip = critical
+        // A critical image renders its real source straight away, and every other
+        // image only gets a placeholder if the shop asked for one.
+        const lqip = critical || !isPlaceholderEnabled
             ? null
             : getLQIP(imageSrc, widths, aspect, crop, modifiedDate);
         const sizesMap = getSizesMap(breakpoints, sizes);
@@ -103,6 +105,7 @@ export function useConstructImage({ gravity, crop, src, sizes, aspect, critical,
         quality,
         sizes,
         critical,
+        isPlaceholderEnabled,
         modifiedDate,
         focalPointX,
         focalPointY

package/Image/useConstructImage.js.map

@@ -1 +1 @@
-{"version":3,"file":"useConstructImage.js","sourceRoot":"","sources":["useConstructImage.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"useConstructImage.js","sourceRoot":"","sources":["useConstructImage.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jetshop/ui",
-  "version": "6.5.6",
+  "version": "6.5.8-alpha.0+8de2285cd",
   "license": "MIT",
   "files": [
     "**/*.js",
@@ -61,5 +61,5 @@
     "react": "^18",
     "react-dom": "^18"
   },
-  "gitHead": "0592fe3e78bb475030ca79afaa8e071dac85aea1"
+  "gitHead": "8de2285cd5f0d20028bb6e170f4bddee62954ad8"
 }