Skip to content

v0.4.2

Choose a tag to compare

@chad-hill chad-hill released this 25 Jun 01:09
· 15 commits to main since this release

A small feature release: <ResponsiveImage> (in @pro-laico/images) gains a fill mode so it can cover a height-driven container instead of only acting as an aspect-ratio box.

Added

  • @pro-laico/images: a fill mode for <ResponsiveImage>. Pass fill to cover a height-driven parent: the wrapper becomes position:absolute; inset:0; size:100% and the inner <img> renders object-fit:<fit> with no aspect-ratio, while still painting the built-in LQIP blur placeholder and fade. This replaces the bespoke <img className="absolute inset-0 size-full object-cover"> pattern used for full-bleed heroes, carousel slides, and detail panels — which bypassed the component's blur/fade/srcset wiring. aspectRatio is ignored in fill mode (the image is served at its natural ratio and CSS object-fit covers the box); the parent must establish a positioning context and its own height.
<div className="relative h-screen">
  <ResponsiveImage image={image} fill sizes="100vw" />
</div>

Upgrade notes

  • Drop-in. Run pnpm install to pick up 0.4.2 across the @pro-laico/* packages (lockstep versioning); no API changes — fill is opt-in and defaults to false.

Full changelog: v0.4.1...v0.4.2