@intocal/react

Drop-in React components for embedding IntoCal — the open booking platform for freelancers, agencies, and developers.

npm install @intocal/react

Inline widget

import { InlineWidget } from "@intocal/react";

export default function ContactPage() {
  return <InlineWidget user="jane" eventType="intro-30" />;
}

Popup

import { PopupButton } from "@intocal/react";

<PopupButton user="jane" eventType="intro-30" className="btn-primary">
  Book a call
</PopupButton>;

Events

<InlineWidget
  user="jane"
  eventType="intro-30"
  prefill={{ name: "Acme", email: "[email protected]" }}
  onBookingCreated={(b) => console.log("booked", b.id)}
/>

Auto-resizes via postMessage. Works with Next.js (App + Pages router), Remix, Vite, CRA. Zero dependencies beyond React.

Server-side / API

For backend access (creating bookings, listing slots from a server) use @intocal/sdk — see the TypeScript SDK guide.

Documentation

• React components guide — props, prefill, events
• HTML embed (no React) — one-line script for any site
• REST API reference — OpenAPI 3.0 spec at intocal.com/api/openapi.json
• Webhooks — HMAC-signed booking events
• Pricing · IntoCal vs Calendly

MIT License.