open-index/open-npm huggingface dataset:
npm package: @growae/create-reactive
Description: <h1 align="center">@growae/create-reactive</h1>
Latest version: 0.0.5

<h1 align="center">@growae/create-reactive</h1>

<p align="center">
  Scaffold a new Aeternity dApp project
</p>

<p align="center">
  <a href="https://www.npmjs.com/package/@growae/create-reactive"><img src="https://img.shields.io/npm/v/@growae/create-reactive?colorA=21262d&colorB=3b82f6&style=flat" alt="Version"></a>
  <a href="https://www.npmjs.com/package/@growae/create-reactive"><img src="https://img.shields.io/npm/dm/@growae/create-reactive?colorA=21262d&colorB=3b82f6&style=flat" alt="Downloads"></a>
  <a href="https://github.com/growae/reactive/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/@growae/create-reactive?colorA=21262d&colorB=3b82f6&style=flat" alt="MIT License"></a>
</p>

<br>

## Overview

Interactive project scaffolder for `@growae/reactive`. Creates a ready-to-run Aeternity dApp with your choice of framework and tooling.

## Usage

```bash
# npm
npm create @growae/reactive

# yarn
yarn create @growae/reactive

# pnpm
pnpm create @growae/reactive
```

## Templates

| Template | Description |
|---|---|
| `vite-react` | React + Vite |
| `vite-vue` | Vue + Vite |
| `vite-solid` | Solid.js + Vite |
| `vite-vanilla` | Vanilla TypeScript + Vite |
| `next` | Next.js |
| `nuxt` | Nuxt |

## Documentation

