Trial Upgrade Multi-Action Banner Block for React

Edit PLANS at the top of the file. Each plan has a title, a badge and a list of facts, each a label and a value; set muted: true on a fact the free plan leaves out. The rows are a real description list, so a screen reader says "Custom domains, Not included".

It folds the block's rows from full height to nothing, so it ends at its top rule, then makes the card inert and moves focus to a short line that is visible only to screen readers ("Reminder set. This prompt will come back later."). To remember it, set a cookie or a flag in your own remindLater handler and read it on the server, so the card is never drawn and then removed after the first paint.

Upgrade to Pro and Compare plans are links (href="#"): point them at checkout and your pricing page. They render the link they're given with render, with nativeButton={false}.

They answer three different intents: buy, look first, or not now. Only the first is primary, a Shine Button; Compare plans is an outline button and Remind me later is a ghost, so the card never reads as a wall of equal choices. For a plain sentence with a live timer, see the trial countdown banner instead.

A date typed into a block goes stale. Pair this card with your own number of days left (or the trial countdown banner) and keep the comparison as it is: it stays true however long the trial runs.

The two columns stack, with a rule between them, and the buttons wrap in the footer with Remind me later on its own line. Nothing scrolls sideways at 320 pixels, and in a right-to-left layout the divider and the card mirror.