@ticketlayer/elements 0.3.3 → 0.4.0

package/dist/components/tl-event-card2.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as t,createEvent as r,h as a,transformTag as i}from"@stencil/core/internal/client";import{w as s}from"./sdk-connector.js";import{e as n}from"./order-summary.js";const o=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.tlClick=r(this,"tlClick",7),this.tlError=r(this,"tlError",7),this.loadedEvent=null,this.loading=!1,this.error=null,this.handleClick=()=>{const e=this.current;e&&(console.log("[tl-event-card] Clicked:",e.id),this.tlClick.emit({eventId:e.id}))}}watchEventId(){this.loadEvent()}async componentWillLoad(){!this.event&&this.eventId&&await this.loadEvent()}async loadEvent(){if(!this.event&&this.eventId)try{this.loading=!0,this.error=null;const e=await s(),t=await e.getEventsManager().get(this.eventId);if(!t)throw new Error("Event not found");this.loadedEvent=function(e){const t=e.occurrences??[],r=t.map((e=>e.startsAt)).filter((e=>!!e)).sort(),a=Date.now(),i=r.find((e=>new Date(e).getTime()>=a))??r[0],s="sold_out"===e.status||t.length>0&&t.every((e=>"sold_out"===e.status));return{id:e.id,name:e.name,...e.shortDescription?{shortDescription:e.shortDescription}:{},...e.imageUrl?{imageUrl:e.imageUrl}:{},...e.venueName?{venue:{id:e.venueId??"",name:e.venueName,city:e.venueCity??""}}:{},...i?{nextOccurrence:{startsAt:i}}:{},availabilityStatus:s?"sold_out":"available"}}(t)}catch(e){console.error("[tl-event-card] Failed to load event:",e),this.error=n(e,"Failed to load event"),this.tlError.emit({message:this.error})}finally{this.loading=!1}}get current(){return this.event??this.loadedEvent}formatDate(e){return new Date(e).toLocaleDateString("en-GB",{weekday:"short",day:"numeric",month:"short",hour:"2-digit",minute:"2-digit"})}getStatusBadgeClass(){const e="status-badge";switch(this.current?.availabilityStatus){case"available":return`${e} status-available`;case"limited":return`${e} status-limited`;case"sold_out":return`${e} status-sold-out`;default:return e}}getStatusLabel(){switch(this.current?.availabilityStatus){case"available":return"Available";case"limited":return"Limited";case"sold_out":return"Sold Out";default:return""}}render(){if(this.loading)return a("div",{class:"event-card card-skeleton","aria-busy":"true"},a("div",{class:"image-container"}),a("div",{class:"content"},a("div",{class:"skeleton-line short"}),a("div",{class:"skeleton-line long"})));if(this.error)return a("div",{class:"event-card card-error"},this.error);const e=this.current;if(!e)return null;const t=e.thumbnailUrl||e.imageUrl;return a("div",{class:"event-card",onClick:this.handleClick},a("div",{class:"image-container"},t?a("img",{src:t,alt:e.name,class:"event-image"}):a("div",{class:"image-placeholder"},a("svg",{width:"48",height:"48",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor"},a("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"1.5",d:"M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"}))),a("div",{class:"status-container"},a("span",{class:this.getStatusBadgeClass()},this.getStatusLabel()))),a("div",{class:"content"},e.category&&a("span",{class:"category"},e.category),a("h3",{class:"title"},e.name),e.nextOccurrence&&a("p",{class:"meta"},a("svg",{class:"icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor"},a("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"})),this.formatDate(e.nextOccurrence.startsAt)),e.venue&&a("p",{class:"meta"},a("svg",{class:"icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor"},a("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z"}),a("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M15 11a3 3 0 11-6 0 3 3 0 016 0z"})),e.venue.name,", ",e.venue.city),e.shortDescription&&a("p",{class:"description"},e.shortDescription)))}static get watchers(){return{eventId:[{watchEventId:0}]}}static get style(){return":host{display:block;font-family:var(--tl-font-family, system-ui, sans-serif)}.event-card{background:var(--tl-secondary, #f3f4f6);border-radius:var(--tl-radius-lg, 0.75rem);overflow:hidden;box-shadow:0 1px 3px rgba(0, 0, 0, 0.1);cursor:pointer;transition:box-shadow 0.2s ease, transform 0.2s ease}.event-card:hover{box-shadow:0 4px 12px rgba(0, 0, 0, 0.15);transform:translateY(-2px)}.image-container{position:relative;aspect-ratio:16 / 9;overflow:hidden;background:var(--tl-muted, #f9fafb)}.event-image{width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease}.event-card:hover .event-image{transform:scale(1.05)}.image-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--tl-muted-foreground, #6b7280)}.status-container{position:absolute;top:0.5rem;right:0.5rem}.status-badge{display:inline-block;padding:0.25rem 0.5rem;font-size:0.75rem;font-weight:500;border-radius:var(--tl-radius-sm, 0.25rem)}.status-available{background:var(--tl-success, #10b981);color:var(--tl-success-foreground, #ffffff)}.status-limited{background:var(--tl-warning, #f59e0b);color:var(--tl-warning-foreground, #ffffff)}.status-sold-out{background:var(--tl-error, #ef4444);color:var(--tl-error-foreground, #ffffff)}.content{padding:var(--tl-spacing-4, 1rem)}.category{display:inline-block;font-size:0.75rem;font-weight:500;text-transform:uppercase;letter-spacing:0.05em;color:var(--tl-primary, #6366f1)}.title{margin:0.25rem 0 0;font-size:1.125rem;font-weight:600;color:var(--tl-foreground, #111827);line-height:1.3}.event-card:hover .title{color:var(--tl-primary, #6366f1)}.meta{display:flex;align-items:center;gap:0.5rem;margin:0.5rem 0 0;font-size:0.875rem;color:var(--tl-muted-foreground, #6b7280)}.meta:first-of-type{margin-top:0.75rem}.icon{width:1rem;height:1rem;flex-shrink:0}.description{margin:0.75rem 0 0;font-size:0.875rem;color:var(--tl-muted-foreground, #6b7280);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-skeleton{cursor:default;pointer-events:none}.card-skeleton .image-container{animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}.skeleton-line{height:0.875rem;margin-top:0.5rem;background:var(--tl-muted, #f9fafb);border-radius:var(--tl-radius-sm, 0.25rem);animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}.skeleton-line.short{width:40%}.skeleton-line.long{width:80%}.card-error{padding:var(--tl-spacing-4, 1rem);font-size:0.875rem;color:var(--tl-error, #ef4444);cursor:default}.card-error:hover{transform:none}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}"}},[1,"tl-event-card",{event:[16],eventId:[1,"event-id"],loadedEvent:[32],loading:[32],error:[32]},void 0,{eventId:[{watchEventId:0}]}]);function l(){"undefined"!=typeof customElements&&["tl-event-card"].forEach((e=>{"tl-event-card"===e&&(customElements.get(i(e))||customElements.define(i(e),o))}))}export{o as T,l as d}
+import{proxyCustomElement as t,HTMLElement as e,createEvent as r,h as a,transformTag as i}from"@stencil/core/internal/client";import{w as s}from"./sdk-connector.js";import{e as n}from"./order-summary.js";const o=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.tlClick=r(this,"tlClick",7),this.tlError=r(this,"tlError",7),this.loadedEvent=null,this.loading=!1,this.error=null,this.handleClick=()=>{const t=this.current;t&&(console.log("[tl-event-card] Clicked:",t.id),this.tlClick.emit({eventId:t.id}))}}watchEventId(){this.loadEvent()}async componentWillLoad(){!this.event&&this.eventId&&await this.loadEvent()}async loadEvent(){if(!this.event&&this.eventId)try{this.loading=!0,this.error=null;const t=await s(),e=await t.getEventsManager().get(this.eventId);if(!e)throw new Error("Event not found");this.loadedEvent=function(t){const e=t.occurrences??[],r=e.map((t=>t.startsAt)).filter((t=>!!t)).sort(),a=Date.now(),i=r.find((t=>new Date(t).getTime()>=a))??r[0],s="sold_out"===t.status||e.length>0&&e.every((t=>"sold_out"===t.status));return{id:t.id,name:t.name,...t.shortDescription?{shortDescription:t.shortDescription}:{},...t.imageUrl?{imageUrl:t.imageUrl}:{},...t.venueName?{venue:{id:t.venueId??"",name:t.venueName,city:t.venueCity??""}}:{},...i?{nextOccurrence:{startsAt:i}}:{},availabilityStatus:s?"sold_out":"available"}}(e)}catch(t){console.error("[tl-event-card] Failed to load event:",t),this.error=n(t,"Failed to load event"),this.tlError.emit({message:this.error})}finally{this.loading=!1}}get current(){return this.event??this.loadedEvent}formatDate(t){return new Date(t).toLocaleDateString("en-GB",{weekday:"short",day:"numeric",month:"short",hour:"2-digit",minute:"2-digit"})}getStatusBadgeClass(){const t="status-badge";switch(this.current?.availabilityStatus){case"available":return`${t} status-available`;case"limited":return`${t} status-limited`;case"sold_out":return`${t} status-sold-out`;default:return t}}getStatusLabel(){switch(this.current?.availabilityStatus){case"available":return"Available";case"limited":return"Limited";case"sold_out":return"Sold Out";default:return""}}render(){if(this.loading)return a("div",{class:"event-card card-skeleton","aria-busy":"true"},a("div",{class:"image-container"}),a("div",{class:"content"},a("div",{class:"skeleton-line short"}),a("div",{class:"skeleton-line long"})));if(this.error)return a("div",{class:"event-card card-error"},this.error);const t=this.current;if(!t)return null;const e=t.thumbnailUrl||t.imageUrl;return a("div",{class:"event-card",onClick:this.handleClick},a("div",{class:"image-container"},e?a("img",{src:e,alt:t.name,class:"event-image"}):a("div",{class:"image-placeholder"},a("svg",{width:"48",height:"48",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor"},a("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"1.5",d:"M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"}))),a("div",{class:"status-container"},a("span",{class:this.getStatusBadgeClass()},this.getStatusLabel()))),a("div",{class:"content"},t.category&&a("span",{class:"category"},t.category),a("h3",{class:"title"},t.name),t.nextOccurrence&&a("p",{class:"meta"},a("svg",{class:"icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor"},a("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"})),this.formatDate(t.nextOccurrence.startsAt)),t.venue&&a("p",{class:"meta"},a("svg",{class:"icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor"},a("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z"}),a("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M15 11a3 3 0 11-6 0 3 3 0 016 0z"})),t.venue.name,", ",t.venue.city),t.shortDescription&&a("p",{class:"description"},t.shortDescription)))}static get watchers(){return{eventId:[{watchEventId:0}]}}static get style(){return":host{display:block;font-family:var(--tl-font-family)}.event-card{background:var(--tl-secondary);border-radius:var(--tl-radius-lg);overflow:hidden;box-shadow:0 1px 3px rgba(0, 0, 0, 0.1);cursor:pointer;transition:box-shadow 0.2s ease, transform 0.2s ease}.event-card:hover{box-shadow:0 4px 12px rgba(0, 0, 0, 0.15);transform:translateY(-2px)}.image-container{position:relative;aspect-ratio:16 / 9;overflow:hidden;background:var(--tl-muted)}.event-image{width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease}.event-card:hover .event-image{transform:scale(1.05)}.image-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--tl-muted-foreground)}.status-container{position:absolute;top:0.5rem;right:0.5rem}.status-badge{display:inline-block;padding:0.25rem 0.5rem;font-size:0.75rem;font-weight:500;border-radius:var(--tl-radius-sm)}.status-available{background:var(--tl-success);color:var(--tl-success-foreground)}.status-limited{background:var(--tl-warning);color:var(--tl-warning-foreground)}.status-sold-out{background:var(--tl-error);color:var(--tl-error-foreground)}.content{padding:var(--tl-spacing-4)}.category{display:inline-block;font-size:0.75rem;font-weight:500;text-transform:uppercase;letter-spacing:0.05em;color:var(--tl-primary)}.title{margin:0.25rem 0 0;font-size:1.125rem;font-weight:600;color:var(--tl-foreground);line-height:1.3}.event-card:hover .title{color:var(--tl-primary)}.meta{display:flex;align-items:center;gap:0.5rem;margin:0.5rem 0 0;font-size:0.875rem;color:var(--tl-muted-foreground)}.meta:first-of-type{margin-top:0.75rem}.icon{width:1rem;height:1rem;flex-shrink:0}.description{margin:0.75rem 0 0;font-size:0.875rem;color:var(--tl-muted-foreground);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-skeleton{cursor:default;pointer-events:none}.card-skeleton .image-container{animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}.skeleton-line{height:0.875rem;margin-top:0.5rem;background:var(--tl-muted);border-radius:var(--tl-radius-sm);animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}.skeleton-line.short{width:40%}.skeleton-line.long{width:80%}.card-error{padding:var(--tl-spacing-4);font-size:0.875rem;color:var(--tl-error);cursor:default}.card-error:hover{transform:none}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}"}},[1,"tl-event-card",{event:[16],eventId:[1,"event-id"],loadedEvent:[32],loading:[32],error:[32]},void 0,{eventId:[{watchEventId:0}]}]);function l(){"undefined"!=typeof customElements&&["tl-event-card"].forEach((t=>{"tl-event-card"===t&&(customElements.get(i(t))||customElements.define(i(t),o))}))}export{o as T,l as d}

