Image Card

v0.2.0
Draft

A card with an image on top and a title, subtitle and meta row below, for artwork lists, artist tiles and booking previews. It composes `atoms.card` with no padding, so fill, border and corners are Card's.

pnpm add @behivetech/molecules.image-card

You are viewing Image Card v0.2.0, snapshotted 2026-11-09. The latest is v0.2.2. Go to the latest →

Changelog up to v0.2.0

v0.2.0

Minor Changes

  • 48c9e6b: Use the shared hooks.use-image-status, extract the media box as an inner BHT__ImageCardMedia block, switch the Grid Row example to repeat(auto-fill, minmax(10.5rem, 1fr)) and document that a wrapper or <picture> as media needs a key on the card.

    Class names changed, which breaks any app CSS that targets them:

    • BHT__ImageCard__media is now BHT__ImageCardMedia
    • BHT__ImageCard__fallback is now BHT__ImageCardMedia__fallback
    • BHT__ImageCard--aspect-* is now BHT__ImageCardMedia--aspect-*

Patch Changes

  • Updated dependencies [48c9e6b]
    • @behivetech/hooks.use-image-status@0.1.0

v0.1.2

Patch Changes

  • Updated dependencies [00e81c9]
  • Updated dependencies [6534e7a]
    • @behivetech/atoms.card@0.6.0
    • @behivetech/atoms.icon@0.3.8

v0.1.1

Patch Changes

  • Updated dependencies [5593d1c]
  • Updated dependencies [0e4857f]
    • @behivetech/atoms.card@0.5.0
    • @behivetech/atoms.icon@0.3.7

v0.1.0

Minor Changes

  • 057cd6c: New molecules.image-card: a media slot over an atoms.card body with title, subtitle and meta, an optional single link named by the title (href and linkComponent), aspectRatio of 4/5, 1/1 or 3/2, and an image icon fallback when the image fails to load.