---
api_name: app-bridge-library
source_url:
  html: 'https://shopify.dev/docs/api/app-bridge-library/react-components'
  md: 'https://shopify.dev/docs/api/app-bridge-library/react-components.md'
---

# React Components

[![Modal Component](https://shopify.dev/images/templated-apis-screenshots/app-bridge-library/modal.png)![Modal Component](https://shopify.dev/images/templated-apis-screenshots/app-bridge-library/modal.png)](https://shopify.dev/docs/api/app-bridge-library/react-components/modal-component)

[Modal Component](https://shopify.dev/docs/api/app-bridge-library/react-components/modal-component)

[The Modal API allows you to display an overlay that prevents interaction with the rest of the app until dismissed.](https://shopify.dev/docs/api/app-bridge-library/react-components/modal-component)

[![NavMenu Component](https://shopify.dev/images/templated-apis-screenshots/app-bridge-library/navigation-menu.png)![NavMenu Component](https://shopify.dev/images/templated-apis-screenshots/app-bridge-library/navigation-menu.png)](https://shopify.dev/docs/api/app-bridge-library/react-components/navmenu-component)

[Nav​Menu Component](https://shopify.dev/docs/api/app-bridge-library/react-components/navmenu-component)

[The Navigation Menu API creates a navigation menu for your app.](https://shopify.dev/docs/api/app-bridge-library/react-components/navmenu-component)

[![SaveBar Component](https://shopify.dev/images/templated-apis-screenshots/app-bridge-library/contextual-save-bar.png)![SaveBar Component](https://shopify.dev/images/templated-apis-screenshots/app-bridge-library/contextual-save-bar.png)](https://shopify.dev/docs/api/app-bridge-library/react-components/savebar-component)

[Save​Bar Component](https://shopify.dev/docs/api/app-bridge-library/react-components/savebar-component)

[The Save Bar API is used to indicate that a form on the current page has unsaved information.](https://shopify.dev/docs/api/app-bridge-library/react-components/savebar-component)

[![TitleBar Component](https://shopify.dev/images/templated-apis-screenshots/app-bridge-library/title-bar.png)![TitleBar Component](https://shopify.dev/images/templated-apis-screenshots/app-bridge-library/title-bar.png)](https://shopify.dev/docs/api/app-bridge-library/react-components/titlebar-component)

[Title​Bar Component](https://shopify.dev/docs/api/app-bridge-library/react-components/titlebar-component)

[The Title Bar API allows you to populate a standardized title bar with button actions and navigation breadcrumbs.](https://shopify.dev/docs/api/app-bridge-library/react-components/titlebar-component)