Webhook Events Changelog Block for React

Edit EVENTS at the top of the file, newest first. An event has an id, a name, a kind (NEW, UPDATED or DEPRECATED), a line, a date as an ISO day and its payload as a string. The headline, the sentence under it, the filter counts and every row come from that list, and the payload you write is the text that is shown and copied.

Each row carries an outline tag with an icon and a word: a sparkle and "New", a rising arrow and "Updated", an archive box and "Deprecated". The filter buttons use the same words and show how many events each holds.

It copies the open row's payload exactly as shown, swaps its icon for a check and, through a polite status line, says "Copied the example payload of delivery.retried". If the clipboard refuses it says it couldn't copy. Nothing is sent anywhere.

No. The rows you filter out are replaced in place and the full list is drawn once more, unseen, in the same cell with the same row open, so the block is always as tall as the unfiltered list. If you hide the open event, it stays open for when you bring it back.

Each row's trigger is a button: Enter or Space opens and closes it, and one event is open at a time. The filter is one tab stop and the arrow keys move between its buttons. Inside an open row Tab reaches the Copy button and then the payload region, which scrolls with the arrow keys. Tab moves between the rows; the arrow keys don't.

On a phone the name, the tag, the line and the day stack inside the row and the payload scrolls sideways in its region. Names, payloads and dates keep their reading order in a right-to-left layout while the rows and the filter mirror.