next

.design-sync/ds-src/Display.tsx

@@ -0,0 +1,12 @@
+import type { ReactNode } from 'react';
+
+export interface DisplayProps {
+  /** h1 by default. One h1 per page. */
+  as?: 'h1' | 'h2' | 'p';
+  children?: ReactNode;
+}
+
+/** The largest type on the page. Break its lines by hand; it is a composed object. */
+export function Display({ as: Tag = 'h1', children }: DisplayProps) {
+  return <Tag className="display">{children}</Tag>;
+}