package/dist/components/tl-event-list.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as t,createEvent as s,h as r,transformTag as i}from"@stencil/core/internal/client";import{w as l}from"./sdk-connector.js";import{d as a}from"./tl-event-card2.js";const o=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.tlEventClick=s(this,"tlEventClick",7),this.limit=12,this.columns=3,this.events=[],this.loading=!0,this.error=null,this.handleEventClick=e=>{console.log("[tl-event-list] Event clicked:",e.detail.eventId),this.tlEventClick.emit(e.detail)}}watchFiltersChange(){this.loadEvents()}async componentWillLoad(){await this.loadEvents()}async loadEvents(){try{console.log("[tl-event-list] Loading events via SDK...",{limit:this.limit,category:this.category}),this.loading=!0,this.error=null;const e=(await l()).getEventsManager(),t=await e.list({limit:this.limit,category:this.category});console.log("[tl-event-list] Events loaded:",t.items.length),this.events=t.items}catch(e){console.error("[tl-event-list] Failed to load events:",e),this.error=e instanceof Error?e.message:"Failed to load events"}finally{this.loading=!1}}render(){const e="event-grid cols-"+Math.min(Math.max(this.columns,1),4);return this.loading?r("div",{class:e},Array.from({length:6}).map(((e,t)=>r("div",{class:"skeleton-card",key:t},r("div",{class:"skeleton-image"}),r("div",{class:"skeleton-content"},r("div",{class:"skeleton-line short"}),r("div",{class:"skeleton-line medium"}),r("div",{class:"skeleton-line long"})))))):this.error?r("div",{class:"error-state"},r("p",{class:"error-title"},"Error loading events"),r("p",{class:"error-message"},this.error)):0===this.events.length?r("div",{class:"empty-state"},r("svg",{class:"empty-icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor"},r("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"1.5",d:"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"})),r("p",{class:"empty-title"},"No events available"),r("p",{class:"empty-message"},"Check back later for upcoming events.")):r("div",{class:e},this.events.map((e=>r("tl-event-card",{key:e.id,event:e,onTlClick:this.handleEventClick}))))}static get watchers(){return{limit:[{watchFiltersChange:0}],category:[{watchFiltersChange:0}]}}static get style(){return":host{display:block;font-family:var(--tl-font-family, system-ui, sans-serif)}.event-grid{display:grid;gap:var(--tl-spacing-6, 1.5rem)}.cols-1{grid-template-columns:1fr}.cols-2{grid-template-columns:repeat(2, 1fr)}.cols-3{grid-template-columns:repeat(3, 1fr)}.cols-4{grid-template-columns:repeat(4, 1fr)}@media (max-width: 1024px){.cols-4,.cols-3{grid-template-columns:repeat(2, 1fr)}}@media (max-width: 640px){.cols-4,.cols-3,.cols-2{grid-template-columns:1fr}}.skeleton-card{background:var(--tl-secondary, #f3f4f6);border-radius:var(--tl-radius-lg, 0.75rem);overflow:hidden}.skeleton-image{aspect-ratio:16 / 9;background:var(--tl-muted, #f9fafb);animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}.skeleton-content{padding:var(--tl-spacing-4, 1rem);display:flex;flex-direction:column;gap:0.5rem}.skeleton-line{height:1rem;background:var(--tl-muted, #f9fafb);border-radius:var(--tl-radius-sm, 0.25rem);animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}.skeleton-line.short{width:4rem;height:0.75rem}.skeleton-line.medium{width:75%}.skeleton-line.long{width:50%}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}.error-state{background:rgba(239, 68, 68, 0.1);border:1px solid var(--tl-error, #ef4444);border-radius:var(--tl-radius-lg, 0.75rem);padding:var(--tl-spacing-4, 1rem)}.error-title{margin:0;font-weight:500;color:var(--tl-error, #ef4444)}.error-message{margin:0.25rem 0 0;font-size:0.875rem;color:var(--tl-error, #ef4444)}.empty-state{text-align:center;padding:var(--tl-spacing-8, 2rem) var(--tl-spacing-4, 1rem)}.empty-icon{width:4rem;height:4rem;margin:0 auto 1rem;color:var(--tl-muted-foreground, #6b7280)}.empty-title{margin:0;font-size:1.25rem;font-weight:600;color:var(--tl-foreground, #111827)}.empty-message{margin:0.5rem 0 0;color:var(--tl-muted-foreground, #6b7280)}"}},[1,"tl-event-list",{limit:[2],category:[1],columns:[2],events:[32],loading:[32],error:[32]},void 0,{limit:[{watchFiltersChange:0}],category:[{watchFiltersChange:0}]}]),n=o,c=function(){"undefined"!=typeof customElements&&["tl-event-list","tl-event-card"].forEach((e=>{switch(e){case"tl-event-list":customElements.get(i(e))||customElements.define(i(e),o);break;case"tl-event-card":customElements.get(i(e))||a()}}))};export{n as TlEventList,c as defineCustomElement}
+import{proxyCustomElement as e,HTMLElement as t,createEvent as s,h as i,transformTag as r}from"@stencil/core/internal/client";import{w as l}from"./sdk-connector.js";import{d as a}from"./tl-event-card2.js";const o=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.tlEventClick=s(this,"tlEventClick",7),this.limit=12,this.columns=3,this.events=[],this.loading=!0,this.error=null,this.handleEventClick=e=>{console.log("[tl-event-list] Event clicked:",e.detail.eventId),this.tlEventClick.emit(e.detail)}}watchFiltersChange(){this.loadEvents()}async componentWillLoad(){await this.loadEvents()}async loadEvents(){try{console.log("[tl-event-list] Loading events via SDK...",{limit:this.limit,category:this.category}),this.loading=!0,this.error=null;const e=(await l()).getEventsManager(),t=await e.list({limit:this.limit,category:this.category});console.log("[tl-event-list] Events loaded:",t.items.length),this.events=t.items}catch(e){console.error("[tl-event-list] Failed to load events:",e),this.error=e instanceof Error?e.message:"Failed to load events"}finally{this.loading=!1}}render(){const e="event-grid cols-"+Math.min(Math.max(this.columns,1),4);return this.loading?i("div",{class:e},Array.from({length:6}).map(((e,t)=>i("div",{class:"skeleton-card",key:t},i("div",{class:"skeleton-image"}),i("div",{class:"skeleton-content"},i("div",{class:"skeleton-line short"}),i("div",{class:"skeleton-line medium"}),i("div",{class:"skeleton-line long"})))))):this.error?i("div",{class:"error-state"},i("p",{class:"error-title"},"Error loading events"),i("p",{class:"error-message"},this.error)):0===this.events.length?i("div",{class:"empty-state"},i("svg",{class:"empty-icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor"},i("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"1.5",d:"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"})),i("p",{class:"empty-title"},"No events available"),i("p",{class:"empty-message"},"Check back later for upcoming events.")):i("div",{class:e},this.events.map((e=>i("tl-event-card",{key:e.id,event:e,onTlClick:this.handleEventClick}))))}static get watchers(){return{limit:[{watchFiltersChange:0}],category:[{watchFiltersChange:0}]}}static get style(){return":host{display:block;font-family:var(--tl-font-family)}.event-grid{display:grid;gap:var(--tl-spacing-6)}.cols-1{grid-template-columns:1fr}.cols-2{grid-template-columns:repeat(2, 1fr)}.cols-3{grid-template-columns:repeat(3, 1fr)}.cols-4{grid-template-columns:repeat(4, 1fr)}@media (max-width: 1024px){.cols-4,.cols-3{grid-template-columns:repeat(2, 1fr)}}@media (max-width: 640px){.cols-4,.cols-3,.cols-2{grid-template-columns:1fr}}.skeleton-card{background:var(--tl-secondary);border-radius:var(--tl-radius-lg);overflow:hidden}.skeleton-image{aspect-ratio:16 / 9;background:var(--tl-muted);animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}.skeleton-content{padding:var(--tl-spacing-4);display:flex;flex-direction:column;gap:0.5rem}.skeleton-line{height:1rem;background:var(--tl-muted);border-radius:var(--tl-radius-sm);animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}.skeleton-line.short{width:4rem;height:0.75rem}.skeleton-line.medium{width:75%}.skeleton-line.long{width:50%}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}.error-state{background:rgba(239, 68, 68, 0.1);border:1px solid var(--tl-error);border-radius:var(--tl-radius-lg);padding:var(--tl-spacing-4)}.error-title{margin:0;font-weight:500;color:var(--tl-error)}.error-message{margin:0.25rem 0 0;font-size:0.875rem;color:var(--tl-error)}.empty-state{text-align:center;padding:var(--tl-spacing-8) var(--tl-spacing-4)}.empty-icon{width:4rem;height:4rem;margin:0 auto 1rem;color:var(--tl-muted-foreground)}.empty-title{margin:0;font-size:1.25rem;font-weight:600;color:var(--tl-foreground)}.empty-message{margin:0.5rem 0 0;color:var(--tl-muted-foreground)}"}},[1,"tl-event-list",{limit:[2],category:[1],columns:[2],events:[32],loading:[32],error:[32]},void 0,{limit:[{watchFiltersChange:0}],category:[{watchFiltersChange:0}]}]),n=o,c=function(){"undefined"!=typeof customElements&&["tl-event-list","tl-event-card"].forEach((e=>{switch(e){case"tl-event-list":customElements.get(r(e))||customElements.define(r(e),o);break;case"tl-event-card":customElements.get(r(e))||a()}}))};export{n as TlEventList,c as defineCustomElement}

package/dist/components/tl-login2.js

@@ -1 +1 @@
-import{proxyCustomElement as i,HTMLElement as t,createEvent as e,h as s,transformTag as n}from"@stencil/core/internal/client";import{w as l}from"./sdk-connector.js";import{e as o}from"./order-summary.js";const r=i(class extends t{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.tlAuthChanged=e(this,"tlAuthChanged",7),this.tlMagicLinkSent=e(this,"tlMagicLinkSent",7),this.tlError=e(this,"tlError",7),this.heading="Sign in",this.allowCodeEntry=!0,this.phase="email",this.email="",this.code="",this.busy=!1,this.error=null,this.notice=null,this.customer=null,this.auth=null,this.unsubscribes=[],this.urlCodeUsed=!1,this.handleEmailInput=i=>{this.email=i.target.value,this.error=null},this.handleCodeInput=i=>{this.code=i.target.value,this.error=null},this.handleEmailSubmit=i=>{i.preventDefault(),this.requestLink()},this.handleCodeSubmit=i=>{i.preventDefault(),this.exchange(this.code.trim())}}async componentWillLoad(){const i=await l().catch((()=>null));if(!i)return void(this.error="Sign-in is not available right now");if(this.auth=i.getAuthManager?.()??null,!this.auth)return void(this.error="Sign-in is not available with this SDK");this.syncFromSDK(),this.unsubscribes.push(i.on("auth:changed",(()=>this.syncFromSDK()))),this.unsubscribes.push(i.on("session:changed",(()=>this.syncFromSDK())));const t=this.codeFromUrl();t&&!this.auth.authenticated&&await this.exchange(t)}disconnectedCallback(){this.unsubscribes.forEach((i=>i())),this.unsubscribes=[]}codeFromUrl(){if("undefined"==typeof window||!window.location?.search||this.urlCodeUsed)return null;const i=new URLSearchParams(window.location.search).get("code");return i&&(this.urlCodeUsed=!0),i}syncFromSDK(){this.auth&&(this.auth.authenticated?(this.customer=this.auth.customer??null,this.phase="signed-in"):"signed-in"===this.phase&&(this.customer=null,this.phase="email"))}async requestLink(i=!1){const t=this.email.trim();if(t){if(this.auth){this.busy=!0,this.error=null,this.notice=null;try{await this.auth.requestMagicLink({email:t}),this.phase="sent",this.notice=i?"Sent again. Check your inbox.":null,this.tlMagicLinkSent.emit({email:t})}catch(i){console.error("[tl-login] Magic-link request failed:",i),this.error=o(i,"Could not send your sign-in link"),this.tlError.emit({message:this.error})}finally{this.busy=!1}}}else this.error="Enter your email address"}async exchange(i){if(!i)return void(this.error="Enter the code from your email");if(!this.auth)return;const t=this.phase;this.busy=!0,this.error=null,this.phase="verifying";try{const t=await this.auth.exchange(i);this.customer=this.auth.customer??t?.customer??null,this.phase="signed-in",this.code="",this.tlAuthChanged.emit({customer:this.customer,authenticated:!0})}catch(i){console.error("[tl-login] Code exchange failed:",i),this.phase="verifying"===t||"email"===t?"email":"code",this.error="That code did not work. Check it and try again, or request a new link.",this.tlError.emit({message:this.error})}finally{this.busy=!1}}async signOut(){if(this.auth){this.busy=!0;try{await this.auth.logout()}catch(i){console.error("[tl-login] Sign out failed:",i)}finally{this.busy=!1,this.customer=null,this.phase="email",this.tlAuthChanged.emit({customer:null,authenticated:!1})}}}renderError(){return this.error?s("p",{class:"error",role:"alert"},this.error):null}render(){return"signed-in"===this.phase?s("div",{class:"login signed-in"},s("p",{class:"signed-in-text"},"Signed in as ",s("strong",null,this.customer?.email??"your account")),s("button",{type:"button",class:"secondary",disabled:this.busy,onClick:()=>this.signOut()},"Sign out")):"verifying"===this.phase?s("div",{class:"login"},s("h2",{class:"title"},"Signing you in…"),s("p",{class:"lead"},"Just a moment.")):"sent"===this.phase?s("div",{class:"login"},s("h2",{class:"title"},"Check your inbox"),s("p",{class:"lead"},"We've sent a sign-in link to ",s("strong",null,this.email),". Open it on this device to continue."),this.notice&&s("p",{class:"notice"},this.notice),this.renderError(),s("div",{class:"actions"},s("button",{type:"button",class:"secondary",disabled:this.busy,onClick:()=>this.requestLink(!0)},this.busy?"Sending…":"Resend link"),this.allowCodeEntry&&s("button",{type:"button",class:"link",onClick:()=>this.phase="code"},"Enter the code instead"),s("button",{type:"button",class:"link",onClick:()=>this.phase="email"},"Use a different email"))):"code"===this.phase?s("form",{class:"login",onSubmit:this.handleCodeSubmit},s("h2",{class:"title"},"Enter your code"),s("p",{class:"lead"},"Type the 6-digit code from the email we sent to ",s("strong",null,this.email),"."),s("label",{class:"label",htmlFor:"tl-login-code"},"Code"),s("input",{id:"tl-login-code",class:"input code-input",type:"text",inputmode:"numeric",autocomplete:"one-time-code",placeholder:"123456",value:this.code,disabled:this.busy,onInput:this.handleCodeInput}),this.renderError(),s("button",{type:"submit",class:"primary",disabled:this.busy},this.busy?"Checking…":"Sign in"),s("div",{class:"actions"},s("button",{type:"button",class:"link",onClick:()=>this.requestLink(!0)},"Resend link"),s("button",{type:"button",class:"link",onClick:()=>this.phase="sent"},"Back"))):s("form",{class:"login",onSubmit:this.handleEmailSubmit},s("h2",{class:"title"},this.heading),s("p",{class:"lead"},"Enter your email and we'll send you a secure sign-in link. No password needed."),s("label",{class:"label",htmlFor:"tl-login-email"},"Email address"),s("input",{id:"tl-login-email",class:"input",type:"email",autocomplete:"email",placeholder:"you@example.com",required:!0,value:this.email,disabled:this.busy||!this.auth,onInput:this.handleEmailInput}),this.renderError(),s("button",{type:"submit",class:"primary",disabled:this.busy||!this.auth},this.busy?"Sending link…":"Email me a sign-in link"))}static get style(){return":host{display:block;font-family:var(--tl-font-family, system-ui, sans-serif);color:var(--tl-foreground, #111827)}.login{display:flex;flex-direction:column;gap:var(--tl-spacing-3, 0.75rem);padding:var(--tl-spacing-6, 1.5rem);background:var(--tl-background, #ffffff);border:1px solid var(--tl-border, #e5e7eb);border-radius:var(--tl-radius-lg, 0.75rem)}.title{margin:0;font-size:1.25rem;font-weight:600}.lead{margin:0;font-size:0.875rem;color:var(--tl-muted-foreground, #6b7280)}.label{font-size:0.875rem;font-weight:500}.input{padding:var(--tl-spacing-3, 0.75rem);font:inherit;font-size:0.9375rem;color:var(--tl-foreground, #111827);background:var(--tl-background, #ffffff);border:1px solid var(--tl-border, #e5e7eb);border-radius:var(--tl-radius-md, 0.5rem)}.input:focus{outline:2px solid var(--tl-primary, #6366f1);outline-offset:1px}.code-input{font-family:var(--tl-font-family-mono, ui-monospace, monospace);font-size:1.25rem;letter-spacing:0.25em;text-align:center}.primary,.secondary{padding:var(--tl-spacing-3, 0.75rem) var(--tl-spacing-4, 1rem);font:inherit;font-size:0.9375rem;font-weight:600;border-radius:var(--tl-radius-md, 0.5rem);cursor:pointer}.primary{color:var(--tl-primary-foreground, #ffffff);background:var(--tl-primary, #6366f1);border:none}.primary:hover:not(:disabled){opacity:0.9}.secondary{color:var(--tl-foreground, #111827);background:var(--tl-secondary, #f3f4f6);border:1px solid var(--tl-border, #e5e7eb)}.primary:disabled,.secondary:disabled,.input:disabled{opacity:0.6;cursor:not-allowed}.link{padding:0;font:inherit;font-size:0.875rem;color:var(--tl-primary, #6366f1);background:none;border:none;cursor:pointer}.link:hover{text-decoration:underline}.actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--tl-spacing-4, 1rem)}.error{margin:0;font-size:0.8125rem;color:var(--tl-error, #ef4444)}.notice{margin:0;font-size:0.8125rem;color:var(--tl-success, #10b981)}.signed-in{flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap}.signed-in-text{margin:0;font-size:0.875rem;overflow-wrap:anywhere}"}},[1,"tl-login",{heading:[1],allowCodeEntry:[4,"allow-code-entry"],phase:[32],email:[32],code:[32],busy:[32],error:[32],notice:[32],customer:[32]}]);function a(){"undefined"!=typeof customElements&&["tl-login"].forEach((i=>{"tl-login"===i&&(customElements.get(n(i))||customElements.define(n(i),r))}))}export{r as T,a as d}
+import{proxyCustomElement as i,HTMLElement as t,createEvent as s,h as e,transformTag as n}from"@stencil/core/internal/client";import{w as l}from"./sdk-connector.js";import{e as o}from"./order-summary.js";const r=i(class extends t{constructor(i){super(),!1!==i&&this.__registerHost(),this.__attachShadow(),this.tlAuthChanged=s(this,"tlAuthChanged",7),this.tlMagicLinkSent=s(this,"tlMagicLinkSent",7),this.tlError=s(this,"tlError",7),this.heading="Sign in",this.allowCodeEntry=!0,this.phase="email",this.email="",this.code="",this.busy=!1,this.error=null,this.notice=null,this.customer=null,this.auth=null,this.unsubscribes=[],this.urlCodeUsed=!1,this.handleEmailInput=i=>{this.email=i.target.value,this.error=null},this.handleCodeInput=i=>{this.code=i.target.value,this.error=null},this.handleEmailSubmit=i=>{i.preventDefault(),this.requestLink()},this.handleCodeSubmit=i=>{i.preventDefault(),this.exchange(this.code.trim())}}async componentWillLoad(){const i=await l().catch((()=>null));if(!i)return void(this.error="Sign-in is not available right now");if(this.auth=i.getAuthManager?.()??null,!this.auth)return void(this.error="Sign-in is not available with this SDK");this.syncFromSDK(),this.unsubscribes.push(i.on("auth:changed",(()=>this.syncFromSDK()))),this.unsubscribes.push(i.on("session:changed",(()=>this.syncFromSDK())));const t=this.codeFromUrl();t&&!this.auth.authenticated&&await this.exchange(t)}disconnectedCallback(){this.unsubscribes.forEach((i=>i())),this.unsubscribes=[]}codeFromUrl(){if("undefined"==typeof window||!window.location?.search||this.urlCodeUsed)return null;const i=new URLSearchParams(window.location.search).get("code");return i&&(this.urlCodeUsed=!0),i}syncFromSDK(){this.auth&&(this.auth.authenticated?(this.customer=this.auth.customer??null,this.phase="signed-in"):"signed-in"===this.phase&&(this.customer=null,this.phase="email"))}async requestLink(i=!1){const t=this.email.trim();if(t){if(this.auth){this.busy=!0,this.error=null,this.notice=null;try{await this.auth.requestMagicLink({email:t}),this.phase="sent",this.notice=i?"Sent again. Check your inbox.":null,this.tlMagicLinkSent.emit({email:t})}catch(i){console.error("[tl-login] Magic-link request failed:",i),this.error=o(i,"Could not send your sign-in link"),this.tlError.emit({message:this.error})}finally{this.busy=!1}}}else this.error="Enter your email address"}async exchange(i){if(!i)return void(this.error="Enter the code from your email");if(!this.auth)return;const t=this.phase;this.busy=!0,this.error=null,this.phase="verifying";try{const t=await this.auth.exchange(i);this.customer=this.auth.customer??t?.customer??null,this.phase="signed-in",this.code="",this.tlAuthChanged.emit({customer:this.customer,authenticated:!0})}catch(i){console.error("[tl-login] Code exchange failed:",i),this.phase="verifying"===t||"email"===t?"email":"code",this.error="That code did not work. Check it and try again, or request a new link.",this.tlError.emit({message:this.error})}finally{this.busy=!1}}async signOut(){if(this.auth){this.busy=!0;try{await this.auth.logout()}catch(i){console.error("[tl-login] Sign out failed:",i)}finally{this.busy=!1,this.customer=null,this.phase="email",this.tlAuthChanged.emit({customer:null,authenticated:!1})}}}renderError(){return this.error?e("p",{class:"error",role:"alert"},this.error):null}render(){return"signed-in"===this.phase?e("div",{class:"login signed-in"},e("p",{class:"signed-in-text"},"Signed in as ",e("strong",null,this.customer?.email??"your account")),e("button",{type:"button",class:"secondary",disabled:this.busy,onClick:()=>this.signOut()},"Sign out")):"verifying"===this.phase?e("div",{class:"login"},e("h2",{class:"title"},"Signing you in…"),e("p",{class:"lead"},"Just a moment.")):"sent"===this.phase?e("div",{class:"login"},e("h2",{class:"title"},"Check your inbox"),e("p",{class:"lead"},"We've sent a sign-in link to ",e("strong",null,this.email),". Open it on this device to continue."),this.notice&&e("p",{class:"notice"},this.notice),this.renderError(),e("div",{class:"actions"},e("button",{type:"button",class:"secondary",disabled:this.busy,onClick:()=>this.requestLink(!0)},this.busy?"Sending…":"Resend link"),this.allowCodeEntry&&e("button",{type:"button",class:"link",onClick:()=>this.phase="code"},"Enter the code instead"),e("button",{type:"button",class:"link",onClick:()=>this.phase="email"},"Use a different email"))):"code"===this.phase?e("form",{class:"login",onSubmit:this.handleCodeSubmit},e("h2",{class:"title"},"Enter your code"),e("p",{class:"lead"},"Type the 6-digit code from the email we sent to ",e("strong",null,this.email),"."),e("label",{class:"label",htmlFor:"tl-login-code"},"Code"),e("input",{id:"tl-login-code",class:"input code-input",type:"text",inputmode:"numeric",autocomplete:"one-time-code",placeholder:"123456",value:this.code,disabled:this.busy,onInput:this.handleCodeInput}),this.renderError(),e("button",{type:"submit",class:"primary",disabled:this.busy},this.busy?"Checking…":"Sign in"),e("div",{class:"actions"},e("button",{type:"button",class:"link",onClick:()=>this.requestLink(!0)},"Resend link"),e("button",{type:"button",class:"link",onClick:()=>this.phase="sent"},"Back"))):e("form",{class:"login",onSubmit:this.handleEmailSubmit},e("h2",{class:"title"},this.heading),e("p",{class:"lead"},"Enter your email and we'll send you a secure sign-in link. No password needed."),e("label",{class:"label",htmlFor:"tl-login-email"},"Email address"),e("input",{id:"tl-login-email",class:"input",type:"email",autocomplete:"email",placeholder:"you@example.com",required:!0,value:this.email,disabled:this.busy||!this.auth,onInput:this.handleEmailInput}),this.renderError(),e("button",{type:"submit",class:"primary",disabled:this.busy||!this.auth},this.busy?"Sending link…":"Email me a sign-in link"))}static get style(){return":host{display:block;font-family:var(--tl-font-family);color:var(--tl-foreground)}.login{display:flex;flex-direction:column;gap:var(--tl-spacing-3);padding:var(--tl-spacing-6);background:var(--tl-background);border:1px solid var(--tl-border);border-radius:var(--tl-radius-lg)}.title{margin:0;font-size:1.25rem;font-weight:600}.lead{margin:0;font-size:0.875rem;color:var(--tl-muted-foreground)}.label{font-size:0.875rem;font-weight:500}.input{padding:var(--tl-spacing-3);font:inherit;font-size:0.9375rem;color:var(--tl-foreground);background:var(--tl-background);border:1px solid var(--tl-border);border-radius:var(--tl-radius-md)}.input:focus{outline:2px solid var(--tl-primary);outline-offset:1px}.code-input{font-family:var(--tl-font-family-mono);font-size:1.25rem;letter-spacing:0.25em;text-align:center}.primary,.secondary{padding:var(--tl-spacing-3) var(--tl-spacing-4);font:inherit;font-size:0.9375rem;font-weight:600;border-radius:var(--tl-radius-md);cursor:pointer}.primary{color:var(--tl-primary-foreground);background:var(--tl-primary);border:none}.primary:hover:not(:disabled){opacity:0.9}.secondary{color:var(--tl-foreground);background:var(--tl-secondary);border:1px solid var(--tl-border)}.primary:disabled,.secondary:disabled,.input:disabled{opacity:0.6;cursor:not-allowed}.link{padding:0;font:inherit;font-size:0.875rem;color:var(--tl-primary);background:none;border:none;cursor:pointer}.link:hover{text-decoration:underline}.actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--tl-spacing-4)}.error{margin:0;font-size:0.8125rem;color:var(--tl-error)}.notice{margin:0;font-size:0.8125rem;color:var(--tl-success)}.signed-in{flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap}.signed-in-text{margin:0;font-size:0.875rem;overflow-wrap:anywhere}"}},[1,"tl-login",{heading:[1],allowCodeEntry:[4,"allow-code-entry"],phase:[32],email:[32],code:[32],busy:[32],error:[32],notice:[32],customer:[32]}]);function a(){"undefined"!=typeof customElements&&["tl-login"].forEach((i=>{"tl-login"===i&&(customElements.get(n(i))||customElements.define(n(i),r))}))}export{r as T,a as d}

package/dist/components/tl-my-orders.js

@@ -1 +1 @@
-import{proxyCustomElement as r,HTMLElement as t,createEvent as e,h as s,transformTag as o}from"@stencil/core/internal/client";import{w as i}from"./sdk-connector.js";import{i as a,e as n,t as l,o as d,f as c,a as h,s as f,b as u}from"./order-summary.js";import{d as m}from"./tl-login2.js";import{d as p}from"./tl-order-tickets2.js";import{d as g}from"./tl-ticket2.js";const v=r(class extends t{constructor(r){super(),!1!==r&&this.__registerHost(),this.__attachShadow(),this.tlOrderSelect=e(this,"tlOrderSelect",7),this.tlError=e(this,"tlError",7),this.emptyMessage="When you buy tickets they'll show up here, ready to view and download.",this.columns=2,this.orders=[],this.authenticated=!1,this.loading=!0,this.error=null,this.expandedId=null,this.sdk=null,this.unsubscribes=[]}async componentWillLoad(){if(this.sdk=await i().catch((()=>null)),!this.sdk)return this.loading=!1,void(this.error="Orders are not available right now");const r=this.sdk.getAuthManager?.();this.authenticated=!r||r.authenticated,this.unsubscribes.push(this.sdk.on("auth:changed",(()=>this.syncAuth()))),this.unsubscribes.push(this.sdk.on("session:changed",(()=>this.syncAuth()))),this.authenticated?await this.load():this.loading=!1}disconnectedCallback(){this.unsubscribes.forEach((r=>r())),this.unsubscribes=[]}syncAuth(){const r=this.sdk?.getAuthManager?.();if(!r)return;const t=this.authenticated;this.authenticated=r.authenticated,this.authenticated&&!t?this.load():!this.authenticated&&t&&(this.orders=[],this.expandedId=null)}async load(){if(this.sdk)try{this.loading=!0,this.error=null;const r=this.sdk.getOrdersManager?.();if(!r)throw Error("Orders are not available");const t=await r.mine();this.orders=t??[],this.authenticated=!0}catch(r){a(r)?(this.authenticated=!1,this.orders=[]):(console.error("[tl-my-orders] Failed to load orders:",r),this.error=n(r,"Failed to load your orders"),this.tlError.emit({message:this.error}))}finally{this.loading=!1}}toggle(r){const t=this.expandedId!==r;this.expandedId=t?r:null,t&&this.tlOrderSelect.emit({orderId:r})}renderRow(r){const t=this.expandedId===r.id,e=l(r),o=f(r.status);return s("li",{class:{order:!0,expanded:t},key:r.id},s("button",{type:"button",class:"order-row","aria-expanded":t?"true":"false",onClick:()=>this.toggle(r.id)},s("span",{class:"order-main"},s("span",{class:"order-number"},"Order ",r.orderNumber),s("span",{class:"order-event"},d(r)??"Order"),s("span",{class:"order-meta"},r.createdAt&&s("span",null,c(r.createdAt)),s("span",null,e," ticket",1===e?"":"s"))),s("span",{class:"order-side"},s("span",{class:"order-total"},h(r.total,r.currency)),s("span",{class:"status status-"+o},u(r.status)),s("svg",{class:"chevron",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","aria-hidden":"true"},s("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M9 18l6-6-6-6"})))),t&&s("div",{class:"order-tickets"},s("tl-order-tickets",{orderId:r.id,columns:this.columns})))}render(){return this.loading?s("div",{class:"orders"},[0,1,2].map((r=>s("div",{class:"skeleton",key:r})))):this.authenticated?s("div",{class:"orders"},this.error?s("div",{class:"state error"},s("p",{class:"state-title"},"Could not load your orders"),s("p",{class:"state-text"},this.error)):0===this.orders.length?s("div",{class:"state empty"},s("svg",{class:"empty-icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","aria-hidden":"true"},s("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"1.5",d:"M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z"}),s("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"1.5",d:"M13 5v2M13 17v2M13 11v2"})),s("p",{class:"state-title"},"No orders yet"),s("p",{class:"state-text"},this.emptyMessage)):s("ul",{class:"order-list"},this.orders.map((r=>this.renderRow(r))))):s("div",{class:"orders"},s("div",{class:"signin"},s("p",{class:"signin-title"},"Sign in to see your orders"),s("p",{class:"signin-text"},"Your tickets and order history live in your account.")),s("tl-login",null))}static get style(){return":host{display:block;font-family:var(--tl-font-family, system-ui, sans-serif);color:var(--tl-foreground, #111827)}.orders{display:flex;flex-direction:column;gap:var(--tl-spacing-4, 1rem)}.order-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--tl-spacing-3, 0.75rem)}.order{background:var(--tl-background, #ffffff);border:1px solid var(--tl-border, #e5e7eb);border-radius:var(--tl-radius-lg, 0.75rem);overflow:hidden;transition:border-color 0.2s ease, box-shadow 0.2s ease}.order:hover,.order.expanded{border-color:var(--tl-primary, #6366f1);box-shadow:0 1px 3px rgba(0, 0, 0, 0.08)}.order-row{display:flex;align-items:center;justify-content:space-between;gap:var(--tl-spacing-4, 1rem);width:100%;padding:var(--tl-spacing-4, 1rem);font:inherit;color:inherit;text-align:left;background:none;border:none;cursor:pointer}.order-main{display:flex;flex-direction:column;gap:var(--tl-spacing-1, 0.25rem);min-width:0}.order-number{font-size:0.75rem;font-weight:500;text-transform:uppercase;letter-spacing:0.05em;color:var(--tl-muted-foreground, #6b7280)}.order-event{font-size:1rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.order-meta{display:flex;flex-wrap:wrap;gap:var(--tl-spacing-3, 0.75rem);font-size:0.8125rem;color:var(--tl-muted-foreground, #6b7280)}.order-side{display:flex;align-items:center;gap:var(--tl-spacing-3, 0.75rem);flex-shrink:0}.order-total{font-weight:600}.status{padding:0.125rem 0.5rem;font-size:0.75rem;font-weight:500;border-radius:9999px;background:var(--tl-secondary, #f3f4f6);color:var(--tl-secondary-foreground, #111827)}.status-success{background:var(--tl-success, #10b981);color:var(--tl-success-foreground, #ffffff)}.status-info{background:var(--tl-primary, #6366f1);color:var(--tl-primary-foreground, #ffffff)}.status-warning{background:var(--tl-warning, #f59e0b);color:var(--tl-warning-foreground, #ffffff)}.status-error{background:var(--tl-error, #ef4444);color:var(--tl-error-foreground, #ffffff)}.chevron{width:1.125rem;height:1.125rem;color:var(--tl-muted-foreground, #6b7280);transition:transform 0.2s ease}.expanded .chevron{transform:rotate(90deg)}.order-tickets{padding:0 var(--tl-spacing-4, 1rem) var(--tl-spacing-4, 1rem);border-top:1px solid var(--tl-border, #e5e7eb);padding-top:var(--tl-spacing-4, 1rem)}@media (max-width: 480px){.order-row{flex-direction:column;align-items:stretch}.order-side{justify-content:space-between}}.signin{text-align:center}.signin-title,.state-title{margin:0;font-size:1.125rem;font-weight:600}.signin-text,.state-text{margin:var(--tl-spacing-1, 0.25rem) 0 0;font-size:0.875rem;color:var(--tl-muted-foreground, #6b7280)}.state{padding:var(--tl-spacing-8, 2rem) var(--tl-spacing-4, 1rem);text-align:center;background:var(--tl-background, #ffffff);border:1px solid var(--tl-border, #e5e7eb);border-radius:var(--tl-radius-lg, 0.75rem)}.state.error .state-title{color:var(--tl-error, #ef4444)}.empty-icon{width:3rem;height:3rem;margin:0 auto var(--tl-spacing-3, 0.75rem);color:var(--tl-primary, #6366f1)}.skeleton{height:5rem;background:var(--tl-secondary, #f3f4f6);border-radius:var(--tl-radius-lg, 0.75rem);animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}"}},[1,"tl-my-orders",{emptyMessage:[1,"empty-message"],columns:[2],orders:[32],authenticated:[32],loading:[32],error:[32],expandedId:[32]}]),b=v,y=function(){"undefined"!=typeof customElements&&["tl-my-orders","tl-login","tl-order-tickets","tl-ticket"].forEach((r=>{switch(r){case"tl-my-orders":customElements.get(o(r))||customElements.define(o(r),v);break;case"tl-login":customElements.get(o(r))||m();break;case"tl-order-tickets":customElements.get(o(r))||p();break;case"tl-ticket":customElements.get(o(r))||g()}}))};export{b as TlMyOrders,y as defineCustomElement}
+import{proxyCustomElement as t,HTMLElement as r,createEvent as e,h as s,transformTag as o}from"@stencil/core/internal/client";import{w as i}from"./sdk-connector.js";import{i as a,e as n,t as l,o as d,f as c,a as h,s as u,b as p}from"./order-summary.js";import{d as g}from"./tl-login2.js";import{d as m}from"./tl-order-tickets2.js";import{d as v}from"./tl-ticket2.js";const f=t(class extends r{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.tlOrderSelect=e(this,"tlOrderSelect",7),this.tlError=e(this,"tlError",7),this.emptyMessage="When you buy tickets they'll show up here, ready to view and download.",this.columns=2,this.orders=[],this.authenticated=!1,this.loading=!0,this.error=null,this.expandedId=null,this.sdk=null,this.unsubscribes=[]}async componentWillLoad(){if(this.sdk=await i().catch((()=>null)),!this.sdk)return this.loading=!1,void(this.error="Orders are not available right now");const t=this.sdk.getAuthManager?.();this.authenticated=!t||t.authenticated,this.unsubscribes.push(this.sdk.on("auth:changed",(()=>this.syncAuth()))),this.unsubscribes.push(this.sdk.on("session:changed",(()=>this.syncAuth()))),this.authenticated?await this.load():this.loading=!1}disconnectedCallback(){this.unsubscribes.forEach((t=>t())),this.unsubscribes=[]}syncAuth(){const t=this.sdk?.getAuthManager?.();if(!t)return;const r=this.authenticated;this.authenticated=t.authenticated,this.authenticated&&!r?this.load():!this.authenticated&&r&&(this.orders=[],this.expandedId=null)}async load(){if(this.sdk)try{this.loading=!0,this.error=null;const t=this.sdk.getOrdersManager?.();if(!t)throw Error("Orders are not available");const r=await t.mine();this.orders=r??[],this.authenticated=!0}catch(t){a(t)?(this.authenticated=!1,this.orders=[]):(console.error("[tl-my-orders] Failed to load orders:",t),this.error=n(t,"Failed to load your orders"),this.tlError.emit({message:this.error}))}finally{this.loading=!1}}toggle(t){const r=this.expandedId!==t;this.expandedId=r?t:null,r&&this.tlOrderSelect.emit({orderId:t})}renderRow(t){const r=this.expandedId===t.id,e=l(t),o=u(t.status);return s("li",{class:{order:!0,expanded:r},key:t.id},s("button",{type:"button",class:"order-row","aria-expanded":r?"true":"false",onClick:()=>this.toggle(t.id)},s("span",{class:"order-main"},s("span",{class:"order-number"},"Order ",t.orderNumber),s("span",{class:"order-event"},d(t)??"Order"),s("span",{class:"order-meta"},t.createdAt&&s("span",null,c(t.createdAt)),s("span",null,e," ticket",1===e?"":"s"))),s("span",{class:"order-side"},s("span",{class:"order-total"},h(t.total,t.currency)),s("span",{class:"status status-"+o},p(t.status)),s("svg",{class:"chevron",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","aria-hidden":"true"},s("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M9 18l6-6-6-6"})))),r&&s("div",{class:"order-tickets"},s("tl-order-tickets",{orderId:t.id,columns:this.columns})))}render(){return this.loading?s("div",{class:"orders"},[0,1,2].map((t=>s("div",{class:"skeleton",key:t})))):this.authenticated?s("div",{class:"orders"},this.error?s("div",{class:"state error"},s("p",{class:"state-title"},"Could not load your orders"),s("p",{class:"state-text"},this.error)):0===this.orders.length?s("div",{class:"state empty"},s("svg",{class:"empty-icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","aria-hidden":"true"},s("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"1.5",d:"M2 9a3 3 0 0 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 0 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z"}),s("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"1.5",d:"M13 5v2M13 17v2M13 11v2"})),s("p",{class:"state-title"},"No orders yet"),s("p",{class:"state-text"},this.emptyMessage)):s("ul",{class:"order-list"},this.orders.map((t=>this.renderRow(t))))):s("div",{class:"orders"},s("div",{class:"signin"},s("p",{class:"signin-title"},"Sign in to see your orders"),s("p",{class:"signin-text"},"Your tickets and order history live in your account.")),s("tl-login",null))}static get style(){return":host{display:block;font-family:var(--tl-font-family);color:var(--tl-foreground)}.orders{display:flex;flex-direction:column;gap:var(--tl-spacing-4)}.order-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--tl-spacing-3)}.order{background:var(--tl-background);border:1px solid var(--tl-border);border-radius:var(--tl-radius-lg);overflow:hidden;transition:border-color 0.2s ease, box-shadow 0.2s ease}.order:hover,.order.expanded{border-color:var(--tl-primary);box-shadow:0 1px 3px rgba(0, 0, 0, 0.08)}.order-row{display:flex;align-items:center;justify-content:space-between;gap:var(--tl-spacing-4);width:100%;padding:var(--tl-spacing-4);font:inherit;color:inherit;text-align:left;background:none;border:none;cursor:pointer}.order-main{display:flex;flex-direction:column;gap:var(--tl-spacing-1);min-width:0}.order-number{font-size:0.75rem;font-weight:500;text-transform:uppercase;letter-spacing:0.05em;color:var(--tl-muted-foreground)}.order-event{font-size:1rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.order-meta{display:flex;flex-wrap:wrap;gap:var(--tl-spacing-3);font-size:0.8125rem;color:var(--tl-muted-foreground)}.order-side{display:flex;align-items:center;gap:var(--tl-spacing-3);flex-shrink:0}.order-total{font-weight:600}.status{padding:0.125rem 0.5rem;font-size:0.75rem;font-weight:500;border-radius:9999px;background:var(--tl-secondary);color:var(--tl-secondary-foreground)}.status-success{background:var(--tl-success);color:var(--tl-success-foreground)}.status-info{background:var(--tl-primary);color:var(--tl-primary-foreground)}.status-warning{background:var(--tl-warning);color:var(--tl-warning-foreground)}.status-error{background:var(--tl-error);color:var(--tl-error-foreground)}.chevron{width:1.125rem;height:1.125rem;color:var(--tl-muted-foreground);transition:transform 0.2s ease}.expanded .chevron{transform:rotate(90deg)}.order-tickets{padding:0 var(--tl-spacing-4) var(--tl-spacing-4);border-top:1px solid var(--tl-border);padding-top:var(--tl-spacing-4)}@media (max-width: 480px){.order-row{flex-direction:column;align-items:stretch}.order-side{justify-content:space-between}}.signin{text-align:center}.signin-title,.state-title{margin:0;font-size:1.125rem;font-weight:600}.signin-text,.state-text{margin:var(--tl-spacing-1) 0 0;font-size:0.875rem;color:var(--tl-muted-foreground)}.state{padding:var(--tl-spacing-8) var(--tl-spacing-4);text-align:center;background:var(--tl-background);border:1px solid var(--tl-border);border-radius:var(--tl-radius-lg)}.state.error .state-title{color:var(--tl-error)}.empty-icon{width:3rem;height:3rem;margin:0 auto var(--tl-spacing-3);color:var(--tl-primary)}.skeleton{height:5rem;background:var(--tl-secondary);border-radius:var(--tl-radius-lg);animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}"}},[1,"tl-my-orders",{emptyMessage:[1,"empty-message"],columns:[2],orders:[32],authenticated:[32],loading:[32],error:[32],expandedId:[32]}]),y=f,k=function(){"undefined"!=typeof customElements&&["tl-my-orders","tl-login","tl-order-tickets","tl-ticket"].forEach((t=>{switch(t){case"tl-my-orders":customElements.get(o(t))||customElements.define(o(t),f);break;case"tl-login":customElements.get(o(t))||g();break;case"tl-order-tickets":customElements.get(o(t))||m();break;case"tl-ticket":customElements.get(o(t))||v()}}))};export{y as TlMyOrders,k as defineCustomElement}

package/dist/components/tl-occurrence-selector2.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as t,createEvent as r,h as a,transformTag as s}from"@stencil/core/internal/client";import{w as o,g as i}from"./sdk-connector.js";const n=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.tlSelect=r(this,"tlSelect",7),this.orientation="auto",this.loading=!0,this.error=null,this.occurrences=[],this.currentMonth=new Date,this.selectedDate=null,this.computedDisplayMode="list",this.containerWidth=0}async componentWillLoad(){await this.waitForSDKAndFetch()}async waitForSDKAndFetch(){if(!this.eventId)return this.error="Event ID is required",void(this.loading=!1);try{await o(),await this.fetchOccurrences()}catch(e){this.error=e instanceof Error?e.message:"SDK not initialized.",this.loading=!1}}componentDidLoad(){this.containerRef&&"undefined"!=typeof ResizeObserver&&(this.resizeObserver=new ResizeObserver((e=>{for(const t of e)this.containerWidth=t.contentRect.width})),this.resizeObserver.observe(this.containerRef))}disconnectedCallback(){this.resizeObserver&&this.resizeObserver.disconnect()}async onEventIdChange(){await this.fetchOccurrences()}async fetchOccurrences(){this.loading=!0,this.error=null;try{const e=i().getEventsManager(),t=await e.get(this.eventId);if(!t)throw new Error("Event not found");this.occurrences=(t.occurrences||[]).map((e=>({id:e.id,startsAt:e.startsAt,endsAt:e.endsAt,status:e.availabilityStatus,availableCapacity:e.availableCapacity,soldOut:"sold_out"===e.availabilityStatus}))),this.computeDisplayMode(),this.computeInitialSelection()}catch(e){console.error("[tl-occurrence-selector] Failed to fetch occurrences:",e),this.error=e instanceof Error?e.message:"Failed to load occurrences",this.occurrences=[]}finally{this.loading=!1}}computeDisplayMode(){if(this.displayMode)return void(this.computedDisplayMode=this.displayMode);if(this.occurrences.length<=5)return void(this.computedDisplayMode="list");const e=new Set;for(const t of this.occurrences){const r=new Date(t.startsAt);e.add(r.toDateString())}this.computedDisplayMode=1===e.size?"slots":"calendar"}computeInitialSelection(){if(0===this.occurrences.length)return;const e=new Date;e.setHours(0,0,0,0);const t=this.getDatesWithOccurrences();let r=null;for(const a of Array.from(t.keys()).sort()){const t=new Date(a);if(t>=e){r=t;break}}if(!r&&t.size>0){const e=Array.from(t.keys()).sort();r=new Date(e[e.length-1])}r&&(this.selectedDate=r,this.currentMonth=new Date(r.getFullYear(),r.getMonth(),1))}getDatesWithOccurrences(){const e=new Map;for(const t of this.occurrences){const r=new Date(t.startsAt);r.setHours(0,0,0,0);const a=r.toDateString();e.has(a)||e.set(a,[]),e.get(a).push(t)}return e}getDateRange(){if(0===this.occurrences.length)return null;let e=new Date(this.occurrences[0].startsAt),t=new Date(this.occurrences[0].startsAt);for(const r of this.occurrences){const a=new Date(r.startsAt);a<e&&(e=a),a>t&&(t=a)}return{first:e,last:t}}isSingleWeek(){const e=this.getDateRange();if(!e)return!1;const t=new Date(e.first),r=t.getDay(),a=0===r?6:r-1;t.setDate(t.getDate()-a),t.setHours(0,0,0,0);const s=new Date(t);return s.setDate(s.getDate()+6),s.setHours(23,59,59,999),e.last<=s}isSingleMonth(){const e=this.getDateRange();return!!e&&e.first.getMonth()===e.last.getMonth()&&e.first.getFullYear()===e.last.getFullYear()}isHorizontalLayout(){return"horizontal"===this.orientation||"vertical"!==this.orientation&&this.containerWidth>=768}formatDate(e){return e.toLocaleDateString("en-GB",{weekday:"long",day:"numeric",month:"long",year:"numeric"})}formatTime(e){return new Date(e).toLocaleTimeString("en-GB",{hour:"2-digit",minute:"2-digit"})}formatDateTime(e){const t=new Date(e);return{date:t.toLocaleDateString("en-GB",{weekday:"long",day:"numeric",month:"long",year:"numeric"}),time:t.toLocaleTimeString("en-GB",{hour:"2-digit",minute:"2-digit"})}}handleSelect(e){e.soldOut||0===e.availableCapacity||(console.log("[tl-occurrence-selector] Selected:",e.id),this.tlSelect.emit({occurrence:e}))}handleDateSelect(e){this.selectedDate=e,e.getMonth()===this.currentMonth.getMonth()&&e.getFullYear()===this.currentMonth.getFullYear()||(this.currentMonth=new Date(e.getFullYear(),e.getMonth(),1))}handlePrevMonth(){const e=this.getDateRange();if(!e)return;const t=new Date(this.currentMonth);t.setMonth(t.getMonth()-1),t>=new Date(e.first.getFullYear(),e.first.getMonth(),1)&&(this.currentMonth=t)}handleNextMonth(){const e=this.getDateRange();if(!e)return;const t=new Date(this.currentMonth);t.setMonth(t.getMonth()+1),t<=new Date(e.last.getFullYear(),e.last.getMonth(),1)&&(this.currentMonth=t)}isPrevMonthDisabled(){const e=this.getDateRange();if(!e)return!0;const t=new Date(e.first.getFullYear(),e.first.getMonth(),1);return this.currentMonth<=t}isNextMonthDisabled(){const e=this.getDateRange();if(!e)return!0;const t=new Date(e.last.getFullYear(),e.last.getMonth(),1);return this.currentMonth>=t}getCalendarDays(){if(this.isSingleWeek()){const e=this.getDateRange();if(!e)return[];const t=new Date(e.first),r=t.getDay(),a=0===r?6:r-1;t.setDate(t.getDate()-a),t.setHours(0,0,0,0);const s=[],o=new Date(t);for(let e=0;e<7;e++)s.push(new Date(o)),o.setDate(o.getDate()+1);return s}const e=this.currentMonth.getFullYear(),t=this.currentMonth.getMonth(),r=new Date(e,t,1),a=new Date(e,t+1,0),s=r.getDay(),o=0===s?6:s-1,i=new Date(r);i.setDate(i.getDate()-o);const n=a.getDay(),l=0===n?0:7-n,d=new Date(a);d.setDate(d.getDate()+l);const c=[],u=new Date(i);for(;u<=d;)c.push(new Date(u)),u.setDate(u.getDate()+1);return c}hasOccurrencesOnDate(e){const t=e.toDateString();return this.getDatesWithOccurrences().has(t)}isDateSoldOut(e){const t=e.toDateString(),r=this.getDatesWithOccurrences().get(t);return!!r&&r.every((e=>e.soldOut||0===e.availableCapacity))}getSelectedDateOccurrences(){if(!this.selectedDate)return[];const e=this.selectedDate.toDateString();return(this.getDatesWithOccurrences().get(e)||[]).sort(((e,t)=>new Date(e.startsAt).getTime()-new Date(t.startsAt).getTime()))}getThemeStyles(){if(!this.theme)return{};const e={};return this.theme.primaryColor&&(e["--tl-primary"]=this.theme.primaryColor),this.theme.primaryForeground&&(e["--tl-primary-foreground"]=this.theme.primaryForeground),this.theme.backgroundColor&&(e["--tl-background"]=this.theme.backgroundColor),this.theme.foregroundColor&&(e["--tl-foreground"]=this.theme.foregroundColor),this.theme.mutedColor&&(e["--tl-muted"]=this.theme.mutedColor),this.theme.mutedForeground&&(e["--tl-muted-foreground"]=this.theme.mutedForeground),this.theme.borderColor&&(e["--tl-border"]=this.theme.borderColor),this.theme.borderRadius&&(e["--tl-radius"]=this.theme.borderRadius),this.theme.fontFamily&&(e["--tl-font-family"]=this.theme.fontFamily),e}renderListView(){return a("div",{class:"list-view"},this.occurrences.map((e=>{const t=e.soldOut||0===e.availableCapacity,{date:r,time:s}=this.formatDateTime(e.startsAt);return a("button",{key:e.id,class:"occurrence-item "+(t?"sold-out":""),onClick:()=>this.handleSelect(e),disabled:t},a("div",{class:"occurrence-info"},a("div",{class:"occurrence-date"},r),a("div",{class:"occurrence-time"},s,e.endsAt&&` - ${this.formatTime(e.endsAt)}`)),a("div",{class:"occurrence-status"},t?a("span",{class:"status-sold-out"},"Sold Out"):e.availableCapacity?a("span",{class:"status-available"},e.availableCapacity," available"):a("span",{class:"status-arrow"},"→")))})))}renderSlotsView(){const e=[...this.occurrences].sort(((e,t)=>new Date(e.startsAt).getTime()-new Date(t.startsAt).getTime())),t=e.length>0?this.formatDate(new Date(e[0].startsAt)):"";return a("div",{class:"slots-view"},t&&a("div",{class:"slots-date-header"},t),a("div",{class:"time-slots-grid"},e.map((e=>{const t=e.soldOut||0===e.availableCapacity;return a("button",{key:e.id,class:"time-slot "+(t?"sold-out":""),onClick:()=>this.handleSelect(e),disabled:t},a("span",{class:"slot-time"},this.formatTime(e.startsAt)),t&&a("span",{class:"slot-sold-out"},"Sold Out"))}))))}renderCalendarHeader(){const e=this.currentMonth.toLocaleDateString("en-GB",{month:"long",year:"numeric"}),t=!this.isSingleMonth();return a("div",{class:"calendar-header"},a("span",{class:"month-label"},e),t&&a("div",{class:"calendar-nav-buttons"},a("button",{class:"nav-button",onClick:()=>this.handlePrevMonth(),disabled:this.isPrevMonthDisabled(),"aria-label":"Previous month"},a("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2"},a("path",{d:"M15 18l-6-6 6-6"}))),a("button",{class:"nav-button",onClick:()=>this.handleNextMonth(),disabled:this.isNextMonthDisabled(),"aria-label":"Next month"},a("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2"},a("path",{d:"M9 18l6-6-6-6"})))))}renderCalendarGrid(){const e=this.getCalendarDays(),t=new Date;return t.setHours(0,0,0,0),a("div",{class:"calendar-grid"},["Mon","Tue","Wed","Thu","Fri","Sat","Sun"].map((e=>a("div",{class:"weekday-header",key:e},e))),e.map((e=>{const r=e.getMonth()===this.currentMonth.getMonth(),s=this.hasOccurrencesOnDate(e),o=this.isDateSoldOut(e),i=this.selectedDate&&e.toDateString()===this.selectedDate.toDateString(),n=e.toDateString()===t.toDateString(),l=e<t;return a("button",{key:e.toISOString(),class:`calendar-day \n                ${r?"":"other-month"} \n                ${s?"has-occurrences":""} \n                ${o?"sold-out":""} \n                ${i?"selected":""} \n                ${n?"today":""}\n                ${l?"past":""}`,onClick:()=>s&&this.handleDateSelect(e),disabled:!s},a("span",{class:"day-number"},e.getDate()),s&&a("span",{class:"occurrence-dot"}))})))}renderSelectedDateSlots(){const e=this.getSelectedDateOccurrences();if(!this.selectedDate||0===e.length)return a("div",{class:"selected-date-slots empty"},a("p",null,"Select a date to see available times"));const t=this.formatDate(this.selectedDate);return a("div",{class:"selected-date-slots"},a("div",{class:"selected-date-header"},t),a("div",{class:"time-slots-list"},e.map((e=>{const t=e.soldOut||0===e.availableCapacity;return a("button",{key:e.id,class:"time-slot-item "+(t?"sold-out":""),onClick:()=>this.handleSelect(e),disabled:t},a("span",{class:"slot-time"},this.formatTime(e.startsAt)),a("div",{class:"slot-status"},t?a("span",{class:"status-sold-out"},"Sold Out"):e.availableCapacity?a("span",{class:"status-available"},e.availableCapacity," available"):a("span",{class:"status-arrow"},"→")))}))))}renderCalendarView(){const e=this.isHorizontalLayout();return a("div",{class:"calendar-view "+(e?"horizontal":"vertical")},a("div",{class:"calendar-panel"},this.renderCalendarHeader(),this.renderCalendarGrid()),a("div",{class:"slots-panel"},this.renderSelectedDateSlots()))}renderSkeleton(){return a("div",{class:"loading-container"},a("div",{class:"skeleton-calendar"},a("div",{class:"skeleton skeleton-calendar-header"}),a("div",{class:"skeleton-calendar-grid"},Array.from({length:35},((e,t)=>a("div",{key:t,class:"skeleton skeleton-calendar-day"}))))))}render(){const e=this.getThemeStyles();return a("div",{key:"40758aaa06e5f062de92675766e4531995f74bc7",class:"occurrence-selector",ref:e=>this.containerRef=e,style:e},this.loading&&this.renderSkeleton(),!this.loading&&this.error&&a("div",{key:"6d2f5b9c07f65d4941bfb4870729fe3248cb277e",class:"error-container"},a("svg",{key:"daaf1f48dcff80ae7cf94ae0da1d66d9c9b7fb0f",class:"error-icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2"},a("circle",{key:"0a9f494a5cf7f79146e56fc44469a3ca9e5238ae",cx:"12",cy:"12",r:"10"}),a("path",{key:"67d7b453508c847593136bd60e34ea0c38d30cda",d:"M12 8v4m0 4h.01"})),a("p",{key:"c1cc92585ed4451b686350b6d718c3ba06b72dd3",class:"error-message"},this.error),a("button",{key:"4ec9d048af704af12a800385b9868501973ba477",class:"retry-button",onClick:()=>this.fetchOccurrences()},"Retry")),!this.loading&&!this.error&&(0===this.occurrences.length?a("div",{class:"no-occurrences"},a("p",null,"No dates available for this event.")):a("div",{class:"selector-content"},"list"===this.computedDisplayMode&&this.renderListView(),"slots"===this.computedDisplayMode&&this.renderSlotsView(),"calendar"===this.computedDisplayMode&&this.renderCalendarView())))}static get watchers(){return{eventId:[{onEventIdChange:0}]}}static get style(){return":host{--tl-radius:var(--tl-radius-md, 0.5rem);display:block;font-family:var(--tl-font-family, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);color:var(--tl-foreground, #0f172a)}*{box-sizing:border-box;margin:0;padding:0}.occurrence-selector{width:100%}.no-occurrences{text-align:center;padding:3rem 1rem;color:var(--tl-muted-foreground, #64748b)}.list-view{display:flex;flex-direction:column;gap:0.75rem}.occurrence-item{display:flex;justify-content:space-between;align-items:flex-start;width:100%;padding:1rem 1.25rem;background:var(--tl-background, #ffffff);border:1px solid var(--tl-border, #e2e8f0);border-radius:var(--tl-radius);text-align:left;cursor:pointer;transition:all 0.15s ease;font-family:inherit}.occurrence-item:hover:not(:disabled){border-color:var(--tl-primary, #e64b12);background:color-mix(in srgb, var(--tl-primary, #e64b12) 5%, var(--tl-background, #ffffff))}.occurrence-item:focus-visible{outline:2px solid var(--tl-primary);outline-offset:2px}.occurrence-item:disabled{cursor:not-allowed;opacity:0.6;background:var(--tl-muted, #f1f5f9)}.occurrence-item.sold-out{opacity:0.6;background:var(--tl-muted, #f1f5f9)}.occurrence-info{flex:1}.occurrence-date{font-weight:600;font-size:0.9375rem;color:var(--tl-foreground, #0f172a);margin-bottom:0.25rem}.occurrence-time{font-size:0.875rem;color:var(--tl-muted-foreground)}.occurrence-status{flex-shrink:0;text-align:right}.status-sold-out{font-size:0.875rem;font-weight:500;color:var(--tl-muted-foreground)}.status-available{font-size:0.875rem;color:var(--tl-muted-foreground)}.status-arrow{font-size:1.25rem;color:var(--tl-primary, #e64b12)}.slots-view{display:flex;flex-direction:column;gap:1rem}.slots-date-header{font-size:1.125rem;font-weight:600;color:var(--tl-foreground, #0f172a);padding-bottom:0.5rem;border-bottom:1px solid var(--tl-border)}.time-slots-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(100px, 1fr));gap:0.5rem}.time-slot{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0.75rem 0.5rem;background:var(--tl-background, #ffffff);border:1px solid var(--tl-border, #e2e8f0);border-radius:var(--tl-radius);cursor:pointer;transition:all 0.15s ease;font-family:inherit;min-height:3.5rem}.time-slot:hover:not(:disabled){border-color:var(--tl-primary, #e64b12);background:color-mix(in srgb, var(--tl-primary, #e64b12) 5%, var(--tl-background, #ffffff))}.time-slot:focus-visible{outline:2px solid var(--tl-primary);outline-offset:2px}.time-slot:disabled{cursor:not-allowed;opacity:0.6;background:var(--tl-muted, #f1f5f9)}.time-slot.sold-out{opacity:0.6;background:var(--tl-muted, #f1f5f9)}.slot-time{font-size:0.9375rem;font-weight:600;color:var(--tl-foreground, #0f172a)}.slot-sold-out{font-size:0.6875rem;color:var(--tl-muted-foreground);margin-top:0.125rem}.calendar-view{display:flex;flex-direction:column;gap:1.5rem}.calendar-view.horizontal{flex-direction:row;gap:1.5rem;align-items:flex-start}.calendar-view.horizontal .calendar-panel{flex-shrink:0;width:340px}.calendar-view.horizontal .slots-panel{flex:1;min-width:0}.calendar-view.vertical .calendar-panel{width:100%}.calendar-view.vertical .slots-panel{width:100%}.calendar-panel{border:1px solid var(--tl-border, #e2e8f0);border-radius:var(--tl-radius);padding:1rem}.calendar-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:0.75rem}.month-label{font-size:1rem;font-weight:600;color:var(--tl-foreground, #0f172a);flex:1}.calendar-nav-buttons{display:flex;gap:0.375rem}.nav-button{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;padding:0;background:var(--tl-background, #ffffff);border:1px solid var(--tl-border, #e2e8f0);border-radius:var(--tl-radius);cursor:pointer;transition:all 0.15s ease;color:var(--tl-foreground, #0f172a)}.nav-button:hover:not(:disabled){background:var(--tl-muted, #f1f5f9)}.nav-button:disabled{cursor:not-allowed;opacity:0.4}.nav-button svg{width:0.875rem;height:0.875rem}.calendar-grid{display:grid;grid-template-columns:repeat(7, 1fr);gap:0.1875rem}.weekday-header{text-align:center;font-size:0.6875rem;font-weight:600;color:var(--tl-muted-foreground);padding:0.375rem 0;text-transform:uppercase;letter-spacing:0.05em}.calendar-day{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;aspect-ratio:1;padding:0.1875rem;background:var(--tl-background, #ffffff);border:1px solid transparent;border-radius:var(--tl-radius);cursor:default;transition:all 0.15s ease;font-family:inherit;font-size:0.9375rem;font-weight:500;color:var(--tl-foreground, #0f172a)}.calendar-day.other-month{color:var(--tl-muted-foreground);opacity:0.5}.calendar-day.has-occurrences{cursor:pointer;background:color-mix(in srgb, var(--tl-primary, #e64b12) 10%, var(--tl-background, #ffffff));border-color:transparent;font-weight:600;color:var(--tl-primary, #e64b12)}.calendar-day.has-occurrences:hover{background:color-mix(in srgb, var(--tl-primary, #e64b12) 18%, var(--tl-background, #ffffff));border-color:transparent}.calendar-day.has-occurrences.sold-out{background:var(--tl-muted, #f1f5f9);border-color:transparent}.calendar-day.has-occurrences.sold-out:hover{background:color-mix(in srgb, var(--tl-muted, #f1f5f9) 80%, var(--tl-background, #ffffff));border-color:transparent}.calendar-day.selected{background:var(--tl-primary, #e64b12);border-color:var(--tl-primary, #e64b12);color:var(--tl-primary-foreground, #ffffff)}.calendar-day.selected:hover{background:color-mix(in srgb, var(--tl-primary, #e64b12) 90%, black)}.calendar-day.selected .occurrence-dot{background:var(--tl-primary-foreground)}.calendar-day.today .day-number{font-weight:700;text-decoration:underline;text-underline-offset:2px}.calendar-day.past:not(.has-occurrences){opacity:0.4}.day-number{line-height:1}.occurrence-dot{display:none}.slots-panel{min-height:200px}.selected-date-slots{height:100%}.selected-date-slots.empty{display:flex;align-items:center;justify-content:center;color:var(--tl-muted-foreground);background:var(--tl-muted, #f1f5f9);border-radius:var(--tl-radius);padding:2rem 1rem;text-align:center;min-height:200px;font-size:0.875rem}.selected-date-header{font-size:0.9375rem;font-weight:600;color:var(--tl-foreground, #0f172a);padding-bottom:0.625rem;margin-bottom:0.625rem}.time-slots-list{display:flex;flex-direction:column;gap:0.5rem}.time-slot-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0.625rem 0.875rem;background:var(--tl-background, #ffffff);border:1px solid var(--tl-border, #e2e8f0);border-radius:var(--tl-radius);text-align:left;cursor:pointer;transition:all 0.15s ease;font-family:inherit}.time-slot-item:hover:not(:disabled){border-color:var(--tl-primary, #e64b12);background:color-mix(in srgb, var(--tl-primary, #e64b12) 5%, var(--tl-background, #ffffff))}.time-slot-item:focus-visible{outline:2px solid var(--tl-primary);outline-offset:2px}.time-slot-item:disabled{cursor:not-allowed;opacity:0.6;background:var(--tl-muted, #f1f5f9)}.time-slot-item.sold-out{opacity:0.6;background:var(--tl-muted, #f1f5f9)}.time-slot-item .slot-time{font-size:0.9375rem;font-weight:600}.slot-status{flex-shrink:0}.slot-status .status-sold-out{font-size:0.75rem}.slot-status .status-available{font-size:0.75rem}.slot-status .status-arrow{font-size:1rem}@media (max-width: 640px){.event-name{font-size:1.25rem}.occurrence-date{font-size:0.875rem}.time-slots-grid{grid-template-columns:repeat(auto-fill, minmax(80px, 1fr))}.time-slot{padding:0.625rem 0.375rem;min-height:3rem}.slot-time{font-size:0.875rem}.calendar-day{font-size:0.75rem}.weekday-header{font-size:0.625rem}.calendar-view.horizontal .calendar-panel{width:100%}}@media (max-width: 767px){.calendar-view.horizontal{flex-direction:column}}.loading-container{padding:1rem 0;min-height:400px}@keyframes skeleton-pulse{0%,100%{opacity:1}50%{opacity:0.5}}.skeleton{background:var(--tl-muted, #f1f5f9);border-radius:var(--tl-radius);animation:skeleton-pulse 1.5s ease-in-out infinite}.skeleton-list{display:flex;flex-direction:column;gap:0.75rem}.skeleton-list-item{height:4.5rem;border-radius:var(--tl-radius)}.skeleton-calendar{border:1px solid var(--tl-border, #e2e8f0);border-radius:var(--tl-radius);padding:1rem;min-height:350px}.skeleton-calendar-header{height:1.75rem;width:50%;margin-bottom:0.75rem;border-radius:var(--tl-radius)}.skeleton-calendar-grid{display:grid;grid-template-columns:repeat(7, 1fr);gap:0.1875rem;margin-top:0.75rem}.skeleton-calendar-day{aspect-ratio:1;border-radius:var(--tl-radius)}.skeleton-slots{display:flex;flex-direction:column;gap:1rem}.skeleton-slots-header{height:1.75rem;width:60%;border-radius:var(--tl-radius);margin-bottom:0.5rem}.skeleton-slots-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(100px, 1fr));gap:0.5rem}.skeleton-slot-item{height:3.5rem;border-radius:var(--tl-radius)}.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;gap:1rem;text-align:center}.error-icon{width:3rem;height:3rem;color:var(--tl-muted-foreground);stroke-width:1.5}.error-message{color:var(--tl-foreground, #0f172a);font-size:0.9375rem;max-width:400px}.retry-button{margin-top:0.5rem;padding:0.625rem 1.25rem;background:var(--tl-primary, #e64b12);color:var(--tl-primary-foreground, #ffffff);border:none;border-radius:var(--tl-radius);font-family:inherit;font-size:0.875rem;font-weight:500;cursor:pointer;transition:all 0.15s ease}.retry-button:hover{background:color-mix(in srgb, var(--tl-primary, #e64b12) 90%, black)}.retry-button:focus-visible{outline:2px solid var(--tl-primary);outline-offset:2px}"}},[1,"tl-occurrence-selector",{eventId:[1,"event-id"],displayMode:[1,"display-mode"],orientation:[1],theme:[16],loading:[32],error:[32],occurrences:[32],currentMonth:[32],selectedDate:[32],computedDisplayMode:[32],containerWidth:[32]},void 0,{eventId:[{onEventIdChange:0}]}]);function l(){"undefined"!=typeof customElements&&["tl-occurrence-selector"].forEach((e=>{"tl-occurrence-selector"===e&&(customElements.get(s(e))||customElements.define(s(e),n))}))}export{n as T,l as d}
+import{proxyCustomElement as e,HTMLElement as t,createEvent as r,h as a,transformTag as o}from"@stencil/core/internal/client";import{w as s,g as i}from"./sdk-connector.js";const n=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.tlSelect=r(this,"tlSelect",7),this.orientation="auto",this.loading=!0,this.error=null,this.occurrences=[],this.currentMonth=new Date,this.selectedDate=null,this.computedDisplayMode="list",this.containerWidth=0}async componentWillLoad(){await this.waitForSDKAndFetch()}async waitForSDKAndFetch(){if(!this.eventId)return this.error="Event ID is required",void(this.loading=!1);try{await s(),await this.fetchOccurrences()}catch(e){this.error=e instanceof Error?e.message:"SDK not initialized.",this.loading=!1}}componentDidLoad(){this.containerRef&&"undefined"!=typeof ResizeObserver&&(this.resizeObserver=new ResizeObserver((e=>{for(const t of e)this.containerWidth=t.contentRect.width})),this.resizeObserver.observe(this.containerRef))}disconnectedCallback(){this.resizeObserver&&this.resizeObserver.disconnect()}async onEventIdChange(){await this.fetchOccurrences()}async fetchOccurrences(){this.loading=!0,this.error=null;try{const e=i().getEventsManager(),t=await e.get(this.eventId);if(!t)throw new Error("Event not found");this.occurrences=(t.occurrences||[]).map((e=>({id:e.id,startsAt:e.startsAt,endsAt:e.endsAt,status:e.availabilityStatus,availableCapacity:e.availableCapacity,soldOut:"sold_out"===e.availabilityStatus}))),this.computeDisplayMode(),this.computeInitialSelection()}catch(e){console.error("[tl-occurrence-selector] Failed to fetch occurrences:",e),this.error=e instanceof Error?e.message:"Failed to load occurrences",this.occurrences=[]}finally{this.loading=!1}}computeDisplayMode(){if(this.displayMode)return void(this.computedDisplayMode=this.displayMode);if(this.occurrences.length<=5)return void(this.computedDisplayMode="list");const e=new Set;for(const t of this.occurrences){const r=new Date(t.startsAt);e.add(r.toDateString())}this.computedDisplayMode=1===e.size?"slots":"calendar"}computeInitialSelection(){if(0===this.occurrences.length)return;const e=new Date;e.setHours(0,0,0,0);const t=this.getDatesWithOccurrences();let r=null;for(const a of Array.from(t.keys()).sort()){const t=new Date(a);if(t>=e){r=t;break}}if(!r&&t.size>0){const e=Array.from(t.keys()).sort();r=new Date(e[e.length-1])}r&&(this.selectedDate=r,this.currentMonth=new Date(r.getFullYear(),r.getMonth(),1))}getDatesWithOccurrences(){const e=new Map;for(const t of this.occurrences){const r=new Date(t.startsAt);r.setHours(0,0,0,0);const a=r.toDateString();e.has(a)||e.set(a,[]),e.get(a).push(t)}return e}getDateRange(){if(0===this.occurrences.length)return null;let e=new Date(this.occurrences[0].startsAt),t=new Date(this.occurrences[0].startsAt);for(const r of this.occurrences){const a=new Date(r.startsAt);a<e&&(e=a),a>t&&(t=a)}return{first:e,last:t}}isSingleWeek(){const e=this.getDateRange();if(!e)return!1;const t=new Date(e.first),r=t.getDay(),a=0===r?6:r-1;t.setDate(t.getDate()-a),t.setHours(0,0,0,0);const o=new Date(t);return o.setDate(o.getDate()+6),o.setHours(23,59,59,999),e.last<=o}isSingleMonth(){const e=this.getDateRange();return!!e&&e.first.getMonth()===e.last.getMonth()&&e.first.getFullYear()===e.last.getFullYear()}isHorizontalLayout(){return"horizontal"===this.orientation||"vertical"!==this.orientation&&this.containerWidth>=768}formatDate(e){return e.toLocaleDateString("en-GB",{weekday:"long",day:"numeric",month:"long",year:"numeric"})}formatTime(e){return new Date(e).toLocaleTimeString("en-GB",{hour:"2-digit",minute:"2-digit"})}formatDateTime(e){const t=new Date(e);return{date:t.toLocaleDateString("en-GB",{weekday:"long",day:"numeric",month:"long",year:"numeric"}),time:t.toLocaleTimeString("en-GB",{hour:"2-digit",minute:"2-digit"})}}handleSelect(e){e.soldOut||0===e.availableCapacity||(console.log("[tl-occurrence-selector] Selected:",e.id),this.tlSelect.emit({occurrence:e}))}handleDateSelect(e){this.selectedDate=e,e.getMonth()===this.currentMonth.getMonth()&&e.getFullYear()===this.currentMonth.getFullYear()||(this.currentMonth=new Date(e.getFullYear(),e.getMonth(),1))}handlePrevMonth(){const e=this.getDateRange();if(!e)return;const t=new Date(this.currentMonth);t.setMonth(t.getMonth()-1),t>=new Date(e.first.getFullYear(),e.first.getMonth(),1)&&(this.currentMonth=t)}handleNextMonth(){const e=this.getDateRange();if(!e)return;const t=new Date(this.currentMonth);t.setMonth(t.getMonth()+1),t<=new Date(e.last.getFullYear(),e.last.getMonth(),1)&&(this.currentMonth=t)}isPrevMonthDisabled(){const e=this.getDateRange();if(!e)return!0;const t=new Date(e.first.getFullYear(),e.first.getMonth(),1);return this.currentMonth<=t}isNextMonthDisabled(){const e=this.getDateRange();if(!e)return!0;const t=new Date(e.last.getFullYear(),e.last.getMonth(),1);return this.currentMonth>=t}getCalendarDays(){if(this.isSingleWeek()){const e=this.getDateRange();if(!e)return[];const t=new Date(e.first),r=t.getDay(),a=0===r?6:r-1;t.setDate(t.getDate()-a),t.setHours(0,0,0,0);const o=[],s=new Date(t);for(let e=0;e<7;e++)o.push(new Date(s)),s.setDate(s.getDate()+1);return o}const e=this.currentMonth.getFullYear(),t=this.currentMonth.getMonth(),r=new Date(e,t,1),a=new Date(e,t+1,0),o=r.getDay(),s=0===o?6:o-1,i=new Date(r);i.setDate(i.getDate()-s);const n=a.getDay(),l=0===n?0:7-n,d=new Date(a);d.setDate(d.getDate()+l);const c=[],u=new Date(i);for(;u<=d;)c.push(new Date(u)),u.setDate(u.getDate()+1);return c}hasOccurrencesOnDate(e){const t=e.toDateString();return this.getDatesWithOccurrences().has(t)}isDateSoldOut(e){const t=e.toDateString(),r=this.getDatesWithOccurrences().get(t);return!!r&&r.every((e=>e.soldOut||0===e.availableCapacity))}getSelectedDateOccurrences(){if(!this.selectedDate)return[];const e=this.selectedDate.toDateString();return(this.getDatesWithOccurrences().get(e)||[]).sort(((e,t)=>new Date(e.startsAt).getTime()-new Date(t.startsAt).getTime()))}getThemeStyles(){if(!this.theme)return{};const e={};return this.theme.primaryColor&&(e["--tl-primary"]=this.theme.primaryColor),this.theme.primaryForeground&&(e["--tl-primary-foreground"]=this.theme.primaryForeground),this.theme.backgroundColor&&(e["--tl-background"]=this.theme.backgroundColor),this.theme.foregroundColor&&(e["--tl-foreground"]=this.theme.foregroundColor),this.theme.mutedColor&&(e["--tl-muted"]=this.theme.mutedColor),this.theme.mutedForeground&&(e["--tl-muted-foreground"]=this.theme.mutedForeground),this.theme.borderColor&&(e["--tl-border"]=this.theme.borderColor),this.theme.borderRadius&&(e["--tl-radius"]=this.theme.borderRadius),this.theme.fontFamily&&(e["--tl-font-family"]=this.theme.fontFamily),e}renderListView(){return a("div",{class:"list-view"},this.occurrences.map((e=>{const t=e.soldOut||0===e.availableCapacity,{date:r,time:o}=this.formatDateTime(e.startsAt);return a("button",{key:e.id,class:"occurrence-item "+(t?"sold-out":""),onClick:()=>this.handleSelect(e),disabled:t},a("div",{class:"occurrence-info"},a("div",{class:"occurrence-date"},r),a("div",{class:"occurrence-time"},o,e.endsAt&&` - ${this.formatTime(e.endsAt)}`)),a("div",{class:"occurrence-status"},t?a("span",{class:"status-sold-out"},"Sold Out"):e.availableCapacity?a("span",{class:"status-available"},e.availableCapacity," available"):a("span",{class:"status-arrow"},"→")))})))}renderSlotsView(){const e=[...this.occurrences].sort(((e,t)=>new Date(e.startsAt).getTime()-new Date(t.startsAt).getTime())),t=e.length>0?this.formatDate(new Date(e[0].startsAt)):"";return a("div",{class:"slots-view"},t&&a("div",{class:"slots-date-header"},t),a("div",{class:"time-slots-grid"},e.map((e=>{const t=e.soldOut||0===e.availableCapacity;return a("button",{key:e.id,class:"time-slot "+(t?"sold-out":""),onClick:()=>this.handleSelect(e),disabled:t},a("span",{class:"slot-time"},this.formatTime(e.startsAt)),t&&a("span",{class:"slot-sold-out"},"Sold Out"))}))))}renderCalendarHeader(){const e=this.currentMonth.toLocaleDateString("en-GB",{month:"long",year:"numeric"}),t=!this.isSingleMonth();return a("div",{class:"calendar-header"},a("span",{class:"month-label"},e),t&&a("div",{class:"calendar-nav-buttons"},a("button",{class:"nav-button",onClick:()=>this.handlePrevMonth(),disabled:this.isPrevMonthDisabled(),"aria-label":"Previous month"},a("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2"},a("path",{d:"M15 18l-6-6 6-6"}))),a("button",{class:"nav-button",onClick:()=>this.handleNextMonth(),disabled:this.isNextMonthDisabled(),"aria-label":"Next month"},a("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2"},a("path",{d:"M9 18l6-6-6-6"})))))}renderCalendarGrid(){const e=this.getCalendarDays(),t=new Date;return t.setHours(0,0,0,0),a("div",{class:"calendar-grid"},["Mon","Tue","Wed","Thu","Fri","Sat","Sun"].map((e=>a("div",{class:"weekday-header",key:e},e))),e.map((e=>{const r=e.getMonth()===this.currentMonth.getMonth(),o=this.hasOccurrencesOnDate(e),s=this.isDateSoldOut(e),i=this.selectedDate&&e.toDateString()===this.selectedDate.toDateString(),n=e.toDateString()===t.toDateString(),l=e<t;return a("button",{key:e.toISOString(),class:`calendar-day \n                ${r?"":"other-month"} \n                ${o?"has-occurrences":""} \n                ${s?"sold-out":""} \n                ${i?"selected":""} \n                ${n?"today":""}\n                ${l?"past":""}`,onClick:()=>o&&this.handleDateSelect(e),disabled:!o},a("span",{class:"day-number"},e.getDate()),o&&a("span",{class:"occurrence-dot"}))})))}renderSelectedDateSlots(){const e=this.getSelectedDateOccurrences();if(!this.selectedDate||0===e.length)return a("div",{class:"selected-date-slots empty"},a("p",null,"Select a date to see available times"));const t=this.formatDate(this.selectedDate);return a("div",{class:"selected-date-slots"},a("div",{class:"selected-date-header"},t),a("div",{class:"time-slots-list"},e.map((e=>{const t=e.soldOut||0===e.availableCapacity;return a("button",{key:e.id,class:"time-slot-item "+(t?"sold-out":""),onClick:()=>this.handleSelect(e),disabled:t},a("span",{class:"slot-time"},this.formatTime(e.startsAt)),a("div",{class:"slot-status"},t?a("span",{class:"status-sold-out"},"Sold Out"):e.availableCapacity?a("span",{class:"status-available"},e.availableCapacity," available"):a("span",{class:"status-arrow"},"→")))}))))}renderCalendarView(){const e=this.isHorizontalLayout();return a("div",{class:"calendar-view "+(e?"horizontal":"vertical")},a("div",{class:"calendar-panel"},this.renderCalendarHeader(),this.renderCalendarGrid()),a("div",{class:"slots-panel"},this.renderSelectedDateSlots()))}renderSkeleton(){return a("div",{class:"loading-container"},a("div",{class:"skeleton-calendar"},a("div",{class:"skeleton skeleton-calendar-header"}),a("div",{class:"skeleton-calendar-grid"},Array.from({length:35},((e,t)=>a("div",{key:t,class:"skeleton skeleton-calendar-day"}))))))}render(){const e=this.getThemeStyles();return a("div",{key:"40758aaa06e5f062de92675766e4531995f74bc7",class:"occurrence-selector",ref:e=>this.containerRef=e,style:e},this.loading&&this.renderSkeleton(),!this.loading&&this.error&&a("div",{key:"6d2f5b9c07f65d4941bfb4870729fe3248cb277e",class:"error-container"},a("svg",{key:"daaf1f48dcff80ae7cf94ae0da1d66d9c9b7fb0f",class:"error-icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"2"},a("circle",{key:"0a9f494a5cf7f79146e56fc44469a3ca9e5238ae",cx:"12",cy:"12",r:"10"}),a("path",{key:"67d7b453508c847593136bd60e34ea0c38d30cda",d:"M12 8v4m0 4h.01"})),a("p",{key:"c1cc92585ed4451b686350b6d718c3ba06b72dd3",class:"error-message"},this.error),a("button",{key:"4ec9d048af704af12a800385b9868501973ba477",class:"retry-button",onClick:()=>this.fetchOccurrences()},"Retry")),!this.loading&&!this.error&&(0===this.occurrences.length?a("div",{class:"no-occurrences"},a("p",null,"No dates available for this event.")):a("div",{class:"selector-content"},"list"===this.computedDisplayMode&&this.renderListView(),"slots"===this.computedDisplayMode&&this.renderSlotsView(),"calendar"===this.computedDisplayMode&&this.renderCalendarView())))}static get watchers(){return{eventId:[{onEventIdChange:0}]}}static get style(){return":host{display:block;font-family:var(--tl-font-family);color:var(--tl-foreground)}*{box-sizing:border-box;margin:0;padding:0}.occurrence-selector{width:100%}.no-occurrences{text-align:center;padding:3rem 1rem;color:var(--tl-muted-foreground)}.list-view{display:flex;flex-direction:column;gap:0.75rem}.occurrence-item{display:flex;justify-content:space-between;align-items:flex-start;width:100%;padding:1rem 1.25rem;background:var(--tl-background);border:1px solid var(--tl-border);border-radius:var(--tl-radius);text-align:left;cursor:pointer;transition:all 0.15s ease;font-family:inherit}.occurrence-item:hover:not(:disabled){border-color:var(--tl-primary);background:color-mix(in srgb, var(--tl-primary) 5%, var(--tl-background))}.occurrence-item:focus-visible{outline:2px solid var(--tl-primary);outline-offset:2px}.occurrence-item:disabled{cursor:not-allowed;opacity:0.6;background:var(--tl-muted)}.occurrence-item.sold-out{opacity:0.6;background:var(--tl-muted)}.occurrence-info{flex:1}.occurrence-date{font-weight:600;font-size:0.9375rem;color:var(--tl-foreground);margin-bottom:0.25rem}.occurrence-time{font-size:0.875rem;color:var(--tl-muted-foreground)}.occurrence-status{flex-shrink:0;text-align:right}.status-sold-out{font-size:0.875rem;font-weight:500;color:var(--tl-muted-foreground)}.status-available{font-size:0.875rem;color:var(--tl-muted-foreground)}.status-arrow{font-size:1.25rem;color:var(--tl-primary)}.slots-view{display:flex;flex-direction:column;gap:1rem}.slots-date-header{font-size:1.125rem;font-weight:600;color:var(--tl-foreground);padding-bottom:0.5rem;border-bottom:1px solid var(--tl-border)}.time-slots-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(100px, 1fr));gap:0.5rem}.time-slot{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0.75rem 0.5rem;background:var(--tl-background);border:1px solid var(--tl-border);border-radius:var(--tl-radius);cursor:pointer;transition:all 0.15s ease;font-family:inherit;min-height:3.5rem}.time-slot:hover:not(:disabled){border-color:var(--tl-primary);background:color-mix(in srgb, var(--tl-primary) 5%, var(--tl-background))}.time-slot:focus-visible{outline:2px solid var(--tl-primary);outline-offset:2px}.time-slot:disabled{cursor:not-allowed;opacity:0.6;background:var(--tl-muted)}.time-slot.sold-out{opacity:0.6;background:var(--tl-muted)}.slot-time{font-size:0.9375rem;font-weight:600;color:var(--tl-foreground)}.slot-sold-out{font-size:0.6875rem;color:var(--tl-muted-foreground);margin-top:0.125rem}.calendar-view{display:flex;flex-direction:column;gap:1.5rem}.calendar-view.horizontal{flex-direction:row;gap:1.5rem;align-items:flex-start}.calendar-view.horizontal .calendar-panel{flex-shrink:0;width:340px}.calendar-view.horizontal .slots-panel{flex:1;min-width:0}.calendar-view.vertical .calendar-panel{width:100%}.calendar-view.vertical .slots-panel{width:100%}.calendar-panel{border:1px solid var(--tl-border);border-radius:var(--tl-radius);padding:1rem}.calendar-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:0.75rem}.month-label{font-size:1rem;font-weight:600;color:var(--tl-foreground);flex:1}.calendar-nav-buttons{display:flex;gap:0.375rem}.nav-button{display:flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;padding:0;background:var(--tl-background);border:1px solid var(--tl-border);border-radius:var(--tl-radius);cursor:pointer;transition:all 0.15s ease;color:var(--tl-foreground)}.nav-button:hover:not(:disabled){background:var(--tl-muted)}.nav-button:disabled{cursor:not-allowed;opacity:0.4}.nav-button svg{width:0.875rem;height:0.875rem}.calendar-grid{display:grid;grid-template-columns:repeat(7, 1fr);gap:0.1875rem}.weekday-header{text-align:center;font-size:0.6875rem;font-weight:600;color:var(--tl-muted-foreground);padding:0.375rem 0;text-transform:uppercase;letter-spacing:0.05em}.calendar-day{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;aspect-ratio:1;padding:0.1875rem;background:var(--tl-background);border:1px solid transparent;border-radius:var(--tl-radius);cursor:default;transition:all 0.15s ease;font-family:inherit;font-size:0.9375rem;font-weight:500;color:var(--tl-foreground)}.calendar-day.other-month{color:var(--tl-muted-foreground);opacity:0.5}.calendar-day.has-occurrences{cursor:pointer;background:color-mix(in srgb, var(--tl-primary) 10%, var(--tl-background));border-color:transparent;font-weight:600;color:var(--tl-primary)}.calendar-day.has-occurrences:hover{background:color-mix(in srgb, var(--tl-primary) 18%, var(--tl-background));border-color:transparent}.calendar-day.has-occurrences.sold-out{background:var(--tl-muted);border-color:transparent}.calendar-day.has-occurrences.sold-out:hover{background:color-mix(in srgb, var(--tl-muted) 80%, var(--tl-background));border-color:transparent}.calendar-day.selected{background:var(--tl-primary);border-color:var(--tl-primary);color:var(--tl-primary-foreground)}.calendar-day.selected:hover{background:color-mix(in srgb, var(--tl-primary) 90%, black)}.calendar-day.selected .occurrence-dot{background:var(--tl-primary-foreground)}.calendar-day.today .day-number{font-weight:700;text-decoration:underline;text-underline-offset:2px}.calendar-day.past:not(.has-occurrences){opacity:0.4}.day-number{line-height:1}.occurrence-dot{display:none}.slots-panel{min-height:200px}.selected-date-slots{height:100%}.selected-date-slots.empty{display:flex;align-items:center;justify-content:center;color:var(--tl-muted-foreground);background:var(--tl-muted);border-radius:var(--tl-radius);padding:2rem 1rem;text-align:center;min-height:200px;font-size:0.875rem}.selected-date-header{font-size:0.9375rem;font-weight:600;color:var(--tl-foreground);padding-bottom:0.625rem;margin-bottom:0.625rem}.time-slots-list{display:flex;flex-direction:column;gap:0.5rem}.time-slot-item{display:flex;align-items:center;justify-content:space-between;width:100%;padding:0.625rem 0.875rem;background:var(--tl-background);border:1px solid var(--tl-border);border-radius:var(--tl-radius);text-align:left;cursor:pointer;transition:all 0.15s ease;font-family:inherit}.time-slot-item:hover:not(:disabled){border-color:var(--tl-primary);background:color-mix(in srgb, var(--tl-primary) 5%, var(--tl-background))}.time-slot-item:focus-visible{outline:2px solid var(--tl-primary);outline-offset:2px}.time-slot-item:disabled{cursor:not-allowed;opacity:0.6;background:var(--tl-muted)}.time-slot-item.sold-out{opacity:0.6;background:var(--tl-muted)}.time-slot-item .slot-time{font-size:0.9375rem;font-weight:600}.slot-status{flex-shrink:0}.slot-status .status-sold-out{font-size:0.75rem}.slot-status .status-available{font-size:0.75rem}.slot-status .status-arrow{font-size:1rem}@media (max-width: 640px){.event-name{font-size:1.25rem}.occurrence-date{font-size:0.875rem}.time-slots-grid{grid-template-columns:repeat(auto-fill, minmax(80px, 1fr))}.time-slot{padding:0.625rem 0.375rem;min-height:3rem}.slot-time{font-size:0.875rem}.calendar-day{font-size:0.75rem}.weekday-header{font-size:0.625rem}.calendar-view.horizontal .calendar-panel{width:100%}}@media (max-width: 767px){.calendar-view.horizontal{flex-direction:column}}.loading-container{padding:1rem 0;min-height:400px}@keyframes skeleton-pulse{0%,100%{opacity:1}50%{opacity:0.5}}.skeleton{background:var(--tl-muted);border-radius:var(--tl-radius);animation:skeleton-pulse 1.5s ease-in-out infinite}.skeleton-list{display:flex;flex-direction:column;gap:0.75rem}.skeleton-list-item{height:4.5rem;border-radius:var(--tl-radius)}.skeleton-calendar{border:1px solid var(--tl-border);border-radius:var(--tl-radius);padding:1rem;min-height:350px}.skeleton-calendar-header{height:1.75rem;width:50%;margin-bottom:0.75rem;border-radius:var(--tl-radius)}.skeleton-calendar-grid{display:grid;grid-template-columns:repeat(7, 1fr);gap:0.1875rem;margin-top:0.75rem}.skeleton-calendar-day{aspect-ratio:1;border-radius:var(--tl-radius)}.skeleton-slots{display:flex;flex-direction:column;gap:1rem}.skeleton-slots-header{height:1.75rem;width:60%;border-radius:var(--tl-radius);margin-bottom:0.5rem}.skeleton-slots-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(100px, 1fr));gap:0.5rem}.skeleton-slot-item{height:3.5rem;border-radius:var(--tl-radius)}.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;gap:1rem;text-align:center}.error-icon{width:3rem;height:3rem;color:var(--tl-muted-foreground);stroke-width:1.5}.error-message{color:var(--tl-foreground);font-size:0.9375rem;max-width:400px}.retry-button{margin-top:0.5rem;padding:0.625rem 1.25rem;background:var(--tl-primary);color:var(--tl-primary-foreground);border:none;border-radius:var(--tl-radius);font-family:inherit;font-size:0.875rem;font-weight:500;cursor:pointer;transition:all 0.15s ease}.retry-button:hover{background:color-mix(in srgb, var(--tl-primary) 90%, black)}.retry-button:focus-visible{outline:2px solid var(--tl-primary);outline-offset:2px}"}},[1,"tl-occurrence-selector",{eventId:[1,"event-id"],displayMode:[1,"display-mode"],orientation:[1],theme:[16],loading:[32],error:[32],occurrences:[32],currentMonth:[32],selectedDate:[32],computedDisplayMode:[32],containerWidth:[32]},void 0,{eventId:[{onEventIdChange:0}]}]);function l(){"undefined"!=typeof customElements&&["tl-occurrence-selector"].forEach((e=>{"tl-occurrence-selector"===e&&(customElements.get(o(e))||customElements.define(o(e),n))}))}export{n as T,l as d}

package/dist/components/tl-order-confirmation.js

@@ -1 +1 @@
-import{proxyCustomElement as t,HTMLElement as e,createEvent as r,h as s,transformTag as i}from"@stencil/core/internal/client";import{o,w as a}from"./sdk-connector.js";import{e as l,r as n,o as c,c as d,d as m,a as u,g as h}from"./order-summary.js";import{d as p}from"./tl-order-tickets2.js";import{d as f}from"./tl-ticket2.js";const g=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.tlOrderLoaded=r(this,"tlOrderLoaded",7),this.tlError=r(this,"tlError",7),this.showTickets=!0,this.columns=2,this.order=null,this.resolvedOrderId=null,this.loading=!1,this.error=null,this.paymentFailed=!1,this.occurrence=null,this.signedInCustomer=null}watchOrderId(t){this.resolvedOrderId=t||this.orderIdFromUrl(),this.load()}async componentWillLoad(){const t=this.urlParams(),e=t?.get("redirect_status");this.paymentFailed=!!e&&"succeeded"!==e,this.resolvedOrderId=this.orderId||this.orderIdFromUrl(),this.resolvedOrderId&&!this.paymentFailed&&await this.load()}componentDidLoad(){this.unsubscribe=o("checkout:completed",(t=>{const e=t;e?.id&&(this.paymentFailed=!1,this.order=e,this.resolvedOrderId=e.id,this.tlOrderLoaded.emit({order:e}),this.load())}))}disconnectedCallback(){this.unsubscribe?.()}urlParams(){return"undefined"!=typeof window&&window.location?.search?new URLSearchParams(window.location.search):null}orderIdFromUrl(){return this.urlParams()?.get("orderId")||null}async load(){const t=this.resolvedOrderId;if(t)try{this.loading=!this.order,this.error=null;const e=await a(),r=e.getOrdersManager?.();if(!r)throw Error("Orders are not available");const s=await r.get(t);if(!s)throw Error("Order not found");this.order=s,this.signedInCustomer=e.getAuthManager?.()?.customer??null,this.tlOrderLoaded.emit({order:s}),this.resolveEvent(e,s)}catch(t){console.error("[tl-order-confirmation] Failed to load order:",t),this.error=l(t,"Failed to load your order"),this.tlError.emit({message:this.error})}finally{this.loading=!1}}async resolveEvent(t,e){const r=e.tickets?.find((t=>t.eventOccurrenceId))?.eventOccurrenceId;if(r)try{const s=await n(t,r);s&&this.order?.id===e.id&&(this.occurrence=s)}catch{}}renderRows(t){const e=this.customerEmail||d(t,this.signedInCustomer),r=this.occurrence?.eventName||c(t),i=this.occurrence?.startsAt;return s("dl",{class:"rows"},s("div",{class:"row"},s("dt",null,"Order reference"),s("dd",{class:"reference"},t.orderNumber)),e&&s("div",{class:"row"},s("dt",null,"Email"),s("dd",null,e)),r&&s("div",{class:"row"},s("dt",null,"Event"),s("dd",null,r)),i&&s("div",{class:"row"},s("dt",null,"Date"),s("dd",null,m(i))))}renderTotals(t){const e=t.currency||"GBP",r=Number(t.totalFees)||0,i=Number(t.totalTax)||0,o=Number(t.totalDiscounts)||0;return s("div",{class:"totals"},s("div",{class:"total-row"},s("span",null,"Subtotal"),s("span",null,u(t.subtotal,e))),r>0&&s("div",{class:"total-row"},s("span",null,"Fees"),s("span",null,u(t.totalFees,e))),i>0&&s("div",{class:"total-row"},s("span",null,"Tax"),s("span",null,u(t.totalTax,e))),o>0&&s("div",{class:"total-row discount"},s("span",null,"Discount"),s("span",null,"-",u(t.totalDiscounts,e))),s("div",{class:"total-row total"},s("span",null,"Total"),s("span",null,u(t.total,e))))}render(){if(this.paymentFailed)return s("div",{class:"confirmation"},s("h1",{class:"title"},"Payment not completed"),s("p",{class:"lead"},"Your payment wasn't completed. Your cart is still saved, so you can try again."));if(!this.resolvedOrderId&&!this.order)return null;if(this.loading)return s("div",{class:"confirmation"},s("div",{class:"skeleton-line short"}),s("div",{class:"skeleton-line long"}),s("div",{class:"skeleton-block"}));const t=this.order,e=t?.id||this.resolvedOrderId;return s("div",{class:"confirmation"},s("div",{class:"check","aria-hidden":"true"},s("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor"},s("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M5 13l4 4L19 7"}))),s("h1",{class:"title"},"You're going!"),s("p",{class:"lead"},t?.orderNumber?`Order ${t.orderNumber} is confirmed. Your tickets are on their way to your email.`:"Your order is confirmed. Your tickets are on their way to your email."),this.error&&!t&&s("p",{class:"error"},"We couldn't load your order details yet. ",this.error),t&&Array.isArray(t.items)&&s("div",{class:"summary"},this.renderRows(t),s("ul",{class:"lines"},h(t).map(((e,r)=>s("li",{class:"line",key:r},s("span",{class:"line-name"},e.quantity," x ",e.name),s("span",{class:"line-price"},u(e.subtotal,t.currency)))))),this.renderTotals(t)),this.showTickets&&t&&s("div",{class:"tickets"},s("h2",{class:"subtitle"},"Your tickets"),s("tl-order-tickets",{orderId:e,columns:this.columns}),s("p",{class:"hint"},"Show these QR codes at the door for entry. Use Download PDF on a ticket to save it.")))}static get watchers(){return{orderId:[{watchOrderId:0}]}}static get style(){return":host{display:block;font-family:var(--tl-font-family, system-ui, sans-serif);color:var(--tl-foreground, #111827)}.confirmation{text-align:center}.check{width:4rem;height:4rem;margin:0 auto var(--tl-spacing-4, 1rem);display:flex;align-items:center;justify-content:center;border-radius:9999px;background:var(--tl-success, #10b981);color:var(--tl-success-foreground, #ffffff)}.check svg{width:2rem;height:2rem}.title{margin:0 0 var(--tl-spacing-2, 0.5rem);font-size:1.875rem;font-weight:700;line-height:1.2}.lead{margin:0 0 var(--tl-spacing-6, 1.5rem);color:var(--tl-muted-foreground, #6b7280)}.error{margin:0 0 var(--tl-spacing-6, 1.5rem);font-size:0.875rem;color:var(--tl-error, #ef4444)}.summary{text-align:left;padding:var(--tl-spacing-6, 1.5rem);margin-bottom:var(--tl-spacing-6, 1.5rem);background:var(--tl-muted, #f9fafb);border:1px solid var(--tl-border, #e5e7eb);border-radius:var(--tl-radius-lg, 0.75rem)}.rows{display:grid;gap:var(--tl-spacing-2, 0.5rem);margin:0 0 var(--tl-spacing-4, 1rem);padding:0 0 var(--tl-spacing-4, 1rem);border-bottom:1px solid var(--tl-border, #e5e7eb)}.row{display:flex;justify-content:space-between;gap:var(--tl-spacing-4, 1rem);font-size:0.875rem}.row dt{color:var(--tl-muted-foreground, #6b7280)}.row dd{margin:0;text-align:right;overflow-wrap:anywhere}.reference{font-family:var(--tl-font-family-mono, ui-monospace, monospace);font-weight:600}.lines{list-style:none;margin:0;padding:0;display:grid;gap:var(--tl-spacing-2, 0.5rem)}.line{display:flex;justify-content:space-between;gap:var(--tl-spacing-4, 1rem);font-size:0.875rem}.totals{margin-top:var(--tl-spacing-3, 0.75rem);padding-top:var(--tl-spacing-3, 0.75rem);border-top:1px solid var(--tl-border, #e5e7eb);display:grid;gap:var(--tl-spacing-1, 0.25rem);font-size:0.875rem}.total-row{display:flex;justify-content:space-between;color:var(--tl-muted-foreground, #6b7280)}.total-row.discount{color:var(--tl-success, #10b981)}.total-row.total{margin-top:var(--tl-spacing-1, 0.25rem);font-size:1rem;font-weight:600;color:var(--tl-foreground, #111827)}.tickets{text-align:left}.subtitle{margin:0 0 var(--tl-spacing-4, 1rem);font-size:1.125rem;font-weight:600}.hint{margin:var(--tl-spacing-3, 0.75rem) 0 0;font-size:0.75rem;color:var(--tl-muted-foreground, #6b7280)}.skeleton-line,.skeleton-block{background:var(--tl-secondary, #f3f4f6);border-radius:var(--tl-radius-md, 0.5rem);animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;margin:0 auto var(--tl-spacing-3, 0.75rem)}.skeleton-line{height:1rem}.skeleton-line.short{width:40%;height:1.75rem}.skeleton-line.long{width:70%}.skeleton-block{height:8rem}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}"}},[1,"tl-order-confirmation",{orderId:[1,"order-id"],customerEmail:[1,"customer-email"],showTickets:[4,"show-tickets"],columns:[2],order:[32],resolvedOrderId:[32],loading:[32],error:[32],paymentFailed:[32],occurrence:[32],signedInCustomer:[32]},void 0,{orderId:[{watchOrderId:0}]}]),v=g,w=function(){"undefined"!=typeof customElements&&["tl-order-confirmation","tl-order-tickets","tl-ticket"].forEach((t=>{switch(t){case"tl-order-confirmation":customElements.get(i(t))||customElements.define(i(t),g);break;case"tl-order-tickets":customElements.get(i(t))||p();break;case"tl-ticket":customElements.get(i(t))||f()}}))};export{v as TlOrderConfirmation,w as defineCustomElement}
+import{proxyCustomElement as t,HTMLElement as r,createEvent as e,h as s,transformTag as i}from"@stencil/core/internal/client";import{o,w as a}from"./sdk-connector.js";import{e as l,r as n,o as c,c as d,d as h,g as u,a as m,h as p}from"./order-summary.js";import{d as g}from"./tl-order-tickets2.js";import{d as f}from"./tl-ticket2.js";const v=t(class extends r{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.tlOrderLoaded=e(this,"tlOrderLoaded",7),this.tlError=e(this,"tlError",7),this.showTickets=!0,this.columns=2,this.order=null,this.resolvedOrderId=null,this.loading=!1,this.error=null,this.paymentFailed=!1,this.occurrence=null,this.signedInCustomer=null}watchOrderId(t){this.resolvedOrderId=t||this.orderIdFromUrl(),this.load()}async componentWillLoad(){const t=this.urlParams(),r=t?.get("redirect_status");this.paymentFailed=!!r&&"succeeded"!==r,this.resolvedOrderId=this.orderId||this.orderIdFromUrl(),this.resolvedOrderId&&!this.paymentFailed&&await this.load()}componentDidLoad(){this.unsubscribe=o("checkout:completed",(t=>{const r=t;r?.id&&(this.paymentFailed=!1,this.order=r,this.resolvedOrderId=r.id,this.tlOrderLoaded.emit({order:r}),this.load())}))}disconnectedCallback(){this.unsubscribe?.()}urlParams(){return"undefined"!=typeof window&&window.location?.search?new URLSearchParams(window.location.search):null}orderIdFromUrl(){return this.urlParams()?.get("orderId")||null}async load(){const t=this.resolvedOrderId;if(t)try{this.loading=!this.order,this.error=null;const r=await a(),e=r.getOrdersManager?.();if(!e)throw Error("Orders are not available");const s=await e.get(t);if(!s)throw Error("Order not found");this.order=s,this.signedInCustomer=r.getAuthManager?.()?.customer??null,this.tlOrderLoaded.emit({order:s}),this.resolveEvent(r,s)}catch(t){console.error("[tl-order-confirmation] Failed to load order:",t),this.error=l(t,"Failed to load your order"),this.tlError.emit({message:this.error})}finally{this.loading=!1}}async resolveEvent(t,r){const e=r.tickets?.find((t=>t.eventOccurrenceId))?.eventOccurrenceId;if(e)try{const s=await n(t,e);s&&this.order?.id===r.id&&(this.occurrence=s)}catch{}}renderRows(t){const r=this.customerEmail||d(t,this.signedInCustomer),e=this.occurrence?.eventName||c(t),i=this.occurrence?.startsAt;return s("dl",{class:"rows"},s("div",{class:"row"},s("dt",null,"Order reference"),s("dd",{class:"reference"},t.orderNumber)),r&&s("div",{class:"row"},s("dt",null,"Email"),s("dd",null,r)),e&&s("div",{class:"row"},s("dt",null,"Event"),s("dd",null,e)),i&&s("div",{class:"row"},s("dt",null,"Date"),s("dd",null,h(i))))}renderTotals(t){const r=u(t),e=r.currency;return s("div",{class:"totals"},s("div",{class:"total-row"},s("span",null,"Subtotal"),s("span",null,m(r.subtotal,e))),r.showFee&&s("div",{class:"total-row fee"},s("span",null,r.feeLabel),s("span",null,m(r.fees,e))),r.tax>0&&s("div",{class:"total-row"},s("span",null,"Tax"),s("span",null,m(r.tax,e))),r.discount>0&&s("div",{class:"total-row discount"},s("span",null,"Discount"),s("span",null,"-",m(r.discount,e))),s("div",{class:"total-row total"},s("span",null,"Total"),s("span",null,m(r.total,e))))}render(){if(this.paymentFailed)return s("div",{class:"confirmation"},s("h1",{class:"title"},"Payment not completed"),s("p",{class:"lead"},"Your payment wasn't completed. Your cart is still saved, so you can try again."));if(!this.resolvedOrderId&&!this.order)return null;if(this.loading)return s("div",{class:"confirmation"},s("div",{class:"skeleton-line short"}),s("div",{class:"skeleton-line long"}),s("div",{class:"skeleton-block"}));const t=this.order,r=t?.id||this.resolvedOrderId;return s("div",{class:"confirmation"},s("div",{class:"check","aria-hidden":"true"},s("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor"},s("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M5 13l4 4L19 7"}))),s("h1",{class:"title"},"You're going!"),s("p",{class:"lead"},t?.orderNumber?`Order ${t.orderNumber} is confirmed. Your tickets are on their way to your email.`:"Your order is confirmed. Your tickets are on their way to your email."),this.error&&!t&&s("p",{class:"error"},"We couldn't load your order details yet. ",this.error),t&&Array.isArray(t.items)&&s("div",{class:"summary"},this.renderRows(t),s("ul",{class:"lines"},p(t).map(((r,e)=>s("li",{class:"line",key:e},s("span",{class:"line-name"},r.quantity," x ",r.name),s("span",{class:"line-price"},m(r.subtotal,t.currency)))))),this.renderTotals(t)),this.showTickets&&t&&s("div",{class:"tickets"},s("h2",{class:"subtitle"},"Your tickets"),s("tl-order-tickets",{orderId:r,columns:this.columns}),s("p",{class:"hint"},"Show these QR codes at the door for entry. Use Download PDF on a ticket to save it.")))}static get watchers(){return{orderId:[{watchOrderId:0}]}}static get style(){return":host{display:block;font-family:var(--tl-font-family);color:var(--tl-foreground)}.confirmation{text-align:center}.check{width:4rem;height:4rem;margin:0 auto var(--tl-spacing-4);display:flex;align-items:center;justify-content:center;border-radius:9999px;background:var(--tl-success);color:var(--tl-success-foreground)}.check svg{width:2rem;height:2rem}.title{margin:0 0 var(--tl-spacing-2);font-size:1.875rem;font-weight:700;line-height:1.2}.lead{margin:0 0 var(--tl-spacing-6);color:var(--tl-muted-foreground)}.error{margin:0 0 var(--tl-spacing-6);font-size:0.875rem;color:var(--tl-error)}.summary{text-align:left;padding:var(--tl-spacing-6);margin-bottom:var(--tl-spacing-6);background:var(--tl-muted);border:1px solid var(--tl-border);border-radius:var(--tl-radius-lg)}.rows{display:grid;gap:var(--tl-spacing-2);margin:0 0 var(--tl-spacing-4);padding:0 0 var(--tl-spacing-4);border-bottom:1px solid var(--tl-border)}.row{display:flex;justify-content:space-between;gap:var(--tl-spacing-4);font-size:0.875rem}.row dt{color:var(--tl-muted-foreground)}.row dd{margin:0;text-align:right;overflow-wrap:anywhere}.reference{font-family:var(--tl-font-family-mono);font-weight:600}.lines{list-style:none;margin:0;padding:0;display:grid;gap:var(--tl-spacing-2)}.line{display:flex;justify-content:space-between;gap:var(--tl-spacing-4);font-size:0.875rem}.totals{margin-top:var(--tl-spacing-3);padding-top:var(--tl-spacing-3);border-top:1px solid var(--tl-border);display:grid;gap:var(--tl-spacing-1);font-size:0.875rem}.total-row{display:flex;justify-content:space-between;color:var(--tl-muted-foreground)}.total-row.discount{color:var(--tl-success)}.total-row.total{margin-top:var(--tl-spacing-1);font-size:1rem;font-weight:600;color:var(--tl-foreground)}.tickets{text-align:left}.subtitle{margin:0 0 var(--tl-spacing-4);font-size:1.125rem;font-weight:600}.hint{margin:var(--tl-spacing-3) 0 0;font-size:0.75rem;color:var(--tl-muted-foreground)}.skeleton-line,.skeleton-block{background:var(--tl-secondary);border-radius:var(--tl-radius-md);animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;margin:0 auto var(--tl-spacing-3)}.skeleton-line{height:1rem}.skeleton-line.short{width:40%;height:1.75rem}.skeleton-line.long{width:70%}.skeleton-block{height:8rem}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}"}},[1,"tl-order-confirmation",{orderId:[1,"order-id"],customerEmail:[1,"customer-email"],showTickets:[4,"show-tickets"],columns:[2],order:[32],resolvedOrderId:[32],loading:[32],error:[32],paymentFailed:[32],occurrence:[32],signedInCustomer:[32]},void 0,{orderId:[{watchOrderId:0}]}]),w=v,y=function(){"undefined"!=typeof customElements&&["tl-order-confirmation","tl-order-tickets","tl-ticket"].forEach((t=>{switch(t){case"tl-order-confirmation":customElements.get(i(t))||customElements.define(i(t),v);break;case"tl-order-tickets":customElements.get(i(t))||g();break;case"tl-ticket":customElements.get(i(t))||f()}}))};export{w as TlOrderConfirmation,y as defineCustomElement}

package/dist/components/tl-order-tickets2.js

@@ -1 +1 @@
-import{proxyCustomElement as t,HTMLElement as e,h as s,transformTag as i}from"@stencil/core/internal/client";import{w as r}from"./sdk-connector.js";import{d as a}from"./tl-ticket2.js";const o=t(class t extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.columns=2,this.tickets=[],this.loading=!0,this.error=null,this.issuing=!1,this.poll=0}watchOrder(){this.reset(),this.load()}async componentWillLoad(){await this.load()}disconnectedCallback(){this.stopPolling()}reset(){this.stopPolling(),this.poll=0,this.tickets=[],this.issuing=!1}stopPolling(){void 0!==this.timer&&(clearTimeout(this.timer),this.timer=void 0)}async load(){try{this.error=null;const e=await r(),s=e.getOrdersManager?.();if(!s)throw new Error("Tickets are not available");const i=await s.get(this.orderId);if(this.tickets=i?.tickets??[],this.tickets.length>0)this.issuing=!1,this.stopPolling();else{const e=t.POLL_DELAYS_MS[this.poll];this.issuing=void 0!==e,void 0!==e&&(this.poll+=1,this.stopPolling(),this.timer=setTimeout((()=>this.load()),e))}}catch(t){this.stopPolling(),this.issuing=!1,this.error=t instanceof Error?t.message:"Failed to load tickets"}finally{this.loading=!1}}render(){return this.loading?s("div",{class:"state"},"Loading tickets…"):this.error?s("div",{class:"state error"},this.error):0===this.tickets.length?this.issuing?s("div",{class:"state issuing",role:"status","aria-live":"polite"},s("span",{class:"spinner","aria-hidden":"true"}),"Preparing your tickets…"):s("div",{class:"state",role:"status"},"Your tickets are taking longer than usual. They will be emailed to you as soon as they are ready."):s("div",{class:`grid cols-${this.columns}`},this.tickets.map((t=>s("tl-ticket",{key:t.id,ticket:t,orderId:this.orderId}))))}static get watchers(){return{orderId:[{watchOrder:0}]}}static get style(){return":host{display:block;font-family:var(--tl-font-family, system-ui, sans-serif)}.grid{display:grid;gap:var(--tl-spacing-4, 1rem);grid-template-columns:1fr}@media (min-width: 480px){.grid.cols-2{grid-template-columns:repeat(2, 1fr)}.grid.cols-3{grid-template-columns:repeat(3, 1fr)}}.state{padding:var(--tl-spacing-6, 1.5rem);text-align:center;color:var(--tl-muted-foreground, #6b7280);font-size:0.875rem}.state.error{color:var(--tl-error, #dc2626)}.state.issuing{display:flex;align-items:center;justify-content:center;gap:var(--tl-spacing-2, 0.5rem)}.spinner{width:0.875rem;height:0.875rem;border:2px solid var(--tl-border, #e5e7eb);border-top-color:var(--tl-primary, #6366f1);border-radius:50%;animation:tl-spin 0.7s linear infinite;flex:none}@keyframes tl-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.spinner{animation:none;border-top-color:var(--tl-border, #e5e7eb)}}"}},[1,"tl-order-tickets",{orderId:[1,"order-id"],columns:[2],tickets:[32],loading:[32],error:[32],issuing:[32]},void 0,{orderId:[{watchOrder:0}]}]);function n(){"undefined"!=typeof customElements&&["tl-order-tickets","tl-ticket"].forEach((t=>{switch(t){case"tl-order-tickets":customElements.get(i(t))||customElements.define(i(t),o);break;case"tl-ticket":customElements.get(i(t))||a()}}))}o.POLL_DELAYS_MS=[1e3,1500,2e3,3e3,4e3,5e3,6e3,8e3,1e4,12e3];export{o as T,n as d}
+import{proxyCustomElement as t,HTMLElement as e,h as i,transformTag as s}from"@stencil/core/internal/client";import{w as r}from"./sdk-connector.js";import{d as a}from"./tl-ticket2.js";const o=t(class t extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.columns=2,this.tickets=[],this.loading=!0,this.error=null,this.issuing=!1,this.poll=0}watchOrder(){this.reset(),this.load()}async componentWillLoad(){await this.load()}disconnectedCallback(){this.stopPolling()}reset(){this.stopPolling(),this.poll=0,this.tickets=[],this.issuing=!1}stopPolling(){void 0!==this.timer&&(clearTimeout(this.timer),this.timer=void 0)}async load(){try{this.error=null;const e=await r(),i=e.getOrdersManager?.();if(!i)throw new Error("Tickets are not available");const s=await i.get(this.orderId);if(this.tickets=s?.tickets??[],this.tickets.length>0)this.issuing=!1,this.stopPolling();else{const e=t.POLL_DELAYS_MS[this.poll];this.issuing=void 0!==e,void 0!==e&&(this.poll+=1,this.stopPolling(),this.timer=setTimeout((()=>this.load()),e))}}catch(t){this.stopPolling(),this.issuing=!1,this.error=t instanceof Error?t.message:"Failed to load tickets"}finally{this.loading=!1}}render(){return this.loading?i("div",{class:"state"},"Loading tickets…"):this.error?i("div",{class:"state error"},this.error):0===this.tickets.length?this.issuing?i("div",{class:"state issuing",role:"status","aria-live":"polite"},i("span",{class:"spinner","aria-hidden":"true"}),"Preparing your tickets…"):i("div",{class:"state",role:"status"},"Your tickets are taking longer than usual. They will be emailed to you as soon as they are ready."):i("div",{class:`grid cols-${this.columns}`},this.tickets.map((t=>i("tl-ticket",{key:t.id,ticket:t,orderId:this.orderId}))))}static get watchers(){return{orderId:[{watchOrder:0}]}}static get style(){return":host{display:block;font-family:var(--tl-font-family)}.grid{display:grid;gap:var(--tl-spacing-4);grid-template-columns:1fr}@media (min-width: 480px){.grid.cols-2{grid-template-columns:repeat(2, 1fr)}.grid.cols-3{grid-template-columns:repeat(3, 1fr)}}.state{padding:var(--tl-spacing-6);text-align:center;color:var(--tl-muted-foreground);font-size:0.875rem}.state.error{color:var(--tl-error)}.state.issuing{display:flex;align-items:center;justify-content:center;gap:var(--tl-spacing-2)}.spinner{width:0.875rem;height:0.875rem;border:2px solid var(--tl-border);border-top-color:var(--tl-primary);border-radius:50%;animation:tl-spin 0.7s linear infinite;flex:none}@keyframes tl-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion: reduce){.spinner{animation:none;border-top-color:var(--tl-border)}}"}},[1,"tl-order-tickets",{orderId:[1,"order-id"],columns:[2],tickets:[32],loading:[32],error:[32],issuing:[32]},void 0,{orderId:[{watchOrder:0}]}]);function n(){"undefined"!=typeof customElements&&["tl-order-tickets","tl-ticket"].forEach((t=>{switch(t){case"tl-order-tickets":customElements.get(s(t))||customElements.define(s(t),o);break;case"tl-ticket":customElements.get(s(t))||a()}}))}o.POLL_DELAYS_MS=[1e3,1500,2e3,3e3,4e3,5e3,6e3,8e3,1e4,12e3];export{o as T,n as d}

