@jsenv/navi 0.29.446 → 0.29.447

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.
@@ -95716,6 +95716,12 @@ const DEFAULT_PLACEHOLDER_LIGHT = "#d4d8dd";
95716
95716
  const DEFAULT_PLACEHOLDER_DARK = "#374151";
95717
95717
 
95718
95718
  /**
95719
+ * The props may come in any order: `src` and `srcset` reach the element after
95720
+ * `loading` and the other hints. A plain `<img>` (or `<Box as="img">`) written
95721
+ * in JSX must put `loading` before `src`: WebKit, so every browser on iOS,
95722
+ * decides whether to load when `src` is set, and an image whose `src` came
95723
+ * first loads, lazy or not.
95724
+ *
95719
95725
  * @param {string|false} [props.placeholderColor] - Background color shown while the image loads.
95720
95726
  * Defaults to a light gray. Pass `false` to disable.
95721
95727
  * @param {boolean} [props.placeholderDark] - Use a dark default placeholder color,
@@ -95725,6 +95731,9 @@ const DEFAULT_PLACEHOLDER_DARK = "#374151";
95725
95731
  const Image = ({
95726
95732
  placeholderColor,
95727
95733
  placeholderDark = false,
95734
+ srcset,
95735
+ srcSet,
95736
+ src,
95728
95737
  ...rest
95729
95738
  }) => {
95730
95739
  import.meta.css = [css$5, "@jsenv/navi/src/graphic/image.jsx"];
@@ -95749,6 +95758,13 @@ const Image = ({
95749
95758
  imageEl.setAttribute("navi-loaded", "");
95750
95759
  rest.onLoad?.(e);
95751
95760
  }
95761
+ // Last, srcset before src: an <img> decides its request when they are
95762
+ // set, with the attributes it has at that moment. WebKit loads an image
95763
+ // whose src arrives before loading="lazy", and does not take it back.
95764
+ ,
95765
+ srcset: srcset,
95766
+ srcSet: srcSet,
95767
+ src: src
95752
95768
  });
95753
95769
  };
95754
95770