open-index/open-npm huggingface dataset:
npm package: @openpix/react
Description: OpenPix React Integration
Author: OpenPix
Latest version: 0.0.2

# OpenPix React SDK

OpenPix React SDK Using the [OpenPix](https://openpix.com.br/) Platform. [OpenPix Developers](https://developers.openpix.com.br/)

## How to install

```jsx
yarn install @openpix/react
```

## Setup Polyfills
This plugin uses core-js to polyfill Promises

Install core-js

```jsx
yarn install core-js
```

Add it to your App entrypoint

```jsx
import 'core-js/stable';
```

## Usage with React

```jsx
import { useState } from 'react';
import { useOpenPix } from '@openpix/react';
import QRCode from 'qrcode.react';

const App = () => {
  const [charge, setCharge] = useState(null);
  
  const onPay = (charge) => {
    // TODO do something
    console.log('charge was paid');
  }

  const { chargeCreate } = useOpenPix({
    appID: process.env.APP_ID,
    onPay,
  });

  const newCharge = async () => {
    const payload = {
      correlationID: 'myCorrelationID',
      value: 1, // one cent
      comment: 'Donate',
    }

    const { charge, error } = await chargeCreate(payload);

    if (error) {
      setError(error);
      return;
    }

    setCharge(charge);
  }

  if (charge) {
    return (
      <QRCode
        size={200}
        renderAs={'svg'}
        value={brCode}
        includeMargin={false}
      />
    );
  }

  return (
    <>
      <button onClick={newCharge}>
        Create New Charge
      </button>
    </>
  )
}
```

## Usage with React Native or Expo

```jsx
import { useState } from 'react';
import { useOpenPix } from '@openpix/react';
import QRCode from 'react-native-qrcode-svg';

const App = () => {
  const [charge, setCharge] = useState(null);
  
  const onPay = (charge) => {
    // TODO do something
    console.log('charge was paid');
  }

  const { chargeCreate } = useOpenPix({
    appID: process.env.APP_ID,
    onPay,
  });

  const newCharge = async () => {
    const payload = {
      correlationID: 'myCorrelationID',
      value: 1, // one cent
      comment: 'Donate',
    }

    const { charge, error } = await chargeCreate(payload);

    if (error) {
      setError(error);
      return;
    }

    setCharge(charge);
  }

  if (charge) {
    return (
      <QRCode
        size={200}
        value={brCode}
      />
    );
  }

  return (
    <>
      <button onClick={newCharge}>
        Create New Charge
      </button>
    </>
  )
}
```
npm package: @openpkg-ts/adapters
Description: Framework adapters for OpenPkg - Fumadocs, Docusaurus, Mintlify, etc.
Author: Ryan Waits
Latest version: 0.3.15
Deprecated: Deprecated: functionality moved to @doccov/cli

# @openpkg-ts/adapters

Framework adapters for OpenPkg API documentation.

## Adapter Registry

Self-registering adapter pattern for extensibility.

```typescript
import { registerAdapter, getAdapter, listAdapters } from '@openpkg-ts/adapters';

// List available adapters
const adapters = listAdapters();

// Get adapter by id
const fumadocs = getAdapter('fumadocs');
await fumadocs.generate(spec, './docs/api');
```

### Creating Custom Adapters

```typescript
import { registerAdapter, type DocAdapter } from '@openpkg-ts/adapters';

const myAdapter: DocAdapter = {
  id: 'my-adapter',
  name: 'My Adapter',
  generate: async (spec, outDir) => {
    // Generate docs to outDir
  },
};

registerAdapter(myAdapter);
```

### CLI Integration

```bash
# Use adapter via CLI
openpkg docs openpkg.json --adapter fumadocs -o docs/api/
```

## Fumadocs

```bash
npm install @openpkg-ts/adapters fumadocs-core
```

```ts
import { loader } from 'fumadocs-core/source';
import { openpkgSource, openpkgPlugin } from '@openpkg-ts/adapters/fumadocs';
import spec from './openpkg.json';

export const apiSource = loader({
  baseUrl: '/docs/api',
  source: openpkgSource({ spec }),
  plugins: [openpkgPlugin()],
});
```

Self-registers on import - no manual registration needed.

### CSS

```css
@import '@openpkg-ts/adapters/fumadocs/css';
```

### Components

```ts
import { SidebarKindBadge } from '@openpkg-ts/adapters/fumadocs/components';
```

### Options

| Option | Type | Default | Description |
|--------|------|---------|-------------|
| `spec` | `OpenPkg` | required | The OpenPkg spec |
| `baseDir` | `string` | `'api'` | Base directory |
| `mode` | `'pages' \| 'single'` | `'pages'` | Navigation mode |
| `indexPage` | `boolean` | `true` | Generate index page |

## Types

```typescript
import type { DocAdapter } from '@openpkg-ts/adapters';
```

## Future Adapters

- `@openpkg-ts/adapters/docusaurus` (planned)
- `@openpkg-ts/adapters/mintlify` (planned)

## License

MIT