from docslib import HeaderButton, run
from docslib.components import Callout, Code, H1, H2, Image, List, LocalLink, P, Table
from docslib.hooks import Component, Page


@Component
def Lead(text: str) -> str:
    return f'<p class="lead">{text}</p>'


@Page("1.", "Welcome")
def welcome():
    return [
        H1("SharedDocsLib"),
        Lead("Self-contained documentation generated directly from Python."),
        Image("architecture.svg", "Documentation architecture", caption="One HTML file, online or offline."),
        Callout("Press Ctrl+K to search all pages.", title="Quick tip"),
        P("Continue with the next guide:"),
        LocalLink("Open the quick start →", quick_start),
    ]


@Page("1.1", "Quick start")
def quick_start():
    return [
        H1("Quick start"),
        P("Define numbered pages and return a list of components."),
        Code(
            '''@Page("2", "Example")
def example():
    return [H1("Hello"), P("World")]''',
            "python",
        ),
        H2("What gets generated"),
        List(["manifest.json", "index.html", "index.zip"]),
    ]


@Page("2", "Components")
def components():
    return [
        H1("Components"),
        P("Built-ins cover the small set needed for straightforward technical documentation."),
        Table(
            ["Component", "Purpose"],
            [
                ["H1 / H2 / H3", "Headings"],
                ["P / List / Quote", "Structured text"],
                ["Image", "Embedded base64 assets"],
                ["Code / Table", "Technical content"],
            ],
        ),
    ]


if __name__ == "__main__":
    run(
        port=1234,
        host="0.0.0.0",
        title="SharedDocsLib Example",
        assets_dir="./examples/assets",
        custom_css="./examples/assets/inject.css",
        custom_js="./examples/assets/inject.js",
        live_preview=True,
        header_buttons=[
            HeaderButton("Welcome", welcome),
            HeaderButton("API reference", components),
            HeaderButton.external("Download", "/index.zip", new_tab=False),
            HeaderButton.external("GitHub", "https://github.com/"),
        ],
    )