This feature is currently in beta. Documentation for Version 1 templates is here
Vue State & Methods — The reactive ch object and available template methods.
See also: Template Markup & Structure | Styling & CSS Variables
State Objects
Primary State: ch
| Property | Type | Description |
|---|
ch.isLoaded | boolean | true when initial data is loaded |
ch.isActive | boolean | true when user is in active queue |
ch.isCountdown | boolean | true when queue hasn't opened yet |
ch.isBlocked | boolean | true when user is blocked |
ch.isRoomFull | boolean | true when queue is at capacity |
ch.isError | boolean | true when an error occurred |
ch.captchaRequired | boolean | true when captcha must be completed |
ch.position | number | null | Current queue position (1-based). null when checking in |
ch.estimate | number | null | Estimated wait in minutes |
ch.eta | string | null | Estimated time of arrival (formatted time string) |
ch.title | string | Event/room title |
ch.message | string | Custom message from room config |
ch.logo | string | URL to logo image |
ch.stock | number | null | Available stock (if configured) |
ch.onsale | string | ISO date when queue opens |
ch.requested | string | Timestamp of last API request |
ch.sessionsExpire | number | Whether sessions expire (non-zero = true) |
ch.sessionsTimeout | number | Minutes until session timeout |
ch.emailAvailable | number | Whether email notifications enabled (non-zero = true) |
ch.announcement | string | Screen reader announcement text |
ch.progress | number | Progress bar percentage (0–100) |
ch.nextPoll | number | Seconds since last poll |
ch.pollTTL | number | Current poll interval in seconds (default 60, variable) |
ch.css.title | string | Dynamic title size class ("", "ch-title-lg", or "ch-title-xl") |
Token State: ch.token
| Property | Type | Description |
|---|
ch.token.value | string | null | Full token value |
ch.token.obfuscated | string | null | Partially hidden token for display |
ch.token.copied | boolean | true momentarily after user copies token |
ch.token.copy(event, ch) | function | Copy token to clipboard |
Email State: ch.email
| Property | Type | Description |
|---|
ch.email.value | string | Entered email address |
ch.email.valid | boolean | Whether email format is valid |
ch.email.submitted | boolean | Whether email was successfully submitted |
ch.email.submitting | boolean | true during submission |
ch.email.changing | boolean | true when user is changing a previously submitted email |
Priority Code State: ch.priority
| Property | Type | Description |
|---|
ch.priority.available | number | null | Whether priority codes enabled (non-zero = true) |
ch.priority.code | string | null | Entered priority code |
ch.priority.valid | boolean | null | Whether code format is valid |
ch.priority.submitted | boolean | Whether code was submitted |
ch.priority.submitting | boolean | true during submission |
ch.priority.success | boolean | true if code was accepted |
ch.priority.error | boolean | true if code was rejected |
Countdown State: ch.countdown
Available when ch.isCountdown is true.
| Property | Type | Description |
|---|
ch.countdown.sHours | string | Hours, zero-padded ("02") or "--" before init |
ch.countdown.sMinutes | string | Minutes, zero-padded ("05") or "--" before init |
ch.countdown.sSeconds | string | Seconds, zero-padded ("30") or "--" before init |
ch.countdown.hours | number | Hours as number |
ch.countdown.minutes | number | Minutes as number |
ch.countdown.seconds | number | Seconds as number |
ch.countdown.totalseconds | number | Total seconds remaining |
Available Methods
formatDate Options
formatDate(ch.requested, 'toLocaleString') // "1/27/2026, 2:30:00 PM"
formatDate(ch.requested, 'toLocaleDateString') // "1/27/2026"
formatDate(ch.requested, 'toLocaleTimeString') // "2:30:00 PM"
formatDate(ch.requested, 'dayMonth') // "27 January"
formatDate(ch.requested, 'weekdayMonthDay') // "Tuesday, Jan 27"
formatDate(ch.requested, 'iso') // "2026-01-27T14:30:00.000Z"
formatDate(ch.requested, 'YYYY-MM-dd HH:mm:ss') // "2026-01-27 14:30:00"