import { jsx, jsxs } from "react/jsx-runtime";
import React from "react";
import { render } from "@testing-library/react";
import ThemeProvider from "../../Theme";
import Stepper from "..";
describe("<Stepper />", () => {
  describe("Snapshots", () => {
    it("should match snapshot with first step active", () => {
      const { container } = render(
        /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsxs(Stepper, { activeStep: 0, children: [
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step one", children: "step one content" }),
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step two", children: "step two content" }),
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step three", children: "step three content" })
        ] }) })
      );
      expect(container).toMatchSnapshot();
    });
    it("should match snapshot with first step active and color secondary", () => {
      const { container } = render(
        /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsxs(Stepper, { activeStep: 0, secondary: true, children: [
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step one", children: "step one content" }),
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step two", children: "step two content" }),
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step three", children: "step three content" })
        ] }) })
      );
      expect(container).toMatchSnapshot();
    });
    it("should match snapshot with second step active", () => {
      const { container } = render(
        /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsxs(Stepper, { activeStep: 1, children: [
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step one", children: "step one content" }),
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step two", children: "step two content" }),
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step three", children: "step three content" })
        ] }) })
      );
      expect(container).toMatchSnapshot();
    });
  });
  describe("Steps", () => {
    it("should change the active step", () => {
      const { queryByText, rerender } = render(
        /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsxs(Stepper, { activeStep: 0, children: [
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step one", children: "step one content" }),
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step two", children: "step two content" }),
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step three", children: "step three content" })
        ] }) })
      );
      expect(queryByText("step one content")).toBeTruthy();
      expect(queryByText("step two content")).toBeFalsy();
      expect(queryByText("step three content")).toBeFalsy();
      rerender(
        /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsxs(Stepper, { activeStep: 1, children: [
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step one", children: "step one content" }),
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step two", children: "step two content" }),
          /* @__PURE__ */ jsx(Stepper.Step, { label: "step three", children: "step three content" })
        ] }) })
      );
      expect(queryByText("step one content")).toBeFalsy();
      expect(queryByText("step two content")).toBeTruthy();
      expect(queryByText("step three content")).toBeFalsy();
    });
  });
});
