Film and community

Spoiler

Content with spoilers, hidden until the reader asks for it.

import { Spoiler } from '@iffday/web/src/components';

Example

With spoiler set, the content is replaced by a button, Contains spoilers. Reveal, and appears once clicked; without it the content shows straight away. The text is already in the page and only waits to render. When the text has to be fetched, open it the way ShortReview does.

import { Spoiler } from '@iffday/web/src/components';
import { reviews } from '../../../samples';

export default function Example() {
  return (
    <div style={{ width: 'min(100%, 520px)' }}>
      <Spoiler spoiler>
        <p>{reviews[1]!.body}</p>
      </Spoiler>
    </div>
  );
}

Props

Spoiler

apps/web/src/components.tsx:247

Prop	Type	Default
`spoiler*`	`boolean`
`children*`	`ReactNode`

Not used directly in apps/web yet.