@chinggis.systems/collection-ui 1.0.1 → 1.0.3

package/dist/primitives/CollectionCarousel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CollectionCarousel.d.ts","sourceRoot":"","sources":["../../src/primitives/CollectionCarousel.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAEpD,MAAM,MAAM,uBAAuB,GAAG,mBAAmB,CAAC;AAE1D,wBAAgB,kBAAkB,CAAC,EACjC,EAAE,EACF,MAAM,EACN,SAAS,EACT,cAAc,EACd,aAAa,EACb,SAAS,EACT,YAAY,EACZ,MAAM,EACN,cAAc,EACd,IAAI,EACJ,aAAa,EACb,kBAAkB,EAClB,YAAY,EACZ,WAAW,GACZ,EAAE,uBAAuB,2CAqEzB"}
+{"version":3,"file":"CollectionCarousel.d.ts","sourceRoot":"","sources":["../../src/primitives/CollectionCarousel.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAC;AAEpD,MAAM,MAAM,uBAAuB,GAAG,mBAAmB,CAAC;AAE1D,wBAAgB,kBAAkB,CAAC,EACjC,EAAE,EACF,MAAM,EACN,SAAS,EACT,cAAc,EACd,aAAa,EACb,SAAS,EACT,YAAY,EACZ,MAAM,EACN,cAAc,EACd,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,aAAa,EACb,kBAAkB,EAClB,YAAY,EACZ,SAAS,EACT,WAAW,GACZ,EAAE,uBAAuB,2CA2EzB"}

package/dist/primitives/CollectionCarousel.js

@@ -1,15 +1,17 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useId } from "react";
-import { EffectCoverflow, Navigation } from "swiper";
+import { Autoplay, EffectCoverflow, Navigation } from "swiper";
 import { Swiper, SwiperSlide } from "swiper/react";
