# reactnative.directory

React Native Directory is a website where you can browse through all the libraries that are compatible with React Native.

## How do I add a library?

- Add it **at the end** of [`react-native-libraries.json`](https://github.com/react-native-community/directory/blob/main/react-native-libraries.json) file (we use the order in that file for "Recently added" sort option).
- Use the [template](#new-library-entry-template) as a guide.
- Submit a PR.

> [!TIP]
> You can also use the React Native Directory CLI to submit a library directly from the terminal. Run `bunx rn-directory submit` from the package root folder.
> - https://github.com/Simek/rn-directory

### New library entry template

> [!IMPORTANT]
> Please follow format, fields order and indentation as seen below, skip any of the `false` values and do not fill optional fields, unless it's necessary.
> You can find the detailed descriptions of the fields below the entry template.

```json
{
  "githubUrl": "<GITHUB REPOSITORY URL>",
  "npmPkg": "<OPTIONAL NPM PACKAGE NAME>",
  "examples": [
    "<THE URL TO REPO>",
    "<THE URL TO A SNACK>"
  ],
  "images": ["<PUBLIC URL TO RELATED IMAGE>"],
  "ios": false,
  "android": false,
  "web": false,
  "windows": false,
  "macos": false,
  "tvos": false,
  "visionos": false,
  "expoGo": false,
  "fireos": false,
  "horizon": false,
  "vegaos": false,
  "newArchitecture": false,
  "configPlugin": false,
  "unmaintained": false,
  "dev": false
}
```

> [!NOTE]
> If your package is within a monorepo on GitHub, eg: https://github.com/expo/expo/tree/main/packages/expo-web-browser,
> then the name, description, homepage, and topics (keywords) will be extracted from `package.json` in the package subdirectory.
> However, GitHub stats will be based on the monorepo, because there isn't really another option.


### Library fields description

#### ⚙️ General

- #### ❗ `githubUrl` **(required)**

  **(string)** - URL to the package GitHub repository (currently other Git hosts are not supported).
> [!WARNING]
> Package also needs to be published to the NPM registry, because it is a source of crucial data for the directory.

- #### `npmPkg`

  **(string)** - npm package name, by default GitHub repository name will be used. Example: `"@expo/react-native-action-sheet"`.

> [!TIP]
> Fill `npmPkg` only when the GitHub repository name is different from the name of package published to npm, or the package is a part of monorepo.

- #### `examples`
  **(array of strings)** - URLs to example projects or Snacks which demonstrates the library.
- #### `images`

  **(array of strings)** - URLs to static images or GIFs that shows the library functionality.

> [!TIP]
> Please do not add logotypes or other branding materials to the `images` array, and please avoid linking multiple assets which shows the same feature.

#### 📱 Platforms

- #### `android`
  **(boolean)** - works on Android device.
- #### `ios`
  **(boolean)** - works on iOS device.
- #### `web`
  **(boolean)** - can be used with [`react-native-web`](https://github.com/necolas/react-native-web).

#### 🖥️ Out-of-tree Platforms

> [!IMPORTANT]
> Adding out-of-tree platforms support requires an example or link to the app which uses the library on the given platform.

- #### `windows`
  **(boolean)** - can be used with [`react-native-windows`](https://github.com/microsoft/react-native-windows).
- #### `macos`
  **(boolean)** - can be used with [`react-native-macos`](https://github.com/microsoft/react-native-macos).
- #### `tvos`
  **(boolean)** - can be used with [`react-native-tvos`](https://github.com/react-native-tvos/react-native-tvos).
- #### `visionos`
  **(boolean)** - can be used with [`react-native-visionos`](https://github.com/callstack/react-native-visionos).

#### ✅ Compatibility

> [!TIP]
> **Any** library can be used with Expo, if you use dev clients or prebuild.

- #### `expoGo`
  **(boolean)** - works with [Expo Go](https://docs.expo.dev/get-started/expo-go/) — an open-source sandbox app, without using [dev clients](https://docs.expo.dev/develop/development-builds/introduction/) or [prebuild](https://docs.expo.dev/workflow/continuous-native-generation/).
- #### `fireos`
  **(boolean)** - works on Amazon Fire OS.
- #### `harmony`
  **(boolean|string)** - works on HarmonyOS. It can also be a string containing npm package name, if a separate/additional package is required for full support.
- #### `horizon`
  **(boolean)** - works on Meta Horizon OS.
- #### `vegaos`
  **(boolean|string)** - works with [Vega OS](https://developer.amazon.com/apps-and-games/vega). It can also be a string containing npm package name, if a separate/additional package is required for full support.

#### 🏷️ Tags

- #### `unmaintained`
  **(boolean)** - signify that a library is no longer maintained. You can provide alternative or replacement libraries with the `alternatives` field, if needed.
- #### `dev`
  **(boolean)** - signify that a library is a development tool or is only a part of development process.
- #### `configPlugin`
  **(boolean \| string \[URL to third-party config plugin\])** - Indicates if the library includes an [Expo config plugin](https://docs.expo.dev/config-plugins/introduction/). If the plugin is provided by a third party, supply the URL as a string. This field is optional and will be detected automatically if omitted.
- #### `newArchitecture`
  **(boolean|'new-arch-only')** - signify that a library supports both, or not, the New Architecture and the Old Architecture or only the New Architecture. Skipping the field will result in "untested" status, unless automatic support detection returned a result. You can provide additional context with the `newArchitectureNote` field, if needed.

> [!TIP]
> Set `newArchitecture` field only when automatic architecture detection fails for your package, despite it supports the New Architecture.

### 📝 Additional context for tags

- #### `newArchitectureNote`
  **(string)** - provide a note for the New Architecture support status, if a boolean `"true"` or `"false"` is not sufficient to describe the state of New Architecture support.

- #### `alternatives`
  **(array of strings)** - provide a list of alternatives to the library. eg: `["expo-camera", "react-native-vision-camera"]`. This is used to provide a list of alternatives to a library if it is unmaintained or does not support the New Architecture.

# React Native Directory API

This document describes the server-side JSON API exposed by the React Native Directory.

## Summary of available endpoints

- [`GET /api/libraries`](#get-apilibraries) - list and search libraries (paginated, sorted, filterable)
- [`GET /api/libraries/check`](#get-apilibrariescheck) - return metadata for a list of npm package names
- [`POST /api/libraries/check`](#post-apilibrariescheck) - (deprecated) return metadata for a list of npm package names
- [`GET /api/libraries/statistic`](#get-apilibrariesstatistic) - aggregated statistics about the directory dataset
- [`GET /api/library`](#get-apilibrary) - lookup one or more libraries by npm package name (optionally `check` existence only)
- [`GET /api/proxy/github-funding`](#get-apiproxygithub-funding) - proxy to https://api.github.com/graphql API with baked query for fetching funding data
- [`GET /api/proxy/npm-stat`](#get-apiproxynpm-stat) - proxy to https://npm-stat.com download counts API
- [`GET /api/proxy/unpkg`](#get-apiproxyunpkg) - proxy to https://unpkg.com/ API with redirect handling on server-side

## GET /api/libraries

Return a list of libraries from the dataset. Supports sorting, full-text search, pagination and many filters.

- Method: GET
- Path: `/api/libraries`
- Query parameters, all optional. The possible query parameters represents [`Query` type](https://github.com/react-native-community/directory/blob/main/types/index.ts#L22-L59):
  - `order` - sort key (available sorting keys: `updated`, `added`, `quality`, `popularity`, `downloads`, `issues`, `stars`, `relevance`, `size`, `dependencies`, `released`).
  - `direction` - `ascending` or `descending` (default: `descending`).
  - `search` - full-text search string (`relevance` sorting is used automatically when searching).
  - `owner` - filter by owner name.
  - `topic` - filter by topic or tag.
  - Platform support filters (booleans): `ios`, `android`, `web`, `windows`, `macos`, `expoGo`, `fireos`, `horizon`, `tvos`, `visionos`, `vegaos`.
  - Feature filters (booleans): `hasExample`, `hasImage`, `hasTypes`, `hasNativeCode`, `configPlugin`.
  - Quality filters (booleans): `isMaintained`, `isPopular`, `wasRecentlyUpdated`.
  - Architecture filters (booleans): `newArchitecture`, `expoModule`, `nitroModule`, `turboModule`.
  - Skip categories (booleans): `skipLibs`, `skipTools`, `skipTemplates`.
  - Numeric filters: `minPopularity`, `minMonthlyDownloads`.
  - `nightlyProgram` - boolean flag for Nightly Program participation.
  - `bookmarks` - when set, the server reads browser cookie bookmarks and returns only bookmarked libraries (see Notes below).
  - Pagination: `offset` (number, default `0`), `limit` (number, default `20`).

### Notes

- If `search` is provided and `order` is missing or equal to `relevance`, libraries are re-ranked by relevance.
- If `bookmarks` is set, the server uses the cookie stored bookmarks (from `req.headers.cookie`) to filter. Responses with `bookmarks` set are not cached publicly.

### Example

- GET `/api/libraries?search=image&order=downloads&direction=descending&limit=1`

  Response:

  ```json
  {
    "libraries": [
      {
        "githubUrl": "https://github.com/expo/expo/tree/main/packages/expo-image",
        "examples": ["https://docs.expo.dev/versions/latest/sdk/image/#usage"],
        "ios": true,
        "android": true,
        "web": true,
        "tvos": true,
        "expoGo": true,
        "fireos": true,
        "vegaos": "@amazon-devices/expo-image",
        "newArchitecture": true,
        "github": {
          "urls": {
            "repo": "https://github.com/expo/expo",
            "homepage": "https://docs.expo.dev/versions/latest/sdk/image/"
          },
          "stats": {
            "hasIssues": true,
            "hasWiki": true,
            "hasSponsorships": false,
            "hasDiscussions": true,
            "hasProjects": false,
            "hasVulnerabilityAlerts": true,
            "hasTopics": false,
            "updatedAt": "2026-01-27T20:02:58Z",
            "createdAt": "2016-08-15T17:14:25Z",
            "pushedAt": "2026-01-27T20:02:58Z",
            "forks": 10924,
            "issues": 335,
            "subscribers": 351,
            "stars": 47312,
            "dependencies": 1
          },
          "name": "expo-image",
          "fullName": "expo/expo",
          "isPrivate": false,
          "description": "A cross-platform, performant image component for React Native and Expo with Web support",
          "topics": [],
          "license": {
            "name": "MIT License",
            "url": "http://choosealicense.com/licenses/mit/",
            "id": "MDc6TGljZW5zZTEz",
            "key": "mit",
            "spdxId": "MIT"
          },
          "hasTypes": true,
          "newArchitecture": false,
          "isArchived": false,
          "hasReadme": true,
          "hasNativeCode": true,
          "configPlugin": true,
          "moduleType": "expo"
        },
        "npmPkg": "expo-image",
        "npm": {
          "downloads": 5883973,
          "weekDownloads": 1011061,
          "size": 839777,
          "versionsCount": 226,
          "latestRelease": "3.0.11",
          "latestReleaseDate": "2025-12-05T06:50:48.709Z",
          "hasReadme": true
        },
        "score": 90,
        "matchingScoreModifiers": [
          "Very popular",
          "Popular",
          "Known",
          "Recently updated",
          "Has a README file",
          "Has a description",
          "Has vulnerability alerts enabled",
          "Lots of open issues"
        ],
        "popularity": 0.146,
        "topicSearchString": "",
        "matchScore": 425
      }
    ],
    "total": 142
  }
  ```

## GET /api/libraries/check

Return compatibility metadata for a list of npm package names.

- Method: GET
- Path: `/api/libraries/check`
- Query parameters:
  - `packages` - list of npm package names (required).

### Example

- GET `/api/libraries/check?packages=react-native-reanimated,expo-image`

  Response:

  ```json
  {
    "react-native-reanimated": {
      "newArchitecture": "supported"
    },
    "expo-image": {
      "newArchitecture": "supported"
    }
  }
  ```

---

## POST /api/libraries/check

> [!warning]
> This endpoint is deprecated, and will be removed in the future. Use GET request instead.

Return compatibility metadata for a list of npm package names. This endpoint accepts a JSON body with an array of package names and responds with metadata for each package.

- Method: POST
- Path: `/api/libraries/check`
- Body parameters:
  - `packages` - array of npm package names (required).

### Notes

- The request body must be a valid JSON object with a `packages` field.

### Example

- POST `/api/libraries/check` with body `{ "packages": ["react-native-reanimated"] }`

  Response:

  ```json
  {
    "react-native-reanimated": {
      "newArchitecture": "supported"
    }
  }
  ```

---

## GET /api/libraries/statistic

Return aggregated statistics about the library dataset, such as total counts of libraries, downloads, and other metrics.

- Method: GET
- Path: `/api/libraries/statistic`

### Example

- GET `/api/libraries/statistic`

  Response:

  ```json
  {
    "total": 2326,
    "newArchitecture": 1570,
    "downloads": 7380762848,
    "weekDownloads": 1391864468,
    "unmaintained": 797,
    "withTypes": 1626,
    "withNativeCode": 1123,
    "withConfigPlugin": 243,
    "ios": 2199,
    "android": 2188,
    "web": 506,
    "expoGo": 972,
    "windows": 67,
    "macos": 44,
    "fireos": 216,
    "horizon": 3,
    "tvos": 100,
    "visionos": 32,
    "vegaos": 55,
    "packageManager": {
      "bun": 85,
      "pnpm": 132,
      "npm": 402,
      "yarn": 1334
    }
  }
  ```

---

## GET /api/library

Lookup one or more libraries by npm package name.
Endpoint can optionally perform a quick `check` to return existence flag only, or when `version` is used as `check` value to return the latest version string when package is present in the directory.

- Method: GET
- Path: `/api/library`
- Query parameters:
  - `name` - npm package name (required).
  - `check` - boolean flag to return existence information only, without full library data.

### Notes

- If `check` is `true`, the response includes only information about existence for the specified package(s).
- If `check` is `version`, the response includes only information about existence for the specified package(s), returning the latest version if package exists.
- If `check` is `false` or not provided, the response includes full library data.

### Example

- GET `/api/library?name=uniwind`

  Response:

  ```json
  {
    "uniwind": {
      "githubUrl": "https://github.com/uni-stack/uniwind/tree/main/packages/uniwind",
      "examples": [
        "https://github.com/uni-stack/uniwind/tree/main/apps/expo-router",
        "https://github.com/uni-stack/uniwind/tree/main/apps/expo-example",
        "https://github.com/uni-stack/uniwind/tree/main/apps/bare"
      ],
      "ios": true,
      "android": true,
      "web": true,
      "expoGo": true,
      "newArchitecture": true,
      "github": {
        "urls": {
          "repo": "https://github.com/uni-stack/uniwind",
          "homepage": "https://uniwind.dev"
        },
        "stats": {
          "hasIssues": true,
          "hasWiki": false,
          "hasSponsorships": false,
          "hasDiscussions": true,
          "hasProjects": true,
          "hasVulnerabilityAlerts": true,
          "hasTopics": true,
          "updatedAt": "2026-02-16T06:41:45Z",
          "createdAt": "2025-07-29T08:10:42Z",
          "pushedAt": "2026-02-16T06:41:45Z",
          "forks": 25,
          "issues": 2,
          "subscribers": 6,
          "stars": 1323,
          "dependencies": 4
        },
        "name": "uniwind",
        "fullName": "uni-stack/uniwind",
        "isPrivate": false,
        "description": "The fastest Tailwind bindings for React Native",
        "topics": ["unistyles", "tailwind", "tailwindcss", "theme", "style"],
        "license": {
          "name": "MIT License",
          "url": "http://choosealicense.com/licenses/mit/",
          "id": "MDc6TGljZW5zZTEz",
          "key": "mit",
          "spdxId": "MIT"
        },
        "hasTypes": false,
        "newArchitecture": false,
        "isArchived": false,
        "hasReadme": true,
        "hasNativeCode": false,
        "configPlugin": false
      },
      "npmPkg": "uniwind",
      "npm": {
        "downloads": 196697,
        "weekDownloads": 28489,
        "size": 635831,
        "versionsCount": 42,
        "latestRelease": "1.3.1",
        "latestReleaseDate": "2026-02-13T10:35:54.904Z",
        "hasReadme": true
      },
      "score": 60,
      "matchingScoreModifiers": [
        "Popular",
        "Known",
        "Recently updated",
        "Has a README file",
        "Has a description",
        "Has vulnerability alerts enabled"
      ],
      "popularity": 0.123,
      "topicSearchString": "unistyles tailwind tailwindcss theme style"
    }
  }
  ```

- GET `/api/library?name=react&check=true`

  Response:

  ```json
  {
    "uniwind": true
  }
  ```

- GET `/api/library?name=react&check=version`

  Response:

  ```json
  {
    "uniwind": "1.5.0"
  }
  ```

---

## GET /api/proxy/github-funding

Proxy to api.github.com/graphql to fetch project funding data. This endpoint uses baked query, and cannot be used to fetch other data than funding details.

- Method: GET
- Path: `/api/proxy/github-funding`
- Query parameters:
  - `name` - GitHub repository name (required).
  - `owner` - GitHub repository owner (required).

### Notes

- It is subject to the same CORS and rate limiting policies as the original api.github.com/graphql.

### Example

- GET `/api/proxy/github-funding?owner=lodev09&name=react-native-true-sheet`

  Response:

  ```json
  {
    "fundingLinks": [
      {
        "platform": "GITHUB",
        "url": "https://github.com/lodev09"
      },
      {
        "platform": "BUY_ME_A_COFFEE",
        "url": "https://buymeacoffee.com/lodev09"
      }
    ]
  }
  ```

---

## GET /api/proxy/npm-stat

Proxy to npm-stat.com to fetch download counts for the last month. This endpoint is a simple proxy and does not perform any data processing.

- Method: GET
- Path: `/api/proxy/npm-stat`
- Query parameters:
  - `name` - npm package name (required).

### Notes

- It is subject to the same CORS and rate limiting policies as the original npm-stat.com.

### Example

- GET `/api/proxy/npm-stat?name=react`

  Response:

  ```json
  {
    "react-native": {
      "2026-01-18": 319495,
      "2026-01-19": 693157,
      "2026-01-20": 810833,
      "2026-01-21": 837204,
      "2026-01-22": 845437,
      "2026-01-23": 777158,
      "2026-01-24": 378434,
      "2026-01-25": 339869,
      "2026-01-26": 813923,
      "2026-01-27": 888545,
      "2026-01-28": 877008,
      "2026-01-29": 880932,
      "2026-01-30": 855686,
      "2026-01-31": 390039,
      "2026-02-01": 380828,
      "2026-02-02": 853673,
      "2026-02-03": 898431,
      "2026-02-04": 911421,
      "2026-02-05": 935844,
      "2026-02-06": 879993,
      "2026-02-07": 417938,
      "2026-02-08": 403069,
      "2026-02-09": 891276,
      "2026-02-10": 969193,
      "2026-02-11": 942355,
      "2026-02-12": 939358,
      "2026-02-13": 834084,
      "2026-02-14": 390313,
      "2026-02-15": 403198,
      "2026-02-16": 771778
    }
  }
  ```

---

## GET /api/proxy/unpkg

Proxy to unpkg.com to fetch various package file content.

- Method: GET
- Path: `/api/proxy/unpkg.com`
- Query parameters:
  - `name` - npm package name (required).
  - `path` - path to wanted file from the bundle (required).

### Notes

- Redirects returned from unpkg.com are resolve server-side, before returning response.
- Return will be a plain text if file content is accessible, in any other case (i.e. errors) JSON would be returned.

### Example

- GET `/api/proxy/unpkg?name=react-native-safe-area-context&path=README.md`

  Response:

  ```mdx
  ![safearea](https://github.com/user-attachments/assets/d951efe6-4d25-4ff6-b654-7aaf4519829b)

  ### About

  App & Flow is a Montreal-based React Native engineering and consulting studio. We partner with the world’s top companies and are recommended by [Expo](https://expo.dev/consultants). Need a hand? Let’s build together. team@appandflow.com

  # react-native-safe-area-context

  [![npm](https://img.shields.io/npm/v/react-native-safe-area-context)](https://www.npmjs.com/package/react-native-safe-area-context) ![Supports Android, iOS, web, macOS and Windows](https://img.shields.io/badge/platforms-android%20%7C%20ios%20%7C%20web%20%7C%20macos%20%7C%20windows-lightgrey.svg) ![MIT License](https://img.shields.io/npm/l/react-native-safe-area-context.svg)

  [![JavaScript tests](https://github.com/AppAndFlow/react-native-safe-area-context/workflows/JavaScript%20tests/badge.svg)](https://github.com/AppAndFlow/react-native-safe-area-context/actions/workflows/js.yml) [![iOS build](https://github.com/AppAndFlow/react-native-safe-area-context/workflows/iOS%20build/badge.svg)](https://github.com/AppAndFlow/react-native-safe-area-context/actions/workflows/ios.yml) [![Android build](https://github.com/AppAndFlow/react-native-safe-area-context/workflows/Android%20build/badge.svg)](https://github.com/AppAndFlow/react-native-safe-area-context/actions/workflows/android.yml)

  A flexible way to handle safe area, also works on Android and Web!

  ## Documentation

  Check out our [documentation site](https://appandflow.github.io/react-native-safe-area-context/).

  ## Contributing

  See the [Contributing Guide](CONTRIBUTING.md)
  ```