@getmicdrop/venue-calendar 3.4.8 → 3.5.1

package/dist/CarouselView.legacy-Cl3xu_XU.js

@@ -0,0 +1,64 @@
+import "svelte/internal/disclose-version";
+import * as e from "svelte/internal/client";
+import { onMount as x } from "svelte";
+import { f as _, G as C } from "./VenueCalendar-B419EPE7.js";
+var S = e.from_html('<button class="carousel-arrow absolute top-1/2 -translate-y-1/2 z-10 w-10 h-10 rounded-full flex items-center justify-center bg-white/90 dark:bg-gray-800/90 border border-gray-200 dark:border-gray-600 shadow-lg cursor-pointer transition-opacity duration-200 hover:bg-white hover:dark:bg-gray-700 focus-visible:outline-2 focus-visible:outline-blue-700 dark:focus-visible:outline-blue-500 focus-visible:outline-offset-2 svelte-1lcnwer" style="left: 8px" 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="w-5 h-5 text-gray-700 dark:text-gray-200"><polyline points="15 18 9 12 15 6"></polyline></svg></button>'), j = e.from_html('<div class="carousel-item svelte-1lcnwer" role="listitem"><!></div>'), B = e.from_html('<button class="carousel-arrow absolute top-1/2 -translate-y-1/2 z-10 w-10 h-10 rounded-full flex items-center justify-center bg-white/90 dark:bg-gray-800/90 border border-gray-200 dark:border-gray-600 shadow-lg cursor-pointer transition-opacity duration-200 hover:bg-white hover:dark:bg-gray-700 focus-visible:outline-2 focus-visible:outline-blue-700 dark:focus-visible:outline-blue-500 focus-visible:outline-offset-2 svelte-1lcnwer" style="right: 8px" 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="w-5 h-5 text-gray-700 dark:text-gray-200"><polyline points="9 18 15 12 9 6"></polyline></svg></button>'), W = e.from_html('<section class="w-full" aria-label="Events carousel"><h2 class="sr-only svelte-1lcnwer">Upcoming events</h2> <div class="relative"><!> <div class="carousel-scroll flex gap-4 overflow-x-auto p-2 sm:p-3 lg:p-4 svelte-1lcnwer" role="list"></div> <!></div></section>');
+function G(b, i) {
+  e.push(i, !0);
+  let h = e.prop(i, "events", 19, () => []), o, u = e.state(!1), d = e.state(!1), a = e.state(!1), p = e.derived(() => _(h()));
+  function n() {
+    if (!o) return;
+    const { scrollLeft: t, scrollWidth: r, clientWidth: l } = o;
+    e.set(u, t > 1), e.set(d, t + l < r - 1), e.set(a, r > l + 1);
+  }
+  function v(t) {
+    if (!o) return;
+    const r = o.querySelector(".carousel-item");
+    if (!r) return;
+    const l = r.offsetWidth + 16;
+    o.scrollBy({ left: t * l, behavior: "smooth" });
+  }
+  x(() => {
+    n();
+    const t = new ResizeObserver(() => n());
+    return o && t.observe(o), () => t.disconnect();
+  });
+  var c = W(), f = e.sibling(e.child(c), 2), g = e.child(f);
+  {
+    var w = (t) => {
+      var r = S();
+      e.delegated("click", r, () => v(-1)), e.append(t, r);
+    };
+    e.if(g, (t) => {
+      e.get(a) && e.get(u) && t(w);
+    });
+  }
+  var s = e.sibling(g, 2);
+  e.each(s, 21, () => e.get(p), e.index, (t, r) => {
+    var l = j(), k = e.child(l);
+    C(k, {
+      get event() {
+        return e.get(r);
+      },
+      get oneventClick() {
+        return i.oneventClick;
+      }
+    }), e.reset(l), e.append(t, l);
+  }), e.reset(s), e.bind_this(s, (t) => o = t, () => o);
+  var y = e.sibling(s, 2);
+  {
+    var m = (t) => {
+      var r = B();
+      e.delegated("click", r, () => v(1)), e.append(t, r);
+    };
+    e.if(y, (t) => {
+      e.get(a) && e.get(d) && t(m);
+    });
+  }
+  e.reset(f), e.reset(c), e.event("scroll", s, n), e.append(b, c), e.pop();
+}
+e.delegate(["click"]);
+export {
+  G as default
+};
+//# sourceMappingURL=CarouselView.legacy-Cl3xu_XU.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CarouselView.legacy-Cl3xu_XU.js","sources":["../src/components/Calendar/CarouselView.legacy.svelte"],"sourcesContent":["<script>\r\n  import { onMount } from \"svelte\";\r\n  import GalleryCard from \"./GalleryCard.svelte\";\r\n  import { filterTodayAndFuture } from \"$lib/utils/browse-status.js\";\r\n\r\n  let { events = [], oneventClick } = $props();\r\n\r\n  let scrollContainer;\r\n  let canScrollLeft = $state(false);\r\n  let canScrollRight = $state(false);\r\n  let showArrows = $state(false);\r\n\r\n  // Filter to today and future, sorted chronologically\r\n  let futureEvents = $derived(filterTodayAndFuture(events));\r\n\r\n  function updateScrollState() {\r\n    if (!scrollContainer) return;\r\n    const { scrollLeft, scrollWidth, clientWidth } = scrollContainer;\r\n    canScrollLeft = scrollLeft > 1;\r\n    canScrollRight = scrollLeft + clientWidth < scrollWidth - 1;\r\n    showArrows = scrollWidth > clientWidth + 1;\r\n  }\r\n\r\n  function scrollByCard(direction) {\r\n    if (!scrollContainer) return;\r\n    // Get the width of the first card item\r\n    const firstCard = scrollContainer.querySelector('.carousel-item');\r\n    if (!firstCard) return;\r\n    const cardWidth = firstCard.offsetWidth + 16; // card width + gap\r\n    scrollContainer.scrollBy({ left: direction * cardWidth, behavior: 'smooth' });\r\n  }\r\n\r\n  onMount(() => {\r\n    updateScrollState();\r\n    // Use ResizeObserver to update on container resize\r\n    const observer = new ResizeObserver(() => updateScrollState());\r\n    if (scrollContainer) {\r\n      observer.observe(scrollContainer);\r\n    }\r\n    return () => observer.disconnect();\r\n  });\r\n</script>\r\n\r\n<section class=\"w-full\" aria-label=\"Events carousel\">\r\n  <h2 class=\"sr-only\">Upcoming events</h2>\r\n\r\n  <div class=\"relative\">\r\n    <!-- Left arrow -->\r\n    {#if showArrows && canScrollLeft}\r\n      <button\r\n        class=\"carousel-arrow absolute top-1/2 -translate-y-1/2 z-10 w-10 h-10 rounded-full flex items-center justify-center bg-white/90 dark:bg-gray-800/90 border border-gray-200 dark:border-gray-600 shadow-lg cursor-pointer transition-opacity duration-200 hover:bg-white hover:dark:bg-gray-700 focus-visible:outline-2 focus-visible:outline-blue-700 dark:focus-visible:outline-blue-500 focus-visible:outline-offset-2\"\r\n        style=\"left: 8px\"\r\n        onclick={() => scrollByCard(-1)}\r\n        aria-label=\"Scroll left\"\r\n      >\r\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=\"w-5 h-5 text-gray-700 dark:text-gray-200\"><polyline points=\"15 18 9 12 15 6\"></polyline></svg>\r\n      </button>\r\n    {/if}\r\n\r\n    <!-- Scroll container -->\r\n    <div\r\n      class=\"carousel-scroll flex gap-4 overflow-x-auto p-2 sm:p-3 lg:p-4\"\r\n      bind:this={scrollContainer}\r\n      onscroll={updateScrollState}\r\n      role=\"list\"\r\n    >\r\n      {#each futureEvents as event}\r\n        <div class=\"carousel-item\" role=\"listitem\">\r\n          <GalleryCard {event} {oneventClick} />\r\n        </div>\r\n      {/each}\r\n    </div>\r\n\r\n    <!-- Right arrow -->\r\n    {#if showArrows && canScrollRight}\r\n      <button\r\n        class=\"carousel-arrow absolute top-1/2 -translate-y-1/2 z-10 w-10 h-10 rounded-full flex items-center justify-center bg-white/90 dark:bg-gray-800/90 border border-gray-200 dark:border-gray-600 shadow-lg cursor-pointer transition-opacity duration-200 hover:bg-white hover:dark:bg-gray-700 focus-visible:outline-2 focus-visible:outline-blue-700 dark:focus-visible:outline-blue-500 focus-visible:outline-offset-2\"\r\n        style=\"right: 8px\"\r\n        onclick={() => scrollByCard(1)}\r\n        aria-label=\"Scroll right\"\r\n      >\r\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=\"w-5 h-5 text-gray-700 dark:text-gray-200\"><polyline points=\"9 18 15 12 9 6\"></polyline></svg>\r\n      </button>\r\n    {/if}\r\n  </div>\r\n</section>\r\n\r\n<style>\r\n  .carousel-scroll {\r\n    scroll-snap-type: x mandatory;\r\n    -webkit-overflow-scrolling: touch;\r\n    scrollbar-width: none;\r\n  }\r\n\r\n  .carousel-scroll::-webkit-scrollbar {\r\n    display: none;\r\n  }\r\n\r\n  .carousel-item {\r\n    scroll-snap-align: start;\r\n    flex: 0 0 85%;\r\n  }\r\n\r\n  /* Tablet: 2 visible cards with peek */\r\n  @media (min-width: 640px) {\r\n    .carousel-item {\r\n      flex: 0 0 calc(50% - 8px);\r\n    }\r\n  }\r\n\r\n  /* Desktop: 3 visible cards with peek */\r\n  @media (min-width: 1024px) {\r\n    .carousel-item {\r\n      flex: 0 0 calc(33.333% - 11px);\r\n    }\r\n  }\r\n\r\n  /* Hide arrows on mobile -- touch scrolling is natural */\r\n  @media (max-width: 639px) {\r\n    .carousel-arrow {\r\n      display: none;\r\n    }\r\n  }\r\n\r\n  /* Reduced motion */\r\n  @media (prefers-reduced-motion: reduce) {\r\n    .carousel-scroll {\r\n      scroll-behavior: auto;\r\n    }\r\n  }\r\n\r\n  /* Screen reader only text */\r\n  .sr-only {\r\n    position: absolute;\r\n    width: 1px;\r\n    height: 1px;\r\n    padding: 0;\r\n    margin: -1px;\r\n    overflow: hidden;\r\n    clip: rect(0, 0, 0, 0);\r\n    white-space: nowrap;\r\n    border-width: 0;\r\n  }\r\n</style>\r\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,QAAc;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,IAAMC,EAAA;2BAAND,GAAM,MAGUT,EAAY,EAAG,CAAA,eAH/BS,CAAM;AAAA;;AADJ,MAAArB,EAAA,IAAAK,CAAU,WAAIF,CAAa,KAAAoB,EAAAC,CAAA;AAAA;;MAY/BC,IAAGzB,EAAA,QAAA0B,GAAA,CAAA;SAAHD,GAAG,IAAA,MAAAzB,EAAA,IAMKM,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,CAAG,eAAHA,GAAG,CAAAQ,MAES/B,IAAe+B,GAAA,MAAf/B,CAAe;oBAF3BuB,GAAG,CAAA;;;UAeDS,IAAMC,EAAA;2BAAND,GAAM,MAGUtB,EAAa,CAAC,CAAA,eAH9BsB,CAAM;AAAA;;AADJ,MAAAlC,EAAA,IAAAK,CAAU,WAAID,CAAc,KAAAmB,EAAAa,CAAA;AAAA;;UA5BlChB,CAAG,WAHLF,CAAO,GAiBHlB,EAAA,MAAA,UAAAyB,GAGWjB,CAAiB,eApBhCU,CAAO;AAFA;;"}