@getmicdrop/venue-calendar 4.0.80 → 4.0.81
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.
- package/README.md +173 -128
- package/dist/{CarouselView.legacy-D2EY3K5p.js → CarouselView.legacy-Bn76lnuH.js} +3 -3
- package/dist/{CarouselView.legacy-D2EY3K5p.js.map → CarouselView.legacy-Bn76lnuH.js.map} +1 -1
- package/dist/{CartView-CXsAlVHs.js → CartView-lR1zLxmN.js} +277 -280
- package/dist/CartView-lR1zLxmN.js.map +1 -0
- package/dist/{Checkout-Bj85hSlQ.js → Checkout-D5mXj5zN.js} +69 -73
- package/dist/Checkout-D5mXj5zN.js.map +1 -0
- package/dist/Checkout-KyLZlwLk.js +1673 -0
- package/dist/Checkout-KyLZlwLk.js.map +1 -0
- package/dist/{Checkout.legacy-D4Uh3sQB.js → Checkout.legacy-Dl8Oh7y3.js} +77 -81
- package/dist/{Checkout.legacy-D4Uh3sQB.js.map → Checkout.legacy-Dl8Oh7y3.js.map} +1 -1
- package/dist/CheckoutTimer-Deo1mLnO.js +141 -0
- package/dist/CheckoutTimer-Deo1mLnO.js.map +1 -0
- package/dist/CollectionView-C1O9xfVC.js +338 -0
- package/dist/CollectionView-C1O9xfVC.js.map +1 -0
- package/dist/{CollectionView.legacy-CsBYjvZv.js → CollectionView.legacy-DK_mCA_g.js} +25 -28
- package/dist/{CollectionView.legacy-CsBYjvZv.js.map → CollectionView.legacy-DK_mCA_g.js.map} +1 -1
- package/dist/Event-B5WRygEf.js +2240 -0
- package/dist/Event-B5WRygEf.js.map +1 -0
- package/dist/EventPage-f1AOk4Jb.js +577 -0
- package/dist/EventPage-f1AOk4Jb.js.map +1 -0
- package/dist/{EventPage.legacy-DDVZNT-7.js → EventPage.legacy-Bk3PJyJs.js} +408 -411
- package/dist/{EventPage.legacy-DDVZNT-7.js.map → EventPage.legacy-Bk3PJyJs.js.map} +1 -1
- package/dist/{FeaturedView.legacy-BfOfYXRN.js → FeaturedView.legacy-BzCt1X1W.js} +19 -19
- package/dist/{FeaturedView.legacy-BfOfYXRN.js.map → FeaturedView.legacy-BzCt1X1W.js.map} +1 -1
- package/dist/{GalleryCard-CZkN5_Jb.js → GalleryCard-C1EKGErR.js} +14 -14
- package/dist/{GalleryCard-CZkN5_Jb.js.map → GalleryCard-C1EKGErR.js.map} +1 -1
- package/dist/{GalleryView.legacy-CziaM40i.js → GalleryView.legacy-BmQtZKl7.js} +3 -3
- package/dist/{GalleryView.legacy-CziaM40i.js.map → GalleryView.legacy-BmQtZKl7.js.map} +1 -1
- package/dist/{GroupedListView.legacy-CPy5md80.js → GroupedListView.legacy-D72fbNfA.js} +18 -18
- package/dist/{GroupedListView.legacy-CPy5md80.js.map → GroupedListView.legacy-D72fbNfA.js.map} +1 -1
- package/dist/Heading-Bwevh2c4.js +81 -0
- package/dist/Heading-Bwevh2c4.js.map +1 -0
- package/dist/ModalHeader-DKwE5ZYZ.js +22 -0
- package/dist/ModalHeader-DKwE5ZYZ.js.map +1 -0
- package/dist/OrderSummarySkeleton-DKWKZNLL.js +632 -0
- package/dist/OrderSummarySkeleton-DKWKZNLL.js.map +1 -0
- package/dist/{ScarcityBadge-Bungh7jy.js → ScarcityBadge-3cFxTOCh.js} +24 -28
- package/dist/{ScarcityBadge-Bungh7jy.js.map → ScarcityBadge-3cFxTOCh.js.map} +1 -1
- package/dist/{SeriesPage-BzyObY3_.js → SeriesPage-Cq4Q8Vah.js} +17 -21
- package/dist/{SeriesPage-BzyObY3_.js.map → SeriesPage-Cq4Q8Vah.js.map} +1 -1
- package/dist/{SeriesPage.legacy-BA00IzDL.js → SeriesPage.legacy-zvgW0S_y.js} +70 -74
- package/dist/{SeriesPage.legacy-BA00IzDL.js.map → SeriesPage.legacy-zvgW0S_y.js.map} +1 -1
- package/dist/{Success-NB1gahZr.js → Success-kyiEO6_Z.js} +186 -175
- package/dist/{Success-NB1gahZr.js.map → Success-kyiEO6_Z.js.map} +1 -1
- package/dist/{Success.legacy-D6cvUMzi.js → Success.legacy-BxKYmXgz.js} +58 -62
- package/dist/{Success.legacy-D6cvUMzi.js.map → Success.legacy-BxKYmXgz.js.map} +1 -1
- package/dist/Text-_bLxSPv-.js +158 -0
- package/dist/Text-_bLxSPv-.js.map +1 -0
- package/dist/{VenueCalendar-CISH7WGT.js → VenueCalendar-d8u6MKEu.js} +8138 -22881
- package/dist/VenueCalendar-d8u6MKEu.js.map +1 -0
- package/dist/ViewTicketsEmbed-DquJJVIK.js +2081 -0
- package/dist/ViewTicketsEmbed-DquJJVIK.js.map +1 -0
- package/dist/__SKIP_NAVIGATION__-CmipjatL.js +18 -0
- package/dist/__SKIP_NAVIGATION__-CmipjatL.js.map +1 -0
- package/dist/api/api.cjs +1 -1
- package/dist/api/api.cjs.map +1 -1
- package/dist/api/api.mjs +482 -374
- package/dist/api/api.mjs.map +1 -1
- package/dist/api/cta.d.ts +2 -10
- package/dist/api/transformers/address.d.ts +18 -0
- package/dist/api/transformers/cart.d.ts +19 -0
- package/dist/api/transformers/collection.d.ts +12 -0
- package/dist/api/transformers/event.d.ts +50 -1
- package/dist/api/transformers/giftCard.d.ts +11 -0
- package/dist/api/transformers/index.d.ts +10 -3
- package/dist/api/transformers/performer.d.ts +8 -0
- package/dist/api/transformers/series.d.ts +12 -0
- package/dist/api/types.d.ts +423 -383
- package/dist/api-BzICORqy.js +6 -0
- package/dist/{api-BV4wcElQ.js.map → api-BzICORqy.js.map} +1 -1
- package/dist/colors-CmP-sSZD.js.map +1 -1
- package/dist/{data-toggle-store.svelte-DU0VWdcf.js → data-toggle-store.svelte-BGbzblUJ.js} +6 -6
- package/dist/{data-toggle-store.svelte-DU0VWdcf.js.map → data-toggle-store.svelte-BGbzblUJ.js.map} +1 -1
- package/dist/index-BsWecoW1.js +63 -0
- package/dist/index-BsWecoW1.js.map +1 -0
- package/dist/labels-Bj_cocb1.js +966 -0
- package/dist/labels-Bj_cocb1.js.map +1 -0
- package/dist/transform-D7Oe8jUp.js +276 -0
- package/dist/transform-D7Oe8jUp.js.map +1 -0
- package/dist/types/index.d.ts +45 -0
- package/dist/venue-calendar.css +1 -1
- package/dist/venue-calendar.es.js +31 -37
- package/dist/venue-calendar.es.js.map +1 -1
- package/dist/venue-calendar.iife.js +40 -107
- package/dist/venue-calendar.iife.js.map +1 -1
- package/dist/venue-calendar.umd.js +38 -125
- package/dist/venue-calendar.umd.js.map +1 -1
- package/package.json +170 -168
- package/dist/CartView-CXsAlVHs.js.map +0 -1
- package/dist/Checkout-BPAkGlf6.js +0 -1531
- package/dist/Checkout-BPAkGlf6.js.map +0 -1
- package/dist/Checkout-Bj85hSlQ.js.map +0 -1
- package/dist/CheckoutTimer-CSc35x4t.js +0 -35
- package/dist/CheckoutTimer-CSc35x4t.js.map +0 -1
- package/dist/CollectionView-BitCEQzn.js +0 -148
- package/dist/CollectionView-BitCEQzn.js.map +0 -1
- package/dist/Event-BAKC5X6r.js +0 -1910
- package/dist/Event-BAKC5X6r.js.map +0 -1
- package/dist/EventPage-DxiAuBVc.js +0 -336
- package/dist/EventPage-DxiAuBVc.js.map +0 -1
- package/dist/Heading-AFd3o0xt.js +0 -44
- package/dist/Heading-AFd3o0xt.js.map +0 -1
- package/dist/OrderSummarySkeleton-dDKUH741.js +0 -16
- package/dist/OrderSummarySkeleton-dDKUH741.js.map +0 -1
- package/dist/Text-CXR2fhx6.js +0 -54
- package/dist/Text-CXR2fhx6.js.map +0 -1
- package/dist/VenueCalendar-CISH7WGT.js.map +0 -1
- package/dist/ViewTicketsEmbed-Bo16Y0sx.js +0 -2039
- package/dist/ViewTicketsEmbed-Bo16Y0sx.js.map +0 -1
- package/dist/__SKIP_NAVIGATION__-CJ96TTPE.js +0 -7
- package/dist/__SKIP_NAVIGATION__-CJ96TTPE.js.map +0 -1
- package/dist/api-BV4wcElQ.js +0 -12
- package/dist/labels-B2ebkcUD.js +0 -659
- package/dist/labels-B2ebkcUD.js.map +0 -1
- package/dist/transform-B3tJXUnG.js +0 -275
- package/dist/transform-B3tJXUnG.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Success.legacy-D6cvUMzi.js","sources":["../src/components/Views/Success.legacy.svelte"],"sourcesContent":["<script module>\r\n // @ts-nocheck legacy fallback (legacy=1 path), slated for deletion after VC finalization — not type-maintained\r\n\timport { createLogger } from '@getmicdrop/svelte-components';\r\n\tconst logger = createLogger('Success.legacy');\r\n</script>\r\n\r\n<script>\r\n // @ts-nocheck legacy fallback (legacy=1 path), slated for deletion after VC finalization — not type-maintained\r\n import { onMount } from 'svelte';\r\n import { transformEvent, getOrder } from '$lib/utils/utils.js';\r\n import { formatDateTime, venueTimeZone } from '@getmicdrop/svelte-components';\r\n import { CheckmarkFilled } from 'carbon-icons-svelte';\r\n // @constant-color-escape: confetti colors (coral, sky, mint, yellow, plum) are custom\r\n // brand-palette values with no SC token equivalent; they feed inline background-color\r\n // on absolutely-positioned confetti particles that are not SC-themeable by design.\r\n import { ACCENT } from '$lib/constants/colors.ts';\r\n\r\n let { data = {}, eventUrl = '', browseUrl = '/' } = $props();\r\n\r\n const {\r\n organizationID,\r\n orgSlug,\r\n slug,\r\n event: rawEvent,\r\n orderId: providedOrderId,\r\n customerEmail: providedCustomerEmail,\r\n eventName: providedEventName,\r\n eventDateTime: providedEventDateTime,\r\n eventLocation: providedEventLocation,\r\n } = data || {};\r\n\r\n let event = null;\r\n if (rawEvent) {\r\n try {\r\n event = transformEvent(rawEvent);\r\n } catch (e) {\r\n logger.warn('transformEvent failed in Success component:', e);\r\n event = rawEvent;\r\n }\r\n }\r\n\r\n let order = null;\r\n let error = null;\r\n let Email = $state('');\r\n let id = $state('');\r\n let name = $state('');\r\n let time = $state('');\r\n let Location = $state('');\r\n let orderId = providedOrderId || data?.orderId || '';\r\n\r\n // Animation states\r\n let showConfetti = $state(false);\r\n let showTicket = $state(false);\r\n let showDetails = $state(false);\r\n\r\n function formatEventDateTime(dateTimeString) {\r\n if (!dateTimeString) return '';\r\n // Canonical SC tz reader: casing-defensive, never-empty, defaults to\r\n // America/Los_Angeles (not UTC) so missing/invalid tz no longer renders\r\n // wrong-zone times. `event` may be transformed or raw.\r\n const tz = venueTimeZone(event);\r\n return formatDateTime(dateTimeString, {\r\n weekday: 'short',\r\n hour12: true,\r\n timeZone: tz,\r\n });\r\n }\r\n\r\n // Generate confetti particles\r\n const confettiColors = [\r\n ACCENT.coral,\r\n ACCENT.sky.light,\r\n ACCENT.sky[400],\r\n ACCENT.mint[600],\r\n ACCENT.yellow[300],\r\n ACCENT.plum,\r\n ACCENT.mint[500],\r\n ACCENT.yellow[500],\r\n ];\r\n const confettiParticles = Array.from({ length: 50 }, (_, i) => ({\r\n id: i,\r\n color: confettiColors[Math.floor(Math.random() * confettiColors.length)],\r\n left: Math.random() * 100,\r\n delay: Math.random() * 0.5,\r\n duration: 2 + Math.random() * 2,\r\n size: 6 + Math.random() * 8,\r\n rotation: Math.random() * 360,\r\n }));\r\n\r\n onMount(async () => {\r\n // Start animations\r\n setTimeout(() => {\r\n showConfetti = true;\r\n }, 100);\r\n\r\n setTimeout(() => {\r\n showTicket = true;\r\n }, 300);\r\n\r\n setTimeout(() => {\r\n showDetails = true;\r\n }, 800);\r\n\r\n try {\r\n let orderData = null;\r\n try {\r\n if (typeof getOrder === 'function' && orderId) {\r\n orderData = await getOrder(orderId);\r\n }\r\n } catch (e) {\r\n logger.warn(\r\n 'getOrder failed in Success component, falling back to provided data:',\r\n e\r\n );\r\n }\r\n\r\n if (orderData) {\r\n order = orderData;\r\n Email = orderData.customerEmail || providedCustomerEmail || '';\r\n id = orderData.id || orderId;\r\n name = orderData.eventName || event?.name || providedEventName || '';\r\n time = formatEventDateTime(\r\n orderData.eventDateTime ||\r\n event?.startDateTime ||\r\n providedEventDateTime\r\n );\r\n Location =\r\n orderData.eventLocation ||\r\n event?.location ||\r\n providedEventLocation ||\r\n '';\r\n } else {\r\n Email = providedCustomerEmail || '';\r\n id = orderId;\r\n name = providedEventName || event?.name || '';\r\n time = formatEventDateTime(\r\n providedEventDateTime || event?.startDateTime\r\n );\r\n Location = providedEventLocation || event?.location || '';\r\n }\r\n } catch (err) {\r\n logger.error('Error fetching order data:', err);\r\n error = err.message;\r\n Email = providedCustomerEmail || 'your-email@example.com';\r\n id = orderId;\r\n name = event?.name || providedEventName || '';\r\n time = formatEventDateTime(event?.startDateTime || providedEventDateTime);\r\n Location = event?.location || providedEventLocation || '';\r\n }\r\n });\r\n</script>\r\n\r\n<div class=\"success-container\" role=\"main\" aria-labelledby=\"success-title\">\r\n <!-- Confetti -->\r\n {#if showConfetti}\r\n <div class=\"confetti-container\" aria-hidden=\"true\">\r\n {#each confettiParticles as particle (particle.id)}\r\n <div\r\n class=\"confetti\"\r\n style=\"\r\n left: {particle.left}%;\r\n background-color: {particle.color};\r\n animation-delay: {particle.delay}s;\r\n animation-duration: {particle.duration}s;\r\n width: {particle.size}px;\r\n height: {particle.size}px;\r\n transform: rotate({particle.rotation}deg);\r\n \"\r\n ></div>\r\n {/each}\r\n </div>\r\n {/if}\r\n\r\n <div class=\"content-wrapper\">\r\n <!-- Ticket Machine Animation -->\r\n <div class=\"ticket-machine\" class:animate={showTicket}>\r\n <!-- Machine slot -->\r\n <div class=\"machine-slot\">\r\n <div class=\"slot-inner\"></div>\r\n </div>\r\n\r\n <!-- Ticket coming out -->\r\n <div class=\"ticket\" class:slide-out={showTicket}>\r\n <div class=\"ticket-content\">\r\n <div class=\"ticket-header\">\r\n <div class=\"success-badge\" aria-hidden=\"true\">\r\n <CheckmarkFilled class=\"check-icon\" />\r\n </div>\r\n <h1 id=\"success-title\" class=\"success-title\">You're all set!</h1>\r\n <p class=\"success-subtitle\">Your tickets have been confirmed</p>\r\n </div>\r\n\r\n <div class=\"ticket-divider\">\r\n <div class=\"divider-notch left\"></div>\r\n <div class=\"divider-line\"></div>\r\n <div class=\"divider-notch right\"></div>\r\n </div>\r\n\r\n <dl\r\n class=\"ticket-details\"\r\n class:fade-in={showDetails}\r\n aria-label=\"Order details\"\r\n >\r\n <div class=\"detail-row\">\r\n <dt class=\"detail-label\">Email</dt>\r\n <dd class=\"detail-value\">{Email || 'Loading...'}</dd>\r\n </div>\r\n\r\n {#if id}\r\n <div class=\"detail-row\">\r\n <dt class=\"detail-label\">Order ID</dt>\r\n <dd class=\"detail-value order-id\">#{id}</dd>\r\n </div>\r\n {/if}\r\n\r\n {#if name}\r\n <div class=\"detail-row\">\r\n <dt class=\"detail-label\">Event</dt>\r\n <dd class=\"detail-value event-name\">{name}</dd>\r\n </div>\r\n {/if}\r\n\r\n {#if time}\r\n <div class=\"detail-row\">\r\n <dt class=\"detail-label\">When</dt>\r\n <dd class=\"detail-value\"><time>{time}</time></dd>\r\n </div>\r\n {/if}\r\n\r\n {#if Location}\r\n <div class=\"detail-row\">\r\n <dt class=\"detail-label\">Where</dt>\r\n <dd class=\"detail-value\">{Location}</dd>\r\n </div>\r\n {/if}\r\n </dl>\r\n\r\n <div class=\"ticket-footer\">\r\n <p class=\"footer-text\">Check your email for your tickets</p>\r\n </div>\r\n </div>\r\n\r\n <!-- Ticket stub pattern -->\r\n <div class=\"ticket-stub\"></div>\r\n </div>\r\n </div>\r\n\r\n <!-- Navigation CTAs -->\r\n {#if eventUrl || browseUrl}\r\n <nav class=\"nav-ctas\" class:fade-in={showDetails} aria-label=\"Next steps\">\r\n {#if eventUrl}\r\n <a href={eventUrl} class=\"nav-link secondary\">Back to event</a>\r\n {/if}\r\n {#if browseUrl}\r\n <a href={browseUrl} class=\"nav-link primary\">Browse more events</a>\r\n {/if}\r\n </nav>\r\n {/if}\r\n </div>\r\n</div>\r\n\r\n<style>\r\n .success-container {\r\n position: relative;\r\n min-height: 100vh;\r\n overflow: hidden;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 1.25rem;\r\n background: linear-gradient(\r\n 180deg,\r\n hsl(var(--bg-primary)) 0%,\r\n hsl(var(--bg-secondary)) 100%\r\n );\r\n\r\n &:is([data-theme=\"dark\"], [data-theme=\"dark\"] *) {\r\n background: linear-gradient(\r\n 180deg,\r\n hsl(var(--bg-primary)) 0%,\r\n hsl(var(--bg-primary)) 100%\r\n );\r\n }\r\n }\r\n\r\n /* Confetti */\r\n .confetti-container {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n height: 100%;\r\n pointer-events: none;\r\n overflow: hidden;\r\n }\r\n\r\n .confetti {\r\n position: absolute;\r\n top: -20px;\r\n border-radius: 2px;\r\n animation: confetti-fall linear forwards;\r\n }\r\n\r\n @keyframes confetti-fall {\r\n 0% {\r\n transform: translateY(0) rotate(0deg);\r\n opacity: 1;\r\n }\r\n\r\n 100% {\r\n transform: translateY(100vh) rotate(720deg);\r\n opacity: 0;\r\n }\r\n }\r\n\r\n /* Content wrapper */\r\n .content-wrapper {\r\n position: relative;\r\n z-index: var(--z-sticky);\r\n width: 100%;\r\n max-width: 380px;\r\n }\r\n\r\n /* Ticket machine */\r\n .ticket-machine {\r\n position: relative;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n }\r\n\r\n .machine-slot {\r\n width: 100%;\r\n height: 16px;\r\n background: linear-gradient(\r\n 180deg,\r\n hsl(var(--muted)) 0%,\r\n hsl(var(--bg-primary)) 100%\r\n );\r\n border-radius: 8px 8px 0 0;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-shadow: 0 4px 12px color-mix(in srgb, black 20%, transparent);\r\n position: relative;\r\n z-index: var(--z-base);\r\n }\r\n\r\n .slot-inner {\r\n width: 80%;\r\n height: 4px;\r\n background: hsl(var(--bg-primary));\r\n border-radius: 2px;\r\n }\r\n\r\n /* Ticket */\r\n .ticket {\r\n width: 100%;\r\n background: hsl(var(--bg-primary));\r\n border-radius: 0 0 16px 16px;\r\n box-shadow: 0 8px 32px color-mix(in srgb, black 12%, transparent);\r\n overflow: hidden;\r\n transform: translateY(-100%);\r\n opacity: 0;\r\n transition:\r\n transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1),\r\n opacity 0.3s ease;\r\n }\r\n\r\n .ticket.slide-out {\r\n transform: translateY(0);\r\n opacity: 1;\r\n }\r\n\r\n .ticket-content {\r\n padding: 32px 24px 24px;\r\n }\r\n\r\n .ticket-header {\r\n text-align: center;\r\n margin-bottom: 24px;\r\n }\r\n\r\n .success-badge {\r\n width: 64px;\r\n height: 64px;\r\n background: linear-gradient(\r\n 135deg,\r\n hsl(var(--accent-success)) 0%,\r\n hsl(var(--accent-success)) 100%\r\n );\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n margin: 0 auto 16px;\r\n animation: badge-pop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) 0.5s both;\r\n }\r\n\r\n @keyframes badge-pop {\r\n 0% {\r\n transform: scale(0);\r\n }\r\n\r\n 100% {\r\n transform: scale(1);\r\n }\r\n }\r\n\r\n .success-badge :global(.check-icon) {\r\n width: 32px;\r\n height: 32px;\r\n color: hsl(var(--bg-primary));\r\n }\r\n\r\n .success-title {\r\n font-size: 1.5rem;\r\n line-height: 2rem;\r\n font-weight: 600;\r\n color: hsl(var(--text-primary));\r\n margin-bottom: 0.5rem;\r\n }\r\n\r\n .success-subtitle {\r\n font-size: 0.875rem;\r\n line-height: 1.25rem;\r\n color: hsl(var(--text-secondary));\r\n margin: 0;\r\n }\r\n\r\n /* Ticket divider */\r\n .ticket-divider {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n margin: 0 -24px 24px;\r\n padding: 0 24px;\r\n }\r\n\r\n .divider-notch {\r\n width: 1rem;\r\n height: 1rem;\r\n border-radius: 9999px;\r\n position: absolute;\r\n background-color: hsl(var(--bg-primary));\r\n }\r\n\r\n .divider-notch.left {\r\n left: -8px;\r\n }\r\n\r\n .divider-notch.right {\r\n right: -8px;\r\n }\r\n\r\n .divider-line {\r\n flex: 1 1 0%;\r\n height: 0.125rem;\r\n background: repeating-linear-gradient(\r\n 90deg,\r\n hsl(var(--stroke-primary)) 0,\r\n hsl(var(--stroke-primary)) 8px,\r\n transparent 8px,\r\n transparent 16px\r\n );\r\n\r\n &:is([data-theme=\"dark\"], [data-theme=\"dark\"] *) {\r\n background: repeating-linear-gradient(\r\n 90deg,\r\n hsl(var(--text-secondary)) 0,\r\n hsl(var(--text-secondary)) 8px,\r\n transparent 8px,\r\n transparent 16px\r\n );\r\n }\r\n }\r\n\r\n /* Ticket details */\r\n .ticket-details {\r\n opacity: 0;\r\n transform: translateY(10px);\r\n transition:\r\n opacity 0.4s ease,\r\n transform 0.4s ease;\r\n }\r\n\r\n .ticket-details.fade-in {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n .detail-row {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 0.25rem;\r\n padding-top: 0.75rem;\r\n padding-bottom: 0.75rem;\r\n border-bottom: 1px solid hsl(var(--stroke-primary) / 50%);\r\n }\r\n\r\n .detail-row:last-child {\r\n border-bottom: 0;\r\n }\r\n\r\n .detail-label {\r\n font-size: 0.75rem;\r\n line-height: 1rem;\r\n font-weight: 600;\r\n color: hsl(var(--text-tertiary));\r\n text-transform: uppercase;\r\n letter-spacing: 0.025em;\r\n }\r\n\r\n .detail-value {\r\n font-size: 0.875rem;\r\n line-height: 1.25rem;\r\n font-weight: 500;\r\n color: hsl(var(--text-primary));\r\n overflow-wrap: break-word;\r\n }\r\n\r\n .detail-value.order-id {\r\n color: hsl(var(--brand-primary));\r\n font-family: 'SF Mono', Consolas, monospace;\r\n }\r\n\r\n .detail-value.event-name {\r\n font-size: 1rem;\r\n line-height: 1.5rem;\r\n font-weight: 600;\r\n }\r\n\r\n /* Ticket footer */\r\n .ticket-footer {\r\n margin-top: 1.5rem;\r\n padding: 1rem;\r\n border-radius: 0.5rem;\r\n text-align: center;\r\n background-color: hsl(var(--bg-secondary) / 50%);\r\n }\r\n\r\n .footer-text {\r\n font-size: 0.875rem;\r\n line-height: 1.25rem;\r\n color: hsl(var(--text-secondary));\r\n margin: 0;\r\n }\r\n\r\n /* Ticket stub pattern */\r\n .ticket-stub {\r\n height: 1.5rem;\r\n background: linear-gradient(\r\n 90deg,\r\n transparent 0,\r\n transparent 8px,\r\n hsl(var(--stroke-primary) / 30%) 8px,\r\n hsl(var(--stroke-primary) / 30%) 16px\r\n );\r\n background-size: 16px 100%;\r\n }\r\n\r\n /* Navigation CTAs */\r\n .nav-ctas {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 0.75rem;\r\n margin-top: 1.5rem;\r\n opacity: 0;\r\n transform: translateY(10px);\r\n transition:\r\n opacity 0.4s ease 0.2s,\r\n transform 0.4s ease 0.2s;\r\n }\r\n\r\n .nav-ctas.fade-in {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n .nav-link {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 0.75rem 1rem;\r\n border-radius: 0.5rem;\r\n font-size: 0.875rem;\r\n line-height: 1.25rem;\r\n font-weight: 600;\r\n text-decoration: none;\r\n transition:\r\n background-color 0.15s,\r\n color 0.15s;\r\n }\r\n\r\n .nav-link.primary {\r\n background: hsl(var(--brand-primary, 220 90% 56%));\r\n color: hsl(var(--text-on-primary, 0 0% 100%));\r\n }\r\n\r\n .nav-link.primary:hover {\r\n filter: brightness(0.95);\r\n }\r\n\r\n .nav-link.secondary {\r\n background-color: hsl(var(--bg-tertiary));\r\n color: hsl(var(--text-secondary));\r\n }\r\n\r\n .nav-link.secondary:hover {\r\n background-color: hsl(var(--bg-quaternary));\r\n }\r\n\r\n /* Responsive */\r\n @media (width <= 480px) {\r\n .success-container {\r\n padding: 16px;\r\n }\r\n\r\n .ticket-content {\r\n padding: 24px 20px 20px;\r\n }\r\n\r\n .success-title {\r\n font-size: 20px;\r\n }\r\n\r\n .success-badge {\r\n width: 56px;\r\n height: 56px;\r\n }\r\n\r\n .success-badge :global(.check-icon) {\r\n width: 28px;\r\n height: 28px;\r\n }\r\n }\r\n</style>\r\n"],"names":["logger","createLogger","data","$","$$props","eventUrl","browseUrl","organizationID","orgSlug","slug","rawEvent","providedOrderId","providedCustomerEmail","providedEventName","providedEventDateTime","providedEventLocation","event","transformEvent","e","order","Email","id","name","time","Location","orderId","showConfetti","showTicket","showDetails","formatEventDateTime","dateTimeString","tz","venueTimeZone","formatDateTime","confettiColors","ACCENT","confettiParticles","_","i","onMount","orderData","getOrder","err","div","root","div_1","root_1","particle","$$anchor","div_2","root_2","$$render","consequent","div_3","node","div_4","div_5","div_6","div_7","div_8","CheckmarkFilled","node_1","dl","div_9","dd","div_10","root_3","dd_1","consequent_1","div_11","root_4","dd_2","consequent_2","div_12","root_5","dd_3","time_1","consequent_3","div_13","root_6","dd_4","consequent_4","nav","root_7","a","root_8","consequent_5","a_1","root_9","consequent_6","classes_3","consequent_7","classes","classes_1","classes_2","text"],"mappings":";;;;;;;;;MAGOA,IAASC,GAAa,gBAAgB;;kBAG7C;;MAWQC,IAAIC,EAAA,KAAAC,GAAA,QAAA,IAAA,OAAA,CAAA,EAAA,GAAOC,6BAAW,EAAE,GAAEC,8BAAY,GAAG;;IAG7C,gBAAAC;AAAA,IACA,SAAAC;AAAA,IACA,MAAAC;AAAA,IACA,OAAOC;AAAA,IACP,SAASC;AAAA,IACT,eAAeC;AAAA,IACf,WAAWC;AAAA,IACX,eAAeC;AAAA,IACf,eAAeC;AAAA,MACbb,EAAI,KAAA,CAAA;AAEJ,MAAAc,IAAQ;AACR,MAAAN;QACE;AACF,MAAAM,IAAQC,GAAeP,CAAQ;AAAA,IACjC,SAASQ,GAAG;AACV,MAAAlB,EAAO,KAAK,+CAA+CkB,CAAC,GAC5DF,IAAQN;AAAA,IACV;AAGE,MAAAS,IAAQ,MAERC,IAAQjB,EAAA,MAAO,EAAE,GACjBkB,IAAKlB,EAAA,MAAO,EAAE,GACdmB,IAAOnB,EAAA,MAAO,EAAE,GAChBoB,IAAOpB,EAAA,MAAO,EAAE,GAChBqB,IAAWrB,EAAA,MAAO,EAAE,GACpBsB,IAAUd,KAAmBT,EAAI,GAAE,WAAW,IAG9CwB,IAAevB,EAAA,MAAO,EAAK,GAC3BwB,IAAaxB,EAAA,MAAO,EAAK,GACzByB,IAAczB,EAAA,MAAO,EAAK;WAErB0B,EAAoBC,GAAgB;AACtC,QAAA,CAAAA,UAAuB;UAItBC,IAAKC,GAAchB,CAAK;AACvB,WAAAiB,GAAeH,GAAc,EAClC,SAAS,SACT,QAAQ,IACR,UAAUC,GAAE;AAAA,EAEhB;QAGMG,IAAc;AAAA,IAClBC,EAAO;AAAA,IACPA,EAAO,IAAI;AAAA,IACXA,EAAO,IAAI,GAAG;AAAA,IACdA,EAAO,KAAK,GAAG;AAAA,IACfA,EAAO,OAAO,GAAG;AAAA,IACjBA,EAAO;AAAA,IACPA,EAAO,KAAK,GAAG;AAAA,IACfA,EAAO,OAAO,GAAG;AAAA,KAEbC,IAAoB,MAAM,KAAI,EAAG,QAAQ,GAAE,GAAA,CAAKC,GAAGC,OAAC;AAAA,IACxD,IAAIA;AAAA,IACJ,OAAOJ,EAAe,KAAK,MAAM,KAAK,OAAM,IAAKA,EAAe,MAAM,CAAA;AAAA,IACtE,MAAM,KAAK,OAAM,IAAK;AAAA,IACtB,OAAO,KAAK,OAAM,IAAK;AAAA,IACvB,UAAU,IAAI,KAAK,OAAM,IAAK;AAAA,IAC9B,MAAM,IAAI,KAAK,OAAM,IAAK;AAAA,IAC1B,UAAU,KAAK,WAAW;AAAA;AAG5B,EAAAK,eAAoB;AAElB;AAAA,YAAiB;AACf,QAAApC,EAAA,IAAAuB,GAAe,EAAI;AAAA,MACrB;AAAA,MAAG;AAAA,OAEH;AAAA,YAAiB;AACf,QAAAvB,EAAA,IAAAwB,GAAa,EAAI;AAAA,MACnB;AAAA,MAAG;AAAA,OAEH;AAAA,YAAiB;AACf,QAAAxB,EAAA,IAAAyB,GAAc,EAAI;AAAA,MACpB;AAAA,MAAG;AAAA;QAEC;AACE,UAAAY,IAAY;UACZ;AACS,QAAA,OAAAC,KAAa,cAAchB,MACpCe,IAAS,MAASC,EAAShB,CAAO;AAAA,MAEtC,SAASP,GAAG;AACV,QAAAlB,EAAO,KACL,wEACAkB,CAAC;AAAA,MAEL;AAEI,MAAAsB,KACFrB,IAAQqB,GACRrC,EAAA,IAAAiB,GAAQoB,EAAU,iBAAiB5B,KAAyB,IAAE,EAAA,GAC9DT,EAAA,IAAAkB,GAAKmB,EAAU,MAAMf,GAAO,EAAA,SAC5BH,GAAOkB,EAAU,aAAaxB,GAAO,QAAQH,KAAqB,IAAE,EAAA,SACpEU,GAAOM,EACLW,EAAU,iBACRxB,GAAO,iBACPF,CAAqB,GAAA,EAAA,SAEzBU,GACEgB,EAAU,iBACVxB,GAAO,YACPD,KACA,IAAE,EAAA,YAEJK,GAAQR,KAAyB,IAAE,EAAA,GACnCT,EAAA,IAAAkB,GAAKI,GAAO,EAAA,GACZtB,EAAA,IAAAmB,GAAOT,KAAqBG,GAAO,QAAQ,IAAE,EAAA,GAC7Cb,EAAA,IAAAoB,GAAOM,EACLf,KAAyBE,GAAO,aAAa,GAAA,EAAA,GAE/Cb,EAAA,IAAAqB,GAAWT,KAAyBC,GAAO,YAAY,IAAE,EAAA;AAAA,IAE7D,SAAS0B,GAAK;AACZ,MAAA1C,EAAO,MAAM,8BAA8B0C,CAAG,GACtCA,EAAI,eACZtB,GAAQR,KAAyB,0BAAwB,EAAA,GACzDT,EAAA,IAAAkB,GAAKI,GAAO,EAAA,GACZtB,EAAA,IAAAmB,GAAON,GAAO,QAAQH,KAAqB,IAAE,EAAA,GAC7CV,EAAA,IAAAoB,GAAOM,EAAoBb,GAAO,iBAAiBF,CAAqB,GAAA,EAAA,GACxEX,EAAA,IAAAqB,GAAWR,GAAO,YAAYD,KAAyB,IAAE,EAAA;AAAA,IAC3D;AAAA,EACF,CAAC;MAGF4B,IAAGC,GAAA,eAAHD,CAAG;;;UAGCE,IAAGC,GAAA;aAAHD,GAAG,IAAA,MACKT,GAAiB,CAAIW,MAAUA,EAAS,IAAE,CAAAC,GAArBD,MAAQ;YACjCE,IAAGC,GAAA;4CAAHD,GAAG;AAAA,oBAGO9C,EAAA,IAAA4C,CAAQ,EAAC,QAAI,EAAA;AAAA,gCACD5C,EAAA,IAAA4C,CAAQ,EAAC,SAAK,EAAA;AAAA,+BACf5C,EAAA,IAAA4C,CAAQ,EAAC,SAAK,EAAA;AAAA,kCACX5C,EAAA,IAAA4C,CAAQ,EAAC,YAAQ,EAAA;AAAA,qBAC9B5C,EAAA,IAAA4C,CAAQ,EAAC,QAAI,EAAA;AAAA,sBACZ5C,EAAA,IAAA4C,CAAQ,EAAC,QAAI,EAAA;AAAA,gCACH5C,EAAA,IAAA4C,CAAQ,EAAC,YAAQ,EAAA;AAAA,2BATvCE,CAAG;AAAA,kBAFPJ,CAAG,eAAHA,CAAG;AAAA;;YADDnB,CAAY,KAAAyB,EAAAC,CAAA;AAAA;;MAmBhBC,IAAGlD,EAAA,QAAAmD,GAAA,CAAA,GAEDC,YAFFF,CAAG;;AASC,MAAAG,sBAPFD,CAAG,GAAA,CAAA;;AAQC,MAAAE,YADFD,CAAG,GAECE,YADFD,CAAG,GAECE,YADFD,CAAG,gBACDC,CAAG;AACD,EAAAC,GAAeC,IAAA,EAAA,OAAA,aAAA,CAAA,WADjBF,CAAG,sBADLD,CAAG;AAcH,MAAAI,cAdAJ,GAAG,CAAA;;AAmBD,MAAAK,YALFD,CAAE,GAOEE,sBAFFD,CAAG,GAAA,CAAA,gBAEDC,GAAE,EAAA;UAAFA,CAAE,WAFJD,CAAG;oBAAHA,GAAG,CAAA;;;UAMDE,IAAGC,GAAA,GAEDC,sBAFFF,CAAG,GAAA,CAAA,eAEDE,CAAE;cAAFA,CAAE,WAFJF,CAAG,mDAEkC5C,CAAE,KAAA,EAAA,EAAA,CAAA,eAFvC4C,CAAG;AAAA;;YADD5C,CAAE,KAAA8B,EAAAiB,EAAA;AAAA;;;;;UAQJC,IAAGC,GAAA,GAEDC,sBAFFF,CAAG,GAAA,CAAA,eAEDE,GAAE,EAAA;cAAFA,CAAE,WAFJF,CAAG,+CAEmC/C,CAAI,CAAA,CAAA,eAF1C+C,CAAG;AAAA;;YADD/C,CAAI,KAAA6B,EAAAqB,EAAA;AAAA;;;;;UAQNC,IAAGC,GAAA,GAEDC,sBAFFF,CAAG,GAAA,CAAA,GAEwBG,YAAzBD,CAAE,eAAuBC,GAAI,EAAA;cAAJA,CAAI,WAA7BD,CAAE,WAFJF,CAAG,+CAE8BlD,CAAI,CAAA,CAAA,eAFrCkD,CAAG;AAAA;;YADDlD,CAAI,KAAA4B,EAAA0B,EAAA;AAAA;;;;;UAQNC,IAAGC,GAAA,GAEDC,sBAFFF,CAAG,GAAA,CAAA,eAEDE,GAAE,EAAA;cAAFA,CAAE,WAFJF,CAAG,+CAEwBtD,CAAQ,CAAA,CAAA,eAFnCsD,CAAG;AAAA;;YADDtD,CAAQ,KAAA2B,EAAA8B,EAAA;AAAA;;UA/BdnB,CAAE,sBAfJL,CAAG,sBADLD,CAAG,WAPLD,CAAG;qBAAHA,GAAG,CAAA;;;UA0ED2B,IAAGC,GAAA;;sBAAHD,CAAG;;;cAECE,IAACC,GAAA;AAAD,UAAAlF,EAAA,gBAAA,MAAAA,EAAA,cAAAiF,WAAQ/E,EAAQ,CAAA,CAAA,eAAhB+E,CAAC;AAAA;;UADC/E,EAAQ,KAAA8C,EAAAmC,CAAA;AAAA;;;;;cAIVC,IAACC,GAAA;AAAD,UAAArF,EAAA,gBAAA,MAAAA,EAAA,cAAAoF,WAAQjF,EAAS,CAAA,CAAA,eAAjBiF,CAAC;AAAA;;UADCjF,EAAS,KAAA6C,EAAAsC,EAAA;AAAA;;cAJfP,CAAG,GAAH/E,EAAA,gBAAA,MAAAuF,IAAAvF,EAAA,UAAA+E,4DAAoCtD,CAAW,EAAA,CAAA,CAAA,eAA/CsD,CAAG;AAAA;;AADD,OAAA7E,EAAQ,KAAIC,QAAS6C,EAAAwC,EAAA;AAAA;;UA3E3BtC,CAAG,WArBLV,CAAG;AAuBC,IAAAiD,IAAAzF,EAAA,UAAAoD,gEAA0C5B,CAAU,EAAA,CAAA,GAOlDkE,IAAA1F,EAAA,UAAAqD,4DAAoC7B,CAAU,EAAA,CAAA,GAgB1CmE,IAAA3F,EAAA,UAAA2D,kEAEgBlC,CAAW,EAAA,CAAA,GAKEzB,EAAA,SAAA4F,IAAA5F,EAAA,IAAAiB,CAAK,KAAI,YAAY;AAAA,kBArD5DuB,CAAG;AAFI;"}
|
|
1
|
+
{"version":3,"file":"Success.legacy-BxKYmXgz.js","sources":["../src/components/Views/Success.legacy.svelte"],"sourcesContent":["<script module>\r\n // @ts-nocheck legacy fallback (legacy=1 path), slated for deletion after VC finalization — not type-maintained\r\n\timport { createLogger } from '@getmicdrop/svelte-components';\r\n\tconst logger = createLogger('Success.legacy');\r\n</script>\r\n\r\n<script>\r\n // @ts-nocheck legacy fallback (legacy=1 path), slated for deletion after VC finalization — not type-maintained\r\n import { onMount } from 'svelte';\r\n import { transformEvent, getOrder } from '$lib/utils/utils.js';\r\n import { formatDateTime, venueTimeZone } from '@getmicdrop/svelte-components';\r\n import { CheckmarkFilled } from 'carbon-icons-svelte';\r\n // @constant-color-escape: confetti colors (coral, sky, mint, yellow, plum) are custom\r\n // brand-palette values with no SC token equivalent; they feed inline background-color\r\n // on absolutely-positioned confetti particles that are not SC-themeable by design.\r\n import { ACCENT } from '$lib/constants/colors.ts';\r\n\r\n let { data = {}, eventUrl = '', browseUrl = '/' } = $props();\r\n\r\n const {\r\n organizationID,\r\n orgSlug,\r\n slug,\r\n event: rawEvent,\r\n orderId: providedOrderId,\r\n customerEmail: providedCustomerEmail,\r\n eventName: providedEventName,\r\n eventDateTime: providedEventDateTime,\r\n eventLocation: providedEventLocation,\r\n } = data || {};\r\n\r\n let event = null;\r\n if (rawEvent) {\r\n try {\r\n event = transformEvent(rawEvent);\r\n } catch (e) {\r\n logger.warn('transformEvent failed in Success component:', e);\r\n event = rawEvent;\r\n }\r\n }\r\n\r\n let order = null;\r\n let error = null;\r\n let Email = $state('');\r\n let id = $state('');\r\n let name = $state('');\r\n let time = $state('');\r\n let Location = $state('');\r\n let orderId = providedOrderId || data?.orderId || '';\r\n\r\n // Animation states\r\n let showConfetti = $state(false);\r\n let showTicket = $state(false);\r\n let showDetails = $state(false);\r\n\r\n function formatEventDateTime(dateTimeString) {\r\n if (!dateTimeString) return '';\r\n // Canonical SC tz reader: casing-defensive, never-empty, defaults to\r\n // America/Los_Angeles (not UTC) so missing/invalid tz no longer renders\r\n // wrong-zone times. `event` may be transformed or raw.\r\n const tz = venueTimeZone(event);\r\n return formatDateTime(dateTimeString, {\r\n weekday: 'short',\r\n hour12: true,\r\n timeZone: tz,\r\n });\r\n }\r\n\r\n // Generate confetti particles\r\n const confettiColors = [\r\n ACCENT.coral,\r\n ACCENT.sky.light,\r\n ACCENT.sky[400],\r\n ACCENT.mint[600],\r\n ACCENT.yellow[300],\r\n ACCENT.plum,\r\n ACCENT.mint[500],\r\n ACCENT.yellow[500],\r\n ];\r\n const confettiParticles = Array.from({ length: 50 }, (_, i) => ({\r\n id: i,\r\n color: confettiColors[Math.floor(Math.random() * confettiColors.length)],\r\n left: Math.random() * 100,\r\n delay: Math.random() * 0.5,\r\n duration: 2 + Math.random() * 2,\r\n size: 6 + Math.random() * 8,\r\n rotation: Math.random() * 360,\r\n }));\r\n\r\n onMount(async () => {\r\n // Start animations\r\n setTimeout(() => {\r\n showConfetti = true;\r\n }, 100);\r\n\r\n setTimeout(() => {\r\n showTicket = true;\r\n }, 300);\r\n\r\n setTimeout(() => {\r\n showDetails = true;\r\n }, 800);\r\n\r\n try {\r\n let orderData = null;\r\n try {\r\n if (typeof getOrder === 'function' && orderId) {\r\n orderData = await getOrder(orderId);\r\n }\r\n } catch (e) {\r\n logger.warn(\r\n 'getOrder failed in Success component, falling back to provided data:',\r\n e\r\n );\r\n }\r\n\r\n if (orderData) {\r\n order = orderData;\r\n Email = orderData.customerEmail || providedCustomerEmail || '';\r\n id = orderData.id || orderId;\r\n name = orderData.eventName || event?.name || providedEventName || '';\r\n time = formatEventDateTime(\r\n orderData.eventDateTime ||\r\n event?.startDateTime ||\r\n providedEventDateTime\r\n );\r\n Location =\r\n orderData.eventLocation ||\r\n event?.location ||\r\n providedEventLocation ||\r\n '';\r\n } else {\r\n Email = providedCustomerEmail || '';\r\n id = orderId;\r\n name = providedEventName || event?.name || '';\r\n time = formatEventDateTime(\r\n providedEventDateTime || event?.startDateTime\r\n );\r\n Location = providedEventLocation || event?.location || '';\r\n }\r\n } catch (err) {\r\n logger.error('Error fetching order data:', err);\r\n error = err.message;\r\n Email = providedCustomerEmail || 'your-email@example.com';\r\n id = orderId;\r\n name = event?.name || providedEventName || '';\r\n time = formatEventDateTime(event?.startDateTime || providedEventDateTime);\r\n Location = event?.location || providedEventLocation || '';\r\n }\r\n });\r\n</script>\r\n\r\n<div class=\"success-container\" role=\"main\" aria-labelledby=\"success-title\">\r\n <!-- Confetti -->\r\n {#if showConfetti}\r\n <div class=\"confetti-container\" aria-hidden=\"true\">\r\n {#each confettiParticles as particle (particle.id)}\r\n <div\r\n class=\"confetti\"\r\n style=\"\r\n left: {particle.left}%;\r\n background-color: {particle.color};\r\n animation-delay: {particle.delay}s;\r\n animation-duration: {particle.duration}s;\r\n width: {particle.size}px;\r\n height: {particle.size}px;\r\n transform: rotate({particle.rotation}deg);\r\n \"\r\n ></div>\r\n {/each}\r\n </div>\r\n {/if}\r\n\r\n <div class=\"content-wrapper\">\r\n <!-- Ticket Machine Animation -->\r\n <div class=\"ticket-machine\" class:animate={showTicket}>\r\n <!-- Machine slot -->\r\n <div class=\"machine-slot\">\r\n <div class=\"slot-inner\"></div>\r\n </div>\r\n\r\n <!-- Ticket coming out -->\r\n <div class=\"ticket\" class:slide-out={showTicket}>\r\n <div class=\"ticket-content\">\r\n <div class=\"ticket-header\">\r\n <div class=\"success-badge\" aria-hidden=\"true\">\r\n <CheckmarkFilled class=\"check-icon\" />\r\n </div>\r\n <h1 id=\"success-title\" class=\"success-title\">You're all set!</h1>\r\n <p class=\"success-subtitle\">Your tickets have been confirmed</p>\r\n </div>\r\n\r\n <div class=\"ticket-divider\">\r\n <div class=\"divider-notch left\"></div>\r\n <div class=\"divider-line\"></div>\r\n <div class=\"divider-notch right\"></div>\r\n </div>\r\n\r\n <dl\r\n class=\"ticket-details\"\r\n class:fade-in={showDetails}\r\n aria-label=\"Order details\"\r\n >\r\n <div class=\"detail-row\">\r\n <dt class=\"detail-label\">Email</dt>\r\n <dd class=\"detail-value\">{Email || 'Loading...'}</dd>\r\n </div>\r\n\r\n {#if id}\r\n <div class=\"detail-row\">\r\n <dt class=\"detail-label\">Order ID</dt>\r\n <dd class=\"detail-value order-id\">#{id}</dd>\r\n </div>\r\n {/if}\r\n\r\n {#if name}\r\n <div class=\"detail-row\">\r\n <dt class=\"detail-label\">Event</dt>\r\n <dd class=\"detail-value event-name\">{name}</dd>\r\n </div>\r\n {/if}\r\n\r\n {#if time}\r\n <div class=\"detail-row\">\r\n <dt class=\"detail-label\">When</dt>\r\n <dd class=\"detail-value\"><time>{time}</time></dd>\r\n </div>\r\n {/if}\r\n\r\n {#if Location}\r\n <div class=\"detail-row\">\r\n <dt class=\"detail-label\">Where</dt>\r\n <dd class=\"detail-value\">{Location}</dd>\r\n </div>\r\n {/if}\r\n </dl>\r\n\r\n <div class=\"ticket-footer\">\r\n <p class=\"footer-text\">Check your email for your tickets</p>\r\n </div>\r\n </div>\r\n\r\n <!-- Ticket stub pattern -->\r\n <div class=\"ticket-stub\"></div>\r\n </div>\r\n </div>\r\n\r\n <!-- Navigation CTAs -->\r\n {#if eventUrl || browseUrl}\r\n <nav class=\"nav-ctas\" class:fade-in={showDetails} aria-label=\"Next steps\">\r\n {#if eventUrl}\r\n <a href={eventUrl} class=\"nav-link secondary\">Back to event</a>\r\n {/if}\r\n {#if browseUrl}\r\n <a href={browseUrl} class=\"nav-link primary\">Browse more events</a>\r\n {/if}\r\n </nav>\r\n {/if}\r\n </div>\r\n</div>\r\n\r\n<style>\r\n .success-container {\r\n position: relative;\r\n min-height: 100vh;\r\n overflow: hidden;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 1.25rem;\r\n background: linear-gradient(\r\n 180deg,\r\n hsl(var(--bg-primary)) 0%,\r\n hsl(var(--bg-secondary)) 100%\r\n );\r\n\r\n &:is([data-theme=\"dark\"], [data-theme=\"dark\"] *) {\r\n background: linear-gradient(\r\n 180deg,\r\n hsl(var(--bg-primary)) 0%,\r\n hsl(var(--bg-primary)) 100%\r\n );\r\n }\r\n }\r\n\r\n /* Confetti */\r\n .confetti-container {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n height: 100%;\r\n pointer-events: none;\r\n overflow: hidden;\r\n }\r\n\r\n .confetti {\r\n position: absolute;\r\n top: -20px;\r\n border-radius: 2px;\r\n animation: confetti-fall linear forwards;\r\n }\r\n\r\n @keyframes confetti-fall {\r\n 0% {\r\n transform: translateY(0) rotate(0deg);\r\n opacity: 1;\r\n }\r\n\r\n 100% {\r\n transform: translateY(100vh) rotate(720deg);\r\n opacity: 0;\r\n }\r\n }\r\n\r\n /* Content wrapper */\r\n .content-wrapper {\r\n position: relative;\r\n z-index: var(--z-sticky);\r\n width: 100%;\r\n max-width: 380px;\r\n }\r\n\r\n /* Ticket machine */\r\n .ticket-machine {\r\n position: relative;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n }\r\n\r\n .machine-slot {\r\n width: 100%;\r\n height: 16px;\r\n background: linear-gradient(\r\n 180deg,\r\n hsl(var(--muted)) 0%,\r\n hsl(var(--bg-primary)) 100%\r\n );\r\n border-radius: 8px 8px 0 0;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-shadow: 0 4px 12px color-mix(in srgb, black 20%, transparent);\r\n position: relative;\r\n z-index: var(--z-base);\r\n }\r\n\r\n .slot-inner {\r\n width: 80%;\r\n height: 4px;\r\n background: hsl(var(--bg-primary));\r\n border-radius: 2px;\r\n }\r\n\r\n /* Ticket */\r\n .ticket {\r\n width: 100%;\r\n background: hsl(var(--bg-primary));\r\n border-radius: 0 0 16px 16px;\r\n box-shadow: 0 8px 32px color-mix(in srgb, black 12%, transparent);\r\n overflow: hidden;\r\n transform: translateY(-100%);\r\n opacity: 0;\r\n transition:\r\n transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1),\r\n opacity 0.3s ease;\r\n }\r\n\r\n .ticket.slide-out {\r\n transform: translateY(0);\r\n opacity: 1;\r\n }\r\n\r\n .ticket-content {\r\n padding: 32px 24px 24px;\r\n }\r\n\r\n .ticket-header {\r\n text-align: center;\r\n margin-bottom: 24px;\r\n }\r\n\r\n .success-badge {\r\n width: 64px;\r\n height: 64px;\r\n background: linear-gradient(\r\n 135deg,\r\n hsl(var(--accent-success)) 0%,\r\n hsl(var(--accent-success)) 100%\r\n );\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n margin: 0 auto 16px;\r\n animation: badge-pop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) 0.5s both;\r\n }\r\n\r\n @keyframes badge-pop {\r\n 0% {\r\n transform: scale(0);\r\n }\r\n\r\n 100% {\r\n transform: scale(1);\r\n }\r\n }\r\n\r\n .success-badge :global(.check-icon) {\r\n width: 32px;\r\n height: 32px;\r\n color: hsl(var(--bg-primary));\r\n }\r\n\r\n .success-title {\r\n font-size: 1.5rem;\r\n line-height: 2rem;\r\n font-weight: 600;\r\n color: hsl(var(--text-primary));\r\n margin-bottom: 0.5rem;\r\n }\r\n\r\n .success-subtitle {\r\n font-size: 0.875rem;\r\n line-height: 1.25rem;\r\n color: hsl(var(--text-secondary));\r\n margin: 0;\r\n }\r\n\r\n /* Ticket divider */\r\n .ticket-divider {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n margin: 0 -24px 24px;\r\n padding: 0 24px;\r\n }\r\n\r\n .divider-notch {\r\n width: 1rem;\r\n height: 1rem;\r\n border-radius: 9999px;\r\n position: absolute;\r\n background-color: hsl(var(--bg-primary));\r\n }\r\n\r\n .divider-notch.left {\r\n left: -8px;\r\n }\r\n\r\n .divider-notch.right {\r\n right: -8px;\r\n }\r\n\r\n .divider-line {\r\n flex: 1 1 0%;\r\n height: 0.125rem;\r\n background: repeating-linear-gradient(\r\n 90deg,\r\n hsl(var(--stroke-primary)) 0,\r\n hsl(var(--stroke-primary)) 8px,\r\n transparent 8px,\r\n transparent 16px\r\n );\r\n\r\n &:is([data-theme=\"dark\"], [data-theme=\"dark\"] *) {\r\n background: repeating-linear-gradient(\r\n 90deg,\r\n hsl(var(--text-secondary)) 0,\r\n hsl(var(--text-secondary)) 8px,\r\n transparent 8px,\r\n transparent 16px\r\n );\r\n }\r\n }\r\n\r\n /* Ticket details */\r\n .ticket-details {\r\n opacity: 0;\r\n transform: translateY(10px);\r\n transition:\r\n opacity 0.4s ease,\r\n transform 0.4s ease;\r\n }\r\n\r\n .ticket-details.fade-in {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n .detail-row {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 0.25rem;\r\n padding-top: 0.75rem;\r\n padding-bottom: 0.75rem;\r\n border-bottom: 1px solid hsl(var(--stroke-primary) / 50%);\r\n }\r\n\r\n .detail-row:last-child {\r\n border-bottom: 0;\r\n }\r\n\r\n .detail-label {\r\n font-size: 0.75rem;\r\n line-height: 1rem;\r\n font-weight: 600;\r\n color: hsl(var(--text-tertiary));\r\n text-transform: uppercase;\r\n letter-spacing: 0.025em;\r\n }\r\n\r\n .detail-value {\r\n font-size: 0.875rem;\r\n line-height: 1.25rem;\r\n font-weight: 500;\r\n color: hsl(var(--text-primary));\r\n overflow-wrap: break-word;\r\n }\r\n\r\n .detail-value.order-id {\r\n color: hsl(var(--brand-primary));\r\n font-family: 'SF Mono', Consolas, monospace;\r\n }\r\n\r\n .detail-value.event-name {\r\n font-size: 1rem;\r\n line-height: 1.5rem;\r\n font-weight: 600;\r\n }\r\n\r\n /* Ticket footer */\r\n .ticket-footer {\r\n margin-top: 1.5rem;\r\n padding: 1rem;\r\n border-radius: 0.5rem;\r\n text-align: center;\r\n background-color: hsl(var(--bg-secondary) / 50%);\r\n }\r\n\r\n .footer-text {\r\n font-size: 0.875rem;\r\n line-height: 1.25rem;\r\n color: hsl(var(--text-secondary));\r\n margin: 0;\r\n }\r\n\r\n /* Ticket stub pattern */\r\n .ticket-stub {\r\n height: 1.5rem;\r\n background: linear-gradient(\r\n 90deg,\r\n transparent 0,\r\n transparent 8px,\r\n hsl(var(--stroke-primary) / 30%) 8px,\r\n hsl(var(--stroke-primary) / 30%) 16px\r\n );\r\n background-size: 16px 100%;\r\n }\r\n\r\n /* Navigation CTAs */\r\n .nav-ctas {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 0.75rem;\r\n margin-top: 1.5rem;\r\n opacity: 0;\r\n transform: translateY(10px);\r\n transition:\r\n opacity 0.4s ease 0.2s,\r\n transform 0.4s ease 0.2s;\r\n }\r\n\r\n .nav-ctas.fade-in {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n .nav-link {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 0.75rem 1rem;\r\n border-radius: 0.5rem;\r\n font-size: 0.875rem;\r\n line-height: 1.25rem;\r\n font-weight: 600;\r\n text-decoration: none;\r\n transition:\r\n background-color 0.15s,\r\n color 0.15s;\r\n }\r\n\r\n .nav-link.primary {\r\n background: hsl(var(--brand-primary, 220 90% 56%));\r\n color: hsl(var(--text-on-primary, 0 0% 100%));\r\n }\r\n\r\n .nav-link.primary:hover {\r\n filter: brightness(0.95);\r\n }\r\n\r\n .nav-link.secondary {\r\n background-color: hsl(var(--bg-tertiary));\r\n color: hsl(var(--text-secondary));\r\n }\r\n\r\n .nav-link.secondary:hover {\r\n background-color: hsl(var(--bg-quaternary));\r\n }\r\n\r\n /* Responsive */\r\n @media (width <= 480px) {\r\n .success-container {\r\n padding: 16px;\r\n }\r\n\r\n .ticket-content {\r\n padding: 24px 20px 20px;\r\n }\r\n\r\n .success-title {\r\n font-size: 20px;\r\n }\r\n\r\n .success-badge {\r\n width: 56px;\r\n height: 56px;\r\n }\r\n\r\n .success-badge :global(.check-icon) {\r\n width: 28px;\r\n height: 28px;\r\n }\r\n }\r\n</style>\r\n"],"names":["logger","createLogger","data","$","$$props","eventUrl","browseUrl","organizationID","orgSlug","slug","rawEvent","providedOrderId","providedCustomerEmail","providedEventName","providedEventDateTime","providedEventLocation","event","transformEvent","e","order","Email","id","name","time","Location","orderId","showConfetti","showTicket","showDetails","formatEventDateTime","dateTimeString","tz","venueTimeZone","formatDateTime","confettiColors","ACCENT","confettiParticles","_","i","onMount","orderData","getOrder","err","div","root_9","div_1","root_1","particle","$$anchor","div_2","root","$$render","consequent","div_3","node","div_4","div_5","div_6","div_7","div_8","CheckmarkFilled","node_1","dl","div_9","dd","div_10","root_2","dd_1","consequent_1","div_11","root_3","dd_2","consequent_2","div_12","root_4","dd_3","time_1","consequent_3","div_13","root_5","dd_4","consequent_4","nav","root_8","a","root_6","consequent_5","a_1","root_7","consequent_6","classes_3","consequent_7","classes","classes_1","classes_2","text"],"mappings":"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"}
|
|
@@ -0,0 +1,158 @@
|
|
|
1
|
+
import "svelte/internal/disclose-version";
|
|
2
|
+
import * as e from "svelte/internal/client";
|
|
3
|
+
import { h as A, as as T } from "./VenueCalendar-d8u6MKEu.js";
|
|
4
|
+
var D = e.from_html('<div><img alt="" class="sc-image__blur svelte-12gell2" aria-hidden="true" decoding="async"/> <img decoding="async"/></div>'), O = e.from_html('<img decoding="async"/>'), V = e.from_html('<div role="img"></div>'), X = e.from_html('<div aria-hidden="true"></div>');
|
|
5
|
+
function H(j, t) {
|
|
6
|
+
e.push(t, !0), A("Image"), typeof process < "u" && process.env?.VITEST;
|
|
7
|
+
let f = e.prop(t, "src", 3, ""), _ = e.prop(t, "alt", 3, ""), o = e.prop(t, "class", 3, ""), m = e.prop(t, "fallback", 3, ""), h = e.prop(t, "loading", 3, "lazy"), x = e.prop(t, "fit", 3, "blur-backdrop"), y = e.prop(t, "blurUp", 3, !0), p = e.prop(t, "branded", 3, !0), s = e.state(e.proxy(
|
|
8
|
+
// eslint-disable-next-line svelte/valid-compile -- known Svelte compiler note, accepted for this primitive
|
|
9
|
+
f() ? "src" : m() ? "fallback" : "failed"
|
|
10
|
+
)), b = e.state(!1), u = e.state(!1);
|
|
11
|
+
e.user_effect(() => {
|
|
12
|
+
const l = f(), a = m();
|
|
13
|
+
e.set(s, l ? "src" : a ? "fallback" : "failed", !0), e.set(b, !1), e.set(u, !1);
|
|
14
|
+
});
|
|
15
|
+
let d = e.derived(() => e.get(s) === "src" ? f() : e.get(s) === "fallback" ? m() : ""), w = e.derived(() => e.get(s) !== "failed" && !!e.get(d)), k = e.derived(() => x() === "blur-backdrop"), I = e.derived(() => e.get(k) ? "contain" : x());
|
|
16
|
+
const E = /(?:^|\s)(?:aspect-|size-|h-(?!auto\b))/;
|
|
17
|
+
let S = e.derived(() => !!t.aspectRatio || t.width != null && t.height != null || E.test(o()));
|
|
18
|
+
e.user_effect(() => {
|
|
19
|
+
});
|
|
20
|
+
let z = e.derived(() => [
|
|
21
|
+
t.width != null ? `width:${t.width}px` : "",
|
|
22
|
+
t.height != null ? `height:${t.height}px` : "",
|
|
23
|
+
t.aspectRatio ? `aspect-ratio:${t.aspectRatio}` : ""
|
|
24
|
+
].filter(Boolean).join(";"));
|
|
25
|
+
async function C(l) {
|
|
26
|
+
const a = l.currentTarget, c = e.get(d);
|
|
27
|
+
try {
|
|
28
|
+
await a.decode?.();
|
|
29
|
+
} catch {
|
|
30
|
+
}
|
|
31
|
+
e.get(d) === c && (e.set(u, !0), t.onload?.(l));
|
|
32
|
+
}
|
|
33
|
+
function R() {
|
|
34
|
+
if (e.get(s) === "src" && m() && m() !== f()) {
|
|
35
|
+
e.set(s, "fallback");
|
|
36
|
+
return;
|
|
37
|
+
}
|
|
38
|
+
e.set(s, "failed"), e.get(b) || (e.set(b, !0), t.onError?.());
|
|
39
|
+
}
|
|
40
|
+
var B = e.comment(), L = e.first_child(B);
|
|
41
|
+
{
|
|
42
|
+
var N = (l) => {
|
|
43
|
+
var a = D();
|
|
44
|
+
let c;
|
|
45
|
+
var n = e.child(a), i = e.sibling(n, 2);
|
|
46
|
+
let g, r;
|
|
47
|
+
e.reset(a), e.template_effect(
|
|
48
|
+
(v) => {
|
|
49
|
+
c = e.set_class(a, 1, v, "svelte-12gell2", c, { "sc-image--backdrop-reserved": e.get(S) }), e.set_style(a, e.get(z) || void 0), e.set_attribute(n, "src", e.get(d)), e.set_attribute(n, "loading", h()), e.set_attribute(n, "draggable", t.draggable), e.set_attribute(n, "fetchpriority", t.fetchpriority), e.set_attribute(i, "src", e.get(d)), e.set_attribute(i, "alt", _()), g = e.set_class(i, 1, "sc-image__main svelte-12gell2", null, g, {
|
|
50
|
+
"sc-image__main--reserved": e.get(S),
|
|
51
|
+
"sc-image__main--loading": y() && !e.get(u)
|
|
52
|
+
}), e.set_attribute(i, "width", t.width), e.set_attribute(i, "height", t.height), e.set_attribute(i, "loading", h()), e.set_attribute(i, "draggable", t.draggable), e.set_attribute(i, "fetchpriority", t.fetchpriority), r = e.set_style(i, "", r, { "object-fit": e.get(I) });
|
|
53
|
+
},
|
|
54
|
+
[() => e.clsx(T("sc-image sc-image--backdrop", o()))]
|
|
55
|
+
), e.event("error", i, R), e.event("load", i, C), e.replay_events(i), e.append(l, a);
|
|
56
|
+
}, F = (l) => {
|
|
57
|
+
var a = O();
|
|
58
|
+
let c;
|
|
59
|
+
e.template_effect(
|
|
60
|
+
(n) => {
|
|
61
|
+
e.set_attribute(a, "src", e.get(d)), e.set_attribute(a, "alt", _()), e.set_attribute(a, "loading", h()), e.set_attribute(a, "draggable", t.draggable), e.set_attribute(a, "fetchpriority", t.fetchpriority), e.set_attribute(a, "width", t.width), e.set_attribute(a, "height", t.height), e.set_class(a, 1, n, "svelte-12gell2"), c = e.set_style(a, "", c, {
|
|
62
|
+
"object-fit": e.get(I),
|
|
63
|
+
"aspect-ratio": t.aspectRatio || void 0
|
|
64
|
+
});
|
|
65
|
+
},
|
|
66
|
+
[
|
|
67
|
+
() => e.clsx(T("sc-image image", y() && !e.get(u) && "sc-image--loading", o()))
|
|
68
|
+
]
|
|
69
|
+
), e.event("error", a, R), e.event("load", a, C), e.replay_events(a), e.append(l, a);
|
|
70
|
+
}, U = (l) => {
|
|
71
|
+
var a = e.comment(), c = e.first_child(a);
|
|
72
|
+
{
|
|
73
|
+
var n = (g) => {
|
|
74
|
+
var r = V();
|
|
75
|
+
e.template_effect(
|
|
76
|
+
(v) => {
|
|
77
|
+
e.set_class(r, 1, v, "svelte-12gell2"), e.set_style(r, e.get(z) || void 0), e.set_attribute(r, "aria-label", _());
|
|
78
|
+
},
|
|
79
|
+
[
|
|
80
|
+
() => e.clsx(T("sc-image image sc-image-placeholder image-placeholder", p() && "sc-image-placeholder--branded", o()))
|
|
81
|
+
]
|
|
82
|
+
), e.append(g, r);
|
|
83
|
+
}, i = (g) => {
|
|
84
|
+
var r = X();
|
|
85
|
+
e.template_effect(
|
|
86
|
+
(v) => {
|
|
87
|
+
e.set_class(r, 1, v, "svelte-12gell2"), e.set_style(r, e.get(z) || void 0);
|
|
88
|
+
},
|
|
89
|
+
[
|
|
90
|
+
() => e.clsx(T("sc-image image sc-image-placeholder image-placeholder", p() && "sc-image-placeholder--branded", o()))
|
|
91
|
+
]
|
|
92
|
+
), e.append(g, r);
|
|
93
|
+
};
|
|
94
|
+
e.if(c, (g) => {
|
|
95
|
+
_() ? g(n) : g(i, -1);
|
|
96
|
+
});
|
|
97
|
+
}
|
|
98
|
+
e.append(l, a);
|
|
99
|
+
};
|
|
100
|
+
e.if(L, (l) => {
|
|
101
|
+
e.get(w) && e.get(k) ? l(N) : e.get(w) ? l(F, 1) : l(U, -1);
|
|
102
|
+
});
|
|
103
|
+
}
|
|
104
|
+
e.append(j, B), e.pop();
|
|
105
|
+
}
|
|
106
|
+
function J(j, t) {
|
|
107
|
+
e.push(t, !0);
|
|
108
|
+
let f = e.prop(t, "as", 3, "span"), _ = e.prop(t, "size", 3, "md"), o = e.prop(t, "color", 3, "default"), m = e.prop(t, "weight", 3, "normal"), h = e.prop(t, "truncate", 3, !1), x = e.prop(t, "class", 3, "");
|
|
109
|
+
const y = {
|
|
110
|
+
xs: "text-xs",
|
|
111
|
+
sm: "text-sm",
|
|
112
|
+
base: "text-base",
|
|
113
|
+
md: "text-base",
|
|
114
|
+
lg: "text-lg",
|
|
115
|
+
xl: "text-xl",
|
|
116
|
+
"2xl": "text-2xl"
|
|
117
|
+
}, p = {
|
|
118
|
+
default: "text-text-primary",
|
|
119
|
+
muted: "text-muted-foreground",
|
|
120
|
+
primary: "text-primary-600",
|
|
121
|
+
secondary: "text-text-secondary",
|
|
122
|
+
success: "text-accent-success",
|
|
123
|
+
warning: "text-accent-warning",
|
|
124
|
+
error: "text-accent-danger",
|
|
125
|
+
none: ""
|
|
126
|
+
}, s = {
|
|
127
|
+
none: "leading-none",
|
|
128
|
+
tight: "leading-tight",
|
|
129
|
+
snug: "leading-snug",
|
|
130
|
+
normal: "leading-normal",
|
|
131
|
+
relaxed: "leading-relaxed",
|
|
132
|
+
loose: "leading-loose"
|
|
133
|
+
}, b = {
|
|
134
|
+
normal: "font-normal",
|
|
135
|
+
medium: "font-medium",
|
|
136
|
+
semibold: "font-semibold",
|
|
137
|
+
bold: "font-bold"
|
|
138
|
+
};
|
|
139
|
+
let u = e.derived(() => [
|
|
140
|
+
y[_()] || "text-base",
|
|
141
|
+
t.leading ? s[t.leading] : "",
|
|
142
|
+
p[o()] || "",
|
|
143
|
+
b[m()],
|
|
144
|
+
h() ? "truncate" : "",
|
|
145
|
+
x()
|
|
146
|
+
].filter(Boolean).join(" "));
|
|
147
|
+
var d = e.comment(), w = e.first_child(d);
|
|
148
|
+
e.element(w, f, !1, (k, I) => {
|
|
149
|
+
e.attribute_effect(k, () => ({ class: e.get(u) }));
|
|
150
|
+
var E = e.comment(), S = e.first_child(E);
|
|
151
|
+
e.snippet(S, () => t.children), e.append(I, E);
|
|
152
|
+
}), e.append(j, d), e.pop();
|
|
153
|
+
}
|
|
154
|
+
export {
|
|
155
|
+
H as I,
|
|
156
|
+
J as T
|
|
157
|
+
};
|
|
158
|
+
//# sourceMappingURL=Text-_bLxSPv-.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Text-_bLxSPv-.js","sources":["../node_modules/@getmicdrop/svelte-components/dist/primitives/Image/Image.svelte","../node_modules/@getmicdrop/svelte-components/dist/components/Text.svelte"],"sourcesContent":["<!--\r\n Image.svelte\r\n\r\n The canonical image primitive for Micdrop. Variable-aspect, user-uploaded\r\n sources (event posters, performer headshots, venue photos) where we do NOT\r\n control the aspect ratio. This component is now the single home for the\r\n whole image family — `Avatar` composes it, and `BlurBackdropImage` is a\r\n thin `@deprecated` shim.\r\n\r\n Premium contract (Atlas brief 04 — perf 5 / completeness 5):\r\n\r\n 1. ZERO CLS — pass `width`/`height` (intrinsic px) or `aspectRatio`\r\n (e.g. `'2/3'`, `'16/9'`, `'1'`). The component reserves that space\r\n BEFORE the image loads so the page never reflows when it arrives.\r\n Dev-only `console.warn` if you provide neither dimensions nor a\r\n sizing class (we can't reserve space and CLS can creep back in).\r\n\r\n 2. BLUR-UP LOADING — the main image starts slightly blurred and SHARPENS\r\n (blur → 0) once the real bitmap has decoded (`img.decode()` +\r\n `decoding=\"async\"`). In blur-backdrop framing a blurred copy of the\r\n SAME already-fetched bitmap fills the letterbox gaps — no second\r\n network fetch, no LQIP asset to ship. Fade timing reads the motion\r\n tokens, so `prefers-reduced-motion` collapses it automatically.\r\n\r\n 3. BLUR-BACKDROP IS THE DEFAULT FRAMING — `fit` defaults to\r\n `'blur-backdrop'`: the image is `object-fit: contain` (never cropped)\r\n and a blurred copy of itself fills the letterbox gaps. This handles\r\n BOTH tall posters and wide photos with no cropping and no flat-gray\r\n bars. `'cover'` / `'contain'` / `'fill'` / `'scale-down'` / `'none'`\r\n remain as escape hatches and render the plain single-`<img>` path\r\n (identical DOM to the pre-premium component).\r\n\r\n 4. BRANDED FALLBACK — when `src` (and `fallback`) are missing or both\r\n error, we render a branded placeholder (the Micdrop mark on a tint)\r\n instead of a flat gray div. Override the asset with `fallback`, or\r\n suppress the mark with `branded={false}`.\r\n\r\n Passthrough props for raw-<img> parity (so consumers can migrate\r\n existing `<img>` sites to `<Image>`):\r\n - `draggable` — forwarded to the underlying `<img draggable>`.\r\n - `onload` — forwarded to the `<img>` load event.\r\n - `fetchpriority` — forwarded to `<img fetchpriority>` (resource hint).\r\n - `onError` — fires ONCE, only after the internal fallback chain is\r\n exhausted (i.e. the branded placeholder takes over). It does NOT fire\r\n on the first error while a distinct `fallback` is still going to be\r\n tried. The raw `onerror` handler stays owned internally to drive the\r\n src→fallback→placeholder degradation; `onError` composes with it\r\n rather than replacing it.\r\n Deliberately NOT exposed: `srcset`/`sizes` — zero consumer demand.\r\n\r\n Example:\r\n <Image src={event.posterUrl} alt={event.name} aspectRatio=\"2/3\" class=\"w-full rounded-xl\" />\r\n <Image src={user.avatarUrl} alt={user.name} width={80} height={80} fit=\"cover\" class=\"rounded-full\" />\r\n <Image src={banner.url} alt=\"\" aspectRatio=\"16/9\" class=\"w-full\" loading=\"eager\" fetchpriority=\"high\" />\r\n-->\r\n<script lang=\"ts\">\r\n import { DEV } from 'esm-env';\r\n import { cn } from '../../utils/classNames.js';\r\n import { createLogger } from '../../utils/logger.js';\r\n\r\n const log = createLogger('Image');\r\n\r\n // Silence the dev CLS nudge under the test runner (the suite intentionally\r\n // renders without dimensions to exercise other behaviour). Reads the Node\r\n // env var Vitest sets — bundler-agnostic.\r\n const IS_TEST =\r\n typeof process !== 'undefined' && !!process.env?.VITEST;\r\n\r\n interface Props {\r\n /** Image source URL. When empty/missing, falls back to `fallback`. */\r\n src?: string;\r\n /** Alt text. Empty string marks decorative images per WCAG. */\r\n alt?: string;\r\n /** Additional CSS classes (sizing, shape, rounded corners). Wins last. */\r\n class?: string;\r\n /** Fallback URL used when src is empty or errors (before the branded mark). */\r\n fallback?: string;\r\n /** Loading strategy. Default 'lazy'; pass 'eager' for above-fold. */\r\n loading?: 'eager' | 'lazy';\r\n /**\r\n * Framing mode. Default `'blur-backdrop'` — `object-fit: contain` over a\r\n * blurred copy of the same image so tall AND wide sources are never\r\n * cropped and never letterboxed with flat gray. The remaining values are\r\n * escape hatches that render a plain single `<img object-fit:…>`.\r\n */\r\n fit?: 'blur-backdrop' | 'contain' | 'cover' | 'fill' | 'none' | 'scale-down';\r\n /**\r\n * Intrinsic width in CSS px — reserves space before load (zero CLS) and\r\n * sets the `<img width>` attribute. Pair with `height` for a fixed box.\r\n */\r\n width?: number;\r\n /**\r\n * Intrinsic height in CSS px — reserves space before load (zero CLS) and\r\n * sets the `<img height>` attribute. Pair with `width` for a fixed box.\r\n */\r\n height?: number;\r\n /**\r\n * CSS `aspect-ratio` string (e.g. `'2/3'` posters, `'16/9'` banners,\r\n * `'1'` square). Reserves space before load when you size by one axis\r\n * (`w-full`) — the zero-CLS path for fluid layouts.\r\n */\r\n aspectRatio?: string;\r\n /**\r\n * Blur-up loading: render blurred, then sharpen once the real bitmap\r\n * decodes. Default true. Set false to skip the effect (e.g. tiny icons\r\n * where the blur is imperceptible but the extra work isn't worth it).\r\n */\r\n blurUp?: boolean;\r\n /**\r\n * When the fallback chain is exhausted, show the branded Micdrop mark on\r\n * a tint. Default true. Set false for a plain tinted placeholder.\r\n */\r\n branded?: boolean;\r\n /** Forwarded to `<img draggable>`. Omitted when undefined. */\r\n draggable?: boolean;\r\n /** Forwarded to the `<img>` load event. */\r\n // eslint-disable-next-line no-unused-vars -- intentionally retained (prop/slot/forward-compat or Svelte-5 reactive binding eslint cannot see)\r\n onload?: (e: Event) => void;\r\n /** Forwarded to `<img fetchpriority>` (fetch-priority resource hint). */\r\n fetchpriority?: 'high' | 'low' | 'auto';\r\n /**\r\n * Fires once when the fallback chain is exhausted and the branded\r\n * placeholder takes over — NOT on the first error if a distinct\r\n * `fallback` is still going to be tried. Composes with the internal\r\n * `onerror` machine.\r\n */\r\n onError?: () => void;\r\n }\r\n\r\n let {\r\n src = '',\r\n alt = '',\r\n class: className = '',\r\n fallback = '',\r\n loading = 'lazy',\r\n fit = 'blur-backdrop',\r\n width,\r\n height,\r\n aspectRatio,\r\n blurUp = true,\r\n branded = true,\r\n draggable,\r\n onload,\r\n fetchpriority,\r\n onError,\r\n }: Props = $props();\r\n\r\n // Track loading attempts: which URL we're showing right now.\r\n // When the current URL errors, drop to 'failed' and render the placeholder.\r\n // Distinct from src/fallback inputs because we need to remember which\r\n // candidate we already tried. Reset whenever inputs change.\r\n let attempt: 'src' | 'fallback' | 'failed' = $state(\r\n // eslint-disable-next-line svelte/valid-compile -- known Svelte compiler note, accepted for this primitive\r\n src ? 'src' : fallback ? 'fallback' : 'failed'\r\n );\r\n\r\n // Guard so `onError` fires at most once per input set, even if a stale\r\n // <img> re-emits a duplicate final `error`. Reset when inputs change so a\r\n // fresh src/fallback can legitimately fail-and-notify again.\r\n let notifiedError = $state(false);\r\n\r\n // Blur-up: starts blurred, sharpens once the real bitmap decodes. Reset on\r\n // every new candidate URL so each swap re-runs the blur-up reveal.\r\n let decoded = $state(false);\r\n\r\n $effect(() => {\r\n // Re-derive when inputs change. (Read both to register dependencies.)\r\n const _s = src;\r\n const _f = fallback;\r\n attempt = _s ? 'src' : _f ? 'fallback' : 'failed';\r\n notifiedError = false;\r\n decoded = false;\r\n });\r\n\r\n let activeSrc = $derived(\r\n attempt === 'src' ? src : attempt === 'fallback' ? fallback : ''\r\n );\r\n let showImg = $derived(attempt !== 'failed' && !!activeSrc);\r\n\r\n // blur-backdrop is the only framing mode that wraps; everything else is a\r\n // plain single <img object-fit:…> (identical DOM to the legacy component).\r\n let backdrop = $derived(fit === 'blur-backdrop');\r\n let objectFit = $derived(backdrop ? 'contain' : fit);\r\n\r\n // Does the consumer reserve a DEFINITE box — one that fixes the rendered\r\n // HEIGHT before the bitmap's intrinsic dimensions are known? Only these\r\n // prevent vertical CLS:\r\n // - aspectRatio (height derives from width via the ratio), OR\r\n // - both width AND height (a fully fixed box), OR\r\n // - a `size-*` utility (sets width AND height together), OR\r\n // - a definite height / aspect-ratio class (`h-*`, `aspect-*`).\r\n // Deliberately NOT counted: width alone, `w-full`, `max-h-*`, `h-auto`,\r\n // AND `min-h-*` — min-h only reserves a FLOOR, so a taller bitmap still\r\n // grows the box and shifts the page. None of these reserve the actual\r\n // vertical extent before metadata, so CLS can still creep in.\r\n const DEFINITE_BOX_CLASS = /(?:^|\\s)(?:aspect-|size-|h-(?!auto\\b))/;\r\n let hasReservedBox = $derived(\r\n !!aspectRatio ||\r\n (width != null && height != null) ||\r\n DEFINITE_BOX_CLASS.test(className)\r\n );\r\n\r\n // Dev-only nudge: without a definite box we cannot reserve VERTICAL space,\r\n // so CLS can creep back in. Warn, never throw.\r\n $effect(() => {\r\n // Dev-only (tree-shaken from prod via esm-env DEV) and never under test.\r\n if (DEV && !IS_TEST && !hasReservedBox) {\r\n log.warn(\r\n 'No aspectRatio, no width+height pair, and no definite height/aspect ' +\r\n 'sizing class — vertical layout space cannot be reserved and the ' +\r\n 'page may shift when the image loads (CLS). Pass aspectRatio=\"2/3\", ' +\r\n 'both width and height, or an h-*/aspect-* class. (width alone or ' +\r\n 'w-full does not reserve vertical space.)'\r\n );\r\n }\r\n });\r\n\r\n // Reserve intrinsic space on the box that owns layout. For blur-backdrop\r\n // that's the wrapper; for the plain path it's the <img> itself.\r\n let reserveStyle = $derived(\r\n [\r\n width != null ? `width:${width}px` : '',\r\n height != null ? `height:${height}px` : '',\r\n aspectRatio ? `aspect-ratio:${aspectRatio}` : '',\r\n ]\r\n .filter(Boolean)\r\n .join(';')\r\n );\r\n\r\n // mark the real bitmap as decoded → triggers the blur→sharp fade.\r\n async function handleLoad(e: Event) {\r\n const img = e.currentTarget as HTMLImageElement;\r\n // Capture which URL this load is FOR. If `src` swaps mid-decode (the\r\n // active candidate changes), this stale resolution must NOT sharpen — or\r\n // fire onload for — the new image. Compare against the live activeSrc\r\n // after the await and bail if it moved on.\r\n const loadedSrc = activeSrc;\r\n try {\r\n // decode() resolves once the bitmap is paint-ready; avoids revealing a\r\n // half-painted image. Falls through if unsupported / aborted.\r\n await img.decode?.();\r\n } catch {\r\n // decode can reject on detached/aborted images — reveal anyway.\r\n }\r\n // Src swapped while we awaited decode() → this is a stale load. Drop it;\r\n // the new candidate's own load event will drive the reveal.\r\n if (activeSrc !== loadedSrc) return;\r\n decoded = true;\r\n onload?.(e);\r\n }\r\n\r\n function handleError() {\r\n // If we were on src and have a distinct fallback to try, advance.\r\n if (attempt === 'src' && fallback && fallback !== src) {\r\n attempt = 'fallback';\r\n return;\r\n }\r\n // Either fallback already attempted, or no distinct fallback exists.\r\n // The chain is exhausted — the branded placeholder takes over. Notify the\r\n // consumer exactly here (final failure only), never on the transient\r\n // src→fallback hop, and at most once per input set.\r\n attempt = 'failed';\r\n if (!notifiedError) {\r\n notifiedError = true;\r\n onError?.();\r\n }\r\n }\r\n</script>\r\n\r\n{#if showImg && backdrop}\r\n <!-- blur-backdrop framing (default): contain + same-image blurred fill.\r\n The wrapper owns layout + reserves space; the blur layer is a second\r\n cheap reuse of the already-fetched bitmap (no extra network fetch). -->\r\n <div\r\n class={cn('sc-image sc-image--backdrop', className)}\r\n class:sc-image--backdrop-reserved={hasReservedBox}\r\n style={reserveStyle || undefined}\r\n >\r\n <img\r\n src={activeSrc}\r\n alt=\"\"\r\n class=\"sc-image__blur\"\r\n aria-hidden=\"true\"\r\n decoding=\"async\"\r\n {loading}\r\n {draggable}\r\n {fetchpriority}\r\n />\r\n <img\r\n src={activeSrc}\r\n {alt}\r\n class=\"sc-image__main\"\r\n class:sc-image__main--reserved={hasReservedBox}\r\n class:sc-image__main--loading={blurUp && !decoded}\r\n style:object-fit={objectFit}\r\n {width}\r\n {height}\r\n {loading}\r\n {draggable}\r\n {fetchpriority}\r\n decoding=\"async\"\r\n onerror={handleError}\r\n onload={handleLoad}\r\n />\r\n </div>\r\n{:else if showImg}\r\n <!-- escape-hatch framing (cover/contain/fill/none/scale-down): plain single\r\n <img>, identical DOM to the legacy component, plus blur-up + dims. -->\r\n <img\r\n src={activeSrc}\r\n {alt}\r\n {loading}\r\n {draggable}\r\n {fetchpriority}\r\n {width}\r\n {height}\r\n class={cn(\r\n 'sc-image image',\r\n blurUp && !decoded && 'sc-image--loading',\r\n className\r\n )}\r\n style:object-fit={objectFit}\r\n style:aspect-ratio={aspectRatio || undefined}\r\n decoding=\"async\"\r\n onerror={handleError}\r\n onload={handleLoad}\r\n />\r\n{:else}\r\n <!-- No usable src — branded placeholder (Micdrop mark on a tint), or a plain\r\n tinted box when branded={false}. Empty alt marks decorative images (per\r\n WCAG); hide from assistive tech via aria-hidden + no role. -->\r\n {#if alt}\r\n <div\r\n class={cn(\r\n 'sc-image image sc-image-placeholder image-placeholder',\r\n branded && 'sc-image-placeholder--branded',\r\n className\r\n )}\r\n style={reserveStyle || undefined}\r\n role=\"img\"\r\n aria-label={alt}\r\n ></div>\r\n {:else}\r\n <div\r\n class={cn(\r\n 'sc-image image sc-image-placeholder image-placeholder',\r\n branded && 'sc-image-placeholder--branded',\r\n className\r\n )}\r\n style={reserveStyle || undefined}\r\n aria-hidden=\"true\"\r\n ></div>\r\n {/if}\r\n{/if}\r\n\r\n<style>\r\n /* `.image` is a legacy back-compat alias of `.sc-image` on the plain\r\n escape-hatch <img> + placeholder (consumer CSS / tests may target it). */\r\n .sc-image,\r\n .image {\r\n display: block;\r\n max-width: 100%;\r\n }\r\n\r\n /* --- blur-backdrop framing --- */\r\n .sc-image--backdrop {\r\n position: relative;\r\n overflow: hidden;\r\n container-type: inline-size;\r\n background: hsl(var(--bg-quaternary));\r\n }\r\n\r\n .sc-image__blur {\r\n position: absolute;\r\n inset: 0;\r\n width: 100%;\r\n height: 100%;\r\n max-width: none;\r\n object-fit: cover;\r\n transform: scale(1.15);\r\n filter: blur(16px) saturate(1.2);\r\n /* purely decorative fill; the absolutely-positioned blur paints first and\r\n the in-flow main layer (position:relative) stacks above it by source\r\n order — no explicit z-index needed. */\r\n }\r\n\r\n /* Small containers (<=80px): blur() applies before scale() in the render\r\n pipeline, so the blur halo gets scaled too. Need enough scale that the\r\n opaque image extends past the container edge even after the halo grows. */\r\n @container (max-width: 5rem) {\r\n .sc-image__blur {\r\n transform: scale(2);\r\n filter: blur(6px) saturate(1.2);\r\n }\r\n }\r\n\r\n .sc-image__main {\r\n position: relative;\r\n display: block;\r\n width: 100%;\r\n /* No reserved box (legacy / no-fit default): the in-flow main image\r\n DRIVES the wrapper height and sizes ITSELF to the consumer's sizing\r\n classes — which land on the wrapper. `max-height: inherit` /\r\n `max-width: inherit` pull the wrapper's `max-h-*` / `max-w-*` onto the\r\n image so object-fit:contain shrinks it to fit (image height == wrapper\r\n height). The image therefore NEVER exceeds the wrapper, so the wrapper's\r\n overflow:hidden (which clips the decorative blur fill) cannot clip the\r\n MAIN image — it renders exactly as the pre-premium single <img> did,\r\n constrained by max-h-* / h-auto, no reflow. Only force the image to fill\r\n a fixed box when the consumer reserved a DEFINITE one (explicit height /\r\n aspectRatio / size-* / h-* / aspect-*) — there the wrapper owns layout\r\n and the image fills it (true zero-CLS letterbox). */\r\n height: auto;\r\n max-width: inherit;\r\n max-height: inherit;\r\n object-fit: contain;\r\n }\r\n\r\n .sc-image--backdrop-reserved .sc-image__main--reserved {\r\n height: 100%;\r\n max-width: none;\r\n max-height: none;\r\n }\r\n\r\n /* --- blur-up reveal (CSS-only; reduced-motion gated via motion tokens) ---\r\n The main image / plain image starts slightly blurred + scaled and\r\n sharpens on decode. Durations read from --motion-* so\r\n prefers-reduced-motion collapses them. */\r\n .sc-image--loading,\r\n .sc-image__main {\r\n transition:\r\n filter var(--motion-normal, 300ms) var(--ease-out, ease),\r\n transform var(--motion-normal, 300ms) var(--ease-out, ease);\r\n }\r\n\r\n .sc-image--loading,\r\n .sc-image__main--loading {\r\n filter: blur(12px);\r\n transform: scale(1.02);\r\n }\r\n\r\n /* --- placeholder --- */\r\n .sc-image-placeholder {\r\n background: hsl(var(--bg-quaternary));\r\n }\r\n\r\n .sc-image-placeholder--branded {\r\n background-color: hsl(var(--bg-tertiary));\r\n background-image: url('../../assets/images/micdrop-logo.png');\r\n background-repeat: no-repeat;\r\n background-position: center;\r\n /* keep the mark a small, calm watermark — never edge-to-edge */\r\n background-size: min(48%, 96px) auto;\r\n opacity: 0.92;\r\n }\r\n</style>\r\n","<script lang=\"ts\">\r\n import type { Snippet } from 'svelte';\r\n\r\n interface Props {\r\n as?: 'span' | 'p' | 'label' | 'div';\r\n size?: 'xs' | 'sm' | 'base' | 'md' | 'lg' | 'xl' | '2xl';\r\n leading?: 'none' | 'tight' | 'snug' | 'normal' | 'relaxed' | 'loose';\r\n color?: 'default' | 'muted' | 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'none';\r\n weight?: 'normal' | 'medium' | 'semibold' | 'bold';\r\n truncate?: boolean;\r\n class?: string;\r\n children: Snippet;\r\n }\r\n\r\n let {\r\n as = 'span',\r\n size = 'md',\r\n leading,\r\n color = 'default',\r\n weight = 'normal',\r\n truncate = false,\r\n class: className = '',\r\n children,\r\n }: Props = $props();\r\n\r\n const sizeClasses: Record<string, string> = {\r\n xs: 'text-xs',\r\n sm: 'text-sm',\r\n base: 'text-base',\r\n md: 'text-base',\r\n lg: 'text-lg',\r\n xl: 'text-xl',\r\n '2xl': 'text-2xl',\r\n };\r\n\r\n const colorClasses: Record<string, string> = {\r\n default: 'text-text-primary',\r\n muted: 'text-muted-foreground',\r\n primary: 'text-primary-600',\r\n secondary: 'text-text-secondary',\r\n success: 'text-accent-success',\r\n warning: 'text-accent-warning',\r\n error: 'text-accent-danger',\r\n none: '',\r\n };\r\n\r\n const leadingClasses: Record<string, string> = {\r\n none: 'leading-none',\r\n tight: 'leading-tight',\r\n snug: 'leading-snug',\r\n normal: 'leading-normal',\r\n relaxed: 'leading-relaxed',\r\n loose: 'leading-loose',\r\n };\r\n\r\n const weightClasses: Record<string, string> = {\r\n normal: 'font-normal',\r\n medium: 'font-medium',\r\n semibold: 'font-semibold',\r\n bold: 'font-bold',\r\n };\r\n\r\n let classes = $derived(\r\n [\r\n sizeClasses[size] || 'text-base',\r\n leading ? leadingClasses[leading] : '',\r\n colorClasses[color] || '',\r\n weightClasses[weight],\r\n truncate ? 'truncate' : '',\r\n className,\r\n ]\r\n .filter(Boolean)\r\n .join(' '),\r\n );\r\n</script>\r\n\r\n<svelte:element this={as} class={classes}>{@render children()}</svelte:element>\r\n"],"names":["createLogger","src","$","$$props","alt","className","fallback","loading","fit","blurUp","branded","attempt","notifiedError","decoded","_s","_f","activeSrc","showImg","backdrop","objectFit","DEFINITE_BOX_CLASS","hasReservedBox","reserveStyle","handleLoad","e","img","loadedSrc","handleError","div","root","img_1","img_2","classes","classes_1","styles","cn","img_3","root_1","$0","styles_1","div_1","root_2","div_2","root_3","$$render","consequent_2","alternate","consequent","consequent_1","alternate_1","as","size","color","weight","truncate","sizeClasses","colorClasses","leadingClasses","weightClasses","$$element","$$anchor"],"mappings":"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","x_google_ignoreList":[0,1]}
|