# tests/test_element_layout.py
from pyfuse.core.element import Element
from pyfuse.tui.adapter import LayoutAdapter
from pyfuse.tui.layout.style import FlexDirection
from pyfuse.tui.layout.types import Dimension


class TestElementLayout:
    def test_element_has_layout_style(self):
        """Elements can have layout styles."""
        elem = Element(
            flex_direction="row",
            justify_content="center",
            width=100,
            height=50,
        )

        style = LayoutAdapter().get_layout_style(elem)
        assert style.flex_direction == FlexDirection.ROW
        assert style.width == Dimension.points(100)

    def test_element_to_layout_node(self):
        """Elements can convert to LayoutNodes."""
        parent = Element(width=200, height=100, flex_direction="row")
        parent.__enter__()

        child1 = Element(flex_grow=1)
        child1.__enter__()
        child1.__exit__(None, None, None)

        child2 = Element(flex_grow=1)
        child2.__enter__()
        child2.__exit__(None, None, None)

        parent.__exit__(None, None, None)

        layout_node = LayoutAdapter().to_layout_node(parent)

        assert len(layout_node.children) == 2
        assert layout_node.style.flex_direction == FlexDirection.ROW

    def test_element_default_layout_style(self):
        """Elements with no layout props get default FlexStyle."""
        elem = Element()
        style = LayoutAdapter().get_layout_style(elem)

        assert style.flex_direction == FlexDirection.ROW
        assert style.flex_grow == 0.0

    def test_element_percent_dimension(self):
        """Elements can have percentage dimensions."""
        elem = Element(width="50%", height="100%")
        style = LayoutAdapter().get_layout_style(elem)

        assert style.width == Dimension.percent(50)
        assert style.height == Dimension.percent(100)

    def test_element_layout_props_mixed_with_other_props(self):
        """Layout props work alongside other element props."""
        elem = Element(
            id="my-element",  # regular prop
            class_="container",  # regular prop
            flex_grow=1.0,  # layout prop
            width=100,  # layout prop
        )

        # Regular props still accessible
        assert elem.props["id"] == "my-element"
        assert elem.props["class_"] == "container"

        # Layout style reflects layout props
        style = LayoutAdapter().get_layout_style(elem)
        assert style.flex_grow == 1.0
        assert style.width == Dimension.points(100)

    def test_layout_with_leaf_syntax(self):
        """Layout computation works with auto-mounted elements."""
        from pyfuse.tui.layout.compute import compute_layout
        from pyfuse.tui.layout.types import Size
        from pyfuse.ui.elements import Div, Text

        with Div(width=800, height=600) as root:
            Text("Header")
            with Div():
                Text("Content")
            Text("Footer")

        layout_node = LayoutAdapter().to_layout_node(root)
        compute_layout(layout_node, Size(800, 600))

        # Verify layout was computed for all children
        assert len(layout_node.children) == 3
        assert all(child.layout.width >= 0 for child in layout_node.children)
