diff --git a/apps/developer/docs/packages/SDK/index.md b/apps/developer/docs/packages/SDK/index.md index 63a3de72..8f2c0b98 100644 --- a/apps/developer/docs/packages/SDK/index.md +++ b/apps/developer/docs/packages/SDK/index.md @@ -1,5 +1,24 @@ # @monerium/sdk +A library to interact with Monerium API. + +## Example + +```tsx +import { MoneriumClient } from '@monerium/sdk'; + +const monerium = new MoneriumClient({ + clientId: '...', + redirectUri: '...', + environment: 'sandbox', +}) + +await monerium.getAccess(); + +// Retrieve profiles the client has access to. +await monerium.getProfiles(); +``` + ## References ### default diff --git a/apps/developer/docs/packages/sdk-react-provider/functions/MoneriumProvider.md b/apps/developer/docs/packages/sdk-react-provider/functions/MoneriumProvider.md index 0e5d9252..b02c5f9a 100644 --- a/apps/developer/docs/packages/sdk-react-provider/functions/MoneriumProvider.md +++ b/apps/developer/docs/packages/sdk-react-provider/functions/MoneriumProvider.md @@ -2,7 +2,7 @@ > **MoneriumProvider**(`params`: \{`children`: `ReactNode`;`clientId`: `string`;`environment`: `'sandbox'`;`redirectUri`: `string`;`redirectUrl`: `string`; \}): `Element` -Place this provider at the root of your application. +Wrap your application with the Monerium provider. ## Parameters diff --git a/apps/developer/docs/packages/sdk-react-provider/index.md b/apps/developer/docs/packages/sdk-react-provider/index.md index b8ea2935..1cc610f1 100644 --- a/apps/developer/docs/packages/sdk-react-provider/index.md +++ b/apps/developer/docs/packages/sdk-react-provider/index.md @@ -1,5 +1,47 @@ # @monerium/sdk-react-provider +A library to interact with Monerium API with React hooks. + +This context provider utilizes React Query for async data fetching and caching. + +## Installation + +```bash +pnpm add @monerium/sdk-react-provider @tanstack/react-query +``` + +### Wrap App in Context Provider + +Wrap your app in the `QueryClientProvider` React Context Provider and pass a new `QueryClient` instance to the `client` property + +Inside the `QueryClientProvider`, wrap your app in the `MoneriumProvider` React Context Provider and pass the auth flow's `clientId`, `redirectUri`, and `environment` configuration. + +## Example + +```tsx +import { createRoot } from 'react-dom/client'; +import { MoneriumProvider } from '@monerium/sdk-react-provider'; +import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; + +import App from './App'; +const rootElement = document.getElementById('root'); +const root = createRoot(rootElement); + +const queryClient = new QueryClient(); + +root.render( + + + + + +); +``` + ## Provider - [MoneriumProvider](/docs/packages/sdk-react-provider/functions/MoneriumProvider.md) diff --git a/packages/sdk-react-provider/src/index.ts b/packages/sdk-react-provider/src/index.ts index 8ab2fd75..65505182 100644 --- a/packages/sdk-react-provider/src/index.ts +++ b/packages/sdk-react-provider/src/index.ts @@ -1,3 +1,48 @@ +/** + * @packageDocumentation + * A library to interact with Monerium API with React hooks. + * + * This context provider utilizes React Query for async data fetching and caching. + * + * ## Installation + * + * ```bash + * pnpm add @monerium/sdk-react-provider @tanstack/react-query + * ``` + * + * ### Wrap App in Context Provider + * + * Wrap your app in the `QueryClientProvider` React Context Provider and pass a new `QueryClient` instance to the `client` property + * + * Inside the `QueryClientProvider`, wrap your app in the `MoneriumProvider` React Context Provider and pass the auth flow's `clientId`, `redirectUri`, and `environment` configuration. + * + * @example + * ```tsx + * import { createRoot } from 'react-dom/client'; + * import { MoneriumProvider } from '@monerium/sdk-react-provider'; + * import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; + * + * import App from './App'; + * const rootElement = document.getElementById('root'); + * const root = createRoot(rootElement); + * + * const queryClient = new QueryClient(); + * + * root.render( + * + * + * + * + * + * ); + * ``` + * + */ + export * from './lib/provider'; export * from './lib/context'; export * from './lib/hooks'; diff --git a/packages/sdk-react-provider/src/lib/provider.tsx b/packages/sdk-react-provider/src/lib/provider.tsx index 41104509..d1b07657 100644 --- a/packages/sdk-react-provider/src/lib/provider.tsx +++ b/packages/sdk-react-provider/src/lib/provider.tsx @@ -7,7 +7,7 @@ import { MoneriumContext } from './context'; import { AuthorizeParams } from './types'; /** - * Place this provider at the root of your application. + * Wrap your application with the Monerium provider. * @group Provider * @param params * @param params.children - Rest of the application. diff --git a/packages/sdk/src/index.ts b/packages/sdk/src/index.ts index df4be9fc..7adca834 100644 --- a/packages/sdk/src/index.ts +++ b/packages/sdk/src/index.ts @@ -1,3 +1,24 @@ +/** + * @packageDocumentation + * A library to interact with Monerium API. + * + * @example + * ```tsx + * import { MoneriumClient } from '@monerium/sdk'; + * + * const monerium = new MoneriumClient({ + * clientId: '...', + * redirectUri: '...', + * environment: 'sandbox', + * }) + * + * await monerium.getAccess(); + * + * // Retrieve profiles the client has access to. + * await monerium.getProfiles(); + * ``` + */ + import { MoneriumClient } from './client'; export { default as constants } from './constants'; export * from './types';