import React from "react";
import { renderWithProviders } from "testUtilities";
import { DefaultTheme as theme } from "../../../theme/default";
import Flex from "./index";
var base = theme.constants.SIZE_SUB_UNIT;
it("renders", function () {
  var _renderWithProviders = renderWithProviders( /*#__PURE__*/React.createElement(Flex, null, "Content")),
    getByText = _renderWithProviders.getByText;
  expect(getByText("Content")).toBeInTheDocument();
});
it("renders with align", function () {
  var _renderWithProviders2 = renderWithProviders( /*#__PURE__*/React.createElement(Flex, {
      alignContent: "end",
      column: true
    }, "Content")),
    getByText = _renderWithProviders2.getByText;
  expect(getByText("Content")).toHaveStyleRule("display", "flex");
  expect(getByText("Content")).toHaveStyleRule("align-content", "flex-end");
  expect(getByText("Content")).toHaveStyleRule("flex-direction", "column");
});
it("renders spaces align", function () {
  var _renderWithProviders3 = renderWithProviders( /*#__PURE__*/React.createElement(Flex, {
      width: "10rem",
      border: true,
      overflow: "auto",
      padding: [1, 2, 1, 0],
      margin: [1, "auto"]
    }, "Content")),
    getByText = _renderWithProviders3.getByText;
  expect(getByText("Content")).toHaveStyleRule("width", "10rem");
  expect(getByText("Content")).toHaveStyleRule("border", "1px solid " + theme.colors.border);
  expect(getByText("Content")).toHaveStyleRule("overflow", "auto");
  expect(getByText("Content")).toHaveStyleRule("padding", base + "px " + base * 2 + "px " + base + "px 0");
  expect(getByText("Content")).toHaveStyleRule("margin", base + "px auto");
});