### AirDragon Page Setup with ad.layout()

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

Shows the essential setup for an AirDragon page, emphasizing the necessity of wrapping page content within `ad.layout()` to include BasecoatUI CSS/JS and TailwindCSS.

```python
import air
import airdragon as ad

app = air.Air()

@app.page
def index():
    return ad.layout(
        air.Title("My App"),
        ad.H1("Welcome"),
        # ... rest of content
    )
```

--------------------------------

### Complete Page Layout Example

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

A comprehensive example demonstrating the integration of various AirDragon components to build a complete page layout. It includes headers, articles, cards, forms, and button groups, showcasing the practical application of the library.

```python
import air
import airdragon as ad

app = air.Air()

@app.page
def index():
    return ad.layout(
        air.Title("My App"),
        ad.H1("Dashboard"),
        air.P("Welcome to the dashboard."),

        ad.Article(
            ad.Card(
                air.Header(ad.H2("Users")),
                ad.AvatarGroup(
                    ad.Avatar(src="/avatars/1.jpg"),
                    ad.Avatar(src="/avatars/2.jpg"),
                ),
            ),
            ad.Card(
                air.Header(ad.H2("Actions")),
                ad.ButtonGroup(
                    ad.Button("Create"),
                    ad.Button("Export", modifier=ad.ButtonMods.secondary),
                ),
            ),
        ),

        ad.Card(
            ad.H3("Quick Search"),
            air.Fieldset(
                ad.Input(type="search", name="q", placeholder="Search..."),
                ad.Button("Go"),
                role="group",
            ),
        ),
    )
```

--------------------------------

### AirDragon Form with Labels Example

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

Illustrates the structure for creating a form with input fields and associated labels using AirDragon's `Form`, `Input`, `Label`, and `Div` components, along with standard Air `Div` for layout.

```python
ad.Form(
    air.Div(
        air.Label("Email", class_="label", for_="email"),
        ad.Input(id="email", type="email", placeholder="you@example.com"),
        class_="grid gap-3",
    ),
    air.Div(
        air.Label("Password", class_="label", for_="password"),
        ad.Input(id="password", type="password"),
        class_="grid gap-3",
    ),
    ad.Button("Sign In", type="submit"),
)
```

--------------------------------

### AirDragon Search Bar Pattern

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

Provides a code example for creating a common search bar component using AirDragon's `Card`, `Input`, and `Button` components, wrapped in an `air.Fieldset` for structure.

```python
ad.Card(
    air.Fieldset(
        ad.Input(type="search", name="q", placeholder="Search..."),
        ad.Button("Search"),
        role="group",
    ),
)
```

--------------------------------

### AirDragon Search Bar with HTMX

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

Demonstrates implementing a search bar with real-time HTMX integration, showing how to use `hx_get`, `hx_trigger`, `hx_target`, and `hx_include` attributes on AirDragon components.

```python
ad.Card(
    air.Fieldset(
        ad.Input(
            type="search",
            name="q",
            id="q",
            placeholder="Search...",
            hx_get="/search",
            hx_trigger="keyup changed delay:300ms",
            hx_target="#results",
        ),
        ad.Button("Search", hx_get="/search", hx_include="#q"),
        role="group",
    ),
)
```

--------------------------------

### Install AirDragon Python Package

Source: https://github.com/feldroy/airdragon/blob/main/README.md

This command installs the AirDragon Python package using the `uv` package manager. Ensure `uv` is installed and configured in your environment.

```bash
uv add airdragon
```

--------------------------------

### AirDragon Component Usage vs. Standard Air

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

Demonstrates how AirDragon simplifies component instantiation by automatically applying BasecoatUI classes, contrasting with the more verbose standard Air framework usage.

```python
# Without AirDragon (verbose):
air.Button("Click", class_="btn")
air.Input(class_="input", type="email")
air.A("Link", href="/", class_="link")

# With AirDragon (clean):
ad.Button("Click")           # -> <button class="btn">Click</button>
ad.Input(type="email")       # -> <input type="email" class="input"/>
ad.Link("Link", href="/")    # -> <a href="/" class="link">Link</a>
```