package/dist/components/tl-promo-code.js

@@ -1 +1 @@
-import{proxyCustomElement as t,HTMLElement as e,createEvent as r,h as o,transformTag as i}from"@stencil/core/internal/client";import{w as s}from"./sdk-connector.js";import{e as a,i as l}from"./order-summary.js";const n=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.tlPromoApplied=r(this,"tlPromoApplied",7),this.tlError=r(this,"tlError",7),this.placeholder="Promo or presale code",this.buttonLabel="Apply",this.code="",this.applying=!1,this.applied=null,this.error=null,this.handleInput=t=>{this.code=t.target.value,this.error=null},this.handleSubmit=t=>{t.preventDefault(),this.apply()},this.reset=()=>{this.applied=null,this.error=null}}async apply(){const t=this.code.trim();if(t){this.applying=!0,this.error=null;try{const e=await s(),r=e.getPresaleManager?.();if(!r)throw Error("Promo codes are not available");const o=await r.redeem(t),i=await(e.getCartManager?.()?.get().catch((()=>null)))??null;this.applied={code:t.toUpperCase(),...o,cart:i},this.code="",this.tlPromoApplied.emit(this.applied)}catch(t){console.error("[tl-promo-code] Redeem failed:",t),this.error=l(t)?"Sign in to use this code":a(t,"That code could not be applied"),this.tlError.emit({message:this.error})}finally{this.applying=!1}}else this.error="Enter a code"}render(){return this.applied?o("div",{class:"applied",role:"status"},o("span",{class:"applied-text"},o("svg",{class:"icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","aria-hidden":"true"},o("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M5 13l4 4L19 7"})),"Code ",o("strong",{class:"code"},this.applied.code),this.applied.alreadyHeld?" was already applied":" applied"),o("button",{type:"button",class:"link",onClick:this.reset},"Use a different code")):o("form",{class:"promo",onSubmit:this.handleSubmit},o("div",{class:"field"},o("input",{class:"input",type:"text",autocomplete:"off",autoCapitalize:"characters",spellcheck:!1,"aria-label":this.placeholder,placeholder:this.placeholder,value:this.code,disabled:this.applying,onInput:this.handleInput}),o("button",{type:"submit",class:"apply",disabled:this.applying},this.applying?"Applying…":this.buttonLabel)),this.error&&o("p",{class:"error",role:"alert"},this.error))}static get style(){return":host{display:block;font-family:var(--tl-font-family, system-ui, sans-serif);color:var(--tl-foreground, #111827)}.field{display:flex;gap:var(--tl-spacing-2, 0.5rem)}.input{flex:1;min-width:0;padding:var(--tl-spacing-3, 0.75rem);font:inherit;font-size:0.875rem;color:var(--tl-foreground, #111827);background:var(--tl-background, #ffffff);border:1px solid var(--tl-border, #e5e7eb);border-radius:var(--tl-radius-md, 0.5rem);text-transform:uppercase}.input::placeholder{text-transform:none;color:var(--tl-muted-foreground, #6b7280)}.input:focus{outline:2px solid var(--tl-primary, #6366f1);outline-offset:1px}.apply{padding:var(--tl-spacing-3, 0.75rem) var(--tl-spacing-4, 1rem);font:inherit;font-size:0.875rem;font-weight:500;color:var(--tl-primary-foreground, #ffffff);background:var(--tl-primary, #6366f1);border:none;border-radius:var(--tl-radius-md, 0.5rem);cursor:pointer;white-space:nowrap}.apply:hover:not(:disabled){opacity:0.9}.apply:disabled,.input:disabled{opacity:0.6;cursor:not-allowed}.error{margin:var(--tl-spacing-2, 0.5rem) 0 0;font-size:0.8125rem;color:var(--tl-error, #ef4444)}.applied{display:flex;align-items:center;justify-content:space-between;gap:var(--tl-spacing-3, 0.75rem);padding:var(--tl-spacing-3, 0.75rem);font-size:0.875rem;background:var(--tl-muted, #f9fafb);border:1px solid var(--tl-border, #e5e7eb);border-radius:var(--tl-radius-md, 0.5rem)}.applied-text{display:flex;align-items:center;gap:var(--tl-spacing-2, 0.5rem)}.icon{width:1rem;height:1rem;flex-shrink:0;color:var(--tl-success, #10b981)}.code{font-family:var(--tl-font-family-mono, ui-monospace, monospace)}.link{padding:0;font:inherit;font-size:0.8125rem;color:var(--tl-primary, #6366f1);background:none;border:none;cursor:pointer;white-space:nowrap}.link:hover{text-decoration:underline}"}},[1,"tl-promo-code",{placeholder:[1],buttonLabel:[1,"button-label"],code:[32],applying:[32],applied:[32],error:[32]}]),d=n,p=function(){"undefined"!=typeof customElements&&["tl-promo-code"].forEach((t=>{"tl-promo-code"===t&&(customElements.get(i(t))||customElements.define(i(t),n))}))};export{d as TlPromoCode,p as defineCustomElement}
+import{proxyCustomElement as t,HTMLElement as e,createEvent as r,h as o,transformTag as i}from"@stencil/core/internal/client";import{w as s}from"./sdk-connector.js";import{e as a,i as l}from"./order-summary.js";const n=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.tlPromoApplied=r(this,"tlPromoApplied",7),this.tlError=r(this,"tlError",7),this.placeholder="Promo or presale code",this.buttonLabel="Apply",this.code="",this.applying=!1,this.applied=null,this.error=null,this.handleInput=t=>{this.code=t.target.value,this.error=null},this.handleSubmit=t=>{t.preventDefault(),this.apply()},this.reset=()=>{this.applied=null,this.error=null}}async apply(){const t=this.code.trim();if(t){this.applying=!0,this.error=null;try{const e=await s(),r=e.getPresaleManager?.();if(!r)throw Error("Promo codes are not available");const o=await r.redeem(t),i=await(e.getCartManager?.()?.get().catch((()=>null)))??null;this.applied={code:t.toUpperCase(),...o,cart:i},this.code="",this.tlPromoApplied.emit(this.applied)}catch(t){console.error("[tl-promo-code] Redeem failed:",t),this.error=l(t)?"Sign in to use this code":a(t,"That code could not be applied"),this.tlError.emit({message:this.error})}finally{this.applying=!1}}else this.error="Enter a code"}render(){return this.applied?o("div",{class:"applied",role:"status"},o("span",{class:"applied-text"},o("svg",{class:"icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","aria-hidden":"true"},o("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M5 13l4 4L19 7"})),"Code ",o("strong",{class:"code"},this.applied.code),this.applied.alreadyHeld?" was already applied":" applied"),o("button",{type:"button",class:"link",onClick:this.reset},"Use a different code")):o("form",{class:"promo",onSubmit:this.handleSubmit},o("div",{class:"field"},o("input",{class:"input",type:"text",autocomplete:"off",autoCapitalize:"characters",spellcheck:!1,"aria-label":this.placeholder,placeholder:this.placeholder,value:this.code,disabled:this.applying,onInput:this.handleInput}),o("button",{type:"submit",class:"apply",disabled:this.applying},this.applying?"Applying…":this.buttonLabel)),this.error&&o("p",{class:"error",role:"alert"},this.error))}static get style(){return":host{display:block;font-family:var(--tl-font-family);color:var(--tl-foreground)}.field{display:flex;gap:var(--tl-spacing-2)}.input{flex:1;min-width:0;padding:var(--tl-spacing-3);font:inherit;font-size:0.875rem;color:var(--tl-foreground);background:var(--tl-background);border:1px solid var(--tl-border);border-radius:var(--tl-radius-md);text-transform:uppercase}.input::placeholder{text-transform:none;color:var(--tl-muted-foreground)}.input:focus{outline:2px solid var(--tl-primary);outline-offset:1px}.apply{padding:var(--tl-spacing-3) var(--tl-spacing-4);font:inherit;font-size:0.875rem;font-weight:500;color:var(--tl-primary-foreground);background:var(--tl-primary);border:none;border-radius:var(--tl-radius-md);cursor:pointer;white-space:nowrap}.apply:hover:not(:disabled){opacity:0.9}.apply:disabled,.input:disabled{opacity:0.6;cursor:not-allowed}.error{margin:var(--tl-spacing-2) 0 0;font-size:0.8125rem;color:var(--tl-error)}.applied{display:flex;align-items:center;justify-content:space-between;gap:var(--tl-spacing-3);padding:var(--tl-spacing-3);font-size:0.875rem;background:var(--tl-muted);border:1px solid var(--tl-border);border-radius:var(--tl-radius-md)}.applied-text{display:flex;align-items:center;gap:var(--tl-spacing-2)}.icon{width:1rem;height:1rem;flex-shrink:0;color:var(--tl-success)}.code{font-family:var(--tl-font-family-mono)}.link{padding:0;font:inherit;font-size:0.8125rem;color:var(--tl-primary);background:none;border:none;cursor:pointer;white-space:nowrap}.link:hover{text-decoration:underline}"}},[1,"tl-promo-code",{placeholder:[1],buttonLabel:[1,"button-label"],code:[32],applying:[32],applied:[32],error:[32]}]),d=n,p=function(){"undefined"!=typeof customElements&&["tl-promo-code"].forEach((t=>{"tl-promo-code"===t&&(customElements.get(i(t))||customElements.define(i(t),n))}))};export{d as TlPromoCode,p as defineCustomElement}

