open-index/open-npm huggingface dataset:
npm package: @mbroisler/ui-kit-top
Description: This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Latest version: 0.0.6

# React + TypeScript + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh

## Expanding the ESLint configuration

If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:

- Configure the top-level `parserOptions` property like this:

```js
export default tseslint.config({
  languageOptions: {
    // other options...
    parserOptions: {
      project: ['./tsconfig.node.json', './tsconfig.app.json'],
      tsconfigRootDir: import.meta.dirname,
    },
  },
})
```

- Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked`
- Optionally add `...tseslint.configs.stylisticTypeChecked`
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config:

```js
// eslint.config.js
import react from 'eslint-plugin-react'

export default tseslint.config({
  // Set the react version
  settings: { react: { version: '18.3' } },
  plugins: {
    // Add the react plugin
    react,
  },
  rules: {
    // other rules...
    // Enable its recommended rules
    ...react.configs.recommended.rules,
    ...react.configs['jsx-runtime'].rules,
  },
})
```
npm package: @mbsc-core/checkout
Description: React components for the MBSC stablecoin issuance application flow (embedding SDK).
Latest version: 1.0.0

# @mbsc-core/checkout

React components for the MBSC stablecoin issuance application flow (embedding SDK).

Install with your package manager (e.g. add `@mbsc-core/checkout`).

## Usage

1. Wrap your app root (or the parent of the application screen) with `MBSCCheckoutProvider`, passing the API base URL and auth method.
2. Place `ApplyForm` (application form) and `AccountCard` (account / 2FA status) as children.

### Minimal example (cookie auth)

```tsx
import {
  MBSCCheckoutProvider,
  ApplyForm,
  AccountCard,
} from "@mbsc-core/checkout";

export default function ApplyPage() {
  const apiBaseUrl = process.env.NEXT_PUBLIC_API_URL ?? "http://localhost:3000";

  return (
    <MBSCCheckoutProvider apiBaseUrl={apiBaseUrl} credentials="include">
      <div>
        <ApplyForm />
        <AccountCard />
      </div>
    </MBSCCheckoutProvider>
  );
}
```

### Custom copy

Pass `copy` to `ApplyForm` and `AccountCard` to override display strings.

```tsx
<ApplyForm
  copy={{
    submitButton: "Submit",
    amountJpy: "Amount (JPY)",
    // ...
  }}
  applyCardCopy={{ title: "Application received", /* ... */ }}
/>
<AccountCard copy={{ title: "Account", setupButton: "Set up 2FA", /* ... */ }} />
```

### Using Next.js Link

Pass `linkComponent` to render the AccountCard 2FA link with Next.js `Link`.

```tsx
import Link from "next/link";

function NextLink({ href, children }: { href: string; children: React.ReactNode }) {
  return <Link href={href}>{children}</Link>;
}

<AccountCard
  linkComponent={NextLink}
  setup2FaPath="/settings/2fa"
/>
```

### Token auth

When using an Authorization header instead of cookies:

```tsx
<MBSCCheckoutProvider
  apiBaseUrl={apiBaseUrl}
  credentials={{
    getHeaders: () => ({ Authorization: `Bearer ${yourToken}` }),
  }}
>
  <ApplyForm />
</MBSCCheckoutProvider>
```

## API

- **MBSCCheckoutProvider**  
  - `apiBaseUrl: string` — MBSC API base URL  
  - `credentials?: "include" | { getHeaders: () => Record<string, string> }` — Auth method (default `"include"`)
- **ApplyForm**  
  - `copy?: Partial<ApplyFormCopy>` — Form labels  
  - `applyCardCopy?: Partial<ApplyCardCopy>` — Application result card labels
- **AccountCard**  
  - `copy?: Partial<ApplyAccountCardCopy>`  
  - `linkComponent?: React.ComponentType<{ href: string; children: React.ReactNode }>`  
  - `setup2FaPath?: string` — Path to 2FA setup page (default `"/settings/2fa"`)

Types (`ApplyFormCopy`, `ApplyCardCopy`, `ApplyAccountCardCopy`, etc.) are defined in `@mbsc-core/types`.

Output: ESM (`.mjs`), CJS (`.js`), and type definitions (`.d.ts`) are emitted to `dist/`.
npm package: @mbsc-core/types
Description: Shared type definitions for the MBSC API and Checkout / Redemption SDK. This package provides types only.
Latest version: 1.0.0

# @mbsc-core/types

Shared type definitions for the MBSC API and Checkout / Redemption SDK. This package provides types only.

Install with your package manager (e.g. add `@mbsc-core/types`). It is usually installed automatically as a dependency of `@mbsc-core/checkout`. Add it directly only if you need to reference the types alone.

## Types provided

- User & onboarding: `MeUser`, `Onboarding`
- Application: `ApplyResult`, `PostApplyBody`, `ApplyFormCopy`, `ApplyCardCopy`, `ApplyAccountCardCopy`, `IssueChain`
- Redemption: `Redemption`, `RedemptionStatus`, `CreateRedemptionResponse`, `PostRedemptionBody`, `ApplyRedemptionFormCopy`, `RedemptionCardCopy`