--------------------------------

### Navigation Bar with Links

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

Creates a navigation bar using the `air.Nav` component, containing an unordered list (`air.Ul`) of links (`ad.Link`). This is useful for site-wide navigation elements.

```python
air.Nav(
    air.Ul(
        air.Li(ad.Link("Home", href="/")),
        air.Li(ad.Link("About", href="/about")),
        air.Li(ad.Link("Contact", href="/contact")),
    ),
)
```

--------------------------------

### AirDragon Modifier Usage for Variants

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

Demonstrates how to use the `modifier` argument with `ad.ButtonMods` and `ad.Mods` to apply different visual variants and styles to components.

```python
ad.Button("Delete", modifier=ad.ButtonMods.destructive)
# -> <button class="btn-destructive">Delete</button>

ad.Button("Cancel", modifier=ad.ButtonMods.secondary)
# -> <button class="btn-secondary">Cancel</button>

ad.Alert("Error!", modifier=ad.Mods.destructive)
# -> <div class="alert-destructive">Error!</div>
```

--------------------------------

### Mixing AirDragon and Air Components

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

Shows how to freely mix AirDragon's styled components (`ad.*`) with Air's structural components (`air.*`) within the same hierarchy for flexible UI construction.

```python
ad.Card(
    air.Header(ad.H2("Title")),      # air for structure, ad for styled heading
    air.Section(air.P("Content")),
    air.Footer(ad.Button("Save")),
)
```

--------------------------------

### AirDragon Card with Header, Section, and Footer

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

Shows a complex AirDragon `Card` component comprising a header with title and description, a main content section, and a footer with a button group, demonstrating composition.

```python
ad.Card(
    air.Header(
        ad.H2("Card Title"),
        air.P("Description text"),
    ),
    air.Section(
        air.P("Main content goes here..."),
    ),
    air.Footer(
        ad.ButtonGroup(
            ad.Button("Save"),
            ad.Button("Cancel", modifier=ad.ButtonMods.secondary),
        ),
    ),
)
```

--------------------------------

### AirDragon Input Field Examples

Source: https://context7.com/feldroy/airdragon/llms.txt

Demonstrates various configurations for the AirDragon Input component, including text, email, search, and password fields. It showcases standard HTML attributes, custom classes, validation, and HTMX integration for dynamic search inputs.

```python
import airdragon as ad

# Text input with placeholder
text_input = ad.Input(
    type="text",
    name="username",
    placeholder="Enter username"
)
# <input type="text" name="username" placeholder="Enter username" class="input"/>

# Email input with validation
email = ad.Input(
    type="email",
    id="user-email",
    name="email",
    placeholder="user@example.com",
    required=True,
    autofocus=True
)

# Search input with HTMX live search
search = ad.Input(
    type="search",
    name="query",
    placeholder="Type to search...",
    hx_get="/api/search",
    hx_trigger="keyup changed delay:500ms",
    hx_target="#search-results",
    hx_indicator="#loading"
)

# Password input with custom classes
password = ad.Input(
    type="password",
    name="pwd",
    placeholder="Password",
    class_="text-lg"
)
# <input type="password" name="pwd" placeholder="Password" class="input text-lg"/>
```

--------------------------------

### Card Grid with Links

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

Generates a grid of cards, where each card displays a title as a link and a description. This component is ideal for showcasing lists of items or features.

```python
ad.Article(
    *[ad.Card(
        ad.H3(ad.Link(item.title, href=f"/items/{item.id}")),
        air.P(item.description),
    ) for item in items],
)
```

--------------------------------

### AirDragon Link Component Examples

Source: https://context7.com/feldroy/airdragon/llms.txt

Showcases the AirDragon Link component, which renders styled anchor (<a>) elements with the 'link' class. It supports standard attributes like href, target, and rel, and can be used for basic navigation, external links, or nested within other components.

