​
Install

Install React Chron and the Chron.js loader from npm public registry using your favourite package manager.

npm install @chron/react

​
Environment Variables

Add your publishable key to your environment variables.

CHRON_API_KEY=YOUR_CHRON_API_KEY

​
Configure

Configuration should happen as early as possible in your application’s lifecycle.

import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App.tsx'
import './index.css'
import { ChronProvider } from '@chron/react'

// Import your publishable key
const CHRON_API_KEY = import.meta.env.CHRON_API_KEY

if (!CHRON_API_KEY) {
  throw new Error("Missing Publishable Key")
}

ReactDOM.createRoot(document.getElementById('root')!).render(
  <React.StrictMode>
    <ChronProvider publishableKey={CHRON_API_KEY}>
      <App />
    </ChronProvider>
  </React.StrictMode>,
)