@chainrails/react 0.0.0 → 0.0.2

package/README.md

@@ -1,16 +1,62 @@
-# @chainrails/react (local package)
+# @chainrails/react
 
-This local React package exports components and automatically imports its styles.
+React components and hooks for integrating ChainRails payments and blockchain utilities into your app.
 
-Usage
+## Features
 
-- Import from the alias used in the docs: `@chainrails/react`.
-- The package's top-level `index.ts` imports `./PaymentModal/index.css`, so any consumer that imports from the package will automatically include the component styles.
+- **PaymentModal**: Drop-in modal for blockchain payments.
+- **usePaymentModal**: React hook for controlling the modal.
+- **Auto-included styles**: Importing the package automatically loads component CSS.
+- **ChainRails SDK access**: Re-exports ChainRails API and common utilities.
 
-Override styles
+## Installation
 
-- To override the default styles, include your own CSS with higher specificity or load your CSS after importing the package.
+```bash
+npm install @chainrails/react
+# or
+pnpm add @chainrails/react
+```
 
-Docs
+## Usage
 
-- The `docs` Vite config defines an alias `@chainrails/react` pointing to `react/src` and allows Vite to serve files from the monorepo, so the styles are bundled in dev and production builds.
+```tsx
+import { chains, tokens, PaymentModal, usePaymentModal, ChainRails } from "@chainrails/react"
+
+ChainRails.config({ api_key: <ENTER_API_KEY> })
+
+function App() {
+  const cr = usePaymentModal({
+    to: "0x4F41BCf288E718A36c1e6919c2Dfc2E07d51c675",
+    amount: 2,
+    chain: chains.BASE,
+    token: tokens.USDC,
+    onSuccess: () => {
+      console.log("Payment Successful")
+    },
+  })
+
+  return (
+    <div>
+      <button onClick={cr.open}> Pay </button>
+      <PaymentModal {...cr} />
+    </div>
+  )
+}
+```
+
+## Style Customization
+
+- Default styles are loaded automatically.
+- To override, add your own CSS with higher specificity or import your CSS after this package.
+
+## Aliases & Monorepo
+
+- The package is aliased as `@chainrails/react` in Vite config for local development.
+- Styles and components are bundled for both dev and production.
+
+## Exports
+
+- `PaymentModal` — React component for payments
+- `usePaymentModal` — Modal state management hook
+- `chains`, `tokens`, `ChainRails` — Blockchain utilities from `@chainrails/common`
+- `CRAPI` — ChainRails SDK API

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@chainrails/react",
   "sideEffects": false,
-  "version": "0.0.0",
+  "version": "0.0.2",
   "description": "",
   "license": "MIT",
   "repository": {