```python
import air
import airdragon as ad

# Basic link
link = ad.Link("Visit Homepage", href="/")
# <a href="/" class="link">Visit Homepage</a>

# External link opening in new tab
external = ad.Link(
    "Documentation",
    href="https://docs.example.com",
    target="_blank",
    rel="noopener noreferrer"
)

# Link with nested content
styled = ad.Link(
    air.Strong("Important:"),
    " Read our terms",
    href="/terms"
)
# <a href="/terms" class="link"><strong>Important:</strong> Read our terms</a>

# Link in card header
card_link = ad.Card(
    air.Header(
        ad.H3(ad.Link("Article Title", href="/articles/123"))
    ),
    air.P("Article preview text goes here...")
)
```

--------------------------------

### AirDragon Class Appending Convention

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

Illustrates AirDragon's convention where the `class_` argument appends new classes to existing ones, rather than replacing them, ensuring flexibility in styling.

```python
ad.Button("Click", class_="mt-4")
# -> <button class="btn mt-4">Click</button>
```

--------------------------------

### Avatar Group Display

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

Renders a group of user avatars. This component is typically used to visually represent a collection of users, such as team members or participants.

```python
ad.AvatarGroup(
    ad.Avatar(src="https://example.com/user1.jpg"),
    ad.Avatar(src="https://example.com/user2.jpg"),
    ad.Avatar(src="https://example.com/user3.jpg"),
)
```

--------------------------------

### AirDragon Button Modifier Options

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

Lists the available modifier constants for `ad.Button` to control its appearance, including destructive, secondary, outline, ghost, link styles, and size variations.

```python
ad.ButtonMods.destructive  # Red/danger button
ad.ButtonMods.secondary    # Secondary style
ad.ButtonMods.outline      # Outline style
ad.ButtonMods.ghost        # Ghost/minimal style
ad.ButtonMods.link         # Looks like a link
ad.ButtonMods.sm           # Small size
ad.ButtonMods.lg           # Large size
```

--------------------------------

### Alert Message Variants

Source: https://github.com/feldroy/airdragon/blob/main/AGENTS.md

Displays alert messages with different visual styles (variants). It supports default, secondary, and destructive modifiers for conveying various types of information or warnings.

```python
ad.Alert("Info message")                              # Default
ad.Alert("Warning!", modifier=ad.Mods.secondary)     # Secondary
ad.Alert("Error!", modifier=ad.Mods.destructive)     # Destructive
```

--------------------------------

### Create Search Form with HTMX

Source: https://context7.com/feldroy/airdragon/llms.txt

Defines a search form using AirDragon's Form and Input components. The input field is configured with HTMX directives for live search functionality, triggering a GET request on keyup events.

```python
search_form = ad.Form(
    air.Fieldset(
        ad.Input(
            type="search",
            name="q",
            placeholder="Search products...",
            hx_get="/search",
            hx_trigger="keyup changed delay:300ms",
            hx_target="#results"
        ),
        ad.Button("Search", type="submit"),
        role="group"
    )
)
```

--------------------------------

### Create HTMX Navigation Link with AirDragon

Source: https://context7.com/feldroy/airdragon/llms.txt

Generates an HTMX navigation link using AirDragon's Link component. This component is configured with attributes for GET requests, target element, and URL pushing, suitable for Single Page Applications.

```python
import airdragon as ad

spa_link = ad.Link(
    "Next Page",
    href="/page/2",
    hx_get="/page/2",
    hx_target="#content",
    hx_push_url="true"
)
```

--------------------------------

### Jinja Base Template with AirDragon Dependencies

Source: https://github.com/feldroy/airdragon/blob/main/README.md

This HTML snippet includes the necessary CDN links for BasecoatUI and Lucide icons, which are often used with AirDragon. It serves as a base template for Jinja environments when not using AirDragon's `layout()` function directly.

```html
<!doctype html>
<html>
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/basecoat-css@0.3.6/dist/basecoat.cdn.min.css">
    <script src="https://cdn.jsdelivr.net/npm/basecoat-css@0.3.6/dist/js/all.min.js" defer></script>
    <script src="https://unpkg.com/lucide@latest"></script>    
    <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
  </head>
  <body>
    <!-- Your content goes here -->
  </body>
</html>
```

--------------------------------

### Create Alerts and Badges with AirDragon

Source: https://context7.com/feldroy/airdragon/llms.txt

