import { jsx } from "react/jsx-runtime";
import React from "react";
import styled, { css } from "styled-components";
import { render } from "@testing-library/react-native";
import ThemeProvider, { theme } from "../../../index.native";
import "../base.test";
describe("themeReader - web specs", () => {
  it("should render", () => {
    const Component = styled.View`
      border: ${theme.borders.small}px solid;
    `;
    const { toJSON } = render(
      /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsx(Component, { testID: "component", children: "Teste" }) })
    );
    expect(toJSON().props.style).toEqual([
      { borderWidth: 1, borderColor: "black", borderStyle: "solid" }
    ]);
  });
  it("should render with conditional", () => {
    const Component = styled.View`
      border: ${({ borders }) => borders ? css`
              ${theme.borders.small}px solid
            ` : "none"};
    `;
    const { toJSON, rerender } = render(
      /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsx(Component, { borders: false, testID: "component", children: "Teste" }) })
    );
    expect(toJSON().props.style).toEqual([
      { borderWidth: 0, borderColor: "black", borderStyle: "solid" }
    ]);
    rerender(
      /* @__PURE__ */ jsx(ThemeProvider, { children: /* @__PURE__ */ jsx(Component, { borders: true, "data-testid": "component" }) })
    );
    expect(toJSON().props.style).toEqual([
      { borderWidth: 1, borderColor: "black", borderStyle: "solid" }
    ]);
  });
});
