stack

class Stack(Component):
    """Children ``gap`` pixels apart along the axis a subclass names.

    Inside a ``PageBuilder`` function a stack is a block: every component built
    within ``with cg.ui.HStack():`` attaches to it. ``children`` may also be
    given outright, and then belong to this stack alone.
    """

    _css_class: ClassVar[str] = "cg-stack"

    children: list[Component] = field(default_factory=list)
    gap: float = 16

    def __post_init__(self) -> None:
        """Check the props, attach to the open stack, and claim the children given outright."""
        super().__post_init__()
        Build.claim(self)

    def __enter__(self) -> Self:
        """Open this stack: components built inside the block attach to it.

        Raises:
            RuntimeError: If no ``PageBuilder`` function is running.
        """
        Build.current().push(self)
        return self

    def __exit__(self, *exc: object) -> None:
        """Close this stack."""
        Build.current().pop(self)

    def html(self, render: Render) -> str:
        """A flex box of the children."""
        return element(
            "div",
            {"class": self._css_class, "style": f"gap:{self.gap:g}px"},
            *(child.html(render) for child in self.children),
        )