Demonstrates the creation of notification alerts and status badges using AirDragon components. Supports various modifiers like destructive, secondary, and outline for styling. Alerts can include icons, and badges can be used inline or within other components like cards.

```python
import airdragon as ad
import air # Assuming 'air' is used for Span and other elements

# Default alert
info = ad.Alert("Your changes have been saved")
# <div class="alert">Your changes have been saved</div>

# Destructive alert
error = ad.Alert(
    "Error: Invalid credentials",
    modifier=ad.Mods.destructive
)
# <div class="alert-destructive">Error: Invalid credentials</div>

# Secondary alert with icon
warning = ad.Alert(
    air.Span("⚠️", class_="mr-2"),
    "This action cannot be undone",
    modifier=ad.Mods.secondary
)

# Badge for status
status = ad.Badge("New")
# <span class="badge">New</span>

# Badge with modifier
urgent = ad.Badge("Urgent", modifier=ad.Mods.destructive)
# <span class="badge-destructive">Urgent</span>

# Badges in card
product = ad.Card(
    air.Header(
        ad.H3("Product Name"),
        ad.Badge("On Sale", modifier=ad.Mods.secondary)
    ),
    air.P("Product description...")
)
```

--------------------------------

### Basic AirDragon Usage in an Air Application

Source: https://github.com/feldroy/airdragon/blob/main/README.md

This Python code demonstrates how to use AirDragon within an Air application. It imports the necessary modules and defines a simple page with a heading and a card component, showcasing the usage of `ad.layout()`, `ad.H1`, `ad.Card`, `ad.ButtonGroup`, and `ad.Button`.

```python
import air
import airdragon as ad

app = air.Air()

@app.page
def index():
    return ad.layout(
        # Adding a class_ to an AirDragon tag appends it to the list of
        # tailwind classes applied to that tag by AirDragon.
        # So this will be 
        # <h1 class="text-3xl sm:text-4xl font-semibold leading-tight Dragons">
        ad.H1('Hello, world', class_='Dragons'),
        ad.Card(
            air.Header(
                air.H2('Card title'),
                air.P('I am a handy paragraph.')
            ),
            air.Section(
                ad.ButtonGroup(
                    ad.Button('Click me'),
                    ad.Button("Don't click me", modifier=ad.ButtonMods.destructive)
                )
            )        
        )
    )
```

--------------------------------

### Page Layout Wrapper using AirDragon

Source: https://context7.com/feldroy/airdragon/llms.txt

The `layout()` function creates a complete HTML document structure, including necessary BasecoatUI and TailwindCSS dependencies. It handles meta tags, stylesheets, JavaScript, and wraps content within a responsive container. This is the primary function for setting up a new page.

```python
import air
import airdragon as ad

app = air.Air()

@app.page
def index():
    return ad.layout(
        ad.H1("Welcome to AirDragon"),
        ad.Article(
            ad.Card(
                air.Header(
                    ad.H2("Getting Started"),
                    air.P("Build UIs without learning Tailwind classes")
                ),
                air.Section(
                    ad.ButtonGroup(
                        ad.Button("Documentation"),
                        ad.Button("Examples")
                    )
                )
            )
        )
    )
# Renders complete HTML with:
# - charset and viewport meta tags
# - BasecoatUI CSS (v0.3.6)
# - Lucide icons library
# - Tailwind browser runtime
# - Centered max-w-3xl container with gradient background
```

--------------------------------

### Create Button Groups with AirDragon

Source: https://context7.com/feldroy/airdragon/llms.txt

Shows how to group multiple buttons using AirDragon's ButtonGroup component. Ensures consistent spacing and accessibility with `role="group"`. Supports various button modifiers for different actions.

