@ticketlayer/elements 0.2.0 → 0.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/ticketlayer-elements.cjs.js +1 -1
- package/dist/cjs/tl-buy-modal.cjs.entry.js +2 -2
- package/dist/cjs/tl-cart-drawer.cjs.entry.js +3 -3
- package/dist/cjs/tl-order-tickets_2.cjs.entry.js +48 -3
- package/dist/cjs/tl-seat-map.cjs.entry.js +2 -2
- package/dist/collection/components/tl-buy-modal/tl-buy-modal.css +57 -3
- package/dist/collection/components/tl-buy-modal/tl-buy-modal.js +1 -1
- package/dist/collection/components/tl-cart-drawer/tl-cart-drawer.css +43 -1
- package/dist/collection/components/tl-cart-drawer/tl-cart-drawer.js +2 -2
- package/dist/collection/components/tl-order-tickets/tl-order-tickets.css +32 -0
- package/dist/collection/components/tl-order-tickets/tl-order-tickets.js +64 -3
- package/dist/collection/components/tl-seat-map/tl-seat-map.js +2 -2
- package/dist/components/tl-buy-modal.js +1 -1
- package/dist/components/tl-cart-drawer.js +1 -1
- package/dist/components/tl-order-tickets2.js +1 -1
- package/dist/components/tl-seat-map.js +1 -1
- package/dist/elements.docs.json +2 -2
- package/dist/esm/loader.js +1 -1
- package/dist/esm/ticketlayer-elements.js +1 -1
- package/dist/esm/tl-buy-modal.entry.js +2 -2
- package/dist/esm/tl-cart-drawer.entry.js +3 -3
- package/dist/esm/tl-order-tickets_2.entry.js +48 -3
- package/dist/esm/tl-seat-map.entry.js +2 -2
- package/dist/ticketlayer-elements/{p-ee3aa227.entry.js → p-9372ff1f.entry.js} +1 -1
- package/dist/ticketlayer-elements/p-9cb3ab24.entry.js +1 -0
- package/dist/ticketlayer-elements/p-f5846f61.entry.js +1 -0
- package/dist/ticketlayer-elements/p-f6314d1e.entry.js +1 -0
- package/dist/ticketlayer-elements/ticketlayer-elements.esm.js +1 -1
- package/dist/types/components/tl-order-tickets/tl-order-tickets.d.ts +28 -0
- package/dist/types/components.d.ts +48 -0
- package/elements.catalogue.json +3 -3
- package/package.json +1 -1
- package/dist/ticketlayer-elements/p-10f01a1f.entry.js +0 -1
- package/dist/ticketlayer-elements/p-9d8163d6.entry.js +0 -1
- package/dist/ticketlayer-elements/p-dd43f015.entry.js +0 -1
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -5,7 +5,7 @@ var index = require('./index-DfzcrE9-.js');
|
|
|
5
5
|
const defineCustomElements = async (win, options) => {
|
|
6
6
|
if (typeof window === 'undefined') return undefined;
|
|
7
7
|
await index.globalScripts();
|
|
8
|
-
return index.bootstrapLazy([["tl-my-orders.cjs",[[1,"tl-my-orders",{"emptyMessage":[1,"empty-message"],"columns":[2],"orders":[32],"authenticated":[32],"loading":[32],"error":[32],"expandedId":[32]}]]],["tl-buy-modal.cjs",[[1,"tl-buy-modal",{"eventId":[1,"event-id"],"occurrenceId":[1,"occurrence-id"],"step":[32],"eventName":[32],"imageUrl":[32],"venueLabel":[32],"dateSummary":[32],"selectedOccurrenceId":[32],"occurrenceCount":[32],"occurrenceLabel":[32],"error":[32]}]]],["tl-order-confirmation.cjs",[[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]},null,{"orderId":[{"watchOrderId":0}]}]]],["tl-cart-drawer.cjs",[[1,"tl-cart-drawer",{"side":[1],"heading":[1],"open":[1028],"visible":[32]},null,{"open":[{"onOpenProp":0}]}]]],["tl-event-list.cjs",[[1,"tl-event-list",{"limit":[2],"category":[1],"columns":[2],"events":[32],"loading":[32],"error":[32]},null,{"limit":[{"watchFiltersChange":0}],"category":[{"watchFiltersChange":0}]}]]],["tl-buy-tickets-button.cjs",[[1,"tl-buy-tickets-button",{"eventId":[1,"event-id"],"occurrenceId":[1,"occurrence-id"],"state":[1],"label":[1],"variant":[1],"size":[1],"fullWidth":[4,"full-width"],"price":[2],"currency":[1],"pricePrefix":[1,"price-prefix"],"disabled":[4],"isHovered":[32]}]]],["tl-buy-tickets-wrapper.cjs",[[260,"tl-buy-tickets-wrapper",{"eventId":[1,"event-id"],"occurrenceId":[1,"occurrence-id"],"disabled":[4]}]]],["tl-cart-badge.cjs",[[1,"tl-cart-badge",{"showEmpty":[4,"show-empty"],"icon":[1],"size":[1],"badgeOnly":[4,"badge-only"],"itemCount":[32]}]]],["tl-checkout-wrapper.cjs",[[260,"tl-checkout-wrapper",{"disabled":[4]}]]],["tl-promo-code.cjs",[[1,"tl-promo-code",{"placeholder":[1],"buttonLabel":[1,"button-label"],"code":[32],"applying":[32],"applied":[32],"error":[32]}]]],["tl-seat-map.cjs",[[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]},null,{"occurrenceId":[{"watchOccurrenceId":0}]}]]],["tl-cart.cjs",[[1,"tl-cart",{"showCheckoutButton":[4,"show-checkout-button"],"checkoutLabel":[1,"checkout-label"],"showRemoveButtons":[4,"show-remove-buttons"],"compact":[4],"cart":[32],"loading":[32],"error":[32],"removingItemId":[32]}]]],["tl-event-card.cjs",[[1,"tl-event-card",{"event":[16],"eventId":[1,"event-id"],"loadedEvent":[32],"loading":[32],"error":[32]},null,{"eventId":[{"watchEventId":0}]}]]],["tl-login.cjs",[[1,"tl-login",{"heading":[1],"allowCodeEntry":[4,"allow-code-entry"],"phase":[32],"email":[32],"code":[32],"busy":[32],"error":[32],"notice":[32],"customer":[32]}]]],["tl-occurrence-selector_2.cjs",[[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]},null,{"eventId":[{"onEventIdChange":0}]}],[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]},null,{"eventId":[{"watchPropsChange":0}],"occurrenceId":[{"watchPropsChange":0}]}]]],["tl-order-tickets_2.cjs",[[1,"tl-order-tickets",{"orderId":[1,"order-id"],"columns":[2],"tickets":[32],"loading":[32],"error":[32]},null,{"orderId":[{"watchOrder":0}]}],[1,"tl-ticket",{"ticket":[16],"orderId":[1,"order-id"],"qrSvg":[32],"downloading":[32]},null,{"ticket":[{"generateQr":0}]}]]]], options);
|
|
8
|
+
return index.bootstrapLazy([["tl-my-orders.cjs",[[1,"tl-my-orders",{"emptyMessage":[1,"empty-message"],"columns":[2],"orders":[32],"authenticated":[32],"loading":[32],"error":[32],"expandedId":[32]}]]],["tl-buy-modal.cjs",[[1,"tl-buy-modal",{"eventId":[1,"event-id"],"occurrenceId":[1,"occurrence-id"],"step":[32],"eventName":[32],"imageUrl":[32],"venueLabel":[32],"dateSummary":[32],"selectedOccurrenceId":[32],"occurrenceCount":[32],"occurrenceLabel":[32],"error":[32]}]]],["tl-order-confirmation.cjs",[[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]},null,{"orderId":[{"watchOrderId":0}]}]]],["tl-cart-drawer.cjs",[[1,"tl-cart-drawer",{"side":[1],"heading":[1],"open":[1028],"visible":[32]},null,{"open":[{"onOpenProp":0}]}]]],["tl-event-list.cjs",[[1,"tl-event-list",{"limit":[2],"category":[1],"columns":[2],"events":[32],"loading":[32],"error":[32]},null,{"limit":[{"watchFiltersChange":0}],"category":[{"watchFiltersChange":0}]}]]],["tl-buy-tickets-button.cjs",[[1,"tl-buy-tickets-button",{"eventId":[1,"event-id"],"occurrenceId":[1,"occurrence-id"],"state":[1],"label":[1],"variant":[1],"size":[1],"fullWidth":[4,"full-width"],"price":[2],"currency":[1],"pricePrefix":[1,"price-prefix"],"disabled":[4],"isHovered":[32]}]]],["tl-buy-tickets-wrapper.cjs",[[260,"tl-buy-tickets-wrapper",{"eventId":[1,"event-id"],"occurrenceId":[1,"occurrence-id"],"disabled":[4]}]]],["tl-cart-badge.cjs",[[1,"tl-cart-badge",{"showEmpty":[4,"show-empty"],"icon":[1],"size":[1],"badgeOnly":[4,"badge-only"],"itemCount":[32]}]]],["tl-checkout-wrapper.cjs",[[260,"tl-checkout-wrapper",{"disabled":[4]}]]],["tl-promo-code.cjs",[[1,"tl-promo-code",{"placeholder":[1],"buttonLabel":[1,"button-label"],"code":[32],"applying":[32],"applied":[32],"error":[32]}]]],["tl-seat-map.cjs",[[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]},null,{"occurrenceId":[{"watchOccurrenceId":0}]}]]],["tl-cart.cjs",[[1,"tl-cart",{"showCheckoutButton":[4,"show-checkout-button"],"checkoutLabel":[1,"checkout-label"],"showRemoveButtons":[4,"show-remove-buttons"],"compact":[4],"cart":[32],"loading":[32],"error":[32],"removingItemId":[32]}]]],["tl-event-card.cjs",[[1,"tl-event-card",{"event":[16],"eventId":[1,"event-id"],"loadedEvent":[32],"loading":[32],"error":[32]},null,{"eventId":[{"watchEventId":0}]}]]],["tl-login.cjs",[[1,"tl-login",{"heading":[1],"allowCodeEntry":[4,"allow-code-entry"],"phase":[32],"email":[32],"code":[32],"busy":[32],"error":[32],"notice":[32],"customer":[32]}]]],["tl-occurrence-selector_2.cjs",[[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]},null,{"eventId":[{"onEventIdChange":0}]}],[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]},null,{"eventId":[{"watchPropsChange":0}],"occurrenceId":[{"watchPropsChange":0}]}]]],["tl-order-tickets_2.cjs",[[1,"tl-order-tickets",{"orderId":[1,"order-id"],"columns":[2],"tickets":[32],"loading":[32],"error":[32],"issuing":[32]},null,{"orderId":[{"watchOrder":0}]}],[1,"tl-ticket",{"ticket":[16],"orderId":[1,"order-id"],"qrSvg":[32],"downloading":[32]},null,{"ticket":[{"generateQr":0}]}]]]], options);
|
|
9
9
|
};
|
|
10
10
|
|
|
11
11
|
exports.setNonce = index.setNonce;
|
|
@@ -18,7 +18,7 @@ var patchBrowser = () => {
|
|
|
18
18
|
|
|
19
19
|
patchBrowser().then(async (options) => {
|
|
20
20
|
await index.globalScripts();
|
|
21
|
-
return index.bootstrapLazy([["tl-my-orders.cjs",[[1,"tl-my-orders",{"emptyMessage":[1,"empty-message"],"columns":[2],"orders":[32],"authenticated":[32],"loading":[32],"error":[32],"expandedId":[32]}]]],["tl-buy-modal.cjs",[[1,"tl-buy-modal",{"eventId":[1,"event-id"],"occurrenceId":[1,"occurrence-id"],"step":[32],"eventName":[32],"imageUrl":[32],"venueLabel":[32],"dateSummary":[32],"selectedOccurrenceId":[32],"occurrenceCount":[32],"occurrenceLabel":[32],"error":[32]}]]],["tl-order-confirmation.cjs",[[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]},null,{"orderId":[{"watchOrderId":0}]}]]],["tl-cart-drawer.cjs",[[1,"tl-cart-drawer",{"side":[1],"heading":[1],"open":[1028],"visible":[32]},null,{"open":[{"onOpenProp":0}]}]]],["tl-event-list.cjs",[[1,"tl-event-list",{"limit":[2],"category":[1],"columns":[2],"events":[32],"loading":[32],"error":[32]},null,{"limit":[{"watchFiltersChange":0}],"category":[{"watchFiltersChange":0}]}]]],["tl-buy-tickets-button.cjs",[[1,"tl-buy-tickets-button",{"eventId":[1,"event-id"],"occurrenceId":[1,"occurrence-id"],"state":[1],"label":[1],"variant":[1],"size":[1],"fullWidth":[4,"full-width"],"price":[2],"currency":[1],"pricePrefix":[1,"price-prefix"],"disabled":[4],"isHovered":[32]}]]],["tl-buy-tickets-wrapper.cjs",[[260,"tl-buy-tickets-wrapper",{"eventId":[1,"event-id"],"occurrenceId":[1,"occurrence-id"],"disabled":[4]}]]],["tl-cart-badge.cjs",[[1,"tl-cart-badge",{"showEmpty":[4,"show-empty"],"icon":[1],"size":[1],"badgeOnly":[4,"badge-only"],"itemCount":[32]}]]],["tl-checkout-wrapper.cjs",[[260,"tl-checkout-wrapper",{"disabled":[4]}]]],["tl-promo-code.cjs",[[1,"tl-promo-code",{"placeholder":[1],"buttonLabel":[1,"button-label"],"code":[32],"applying":[32],"applied":[32],"error":[32]}]]],["tl-seat-map.cjs",[[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]},null,{"occurrenceId":[{"watchOccurrenceId":0}]}]]],["tl-cart.cjs",[[1,"tl-cart",{"showCheckoutButton":[4,"show-checkout-button"],"checkoutLabel":[1,"checkout-label"],"showRemoveButtons":[4,"show-remove-buttons"],"compact":[4],"cart":[32],"loading":[32],"error":[32],"removingItemId":[32]}]]],["tl-event-card.cjs",[[1,"tl-event-card",{"event":[16],"eventId":[1,"event-id"],"loadedEvent":[32],"loading":[32],"error":[32]},null,{"eventId":[{"watchEventId":0}]}]]],["tl-login.cjs",[[1,"tl-login",{"heading":[1],"allowCodeEntry":[4,"allow-code-entry"],"phase":[32],"email":[32],"code":[32],"busy":[32],"error":[32],"notice":[32],"customer":[32]}]]],["tl-occurrence-selector_2.cjs",[[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]},null,{"eventId":[{"onEventIdChange":0}]}],[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]},null,{"eventId":[{"watchPropsChange":0}],"occurrenceId":[{"watchPropsChange":0}]}]]],["tl-order-tickets_2.cjs",[[1,"tl-order-tickets",{"orderId":[1,"order-id"],"columns":[2],"tickets":[32],"loading":[32],"error":[32]},null,{"orderId":[{"watchOrder":0}]}],[1,"tl-ticket",{"ticket":[16],"orderId":[1,"order-id"],"qrSvg":[32],"downloading":[32]},null,{"ticket":[{"generateQr":0}]}]]]], options);
|
|
21
|
+
return index.bootstrapLazy([["tl-my-orders.cjs",[[1,"tl-my-orders",{"emptyMessage":[1,"empty-message"],"columns":[2],"orders":[32],"authenticated":[32],"loading":[32],"error":[32],"expandedId":[32]}]]],["tl-buy-modal.cjs",[[1,"tl-buy-modal",{"eventId":[1,"event-id"],"occurrenceId":[1,"occurrence-id"],"step":[32],"eventName":[32],"imageUrl":[32],"venueLabel":[32],"dateSummary":[32],"selectedOccurrenceId":[32],"occurrenceCount":[32],"occurrenceLabel":[32],"error":[32]}]]],["tl-order-confirmation.cjs",[[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]},null,{"orderId":[{"watchOrderId":0}]}]]],["tl-cart-drawer.cjs",[[1,"tl-cart-drawer",{"side":[1],"heading":[1],"open":[1028],"visible":[32]},null,{"open":[{"onOpenProp":0}]}]]],["tl-event-list.cjs",[[1,"tl-event-list",{"limit":[2],"category":[1],"columns":[2],"events":[32],"loading":[32],"error":[32]},null,{"limit":[{"watchFiltersChange":0}],"category":[{"watchFiltersChange":0}]}]]],["tl-buy-tickets-button.cjs",[[1,"tl-buy-tickets-button",{"eventId":[1,"event-id"],"occurrenceId":[1,"occurrence-id"],"state":[1],"label":[1],"variant":[1],"size":[1],"fullWidth":[4,"full-width"],"price":[2],"currency":[1],"pricePrefix":[1,"price-prefix"],"disabled":[4],"isHovered":[32]}]]],["tl-buy-tickets-wrapper.cjs",[[260,"tl-buy-tickets-wrapper",{"eventId":[1,"event-id"],"occurrenceId":[1,"occurrence-id"],"disabled":[4]}]]],["tl-cart-badge.cjs",[[1,"tl-cart-badge",{"showEmpty":[4,"show-empty"],"icon":[1],"size":[1],"badgeOnly":[4,"badge-only"],"itemCount":[32]}]]],["tl-checkout-wrapper.cjs",[[260,"tl-checkout-wrapper",{"disabled":[4]}]]],["tl-promo-code.cjs",[[1,"tl-promo-code",{"placeholder":[1],"buttonLabel":[1,"button-label"],"code":[32],"applying":[32],"applied":[32],"error":[32]}]]],["tl-seat-map.cjs",[[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]},null,{"occurrenceId":[{"watchOccurrenceId":0}]}]]],["tl-cart.cjs",[[1,"tl-cart",{"showCheckoutButton":[4,"show-checkout-button"],"checkoutLabel":[1,"checkout-label"],"showRemoveButtons":[4,"show-remove-buttons"],"compact":[4],"cart":[32],"loading":[32],"error":[32],"removingItemId":[32]}]]],["tl-event-card.cjs",[[1,"tl-event-card",{"event":[16],"eventId":[1,"event-id"],"loadedEvent":[32],"loading":[32],"error":[32]},null,{"eventId":[{"watchEventId":0}]}]]],["tl-login.cjs",[[1,"tl-login",{"heading":[1],"allowCodeEntry":[4,"allow-code-entry"],"phase":[32],"email":[32],"code":[32],"busy":[32],"error":[32],"notice":[32],"customer":[32]}]]],["tl-occurrence-selector_2.cjs",[[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]},null,{"eventId":[{"onEventIdChange":0}]}],[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]},null,{"eventId":[{"watchPropsChange":0}],"occurrenceId":[{"watchPropsChange":0}]}]]],["tl-order-tickets_2.cjs",[[1,"tl-order-tickets",{"orderId":[1,"order-id"],"columns":[2],"tickets":[32],"loading":[32],"error":[32],"issuing":[32]},null,{"orderId":[{"watchOrder":0}]}],[1,"tl-ticket",{"ticket":[16],"orderId":[1,"order-id"],"qrSvg":[32],"downloading":[32]},null,{"ticket":[{"generateQr":0}]}]]]], options);
|
|
22
22
|
});
|
|
23
23
|
|
|
24
24
|
exports.setNonce = index.setNonce;
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var index = require('./index-DfzcrE9-.js');
|
|
4
4
|
var sdkConnector = require('./sdk-connector-ClDF3013.js');
|
|
5
5
|
|
|
6
|
-
const tlBuyModalCss = () => `:host{--_bg:var(--tl-background, #ffffff);--_fg:var(--tl-foreground, #111827);--_muted:var(--tl-muted, #f3f4f6);--_muted-fg:var(--tl-muted-foreground, #6b7280);--_border:var(--tl-border, #e5e7eb);--_primary:var(--tl-primary, #6366f1);--_primary-fg:var(--tl-primary-foreground, #ffffff);--_radius:var(--tl-radius-lg, var(--tl-radius, 0.75rem));--_font:var(--tl-font-family, system-ui, -apple-system, sans-serif);font-family:var(--_font)}.overlay{position:fixed;inset:0;z-index:2147483646;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(8, 8, 16, 0.
|
|
6
|
+
const tlBuyModalCss = () => `:host{--_bg:var(--tl-background, #ffffff);--_fg:var(--tl-foreground, #111827);--_muted:var(--tl-muted, #f3f4f6);--_muted-fg:var(--tl-muted-foreground, #6b7280);--_border:var(--tl-border, #e5e7eb);--_primary:var(--tl-primary, #6366f1);--_primary-fg:var(--tl-primary-foreground, #ffffff);--_radius:var(--tl-radius-lg, var(--tl-radius, 0.75rem));--_font:var(--tl-font-family, system-ui, -apple-system, sans-serif);font-family:var(--_font)}.overlay{position:fixed;inset:0;z-index:2147483646;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:16px;background:rgba(8, 8, 16, 0.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);animation:tl-fade 0.18s ease-out}.panel{width:100%;max-width:460px;max-height:86vh;display:flex;flex-direction:column;overflow:hidden;background:var(--_bg);color:var(--_fg);border:1px solid var(--_border);border-radius:var(--_radius);box-shadow:0 24px 64px rgba(0, 0, 0, 0.45);animation:tl-rise 0.22s cubic-bezier(0.16, 1, 0.3, 1);transition:max-width 0.25s cubic-bezier(0.16, 1, 0.3, 1)}.panel--wide{max-width:720px}.powered-by{--tl-pb-perforation:rgba(8, 8, 16, 0.6);width:100%;max-width:460px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 4px;font-size:12px;font-weight:500;color:rgba(255, 255, 255, 0.78);animation:tl-fade 0.3s ease-out}.powered-by a{color:inherit;text-decoration:none;opacity:0.85;transition:opacity 0.15s ease}.powered-by a:hover{opacity:1}.powered-by .pb-links{display:flex;gap:16px;align-items:center}.powered-by .pb-brand{display:inline-flex;align-items:center;gap:6px;opacity:0.92}.powered-by .pb-brand svg{display:block}.powered-by .pb-pre{opacity:0.7}.powered-by .pb-word{font-weight:700;letter-spacing:0.01em}.panel-header{display:flex;align-items:center;gap:14px;padding:16px 18px;border-bottom:1px solid var(--_border)}.event-thumb{flex:none;width:56px;height:56px;border-radius:12px;background-size:cover;background-position:center;background-color:var(--_muted);border:1px solid var(--_border)}.titles{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}.event-meta{margin:0;font-size:0.8rem;color:var(--_muted-fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kicker{font-size:0.72rem;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:var(--_primary)}.event-name{margin:0;font-size:1.18rem;font-weight:700;line-height:1.25;color:var(--_fg);overflow:hidden;text-overflow:ellipsis}.close-btn{flex:none;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:0;border-radius:999px;background:var(--_muted);color:var(--_muted-fg);cursor:pointer;transition:color 0.15s, background 0.15s}.close-btn:hover{color:var(--_fg)}.close-btn svg{width:16px;height:16px}.panel-body{padding:18px 22px 22px;overflow-y:auto}.state-msg{display:flex;align-items:center;justify-content:center;gap:10px;padding:40px 0;color:var(--_muted-fg)}.state-msg.error{color:#b91c1c}.spinner{width:16px;height:16px;border:2px solid var(--_border);border-top-color:var(--_primary);border-radius:999px;animation:tl-spin 0.7s linear infinite}.tickets-step{display:flex;flex-direction:column;gap:6px}.back-link{align-self:flex-start;padding:0;border:0;background:none;color:var(--_primary);font-size:0.85rem;font-weight:500;cursor:pointer}.back-link:hover{text-decoration:underline}.occ-label{margin:2px 0 8px;font-size:0.9rem;font-weight:600;color:var(--_fg)}.done-step{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:16px 0 4px}.done-mark{font-size:2.4rem;line-height:1;margin-bottom:6px}.done-title{margin:0;font-size:1.1rem;font-weight:700;color:var(--_fg)}.done-sub{margin:0 0 14px;font-size:0.9rem;color:var(--_muted-fg)}.primary-btn{width:100%;padding:13px;border:0;border-radius:var(--tl-radius-md, 0.5rem);background:var(--_primary);color:var(--_primary-fg);font-size:0.98rem;font-weight:600;cursor:pointer;transition:opacity 0.15s}.primary-btn:hover{opacity:0.9}.ghost-btn{width:100%;margin-top:8px;padding:12px;border:1px solid var(--_border);border-radius:var(--tl-radius-md, 0.5rem);background:transparent;color:var(--_fg);font-size:0.95rem;font-weight:500;cursor:pointer;transition:background 0.15s}.ghost-btn:hover{background:var(--_muted)}@keyframes tl-fade{from{opacity:0}}@keyframes tl-rise{from{opacity:0;transform:translateY(12px) scale(0.98)}}@keyframes tl-spin{to{transform:rotate(360deg)}}`;
|
|
7
7
|
|
|
8
8
|
const TlBuyModal = class {
|
|
9
9
|
constructor(hostRef) {
|
|
@@ -119,7 +119,7 @@ const TlBuyModal = class {
|
|
|
119
119
|
return (index.h(index.Host, { key: '1245e518c2b5232f4d9dba091cf808cd3867fbef' }, index.h("div", { key: '4e770fccdd785444f1cc87df4adab5a5dc1bf58a', class: "overlay", onClick: (e) => {
|
|
120
120
|
if (e.target === e.currentTarget)
|
|
121
121
|
this.close();
|
|
122
|
-
} }, index.h("div", { key: '57b13dac690028aeebd6a601acfba07f00854c40', class: { panel: true, 'panel--wide': this.step === 'occurrence' }, role: "dialog", "aria-modal": "true", "aria-label": this.eventName }, index.h("header", { key: '881e9cc70a0ca25947f272b9ebcb2e6d4b4268f2', class: "panel-header" }, this.imageUrl && (index.h("div", { key: '753f7df1b5118dfacbbc6b89b4e5d7ba114f6cdf', class: "event-thumb", style: { backgroundImage: `url(${this.imageUrl})` } })), index.h("div", { key: '9aaa32d1add90fabd1b0ea0c100f198962f4e6a5', class: "titles" }, index.h("span", { key: '538032bdf2338206ad763417386852ff97cc472f', class: "kicker" }, this.stepKicker()), index.h("h2", { key: '71429804179e7fbbea1fa90a2937a065517092f5', class: "event-name" }, this.eventName), this.venueLabel && index.h("p", { key: 'dd968b397deab890df3a4fbdff33226e82bd9660', class: "event-meta" }, this.venueLabel), this.dateSummary && index.h("p", { key: 'f40e6049d09b06c9f599e7d14d6fbb43b39b22fd', class: "event-meta" }, this.dateSummary)), index.h("button", { key: 'dbe0908f8cd8544654b627921f68cc4961802b77', class: "close-btn", "aria-label": "Close", onClick: this.close }, index.h("svg", { key: '23a750830e6e16d28cbcd5025507d25848aaadf7', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, index.h("path", { key: 'e81b8763a5c781f72c1ca8a2113482948e3ba8cc', d: "M6 6l12 12M18 6L6 18", "stroke-linecap": "round" })))), index.h("div", { key: 'da71e610f907cf53e78246d2065aaf526d5ceffd', class: "panel-body" }, this.step === 'loading' && (index.h("div", { key: '28cbb9a98c7b08fa8dcb9d8d5dfbf3bec93fe38d', class: "state-msg" }, index.h("span", { key: '915c8de87cbdc7da1ccf0622ce6c0f02fccf2cad', class: "spinner" }), " Loading\u2026")), this.step === 'error' && index.h("div", { key: '5785578bfef6f1ee81d938d91ffd3ded975f8c12', class: "state-msg error" }, this.error), this.step === 'occurrence' && (index.h("tl-occurrence-selector", { key: 'eeb853eab141c3c103015e82d221a140f6a3a109', eventId: this.eventId, onTlSelect: this.handleOccurrenceSelect })), this.step === 'tickets' && this.selectedOccurrenceId && (index.h("div", { key: 'f608f592ba651eb431375433eb4ff9393863ade5', class: "tickets-step" }, this.occurrenceCount > 1 && (index.h("button", { key: '84adfbdbeaceb2cf4238c6ffd09558b4499ca940', class: "back-link", onClick: this.backToDates }, "\u2190 Change date")), this.occurrenceLabel && index.h("p", { key: '0317e9194049608711e8c622142c3ad2c0a5dc12', class: "occ-label" }, this.occurrenceLabel), index.h("tl-ticket-selector", { key: '27b1e05d9d92fb8d519375e2b27d4b5ea0a4890a', eventId: this.eventId, occurrenceId: this.selectedOccurrenceId, onTlAddToCart: this.handleAdded }))), this.step === 'done' && (index.h("div", { key: '0853088206988c66d489f8804df7899821d49e64', class: "done-step" }, index.h("div", { key: 'c2955b893c4dffaadcdfd27bee96ef2724a131a6', class: "done-mark" }, "\uD83C\uDF9F\uFE0F"), index.h("p", { key: '370c30dfcbc0c25b4794d984dd261a3a5779a9dc', class: "done-title" }, "Added to your cart"), index.h("p", { key: 'c462f3c9292740e2fd2c74b173484f80a5dc1a30', class: "done-sub" }, "Held for you while you check out."), index.h("button", { key: '484991f79572e3213ad6413a1af87599880c3643', class: "primary-btn", onClick: this.goCheckout }, "Go to checkout"), index.h("button", { key: '5b4ba5a472b794e8f5af0f131dad1c8c11b869f5', class: "ghost-btn", onClick: this.close }, "Keep browsing"))))))));
|
|
122
|
+
} }, index.h("div", { key: '57b13dac690028aeebd6a601acfba07f00854c40', class: { panel: true, 'panel--wide': this.step === 'occurrence' }, role: "dialog", "aria-modal": "true", "aria-label": this.eventName }, index.h("header", { key: '881e9cc70a0ca25947f272b9ebcb2e6d4b4268f2', class: "panel-header" }, this.imageUrl && (index.h("div", { key: '753f7df1b5118dfacbbc6b89b4e5d7ba114f6cdf', class: "event-thumb", style: { backgroundImage: `url(${this.imageUrl})` } })), index.h("div", { key: '9aaa32d1add90fabd1b0ea0c100f198962f4e6a5', class: "titles" }, index.h("span", { key: '538032bdf2338206ad763417386852ff97cc472f', class: "kicker" }, this.stepKicker()), index.h("h2", { key: '71429804179e7fbbea1fa90a2937a065517092f5', class: "event-name" }, this.eventName), this.venueLabel && index.h("p", { key: 'dd968b397deab890df3a4fbdff33226e82bd9660', class: "event-meta" }, this.venueLabel), this.dateSummary && index.h("p", { key: 'f40e6049d09b06c9f599e7d14d6fbb43b39b22fd', class: "event-meta" }, this.dateSummary)), index.h("button", { key: 'dbe0908f8cd8544654b627921f68cc4961802b77', class: "close-btn", "aria-label": "Close", onClick: this.close }, index.h("svg", { key: '23a750830e6e16d28cbcd5025507d25848aaadf7', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, index.h("path", { key: 'e81b8763a5c781f72c1ca8a2113482948e3ba8cc', d: "M6 6l12 12M18 6L6 18", "stroke-linecap": "round" })))), index.h("div", { key: 'da71e610f907cf53e78246d2065aaf526d5ceffd', class: "panel-body" }, this.step === 'loading' && (index.h("div", { key: '28cbb9a98c7b08fa8dcb9d8d5dfbf3bec93fe38d', class: "state-msg" }, index.h("span", { key: '915c8de87cbdc7da1ccf0622ce6c0f02fccf2cad', class: "spinner" }), " Loading\u2026")), this.step === 'error' && index.h("div", { key: '5785578bfef6f1ee81d938d91ffd3ded975f8c12', class: "state-msg error" }, this.error), this.step === 'occurrence' && (index.h("tl-occurrence-selector", { key: 'eeb853eab141c3c103015e82d221a140f6a3a109', eventId: this.eventId, onTlSelect: this.handleOccurrenceSelect })), this.step === 'tickets' && this.selectedOccurrenceId && (index.h("div", { key: 'f608f592ba651eb431375433eb4ff9393863ade5', class: "tickets-step" }, this.occurrenceCount > 1 && (index.h("button", { key: '84adfbdbeaceb2cf4238c6ffd09558b4499ca940', class: "back-link", onClick: this.backToDates }, "\u2190 Change date")), this.occurrenceLabel && index.h("p", { key: '0317e9194049608711e8c622142c3ad2c0a5dc12', class: "occ-label" }, this.occurrenceLabel), index.h("tl-ticket-selector", { key: '27b1e05d9d92fb8d519375e2b27d4b5ea0a4890a', eventId: this.eventId, occurrenceId: this.selectedOccurrenceId, onTlAddToCart: this.handleAdded }))), this.step === 'done' && (index.h("div", { key: '0853088206988c66d489f8804df7899821d49e64', class: "done-step" }, index.h("div", { key: 'c2955b893c4dffaadcdfd27bee96ef2724a131a6', class: "done-mark" }, "\uD83C\uDF9F\uFE0F"), index.h("p", { key: '370c30dfcbc0c25b4794d984dd261a3a5779a9dc', class: "done-title" }, "Added to your cart"), index.h("p", { key: 'c462f3c9292740e2fd2c74b173484f80a5dc1a30', class: "done-sub" }, "Held for you while you check out."), index.h("button", { key: '484991f79572e3213ad6413a1af87599880c3643', class: "primary-btn", onClick: this.goCheckout }, "Go to checkout"), index.h("button", { key: '5b4ba5a472b794e8f5af0f131dad1c8c11b869f5', class: "ghost-btn", onClick: this.close }, "Keep browsing"))))), index.h("div", { key: '9acdd36744d363f41f0bed7938ecea33322362d1', class: "powered-by" }, index.h("div", { key: 'f45545a8fc625336618352f0c0e9e84a1babce96', class: "pb-links" }, index.h("a", { key: 'dd929b12419b8353d9a09ad242a9f351dfd699e2', href: "https://ticketlayer.com/privacy", target: "_blank", rel: "noopener noreferrer" }, "Privacy Policy"), index.h("a", { key: '859be221bdc76602defaebdb89a997778cda6a91', href: "https://ticketlayer.com/report-abuse", target: "_blank", rel: "noopener noreferrer" }, "Report Abuse")), index.h("a", { key: 'd4e1f44b3b084160d2df8b9d15e075ddc5e05363', class: "pb-brand", href: "https://ticketlayer.com", target: "_blank", rel: "noopener noreferrer" }, index.h("span", { key: 'fe7fd86576a4e9772daa2c4c449da060f20fa143', class: "pb-pre" }, "Powered by"), index.h("svg", { key: '19412bd9e5522f0af9f847fe8fda6aa0f0004a3a', width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true" }, index.h("path", { key: 'c159efd1b8fce42b8c0fd5bac21792b4dc2728ce', d: "M4 7.5A1.5 1.5 0 0 1 5.5 6h13A1.5 1.5 0 0 1 20 7.5v2a2 2 0 0 0 0 5v2a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 16.5v-2a2 2 0 0 0 0-5v-2Z", fill: "currentColor" }), index.h("path", { key: '283956eead27e5919301c30882da6eaa7b093a1a', d: "M13 7v10", stroke: "var(--tl-pb-perforation, var(--tl-background, #fff))", "stroke-width": "1.2", "stroke-dasharray": "1.5 1.8", "stroke-linecap": "round" })), index.h("span", { key: 'bc045fda144885737b88bf81b4f9000ec8d333be', class: "pb-word" }, "Ticketlayer"))))));
|
|
123
123
|
}
|
|
124
124
|
};
|
|
125
125
|
TlBuyModal.style = tlBuyModalCss();
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var index = require('./index-DfzcrE9-.js');
|
|
4
4
|
var sdkConnector = require('./sdk-connector-ClDF3013.js');
|
|
5
5
|
|
|
6
|
-
const tlCartDrawerCss = () => `:host{--_bg:var(--tl-background, #ffffff);--_fg:var(--tl-foreground, #111827);--_muted-fg:var(--tl-muted-foreground, #6b7280);--_muted:var(--tl-muted, #f3f4f6);--_border:var(--tl-border, #e5e7eb);--_font:var(--tl-font-family, system-ui, -apple-system, sans-serif);font-family:var(--_font)}.overlay{position:fixed;inset:0;z-index:2147483640;background:rgba(8, 8, 16, 0.6);backdrop-filter:blur(
|
|
6
|
+
const tlCartDrawerCss = () => `:host{--_bg:var(--tl-background, #ffffff);--_fg:var(--tl-foreground, #111827);--_muted-fg:var(--tl-muted-foreground, #6b7280);--_muted:var(--tl-muted, #f3f4f6);--_border:var(--tl-border, #e5e7eb);--_font:var(--tl-font-family, system-ui, -apple-system, sans-serif);font-family:var(--_font)}.overlay{position:fixed;inset:0;z-index:2147483640;background:rgba(8, 8, 16, 0.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity 0.25s ease}.overlay.is-open{opacity:1;pointer-events:auto}.panel{position:fixed;top:0;bottom:0;width:min(420px, 100%);display:flex;flex-direction:column;background:var(--_bg);color:var(--_fg);box-shadow:0 0 48px rgba(0, 0, 0, 0.5);transition:transform 0.28s cubic-bezier(0.16, 1, 0.3, 1);will-change:transform}.panel--right{right:0;border-left:1px solid var(--_border);transform:translateX(100%)}.panel--left{left:0;border-right:1px solid var(--_border);transform:translateX(-100%)}.panel.is-open{transform:translateX(0)}.drawer-header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--_border)}.drawer-title{margin:0;font-size:1.1rem;font-weight:700}.close-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:0;border-radius:999px;background:var(--_muted);color:var(--_muted-fg);cursor:pointer;transition:color 0.15s}.close-btn:hover{color:var(--_fg)}.close-btn svg{width:16px;height:16px}.drawer-body{flex:1;overflow-y:auto;padding:18px 20px}.drawer-footer{flex:none;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 20px;border-top:1px solid var(--_border);font-size:11.5px;font-weight:500;color:var(--_muted-fg)}.drawer-footer a{color:inherit;text-decoration:none;opacity:0.9;transition:opacity 0.15s ease}.drawer-footer a:hover{opacity:1}.drawer-footer .pb-links{display:flex;gap:14px}.drawer-footer .pb-brand{display:inline-flex;align-items:center;gap:5px}.drawer-footer .pb-brand svg{display:block}.drawer-footer .pb-pre{opacity:0.7}.drawer-footer .pb-word{font-weight:700}`;
|
|
7
7
|
|
|
8
8
|
const TlCartDrawer = class {
|
|
9
9
|
constructor(hostRef) {
|
|
@@ -51,10 +51,10 @@ const TlCartDrawer = class {
|
|
|
51
51
|
this.tlClose.emit();
|
|
52
52
|
}
|
|
53
53
|
render() {
|
|
54
|
-
return (index.h(index.Host, { key: '
|
|
54
|
+
return (index.h(index.Host, { key: '022314d9fb612e930da52ece34f2ab8ae8ce44da' }, index.h("div", { key: '985b4001145d72ba91ef7d466adba8ab939e9cc4', class: { overlay: true, 'is-open': this.visible }, onClick: (e) => {
|
|
55
55
|
if (e.target === e.currentTarget)
|
|
56
56
|
this.close();
|
|
57
|
-
} }, index.h("aside", { key: '
|
|
57
|
+
} }, index.h("aside", { key: '3ac3588ae8feacd4f8bb96bdae8ef71e80ecb4b3', class: { panel: true, [`panel--${this.side}`]: true, 'is-open': this.visible }, role: "dialog", "aria-modal": "true", "aria-label": this.heading, "aria-hidden": this.visible ? 'false' : 'true' }, index.h("header", { key: 'e0126d634e952ebf56b73e54545f6c3981210827', class: "drawer-header" }, index.h("h2", { key: 'a72b23114aa836076ec59cd4a5d1438d228179d9', class: "drawer-title" }, this.heading), index.h("button", { key: '92fb5b159490440352a6c23d65aa6e8c956ae3d8', class: "close-btn", onClick: this.close, "aria-label": "Close cart" }, index.h("svg", { key: '138f4dc7669e62fb667091da0ba26dfbe94327c6', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, index.h("path", { key: '21fedd9dc89937a92f9c1124d4fa834b55908f1e', d: "M6 6l12 12M18 6L6 18", "stroke-linecap": "round" })))), index.h("div", { key: 'ebee87cb6a3c98dbf813d0a903a9cb4da2c696f3', class: "drawer-body" }, index.h("tl-cart", { key: '323db3a160837b68ffaa767e647ec67b06fa53b0' })), index.h("footer", { key: 'd35543373eb13ad1acc46ae50aefcb5a04f305a1', class: "drawer-footer" }, index.h("div", { key: '52229c74d39471bf186c965b6a53b38f79ce8d61', class: "pb-links" }, index.h("a", { key: 'd0430bf93d920c57fc42043faed7e8fd895855aa', href: "https://ticketlayer.com/privacy", target: "_blank", rel: "noopener noreferrer" }, "Privacy Policy"), index.h("a", { key: '2a75dc8dcdc9ec3010fe83f97d903cdc32767e49', href: "https://ticketlayer.com/report-abuse", target: "_blank", rel: "noopener noreferrer" }, "Report Abuse")), index.h("a", { key: '40642c5c4c003a454dd7ab2b66ebe5948a03df7d', class: "pb-brand", href: "https://ticketlayer.com", target: "_blank", rel: "noopener noreferrer" }, index.h("span", { key: 'a5d9b5c023381d25b6aaddf61e56dbdb21580975', class: "pb-pre" }, "Powered by"), index.h("svg", { key: '35bc23af9a35272d7ada24fd66d5f12f1d951ae8', width: "13", height: "13", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true" }, index.h("path", { key: '90139e79acd8920bcd494cc6579dbcb8278b0aef', d: "M4 7.5A1.5 1.5 0 0 1 5.5 6h13A1.5 1.5 0 0 1 20 7.5v2a2 2 0 0 0 0 5v2a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 16.5v-2a2 2 0 0 0 0-5v-2Z", fill: "currentColor" }), index.h("path", { key: 'ba3aa34471395e33752e72f87f93a85381f7caad', d: "M13 7v10", stroke: "var(--tl-pb-perforation, var(--tl-background, #fff))", "stroke-width": "1.2", "stroke-dasharray": "1.5 1.8", "stroke-linecap": "round" })), index.h("span", { key: '429154bd6c38febe4da8871a7e614bf272a18854', class: "pb-word" }, "Ticketlayer")))))));
|
|
58
58
|
}
|
|
59
59
|
static get watchers() { return {
|
|
60
60
|
"open": [{
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var index = require('./index-DfzcrE9-.js');
|
|
4
4
|
var sdkConnector = require('./sdk-connector-ClDF3013.js');
|
|
5
5
|
|
|
6
|
-
const tlOrderTicketsCss = () => `: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)}`;
|
|
6
|
+
const tlOrderTicketsCss = () => `: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)}}`;
|
|
7
7
|
|
|
8
8
|
const TlOrderTickets = class {
|
|
9
9
|
constructor(hostRef) {
|
|
@@ -13,16 +13,34 @@ const TlOrderTickets = class {
|
|
|
13
13
|
this.tickets = [];
|
|
14
14
|
this.loading = true;
|
|
15
15
|
this.error = null;
|
|
16
|
+
/** The order loaded, but has no tickets yet and we are still waiting. */
|
|
17
|
+
this.issuing = false;
|
|
18
|
+
this.poll = 0;
|
|
16
19
|
}
|
|
17
20
|
watchOrder() {
|
|
21
|
+
this.reset();
|
|
18
22
|
this.load();
|
|
19
23
|
}
|
|
20
24
|
async componentWillLoad() {
|
|
21
25
|
await this.load();
|
|
22
26
|
}
|
|
27
|
+
disconnectedCallback() {
|
|
28
|
+
this.stopPolling();
|
|
29
|
+
}
|
|
30
|
+
reset() {
|
|
31
|
+
this.stopPolling();
|
|
32
|
+
this.poll = 0;
|
|
33
|
+
this.tickets = [];
|
|
34
|
+
this.issuing = false;
|
|
35
|
+
}
|
|
36
|
+
stopPolling() {
|
|
37
|
+
if (this.timer !== undefined) {
|
|
38
|
+
clearTimeout(this.timer);
|
|
39
|
+
this.timer = undefined;
|
|
40
|
+
}
|
|
41
|
+
}
|
|
23
42
|
async load() {
|
|
24
43
|
try {
|
|
25
|
-
this.loading = true;
|
|
26
44
|
this.error = null;
|
|
27
45
|
const sdk = await sdkConnector.whenSDK();
|
|
28
46
|
const orders = sdk.getOrdersManager?.();
|
|
@@ -30,8 +48,27 @@ const TlOrderTickets = class {
|
|
|
30
48
|
throw new Error('Tickets are not available');
|
|
31
49
|
const order = (await orders.get(this.orderId));
|
|
32
50
|
this.tickets = order?.tickets ?? [];
|
|
51
|
+
if (this.tickets.length > 0) {
|
|
52
|
+
// Arrived. Stop asking.
|
|
53
|
+
this.issuing = false;
|
|
54
|
+
this.stopPolling();
|
|
55
|
+
}
|
|
56
|
+
else {
|
|
57
|
+
const delay = TlOrderTickets.POLL_DELAYS_MS[this.poll];
|
|
58
|
+
// `undefined` once the schedule runs out: give up waiting, and say so.
|
|
59
|
+
this.issuing = delay !== undefined;
|
|
60
|
+
if (delay !== undefined) {
|
|
61
|
+
this.poll += 1;
|
|
62
|
+
this.stopPolling();
|
|
63
|
+
this.timer = setTimeout(() => this.load(), delay);
|
|
64
|
+
}
|
|
65
|
+
}
|
|
33
66
|
}
|
|
34
67
|
catch (err) {
|
|
68
|
+
// A failed request is a different thing from an order with no tickets,
|
|
69
|
+
// and stops the polling: retrying a 403 a dozen times helps nobody.
|
|
70
|
+
this.stopPolling();
|
|
71
|
+
this.issuing = false;
|
|
35
72
|
this.error = err instanceof Error ? err.message : 'Failed to load tickets';
|
|
36
73
|
}
|
|
37
74
|
finally {
|
|
@@ -46,7 +83,7 @@ const TlOrderTickets = class {
|
|
|
46
83
|
return index.h("div", { class: "state error" }, this.error);
|
|
47
84
|
}
|
|
48
85
|
if (this.tickets.length === 0) {
|
|
49
|
-
return index.h("div", { class: "state" }, "
|
|
86
|
+
return this.issuing ? (index.h("div", { class: "state issuing", role: "status", "aria-live": "polite" }, index.h("span", { class: "spinner", "aria-hidden": "true" }), "Preparing your tickets\u2026")) : (index.h("div", { class: "state", role: "status" }, "Your tickets are taking longer than usual. They will be emailed to you as soon as they are ready."));
|
|
50
87
|
}
|
|
51
88
|
return (index.h("div", { class: `grid cols-${this.columns}` }, this.tickets.map((t) => (index.h("tl-ticket", { key: t.id, ticket: t, orderId: this.orderId })))));
|
|
52
89
|
}
|
|
@@ -56,6 +93,14 @@ const TlOrderTickets = class {
|
|
|
56
93
|
}]
|
|
57
94
|
}; }
|
|
58
95
|
};
|
|
96
|
+
/**
|
|
97
|
+
* Gaps between polls, in milliseconds. Front-loaded because issuance
|
|
98
|
+
* usually lands in the first few seconds, then widening so a genuinely
|
|
99
|
+
* stuck order is not hammered. Sums to roughly one minute.
|
|
100
|
+
*/
|
|
101
|
+
TlOrderTickets.POLL_DELAYS_MS = [
|
|
102
|
+
1000, 1500, 2000, 3000, 4000, 5000, 6000, 8000, 10000, 12000,
|
|
103
|
+
];
|
|
59
104
|
TlOrderTickets.style = tlOrderTicketsCss();
|
|
60
105
|
|
|
61
106
|
function getDefaultExportFromCjs (x) {
|
|
@@ -127,10 +127,10 @@ const TlSeatMap = class {
|
|
|
127
127
|
// Render
|
|
128
128
|
// -------------------------------------------------------------------------
|
|
129
129
|
render() {
|
|
130
|
-
return (index.h("div", { key: '
|
|
130
|
+
return (index.h("div", { key: 'c9beadc1792d7825ac3f99e6abc8b181e28fd1b6', class: "seat-map-container", style: {
|
|
131
131
|
width: this.width,
|
|
132
132
|
height: this.height,
|
|
133
|
-
} }, this.isLoading && (index.h("div", { key: '
|
|
133
|
+
} }, this.isLoading && (index.h("div", { key: 'ad792ea35f433a268c81722ce4e7d0e34780d337', class: "loading" }, index.h("div", { key: 'dd3e0657b16c2f265f59fbaa2ac39c559c2093b7', class: "spinner" }), index.h("p", { key: '2714e3073d0e5cddc50d530aa1cf46a7f73ba96f' }, "Loading seat map..."))), this.error && (index.h("div", { key: '3de9d73ab89a1ee963e73b4192d5c93e9667f11b', class: "error" }, index.h("p", { key: '0fea5c828b5b212ffdb45c9c7702d241e2b79cc4', class: "error-title" }, "Error"), index.h("p", { key: 'f2c090b982bb1ee6fb7d347d8860b4ce4798a891', class: "error-message" }, this.error))), index.h("iframe", { key: '8023219fdd467ec736f9627190690a6f73df3bb3', ref: (el) => (this.iframeRef = el), src: this.getIframeSrc(), class: {
|
|
134
134
|
'seat-map-iframe': true,
|
|
135
135
|
hidden: this.isLoading || !!this.error,
|
|
136
136
|
}, title: "Ticketlayer Seat Map", allow: "fullscreen" })));
|
|
@@ -19,18 +19,21 @@
|
|
|
19
19
|
inset: 0;
|
|
20
20
|
z-index: 2147483646;
|
|
21
21
|
display: flex;
|
|
22
|
+
flex-direction: column;
|
|
22
23
|
align-items: center;
|
|
23
24
|
justify-content: center;
|
|
25
|
+
gap: 12px;
|
|
24
26
|
padding: 16px;
|
|
25
|
-
background: rgba(8, 8, 16, 0.
|
|
26
|
-
backdrop-filter: blur(
|
|
27
|
+
background: rgba(8, 8, 16, 0.6);
|
|
28
|
+
backdrop-filter: blur(8px);
|
|
29
|
+
-webkit-backdrop-filter: blur(8px);
|
|
27
30
|
animation: tl-fade 0.18s ease-out;
|
|
28
31
|
}
|
|
29
32
|
|
|
30
33
|
.panel {
|
|
31
34
|
width: 100%;
|
|
32
35
|
max-width: 460px;
|
|
33
|
-
max-height:
|
|
36
|
+
max-height: 86vh;
|
|
34
37
|
display: flex;
|
|
35
38
|
flex-direction: column;
|
|
36
39
|
overflow: hidden;
|
|
@@ -48,6 +51,57 @@
|
|
|
48
51
|
max-width: 720px;
|
|
49
52
|
}
|
|
50
53
|
|
|
54
|
+
/* Floating chrome beneath the panel: platform links left, brand right. */
|
|
55
|
+
.powered-by {
|
|
56
|
+
/* The dashes are a cut-out, so they have to be the colour BEHIND the ticket.
|
|
57
|
+
This chrome floats on the modal's dark backdrop rather than on the page
|
|
58
|
+
surface, so --tl-background (a light value in most themes) would draw
|
|
59
|
+
white dashes on a white icon and vanish. The drawer's footer sits on the
|
|
60
|
+
panel itself and takes the default. */
|
|
61
|
+
--tl-pb-perforation: rgba(8, 8, 16, 0.6);
|
|
62
|
+
width: 100%;
|
|
63
|
+
max-width: 460px;
|
|
64
|
+
display: flex;
|
|
65
|
+
align-items: center;
|
|
66
|
+
justify-content: space-between;
|
|
67
|
+
gap: 12px;
|
|
68
|
+
padding: 0 4px;
|
|
69
|
+
font-size: 12px;
|
|
70
|
+
font-weight: 500;
|
|
71
|
+
color: rgba(255, 255, 255, 0.78);
|
|
72
|
+
animation: tl-fade 0.3s ease-out;
|
|
73
|
+
}
|
|
74
|
+
.powered-by a {
|
|
75
|
+
color: inherit;
|
|
76
|
+
text-decoration: none;
|
|
77
|
+
opacity: 0.85;
|
|
78
|
+
transition: opacity 0.15s ease;
|
|
79
|
+
}
|
|
80
|
+
.powered-by a:hover {
|
|
81
|
+
opacity: 1;
|
|
82
|
+
}
|
|
83
|
+
.powered-by .pb-links {
|
|
84
|
+
display: flex;
|
|
85
|
+
gap: 16px;
|
|
86
|
+
align-items: center;
|
|
87
|
+
}
|
|
88
|
+
.powered-by .pb-brand {
|
|
89
|
+
display: inline-flex;
|
|
90
|
+
align-items: center;
|
|
91
|
+
gap: 6px;
|
|
92
|
+
opacity: 0.92;
|
|
93
|
+
}
|
|
94
|
+
.powered-by .pb-brand svg {
|
|
95
|
+
display: block;
|
|
96
|
+
}
|
|
97
|
+
.powered-by .pb-pre {
|
|
98
|
+
opacity: 0.7;
|
|
99
|
+
}
|
|
100
|
+
.powered-by .pb-word {
|
|
101
|
+
font-weight: 700;
|
|
102
|
+
letter-spacing: 0.01em;
|
|
103
|
+
}
|
|
104
|
+
|
|
51
105
|
.panel-header {
|
|
52
106
|
display: flex;
|
|
53
107
|
align-items: center;
|
|
@@ -129,7 +129,7 @@ export class TlBuyModal {
|
|
|
129
129
|
return (h(Host, { key: '1245e518c2b5232f4d9dba091cf808cd3867fbef' }, h("div", { key: '4e770fccdd785444f1cc87df4adab5a5dc1bf58a', class: "overlay", onClick: (e) => {
|
|
130
130
|
if (e.target === e.currentTarget)
|
|
131
131
|
this.close();
|
|
132
|
-
} }, h("div", { key: '57b13dac690028aeebd6a601acfba07f00854c40', class: { panel: true, 'panel--wide': this.step === 'occurrence' }, role: "dialog", "aria-modal": "true", "aria-label": this.eventName }, h("header", { key: '881e9cc70a0ca25947f272b9ebcb2e6d4b4268f2', class: "panel-header" }, this.imageUrl && (h("div", { key: '753f7df1b5118dfacbbc6b89b4e5d7ba114f6cdf', class: "event-thumb", style: { backgroundImage: `url(${this.imageUrl})` } })), h("div", { key: '9aaa32d1add90fabd1b0ea0c100f198962f4e6a5', class: "titles" }, h("span", { key: '538032bdf2338206ad763417386852ff97cc472f', class: "kicker" }, this.stepKicker()), h("h2", { key: '71429804179e7fbbea1fa90a2937a065517092f5', class: "event-name" }, this.eventName), this.venueLabel && h("p", { key: 'dd968b397deab890df3a4fbdff33226e82bd9660', class: "event-meta" }, this.venueLabel), this.dateSummary && h("p", { key: 'f40e6049d09b06c9f599e7d14d6fbb43b39b22fd', class: "event-meta" }, this.dateSummary)), h("button", { key: 'dbe0908f8cd8544654b627921f68cc4961802b77', class: "close-btn", "aria-label": "Close", onClick: this.close }, h("svg", { key: '23a750830e6e16d28cbcd5025507d25848aaadf7', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: 'e81b8763a5c781f72c1ca8a2113482948e3ba8cc', d: "M6 6l12 12M18 6L6 18", "stroke-linecap": "round" })))), h("div", { key: 'da71e610f907cf53e78246d2065aaf526d5ceffd', class: "panel-body" }, this.step === 'loading' && (h("div", { key: '28cbb9a98c7b08fa8dcb9d8d5dfbf3bec93fe38d', class: "state-msg" }, h("span", { key: '915c8de87cbdc7da1ccf0622ce6c0f02fccf2cad', class: "spinner" }), " Loading\u2026")), this.step === 'error' && h("div", { key: '5785578bfef6f1ee81d938d91ffd3ded975f8c12', class: "state-msg error" }, this.error), this.step === 'occurrence' && (h("tl-occurrence-selector", { key: 'eeb853eab141c3c103015e82d221a140f6a3a109', eventId: this.eventId, onTlSelect: this.handleOccurrenceSelect })), this.step === 'tickets' && this.selectedOccurrenceId && (h("div", { key: 'f608f592ba651eb431375433eb4ff9393863ade5', class: "tickets-step" }, this.occurrenceCount > 1 && (h("button", { key: '84adfbdbeaceb2cf4238c6ffd09558b4499ca940', class: "back-link", onClick: this.backToDates }, "\u2190 Change date")), this.occurrenceLabel && h("p", { key: '0317e9194049608711e8c622142c3ad2c0a5dc12', class: "occ-label" }, this.occurrenceLabel), h("tl-ticket-selector", { key: '27b1e05d9d92fb8d519375e2b27d4b5ea0a4890a', eventId: this.eventId, occurrenceId: this.selectedOccurrenceId, onTlAddToCart: this.handleAdded }))), this.step === 'done' && (h("div", { key: '0853088206988c66d489f8804df7899821d49e64', class: "done-step" }, h("div", { key: 'c2955b893c4dffaadcdfd27bee96ef2724a131a6', class: "done-mark" }, "\uD83C\uDF9F\uFE0F"), h("p", { key: '370c30dfcbc0c25b4794d984dd261a3a5779a9dc', class: "done-title" }, "Added to your cart"), h("p", { key: 'c462f3c9292740e2fd2c74b173484f80a5dc1a30', class: "done-sub" }, "Held for you while you check out."), h("button", { key: '484991f79572e3213ad6413a1af87599880c3643', class: "primary-btn", onClick: this.goCheckout }, "Go to checkout"), h("button", { key: '5b4ba5a472b794e8f5af0f131dad1c8c11b869f5', class: "ghost-btn", onClick: this.close }, "Keep browsing"))))))));
|
|
132
|
+
} }, h("div", { key: '57b13dac690028aeebd6a601acfba07f00854c40', class: { panel: true, 'panel--wide': this.step === 'occurrence' }, role: "dialog", "aria-modal": "true", "aria-label": this.eventName }, h("header", { key: '881e9cc70a0ca25947f272b9ebcb2e6d4b4268f2', class: "panel-header" }, this.imageUrl && (h("div", { key: '753f7df1b5118dfacbbc6b89b4e5d7ba114f6cdf', class: "event-thumb", style: { backgroundImage: `url(${this.imageUrl})` } })), h("div", { key: '9aaa32d1add90fabd1b0ea0c100f198962f4e6a5', class: "titles" }, h("span", { key: '538032bdf2338206ad763417386852ff97cc472f', class: "kicker" }, this.stepKicker()), h("h2", { key: '71429804179e7fbbea1fa90a2937a065517092f5', class: "event-name" }, this.eventName), this.venueLabel && h("p", { key: 'dd968b397deab890df3a4fbdff33226e82bd9660', class: "event-meta" }, this.venueLabel), this.dateSummary && h("p", { key: 'f40e6049d09b06c9f599e7d14d6fbb43b39b22fd', class: "event-meta" }, this.dateSummary)), h("button", { key: 'dbe0908f8cd8544654b627921f68cc4961802b77', class: "close-btn", "aria-label": "Close", onClick: this.close }, h("svg", { key: '23a750830e6e16d28cbcd5025507d25848aaadf7', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: 'e81b8763a5c781f72c1ca8a2113482948e3ba8cc', d: "M6 6l12 12M18 6L6 18", "stroke-linecap": "round" })))), h("div", { key: 'da71e610f907cf53e78246d2065aaf526d5ceffd', class: "panel-body" }, this.step === 'loading' && (h("div", { key: '28cbb9a98c7b08fa8dcb9d8d5dfbf3bec93fe38d', class: "state-msg" }, h("span", { key: '915c8de87cbdc7da1ccf0622ce6c0f02fccf2cad', class: "spinner" }), " Loading\u2026")), this.step === 'error' && h("div", { key: '5785578bfef6f1ee81d938d91ffd3ded975f8c12', class: "state-msg error" }, this.error), this.step === 'occurrence' && (h("tl-occurrence-selector", { key: 'eeb853eab141c3c103015e82d221a140f6a3a109', eventId: this.eventId, onTlSelect: this.handleOccurrenceSelect })), this.step === 'tickets' && this.selectedOccurrenceId && (h("div", { key: 'f608f592ba651eb431375433eb4ff9393863ade5', class: "tickets-step" }, this.occurrenceCount > 1 && (h("button", { key: '84adfbdbeaceb2cf4238c6ffd09558b4499ca940', class: "back-link", onClick: this.backToDates }, "\u2190 Change date")), this.occurrenceLabel && h("p", { key: '0317e9194049608711e8c622142c3ad2c0a5dc12', class: "occ-label" }, this.occurrenceLabel), h("tl-ticket-selector", { key: '27b1e05d9d92fb8d519375e2b27d4b5ea0a4890a', eventId: this.eventId, occurrenceId: this.selectedOccurrenceId, onTlAddToCart: this.handleAdded }))), this.step === 'done' && (h("div", { key: '0853088206988c66d489f8804df7899821d49e64', class: "done-step" }, h("div", { key: 'c2955b893c4dffaadcdfd27bee96ef2724a131a6', class: "done-mark" }, "\uD83C\uDF9F\uFE0F"), h("p", { key: '370c30dfcbc0c25b4794d984dd261a3a5779a9dc', class: "done-title" }, "Added to your cart"), h("p", { key: 'c462f3c9292740e2fd2c74b173484f80a5dc1a30', class: "done-sub" }, "Held for you while you check out."), h("button", { key: '484991f79572e3213ad6413a1af87599880c3643', class: "primary-btn", onClick: this.goCheckout }, "Go to checkout"), h("button", { key: '5b4ba5a472b794e8f5af0f131dad1c8c11b869f5', class: "ghost-btn", onClick: this.close }, "Keep browsing"))))), h("div", { key: '9acdd36744d363f41f0bed7938ecea33322362d1', class: "powered-by" }, h("div", { key: 'f45545a8fc625336618352f0c0e9e84a1babce96', class: "pb-links" }, h("a", { key: 'dd929b12419b8353d9a09ad242a9f351dfd699e2', href: "https://ticketlayer.com/privacy", target: "_blank", rel: "noopener noreferrer" }, "Privacy Policy"), h("a", { key: '859be221bdc76602defaebdb89a997778cda6a91', href: "https://ticketlayer.com/report-abuse", target: "_blank", rel: "noopener noreferrer" }, "Report Abuse")), h("a", { key: 'd4e1f44b3b084160d2df8b9d15e075ddc5e05363', class: "pb-brand", href: "https://ticketlayer.com", target: "_blank", rel: "noopener noreferrer" }, h("span", { key: 'fe7fd86576a4e9772daa2c4c449da060f20fa143', class: "pb-pre" }, "Powered by"), h("svg", { key: '19412bd9e5522f0af9f847fe8fda6aa0f0004a3a', width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true" }, h("path", { key: 'c159efd1b8fce42b8c0fd5bac21792b4dc2728ce', d: "M4 7.5A1.5 1.5 0 0 1 5.5 6h13A1.5 1.5 0 0 1 20 7.5v2a2 2 0 0 0 0 5v2a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 16.5v-2a2 2 0 0 0 0-5v-2Z", fill: "currentColor" }), h("path", { key: '283956eead27e5919301c30882da6eaa7b093a1a', d: "M13 7v10", stroke: "var(--tl-pb-perforation, var(--tl-background, #fff))", "stroke-width": "1.2", "stroke-dasharray": "1.5 1.8", "stroke-linecap": "round" })), h("span", { key: 'bc045fda144885737b88bf81b4f9000ec8d333be', class: "pb-word" }, "Ticketlayer"))))));
|
|
133
133
|
}
|
|
134
134
|
static get is() { return "tl-buy-modal"; }
|
|
135
135
|
static get encapsulation() { return "shadow"; }
|
|
@@ -13,7 +13,8 @@
|
|
|
13
13
|
inset: 0;
|
|
14
14
|
z-index: 2147483640;
|
|
15
15
|
background: rgba(8, 8, 16, 0.6);
|
|
16
|
-
backdrop-filter: blur(
|
|
16
|
+
backdrop-filter: blur(8px);
|
|
17
|
+
-webkit-backdrop-filter: blur(8px);
|
|
17
18
|
opacity: 0;
|
|
18
19
|
pointer-events: none;
|
|
19
20
|
transition: opacity 0.25s ease;
|
|
@@ -96,3 +97,44 @@
|
|
|
96
97
|
overflow-y: auto;
|
|
97
98
|
padding: 18px 20px;
|
|
98
99
|
}
|
|
100
|
+
|
|
101
|
+
/* Platform chrome pinned to the foot of the drawer. */
|
|
102
|
+
.drawer-footer {
|
|
103
|
+
flex: none;
|
|
104
|
+
display: flex;
|
|
105
|
+
align-items: center;
|
|
106
|
+
justify-content: space-between;
|
|
107
|
+
gap: 10px;
|
|
108
|
+
padding: 10px 20px;
|
|
109
|
+
border-top: 1px solid var(--_border);
|
|
110
|
+
font-size: 11.5px;
|
|
111
|
+
font-weight: 500;
|
|
112
|
+
color: var(--_muted-fg);
|
|
113
|
+
}
|
|
114
|
+
.drawer-footer a {
|
|
115
|
+
color: inherit;
|
|
116
|
+
text-decoration: none;
|
|
117
|
+
opacity: 0.9;
|
|
118
|
+
transition: opacity 0.15s ease;
|
|
119
|
+
}
|
|
120
|
+
.drawer-footer a:hover {
|
|
121
|
+
opacity: 1;
|
|
122
|
+
}
|
|
123
|
+
.drawer-footer .pb-links {
|
|
124
|
+
display: flex;
|
|
125
|
+
gap: 14px;
|
|
126
|
+
}
|
|
127
|
+
.drawer-footer .pb-brand {
|
|
128
|
+
display: inline-flex;
|
|
129
|
+
align-items: center;
|
|
130
|
+
gap: 5px;
|
|
131
|
+
}
|
|
132
|
+
.drawer-footer .pb-brand svg {
|
|
133
|
+
display: block;
|
|
134
|
+
}
|
|
135
|
+
.drawer-footer .pb-pre {
|
|
136
|
+
opacity: 0.7;
|
|
137
|
+
}
|
|
138
|
+
.drawer-footer .pb-word {
|
|
139
|
+
font-weight: 700;
|
|
140
|
+
}
|
|
@@ -57,10 +57,10 @@ export class TlCartDrawer {
|
|
|
57
57
|
this.tlClose.emit();
|
|
58
58
|
}
|
|
59
59
|
render() {
|
|
60
|
-
return (h(Host, { key: '
|
|
60
|
+
return (h(Host, { key: '022314d9fb612e930da52ece34f2ab8ae8ce44da' }, h("div", { key: '985b4001145d72ba91ef7d466adba8ab939e9cc4', class: { overlay: true, 'is-open': this.visible }, onClick: (e) => {
|
|
61
61
|
if (e.target === e.currentTarget)
|
|
62
62
|
this.close();
|
|
63
|
-
} }, h("aside", { key: '
|
|
63
|
+
} }, h("aside", { key: '3ac3588ae8feacd4f8bb96bdae8ef71e80ecb4b3', class: { panel: true, [`panel--${this.side}`]: true, 'is-open': this.visible }, role: "dialog", "aria-modal": "true", "aria-label": this.heading, "aria-hidden": this.visible ? 'false' : 'true' }, h("header", { key: 'e0126d634e952ebf56b73e54545f6c3981210827', class: "drawer-header" }, h("h2", { key: 'a72b23114aa836076ec59cd4a5d1438d228179d9', class: "drawer-title" }, this.heading), h("button", { key: '92fb5b159490440352a6c23d65aa6e8c956ae3d8', class: "close-btn", onClick: this.close, "aria-label": "Close cart" }, h("svg", { key: '138f4dc7669e62fb667091da0ba26dfbe94327c6', viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", "stroke-width": "2" }, h("path", { key: '21fedd9dc89937a92f9c1124d4fa834b55908f1e', d: "M6 6l12 12M18 6L6 18", "stroke-linecap": "round" })))), h("div", { key: 'ebee87cb6a3c98dbf813d0a903a9cb4da2c696f3', class: "drawer-body" }, h("tl-cart", { key: '323db3a160837b68ffaa767e647ec67b06fa53b0' })), h("footer", { key: 'd35543373eb13ad1acc46ae50aefcb5a04f305a1', class: "drawer-footer" }, h("div", { key: '52229c74d39471bf186c965b6a53b38f79ce8d61', class: "pb-links" }, h("a", { key: 'd0430bf93d920c57fc42043faed7e8fd895855aa', href: "https://ticketlayer.com/privacy", target: "_blank", rel: "noopener noreferrer" }, "Privacy Policy"), h("a", { key: '2a75dc8dcdc9ec3010fe83f97d903cdc32767e49', href: "https://ticketlayer.com/report-abuse", target: "_blank", rel: "noopener noreferrer" }, "Report Abuse")), h("a", { key: '40642c5c4c003a454dd7ab2b66ebe5948a03df7d', class: "pb-brand", href: "https://ticketlayer.com", target: "_blank", rel: "noopener noreferrer" }, h("span", { key: 'a5d9b5c023381d25b6aaddf61e56dbdb21580975', class: "pb-pre" }, "Powered by"), h("svg", { key: '35bc23af9a35272d7ada24fd66d5f12f1d951ae8', width: "13", height: "13", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true" }, h("path", { key: '90139e79acd8920bcd494cc6579dbcb8278b0aef', d: "M4 7.5A1.5 1.5 0 0 1 5.5 6h13A1.5 1.5 0 0 1 20 7.5v2a2 2 0 0 0 0 5v2a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 16.5v-2a2 2 0 0 0 0-5v-2Z", fill: "currentColor" }), h("path", { key: 'ba3aa34471395e33752e72f87f93a85381f7caad', d: "M13 7v10", stroke: "var(--tl-pb-perforation, var(--tl-background, #fff))", "stroke-width": "1.2", "stroke-dasharray": "1.5 1.8", "stroke-linecap": "round" })), h("span", { key: '429154bd6c38febe4da8871a7e614bf272a18854', class: "pb-word" }, "Ticketlayer")))))));
|
|
64
64
|
}
|
|
65
65
|
static get is() { return "tl-cart-drawer"; }
|
|
66
66
|
static get encapsulation() { return "shadow"; }
|
|
@@ -28,3 +28,35 @@
|
|
|
28
28
|
.state.error {
|
|
29
29
|
color: var(--tl-error, #dc2626);
|
|
30
30
|
}
|
|
31
|
+
|
|
32
|
+
.state.issuing {
|
|
33
|
+
display: flex;
|
|
34
|
+
align-items: center;
|
|
35
|
+
justify-content: center;
|
|
36
|
+
gap: var(--tl-spacing-2, 0.5rem);
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
.spinner {
|
|
40
|
+
width: 0.875rem;
|
|
41
|
+
height: 0.875rem;
|
|
42
|
+
border: 2px solid var(--tl-border, #e5e7eb);
|
|
43
|
+
border-top-color: var(--tl-primary, #6366f1);
|
|
44
|
+
border-radius: 50%;
|
|
45
|
+
animation: tl-spin 0.7s linear infinite;
|
|
46
|
+
flex: none;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
@keyframes tl-spin {
|
|
50
|
+
to {
|
|
51
|
+
transform: rotate(360deg);
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
/* Someone who has just paid does not need the spinner moving to know we are
|
|
56
|
+
working, and for a few people it is actively unpleasant. */
|
|
57
|
+
@media (prefers-reduced-motion: reduce) {
|
|
58
|
+
.spinner {
|
|
59
|
+
animation: none;
|
|
60
|
+
border-top-color: var(--tl-border, #e5e7eb);
|
|
61
|
+
}
|
|
62
|
+
}
|
|
@@ -6,6 +6,21 @@ import { whenSDK } from "../../utils/sdk-connector";
|
|
|
6
6
|
* gated by the session), so it works on a confirmation page or in an account.
|
|
7
7
|
*
|
|
8
8
|
* Usage: <tl-order-tickets order-id="ord_xxx"></tl-order-tickets>
|
|
9
|
+
*
|
|
10
|
+
* On an empty result it waits rather than concluding there is nothing.
|
|
11
|
+
*
|
|
12
|
+
* Tickets are issued asynchronously: the payment confirms, the order is
|
|
13
|
+
* marked paid, and entitlement issuance follows a moment later. A confirmation
|
|
14
|
+
* page therefore renders BEFORE the passes exist - reliably, not occasionally.
|
|
15
|
+
* The component used to answer that with "No tickets for this order yet",
|
|
16
|
+
* which is true and reads as "something went wrong" to someone who has just
|
|
17
|
+
* been charged. Refreshing showed them, so the only thing missing was the
|
|
18
|
+
* waiting.
|
|
19
|
+
*
|
|
20
|
+
* So: an empty order is treated as issuance in flight and polled, with the
|
|
21
|
+
* gaps widening, for about a minute. Then it stops and says the tickets are
|
|
22
|
+
* coming by email, because at that point something probably is wrong and a
|
|
23
|
+
* page that polls forever is worse than one that admits it.
|
|
9
24
|
*/
|
|
10
25
|
export class TlOrderTickets {
|
|
11
26
|
constructor() {
|
|
@@ -14,16 +29,34 @@ export class TlOrderTickets {
|
|
|
14
29
|
this.tickets = [];
|
|
15
30
|
this.loading = true;
|
|
16
31
|
this.error = null;
|
|
32
|
+
/** The order loaded, but has no tickets yet and we are still waiting. */
|
|
33
|
+
this.issuing = false;
|
|
34
|
+
this.poll = 0;
|
|
17
35
|
}
|
|
18
36
|
watchOrder() {
|
|
37
|
+
this.reset();
|
|
19
38
|
this.load();
|
|
20
39
|
}
|
|
21
40
|
async componentWillLoad() {
|
|
22
41
|
await this.load();
|
|
23
42
|
}
|
|
43
|
+
disconnectedCallback() {
|
|
44
|
+
this.stopPolling();
|
|
45
|
+
}
|
|
46
|
+
reset() {
|
|
47
|
+
this.stopPolling();
|
|
48
|
+
this.poll = 0;
|
|
49
|
+
this.tickets = [];
|
|
50
|
+
this.issuing = false;
|
|
51
|
+
}
|
|
52
|
+
stopPolling() {
|
|
53
|
+
if (this.timer !== undefined) {
|
|
54
|
+
clearTimeout(this.timer);
|
|
55
|
+
this.timer = undefined;
|
|
56
|
+
}
|
|
57
|
+
}
|
|
24
58
|
async load() {
|
|
25
59
|
try {
|
|
26
|
-
this.loading = true;
|
|
27
60
|
this.error = null;
|
|
28
61
|
const sdk = await whenSDK();
|
|
29
62
|
const orders = sdk.getOrdersManager?.();
|
|
@@ -31,8 +64,27 @@ export class TlOrderTickets {
|
|
|
31
64
|
throw new Error('Tickets are not available');
|
|
32
65
|
const order = (await orders.get(this.orderId));
|
|
33
66
|
this.tickets = order?.tickets ?? [];
|
|
67
|
+
if (this.tickets.length > 0) {
|
|
68
|
+
// Arrived. Stop asking.
|
|
69
|
+
this.issuing = false;
|
|
70
|
+
this.stopPolling();
|
|
71
|
+
}
|
|
72
|
+
else {
|
|
73
|
+
const delay = TlOrderTickets.POLL_DELAYS_MS[this.poll];
|
|
74
|
+
// `undefined` once the schedule runs out: give up waiting, and say so.
|
|
75
|
+
this.issuing = delay !== undefined;
|
|
76
|
+
if (delay !== undefined) {
|
|
77
|
+
this.poll += 1;
|
|
78
|
+
this.stopPolling();
|
|
79
|
+
this.timer = setTimeout(() => this.load(), delay);
|
|
80
|
+
}
|
|
81
|
+
}
|
|
34
82
|
}
|
|
35
83
|
catch (err) {
|
|
84
|
+
// A failed request is a different thing from an order with no tickets,
|
|
85
|
+
// and stops the polling: retrying a 403 a dozen times helps nobody.
|
|
86
|
+
this.stopPolling();
|
|
87
|
+
this.issuing = false;
|
|
36
88
|
this.error = err instanceof Error ? err.message : 'Failed to load tickets';
|
|
37
89
|
}
|
|
38
90
|
finally {
|
|
@@ -47,7 +99,7 @@ export class TlOrderTickets {
|
|
|
47
99
|
return h("div", { class: "state error" }, this.error);
|
|
48
100
|
}
|
|
49
101
|
if (this.tickets.length === 0) {
|
|
50
|
-
return h("div", { class: "state" }, "
|
|
102
|
+
return this.issuing ? (h("div", { class: "state issuing", role: "status", "aria-live": "polite" }, h("span", { class: "spinner", "aria-hidden": "true" }), "Preparing your tickets\u2026")) : (h("div", { class: "state", role: "status" }, "Your tickets are taking longer than usual. They will be emailed to you as soon as they are ready."));
|
|
51
103
|
}
|
|
52
104
|
return (h("div", { class: `grid cols-${this.columns}` }, this.tickets.map((t) => (h("tl-ticket", { key: t.id, ticket: t, orderId: this.orderId })))));
|
|
53
105
|
}
|
|
@@ -110,7 +162,8 @@ export class TlOrderTickets {
|
|
|
110
162
|
return {
|
|
111
163
|
"tickets": {},
|
|
112
164
|
"loading": {},
|
|
113
|
-
"error": {}
|
|
165
|
+
"error": {},
|
|
166
|
+
"issuing": {}
|
|
114
167
|
};
|
|
115
168
|
}
|
|
116
169
|
static get watchers() {
|
|
@@ -120,3 +173,11 @@ export class TlOrderTickets {
|
|
|
120
173
|
}];
|
|
121
174
|
}
|
|
122
175
|
}
|
|
176
|
+
/**
|
|
177
|
+
* Gaps between polls, in milliseconds. Front-loaded because issuance
|
|
178
|
+
* usually lands in the first few seconds, then widening so a genuinely
|
|
179
|
+
* stuck order is not hammered. Sums to roughly one minute.
|
|
180
|
+
*/
|
|
181
|
+
TlOrderTickets.POLL_DELAYS_MS = [
|
|
182
|
+
1000, 1500, 2000, 3000, 4000, 5000, 6000, 8000, 10000, 12000,
|
|
183
|
+
];
|