@magicx-eng/ai-autocomplete-vanilla 0.38.2 → 0.38.3

package/dist/index.d.mts

@@ -2171,23 +2171,29 @@ interface ScrollArrowArgs {
 declare function attachScrollArrow({ dropdown, grid, button, }: ScrollArrowArgs): ScrollArrowController;
 
 /**
- * Small pictures from Shopify's image CDN, for PNG uploads.
+ * Small pictures from Shopify's image CDN, for PNG and WebP uploads.
  *
  * A Shopify catalog's `image_url` is the original upload, drawn here in a
  * 40px option square or a 116px product card. PNG product photos are the
  * heavy ones: an 830×1080 PNG is 1–2 MB, and picking "Lehengas" on
- * gayathrisarees.com loaded 16.5 MB of them. Shopify resizes on request
- * (`?width=`) and caches every resize at its edge. JPEG uploads are left as
- * they are (tens to a few hundred KB).
+ * gayathrisarees.com loaded 16.5 MB of them. WebP uploads are lighter but
+ * still far more than a tile needs: opening the search on solene.shop loaded
+ * 992 KB of them for six category tiles, 48 KB at `width=120`. Shopify
+ * resizes on request (`?width=`) and caches every resize at its edge. JPEG
+ * uploads are left as they are (tens to a few hundred KB).
  *
  * `format=pjpg` is set too, because some PNG uploads carry megabytes of Adobe
  * XMP metadata that Shopify copies into every resize: one Gayathri Sarees
  * photo came back 1.6 MB at `width=200` as PNG and 4.1 MB as AVIF, while
  * `width=200&format=pjpg` (a progressive JPEG, metadata dropped) was 28 KB.
- * JPEG has no transparency, which product photos don't use.
- *
- * Only Shopify-hosted PNGs are touched — `cdn.shopify.com/s/files/…` and a
- * store's own `/cdn/shop/…`. Any other URL comes back unchanged. The widths are fixed
+ * Shopify keeps a PNG that has an alpha channel as WebP/AVIF instead, so a
+ * transparent cut-out is never flattened. A WebP upload gets `width` alone:
+ * it has no such bloat, and Shopify's own pick (AVIF or WebP) is smaller than
+ * a JPEG (48 KB against 68 KB for Solene's twelve).
+ *
+ * Only Shopify-hosted PNG and WebP files are touched —
+ * `cdn.shopify.com/s/files/…` and a store's own `/cdn/shop/…`. Any other URL
+ * comes back unchanged. The widths are fixed
  * (three times the default drawn size, for 3× phone screens) rather than
  * measured, so every visitor asks for the same URL and hits the same cached
  * resize.
@@ -2197,22 +2203,23 @@ declare const OPTION_IMAGE_WIDTH = 120;
 /** Product-strip cards (116px). */
 declare const PRODUCT_IMAGE_WIDTH = 360;
 /**
- * `url` asked for at `width` with `format=pjpg` when it is a Shopify-hosted PNG;
- * otherwise `url` unchanged. Any `width` or `format` already on the URL is
- * replaced; other parameters (`v=`, the cache-busting version) are kept. A
+ * `url` asked for at `width` when it is a Shopify-hosted PNG (with
+ * `format=pjpg`) or WebP; otherwise `url` unchanged. Any `width` already on
+ * the URL is replaced, and a PNG's `format` too; other parameters (`v=`, the
+ * cache-busting version) are kept. A
  * root-relative URL (a store's own `/cdn/shop/…`) is read against the page and
  * stays relative.
  */
 declare function shopifyImageSrc(url: string, width: number): string;
 /**
  * The URLs a product card tries for `imageUrl`, in order (`imageSources` at
- * the card width): trimmed, sized down when it is a Shopify-hosted PNG, with
+ * the card width): trimmed, sized down when it is a Shopify-hosted PNG or WebP, with
  * the original as the fallback. Empty for an absent or blank URL.
  */
 declare function productImageSources(url: string | null | undefined): string[];
 /**
  * The `src` a product card draws `imageUrl` with first: trimmed, and sized
- * down when it is a Shopify-hosted PNG. `undefined` for an absent or blank URL.
+ * down when it is a Shopify-hosted PNG or WebP. `undefined` for an absent or blank URL.
  */
 declare function productImageSrc(url: string | null | undefined): string | undefined;
 

package/dist/index.d.ts

@@ -2171,23 +2171,29 @@ interface ScrollArrowArgs {
 declare function attachScrollArrow({ dropdown, grid, button, }: ScrollArrowArgs): ScrollArrowController;
 
 /**
- * Small pictures from Shopify's image CDN, for PNG uploads.
+ * Small pictures from Shopify's image CDN, for PNG and WebP uploads.
  *
  * A Shopify catalog's `image_url` is the original upload, drawn here in a
  * 40px option square or a 116px product card. PNG product photos are the
  * heavy ones: an 830×1080 PNG is 1–2 MB, and picking "Lehengas" on
- * gayathrisarees.com loaded 16.5 MB of them. Shopify resizes on request
- * (`?width=`) and caches every resize at its edge. JPEG uploads are left as
- * they are (tens to a few hundred KB).
+ * gayathrisarees.com loaded 16.5 MB of them. WebP uploads are lighter but
+ * still far more than a tile needs: opening the search on solene.shop loaded
+ * 992 KB of them for six category tiles, 48 KB at `width=120`. Shopify
+ * resizes on request (`?width=`) and caches every resize at its edge. JPEG
+ * uploads are left as they are (tens to a few hundred KB).
  *
  * `format=pjpg` is set too, because some PNG uploads carry megabytes of Adobe
  * XMP metadata that Shopify copies into every resize: one Gayathri Sarees
  * photo came back 1.6 MB at `width=200` as PNG and 4.1 MB as AVIF, while
  * `width=200&format=pjpg` (a progressive JPEG, metadata dropped) was 28 KB.
- * JPEG has no transparency, which product photos don't use.
- *
- * Only Shopify-hosted PNGs are touched — `cdn.shopify.com/s/files/…` and a
- * store's own `/cdn/shop/…`. Any other URL comes back unchanged. The widths are fixed
+ * Shopify keeps a PNG that has an alpha channel as WebP/AVIF instead, so a
+ * transparent cut-out is never flattened. A WebP upload gets `width` alone:
+ * it has no such bloat, and Shopify's own pick (AVIF or WebP) is smaller than
+ * a JPEG (48 KB against 68 KB for Solene's twelve).
+ *
+ * Only Shopify-hosted PNG and WebP files are touched —
+ * `cdn.shopify.com/s/files/…` and a store's own `/cdn/shop/…`. Any other URL
+ * comes back unchanged. The widths are fixed
  * (three times the default drawn size, for 3× phone screens) rather than
  * measured, so every visitor asks for the same URL and hits the same cached
  * resize.
@@ -2197,22 +2203,23 @@ declare const OPTION_IMAGE_WIDTH = 120;
 /** Product-strip cards (116px). */
 declare const PRODUCT_IMAGE_WIDTH = 360;
 /**
- * `url` asked for at `width` with `format=pjpg` when it is a Shopify-hosted PNG;
- * otherwise `url` unchanged. Any `width` or `format` already on the URL is
- * replaced; other parameters (`v=`, the cache-busting version) are kept. A
+ * `url` asked for at `width` when it is a Shopify-hosted PNG (with
+ * `format=pjpg`) or WebP; otherwise `url` unchanged. Any `width` already on
+ * the URL is replaced, and a PNG's `format` too; other parameters (`v=`, the
+ * cache-busting version) are kept. A
  * root-relative URL (a store's own `/cdn/shop/…`) is read against the page and
  * stays relative.
  */
 declare function shopifyImageSrc(url: string, width: number): string;
 /**
  * The URLs a product card tries for `imageUrl`, in order (`imageSources` at
- * the card width): trimmed, sized down when it is a Shopify-hosted PNG, with
+ * the card width): trimmed, sized down when it is a Shopify-hosted PNG or WebP, with
  * the original as the fallback. Empty for an absent or blank URL.
  */
 declare function productImageSources(url: string | null | undefined): string[];
 /**
  * The `src` a product card draws `imageUrl` with first: trimmed, and sized
- * down when it is a Shopify-hosted PNG. `undefined` for an absent or blank URL.
+ * down when it is a Shopify-hosted PNG or WebP. `undefined` for an absent or blank URL.
  */
 declare function productImageSrc(url: string | null | undefined): string | undefined;