```python
import airdragon as ad

# Simple button group
actions = ad.ButtonGroup(
    ad.Button("Save"),
    ad.Button("Cancel", modifier=ad.ButtonMods.outline)
)
# <div class="button-group" role="group">
#   <button class="btn">Save</button>
#   <button class="btn-outline">Cancel</button>
# </div>

# Button group with multiple variants
toolbar = ad.ButtonGroup(
    ad.Button("New", modifier=ad.ButtonMods.secondary),
    ad.Button("Edit"),
    ad.Button("Delete", modifier=ad.ButtonMods.destructive)
)

# Button group in form
form = ad.Form(
    ad.H3("Update Profile"),
    ad.Input(type="text", name="name", placeholder="Full name"),
    ad.Input(type="email", name="email", placeholder="Email"),
    ad.ButtonGroup(
        ad.Button("Update", type="submit"),
        ad.Button("Reset", type="reset", modifier=ad.ButtonMods.ghost),
        ad.Button("Cancel", modifier=ad.ButtonMods.outline)
    )
)
```

--------------------------------

### Create Flex Layout Articles with AirDragon

Source: https://context7.com/feldroy/airdragon/llms.txt

Utilizes AirDragon's Article component for flexible, responsive content layout using flexbox. It defaults to a column layout on mobile and switches to a row layout with wrapping on larger screens. Supports nesting various components like Cards and Avatars.

```python
import air
import airdragon as ad

# Article with multiple cards
dashboard = ad.Article(
    ad.Card(
        air.Header(ad.H3("Card 1")),
        air.P("First card content")
    ),
    ad.Card(
        air.Header(ad.H3("Card 2")),
        air.P("Second card content")
    ),
    ad.Card(
        air.Header(ad.H3("Card 3")),
        air.P("Third card content")
    )
)
# <article class="flex flex-col gap-4 sm:flex-row sm:flex-wrap py-2">
#   ... cards rendered here ...
# </article>

# Article with mixed content
page = ad.layout(
    ad.H1("Dashboard"),
    ad.Article(
        ad.AvatarGroup(
            ad.Avatar(src="https://avatars.githubusercontent.com/u/111"),
            ad.Avatar(src="https://avatars.githubusercontent.com/u/222")
        ),
        ad.Card(
            air.Header(ad.H2("Team Status")),
            air.P("All systems operational")
        )
    )
)
```

--------------------------------

### Form Layout Component using AirDragon

Source: https://context7.com/feldroy/airdragon/llms.txt

The `Form` component structures form elements using a grid layout with consistent spacing, applying BasecoatUI's form styling. It is designed to work seamlessly with Air's form elements and AirDragon's `Input` component, facilitating the creation of organized and visually appealing forms.

```python
import air
import airdragon as ad

# Login form with validation
login_form = ad.Form(
    ad.H3("Sign In"),
    air.Div(
        air.Label("Email", for_="email", class_="label"),
        ad.Input(
            type="email",
            id="email",
            name="email",
            placeholder="you@example.com",
            required=True
        ),
        class_="grid gap-3"
    ),
    air.Div(
        air.Label("Password", for_="password", class_="label"),
        ad.Input(
            type="password",
            id="password",
            name="password",
            placeholder="Enter password",
            required=True
        ),
        class_="grid gap-3"
    ),
    ad.ButtonGroup(
        ad.Button("Log In", type="submit"),
        ad.Button("Reset", type="reset", modifier=ad.ButtonMods.outline)
    )
)
```

--------------------------------

### AirDragon Typography Components (H1, H2, H3)

Source: https://context7.com/feldroy/airdragon/llms.txt

Demonstrates the use of AirDragon's H1, H2, and H3 components for semantic headings. These components utilize Tailwind CSS for responsive typography, ensuring proper visual hierarchy across different screen sizes. Custom classes can also be applied.

```python
import airdragon as ad

# Page title
title = ad.H1("Welcome to Our Platform")
# <h1 class="text-3xl sm:text-4xl font-semibold leading-tight">Welcome to Our Platform</h1>

# Section heading
section = ad.H2("Features")
# <h2 class="text-2xl sm:text-3xl font-semibold leading-tight">Features</h2>

# Subsection heading
subsection = ad.H3("Authentication")
# <h3 class="text-xl sm:text-2xl font-semibold leading-tight">Authentication</h3>

# Heading with custom classes
custom = ad.H1("Hero Title", class_="text-center text-blue-600")
# <h1 class="text-3xl sm:text-4xl font-semibold leading-tight text-center text-blue-600">Hero Title</h1>

# Complete page structure
page = ad.layout(
    ad.H1("Product Dashboard"),
    ad.Article(
        ad.H2("Recent Activity"),
        ad.Card(
            ad.H3("Today's Stats"),
            air.P("Sales: $12,345")
        )
    )
)
```