-export function CollectionCarousel({ id, slides, className, slideClassName, previousLabel, nextLabel, showControls, effect, centeredSlides, loop, slidesPerView, slidesPerGroupAuto, spaceBetween, breakpoints, }) {
+export function CollectionCarousel({ id, slides, className, slideClassName, previousLabel, nextLabel, showControls, effect, centeredSlides, loop, autoplay, speed, slidesPerView, slidesPerGroupAuto, spaceBetween, draggable, breakpoints, }) {
     const fallbackId = useId().replaceAll(":", "");
     const carouselId = id || `collection-carousel-${fallbackId}`;
     const isGridTitle = slideClassName?.includes("grid-title");
-    return (_jsxs("div", { className: "collection-ui-carousel", children: [showControls ? (_jsxs("div", { className: "collection-ui-carousel__controls", children: [_jsx("button", { type: "button", "aria-controls": carouselId, "aria-label": previousLabel, className: `collection-ui-carousel__prev-${carouselId}`, children: "<" }), _jsx("button", { type: "button", "aria-controls": carouselId, "aria-label": nextLabel, className: `collection-ui-carousel__next-${carouselId}`, children: ">" })] })) : null, _jsx(Swiper, { id: carouselId, modules: [Navigation, EffectCoverflow], cssMode: true, effect: effect, navigation: {
+    const isBanner = className?.includes("collection-ui-banner-carousel");
+    const canDrag = draggable ?? true;
+    return (_jsxs("div", { className: "collection-ui-carousel", children: [showControls ? (_jsxs("div", { className: "collection-ui-carousel__controls", children: [_jsx("button", { type: "button", "aria-controls": carouselId, "aria-label": previousLabel, className: `collection-ui-carousel__prev-${carouselId}`, children: "<" }), _jsx("button", { type: "button", "aria-controls": carouselId, "aria-label": nextLabel, className: `collection-ui-carousel__next-${carouselId}`, children: ">" })] })) : null, _jsx(Swiper, { id: carouselId, modules: [Navigation, EffectCoverflow, Autoplay], cssMode: !isBanner && canDrag, effect: effect, navigation: {
                     prevEl: `.collection-ui-carousel__prev-${carouselId}`,
                     nextEl: `.collection-ui-carousel__next-${carouselId}`,
-                }, centeredSlides: centeredSlides, loop: loop, spaceBetween: spaceBetween ?? (isGridTitle ? 24 : 20), edgeSwipeDetection: "prevent", slidesPerView: slidesPerView ?? (isGridTitle ? 1 : "auto"), slidesPerGroup: 1, slidesPerGroupAuto: slidesPerGroupAuto ?? !isGridTitle, coverflowEffect: effect === "coverflow"
+                }, centeredSlides: centeredSlides, loop: loop, autoplay: autoplay, speed: speed, spaceBetween: spaceBetween ?? (isGridTitle ? 24 : 20), edgeSwipeDetection: "prevent", allowTouchMove: canDrag, simulateTouch: canDrag, slidesPerView: slidesPerView ?? (isGridTitle ? 1 : "auto"), slidesPerGroup: 1, slidesPerGroupAuto: slidesPerGroupAuto ?? !isGridTitle, coverflowEffect: effect === "coverflow"
                     ? {
                         rotate: 0,
                         stretch: 0,

package/dist/primitives/CollectionCarousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"CollectionCarousel.js","sourceRoot":"","sources":["../../src/primitives/CollectionCarousel.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC;AAC9B,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AACrD,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAKnD,MAAM,UAAU,kBAAkB,CAAC,EACjC,EAAE,EACF,MAAM,EACN,SAAS,EACT,cAAc,EACd,aAAa,EACb,SAAS,EACT,YAAY,EACZ,MAAM,EACN,cAAc,EACd,IAAI,EACJ,aAAa,EACb,kBAAkB,EAClB,YAAY,EACZ,WAAW,GACa;IACxB,MAAM,UAAU,GAAG,KAAK,EAAE,CAAC,UAAU,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;IAC/C,MAAM,UAAU,GAAG,EAAE,IAAI,uBAAuB,UAAU,EAAE,CAAC;IAC7D,MAAM,WAAW,GAAG,cAAc,EAAE,QAAQ,CAAC,YAAY,CAAC,CAAC;IAE3D,OAAO,CACL,eAAK,SAAS,EAAC,wBAAwB,aACpC,YAAY,CAAC,CAAC,CAAC,CACd,eAAK,SAAS,EAAC,kCAAkC,aAC/C,iBACE,IAAI,EAAC,QAAQ,mBACE,UAAU,gBACb,aAAa,EACzB,SAAS,EAAE,gCAAgC,UAAU,EAAE,kBAGhD,EACT,iBACE,IAAI,EAAC,QAAQ,mBACE,UAAU,gBACb,SAAS,EACrB,SAAS,EAAE,gCAAgC,UAAU,EAAE,kBAGhD,IACL,CACP,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,MAAM,IACL,EAAE,EAAE,UAAU,EACd,OAAO,EAAE,CAAC,UAAU,EAAE,eAAe,CAAC,EACtC,OAAO,QACP,MAAM,EAAE,MAAM,EACd,UAAU,EAAE;oBACV,MAAM,EAAE,iCAAiC,UAAU,EAAE;oBACrD,MAAM,EAAE,iCAAiC,UAAU,EAAE;iBACtD,EACD,cAAc,EAAE,cAAc,EAC9B,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,YAAY,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EACrD,kBAAkB,EAAC,SAAS,EAC5B,aAAa,EAAE,aAAa,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,EAC1D,cAAc,EAAE,CAAC,EACjB,kBAAkB,EAAE,kBAAkB,IAAI,CAAC,WAAW,EACtD,eAAe,EACb,MAAM,KAAK,WAAW;oBACpB,CAAC,CAAC;wBACE,MAAM,EAAE,CAAC;wBACT,OAAO,EAAE,CAAC;wBACV,KAAK,EAAE,GAAG;wBACV,KAAK,EAAE,GAAG;wBACV,QAAQ,EAAE,CAAC;wBACX,YAAY,EAAE,KAAK;qBACpB;oBACH,CAAC,CAAC,SAAS,EAEf,SAAS,EAAE,SAAS,IAAI,+BAA+B,EACvD,WAAW,EAAE,WAAkB,YAE9B,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,CAC5B,KAAC,WAAW,IAEV,SAAS,EAAE,cAAc,IAAI,+BAA+B,YAE3D,KAAK,IAHD,KAAK,CAIE,CACf,CAAC,GACK,IACL,CACP,CAAC;AACJ,CAAC"}
+{"version":3,"file":"CollectionCarousel.js","sourceRoot":"","sources":["../../src/primitives/CollectionCarousel.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC;AAC9B,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAC/D,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAKnD,MAAM,UAAU,kBAAkB,CAAC,EACjC,EAAE,EACF,MAAM,EACN,SAAS,EACT,cAAc,EACd,aAAa,EACb,SAAS,EACT,YAAY,EACZ,MAAM,EACN,cAAc,EACd,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,aAAa,EACb,kBAAkB,EAClB,YAAY,EACZ,SAAS,EACT,WAAW,GACa;IACxB,MAAM,UAAU,GAAG,KAAK,EAAE,CAAC,UAAU,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;IAC/C,MAAM,UAAU,GAAG,EAAE,IAAI,uBAAuB,UAAU,EAAE,CAAC;IAC7D,MAAM,WAAW,GAAG,cAAc,EAAE,QAAQ,CAAC,YAAY,CAAC,CAAC;IAC3D,MAAM,QAAQ,GAAG,SAAS,EAAE,QAAQ,CAAC,+BAA+B,CAAC,CAAC;IACtE,MAAM,OAAO,GAAG,SAAS,IAAI,IAAI,CAAC;IAElC,OAAO,CACL,eAAK,SAAS,EAAC,wBAAwB,aACpC,YAAY,CAAC,CAAC,CAAC,CACd,eAAK,SAAS,EAAC,kCAAkC,aAC/C,iBACE,IAAI,EAAC,QAAQ,mBACE,UAAU,gBACb,aAAa,EACzB,SAAS,EAAE,gCAAgC,UAAU,EAAE,kBAGhD,EACT,iBACE,IAAI,EAAC,QAAQ,mBACE,UAAU,gBACb,SAAS,EACrB,SAAS,EAAE,gCAAgC,UAAU,EAAE,kBAGhD,IACL,CACP,CAAC,CAAC,CAAC,IAAI,EACR,KAAC,MAAM,IACL,EAAE,EAAE,UAAU,EACd,OAAO,EAAE,CAAC,UAAU,EAAE,eAAe,EAAE,QAAQ,CAAC,EAChD,OAAO,EAAE,CAAC,QAAQ,IAAI,OAAO,EAC7B,MAAM,EAAE,MAAM,EACd,UAAU,EAAE;oBACV,MAAM,EAAE,iCAAiC,UAAU,EAAE;oBACrD,MAAM,EAAE,iCAAiC,UAAU,EAAE;iBACtD,EACD,cAAc,EAAE,cAAc,EAC9B,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EACrD,kBAAkB,EAAC,SAAS,EAC5B,cAAc,EAAE,OAAO,EACvB,aAAa,EAAE,OAAO,EACtB,aAAa,EAAE,aAAa,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,EAC1D,cAAc,EAAE,CAAC,EACjB,kBAAkB,EAAE,kBAAkB,IAAI,CAAC,WAAW,EACtD,eAAe,EACb,MAAM,KAAK,WAAW;oBACpB,CAAC,CAAC;wBACE,MAAM,EAAE,CAAC;wBACT,OAAO,EAAE,CAAC;wBACV,KAAK,EAAE,GAAG;wBACV,KAAK,EAAE,GAAG;wBACV,QAAQ,EAAE,CAAC;wBACX,YAAY,EAAE,KAAK;qBACpB;oBACH,CAAC,CAAC,SAAS,EAEf,SAAS,EAAE,SAAS,IAAI,+BAA+B,EACvD,WAAW,EAAE,WAAkB,YAE9B,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,CAC5B,KAAC,WAAW,IAEV,SAAS,EAAE,cAAc,IAAI,+BAA+B,YAE3D,KAAK,IAHD,KAAK,CAIE,CACf,CAAC,GACK,IACL,CACP,CAAC;AACJ,CAAC"}

package/dist/styles.css

@@ -6,7 +6,10 @@
   --collection-ui-band-bg: var(--color-fg-alt, rgb(0 0 0 / 4%));
   --collection-ui-card-bg: transparent;
   --collection-ui-fg: var(--color-t-default, inherit);
-  --collection-ui-muted: var(--color-t-muted, color-mix(in srgb, currentColor 62%, transparent));
+  --collection-ui-muted: var(
+    --color-t-muted,
+    color-mix(in srgb, currentColor 62%, transparent)
+  );
   --collection-ui-link: var(--color-link, #0f79d0);
   --collection-ui-button-bg: #f6a0a8;
   --collection-ui-button-fg: #151515;
@@ -17,14 +20,17 @@
 }
 
 .collection-ui--ecommerce {
-  --collection-ui-bg: var(--color-bg-default, #181818);
-  --collection-ui-band-bg: var(--color-fg-alt, #121212);
-  --collection-ui-fg: var(--color-t-default, #fff);
-  --collection-ui-muted: var(--color-t-muted, #aaa);
-  --collection-ui-link: var(--color-link, #38bdf8);
-  --collection-ui-button-bg: #f6a0a8;
-  --collection-ui-button-fg: #151515;
-  --collection-ui-special-bg: var(--color-fg-alt, #121212);
+  --collection-ui-bg: var(--color-bg-default, transparent);
+  --collection-ui-band-bg: var(--color-fg-main, transparent);
+  --collection-ui-fg: var(--color-t-default, inherit);
+  --collection-ui-muted: var(
+    --color-t-muted,
+    color-mix(in srgb, currentColor 62%, transparent)
+  );
+  --collection-ui-link: var(--color-link, #0f79d0);
+  --collection-ui-button-bg: #6e0b0f;
+  --collection-ui-button-fg: var(--color-fg-main, #151515);
+  --collection-ui-special-bg: var(--color-fg-main, transparent);
   --collection-ui-special-panel: transparent;
 }
 
@@ -42,6 +48,10 @@
   background: var(--collection-ui-bg);
 }
 
+.dark .collection-ui--ecommerce {
+  --collection-ui-button-bg: #f6a2a5;
+}
+
 .collection-ui--preview {
   --collection-ui-preview-max-height: 420px;
   border-radius: 6px;
@@ -152,12 +162,16 @@
   display: none;
 }
 
-.collection-ui-horizontal .collection-ui-title__link {
+.collection-ui-horizontal .collection-ui-title__link,
+.collection-ui-grid-double .collection-ui-title__link,
+.collection-ui-grid-special .collection-ui-title__link {
   display: block;
 }
 
 .collection-ui-horizontal,
-.collection-ui-grid {
+.collection-ui-grid,
+.collection-ui-grid-double,
+.collection-ui-grid-special {
   min-width: 0;
   position: relative;
 }
@@ -194,6 +208,57 @@
   width: max-content;
 }
 
+.collection-ui-new-layout-carousel {
+  margin-top: 28px;
+}
+
+.collection-ui-grid-double__track,
+.collection-ui-grid-special__track {
+  margin-inline: -16px;
+  overflow: visible;
+  padding: 0 16px 28px;
+}
+
+.collection-ui-grid-double__slide,
+.collection-ui-grid-special__slide {
+  height: auto;
+  overflow: visible;
+  width: max-content !important;
+}
+
+.collection-ui-grid-double__panel {
+  display: grid;
+  gap: 12px 8px;
+  grid-auto-flow: column;
+  grid-auto-columns: max-content;
+  grid-template-rows: repeat(2, minmax(0, auto));
+}
+
+.collection-ui-grid-double__item,
+.collection-ui-grid-special__item {
+  min-width: 0;
+}
+
+.collection-ui-grid-special__panel {
+  align-items: stretch;
+  display: flex;
+  gap: 12px;
+  width: max-content;
+}
+
+.collection-ui-grid-special__featured {
+  align-items: flex-end;
+  display: flex;
+  justify-content: center;
+  min-width: 0;
+}
+
+.collection-ui-grid-special__items {
+  display: grid;
+  gap: 10px 10px;
+  grid-template-columns: repeat(2, max-content);
+}
+
 .collection-ui-grid-title.collection-ui-grid-title {
   margin-inline: -16px;
   padding-inline: 16px;
@@ -223,10 +288,11 @@
 
 .collection-ui-view-all {
   align-items: center;
-  background: linear-gradient(135deg, #1f2937, #111827);
-  border: 1px solid rgb(255 255 255 / 12%);
-  border-radius: 2px;
-  color: rgb(212 212 212);
+  background: var(--color-fg-main, #fff);
+  border: 1px solid var(--color-border-main, rgb(0 0 0 / 10%));
+  border-radius: 6px;
+  box-shadow: 0 14px 30px rgb(0 0 0 / 8%);
+  color: var(--collection-ui-link);
   display: flex;
   flex-direction: column;
   font-size: 0.875rem;
@@ -236,23 +302,26 @@
   overflow: hidden;
   padding: 24px;
   position: relative;
-  transition: border-color 300ms ease, color 300ms ease;
+  transition:
+    border-color 160ms ease,
+    box-shadow 160ms ease,
+    transform 160ms ease;
   width: 180px;
 }
 
 .collection-ui-view-all:hover {
-  border-color: rgb(255 255 255 / 20%);
-  color: white;
+  border-color: color-mix(in srgb, var(--collection-ui-link) 35%, transparent);
+  box-shadow: 0 18px 36px rgb(0 0 0 / 12%);
+  transform: translateY(-2px);
 }
 
 .collection-ui-view-all::before {
-  background: linear-gradient(135deg, rgb(14 165 233 / 10%), rgb(168 85 247 / 10%));
+  background: color-mix(in srgb, var(--collection-ui-link) 8%, transparent);
   content: "";
-  filter: blur(16px);
   inset: 0;
   opacity: 0;
   position: absolute;
-  transition: opacity 500ms ease;
+  transition: opacity 160ms ease;
 }
 
 .collection-ui-view-all:hover::before {
@@ -261,21 +330,23 @@
 
 .collection-ui-view-all__icon {
   align-items: center;
-  background: rgb(38 38 38);
+  background: color-mix(in srgb, var(--collection-ui-link) 10%, transparent);
   border-radius: 999px;
-  color: rgb(56 189 248);
+  color: var(--collection-ui-link);
   display: inline-flex;
   font-size: 1.5rem;
   height: 56px;
   justify-content: center;
   margin-bottom: 16px;
   position: relative;
-  transition: background-color 300ms ease, transform 200ms ease;
+  transition:
+    background-color 300ms ease,
+    transform 200ms ease;
   width: 56px;
 }
 
 .collection-ui-view-all:hover .collection-ui-view-all__icon {
-  background: rgb(14 165 233 / 20%);
+  background: color-mix(in srgb, var(--collection-ui-link) 16%, transparent);
   transform: translateX(4px);
 }
 
@@ -356,6 +427,33 @@
   width: 112px;
 }
 
+.collection-ui-card--image-only {
+  justify-content: flex-end;
+  width: 88px;
+}
+
+.collection-ui-grid-special
+  .collection-ui-card--image-only:not(.collection-ui-card--featured) {
+  width: auto;
+}
+
+.collection-ui-card--image-only .collection-ui-card__media {
+  min-height: 0;
+}
+
+.collection-ui-card--image-only .we-book-overlay {
+  margin-bottom: 0;
+}
+
+.collection-ui-grid-double .we-book-overlay,
+.collection-ui-grid-special .we-book-overlay {
+  margin-bottom: 0;
+}
+
+.collection-ui-card--featured {
+  width: auto;
+}
+
 .collection-ui-card__media {
   align-items: flex-end;
   display: flex;
@@ -363,6 +461,10 @@
   min-height: 144px;
 }
 
+.collection-ui-card__media--featured {
+  min-height: 0;
+}
+
 .collection-ui-card__body {
   display: flex;
   gap: 8px;
@@ -673,6 +775,10 @@
   padding-block: 32px;
 }
 
+.collection-ui--ecommerce .collection-ui-band {
+  color: var(--collection-ui-fg);
+}
+
 .collection-ui-special-section {
   background: var(--collection-ui-special-bg);
   padding-block: 40px;
@@ -694,6 +800,14 @@
   grid-template-columns: 1fr;
 }
 
+.collection-ui-banner-carousel {
+  min-width: 0;
+}
+
+.collection-ui-banner-carousel__slide {
+  height: 100%;
+}
+
 .collection-ui-banner__copy {
   padding: 16px;
 }
@@ -730,7 +844,96 @@
   width: 100%;
 }
 
-.collection-ui-button {
+.collection-ui-banner__image {
+  height: 100%;
+}
+
+.collection-ui-featured-card__image {
+  height: auto;
+}
+
+.collection-ui-banner__media-link {
+  aspect-ratio: 16 / 9;
+  border-radius: 8px;
+  display: block;
+  max-height: 260px;
+  overflow: hidden;
+  min-width: 0;
+  width: 100%;
+}
+
+.collection-ui-banner__image--zoom {
+  transform: scale(1);
+  transition: transform 5000ms linear;
+  will-change: transform;
+}
+
+.collection-ui-banner-carousel
+  .swiper-slide-active
+  .collection-ui-banner__image--zoom {
+  transform: scale(1.06);
+}
+
+.collection-ui-banner-source {
+  align-items: center;
+  aspect-ratio: 16 / 9;
+  background: #030712;
+  border-radius: 8px;
+  display: flex;
+  justify-content: center;
+  max-height: 260px;
+  overflow: hidden;
+  padding: 32px;
+  position: relative;
+}
+
+.collection-ui-banner-source__background {
+  height: 100%;
+  inset: 0;
+  object-fit: cover;
+  opacity: 0.6;
+  position: absolute;
+  width: 100%;
+}
+
+.collection-ui-banner-source__overlay {
+  background: linear-gradient(
+    135deg,
+    rgb(0 0 0 / 40%),
+    rgb(255 255 255 / 10%),
+    rgb(0 0 0 / 55%)
+  );
+  inset: 0;
+  position: absolute;
+}
+
+.collection-ui-banner-source__frame {
+  align-items: center;
+  background: rgb(255 255 255 / 15%);
+  border-radius: 6px;
+  box-shadow: 0 24px 80px rgb(0 0 0 / 35%);
+  display: flex;
+  height: 210px;
+  justify-content: center;
+  padding: 12px;
+  position: relative;
+  width: 150px;
+}
+
+@supports (backdrop-filter: blur(12px)) {
+  .collection-ui-banner-source__frame {
+    backdrop-filter: blur(12px);
+  }
+}
+
+.collection-ui-banner-source__foreground {
+  filter: drop-shadow(0 22px 28px rgb(0 0 0 / 35%));
+  height: 100%;
+  object-fit: contain;
+  width: 100%;
+}
+
+.collection-ui .collection-ui-button {
   align-items: center;
   background: var(--collection-ui-button-bg);
   border-radius: 8px;
@@ -744,7 +947,9 @@
   min-width: 152px;
   padding: 10px 32px;
   text-align: center;
-  transition: background-color 160ms ease, transform 160ms ease;
+  transition:
+    background-color 160ms ease,
+    transform 160ms ease;
   white-space: nowrap;
 }
 
@@ -819,31 +1024,45 @@
   align-items: center;
   display: grid;
   gap: 28px;
-  grid-template-columns: repeat(var(--collection-ui-columns, 2), minmax(0, 1fr));
+  grid-template-columns: repeat(
+    var(--collection-ui-columns, 2),
+    minmax(0, 1fr)
+  );
   justify-content: center;
   margin-top: 32px;
 }
 
 .collection-ui-image-grid__item {
+  align-items: center;
   display: flex;
+  flex: 0 1 auto;
   justify-content: center;
+  min-height: 96px;
+  min-width: 0;
 }
 
 .collection-ui-image-grid__image {
   border-radius: 8px;
   display: block;
-  height: auto;
   max-width: 100%;
-  object-fit: cover;
+  object-fit: contain;
+  width: 176px;
+  height: 96px;
 }
 
 .collection-ui-image-grid--circle .collection-ui-image-grid__image {
   height: 128px;
+  object-fit: cover;
   width: 128px;
 }
 
+.collection-ui-image-grid--circle .collection-ui-image-grid__item {
+  min-height: 128px;
+}
+
 .collection-ui-image-grid--block .collection-ui-image-grid__image {
-  max-height: 96px;
+  height: 96px;
+  width: 176px;
 }
 
 .collection-ui-image-grid__image--circle {
@@ -853,6 +1072,13 @@
 
 .collection-ui-image-grid__image--square {
   aspect-ratio: 1;
+  height: 176px;
+  object-fit: cover;
+  width: 176px;
+}
+
+.collection-ui-image-grid--square .collection-ui-image-grid__item {
+  min-height: 176px;
 }
 
 .collection-ui--preview .collection-ui-image-grid__items {
@@ -865,6 +1091,25 @@
   width: auto;
 }
 
+@media (max-width: 767px) {
+  .collection-ui-grid-special__panel {
+    gap: 18px;
+    grid-template-columns: minmax(116px, auto) minmax(104px, auto);
+  }
+
+  .collection-ui-grid-special__items {
+    grid-template-columns: minmax(104px, auto);
+  }
+
+  .collection-ui-card--featured {
+    width: 136px;
+  }
+
+  .collection-ui-card__media--featured {
+    min-height: 204px;
+  }
+}
+
 @media (min-width: 768px) {
   .collection-ui-title__controls {
     display: flex;
@@ -896,9 +1141,20 @@
     padding: 0 32px 24px 0;
   }
 
-  .collection-ui-banner > a {
+  .collection-ui-banner__media-link {
     display: block;
     grid-column: span 8 / span 8;
+    max-height: 500px;
+  }
+
+  .collection-ui-banner-source {
+    max-height: 500px;
+    padding: 48px;
+  }
+
+  .collection-ui-banner-source__frame {
+    height: min(420px, 100%);
+    width: 300px;
   }
 
   .collection-ui-banner__eyebrow {
@@ -906,11 +1162,17 @@
   }
 
   .collection-ui-featured {
-    grid-template-columns: repeat(var(--collection-ui-columns, 2), minmax(0, 1fr));
+    grid-template-columns: repeat(
+      var(--collection-ui-columns, 2),
+      minmax(0, 1fr)
+    );
   }
 
   .collection-ui-featured--three {
-    grid-template-columns: repeat(var(--collection-ui-columns, 3), minmax(0, 1fr));
+    grid-template-columns: repeat(
+      var(--collection-ui-columns, 3),
+      minmax(0, 1fr)
+    );
   }
 
   .collection-ui-carousel__controls {
@@ -924,7 +1186,10 @@
   }
 
   .collection-ui-special-item {
-    grid-template-columns: minmax(160px, 0.28fr) minmax(0, 0.52fr) minmax(156px, 0.2fr);
+    grid-template-columns: minmax(160px, 0.28fr) minmax(0, 0.52fr) minmax(
+        156px,
+        0.2fr
+      );
     justify-items: stretch;
   }
 
@@ -935,16 +1200,34 @@
   .collection-ui-image-grid__items {
     display: flex;
     flex-wrap: wrap;
+    justify-content: center;
   }
 
   .collection-ui-image-grid--circle .collection-ui-image-grid__items {
-    flex-wrap: nowrap;
     gap: clamp(24px, 4vw, 56px);
   }
 
   .collection-ui-image-grid--block .collection-ui-image-grid__items {
     gap: 16px;
   }
+
+  .collection-ui-image-grid__item {
+    flex-basis: calc(
+      100% / var(--collection-ui-columns, 4) -
+        var(--collection-ui-image-grid-gap, 28px)
+    );
+    max-width: 220px;
+  }
+
+  .collection-ui-image-grid--circle .collection-ui-image-grid__item {
+    --collection-ui-image-grid-gap: clamp(24px, 4vw, 56px);
+    flex-basis: auto;
+    max-width: 168px;
+  }
+
+  .collection-ui-image-grid--block .collection-ui-image-grid__item {
+    --collection-ui-image-grid-gap: 16px;
+  }
 }
 
 @media (min-width: 1200px) {

package/dist/types.d.ts

@@ -1,5 +1,5 @@
 import type { CSSProperties, ReactNode } from "react";
-export type CollectionLayoutName = "banner" | "block-grid" | "carousel" | "dynamic" | "featured" | "grid" | "grid-title" | "hero" | "image-grid" | "list" | "relative" | "slide" | "special";
+export type CollectionLayoutName = "banner" | "block-grid" | "carousel" | "dynamic" | "featured" | "grid" | "grid-double" | "grid-special" | "grid-title" | "hero" | "image-grid" | "list" | "relative" | "slide" | "special";
 export type CollectionLayoutDirection = "horizontal" | "vertical";
 export type CollectionLayoutShape = "circle" | "rectangle" | "square";
 export type CollectionItemMediaKind = "audio" | "book" | "ebook" | string;
@@ -103,9 +103,16 @@ export interface CarouselRenderProps {
     effect?: "slide" | "coverflow";
     centeredSlides?: boolean;
     loop?: boolean;
+    autoplay?: boolean | {
+        delay?: number;
+        disableOnInteraction?: boolean;
+        pauseOnMouseEnter?: boolean;
+    };
+    speed?: number;
     slidesPerView?: number | "auto";
     slidesPerGroupAuto?: boolean;
     spaceBetween?: number;
+    draggable?: boolean;
     breakpoints?: Record<string | number, unknown>;
 }
 export interface CollectionRendererLabels {

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}

package/dist/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE1D,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,KAAK,CAAC,MAAM,GAAG,KAAK,GAAG,IAAI,GAAG,SAAS,CAAC,UAErE;AAED,wBAAgB,eAAe,CAAC,KAAK,CAAC,EAAE,UAAU,EAAE,GAAG,IAAI,gBAQ1D;AAED,wBAAgB,OAAO,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,KAAK,CAAC,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC,GAAG,IAAI,GAAG,CAAC,EAAE,CAE1E;AAED,wBAAgB,QAAQ,CAAC,UAAU,EAAE,UAAU,WAE9C;AAED,wBAAgB,cAAc,CAAC,UAAU,EAAE,UAAU,WAEpD;AAED,wBAAgB,qBAAqB,CAAC,UAAU,EAAE,UAAU,iBAE3D;AAED,wBAAgB,eAAe,CAAC,IAAI,EAAE,cAAc,iBAEnD"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAE1D,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,KAAK,CAAC,MAAM,GAAG,KAAK,GAAG,IAAI,GAAG,SAAS,CAAC,UAErE;AAED,wBAAgB,eAAe,CAAC,KAAK,CAAC,EAAE,UAAU,EAAE,GAAG,IAAI,gBAE1D;AAED,wBAAgB,OAAO,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,KAAK,CAAC,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC,GAAG,IAAI,GAAG,CAAC,EAAE,CAE1E;AAED,wBAAgB,QAAQ,CAAC,UAAU,EAAE,UAAU,WAE9C;AAED,wBAAgB,cAAc,CAAC,UAAU,EAAE,UAAU,WAEpD;AAED,wBAAgB,qBAAqB,CAAC,UAAU,EAAE,UAAU,iBAE3D;AAED,wBAAgB,eAAe,CAAC,IAAI,EAAE,cAAc,iBAEnD"}

package/dist/utils.js

@@ -2,12 +2,7 @@ export function cx(...values) {
     return values.filter(Boolean).join(" ");
 }
 export function sortCollections(items) {
-    return [...compact(items)].sort((a, b) => {
-        if (a.sort != null || b.sort != null) {
-            return (b.sort ?? Number.NEGATIVE_INFINITY) - (a.sort ?? Number.NEGATIVE_INFINITY);
-        }
-        return (a.name ?? "").localeCompare(b.name ?? "");
-    });
+    return compact(items);
 }
 export function compact(items) {
     return (items ?? []).filter((item) => Boolean(item));

package/dist/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,EAAE,CAAC,GAAG,MAAgD;IACpE,OAAO,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAC1C,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,KAA2B;IACzD,OAAO,CAAC,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;QACvC,IAAI,CAAC,CAAC,IAAI,IAAI,IAAI,IAAI,CAAC,CAAC,IAAI,IAAI,IAAI,EAAE,CAAC;YACrC,OAAO,CAAC,CAAC,CAAC,IAAI,IAAI,MAAM,CAAC,iBAAiB,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,IAAI,MAAM,CAAC,iBAAiB,CAAC,CAAC;QACrF,CAAC;QAED,OAAO,CAAC,CAAC,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC;IACpD,CAAC,CAAC,CAAC;AACL,CAAC;AAED,MAAM,UAAU,OAAO,CAAI,KAA0C;IACnE,OAAO,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,IAAI,EAAa,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;AAClE,CAAC;AAED,MAAM,UAAU,QAAQ,CAAC,UAAsB;IAC7C,OAAO,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;AAC9C,CAAC;AAED,MAAM,UAAU,cAAc,CAAC,UAAsB;IACnD,OAAO,OAAO,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;AACpD,CAAC;AAED,MAAM,UAAU,qBAAqB,CAAC,UAAsB;IAC1D,OAAO,UAAU,CAAC,IAAI,IAAI,UAAU,CAAC,QAAQ,IAAI,IAAI,CAAC;AACxD,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,IAAoB;IAClD,OAAO,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC;AAC3B,CAAC"}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAEA,MAAM,UAAU,EAAE,CAAC,GAAG,MAAgD;IACpE,OAAO,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAC1C,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,KAA2B;IACzD,OAAO,OAAO,CAAC,KAAK,CAAC,CAAC;AACxB,CAAC;AAED,MAAM,UAAU,OAAO,CAAI,KAA0C;IACnE,OAAO,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,IAAI,EAAa,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;AAClE,CAAC;AAED,MAAM,UAAU,QAAQ,CAAC,UAAsB;IAC7C,OAAO,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;AAC9C,CAAC;AAED,MAAM,UAAU,cAAc,CAAC,UAAsB;IACnD,OAAO,OAAO,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;AACpD,CAAC;AAED,MAAM,UAAU,qBAAqB,CAAC,UAAsB;IAC1D,OAAO,UAAU,CAAC,IAAI,IAAI,UAAU,CAAC,QAAQ,IAAI,IAAI,CAAC;AACxD,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,IAAoB;IAClD,OAAO,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC;AAC3B,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@chinggis.systems/collection-ui",
-  "version": "1.0.1",
+  "version": "1.0.3",
   "description": "Reusable React collection layout renderer with app-provided link, image, and item adapters.",
   "license": "MIT",
   "type": "module",