@hoangyell/gallery 1.1.0 → 1.2.0

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.
Files changed (3) hide show
  1. package/README.md +4 -4
  2. package/package.json +1 -1
  3. package/src/Gallery.astro +2 -2
package/README.md CHANGED
@@ -27,7 +27,7 @@
27
27
  ## Features
28
28
 
29
29
  - **Pyramid layout** — distribute images across rows with `rows` prop
30
- - **Two fit modes** — `cover` (default, uniform photo grid) or `contain` (natural aspect, for diagrams and tall portraits)
30
+ - **Two fit modes** — `contain` (default, natural aspect, for diagrams, code screenshots, and tall portraits) or `cover` (uniform photo grid)
31
31
  - **Lightbox & pinch-to-zoom** — click to open, smooth multi-touch pinch-to-zoom & pan, double-tap zoom, mouse wheel, keyboard navigation (`+`, `-`, `0`, arrows, ESC)
32
32
  - **Corner rounding** — only the four outer corners of each group are rounded
33
33
  - **Hover zoom** — image scales inside its cell without changing layout
@@ -80,7 +80,7 @@ import { Gallery } from "@hoangyell/gallery";
80
80
  | `rows` | `number` | auto (~3 per row) | Number of visual rows |
81
81
  | `orientation` | `"landscape" \| "portrait"` | `"landscape"` | Item aspect ratio hint |
82
82
  | `scale` | `number` | `1` | Gallery width scale (0–1) |
83
- | `fit` | `ObjectFit` | `"cover"` | Default CSS object-fit — see Fit modes below |
83
+ | `fit` | `ObjectFit` | `"contain"` | Default CSS object-fit — see Fit modes below |
84
84
  | `zoom` | `boolean` | `true` | Enable pinch-to-zoom, pan, double-tap, and wheel zoom |
85
85
  | `zoomControls` | `boolean` | `false` | Show visible zoom in / zoom out / reset buttons in lightbox |
86
86
  | `class` | `string` | — | Extra wrapper class |
@@ -92,8 +92,8 @@ container's aspect ratio. Pick the right one for your content:
92
92
 
93
93
  | Mode | What you get | When to use |
94
94
  |---|---|---|
95
- | `"cover"` (default) | Uniform 4:3 grid (1:1 on mobile). Images are cropped to fill. | Photo galleries — travel, products, faces. The Pinterest aesthetic. |
96
- | `"contain"` | Container hugs each image's natural aspect ratio. No cropping. | Diagrams, charts, screenshots, comics, tall portraits. |
95
+ | `"contain"` (default) | Container hugs each image's natural aspect ratio. No cropping. | Diagrams, charts, screenshots, comics, memes, portraits. |
96
+ | `"cover"` | Uniform 4:3 grid (1:1 on mobile). Images are cropped to fill. | Photo galleries — travel, products, faces. The Pinterest aesthetic. |
97
97
 
98
98
  Set it at the gallery level:
99
99
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hoangyell/gallery",
3
- "version": "1.1.0",
3
+ "version": "1.2.0",
4
4
  "description": "Astro image gallery with lightbox, pyramid multi-row layout, and accessible controls.",
5
5
  "license": "MIT",
6
6
  "type": "module",
package/src/Gallery.astro CHANGED
@@ -27,7 +27,7 @@ export interface Props {
27
27
  orientation?: "landscape" | "portrait";
28
28
  /** Scale factor to reduce gallery width (1 = full). */
29
29
  scale?: number;
30
- /** Global object-fit for all items unless overridden per-item. */
30
+ /** Global object-fit for all items unless overridden per-item. Defaults to "contain". */
31
31
  fit?: ObjectFit;
32
32
  /** Enable zoom gestures (pinch, double-tap, pan, wheel) in lightbox. Defaults to true. */
33
33
  zoom?: boolean;
@@ -40,7 +40,7 @@ const {
40
40
  rows,
41
41
  orientation = "landscape",
42
42
  scale = 1,
43
- fit = "cover",
43
+ fit = "contain",
44
44
  zoom = true,
45
45
  zoomControls = false,
46
46
  } = Astro.props;