@getmicdrop/venue-calendar 3.4.2 → 3.4.3

package/dist/CarouselView.legacy-DdcBQB8k.js

@@ -0,0 +1,65 @@
+import "svelte/internal/disclose-version";
+import * as e from "svelte/internal/client";
+import { onMount as y } from "svelte";
+import { G as C } from "./GalleryCard-Ch072lif.js";
+import { f as S } from "./VenueCalendar-DXZ34Hv2.js";
+var x = e.from_html('<button class="carousel-arrow carousel-arrow-left svelte-1lcnwer" aria-label="Scroll left"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="arrow-icon svelte-1lcnwer"><polyline points="15 18 9 12 15 6"></polyline></svg></button>'), B = e.from_html('<div class="carousel-item svelte-1lcnwer" role="listitem"><!></div>'), W = e.from_html('<button class="carousel-arrow carousel-arrow-right svelte-1lcnwer" aria-label="Scroll right"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="arrow-icon svelte-1lcnwer"><polyline points="9 18 15 12 9 6"></polyline></svg></button>'), j = e.from_html('<section class="carousel-view svelte-1lcnwer" aria-label="Events carousel"><h2 class="sr-only svelte-1lcnwer">Upcoming events</h2> <div class="carousel-wrapper svelte-1lcnwer"><!> <div class="carousel-scroll svelte-1lcnwer" role="list"></div> <!></div></section>');
+function R(p, n) {
+  e.push(n, !0);
+  let g = e.prop(n, "events", 19, () => []), l, v = e.state(!1), d = e.state(!1), i = e.state(!1), h = e.derived(() => S(g()));
+  function a() {
+    if (!l) return;
+    const { scrollLeft: r, scrollWidth: t, clientWidth: o } = l;
+    e.set(v, r > 1), e.set(d, r + o < t - 1), e.set(i, t > o + 1);
+  }
+  function u(r) {
+    if (!l) return;
+    const t = l.querySelector(".carousel-item");
+    if (!t) return;
+    const o = t.offsetWidth + 16;
+    l.scrollBy({ left: r * o, behavior: "smooth" });
+  }
+  y(() => {
+    a();
+    const r = new ResizeObserver(() => a());
+    return l && r.observe(l), () => r.disconnect();
+  });
+  var c = j(), f = e.sibling(e.child(c), 2), w = e.child(f);
+  {
+    var m = (r) => {
+      var t = x();
+      e.delegated("click", t, () => u(-1)), e.append(r, t);
+    };
+    e.if(w, (r) => {
+      e.get(i) && e.get(v) && r(m);
+    });
+  }
+  var s = e.sibling(w, 2);
+  e.each(s, 21, () => e.get(h), e.index, (r, t) => {
+    var o = B(), k = e.child(o);
+    C(k, {
+      get event() {
+        return e.get(t);
+      },
+      get oneventClick() {
+        return n.oneventClick;
+      }
+    }), e.reset(o), e.append(r, o);
+  }), e.reset(s), e.bind_this(s, (r) => l = r, () => l);
+  var b = e.sibling(s, 2);
+  {
+    var _ = (r) => {
+      var t = W();
+      e.delegated("click", t, () => u(1)), e.append(r, t);
+    };
+    e.if(b, (r) => {
+      e.get(i) && e.get(d) && r(_);
+    });
+  }
+  e.reset(f), e.reset(c), e.event("scroll", s, a), e.append(p, c), e.pop();
+}
+e.delegate(["click"]);
+export {
+  R as default
+};
+//# sourceMappingURL=CarouselView.legacy-DdcBQB8k.js.map

