@ticketlayer/elements 0.4.0 → 1.0.0

package/elements.catalogue.json

@@ -1,6 +1,6 @@
 {
-  "version": "0.4.0",
-  "generatedAt": "2026-09-18T13:41:58.636Z",
+  "version": "1.0.0",
+  "generatedAt": "2026-09-18T22:24:57.104Z",
   "elements": [
     {
       "tag": "tl-buy-modal",
@@ -51,7 +51,7 @@
     },
     {
       "tag": "tl-buy-tickets-button",
-      "docs": "",
+      "docs": "A buy-tickets button in one of four sale states, which opens the purchase modal.",
       "props": [
         {
           "name": "currency",
@@ -154,13 +154,43 @@
       "runtimes": [
         "web"
       ],
-      "sdkMethods": [],
+      "sdkMethods": [
+        "event.openModal"
+      ],
       "category": "purchase",
-      "core": false
+      "core": true,
+      "tokens": [
+        "error",
+        "error-foreground",
+        "font-family",
+        "info",
+        "info-foreground",
+        "primary",
+        "primary-foreground",
+        "radius-lg",
+        "radius-md",
+        "radius-sm",
+        "warning",
+        "warning-foreground"
+      ],
+      "strings": {
+        "available": "Buy Tickets",
+        "soldOut": "Sold Out",
+        "waitlist": "Join Waitlist",
+        "comingSoon": "On Sale Soon"
+      },
+      "statuses": [
+        "ready",
+        "disabled"
+      ],
+      "actions": [
+        "activate"
+      ],
+      "mounts": false
     },
     {
       "tag": "tl-buy-tickets-wrapper",
-      "docs": "",
+      "docs": "Wrap any content and open the purchase modal when it is activated.",
       "props": [
         {
           "name": "disabled",
@@ -189,17 +219,17 @@
       ],
       "events": [
         {
-          "name": "tl-close",
+          "name": "tlClose",
           "detail": "void",
           "docs": "Emitted when the modal closes"
         },
         {
-          "name": "tl-complete",
+          "name": "tlComplete",
           "detail": "OrderResult",
           "docs": "Emitted when purchase completes successfully"
         },
         {
-          "name": "tl-error",
+          "name": "tlError",
           "detail": "{ message: string; }",
           "docs": "Emitted when an error occurs"
         }
@@ -214,13 +244,31 @@
       "runtimes": [
         "web"
       ],
-      "sdkMethods": [],
+      "sdkMethods": [
+        "event.openModal"
+      ],
       "category": "purchase",
-      "core": false
+      "core": true,
+      "tokens": [
+        "radius-sm",
+        "ring"
+      ],
+      "strings": {
+        "noClient": "SDK not initialized",
+        "notAvailable": "Tickets are not available"
+      },
+      "statuses": [
+        "ready",
+        "disabled"
+      ],
+      "actions": [
+        "activate"
+      ],
+      "mounts": false
     },
     {
       "tag": "tl-cart",
-      "docs": "",
+      "docs": "The buyer's cart: its lines, the money rows the surface reported and a checkout button.",
       "props": [
         {
           "name": "checkoutLabel",
@@ -283,13 +331,60 @@
         "web",
         "native"
       ],
-      "sdkMethods": [],
+      "sdkMethods": [
+        "cart.get",
+        "cart.on",
+        "cart.removeItem"
+      ],
       "category": "cart",
-      "core": false
+      "core": true,
+      "tokens": [
+        "background",
+        "border",
+        "error",
+        "error-bg",
+        "font-family",
+        "foreground",
+        "muted",
+        "muted-foreground",
+        "primary",
+        "primary-foreground",
+        "radius-md",
+        "radius-sm",
+        "spacing-1",
+        "spacing-2",
+        "spacing-3",
+        "spacing-4",
+        "spacing-8"
+      ],
+      "strings": {
+        "emptyTitle": "Your cart is empty",
+        "emptyMessage": "Add tickets to get started",
+        "subtotalRow": "Subtotal",
+        "discountRow": "Discount",
+        "totalRow": "Total",
+        "removeItem": "Remove item",
+        "quantityPrefix": "Qty: ",
+        "loadFailed": "Failed to load cart",
+        "removeFailed": "Failed to remove item"
+      },
+      "statuses": [
+        "loading",
+        "empty",
+        "ready"
+      ],
+      "actions": [
+        "cartUpdated",
+        "checkout",
+        "connectFailed",
+        "load",
+        "removeItem"
+      ],
+      "mounts": true
     },
     {
       "tag": "tl-cart-badge",
-      "docs": "",
+      "docs": "A cart icon carrying the number of items in the cart, kept current from the cart bus.",
       "props": [
         {
           "name": "badgeOnly",
@@ -336,13 +431,41 @@
       "runtimes": [
         "web"
       ],
-      "sdkMethods": [],
+      "sdkMethods": [
+        "cart.get",
+        "cart.on"
+      ],
       "category": "cart",
-      "core": false
+      "core": true,
+      "tokens": [
+        "font-family",
+        "foreground",
+        "muted",
+        "primary",
+        "primary-foreground",
+        "radius-md",
+        "spacing-1",
+        "spacing-2",
+        "spacing-3"
+      ],
+      "strings": {
+        "ariaPrefix": "Cart with ",
+        "ariaSuffix": " items",
+        "overflow": "99+"
+      },
+      "statuses": [
+        "ready"
+      ],
+      "actions": [
+        "click",
+        "countChanged",
+        "hydrate"
+      ],
+      "mounts": true
     },
     {
       "tag": "tl-cart-drawer",
-      "docs": "",
+      "docs": "A slide-in panel holding the cart, opened by the cart intent on the client bus.",
       "props": [
         {
           "name": "heading",
@@ -386,13 +509,42 @@
       "runtimes": [
         "web"
       ],
-      "sdkMethods": [],
+      "sdkMethods": [
+        "client.on"
+      ],
       "category": "cart",
-      "core": false
+      "core": true,
+      "tokens": [
+        "background",
+        "border",
+        "font-family",
+        "foreground",
+        "muted",
+        "muted-foreground"
+      ],
+      "strings": {
+        "close": "Close cart",
+        "privacy": "Privacy Policy",
+        "privacyHref": "https://ticketlayer.com/privacy",
+        "reportAbuse": "Report Abuse",
+        "reportAbuseHref": "https://ticketlayer.com/report-abuse",
+        "poweredBy": "Powered by",
+        "brand": "ticketlayer",
+        "brandHref": "https://ticketlayer.com"
+      },
+      "statuses": [
+        "open",
+        "closed"
+      ],
+      "actions": [
+        "openChanged",
+        "setOpen"
+      ],
+      "mounts": true
     },
     {
       "tag": "tl-checkout-wrapper",
-      "docs": "",
+      "docs": "Wrap any content and open the checkout modal when it is activated.",
       "props": [
         {
           "name": "disabled",
@@ -405,17 +557,17 @@
       ],
       "events": [
         {
-          "name": "tl-close",
+          "name": "tlClose",
           "detail": "void",
           "docs": "Emitted when the modal closes"
         },
         {
-          "name": "tl-complete",
+          "name": "tlComplete",
           "detail": "OrderResult",
           "docs": "Emitted when checkout completes successfully"
         },
         {
-          "name": "tl-error",
+          "name": "tlError",
           "detail": "{ message: string; }",
           "docs": "Emitted when an error occurs"
         }
@@ -430,13 +582,31 @@
       "runtimes": [
         "web"
       ],
-      "sdkMethods": [],
+      "sdkMethods": [
+        "checkout.openModal"
+      ],
       "category": "checkout",
-      "core": false
+      "core": true,
+      "tokens": [
+        "radius-sm",
+        "ring"
+      ],
+      "strings": {
+        "noClient": "SDK not initialized",
+        "notAvailable": "Checkout is not available"
+      },
+      "statuses": [
+        "ready",
+        "disabled"
+      ],
+      "actions": [
+        "activate"
+      ],
+      "mounts": false
     },
     {
       "tag": "tl-event-card",
-      "docs": "",
+      "docs": "One event as a card: its image, name, next date, venue and how it is selling.",
       "props": [
         {
           "name": "event",
@@ -473,13 +643,51 @@
         "web",
         "native"
       ],
-      "sdkMethods": [],
+      "sdkMethods": [
+        "events.get"
+      ],
       "category": "discovery",
-      "core": false
+      "core": true,
+      "tokens": [
+        "error",
+        "error-foreground",
+        "font-family",
+        "foreground",
+        "muted",
+        "muted-foreground",
+        "primary",
+        "radius-lg",
+        "radius-sm",
+        "secondary",
+        "spacing-4",
+        "success",
+        "success-foreground",
+        "warning",
+        "warning-foreground"
+      ],
+      "strings": {
+        "available": "Available",
+        "limited": "Limited",
+        "soldOut": "Sold Out",
+        "notFound": "Event not found",
+        "loadFailed": "Failed to load event"
+      },
+      "statuses": [
+        "loading",
+        "error",
+        "empty",
+        "ready"
+      ],
+      "actions": [
+        "click",
+        "load",
+        "loadFailed"
+      ],
+      "mounts": true
     },
     {
       "tag": "tl-event-list",
-      "docs": "",
+      "docs": "What the channel is selling, as a grid of event cards, optionally narrowed to one category.",
       "props": [
         {
           "name": "category",
@@ -519,13 +727,45 @@
         "web",
         "native"
       ],
-      "sdkMethods": [],
+      "sdkMethods": [
+        "events.list"
+      ],
       "category": "discovery",
-      "core": false
+      "core": true,
+      "tokens": [
+        "error",
+        "font-family",
+        "foreground",
+        "muted",
+        "muted-foreground",
+        "radius-lg",
+        "radius-sm",
+        "secondary",
+        "spacing-4",
+        "spacing-6",
+        "spacing-8"
+      ],
+      "strings": {
+        "errorTitle": "Error loading events",
+        "emptyTitle": "No events available",
+        "emptyMessage": "Check back later for upcoming events.",
+        "loadFailed": "Failed to load events",
+        "noListing": "Events are not available"
+      },
+      "statuses": [
+        "loading",
+        "error",
+        "empty",
+        "ready"
+      ],
+      "actions": [
+        "load"
+      ],
+      "mounts": true
     },
     {
       "tag": "tl-login",
-      "docs": "tl-login - magic-link sign-in. The customer enters an email, we ask the SDK\nto send a link (POST /sales/customer-auth/magic-link), then either the link\nlands back on this page with `?code=` or the customer types the code from\nthe email; both exchange through the SDK (POST /sales/customer-tokens). No\npassword is ever handled here.\n\nStates: enter email -> check your inbox (resend, enter code) -> signed in\n(email + sign out).\n\nUsage: <tl-login></tl-login>",
+      "docs": "Magic-link sign-in: an email in, a link or a six-digit code back, and a session. No password is ever handled.",
       "props": [
         {
           "name": "allowCodeEntry",
@@ -567,13 +807,90 @@
         "web",
         "native"
       ],
-      "sdkMethods": [],
+      "sdkMethods": [
+        "auth.exchange",
+        "auth.logout",
+        "auth.requestMagicLink",
+        "on"
+      ],
       "category": "account",
-      "core": false
+      "core": true,
+      "tokens": [
+        "background",
+        "border",
+        "error",
+        "font-family",
+        "font-family-mono",
+        "foreground",
+        "muted-foreground",
+        "primary",
+        "primary-foreground",
+        "radius-lg",
+        "radius-md",
+        "secondary",
+        "spacing-3",
+        "spacing-4",
+        "spacing-6",
+        "success"
+      ],
+      "strings": {
+        "signedInPrefix": "Signed in as ",
+        "fallbackAccount": "your account",
+        "signOut": "Sign out",
+        "verifyingTitle": "Signing you in…",
+        "verifyingLead": "Just a moment.",
+        "sentTitle": "Check your inbox",
+        "sentLeadBefore": "We've sent a sign-in link to ",
+        "sentLeadAfter": ". Open it on this device to continue.",
+        "sentAgain": "Sent again. Check your inbox.",
+        "resendLink": "Resend link",
+        "resending": "Sending…",
+        "enterCodeInstead": "Enter the code instead",
+        "differentEmail": "Use a different email",
+        "codeTitle": "Enter your code",
+        "codeLeadBefore": "Type the 6-digit code from the email we sent to ",
+        "codeLeadAfter": ".",
+        "codeLabel": "Code",
+        "codePlaceholder": "123456",
+        "codeSubmit": "Sign in",
+        "checking": "Checking…",
+        "back": "Back",
+        "emailLead": "Enter your email and we'll send you a secure sign-in link. No password needed.",
+        "emailLabel": "Email address",
+        "emailPlaceholder": "you@example.com",
+        "emailSubmit": "Email me a sign-in link",
+        "sendingLink": "Sending link…",
+        "enterEmail": "Enter your email address",
+        "enterCode": "Enter the code from your email",
+        "codeRejected": "That code did not work. Check it and try again, or request a new link.",
+        "requestFailed": "Could not send your sign-in link",
+        "unavailable": "Sign-in is not available right now",
+        "unsupported": "Sign-in is not available with this SDK"
+      },
+      "statuses": [
+        "email",
+        "sent",
+        "code",
+        "verifying",
+        "signed-in"
+      ],
+      "actions": [
+        "connectFailed",
+        "exchange",
+        "goTo",
+        "requestLink",
+        "setCode",
+        "setEmail",
+        "signOut",
+        "submitCode",
+        "syncFromClient",
+        "unsupported"
+      ],
+      "mounts": true
     },
     {
       "tag": "tl-my-orders",
-      "docs": "tl-my-orders - the signed-in customer's orders (GET /sales/my-orders through\nthe SDK): event, date, ticket count, total and status per row. Clicking a\nrow expands it to show the order's tickets (tl-order-tickets). Shows\ntl-login inline when nobody is signed in.\n\nUsage: <tl-my-orders></tl-my-orders>",
+      "docs": "The signed-in customer's orders: event, date, ticket count, total and status, each row expanding to its tickets.",
       "props": [
         {
           "name": "columns",
@@ -610,9 +927,62 @@
         "web",
         "native"
       ],
-      "sdkMethods": [],
+      "sdkMethods": [
+        "auth.authenticated",
+        "on",
+        "orders.mine"
+      ],
       "category": "account",
-      "core": false
+      "core": true,
+      "tokens": [
+        "background",
+        "border",
+        "error",
+        "error-foreground",
+        "font-family",
+        "foreground",
+        "muted-foreground",
+        "primary",
+        "primary-foreground",
+        "radius-lg",
+        "secondary",
+        "secondary-foreground",
+        "spacing-1",
+        "spacing-3",
+        "spacing-4",
+        "spacing-8",
+        "success",
+        "success-foreground",
+        "warning",
+        "warning-foreground"
+      ],
+      "strings": {
+        "signInTitle": "Sign in to see your orders",
+        "signInText": "Your tickets and order history live in your account.",
+        "errorTitle": "Could not load your orders",
+        "emptyTitle": "No orders yet",
+        "orderPrefix": "Order ",
+        "unnamedEvent": "Order",
+        "ticketSingular": "ticket",
+        "ticketPlural": "tickets",
+        "unavailable": "Orders are not available right now",
+        "noOrdersManager": "Orders are not available",
+        "loadFailed": "Failed to load your orders"
+      },
+      "statuses": [
+        "loading",
+        "signed-out",
+        "error",
+        "empty",
+        "ready"
+      ],
+      "actions": [
+        "connectFailed",
+        "load",
+        "syncAuth",
+        "toggle"
+      ],
+      "mounts": true
     },
     {
       "tag": "tl-occurrence-selector",
@@ -663,13 +1033,62 @@
       "runtimes": [
         "web"
       ],
-      "sdkMethods": [],
+      "sdkMethods": [
+        "events.get"
+      ],
       "category": "discovery",
-      "core": false
+      "core": true,
+      "tokens": [
+        "background",
+        "border",
+        "font-family",
+        "foreground",
+        "muted",
+        "muted-foreground",
+        "primary",
+        "primary-foreground",
+        "radius-md"
+      ],
+      "strings": {
+        "noEventId": "Event ID is required",
+        "noClient": "SDK not initialized.",
+        "notFound": "Event not found",
+        "loadFailed": "Failed to load occurrences",
+        "empty": "No dates available for this event.",
+        "retry": "Retry",
+        "soldOut": "Sold Out",
+        "available": "available",
+        "selectADate": "Select a date to see available times",
+        "previousMonth": "Previous month",
+        "nextMonth": "Next month",
+        "weekdayMon": "Mon",
+        "weekdayTue": "Tue",
+        "weekdayWed": "Wed",
+        "weekdayThu": "Thu",
+        "weekdayFri": "Fri",
+        "weekdaySat": "Sat",
+        "weekdaySun": "Sun"
+      },
+      "statuses": [
+        "loading",
+        "error",
+        "empty",
+        "ready"
+      ],
+      "actions": [
+        "load",
+        "loadFailed",
+        "nextMonth",
+        "previousMonth",
+        "resized",
+        "select",
+        "selectDate"
+      ],
+      "mounts": true
     },
     {
       "tag": "tl-order-confirmation",
-      "docs": "tl-order-confirmation - the \"thank you\" page block: order reference,\ncustomer email, event and date, ticket lines, totals, then the tickets\nthemselves (tl-order-tickets, each with a Download PDF link).\n\nFinds its order three ways, in priority order:\n 1. the `order-id` prop\n 2. the URL (`?orderId=`), the contract the hosted box office confirmation\n    page uses; `?redirect_status=` from a Stripe return is honoured too\n 3. the SDK's `checkout:completed` event, for a page that mounts this before\n    the customer pays\n\nUsage: <tl-order-confirmation order-id=\"ord_xxx\"></tl-order-confirmation>",
+      "docs": "The thank-you block: order reference, email, event and date, the ticket lines, the money rows and the tickets.",
       "props": [
         {
           "name": "columns",
@@ -722,13 +1141,72 @@
         "web",
         "native"
       ],
-      "sdkMethods": [],
+      "sdkMethods": [
+        "auth.customer",
+        "events.get",
+        "events.list",
+        "on",
+        "orders.get"
+      ],
       "category": "checkout",
-      "core": false
+      "core": true,
+      "tokens": [
+        "border",
+        "error",
+        "font-family",
+        "font-family-mono",
+        "foreground",
+        "muted",
+        "muted-foreground",
+        "radius-lg",
+        "radius-md",
+        "secondary",
+        "spacing-1",
+        "spacing-2",
+        "spacing-3",
+        "spacing-4",
+        "spacing-6",
+        "success",
+        "success-foreground"
+      ],
+      "strings": {
+        "paymentFailedTitle": "Payment not completed",
+        "paymentFailedLead": "Your payment wasn't completed. Your cart is still saved, so you can try again.",
+        "title": "You're going!",
+        "leadPrefix": "Order ",
+        "leadSuffix": " is confirmed. Your tickets are on their way to your email.",
+        "leadGeneric": "Your order is confirmed. Your tickets are on their way to your email.",
+        "errorPrefix": "We couldn't load your order details yet. ",
+        "rowReference": "Order reference",
+        "rowEmail": "Email",
+        "rowEvent": "Event",
+        "rowDate": "Date",
+        "subtotalRow": "Subtotal",
+        "taxRow": "Tax",
+        "discountRow": "Discount",
+        "totalRow": "Total",
+        "ticketsTitle": "Your tickets",
+        "ticketsHint": "Show these QR codes at the door for entry. Use Download PDF on a ticket to save it.",
+        "noOrdersManager": "Orders are not available",
+        "notFound": "Order not found",
+        "loadFailed": "Failed to load your order"
+      },
+      "statuses": [
+        "payment-failed",
+        "idle",
+        "loading",
+        "ready"
+      ],
+      "actions": [
+        "checkoutCompleted",
+        "load",
+        "orderIdChanged"
+      ],
+      "mounts": true
     },
     {
       "tag": "tl-order-tickets",
-      "docs": "tl-order-tickets - renders all the tickets for an order as scannable QR\ncards with PDF download. Fetches the order through the SDK (order-access\ngated by the session), so it works on a confirmation page or in an account.\n\nUsage: <tl-order-tickets order-id=\"ord_xxx\"></tl-order-tickets>\n\nOn an empty result it waits rather than concluding there is nothing.\n\nTickets are issued asynchronously: the payment confirms, the order is\nmarked paid, and entitlement issuance follows a moment later. A confirmation\npage therefore renders BEFORE the passes exist - reliably, not occasionally.\nThe component used to answer that with \"No tickets for this order yet\",\nwhich is true and reads as \"something went wrong\" to someone who has just\nbeen charged. Refreshing showed them, so the only thing missing was the\nwaiting.\n\nSo: an empty order is treated as issuance in flight and polled, with the\ngaps widening, for about a minute. Then it stops and says the tickets are\ncoming by email, because at that point something probably is wrong and a\npage that polls forever is worse than one that admits it.",
+      "docs": "Every ticket in an order as a scannable card, waiting out issuance rather than reporting an empty order as empty.",
       "props": [
         {
           "name": "columns",
@@ -754,13 +1232,45 @@
         "web",
         "native"
       ],
-      "sdkMethods": [],
+      "sdkMethods": [
+        "orders.get"
+      ],
       "category": "tickets",
-      "core": false
+      "core": true,
+      "tokens": [
+        "border",
+        "error",
+        "font-family",
+        "muted-foreground",
+        "primary",
+        "spacing-2",
+        "spacing-4",
+        "spacing-6"
+      ],
+      "strings": {
+        "loading": "Loading tickets…",
+        "preparing": "Preparing your tickets…",
+        "delayed": "Your tickets are taking longer than usual. They will be emailed to you as soon as they are ready.",
+        "notAvailable": "Tickets are not available",
+        "loadFailed": "Failed to load tickets"
+      },
+      "statuses": [
+        "loading",
+        "error",
+        "issuing",
+        "delayed",
+        "ready"
+      ],
+      "actions": [
+        "load",
+        "orderIdChanged",
+        "stopPolling"
+      ],
+      "mounts": true
     },
     {
       "tag": "tl-promo-code",
-      "docs": "tl-promo-code - an input plus Apply button that redeems a presale or promo\ncode for the current cart (POST /sales/presale-codes/redeem through the\nSDK). Redemption unlocks gated pricing on the customer; the SDK re-reads the\ncart and publishes cart:updated, so tl-cart and badges re-render on their own.\n\nThe API has no un-redeem, so the applied state offers only \"use a different\ncode\", which clears the input for another redemption.\n\nUsage: <tl-promo-code></tl-promo-code>",
+      "docs": "Redeem a presale or promo code for the current cart.",
       "props": [
         {
           "name": "buttonLabel",
@@ -796,9 +1306,50 @@
       "runtimes": [
         "web"
       ],
-      "sdkMethods": [],
+      "sdkMethods": [
+        "cart.get",
+        "presale.redeem"
+      ],
       "category": "purchase",
-      "core": false
+      "core": true,
+      "tokens": [
+        "background",
+        "border",
+        "error",
+        "font-family",
+        "font-family-mono",
+        "foreground",
+        "muted",
+        "muted-foreground",
+        "primary",
+        "primary-foreground",
+        "radius-md",
+        "spacing-2",
+        "spacing-3",
+        "spacing-4",
+        "success"
+      ],
+      "strings": {
+        "applying": "Applying…",
+        "codePrefix": "Code ",
+        "appliedSuffix": " applied",
+        "alreadyHeldSuffix": " was already applied",
+        "useDifferent": "Use a different code",
+        "enterCode": "Enter a code",
+        "notAvailable": "Promo codes are not available",
+        "signIn": "Sign in to use this code",
+        "rejected": "That code could not be applied"
+      },
+      "statuses": [
+        "idle",
+        "applied"
+      ],
+      "actions": [
+        "apply",
+        "reset",
+        "setCode"
+      ],
+      "mounts": false
     },
     {
       "tag": "tl-seat-map",
@@ -1031,7 +1582,8 @@
         "connectFailed",
         "load",
         "setFeeQuote"
-      ]
+      ],
+      "mounts": true
     }
   ]
 }