--------------------------------

### AirDragon Avatar and AvatarGroup Components

Source: https://context7.com/feldroy/airdragon/llms.txt

Illustrates the usage of Avatar and AvatarGroup components for displaying user profile images. Avatars are circular images, and AvatarGroup stacks multiple avatars with overlapping effects using Tailwind CSS for styling and sizing.

```python
import air
import airdragon as ad

# Single avatar
avatar = ad.Avatar(src="https://avatars.githubusercontent.com/u/62857")
# <img src="..." class="size-8 shrink-0 object-cover rounded-full"/>

# Avatar with custom size
large_avatar = ad.Avatar(
    src="https://example.com/user.jpg",
    class_="size-16"
)

# Avatar group showing multiple users
team = ad.AvatarGroup(
    ad.Avatar(src="https://avatars.githubusercontent.com/u/62857"),
    ad.Avatar(src="https://avatars.githubusercontent.com/u/74739"),
    ad.Avatar(src="https://avatars.githubusercontent.com/u/12345")
)
# <div class="flex -space-x-3">
#   <img src="..." class="size-8 shrink-0 object-cover rounded-full"/>
#   <img src="..." class="size-8 shrink-0 object-cover rounded-full"/>
#   <img src="..." class="size-8 shrink-0 object-cover rounded-full"/>
# </div>

# List of individual avatars (non-overlapping)
user_list = air.Ul(
    air.Li(ad.Avatar(src="https://avatars.githubusercontent.com/u/111")),
    air.Li(ad.Avatar(src="https://avatars.githubusercontent.com/u/222")),
    air.Li(ad.Avatar(src="https://avatars.githubusercontent.com/u/333"))
)
```

--------------------------------

### Card Container Component using AirDragon

Source: https://context7.com/feldroy/airdragon/llms.txt

The `Card` component provides a styled container for grouping related content, featuring BasecoatUI's design for spacing and borders. It integrates well with Air's `Header` and `Section` elements for semantic structure and can accept custom classes and IDs for further styling and identification.

```python
import air
import airdragon as ad

# Simple card
card = ad.Card(
    air.Header(
        ad.H2("Card Title"),
        air.P("Subtitle or description")
    ),
    air.Section(
        air.P("Main content goes here"),
        ad.ButtonGroup(
            ad.Button("Action"),
            ad.Button("Cancel", modifier=ad.ButtonMods.outline)
        )
    )
)

# Card with custom styling
custom_card = ad.Card(
    air.Header(ad.H3("Statistics")),
    air.Section(
        air.P("Views: 1,234"),
        air.P("Clicks: 567")
    ),
    class_="shadow-lg",
    id="stats-card"
)
# <div class="card shadow-lg" id="stats-card">...</div>
```

--------------------------------

### Interactive Button Component using AirDragon

Source: https://context7.com/feldroy/airdragon/llms.txt

The `Button` component renders styled HTML buttons using BasecoatUI classes. It supports various visual modifiers like 'destructive', 'secondary', 'outline', 'ghost', and 'link', along with size variants. It also allows for the addition of custom classes and HTMX attributes for dynamic interactions.

```python
import airdragon as ad

# Basic button
basic = ad.Button("Click me")
# <button class="btn">Click me</button>

# Destructive button with modifier
destructive = ad.Button(
    "Delete Account",
    modifier=ad.ButtonMods.destructive
)
# <button class="btn-destructive">Delete Account</button>

# Ghost button with custom classes
ghost = ad.Button(
    "Cancel",
    modifier=ad.ButtonMods.ghost,
    class_="w-full"
)
# <button class="btn-ghost w-full">Cancel</button>

# Button with HTMX attributes
htmx_button = ad.Button(
    "Load More",
    hx_get="/api/items",
    hx_target="#items-list",
    hx_trigger="click"
)
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.