Copyable Fact Sheet About Block for React

The values are constants at the top of the file (FOUNDED, HEADQUARTERS, TEAM, CLINICS, HOSPITAL_GROUPS, STAGE, LANGUAGES). FACTS builds the rows from them and BOILERPLATE builds the paragraph, so you change a fact once. "Year 1" stands for the founding year: put your own in when you use the block. All the figures are example data: replace the arrays at the top of the file with your own.

The boilerplate paragraph exactly as shown, as plain text. It uses the catalog's Copy Button, which changes its icon to a check, announces "Boilerplate copied" politely, and says "Couldn't copy" if the browser refuses the clipboard (a page not served over HTTPS, for instance). The button's width doesn't change when its label does.

The facts are a description list, so each term is followed by its answer. The paragraph sits in a figure whose caption gives its word count, and the button has its own name.

The parts fade up once on load with CSS transitions, and the copy icon fades to a check. With reduced motion they simply appear and the check doesn't scale.

One column: the header, the paragraph, the button, a rule from rail to rail, then the facts, with each term above its answer.

The split's cells carry their own padding and the block draws only its top rule, with the divider running from that rule down, so it never doubles the next block's top rule.