open-index/open-npm huggingface dataset:
npm package: @micropaysdk/core
Description: Micropay - Mobile money micropayments for emerging markets
Author: Micropay Team
Latest version: 1.1.0

# @micropaysdk/core

The core JavaScript SDK for Micropay. Enable M-Pesa payments in your application with a few lines of code.

## Installation

```bash
npm install @micropaysdk/core
```

## Quick Start

```javascript
import { createMicropay } from '@micropaysdk/core';

const micropay = createMicropay({
  publicKey: 'pk_test_...',
});

const session = micropay.createSession({
  amount: 100,
  description: 'Coffee Payment',
  customerPhone: '254712345678'
});

session.on('success', (tx) => {
  console.log('Payment successful!', tx);
});
```

## API Usage

### Create a Payment Intent

```javascript
const intent = await micropay.createPaymentIntent({
  amount: 500,
  currency: 'KES',
  customer_phone: '254712345678',
  description: 'Order #123'
});
```

### Confirm Payment

```javascript
const confirmed = await micropay.confirmPaymentIntent(intent.id, {
  payment_method: 'mpesa',
  phone_number: '254712345678'
});
```

### Check Status

```javascript
const status = await micropay.getPaymentIntent(intent.id);
console.log(status.status); // 'succeeded' | 'processing' | 'failed'
```

## Features

- M-Pesa STK Push support
- Automatic status polling
- Webhook handling (via Micropay backend)
- Sandbox & Production environments
- TypeScript types included

## Configuration

| Option | Type | Description |
|--------|------|-------------|
| `publicKey` | string | Your Micropay publishable key |
| `environment` | 'sandbox' \| 'production' | API environment (default: 'sandbox') |

## License

MIT
npm package: @micropaysdk/react
Description: React components and hooks for Micropay mobile money payments
Author: Micropay Team
Latest version: 1.1.0

# @micropaysdk/react

React components and hooks for Micropay. The easiest way to accept M-Pesa in your React app.

## Installation

```bash
npm install @micropaysdk/react @micropaysdk/core
```

## Quick Start

```jsx
import { MicropayProvider, PaymentPopup, usePaymentPopup } from '@micropaysdk/react';
import '@micropaysdk/react/styles.css';

function App() {
  return (
    <MicropayProvider 
      publicKey="pk_test_..."
      theme="light"
    >
      <PaymentButton />
      <PaymentPopup />
    </MicropayProvider>
  );
}

function PaymentButton() {
  const { openPopup } = usePaymentPopup();

  return (
    <button onClick={() => openPopup({ 
      amount: 100, 
      description: 'Premium Coffee',
    })}>
      Pay with M-Pesa
    </button>
  );
}
```

## Components

### MicropayProvider

Wraps your app to provide Micropay context.

| Prop | Type | Required | Description |
|------|------|----------|-------------|
| `publicKey` | string | Yes | Your Micropay publishable key |
| `theme` | 'light' \| 'dark' | No | UI theme (default: 'light') |
| `environment` | 'sandbox' \| 'production' | No | API environment |

### PaymentPopup

Pre-built payment modal. Must be placed inside `MicropayProvider`.

### PaymentButton

Styled button component for triggering payments.

## Hooks

### usePaymentPopup()

Control the payment popup programmatically.

```jsx
const { openPopup, closePopup, isOpen } = usePaymentPopup();
```

### usePurchase()

Handle the full payment flow.

```jsx
const { purchase, isProcessing, error } = usePurchase();
```

### useMicropay()

Access the Micropay client directly.

```jsx
const { client, publicKey, environment } = useMicropay();
```

## Features

- **Bottom-sheet pattern** - Mobile-first design for a native feel
- **Step-by-step guidance** - Clear states for entering number, processing, and confirmation
- **Themeable** - Light and dark themes with CSS customization
- **Multi-region** - Built-in support for East African countries

## License

MIT