"""Service list item composite aligned with Smartbank Figma design system.

Provides a list item component for service/payment lists with icon,
text label, and optional divider line.
"""

from __future__ import annotations

import pydivkit as dk

from smarty_ui.tokens.theme import Theme, default_theme


def service_list_item(
    title: str,
    *,
    icon_url: str | None = None,
    icon_size: int = 24,
    show_divider: bool = True,
    action_url: str | None = None,
    theme: Theme = default_theme,
) -> dk.DivContainer:
    """Service list item with icon and text label.

    A horizontal row with:
    - Leading icon (24x24)
    - Text label (Controls 02 - SemiBold 14px)
    - Optional bottom divider line

    Matches the Figma design for "Оплата услуг" (Payment Services) list items.

    Args:
        title: Text label for the service item
        icon_url: URL to the leading icon image
        icon_size: Size of the icon in dp (default 24)
        show_divider: Whether to show bottom divider line (default True)
        action_url: URL to navigate on tap
        theme: Theme tokens to use

    Returns:
        A DivContainer representing the service list item
    """
    # Get typography style - Controls 02 SemiBold 14px
    controls_style = theme.typography.get_controls_2(bold=False)

    # Build row items
    row_items: list[dk.Div] = []

    # Leading icon
    if icon_url:
        row_items.append(
            dk.DivImage(
                image_url=icon_url,
                width=dk.DivFixedSize(value=icon_size),
                height=dk.DivFixedSize(value=icon_size),
                scale=dk.DivImageScale.FIT,
            )
        )

    # Text label (with flex grow to fill space)
    text_element = dk.DivText(
        text=title,
        font_size=controls_style.size,
        font_weight=dk.DivFontWeight(controls_style.weight),
        text_color=theme.colors.text_primary,
        line_height=controls_style.line_height,
        width=dk.DivMatchParentSize(weight=1),
        margins=dk.DivEdgeInsets(left=14) if icon_url else None,
    )
    row_items.append(text_element)

    # Build the horizontal row
    row_kwargs: dict = {
        "orientation": dk.DivContainerOrientation.HORIZONTAL,
        "content_alignment_vertical": dk.DivAlignmentVertical.CENTER,
        "width": dk.DivMatchParentSize(),
        "items": row_items,
    }

    if action_url:
        row_kwargs["actions"] = [
            dk.DivAction(log_id=f"service_item_{title}", url=action_url)
        ]

    row = dk.DivContainer(**row_kwargs)

    # If no divider, return just the row
    if not show_divider:
        return row

    # Wrap with divider
    return dk.DivContainer(
        orientation=dk.DivContainerOrientation.VERTICAL,
        width=dk.DivMatchParentSize(),
        items=[
            row,
            # Divider line - blue-light color (#EBF2FA) with left margin to align with text
            dk.DivSeparator(
                delimiter_style=dk.DivSeparatorDelimiterStyle(
                    color=theme.colors.border,  # #EBF2FA
                ),
                width=dk.DivMatchParentSize(),
                margins=dk.DivEdgeInsets(
                    top=16,
                    left=38 if icon_url else 0,  # Align with text (24 icon + 14 gap)
                ),
            ),
        ],
    )