Visit [reactive.growae.io](https://reactive.growae.io) for the full documentation.

## License

[MIT](https://github.com/growae/reactive/blob/main/LICENSE)
npm package: @growae/reactive-connectors
Description: <h1 align="center">@growae/reactive-connectors</h1>
Latest version: 0.0.5

<h1 align="center">@growae/reactive-connectors</h1>

<p align="center">
  Wallet connectors for Aeternity
</p>

<p align="center">
  <a href="https://www.npmjs.com/package/@growae/reactive-connectors"><img src="https://img.shields.io/npm/v/@growae/reactive-connectors?colorA=21262d&colorB=3b82f6&style=flat" alt="Version"></a>
  <a href="https://www.npmjs.com/package/@growae/reactive-connectors"><img src="https://img.shields.io/npm/dm/@growae/reactive-connectors?colorA=21262d&colorB=3b82f6&style=flat" alt="Downloads"></a>
  <a href="https://github.com/growae/reactive/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/@growae/reactive-connectors?colorA=21262d&colorB=3b82f6&style=flat" alt="MIT License"></a>
</p>

<br>

## Overview

Wallet connectors for `@growae/reactive`. Includes `superhero()` (Superhero Wallet), `iframe()`, `webExtension()`, `ledger()`, `metamaskSnap()`, and `walletDetect()`, plus re-exports `mock()` and `memory()` from core.

## Install

```bash
# npm
npm install @growae/reactive-connectors @growae/reactive

# yarn
yarn add @growae/reactive-connectors @growae/reactive

# pnpm
pnpm add @growae/reactive-connectors @growae/reactive
```

## Usage

```ts
import { createConfig } from '@growae/reactive'
import { testnet } from '@growae/reactive/networks'
import {
  superhero,
  ledger,
  walletDetect,
} from '@growae/reactive-connectors'

const config = createConfig({
  networks: [testnet],
  connectors: [
    superhero(),
    ledger(),
    walletDetect(),
  ],
})
```

## Peer Dependencies

- `@aeternity/aepp-sdk >=14`
- Optional: `@ledgerhq/hw-transport >=6`

## Documentation

Visit [reactive.growae.io/core/getting-started](https://reactive.growae.io/core/getting-started) for the full documentation.

## License

[MIT](https://github.com/growae/reactive/blob/main/LICENSE)
npm package: @growae/reactive-react
Description: <h1 align="center">@growae/reactive-react</h1>
Latest version: 0.0.5

<h1 align="center">@growae/reactive-react</h1>

<p align="center">
  React hooks for building Aeternity dApps
</p>

<p align="center">
  <a href="https://www.npmjs.com/package/@growae/reactive-react"><img src="https://img.shields.io/npm/v/@growae/reactive-react?colorA=21262d&colorB=3b82f6&style=flat" alt="Version"></a>
  <a href="https://www.npmjs.com/package/@growae/reactive-react"><img src="https://img.shields.io/npm/dm/@growae/reactive-react?colorA=21262d&colorB=3b82f6&style=flat" alt="Downloads"></a>
  <a href="https://github.com/growae/reactive/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/@growae/reactive-react?colorA=21262d&colorB=3b82f6&style=flat" alt="MIT License"></a>
</p>

<br>

## Overview

React adapter for `@growae/reactive`. Built on TanStack React Query, it provides `ReactiveProvider` and hooks like `useConnect`, `useBalance`, `useSpend`, `useReadContract`, and more.

## Install

```bash
# npm
npm install @growae/reactive-react @growae/reactive @tanstack/react-query

# yarn
yarn add @growae/reactive-react @growae/reactive @tanstack/react-query

# pnpm
pnpm add @growae/reactive-react @growae/reactive @tanstack/react-query
```

## Usage

```tsx
import { createConfig } from '@growae/reactive'
import { testnet } from '@growae/reactive/networks'
import { superhero } from '@growae/reactive-connectors'
import { ReactiveProvider } from '@growae/reactive-react'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'

const config = createConfig({
  networks: [testnet],
  connectors: [superhero()],
})

const queryClient = new QueryClient()

function App() {
  return (
    <QueryClientProvider client={queryClient}>
      <ReactiveProvider config={config}>
        <Wallet />
      </ReactiveProvider>
    </QueryClientProvider>
  )
}
```

```tsx
import { useConnect, useBalance, useSpend } from '@growae/reactive-react'

function Wallet() {
  const { connect, connectors } = useConnect()
  const { data: balance } = useBalance({ address: 'ak_...' })
  const { mutate: send } = useSpend()

  return (
    <div>
      <button onClick={() => connect({ connector: connectors[0] })}>
        Connect
      </button>
      {balance && <p>Balance: {balance.ae} AE</p>}
      <button onClick={() => send({ recipient: 'ak_...', amount: '1.0' })}>
        Send 1 AE
      </button>
    </div>
  )
}
```

## Peer Dependencies

- `react >=18`
- `@tanstack/react-query >=5`

## Documentation

Visit [reactive.growae.io/react/getting-started](https://reactive.growae.io/react/getting-started) for the full documentation.

## License

[MIT](https://github.com/growae/reactive/blob/main/LICENSE)
npm package: @growae/reactive-vue
Description: <h1 align="center">@growae/reactive-vue</h1>
Latest version: 0.0.5

<h1 align="center">@growae/reactive-vue</h1>

<p align="center">
  Vue composables for building Aeternity dApps
</p>

<p align="center">
  <a href="https://www.npmjs.com/package/@growae/reactive-vue"><img src="https://img.shields.io/npm/v/@growae/reactive-vue?colorA=21262d&colorB=3b82f6&style=flat" alt="Version"></a>
  <a href="https://www.npmjs.com/package/@growae/reactive-vue"><img src="https://img.shields.io/npm/dm/@growae/reactive-vue?colorA=21262d&colorB=3b82f6&style=flat" alt="Downloads"></a>
  <a href="https://github.com/growae/reactive/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/@growae/reactive-vue?colorA=21262d&colorB=3b82f6&style=flat" alt="MIT License"></a>
</p>

<br>

## Overview

Vue adapter for `@growae/reactive`. Built on TanStack Vue Query, it provides a `ReactivePlugin` for Vue, composables like `useConnect`, `useBalance`, `useSpend`, and a Nuxt module at `@growae/reactive-vue/nuxt`.

## Install

```bash
# npm
npm install @growae/reactive-vue @growae/reactive @tanstack/vue-query

# yarn
yarn add @growae/reactive-vue @growae/reactive @tanstack/vue-query

# pnpm
pnpm add @growae/reactive-vue @growae/reactive @tanstack/vue-query
```

## Usage

```ts
import { createApp } from 'vue'
import { createConfig } from '@growae/reactive'
import { testnet } from '@growae/reactive/networks'
import { ReactivePlugin } from '@growae/reactive-vue'
import { VueQueryPlugin } from '@tanstack/vue-query'

const config = createConfig({ networks: [testnet] })

const app = createApp(App)
app.use(VueQueryPlugin)
app.use(ReactivePlugin, { config })
app.mount('#app')
```

```ts
import { useConnect, useBalance, useSpend } from '@growae/reactive-vue'

const { connect, connectors } = useConnect()
const { data: balance } = useBalance({ address: 'ak_...' })
const { mutate: send } = useSpend()
```

### Nuxt

```ts
// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['@growae/reactive-vue/nuxt'],
})
```

## Peer Dependencies

- `vue >=3`
- `@tanstack/vue-query >=5`
- Optional: `nuxt >=3`

## Documentation

Visit [reactive.growae.io/vue/getting-started](https://reactive.growae.io/vue/getting-started) for the full documentation.

## License

[MIT](https://github.com/growae/reactive/blob/main/LICENSE)