Update to Building React Native Apps

{
  "name": "react-navigation",
  "description": "Provides React Navigation UI patterns for stacks, tabs, drawers etc. Use when building navigation UIs with React Navigation, configuring headers, bottom sheets or handling safe areas and insets.",
  "included_files": [
    {
      "relative_path": "agents/openai.yaml",
      "size_in_bytes": 268
    },
    {
      "relative_path": "references/bottom-tabs.md",
      "size_in_bytes": 13020
    },
    {
      "relative_path": "references/drawers.md",
      "size_in_bytes": 12278
    },
    {
      "relative_path": "references/form-sheet.md",
      "size_in_bytes": 8163
    },
    {
      "relative_path": "references/header.md",
      "size_in_bytes": 6937
    },
    {
      "relative_path": "references/material-top-tabs.md",
      "size_in_bytes": 11809
    },
    {
      "relative_path": "references/native-bottom-tabs.md",
      "size_in_bytes": 8925
    },
    {
      "relative_path": "references/safe-areas.md",
      "size_in_bytes": 3858
    },
    {
      "relative_path": "references/stacks.md",
      "size_in_bytes": 11976
    }
  ],
  "skill_md_contents": "---\nname: react-navigation\ndescription: Provides React Navigation UI patterns for stacks, tabs, drawers etc. Use when building navigation UIs with React Navigation, configuring headers, bottom sheets or handling safe areas and insets.\nlicense: MIT\n---\n\n# React Navigation\n\n## Overview\n\nGuide for building navigation UIs with React Navigation.\n\nThis skill only applies to React Navigation 7. The API and patterns may not work with different versions.\n\n## API Selection\n\nReact Navigation offers two API - object-based `Static API` and component-based `Dynamic API`.\n\n- **Existing Apps**: Check the current navigation setup and follow the same API style when using the references\n- **New Apps**: If the app does not have an existing navigation setup yet, prefer `Static API`\n\n## When to Apply\n\nReference this skill when:\n\n- Building navigation UI patterns such as stacks, tabs, drawers, sheets etc.\n- Configuring headers and other built-in navigator UI\n- Handling safe areas and insets in navigation UI\n\n## References\n\n| File                                        | Description                    |\n| ------------------------------------------- | ------------------------------ |\n| [stacks.md][stacks]                         | Stack based navigation         |\n| [form-sheet.md][form-sheet]                 | Bottom sheet and form sheets   |\n| [bottom-tabs.md][bottom-tabs]               | Cross-platform bottom tabs     |\n| [native-bottom-tabs.md][native-bottom-tabs] | Native bottom tabs             |\n| [material-top-tabs.md][material-top-tabs]   | Swipeable Top tabs             |\n| [drawers.md][drawers]                       | Drawer navigation and sidebars |\n| [header.md][header]                         | Configuring headers            |\n| [safe-areas.md][safe-areas]                 | Safe-area handling             |\n\n## Problem -> Skill Mapping\n\n| Problem                                                                   | Start With                                  |\n| ------------------------------------------------------------------------- | ------------------------------------------- |\n| Showing screens and modals in a stack                                     | [stacks.md][stacks]                         |\n| Showing bottom sheets or form sheets                                      | [form-sheet.md][form-sheet]                 |\n| Showing screens in bottom tabs or responsive sidebars with web support    | [bottom-tabs.md][bottom-tabs]               |\n| Showing screens in native tabs on iOS & Android                           | [native-bottom-tabs.md][native-bottom-tabs] |\n| Showing content in swipeable top tabs                                     | [material-top-tabs.md][material-top-tabs]   |\n| Using a drawer or sidebar                                                 | [drawers.md][drawers]                       |\n| Configuring the header in bottom tab or drawer navigator                  | [header.md][header]                         |\n| Handling safe-area such as status bar, header insets, tab bar insets etc. | [safe-areas.md][safe-areas]                 |\n\n[stacks]: references/stacks.md\n[form-sheet]: references/form-sheet.md\n[safe-areas]: references/safe-areas.md\n[bottom-tabs]: references/bottom-tabs.md\n[native-bottom-tabs]: references/native-bottom-tabs.md\n[material-top-tabs]: references/material-top-tabs.md\n[drawers]: references/drawers.md\n[header]: references/header.md\n"
}