package/dist/CarouselView.legacy-DdcBQB8k.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CarouselView.legacy-DdcBQB8k.js","sources":["../src/components/Calendar/CarouselView.legacy.svelte"],"sourcesContent":["<script>\n  import { onMount } from \"svelte\";\n  import GalleryCard from \"./GalleryCard.svelte\";\n  import { filterTodayAndFuture } from \"$lib/utils/browse-status.js\";\n\n  let { events = [], oneventClick } = $props();\n\n  let scrollContainer;\n  let canScrollLeft = $state(false);\n  let canScrollRight = $state(false);\n  let showArrows = $state(false);\n\n  // Filter to today and future, sorted chronologically\n  let futureEvents = $derived(filterTodayAndFuture(events));\n\n  function updateScrollState() {\n    if (!scrollContainer) return;\n    const { scrollLeft, scrollWidth, clientWidth } = scrollContainer;\n    canScrollLeft = scrollLeft > 1;\n    canScrollRight = scrollLeft + clientWidth < scrollWidth - 1;\n    showArrows = scrollWidth > clientWidth + 1;\n  }\n\n  function scrollByCard(direction) {\n    if (!scrollContainer) return;\n    // Get the width of the first card item\n    const firstCard = scrollContainer.querySelector('.carousel-item');\n    if (!firstCard) return;\n    const cardWidth = firstCard.offsetWidth + 16; // card width + gap\n    scrollContainer.scrollBy({ left: direction * cardWidth, behavior: 'smooth' });\n  }\n\n  onMount(() => {\n    updateScrollState();\n    // Use ResizeObserver to update on container resize\n    const observer = new ResizeObserver(() => updateScrollState());\n    if (scrollContainer) {\n      observer.observe(scrollContainer);\n    }\n    return () => observer.disconnect();\n  });\n</script>\n\n<section class=\"carousel-view\" aria-label=\"Events carousel\">\n  <h2 class=\"sr-only\">Upcoming events</h2>\n\n  <div class=\"carousel-wrapper\">\n    <!-- Left arrow -->\n    {#if showArrows && canScrollLeft}\n      <button\n        class=\"carousel-arrow carousel-arrow-left\"\n        onclick={() => scrollByCard(-1)}\n        aria-label=\"Scroll left\"\n      >\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"arrow-icon\"><polyline points=\"15 18 9 12 15 6\"></polyline></svg>\n      </button>\n    {/if}\n\n    <!-- Scroll container -->\n    <div\n      class=\"carousel-scroll\"\n      bind:this={scrollContainer}\n      onscroll={updateScrollState}\n      role=\"list\"\n    >\n      {#each futureEvents as event}\n        <div class=\"carousel-item\" role=\"listitem\">\n          <GalleryCard {event} {oneventClick} />\n        </div>\n      {/each}\n    </div>\n\n    <!-- Right arrow -->\n    {#if showArrows && canScrollRight}\n      <button\n        class=\"carousel-arrow carousel-arrow-right\"\n        onclick={() => scrollByCard(1)}\n        aria-label=\"Scroll right\"\n      >\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"arrow-icon\"><polyline points=\"9 18 15 12 9 6\"></polyline></svg>\n      </button>\n    {/if}\n  </div>\n</section>\n\n<style>\n  @reference \"../../app.css\";\n\n  .carousel-view {\n    width: 100%;\n  }\n\n  .carousel-wrapper {\n    @apply relative;\n  }\n\n  .carousel-scroll {\n    @apply flex gap-4 overflow-x-auto p-2;\n    scroll-snap-type: x mandatory;\n    -webkit-overflow-scrolling: touch;\n    scrollbar-width: none;\n  }\n\n  .carousel-scroll::-webkit-scrollbar {\n    display: none;\n  }\n\n  .carousel-item {\n    scroll-snap-align: start;\n    flex: 0 0 85%;\n  }\n\n  /* Tablet: 2 visible cards with peek */\n  @media (min-width: 640px) {\n    .carousel-item {\n      flex: 0 0 calc(50% - 8px);\n    }\n\n    .carousel-scroll {\n      @apply p-3;\n    }\n  }\n\n  /* Desktop: 3 visible cards with peek */\n  @media (min-width: 1024px) {\n    .carousel-item {\n      flex: 0 0 calc(33.333% - 11px);\n    }\n\n    .carousel-scroll {\n      @apply p-4;\n    }\n  }\n\n  /* Arrow buttons */\n  .carousel-arrow {\n    @apply absolute top-1/2 -translate-y-1/2 z-10;\n    @apply w-10 h-10 rounded-full flex items-center justify-center;\n    @apply bg-white/90 dark:bg-gray-800/90 border border-gray-200 dark:border-gray-600;\n    @apply shadow-lg cursor-pointer;\n    @apply transition-opacity duration-200;\n  }\n\n  .carousel-arrow:hover {\n    @apply bg-white dark:bg-gray-700;\n  }\n\n  .carousel-arrow:focus-visible {\n    @apply outline-2 outline-blue-700 dark:outline-blue-500 outline-offset-2;\n  }\n\n  .carousel-arrow-left {\n    left: 8px;\n  }\n\n  .carousel-arrow-right {\n    right: 8px;\n  }\n\n  .arrow-icon {\n    @apply w-5 h-5 text-gray-700 dark:text-gray-200;\n  }\n\n  /* Hide arrows on mobile — touch scrolling is natural */\n  @media (max-width: 639px) {\n    .carousel-arrow {\n      display: none;\n    }\n  }\n\n  /* Reduced motion */\n  @media (prefers-reduced-motion: reduce) {\n    .carousel-scroll {\n      scroll-behavior: auto;\n    }\n  }\n\n  /* Screen reader only text */\n  .sr-only {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    padding: 0;\n    margin: -1px;\n    overflow: hidden;\n    clip: rect(0, 0, 0, 0);\n    white-space: nowrap;\n    border-width: 0;\n  }\n</style>\n"],"names":["events","$","$$props","scrollContainer","canScrollLeft","canScrollRight","showArrows","futureEvents","filterTodayAndFuture","updateScrollState","scrollLeft","scrollWidth","clientWidth","scrollByCard","direction","firstCard","cardWidth","onMount","observer","section","root","div","button","root_1","$$render","consequent","div_1","node","$$anchor","event","div_2","root_2","GalleryCard","node_1","$$value","button_1","root_3","consequent_1"],"mappings":";;;;;;iBAAA;;MAKQA,IAAMC,EAAA,KAAAC,GAAA,UAAA,IAAA,MAAA,EAAA,GAERC,GACAC,IAAgBH,EAAA,MAAO,EAAK,GAC5BI,IAAiBJ,EAAA,MAAO,EAAK,GAC7BK,IAAaL,EAAA,MAAO,EAAK,GAGzBM,IAAYN,EAAA,QAAA,MAAYO,EAAqBR,EAAM,CAAA,CAAA;AAE9C,WAAAS,IAAoB;SACtBN,EAAe;AACZ,UAAA,EAAA,YAAAO,GAAY,aAAAC,GAAa,aAAAC,EAAW,IAAKT;UACjDC,GAAgBM,IAAa,CAAC,GAC9BT,EAAA,IAAAI,GAAiBK,IAAaE,IAAcD,IAAc,CAAC,GAC3DV,EAAA,IAAAK,GAAaK,IAAcC,IAAc,CAAC;AAAA,EAC5C;WAESC,EAAaC,GAAW;SAC1BX,EAAe;AAEd,UAAAY,IAAYZ,EAAgB,cAAc,gBAAgB;SAC3DY,EAAS;AACR,UAAAC,IAAYD,EAAU,cAAc;AAC1C,IAAAZ,EAAgB,SAAQ,EAAG,MAAMW,IAAYE,GAAW,UAAU,UAAQ;AAAA,EAC5E;AAEA,EAAAC,EAAO,MAAO;AACZ,IAAAR,EAAiB;UAEXS,IAAQ,IAAO,eAAc,MAAOT,EAAiB,CAAA;AACvD,WAAAN,KACFe,EAAS,QAAQf,CAAe,GAErB,MAAAe,EAAS,WAAU;AAAA,EAClC,CAAC;MAGFC,IAAOC,EAAA,GAGLC,sBAHFF,CAAO,GAAA,CAAA,eAGLE,CAAG;;;UAGCC,IAAKC,EAAA;2BAALD,GAAK,MAEWT,EAAY,EAAG,CAAA,eAF/BS,CAAK;AAAA;;AADH,MAAArB,EAAA,IAAAK,CAAU,WAAIF,CAAa,KAAAoB,EAAAC,CAAA;AAAA;;MAW/BC,IAAEzB,EAAA,QAAA0B,GAAA,CAAA;SAAFD,GAAE,IAAA,MAAAzB,EAAA,IAMMM,CAAY,GAAAN,EAAA,OAAA,CAAA2B,GAAIC,MAAK;QACzBC,IAAGC,EAAA,eAAHD,CAAG;AACD,IAAAE,EAAWC,GAAA;AAAA;qBAAEJ,CAAK;AAAA;;;;gBADpBC,CAAG,eAAHA,CAAG;AAAA,cAPPJ,CAAE,eAAFA,GAAE,CAAAQ,MAEU/B,IAAe+B,GAAA,MAAf/B,CAAe;oBAF3BuB,GAAE,CAAA;;;UAeAS,IAAKC,EAAA;2BAALD,GAAK,MAEWtB,EAAa,CAAC,CAAA,eAF9BsB,CAAK;AAAA;;AADH,MAAAlC,EAAA,IAAAK,CAAU,WAAID,CAAc,KAAAmB,EAAAa,CAAA;AAAA;;UA3BlChB,CAAG,WAHLF,CAAO,GAgBHlB,EAAA,MAAA,UAAAyB,GAGWjB,CAAiB,eAnBhCU,CAAO;AAFA;;"}