## Stripe Apps Development Documentation

This documentation suite covers the development of Stripe Apps, a platform that allows developers to extend Stripe's functionality and embed custom user experiences within the Stripe Dashboard.

### Core Concepts and Getting Started

*   **Stripe Apps Overview**: An introduction to Stripe Apps, outlining their purpose, capabilities, and how they can be used to authenticate users, listen for events, and automate workflows.
*   **Getting Started with Stripe Apps**: A guide to building your first Stripe App, covering the basics of app development, previewing, and updating.
*   **How Stripe Apps Work**: Explains the fundamental architecture of Stripe Apps, including their frontend (UI extensions) and backend components.
*   **Common Use Cases**: Demonstrates various applications of Stripe Apps, categorized into backend, frontend, and full-stack app types.
*   **Sample Apps**: Provides links to working examples of Stripe Apps on GitHub, offering practical code snippets and design patterns.

### Building Your Stripe App

*   **Build an App**: General guidance on the app development process.
*   **Build a UI**: Details on creating custom user interfaces within the Stripe Dashboard using TypeScript, React, and Stripe's UI Extensions SDK.
    *   **How UI extensions work**: Explains the system for rendering custom UIs within Stripe.
    *   **Next generation UI components**: Introduces upcoming UI component updates.
    *   **Component hierarchy constraints**: Outlines rules for composing UI components.
    *   **UI testing**: Guidance on testing your app's user interface.
    *   **UI extension developer tools**: Information on bundled tools for type checking, linting, and testing.
    *   **Upgrade Stripe's UI extension SDK**: Instructions for updating to the latest SDK versions.
*   **Add server-side logic**: How to incorporate backend code for validating user actions, processing data, integrating with third-party systems, and handling webhooks.
*   **API Authentication Methods**: Explains the different ways your app can authenticate requests to the Stripe API:
    *   **Platform key**: The default authentication method using your account's secret API key.
    *   **OAuth 2.0**: Standard OAuth 2.0 for generating access tokens.
    *   **Restricted API key**: Secure, permissioned API keys generated upon app installation.
*   **Authorization flows**: How to implement authorization, including PKCE OAuth workflows.
*   **Store secret credentials and tokens**: How to securely persist sensitive data using the Secret Store API.
*   **Handle different modes**: Adapting your app to work with both live and sandbox environments.
*   **Enable sandbox support**: How to enable your public app for sandbox installation.
*   **Enable local network access**: Instructions for enabling local network access for app previewing.
*   **App settings page**: How to create a configuration page for users within the Stripe Dashboard.

### UI Components and Design

*   **UI Components**: A reference for the prebuilt UI components available in the Stripe Apps UI toolkit.
    *   **Accordion**: For collapsible content.
    *   **Badge**: To indicate item state.
    *   **Banner**: For alerts and messages.
    *   **BarChart**: For visualizing data with bars.
    *   **Box**: For wrapping components and applying styles.
    *   **Button**: For user actions.
    *   **ButtonGroup**: For managing multiple buttons.
    *   **Checkbox**: For indicating or controlling boolean values.
    *   **Chip**: For displaying and manipulating values.
    *   **ContextView**: For rendering apps alongside Stripe content.
    *   **DateField**: For collecting date information.
    *   **DetailPageModule**: For rendering apps in Stripe dashboard pages.
    *   **DetailPagePropertyList**: For rendering apps in Stripe dashboard pages.
    *   **DetailPageTable**: For rendering apps in Stripe dashboard pages.
    *   **Divider**: For a horizontal rule.
    *   **FocusView**: For dedicated task completion spaces.
    *   **FormFieldGroup**: For grouping form fields.
    *   **Icon**: To display icon graphics.
    *   **Img**: For displaying images.
    *   **Inline**: For styling inline content.
    *   **LineChart**: For visualizing data as a line.
    *   **Link**: For navigation and subtle actions.
    *   **List**: For displaying collections of information.
    *   **Menu**: For presenting a group of actions.
    *   **OnboardingView**: For implementing onboarding flows.
    *   **PropertyList**: For displaying data as key-value pairs.
    *   **Radio**: For mutually exclusive selections.
    *   **SearchField**: For searching and filtering content.
    *   **Select**: For picking from dropdown options.
    *   **SettingsView**: For allowing users to change app settings.
    *   **SignInView**: For rendering a sign-in screen.
    *   **Sparkline**: For succinct data visualization.
    *   **Spinner**: To indicate loading states.
    *   **Switch**: For indicating or controlling boolean values.
    *   **Table**: For displaying tabular data.
    *   **Tabs**: For displaying sections of content.
    *   **TaskList**: For tracking user progress through tasks.
    *   **TextArea**: For multi-line text input.
    *   **TextField**: For single-line text input.
    *   **Toast**: For temporary status notifications.
    *   **Tooltip**: For providing additional contextual information.
*   **Design your app**: Guidelines and philosophy for designing Stripe Apps.
*   **Style your app**: How to style UI components using provided design tokens.
*   **Design patterns**: Recommended patterns for consistent and scalable app design.
    *   **Action buttons**: Placement and usage of action buttons.
    *   **Additional context**: Providing extra information during onboarding.
    *   **Back link**: Enabling users to navigate to previous pages.
    *   **Communicating state**: Guiding users with feedback on actions.
    *   **Demo content**: Tips for showcasing app functionality.
    *   **Empty state**: Informing users when no data is available.
    *   **Filter controls**: Using chips to filter table rows.
    *   **Full page apps**: Building custom, multi-view pages within the Dashboard.
    *   **Lists**: Displaying collections of information.
    *   **Loading**: Using spinners to indicate data loading.
    *   **Onboarding flow**: Creating effortless and relevant onboarding experiences.
    *   **Progress stepping**: Guiding users through multi-step tasks.
    *   **Redirects**: Creating clear redirects for users.
    *   **Settings sign in**: Onboarding users on a settings page.
    *   **Sign in template**: Using the SignInView component for authentication.
    *   **Sign out**: Enabling users to sign out of your app.
    *   **Waiting screens**: Informing users about wait times and next steps.

### Distribution and Management

*   **Distribution options**: How to share your Stripe Apps with users.
*   **Upload and install your Stripe App**: Steps to make your app available to team members.
*   **Test your app externally**: Setting up and distributing test versions before publication.
*   **Manage your app's versions and releases**: Understanding app versioning and releases.
*   **Publish your app to the Stripe App Marketplace**: Guide to getting your app approved for public listing.
*   **Stripe Apps quality requirements**: Guidelines for app review to ensure marketplace quality.
*   **Using install links**: Allowing users to install public apps outside the App Marketplace.

### Migration and Legacy Information

*   **Migrate an extension to Stripe Apps**: Reasons and steps to migrate legacy extensions.
*   **Migrate a plugin to Stripe Apps or Stripe Connect**: Options for migrating third-party integrations.
    *   **Migrate a plugin to an OAuth 2.0 app**: Specific guidance for OAuth migration.
    *   **Migrate a plugin to a RAK app**: Specific guidance for Restricted API Key migration.
*   **Legacy extensions**: Information about the deprecated extensions integration pattern.

### References and Tools

*   **App manifest reference**: Details on the `stripe-app.json` file.
*   **Stripe Apps CLI reference**: Commands for managing your Stripe app.
*   **Permissions reference**: Available events and their required permissions.
*   **Extension SDK API reference**: Documentation for the Extension SDK.
*   **Viewports reference**: Available viewports for Stripe Apps.
*   **Route descriptors**: Navigating within the Dashboard using route descriptors.