package/dist/components/tl-seat-map.js

@@ -1 +1 @@
-import{proxyCustomElement as e,HTMLElement as t,createEvent as a,h as s,transformTag as r}from"@stencil/core/internal/client";import{h as i,g as o}from"./sdk-connector.js";const c=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.tlReady=a(this,"tlReady",7),this.tlLoad=a(this,"tlLoad",7),this.tlError=a(this,"tlError",7),this.tlSeatAdded=a(this,"tlSeatAdded",7),this.tlSeatRemoved=a(this,"tlSeatRemoved",7),this.tlCartChange=a(this,"tlCartChange",7),this.hboUrl="https://checkout.ticketlayer.com",this.apiUrl="https://api.ticketlayer.com",this.height="600px",this.width="100%",this.isReady=!1,this.isLoading=!0,this.error=null,this.seatsInCart=[],this.postToIframe=(e,t={})=>{this.iframeRef?.contentWindow&&this.iframeRef.contentWindow.postMessage({type:e,...t},"*")},this.handleMessage=e=>{if(e.data&&e.data.type)switch(e.data.type){case"seatmap:ready":this.isReady=!0,this.isLoading=!1,this.tlReady.emit(),this.postToIframe("seatmap:set-cart-seats",{seatIds:this.seatsInCart});break;case"seatmap:loaded":this.tlLoad.emit({seatMapId:e.data.seatMapId});break;case"seatmap:error":this.error=e.data.error,this.isLoading=!1,this.tlError.emit({error:e.data.error});break;case"seatmap:add-seat":this.handleAddSeat(e.data.seatId,e.data.ticketTypeId);break;case"seatmap:remove-seat":this.handleRemoveSeat(e.data.seatId)}},this.handleAddSeat=async(e,t)=>{if(!i())return console.warn("[tl-seat-map] SDK not available, cannot add seat"),void this.postToIframe("seatmap:add-seat-failed",{seatId:e,error:"SDK not available"});try{const a=o();await a.getCartManager().addSeat(e,t,this.occurrenceId),this.postToIframe("seatmap:add-seat-confirmed",{seatId:e}),this.seatsInCart=[...this.seatsInCart,e],this.tlSeatAdded.emit({seatId:e,ticketTypeId:t}),this.tlCartChange.emit({seatIds:this.seatsInCart})}catch(t){console.error("[tl-seat-map] Failed to add seat:",t),this.postToIframe("seatmap:add-seat-failed",{seatId:e,error:"Failed to add seat"})}},this.handleRemoveSeat=async e=>{if(!i())return console.warn("[tl-seat-map] SDK not available, cannot remove seat"),void this.postToIframe("seatmap:remove-seat-failed",{seatId:e,error:"SDK not available"});try{const t=o();await t.getCartManager().removeSeat(e,this.occurrenceId),this.postToIframe("seatmap:remove-seat-confirmed",{seatId:e}),this.seatsInCart=this.seatsInCart.filter((t=>t!==e)),this.tlSeatRemoved.emit({seatId:e}),this.tlCartChange.emit({seatIds:this.seatsInCart})}catch(t){console.error("[tl-seat-map] Failed to remove seat:",t),this.postToIframe("seatmap:remove-seat-failed",{seatId:e,error:"Failed to remove seat"})}}}componentWillLoad(){window.addEventListener("message",this.handleMessage)}disconnectedCallback(){window.removeEventListener("message",this.handleMessage)}watchOccurrenceId(){this.isReady=!1,this.isLoading=!0,this.error=null}getIframeSrc(){return`${this.hboUrl}/embed/seats?occurrenceId=${encodeURIComponent(this.occurrenceId)}&apiUrl=${encodeURIComponent(this.apiUrl)}`}render(){return s("div",{key:"c9beadc1792d7825ac3f99e6abc8b181e28fd1b6",class:"seat-map-container",style:{width:this.width,height:this.height}},this.isLoading&&s("div",{key:"ad792ea35f433a268c81722ce4e7d0e34780d337",class:"loading"},s("div",{key:"dd3e0657b16c2f265f59fbaa2ac39c559c2093b7",class:"spinner"}),s("p",{key:"2714e3073d0e5cddc50d530aa1cf46a7f73ba96f"},"Loading seat map...")),this.error&&s("div",{key:"3de9d73ab89a1ee963e73b4192d5c93e9667f11b",class:"error"},s("p",{key:"0fea5c828b5b212ffdb45c9c7702d241e2b79cc4",class:"error-title"},"Error"),s("p",{key:"f2c090b982bb1ee6fb7d347d8860b4ce4798a891",class:"error-message"},this.error)),s("iframe",{key:"8023219fdd467ec736f9627190690a6f73df3bb3",ref:e=>this.iframeRef=e,src:this.getIframeSrc(),class:{"seat-map-iframe":!0,hidden:this.isLoading||!!this.error},title:"Ticketlayer Seat Map",allow:"fullscreen"}))}get el(){return this}static get watchers(){return{occurrenceId:[{watchOccurrenceId:0}]}}static get style(){return":host{display:block;font-family:var(--tl-font-family, system-ui, -apple-system, sans-serif)}.seat-map-container{position:relative;overflow:hidden;border-radius:var(--tl-radius-md, 0.5rem);background:var(--tl-color-background, #ffffff)}.seat-map-iframe{width:100%;height:100%;border:none}.seat-map-iframe.hidden{display:none}.loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--tl-color-background, #ffffff);color:var(--tl-color-foreground, #0f172a);gap:1rem}.loading p{margin:0;font-size:0.875rem;color:var(--tl-color-muted-foreground, #64748b)}.spinner{width:40px;height:40px;border:3px solid var(--tl-color-border, #e2e8f0);border-top-color:var(--tl-color-primary, #e64b12);border-radius:50%;animation:tl-seat-map-spin 1s linear infinite}@keyframes tl-seat-map-spin{to{transform:rotate(360deg)}}.error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--tl-color-background, #ffffff);color:var(--tl-color-error, #ef4444);padding:1.5rem;text-align:center}.error-title{margin:0 0 0.5rem;font-size:1.125rem;font-weight:600}.error-message{margin:0;font-size:0.875rem;opacity:0.9}"}},[1,"tl-seat-map",{occurrenceId:[1,"occurrence-id"],hboUrl:[1,"hbo-url"],apiUrl:[1,"api-url"],height:[1],width:[1],isReady:[32],isLoading:[32],error:[32],seatsInCart:[32]},void 0,{occurrenceId:[{watchOccurrenceId:0}]}]),d=c,n=function(){"undefined"!=typeof customElements&&["tl-seat-map"].forEach((e=>{"tl-seat-map"===e&&(customElements.get(r(e))||customElements.define(r(e),c))}))};export{d as TlSeatMap,n as defineCustomElement}
+import{proxyCustomElement as e,HTMLElement as t,createEvent as a,h as s,transformTag as r}from"@stencil/core/internal/client";import{h as i,g as o}from"./sdk-connector.js";const c=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.tlReady=a(this,"tlReady",7),this.tlLoad=a(this,"tlLoad",7),this.tlError=a(this,"tlError",7),this.tlSeatAdded=a(this,"tlSeatAdded",7),this.tlSeatRemoved=a(this,"tlSeatRemoved",7),this.tlCartChange=a(this,"tlCartChange",7),this.hboUrl="https://checkout.ticketlayer.com",this.apiUrl="https://api.ticketlayer.com",this.height="600px",this.width="100%",this.isReady=!1,this.isLoading=!0,this.error=null,this.seatsInCart=[],this.postToIframe=(e,t={})=>{this.iframeRef?.contentWindow&&this.iframeRef.contentWindow.postMessage({type:e,...t},"*")},this.handleMessage=e=>{if(e.data&&e.data.type)switch(e.data.type){case"seatmap:ready":this.isReady=!0,this.isLoading=!1,this.tlReady.emit(),this.postToIframe("seatmap:set-cart-seats",{seatIds:this.seatsInCart});break;case"seatmap:loaded":this.tlLoad.emit({seatMapId:e.data.seatMapId});break;case"seatmap:error":this.error=e.data.error,this.isLoading=!1,this.tlError.emit({error:e.data.error});break;case"seatmap:add-seat":this.handleAddSeat(e.data.seatId,e.data.ticketTypeId);break;case"seatmap:remove-seat":this.handleRemoveSeat(e.data.seatId)}},this.handleAddSeat=async(e,t)=>{if(!i())return console.warn("[tl-seat-map] SDK not available, cannot add seat"),void this.postToIframe("seatmap:add-seat-failed",{seatId:e,error:"SDK not available"});try{const a=o();await a.getCartManager().addSeat(e,t,this.occurrenceId),this.postToIframe("seatmap:add-seat-confirmed",{seatId:e}),this.seatsInCart=[...this.seatsInCart,e],this.tlSeatAdded.emit({seatId:e,ticketTypeId:t}),this.tlCartChange.emit({seatIds:this.seatsInCart})}catch(t){console.error("[tl-seat-map] Failed to add seat:",t),this.postToIframe("seatmap:add-seat-failed",{seatId:e,error:"Failed to add seat"})}},this.handleRemoveSeat=async e=>{if(!i())return console.warn("[tl-seat-map] SDK not available, cannot remove seat"),void this.postToIframe("seatmap:remove-seat-failed",{seatId:e,error:"SDK not available"});try{const t=o();await t.getCartManager().removeSeat(e,this.occurrenceId),this.postToIframe("seatmap:remove-seat-confirmed",{seatId:e}),this.seatsInCart=this.seatsInCart.filter((t=>t!==e)),this.tlSeatRemoved.emit({seatId:e}),this.tlCartChange.emit({seatIds:this.seatsInCart})}catch(t){console.error("[tl-seat-map] Failed to remove seat:",t),this.postToIframe("seatmap:remove-seat-failed",{seatId:e,error:"Failed to remove seat"})}}}componentWillLoad(){window.addEventListener("message",this.handleMessage)}disconnectedCallback(){window.removeEventListener("message",this.handleMessage)}watchOccurrenceId(){this.isReady=!1,this.isLoading=!0,this.error=null}getIframeSrc(){return`${this.hboUrl}/embed/seats?occurrenceId=${encodeURIComponent(this.occurrenceId)}&apiUrl=${encodeURIComponent(this.apiUrl)}`}render(){return s("div",{key:"c9beadc1792d7825ac3f99e6abc8b181e28fd1b6",class:"seat-map-container",style:{width:this.width,height:this.height}},this.isLoading&&s("div",{key:"ad792ea35f433a268c81722ce4e7d0e34780d337",class:"loading"},s("div",{key:"dd3e0657b16c2f265f59fbaa2ac39c559c2093b7",class:"spinner"}),s("p",{key:"2714e3073d0e5cddc50d530aa1cf46a7f73ba96f"},"Loading seat map...")),this.error&&s("div",{key:"3de9d73ab89a1ee963e73b4192d5c93e9667f11b",class:"error"},s("p",{key:"0fea5c828b5b212ffdb45c9c7702d241e2b79cc4",class:"error-title"},"Error"),s("p",{key:"f2c090b982bb1ee6fb7d347d8860b4ce4798a891",class:"error-message"},this.error)),s("iframe",{key:"8023219fdd467ec736f9627190690a6f73df3bb3",ref:e=>this.iframeRef=e,src:this.getIframeSrc(),class:{"seat-map-iframe":!0,hidden:this.isLoading||!!this.error},title:"Ticketlayer Seat Map",allow:"fullscreen"}))}get el(){return this}static get watchers(){return{occurrenceId:[{watchOccurrenceId:0}]}}static get style(){return":host{display:block;font-family:var(--tl-font-family)}.seat-map-container{position:relative;overflow:hidden;border-radius:var(--tl-radius-md);background:var(--tl-color-background)}.seat-map-iframe{width:100%;height:100%;border:none}.seat-map-iframe.hidden{display:none}.loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--tl-color-background);color:var(--tl-color-foreground);gap:1rem}.loading p{margin:0;font-size:0.875rem;color:var(--tl-color-muted-foreground)}.spinner{width:40px;height:40px;border:3px solid var(--tl-color-border);border-top-color:var(--tl-color-primary);border-radius:50%;animation:tl-seat-map-spin 1s linear infinite}@keyframes tl-seat-map-spin{to{transform:rotate(360deg)}}.error{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--tl-color-background);color:var(--tl-color-error);padding:1.5rem;text-align:center}.error-title{margin:0 0 0.5rem;font-size:1.125rem;font-weight:600}.error-message{margin:0;font-size:0.875rem;opacity:0.9}"}},[1,"tl-seat-map",{occurrenceId:[1,"occurrence-id"],hboUrl:[1,"hbo-url"],apiUrl:[1,"api-url"],height:[1],width:[1],isReady:[32],isLoading:[32],error:[32],seatsInCart:[32]},void 0,{occurrenceId:[{watchOccurrenceId:0}]}]),d=c,n=function(){"undefined"!=typeof customElements&&["tl-seat-map"].forEach((e=>{"tl-seat-map"===e&&(customElements.get(r(e))||customElements.define(r(e),c))}))};export{d as TlSeatMap,n as defineCustomElement}

