/**
 * @jest-environment jsdom
 */
import React from "react";
import { renderWithProviders, fireEvent } from "testUtilities";
import { Button } from "./button";
describe("Button states", function () {
  it("renders disabled", function () {
    var _renderWithProviders = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        disabled: true
      })),
      container = _renderWithProviders.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("opacity", "0.4", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("pointer-events", "none", {
      modifier: "&&"
    });
  });
  it("renders a button with text being in default format", function () {
    var _renderWithProviders2 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text"
      })),
      container = _renderWithProviders2.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("text-transform", "lowercase", {
      modifier: "&&>span"
    });
    expect(button).toHaveStyleRule("text-transform", "uppercase", {
      modifier: "&&>span::first-letter"
    });
  });
  it("renders a button with text that has no text-transform", function () {
    var _renderWithProviders3 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        textTransform: "none"
      })),
      container = _renderWithProviders3.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("text-transform", "none", {
      modifier: "&&>span"
    });
  });
  it("renders a button with text being capitalized", function () {
    var _renderWithProviders4 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        textTransform: "capitalize"
      })),
      container = _renderWithProviders4.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("text-transform", "capitalize", {
      modifier: "&&>span"
    });
  });
  it("renders a button with text being in uppercase", function () {
    var _renderWithProviders5 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        textTransform: "uppercase"
      })),
      container = _renderWithProviders5.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("text-transform", "uppercase", {
      modifier: "&&>span"
    });
  });
  it("renders a button with text being in lowercase", function () {
    var _renderWithProviders6 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        textTransform: "lowercase"
      })),
      container = _renderWithProviders6.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("text-transform", "lowercase", {
      modifier: "&&>span"
    });
  });
  it("renders a button with text being in full-width", function () {
    var _renderWithProviders7 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        textTransform: "fullWidth"
      })),
      container = _renderWithProviders7.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("text-transform", "full-width", {
      modifier: "&&>span"
    });
  });
  it("renders a text with only one capital letter, the first one", function () {
    var _renderWithProviders8 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        textTransform: "firstLetter"
      })),
      container = _renderWithProviders8.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("text-transform", "lowercase", {
      modifier: "&&>span"
    });
    expect(button).toHaveStyleRule("text-transform", "uppercase", {
      modifier: "&&>span::first-letter"
    });
  });
  it("renders loading text", function () {
    var _renderWithProviders9 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        loadingLabel: "loading...",
        isLoading: true
      })),
      getByText = _renderWithProviders9.getByText;
    expect(getByText(/loading/)).toBeInTheDocument();
  });
  it("renders with icon", function () {
    var _renderWithProviders0 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        icon: "plus"
      })),
      container = _renderWithProviders0.container,
      getByText = _renderWithProviders0.getByText,
      getByTitle = _renderWithProviders0.getByTitle;
    var button = container.firstChild;
    expect(getByText(/prop text/)).toBeInTheDocument();
    expect(button).toHaveStyleRule("margin-left", "4px", {
      modifier: "&&>span"
    });
    expect(getByTitle("plus")).toBeInTheDocument();
  });
  it("renders only icon", function () {
    var _renderWithProviders1 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        flavour: "hollow",
        icon: "plus"
      })),
      container = _renderWithProviders1.container;
    var button = container.firstChild;
    expect(button).toMatchSnapshot();
  });
  it("renders smaller only icon", function () {
    var _renderWithProviders10 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        flavour: "hollow",
        icon: "plus",
        small: true
      })),
      container = _renderWithProviders10.container;
    var button = container.firstChild;
    expect(button).toMatchSnapshot();
  });
  it("renders loading icon", function () {
    var _renderWithProviders11 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        icon: "plus",
        isLoading: true
      })),
      container = _renderWithProviders11.container,
      getByText = _renderWithProviders11.getByText,
      queryByTitle = _renderWithProviders11.queryByTitle;
    expect(container.firstChild).toMatchSnapshot();
    expect(getByText(/prop text/)).toBeInTheDocument();
    expect(queryByTitle("plus")).not.toBeInTheDocument();
  });
  it("is clickable", function () {
    var onClickFn = jest.fn();
    var _renderWithProviders12 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        onClick: onClickFn
      })),
      getByText = _renderWithProviders12.getByText;
    fireEvent.click(getByText(/prop text/));
    expect(onClickFn).toHaveBeenCalled();
  });
});
describe("Default Button", function () {
  it("renders", function () {
    var _renderWithProviders13 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        textTransform: "fullWidth"
      })),
      container = _renderWithProviders13.container,
      getByText = _renderWithProviders13.getByText;
    expect(getByText(/prop text/)).toBeInTheDocument();
    var button = container.firstChild;
    expect(button).toMatchSnapshot();
    expect(button).toHaveStyleRule("background-color", "#00AB44", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("border-color", "#00AB44", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("color", "#F6F7F7", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("pointer-events", "auto", {
      modifier: "&&"
    });
  });
  it("renders for danger", function () {
    var _renderWithProviders14 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        danger: true
      })),
      container = _renderWithProviders14.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("background-color", "#DB162F", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("border-color", "#DB162F", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("color", "#F6F7F7", {
      modifier: "&&"
    });
  });
  it("renders for warning", function () {
    var _renderWithProviders15 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        warning: true
      })),
      container = _renderWithProviders15.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("background-color", "#FF9700", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("border-color", "#FF9700", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("color", "#F6F7F7", {
      modifier: "&&"
    });
  });
  it("renders neutral", function () {
    var _renderWithProviders16 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        neutral: true
      })),
      container = _renderWithProviders16.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("background-color", "#526161", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("border-color", "#526161", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("color", "#F6F7F7", {
      modifier: "&&"
    });
  });
});
describe("Hollow Button", function () {
  it("renders", function () {
    var _renderWithProviders17 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        flavour: "hollow"
      })),
      container = _renderWithProviders17.container,
      getByText = _renderWithProviders17.getByText;
    expect(getByText(/prop text/)).toBeInTheDocument();
    var button = container.firstChild;
    expect(button).toMatchSnapshot();
    expect(button).toHaveStyleRule("background-color", "rgba(255,255,255,0.0)", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("border-color", "#00AB44", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("color", "#00AB44", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("pointer-events", "auto", {
      modifier: "&&"
    });
  });
  it("renders for danger", function () {
    var _renderWithProviders18 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        flavour: "hollow",
        danger: true
      })),
      container = _renderWithProviders18.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("background-color", "rgba(255,255,255,0.0)", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("border-color", "#DB162F", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("color", "#DB162F", {
      modifier: "&&"
    });
  });
  it("renders for warning", function () {
    var _renderWithProviders19 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        flavour: "hollow",
        warning: true
      })),
      container = _renderWithProviders19.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("background-color", "rgba(255,255,255,0.0)", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("border-color", "#FF9700", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("color", "#FF9700", {
      modifier: "&&"
    });
  });
  it("renders for neutral", function () {
    var _renderWithProviders20 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        flavour: "hollow",
        neutral: true
      })),
      container = _renderWithProviders20.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("background-color", "rgba(255,255,255,0.0)", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("border-color", "#C0CACA", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("color", "#526161", {
      modifier: "&&"
    });
  });
});
describe("Borderless Button", function () {
  it("renders", function () {
    var _renderWithProviders21 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        flavour: "borderless"
      })),
      container = _renderWithProviders21.container,
      getByText = _renderWithProviders21.getByText;
    expect(getByText(/prop text/)).toBeInTheDocument();
    var button = container.firstChild;
    expect(button).toMatchSnapshot();
    expect(button).toHaveStyleRule("background-color", "rgba(255,255,255,0.0)", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("border-color", "rgba(255,255,255,0.0)", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("color", "#00AB44", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("pointer-events", "auto", {
      modifier: "&&"
    });
  });
  it("renders for danger", function () {
    var _renderWithProviders22 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        flavour: "borderless",
        danger: true
      })),
      container = _renderWithProviders22.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("background-color", "rgba(255,255,255,0.0)", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("border-color", "rgba(255,255,255,0.0)", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("color", "#DB162F", {
      modifier: "&&"
    });
  });
  it("renders for warning", function () {
    var _renderWithProviders23 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        flavour: "borderless",
        warning: true
      })),
      container = _renderWithProviders23.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("background-color", "rgba(255,255,255,0.0)", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("border-color", "rgba(255,255,255,0.0)", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("color", "#FF9700", {
      modifier: "&&"
    });
  });
  it("renders for neutral", function () {
    var _renderWithProviders24 = renderWithProviders(/*#__PURE__*/React.createElement(Button, {
        label: "Test prop text",
        flavour: "borderless",
        neutral: true
      })),
      container = _renderWithProviders24.container;
    var button = container.firstChild;
    expect(button).toHaveStyleRule("background-color", "rgba(255,255,255,0.0)", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("border-color", "rgba(255,255,255,0.0)", {
      modifier: "&&"
    });
    expect(button).toHaveStyleRule("color", "#526161", {
      modifier: "&&"
    });
  });
});