Can and Cannot Detail Integration Block for React

The block names GitHub in text, the way any integration page says what it works with ("Mergequill for GitHub", "Install on GitHub"), and ships no GitHub logo, colour or wordmark. GitHub's tile is a neutral lettermark, Gh in a muted square, in an icon slot that a code comment marks: drop in the official mark only if you have the rights to use it, under the owner's brand guidelines, and never redraw it. The pair is hidden from assistive technology because the heading already names both products.

Both buttons are links (href="#"). Point Install on GitHub at your GitHub App's installation address and View docs at your setup guide. Nothing installs, signs in or sends anything from the block itself. Install on GitHub is the block's one primary action; View docs is an outline button. Both buttons render the link they're given with render, with nativeButton={false}.

Edit READS and NEVERS at the top of the file. Each row is a title, a purpose and permission, the name GitHub shows for that repository permission. List exactly what your app requests as read-only, and the sensitive permissions it does not request as "never": GitHub shows the installer the permissions an app asks for before they confirm, so the page and the install screen should agree. The counts above each list come from the arrays.

They are the webhook events the example app subscribes to, in GitHub's own names: pull_request (when one is merged or labelled), and check_run and check_suite (when checks finish). Each needs only a read-only repository permission that the lists already show. Change EVENTS to the events your app uses; an event that needs a permission you list as "never" would contradict the page, so check each one against GitHub's webhook documentation.

Yes, and the block says so: an app that requests repository permissions lets the person installing it choose all repositories or only selected ones, and GitHub lists the requested permissions on that screen. The block only describes this; the choice happens on GitHub.

Below lg the divider gives way to a rule between the columns, which stack in reading order: the header, the mark pair and buttons, what it can read, then what it never touches. In a right-to-left layout the columns flip while permission names and event names keep their left-to-right order. The header and the buttons fade up once on load with CSS transitions; with reduced motion they simply appear. The block has no state.