@planetaexo/design-system 0.94.0 → 0.95.0

package/dist/index.d.cts

@@ -3174,7 +3174,18 @@ declare function MenuTrip({ sections, activeSection, onSelect, variant, bold, cl
 
 type PhotoGalleryVariant = "grid" | "gridCompact" | "masonry" | "filmstrip" | "featured" | "collage" | "collageTight" | "carousel" | "fullBleed";
 interface PhotoGalleryPhoto {
+    /**
+     * Full-resolution image — shown in the lightbox / opened photo tour, and the
+     * fallback the grid thumbnails use when {@link thumbSrc} is omitted.
+     */
     src: string;
+    /**
+     * Optional smaller image for the grid thumbnails (grid/gridCompact/masonry/
+     * filmstrip/featured/collage tiles). Lets a consumer serve a lightweight,
+     * resized variant in the gallery grid while the lightbox still opens the
+     * full-resolution {@link src}. Falls back to {@link src} when omitted.
+     */
+    thumbSrc?: string;
     alt?: string;
     /** Caption displayed in the lightbox bottom-left */
     caption?: string;

package/dist/index.d.ts

@@ -3174,7 +3174,18 @@ declare function MenuTrip({ sections, activeSection, onSelect, variant, bold, cl
 
 type PhotoGalleryVariant = "grid" | "gridCompact" | "masonry" | "filmstrip" | "featured" | "collage" | "collageTight" | "carousel" | "fullBleed";
 interface PhotoGalleryPhoto {
+    /**
+     * Full-resolution image — shown in the lightbox / opened photo tour, and the
+     * fallback the grid thumbnails use when {@link thumbSrc} is omitted.
+     */
     src: string;
+    /**
+     * Optional smaller image for the grid thumbnails (grid/gridCompact/masonry/
+     * filmstrip/featured/collage tiles). Lets a consumer serve a lightweight,
+     * resized variant in the gallery grid while the lightbox still opens the
+     * full-resolution {@link src}. Falls back to {@link src} when omitted.
+     */
+    thumbSrc?: string;
     alt?: string;
     /** Caption displayed in the lightbox bottom-left */
     caption?: string;

package/dist/index.js

@@ -12541,7 +12541,7 @@ function PhotoTile({
   onClick,
   showCredit = false
 }) {
-  var _a, _b;
+  var _a, _b, _c;
   return /* @__PURE__ */ jsxs(
     "button",
     {
@@ -12556,8 +12556,8 @@ function PhotoTile({
         /* @__PURE__ */ jsx(
           Picture,
           {
-            src: photo.src,
-            alt: (_b = photo.alt) != null ? _b : `Photo ${index + 1}`,
+            src: (_b = photo.thumbSrc) != null ? _b : photo.src,
+            alt: (_c = photo.alt) != null ? _c : `Photo ${index + 1}`,
             title: photo.caption,
             className: "w-full h-full object-cover transition-transform duration-700 group-hover:scale-105",
             loading: "lazy"
@@ -12674,7 +12674,7 @@ function MasonryGallery({
   const visible = expanded || !hasMore ? photos : photos.slice(0, initialVisible);
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx("div", { className: "columns-2 sm:columns-3 gap-1 [&>*]:break-inside-avoid [&>*]:mb-1", children: visible.map((p, i) => {
-      var _a, _b;
+      var _a, _b, _c;
       return /* @__PURE__ */ jsxs(
         "button",
         {
@@ -12686,8 +12686,8 @@ function MasonryGallery({
             /* @__PURE__ */ jsx(
               Picture,
               {
-                src: p.src,
-                alt: (_b = p.alt) != null ? _b : `Photo ${i + 1}`,
+                src: (_b = p.thumbSrc) != null ? _b : p.src,
+                alt: (_c = p.alt) != null ? _c : `Photo ${i + 1}`,
                 title: p.caption,
                 className: "w-full h-auto object-cover transition-transform duration-700 group-hover:scale-105",
                 loading: "lazy"
@@ -12715,7 +12715,7 @@ function FilmstripGallery({
   onOpen
 }) {
   return /* @__PURE__ */ jsx("div", { className: "overflow-x-auto flex gap-1 snap-x snap-mandatory pb-1 scrollbar-none", children: photos.map((p, i) => {
-    var _a, _b;
+    var _a, _b, _c;
     return /* @__PURE__ */ jsxs(
       "button",
       {
@@ -12727,8 +12727,8 @@ function FilmstripGallery({
           /* @__PURE__ */ jsx(
             Picture,
             {
-              src: p.src,
-              alt: (_b = p.alt) != null ? _b : `Photo ${i + 1}`,
+              src: (_b = p.thumbSrc) != null ? _b : p.src,
+              alt: (_c = p.alt) != null ? _c : `Photo ${i + 1}`,
               title: p.caption,
               className: "h-full w-full object-cover transition-transform duration-700 group-hover:scale-105",
               loading: "lazy"
@@ -12782,7 +12782,7 @@ function FeaturedGallery({
       ] })
     ] }),
     expanded && extra.length > 0 && /* @__PURE__ */ jsx("div", { className: "mt-1.5 overflow-x-auto flex gap-1.5 snap-x snap-mandatory scrollbar-none rounded-xl overflow-hidden pb-0", children: extra.map((p, i) => {
-      var _a, _b;
+      var _a, _b, _c;
       return /* @__PURE__ */ jsxs(
         "button",
         {
@@ -12794,8 +12794,8 @@ function FeaturedGallery({
             /* @__PURE__ */ jsx(
               Picture,
               {
-                src: p.src,
-                alt: (_b = p.alt) != null ? _b : `Photo ${i + 4}`,
+                src: (_b = p.thumbSrc) != null ? _b : p.src,
+                alt: (_c = p.alt) != null ? _c : `Photo ${i + 4}`,
                 title: p.caption,
                 className: "h-full w-full object-cover transition-transform duration-700 group-hover:scale-105",
                 loading: "lazy"