sodexo-transactions-template
The sodexo-transactions-template component displays all transactions for a specific badge.
Properties
| Property | HTML Attribute | Type | Default | Description |
|---|---|---|---|---|
badgeId | badge-id | string | - | Badge identifier to display transactions for |
Events
| Event | Type | Description |
|---|---|---|
downloadFile | CustomEvent<DownloadFileData> | Emitted when user wants to download a receipt. Provides base64 data for native mobile apps. Note: Listen on window object, not the component |
Event Details
DownloadFileData
interface DownloadFileData {
data: string; // Base64 encoded file data (data URI format)
fileName: string; // Suggested filename (e.g., "receipt-12345.pdf")
mimeType: string; // MIME type: "application/pdf"
}
Web Applications
No implementation required. The component handles PDF downloads automatically using standard browser APIs.
Mobile Apps Only
The downloadFile event is specifically designed for native mobile applications (Android/iOS) where WebViews don't support file downloads natively.
For native app implementation details, see File Download Handling.
Usage
- HTML (Web)
<!DOCTYPE html>
<html>
<body>
<sodexo-transactions-template
badge-id="badge-123"
></sodexo-transactions-template>
</body>
</html>
Property Naming Convention
Naming Syntax
When using properties:
- In HTML: Use kebab-case (e.g.,
api-key,badge-id) - In JavaScript: Use camelCase (e.g.,
apiKey,badgeId) - Events: Can only be handled in JavaScript, not in HTML attributes