DeprecatedModalSlideshow

DeprecatedModalSlideshow is a special Modal using a Slideshow as header.

View source code

Basic usage

const Demo = () => {
  const [isOpen, setIsOpen] = useState(false);

  return (
    <>
      <Button text="Open the modal" onClick={() => setIsOpen(true)} />
      <DeprecatedModalSlideshow
        slides={[
          {
            title: "Title slide 1",
            content: "Content slide 1",
            illustration: <img src="/slide-1.webp" alt="" />,
          },
          {
            title: "Title slide 2",
            content: "Content slide 2",
            illustration: <img src="/slide-2.webp" alt="" />,
          },
          {
            title: "Title slide 3",
            content: "Content slide 3",
            illustration: <img src="/slide-3.webp" alt="" />,
          },
        ]}
        translations={{
          cancel: "Cancel",
          previous: "Back",
          next: "Next",
          done: "Action wording",
        }}
        isOpen={isOpen}
        onCancel={() => setIsOpen(false)}
        onClose={() => setIsOpen(false)}
        onDone={() => setIsOpen(false)}
      />
    </>
  );
};