"""Step view widget — renders a single lesson step with explanation, code, and callouts."""

from __future__ import annotations

from textual.app import ComposeResult
from textual.widgets import Collapsible, Label, Markdown, Static

from cde_onboard.models import LessonStep
from cde_onboard.widgets.code_panel import CodePanel
from cde_onboard.widgets.info_panel import InfoPanel


class StepView(Static):
    """Renders a single teaching step within a lesson."""

    DEFAULT_CSS = """
    StepView {
        margin-bottom: 1;
        padding: 1;
    }
    """

    def __init__(self, step: LessonStep, step_number: int) -> None:
        super().__init__()
        self._step = step
        self._step_number = step_number

    def compose(self) -> ComposeResult:
        yield Label(
            f"[bold cyan]Step {self._step_number}: {self._step.title}[/bold cyan]",
            classes="step-title",
        )
        yield Markdown(self._step.explanation, classes="step-explanation")

        if self._step.code is not None:
            yield CodePanel(
                source=self._step.code.source,
                language=self._step.code.language,
                filename=self._step.code.filename,
            )

        if self._step.why is not None:
            yield InfoPanel(self._step.why, title="Why?")

        if self._step.deep_dive is not None:
            with Collapsible(title="Deep Dive", collapsed=True):
                yield Markdown(self._step.deep_dive, classes="deep-dive-content")
