function OverlayWithButtonProto()

in packages/palette-mantine-core/palette.tsx [2209:2236]


function OverlayWithButtonProto() {
  const [visible, setVisible] = useState(false);

  return (
    <div
      style={{
        width: 200,
        height: 100,
        position: "relative",
      }}
    >
      <div
        style={{
          width: "100%",
          height: "100%",
          background: "gray"
        }}
        onClick={() => setVisible(false)}
      >
        Content
      </div>
      {!visible && (
        <Overlay blur={15} center>
          <Button color="red" radius="xl" onClick={() => setVisible(true)}>
            NSFW, click to reveal
          </Button>
        </Overlay>
      )}