# Repejo > Repejo is a donation and recurring-payment platform for non-profits. This file > points AI coding agents (e.g. Lovable, Cursor) to Repejo's machine-readable API > specs and integration docs. The HTTP API is described with OpenAPI 3.1, which is > the source of truth — point your tooling at the OpenAPI URL below. ## API - [OpenAPI 3.1 spec (JSON)](https://app.repejo.se/api/v1/openapi): authoritative machine-readable API contract (operations, schemas, enums, errors). - [Swagger UI](https://app.repejo.se/api/v1/swagger): interactive API explorer. ## Payment Sessions (Pay by Link) - [Payment Sessions — Markdown](https://app.repejo.se/docs/api-payment-sessions.md): full reference in agent-friendly Markdown — auth, request/response, enums, errors, redirect & embedded modes (the `` element: attribute/property binding, styling, and TypeScript/React types at https://app.repejo.se/assets/repejo-checkout.d.ts), and webhooks. - [Payment Sessions — docs page](https://app.repejo.se/docs/api-payment-sessions): the same reference, human-formatted. ## Webhooks - [Webhooks — Markdown](https://app.repejo.se/docs/api-webhooks.md): event types, payload shape, HMAC-SHA256 signing, and retry/idempotency contract in agent-friendly Markdown. - [Webhooks reference](https://app.repejo.se/docs/api-webhooks): the same reference, human-formatted. ## Analytics (GTM / GA4) - [GTM dataLayer — Markdown](https://app.repejo.se/docs/gtm-datalayer.md): every dataLayer event the checkout pushes — GA4 funnel events, the server-built `purchase`, and the `repejo_click` element-interaction event with its click_classes/click_id vocabulary — in agent-friendly Markdown. - [GTM dataLayer — docs page](https://app.repejo.se/docs/gtm-events): the same reference, human-formatted. ## Embeddable elements - [Web Component docs](https://app.repejo.se/docs/web-component): every custom element Repejo ships, including `` — a live stream overlay for OBS/Twitch that pops a card per new donation (attributes `short-code`, `host`, `duration`, `locale`; three styling shortcuts `background-color`, `text-color` and `show-icon` (boolean; gift for one-time, heart for recurring), plus finer control via `--donation-card-background` / `-color` / `-font` / `-font-size` CSS custom properties) — ``, a standalone fundraising-goal progress bar with per-sub-goal tick marks and the raised/percent row below the bar (attributes `short-code`, `host`, `locale`, optional `team-id` — a fundraising team's `ftm_…` id; the bar then tracks that team's raised + goal instead of the checkout aggregate, falls back to the checkout goal when the team has none of its own, hides the sub-goal ticks in team mode and does not apply the stretch-goal ladder (checkout-level concepts — wrong denominator), and silently shows the checkout aggregate for an id that matches no team; two styling shortcuts `primary-color` and `border-radius`, plus finer control via `--donation-goal-background` / `-color` / `-font` / `-font-size` / `-bar-color` / `-bar-background` / `-bar-height` / `-tick-color` / `-tick-width` / `-padding` / `-border-radius` CSS custom properties; no built-in heading — introduce it yourself) — ``, a standalone live leaderboard with a `mode` picker of three flavours (`teams`, `onetime` (default), or `recurring`) that ranks by amount raised / one-time donation amount / monthly signup amount, with a `limit` attribute clamped 1..10 (default 5), two styling shortcuts `background-color` / `text-color`, and finer control via `--repejo-leaderboard-*` CSS custom properties — and two matching-donation widgets (`` and ``) that show an active sponsor-matching campaign — logo + company name + matched cap + progressbar — filling as new one-time donations land. Both accept `short-code`, `host`, `locale` plus three styling shortcuts `background-color`, `text-color`, `progress-color` (CSS custom properties `--repejo-matching-donation-background` / `-color` / `-progress-color` / `-border-radius` / `-font`); both render nothing when nothing is active. Only one matching can be active per checkout at a time; activate/deactivate from the checkout's Live tab in the back office. The matched amount also counts toward the fundraising goal: `goal_raised` (read by the checkout's own progress bar and ``) moves by the gift plus the sponsor's match up to the cap, and keeps what deactivated matchings collected, while `total_raised` stays donor money only. Plus `` — a compact single-donation highlight card that shows the biggest one-time gift on the checkout (title + big amount + donor name). Reads `top_onetime_donations[0]` from the checkout state so it stays in sync with the leaderboard automatically; renders nothing when the checkout has no donations. Accepts `short-code`, `host`, `locale`, plus three styling shortcuts `background-color`, `text-color`, `accent-color` (the big amount) — CSS custom properties `--repejo-top-donation-background` / `-color` / `-accent-color` / `-border-radius` / `-font`. Plus `` — a rolling list of the three most recent donations (newest at the bottom, oldest sliding off the top with a CSS enter-animation as new ones arrive). Reads `latest_donations`; renders nothing until at least one donation exists. Same donor-name policy as ``. Accepts `short-code`, `host`, `locale`, `show-icon` (boolean; gift for one-time, heart for recurring), plus three styling shortcuts `background-color`, `text-color`, `accent-color` (icon + amount) — CSS custom properties `--repejo-donation-list-background` / `-color` / `-accent-color` / `-border-radius` / `-font`. Plus `` — a full-width news-ticker bar of recent donations that scrolls right-to-left continuously, with a dot separator between entries. Reads `latest_donations`; renders nothing until at least one donation exists. Edge-to-edge (`width: 100%`); the streamer places it wherever they want on the page. Hover to pause the strip; honors `prefers-reduced-motion` (freezes instead of animating). Accepts `short-code`, `host`, `locale`, `duration` (seconds per traversal, default 40, clamped 5+), plus three styling shortcuts `background-color`, `text-color`, `accent-color` (amount + dot) — CSS custom properties `--repejo-donation-ticker-background` / `-color` / `-accent-color` / `-font`. Plus `` — a per-checkout mini-shop grid of preset gift products (name + amount + optional image + description + one-time-or-monthly period). Clicking a product opens `` in a modal with `live-product-id` set, which pins a summary card of the picked product above the normal checkout body. Products are created per checkout via the Live tab's Produkter panel and never surface in the global /settings/products list. Accepts `short-code`, `host`, `locale`, plus three styling shortcuts `background-color`, `text-color`, `accent-color` (amount + CTA button) — CSS custom properties `--repejo-live-products-background` / `-color` / `-accent-color` / `-font`. `` gained a new `live-product-id` attribute (additive; unset means the checkout renders unchanged). All widgets accept an optional `preview` boolean for a socket-free static demo; donation-card also accepts `preview-type` (`onetime`/`recurring`) and leaderboard accepts `preview-type` (`teams`/`onetime`/`recurring`) to preview any variant. TypeScript types for the elements: https://app.repejo.se/assets/repejo-checkout.d.ts - `` — a checkout's fundraising progress as a standalone element. Attributes: `short-code` (the checkout's short code, required), `host` (set it to https://app.repejo.se), optional `locale` (sv/en/de/fi, defaults to the checkout's own locale). It fetches the checkout's config, adopts its branding, and live-updates over a websocket as donations complete: a money checkout shows the collected amount against its goal (or the revealed stretch-goal ladder), a petition checkout shows the live signature count against its signature goal. Self-styling (shadow DOM + the checkout stylesheet) — override the fill colour with a CSS rule or inline style targeting the element itself (`repejo-progress-bar { --color-primary: ... }`); a value merely inherited from an ancestor is overridden by the checkout's own branding. Load https://app.repejo.se/assets/checkout.js on the page first. ## Docs - [Documentation home](https://app.repejo.se/docs): all integration guides.