package/dist/components/tl-ticket-selector2.js

@@ -1 +1 @@
-import{proxyCustomElement as t,HTMLElement as e,createEvent as r,h as o,transformTag as s}from"@stencil/core/internal/client";import{w as i,g as a,h as c}from"./sdk-connector.js";const n=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.tlAddToCart=r(this,"tlAddToCart",7),this.tlQuantityChange=r(this,"tlQuantityChange",7),this.tlError=r(this,"tlError",7),this.showButton=!0,this.buttonLabel="Add to Cart",this.ticketTypes=[],this.quantities={},this.loading=!0,this.error=null,this.adding=!1,this.addSuccess=!1}watchPropsChange(){this.loadTicketTypes()}async componentWillLoad(){await this.waitForSDKAndLoad()}async waitForSDKAndLoad(){if(this.eventId&&this.occurrenceId)try{await i(),await this.loadTicketTypes()}catch(t){this.error=t instanceof Error?t.message:"SDK not initialized.",this.loading=!1}}async loadTicketTypes(){try{console.log("[tl-ticket-selector] Loading ticket types...",{eventId:this.eventId,occurrenceId:this.occurrenceId}),this.loading=!0,this.error=null;const t=a().getEventsManager(),e=await t.getTicketTypes(this.eventId,this.occurrenceId);console.log("[tl-ticket-selector] Ticket types loaded:",e.length),this.ticketTypes=e;const r={};e.forEach((t=>{r[t.id]=0})),this.quantities=r}catch(t){console.error("[tl-ticket-selector] Failed to load ticket types:",t),this.error=t instanceof Error?t.message:"Failed to load tickets",this.tlError.emit({message:this.error})}finally{this.loading=!1}}handleQuantityChange(t,e){const r=this.ticketTypes.find((e=>e.id===t));if(!r)return;const o=Math.max(0,Math.min(r.maxPerOrder,(this.quantities[t]||0)+e));this.quantities={...this.quantities,[t]:o};const s=this.calculateTotal();this.tlQuantityChange.emit({ticketTypeId:t,quantity:o,total:s})}calculateTotal(){return this.ticketTypes.reduce(((t,e)=>t+(this.quantities[e.id]||0)*e.price),0)}getTotalItems(){return Object.values(this.quantities).reduce(((t,e)=>t+e),0)}async handleAddToCart(){const t=Object.entries(this.quantities).filter((([t,e])=>e>0)).map((([t,e])=>({ticketTypeId:t,quantity:e})));if(0!==t.length){this.adding=!0,this.addSuccess=!1;try{if(c()){const e=a(),r=e.getCartManager?.();if(r){for(const e of t)await r.addItem(e.ticketTypeId,e.quantity,this.occurrenceId);console.log("[tl-ticket-selector] Items added to cart")}}const e={};this.ticketTypes.forEach((t=>{e[t.id]=0})),this.quantities=e,this.addSuccess=!0,setTimeout((()=>{this.addSuccess=!1}),3e3),this.tlAddToCart.emit({items:t})}catch(t){console.error("[tl-ticket-selector] Failed to add to cart:",t),this.error=t instanceof Error?t.message:"Failed to add to cart",this.tlError.emit({message:this.error})}finally{this.adding=!1}}}formatPrice(t,e="GBP"){return new Intl.NumberFormat("en-GB",{style:"currency",currency:e}).format(t/100)}renderSkeleton(){return o("div",{class:"skeleton-container"},o("div",{class:"skeleton-row"}),o("div",{class:"skeleton-row"}),o("div",{class:"skeleton-row"}))}renderError(){return o("div",{class:"error-state"},o("p",{class:"error-message"},this.error))}renderTicketRow(t){const e="sold_out"===t.availabilityStatus,r=this.quantities[t.id]||0;return o("div",{class:"ticket-row "+(e?"sold-out":""),key:t.id},o("div",{class:"ticket-info"},o("div",{class:"ticket-header"},o("span",{class:"ticket-name"},t.name),"limited"===t.availabilityStatus&&o("span",{class:"status-badge limited"},"Limited"),e&&o("span",{class:"status-badge sold-out"},"Sold Out")),t.description&&o("p",{class:"ticket-description"},t.description),o("p",{class:"ticket-price"},this.formatPrice(t.price,t.currency))),o("div",{class:"quantity-controls"},o("button",{class:"qty-btn",onClick:()=>this.handleQuantityChange(t.id,-1),disabled:e||0===r,"aria-label":"Decrease quantity"},"−"),o("span",{class:"qty-value"},r),o("button",{class:"qty-btn",onClick:()=>this.handleQuantityChange(t.id,1),disabled:e||r>=t.maxPerOrder,"aria-label":"Increase quantity"},"+")))}render(){if(this.loading)return this.renderSkeleton();if(this.error)return this.renderError();const t=this.getTotalItems(),e=this.calculateTotal();return o("div",{class:"ticket-selector"},o("div",{class:"ticket-list"},this.ticketTypes.map((t=>this.renderTicketRow(t)))),this.addSuccess&&o("div",{class:"success-message"},o("svg",{class:"success-icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor"},o("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M5 13l4 4L19 7"})),"Added to cart!"),this.showButton&&o("button",{class:"add-to-cart-btn "+(0===t?"disabled":""),onClick:()=>this.handleAddToCart(),disabled:0===t||this.adding},this.adding?"Adding...":0===t?"Select Tickets":`${this.buttonLabel} - ${this.formatPrice(e)}`))}static get watchers(){return{eventId:[{watchPropsChange:0}],occurrenceId:[{watchPropsChange:0}]}}static get style(){return":host{--tl-color-primary:var(--tl-primary, #6366f1);--tl-color-primary-foreground:var(--tl-primary-foreground, #ffffff);--tl-color-background:var(--tl-background, #ffffff);--tl-color-foreground:var(--tl-foreground, #111827);--tl-color-muted:var(--tl-muted, #f3f4f6);--tl-color-muted-foreground:var(--tl-muted-foreground, #6b7280);--tl-color-border:var(--tl-border, #e5e7eb);--tl-color-destructive:var(--tl-error, #ef4444);display:block;font-family:var(--tl-font-family, system-ui, sans-serif)}.ticket-selector{background:var(--tl-color-background, #ffffff)}.skeleton-container{padding:var(--tl-spacing-4, 1rem)}.skeleton-row{height:60px;background:var(--tl-color-muted, #f3f4f6);border-radius:var(--tl-radius-md, 0.5rem);margin-bottom:var(--tl-spacing-3, 0.75rem);animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}.error-state{padding:var(--tl-spacing-4, 1rem);color:var(--tl-color-destructive, #ef4444)}.error-message{margin:0;font-size:14px}.ticket-list{margin-bottom:var(--tl-spacing-4, 1rem)}.ticket-row{display:flex;align-items:center;justify-content:space-between;padding:var(--tl-spacing-3, 0.75rem) 0;border-bottom:1px solid var(--tl-color-border, #e5e7eb)}.ticket-row.sold-out{opacity:0.5}.ticket-info{flex:1;min-width:0}.ticket-header{display:flex;align-items:center;gap:var(--tl-spacing-2, 0.5rem);flex-wrap:wrap}.ticket-name{font-weight:600;color:var(--tl-color-foreground, #111827);font-size:15px}.status-badge{font-size:12px;font-weight:500;padding:2px 8px;border-radius:4px}.status-badge.limited{background-color:var(--tl-color-warning-bg, #fef3c7);color:var(--tl-color-warning, #d97706)}.status-badge.sold-out{background-color:var(--tl-color-destructive-bg, #fee2e2);color:var(--tl-color-destructive, #ef4444)}.ticket-description{margin:var(--tl-spacing-1, 0.25rem) 0 0;font-size:14px;color:var(--tl-color-muted-foreground, #6b7280)}.ticket-price{margin:var(--tl-spacing-1, 0.25rem) 0 0;font-size:14px;font-weight:600;color:var(--tl-color-foreground, #111827)}.quantity-controls{display:flex;align-items:center;gap:var(--tl-spacing-2, 0.5rem);margin-left:var(--tl-spacing-4, 1rem)}.qty-btn{width:32px;height:32px;border-radius:var(--tl-radius-sm, 0.25rem);border:1px solid var(--tl-color-border, #d1d5db);background:var(--tl-color-background, #ffffff);color:var(--tl-color-foreground, #111827);font-size:18px;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color 0.15s, border-color 0.15s}.qty-btn:hover:not(:disabled){background-color:var(--tl-color-muted, #f3f4f6);border-color:var(--tl-color-border-hover, #9ca3af)}.qty-btn:disabled{cursor:not-allowed;opacity:0.5}.qty-value{width:32px;text-align:center;font-weight:600;font-size:16px;color:var(--tl-color-foreground, #111827)}.success-message{display:flex;align-items:center;justify-content:center;gap:var(--tl-spacing-2, 0.5rem);padding:var(--tl-spacing-3, 0.75rem);background-color:var(--tl-color-success, #10b981);color:#ffffff;border-radius:var(--tl-radius-md, 0.5rem);margin-bottom:var(--tl-spacing-3, 0.75rem);font-weight:500;font-size:14px}.success-icon{width:18px;height:18px}.add-to-cart-btn{width:100%;padding:var(--tl-spacing-3, 0.75rem) var(--tl-spacing-4, 1rem);border-radius:var(--tl-radius-md, 0.5rem);border:none;background-color:var(--tl-color-primary, #6366f1);color:var(--tl-color-primary-foreground, #ffffff);font-weight:600;font-size:16px;cursor:pointer;transition:opacity 0.15s, transform 0.1s}.add-to-cart-btn:hover:not(:disabled){opacity:0.9}.add-to-cart-btn:active:not(:disabled){transform:scale(0.98)}.add-to-cart-btn.disabled,.add-to-cart-btn:disabled{background-color:var(--tl-color-muted, #d1d5db);color:var(--tl-color-muted-foreground, #6b7280);cursor:not-allowed}"}},[1,"tl-ticket-selector",{eventId:[1,"event-id"],occurrenceId:[1,"occurrence-id"],showButton:[4,"show-button"],buttonLabel:[1,"button-label"],ticketTypes:[32],quantities:[32],loading:[32],error:[32],adding:[32],addSuccess:[32]},void 0,{eventId:[{watchPropsChange:0}],occurrenceId:[{watchPropsChange:0}]}]);function l(){"undefined"!=typeof customElements&&["tl-ticket-selector"].forEach((t=>{"tl-ticket-selector"===t&&(customElements.get(s(t))||customElements.define(s(t),n))}))}export{n as T,l as d}
+import{proxyCustomElement as t,HTMLElement as e,createEvent as r,h as o,transformTag as s}from"@stencil/core/internal/client";import{w as a,g as n}from"./sdk-connector.js";import{s as i}from"./money.js";const c=["discovery","purchase","cart","checkout","account","tickets"],l=["web","native"];function d(t){return"function"==typeof t?t:()=>t??null}const u=t=>i(t.state.ticketTypes.map((e=>({price:e.price,quantity:t.state.quantities[e.id]||0}))),t.state.feeQuote),p=function(t){const e=e=>{throw new Error(`[elements-core] ${t.tag||"<no tag>"}: ${e}`)};/^tl-[a-z0-9]+(-[a-z0-9]+)*$/.test(t.tag)||e("tag must look like tl-something"),c.includes(t.category)||e(`category must be one of ${c.join(", ")}`),t.runtimes.length&&!t.runtimes.some((t=>!l.includes(t)))||e(`runtimes must be a non-empty subset of ${l.join(", ")}`),new Set(t.tokens).size!==t.tokens.length&&e("tokens must not repeat"),t.statuses.length||e("statuses must not be empty");for(const[r,o]of Object.entries(t.events))/^tl[A-Z]/.test(r)||e(`event ${r} must be named tlSomething`),o.detail||e(`event ${r} must state its detail type`);for(const[r,o]of Object.entries(t.props))o.required&&void 0!==o.default&&e(`prop ${r} is required and has a default`);return Object.freeze({...t})}({tag:"tl-ticket-selector",docs:"Pick quantities of the ticket types on sale for one occurrence, and add them to the cart.",category:"purchase",runtimes:["web","native"],tokens:["background","border","border-hover","error","error-bg","font-family","foreground","muted","muted-foreground","primary","primary-foreground","radius-md","radius-sm","spacing-1","spacing-2","spacing-3","spacing-4","success","warning","warning-bg"],sdkMethods:["cart.addItem","events.getTicketTypes"],props:{eventId:{type:"string",attr:"event-id",required:!0,docs:"Event ID"},occurrenceId:{type:"string",attr:"occurrence-id",required:!0,docs:"Occurrence ID"},showButton:{type:"boolean",attr:"show-button",default:!0,docs:"Show add to cart button"},buttonLabel:{type:"string",attr:"button-label",default:"Add to Cart",docs:"Button label"}},events:{tlAddToCart:{detail:"{ items: AddToCartItem[]; }",docs:"Emitted when items are added to cart"},tlQuantityChange:{detail:"{ ticketTypeId: string; quantity: number; total: number; }",docs:"Emitted when quantity changes"},tlError:{detail:"{ message: string; }",docs:"Emitted on error"}},strings:{selectTickets:"Select Tickets",adding:"Adding...",added:"Added to cart!",limited:"Limited",soldOut:"Sold Out",ticketsRow:"Tickets",totalRow:"Total",decrease:"Decrease quantity",increase:"Increase quantity",loadFailed:"Failed to load tickets",addFailed:"Failed to add to cart",noClient:"SDK not initialized."},statuses:["loading","error","ready"],state:()=>({ticketTypes:[],quantities:{},loading:!0,error:null,adding:!1,addSuccess:!1,feeQuote:null}),status:({state:t})=>t.loading?"loading":t.error?"error":"ready",derive:t=>{const{state:e,strings:r,props:o,formatMoney:s}=t,a=u(t),n=(t=>Object.values(t.quantities).reduce(((t,e)=>t+e),0))(e),i=e.ticketTypes[0]?.currency;return{rows:e.ticketTypes.map((t=>{const r=e.quantities[t.id]||0,o="sold_out"===t.availabilityStatus;return{id:t.id,name:t.name,description:t.description??null,priceLabel:s(t.price,t.currency),quantity:r,soldOut:o,limited:"limited"===t.availabilityStatus,canDecrease:!o&&r>0,canIncrease:!o&&r<t.maxPerOrder}})),totals:a,totalItems:n,currency:i,subtotalLabel:s(a.subtotal,i),feeLabel:s(a.fees,i),totalLabel:s(a.total,i),showTotals:a.showFee&&n>0,actionLabel:e.adding?r.adding:0===n?r.selectTickets:`${o.buttonLabel} - ${s(a.total)}`,actionDisabled:0===n||e.adding}},actions:t=>({async load(){try{t.setState({loading:!0,error:null});const e=await t.client().getEventsManager().getTicketTypes(t.props.eventId,t.props.occurrenceId),r={};for(const t of e)r[t.id]=0;t.setState({ticketTypes:e,quantities:r})}catch(e){const r=e instanceof Error?e.message:t.strings.loadFailed;t.setState({error:r}),t.emit("tlError",{message:r})}finally{t.setState({loading:!1})}},changeQuantity(e,r){const o=t.state.ticketTypes.find((t=>t.id===e));if(!o)return;const s=Math.max(0,Math.min(o.maxPerOrder,(t.state.quantities[e]||0)+r));t.setState((t=>({quantities:{...t.quantities,[e]:s}}))),t.emit("tlQuantityChange",{ticketTypeId:e,quantity:s,total:u(t).total})},async addToCart(){const e=Object.entries(t.state.quantities).filter((([,t])=>t>0)).map((([t,e])=>({ticketTypeId:t,quantity:e})));if(0!==e.length){t.setState({adding:!0,addSuccess:!1});try{const r=t.optionalClient()?.getCartManager?.();if(r)for(const o of e)await r.addItem(o.ticketTypeId,o.quantity,t.props.occurrenceId);const o={};for(const e of t.state.ticketTypes)o[e.id]=0;t.setState({quantities:o,addSuccess:!0}),t.after(3e3,(()=>t.setState({addSuccess:!1}))),t.emit("tlAddToCart",{items:e})}catch(e){const r=e instanceof Error?e.message:t.strings.addFailed;t.setState({error:r}),t.emit("tlError",{message:r})}finally{t.setState({adding:!1})}}},setFeeQuote(e){t.setState({feeQuote:e})},connectFailed(e){t.setState({error:e||t.strings.noClient,loading:!1})}})}),g=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.tlAddToCart=r(this,"tlAddToCart",7),this.tlQuantityChange=r(this,"tlQuantityChange",7),this.tlError=r(this,"tlError",7),this.showButton=!0,this.buttonLabel="Add to Cart",this.element=function(t,e={}){const r={};for(const[e,o]of Object.entries(t.props))void 0!==o.default&&(r[e]=o.default);let o={...r,...e.props??{}};const s={...t.strings,...e.strings??{}},a=e.locale??"en-GB",n=e.currency??"GBP";let i=d(e.client),c=t.state(o),l=!1;const u=new Set,p=new Set,g=(t,e)=>new Intl.NumberFormat(a,{style:"currency",currency:e||n}).format(t/100),h=()=>{const e={props:o,state:c,strings:s,formatMoney:g};return{status:t.status(e),props:o,state:c,strings:s,derived:t.derive(e)}},f=()=>{if(l)return;const t=h();for(const e of[...p])e(t)},b=t.actions({get props(){return o},get state(){return c},strings:s,formatMoney:g,setState(t){if(l)return;const e="function"==typeof t?t(c):t;c={...c,...e},f()},emit(r,o){if(!t.events[r])throw new Error(`[elements-core] ${t.tag}: ${r} is not a declared event`);e.emit?.(r,o)},client(){const e=i();if(!e)throw new Error(`[elements-core] ${t.tag}: no client. A harness hands the core the client the host published.`);return e},optionalClient(){try{return i()}catch{return null}},after(t,e){if(l)return;const r=setTimeout((()=>{u.delete(r),l||e()}),t);u.add(r)}});return{core:t,get props(){return o},get state(){return c},get view(){return h()},actions:b,setProps(t){l||(o={...o,...t},f())},setClient(t){i=d(t)},subscribe:t=>(p.add(t),()=>{p.delete(t)}),destroy(){l=!0;for(const t of u)clearTimeout(t);u.clear(),p.clear()}}}(p,{client:()=>n(),emit:(t,e)=>this.forward(t,e)}),this.view=this.element.view}get feeQuote(){return this.element.state.feeQuote}set feeQuote(t){this.element.actions.setFeeQuote(t)}watchPropsChange(){this.syncProps(),this.element.actions.load()}syncProps(){this.element.setProps({eventId:this.eventId,occurrenceId:this.occurrenceId,showButton:this.showButton,buttonLabel:this.buttonLabel})}async componentWillLoad(){this.syncProps(),this.unsubscribe=this.element.subscribe((t=>{this.view=t})),this.view=this.element.view,await this.waitForSDKAndLoad()}disconnectedCallback(){this.unsubscribe?.(),this.element.destroy()}async waitForSDKAndLoad(){if(this.eventId&&this.occurrenceId)try{await a(),await this.element.actions.load()}catch(t){this.element.actions.connectFailed(t instanceof Error?t.message:this.view.strings.noClient)}}forward(t,e){"tlAddToCart"===t?this.tlAddToCart.emit(e):"tlQuantityChange"===t?this.tlQuantityChange.emit(e):"tlError"===t&&this.tlError.emit(e)}renderSkeleton(){return o("div",{class:"skeleton-container"},o("div",{class:"skeleton-row"}),o("div",{class:"skeleton-row"}),o("div",{class:"skeleton-row"}))}renderError(){return o("div",{class:"error-state"},o("p",{class:"error-message"},this.view.state.error))}renderTicketRow(t){const e=this.view.strings;return o("div",{class:"ticket-row "+(t.soldOut?"sold-out":""),key:t.id},o("div",{class:"ticket-info"},o("div",{class:"ticket-header"},o("span",{class:"ticket-name"},t.name),t.limited&&o("span",{class:"status-badge limited"},e.limited),t.soldOut&&o("span",{class:"status-badge sold-out"},e.soldOut)),t.description&&o("p",{class:"ticket-description"},t.description),o("p",{class:"ticket-price"},t.priceLabel)),o("div",{class:"quantity-controls"},o("button",{class:"qty-btn",onClick:()=>this.element.actions.changeQuantity(t.id,-1),disabled:!t.canDecrease,"aria-label":e.decrease},"−"),o("span",{class:"qty-value"},t.quantity),o("button",{class:"qty-btn",onClick:()=>this.element.actions.changeQuantity(t.id,1),disabled:!t.canIncrease,"aria-label":e.increase},"+")))}render(){const{status:t,state:e,strings:r,derived:s}=this.view;return"loading"===t?this.renderSkeleton():"error"===t?this.renderError():o("div",{class:"ticket-selector"},o("div",{class:"ticket-list"},s.rows.map((t=>this.renderTicketRow(t)))),s.showTotals&&o("div",{class:"selection-totals"},o("div",{class:"total-row"},o("span",null,r.ticketsRow),o("span",null,s.subtotalLabel)),o("div",{class:"total-row fee"},o("span",null,s.totals.feeLabel),o("span",null,s.feeLabel)),o("div",{class:"total-row total"},o("span",null,r.totalRow),o("span",null,s.totalLabel))),e.addSuccess&&o("div",{class:"success-message"},o("svg",{class:"success-icon",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor"},o("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M5 13l4 4L19 7"})),r.added),this.showButton&&o("button",{class:"add-to-cart-btn "+(0===s.totalItems?"disabled":""),onClick:()=>this.element.actions.addToCart(),disabled:s.actionDisabled},s.actionLabel))}static get watchers(){return{eventId:[{watchPropsChange:0}],occurrenceId:[{watchPropsChange:0}],showButton:[{syncProps:0}],buttonLabel:[{syncProps:0}]}}static get style(){return":host{--tl-color-primary:var(--tl-primary);--tl-color-primary-foreground:var(--tl-primary-foreground);--tl-color-background:var(--tl-background);--tl-color-foreground:var(--tl-foreground);--tl-color-muted:var(--tl-muted);--tl-color-muted-foreground:var(--tl-muted-foreground);--tl-color-border:var(--tl-border);--tl-color-destructive:var(--tl-error);display:block;font-family:var(--tl-font-family)}.ticket-selector{background:var(--tl-color-background)}.skeleton-container{padding:var(--tl-spacing-4)}.skeleton-row{height:60px;background:var(--tl-color-muted);border-radius:var(--tl-radius-md);margin-bottom:var(--tl-spacing-3);animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,100%{opacity:1}50%{opacity:0.5}}.error-state{padding:var(--tl-spacing-4);color:var(--tl-color-destructive)}.error-message{margin:0;font-size:14px}.ticket-list{margin-bottom:var(--tl-spacing-4)}.ticket-row{display:flex;align-items:center;justify-content:space-between;padding:var(--tl-spacing-3) 0;border-bottom:1px solid var(--tl-color-border)}.ticket-row.sold-out{opacity:0.5}.ticket-info{flex:1;min-width:0}.ticket-header{display:flex;align-items:center;gap:var(--tl-spacing-2);flex-wrap:wrap}.ticket-name{font-weight:600;color:var(--tl-color-foreground);font-size:15px}.status-badge{font-size:12px;font-weight:500;padding:2px 8px;border-radius:4px}.status-badge.limited{background-color:var(--tl-color-warning-bg);color:var(--tl-color-warning)}.status-badge.sold-out{background-color:var(--tl-color-destructive-bg);color:var(--tl-color-destructive)}.ticket-description{margin:var(--tl-spacing-1) 0 0;font-size:14px;color:var(--tl-color-muted-foreground)}.ticket-price{margin:var(--tl-spacing-1) 0 0;font-size:14px;font-weight:600;color:var(--tl-color-foreground)}.quantity-controls{display:flex;align-items:center;gap:var(--tl-spacing-2);margin-left:var(--tl-spacing-4)}.qty-btn{width:32px;height:32px;border-radius:var(--tl-radius-sm);border:1px solid var(--tl-color-border);background:var(--tl-color-background);color:var(--tl-color-foreground);font-size:18px;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color 0.15s, border-color 0.15s}.qty-btn:hover:not(:disabled){background-color:var(--tl-color-muted);border-color:var(--tl-color-border-hover)}.qty-btn:disabled{cursor:not-allowed;opacity:0.5}.qty-value{width:32px;text-align:center;font-weight:600;font-size:16px;color:var(--tl-color-foreground)}.success-message{display:flex;align-items:center;justify-content:center;gap:var(--tl-spacing-2);padding:var(--tl-spacing-3);background-color:var(--tl-color-success);color:#ffffff;border-radius:var(--tl-radius-md);margin-bottom:var(--tl-spacing-3);font-weight:500;font-size:14px}.success-icon{width:18px;height:18px}.add-to-cart-btn{width:100%;padding:var(--tl-spacing-3) var(--tl-spacing-4);border-radius:var(--tl-radius-md);border:none;background-color:var(--tl-color-primary);color:var(--tl-color-primary-foreground);font-weight:600;font-size:16px;cursor:pointer;transition:opacity 0.15s, transform 0.1s}.add-to-cart-btn:hover:not(:disabled){opacity:0.9}.add-to-cart-btn:active:not(:disabled){transform:scale(0.98)}.add-to-cart-btn.disabled,.add-to-cart-btn:disabled{background-color:var(--tl-color-muted);color:var(--tl-color-muted-foreground);cursor:not-allowed}.selection-totals{padding:var(--tl-spacing-3) 0;border-top:1px solid var(--tl-color-border)}.selection-totals .total-row{display:flex;justify-content:space-between;align-items:center;padding:var(--tl-spacing-1) 0;font-size:14px;color:var(--tl-color-muted-foreground)}.selection-totals .total-row.total{font-size:16px;font-weight:700;color:var(--tl-color-foreground);padding-top:var(--tl-spacing-2);border-top:1px solid var(--tl-color-border);margin-top:var(--tl-spacing-2)}"}},[1,"tl-ticket-selector",{eventId:[1,"event-id"],occurrenceId:[1,"occurrence-id"],showButton:[4,"show-button"],buttonLabel:[1,"button-label"],view:[32]},void 0,{eventId:[{watchPropsChange:0}],occurrenceId:[{watchPropsChange:0}],showButton:[{syncProps:0}],buttonLabel:[{syncProps:0}]}]);function h(){"undefined"!=typeof customElements&&["tl-ticket-selector"].forEach((t=>{"tl-ticket-selector"===t&&(customElements.get(s(t))||customElements.define(s(t),g))}))}export{g as T,h as d}