mirror of
https://github.com/hanzo-apps/waitlist.git
synced 2026-10-30 14:48:32 +00:00
970e9d5ab3
Track the Base points engine on the wire: - client: add WaitlistClient.neighborhood() (the scalable rank +/- window "around me" view backed by keyset seeks) + NeighborhoodInput/NeighborRow/ NeighborhoodResponse; extend ActivityType with 'social' | 'hanzod' and PointBreakdown with optional social/hanzod subtotals. - mock-api (executable spec): add GET /neighborhood and the server-to-server POST /award (Bearer WAITLIST_AWARD_SECRET, source->points, deduped per (source,dedupKey)); add SOCIAL/HANZOD point values, social/hanzod breakdown categories, and social/hanzod activity types. The mock stays byte-for-byte with plugins/waitlist in hanzoai/base. Co-authored-by: Hanzo Dev <[email protected]>
@hanzo/waitlist
Monochromatic, brand-neutral viral waitlist widget. Backed by Hanzo Base.
import { Waitlist } from '@hanzo/waitlist'
import '@hanzo/waitlist/styles.css'
import MyLogo from './MyLogo' // your component, your SVG, your <img>
export default function Landing() {
return (
<Waitlist
waitlist="my-product"
baseUrl="https://api.example.com"
logo={<MyLogo />}
/>
)
}
The widget ships with no logo and no brand colors. Each consumer brings its own mark via the
logoprop (or<slot name="logo">in the custom element) and its own palette via CSS variables.
Drop-in (no bundler)
<link rel="stylesheet" href="https://cdn.example.com/@hanzo/waitlist/waitlist.css" />
<script src="https://cdn.example.com/@hanzo/waitlist/waitlist.iife.js"></script>
<hanzo-waitlist waitlist="my-product" base-url="https://api.example.com">
<!-- Bring your own logo. Either slot in markup: -->
<img slot="logo" src="/logo.svg" alt="My brand" />
<!-- ...or use the logo-url attribute instead:
<hanzo-waitlist ... logo-url="/logo.svg" logo-alt="My brand" />
-->
</hanzo-waitlist>
Theming
Override any CSS variable on .hanzo-waitlist (or any ancestor). The widget
ships fully neutral — no hardcoded brand colors, no logos, no embedded
identity. Each consumer sets its own tokens once:
.your-brand {
--hw-accent: <accent>; /* brand accent */
--hw-accent-fg: <text>; /* text color on accent */
--hw-radius: <radius>; /* corner radius */
}
Force a theme with theme="light" | "dark". Default theme="auto" follows
prefers-color-scheme.
Programmatic client (no React)
import { WaitlistClient } from '@hanzo/waitlist/client'
const c = new WaitlistClient({ baseUrl: 'https://api.example.com' })
const result = await c.join({ waitlist: 'my-product', email: '[email protected]' })
Server
The backend is the waitlist plugin for
Hanzo Base. Register it once at boot:
waitlist.MustRegister(app, waitlist.Config{
Enabled: true,
TurnstileSecret: os.Getenv("TURNSTILE_SECRET_KEY"),
AdminSecret: os.Getenv("WAITLIST_ADMIN_SECRET"),
})