import { jsx, jsxs } from "react/jsx-runtime";
import React from "react";
import { screen, render, fireEvent, cleanup } from "@testing-library/react";
import { ThemeProvider, Button } from "../..";
import Dialog from ".";
describe("<Dialog />", () => {
  afterEach(cleanup);
  it("should match snapshot", () => {
    const { baseElement } = render(
      /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsxs(Dialog, { isOpen: true, children: [
        /* @__PURE__ */ jsx(Dialog.Header, { children: "Title" }),
        /* @__PURE__ */ jsx(Dialog.Content, { children: "Subtitle" }),
        /* @__PURE__ */ jsx(Dialog.Footer, { children: /* @__PURE__ */ jsx(Button, { secondary: true, children: "Ok, got it" }) })
      ] }) })
    );
    expect(baseElement).toMatchSnapshot();
  });
  it("should match snapshot with close button", () => {
    const { baseElement } = render(
      /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsxs(Dialog, { isOpen: true, onClose: jest.fn(), children: [
        /* @__PURE__ */ jsx(Dialog.Header, { children: "Title" }),
        /* @__PURE__ */ jsx(Dialog.Content, { children: "Subtitle" }),
        /* @__PURE__ */ jsx(Dialog.Footer, { children: /* @__PURE__ */ jsx(Button, { secondary: true, children: "Ok, got it" }) })
      ] }) })
    );
    expect(baseElement).toMatchSnapshot();
  });
  it("should render a minimal dialog", () => {
    const onActionMock = jest.fn();
    render(
      /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsxs(Dialog, { isOpen: true, children: [
        /* @__PURE__ */ jsx(Dialog.Header, { children: "Title" }),
        /* @__PURE__ */ jsx(Dialog.Content, { children: "Subtitle" }),
        /* @__PURE__ */ jsx(Dialog.Footer, { children: /* @__PURE__ */ jsx(Button, { onClick: onActionMock, secondary: true, children: "Ok, got it" }) })
      ] }) })
    );
    screen.getByText("Title");
    screen.getByText("Subtitle");
    const button = screen.getByRole("button", { name: /Ok, got it/i });
    fireEvent.click(button);
    expect(onActionMock).toHaveBeenCalledTimes(1);
  });
  it("should render with close button", () => {
    const onCloseMock = jest.fn();
    render(
      /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsx(Dialog, { isOpen: true, onClose: onCloseMock, closeLabel: "Close", children: /* @__PURE__ */ jsx(Dialog.Header, { children: "Title" }) }) })
    );
    const button = screen.getByRole("button", { name: "Close" });
    fireEvent.click(button);
    expect(onCloseMock).toHaveBeenCalledTimes(1);
  });
  it("should hide the close button when hideCloseButton prop is true", () => {
    render(
      /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsx(Dialog, { isOpen: true, hideCloseButton: true, onClose: () => {
      }, children: /* @__PURE__ */ jsx(Dialog.Header, { children: "Title" }) }) })
    );
    expect(screen.queryByRole("button")).toBeNull();
  });
  it("should render content isolated by dialog id", () => {
    render(
      /* @__PURE__ */ jsxs(ThemeProvider, { children: [
        /* @__PURE__ */ jsx(Dialog, { isOpen: true, children: /* @__PURE__ */ jsx(Dialog.Header, { children: "Title" }) }),
        /* @__PURE__ */ jsx(Dialog, { isOpen: true, dialogId: "custom-id", children: /* @__PURE__ */ jsx(Dialog.Header, { children: "Second Title" }) })
      ] })
    );
    expect(screen.getByText("Title")).toBeInTheDocument();
    expect(screen.getByText("Second Title")).toBeInTheDocument();
  });
  it("should focus on the title when dialog is opened", () => {
    render(
      /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsx(Dialog, { isOpen: true, children: /* @__PURE__ */ jsx(Dialog.Header, { children: "Add e-mail" }) }) })
    );
    expect(document.activeElement).toHaveTextContent("Add e-mail");
  });
});
