import React from "react";
import { Dialog } from "../../";

export default (
  <div className="m-5 position-relative">
    <Dialog onClose={() => {}} isRelative>
      <Dialog.Header expandable={false} help="Info about Dialog" title="Title" />
      <Dialog.Content>
        <div>1</div>
        <div>2</div>
        <div>3</div>
        <div>4</div>
        <div>5</div>
        <div>1</div>
        <div>2</div>
        <div>3</div>
        <div>4</div>
        <div>5</div>
        <div>1</div>
        <div>2</div>
        <div>3</div>
      </Dialog.Content>
      <Dialog.Footer>
        <Dialog.Button onClick={() => console.log("onClose")} text="Cancel" type="cancel" />
        <Dialog.Button onClick={() => console.log("onSubmit")} text="OK" type="submit" />
      </Dialog.Footer>
      <Dialog.Attention>
        <div className="alert alert-light mx-3 mb-0">Attention</div>
        <Dialog.Footer className="border-top-0">
          <Dialog.Button onClick={() => console.log("onClose")} text="Cancel" type="cancel" />
          <Dialog.Button onClick={() => console.log("onSubmit")} text="OK" type="submit" />
        </Dialog.Footer>
      </Dialog.Attention>
    </Dialog>
  </div>
);
