# States


<!-- WARNING: THIS FILE WAS AUTOGENERATED! DO NOT EDIT! -->

## render_placeholder_card

Rendered in viewport slots that fall outside the items list (e.g.,
before the first item or after the last).

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

<a
href="https://github.com/cj-mills/cjm-fasthtml-card-stack/blob/main/cjm_fasthtml_card_stack/components/states.py#L33"
target="_blank" style="float:right; font-size:smaller">source</a>

### render_placeholder_card

``` python

def render_placeholder_card(
    placeholder_type:Literal, # Which edge of the list
)->Any: # Placeholder card component

```

*Render a placeholder card for viewport edges.*

``` python
# Test render_placeholder_card
from fasthtml.common import to_xml

start_card = render_placeholder_card("start")
html = to_xml(start_card)
assert "Beginning" in html
assert 'data-placeholder-type="start"' in html

end_card = render_placeholder_card("end")
html = to_xml(end_card)
assert "End" in html
assert 'data-placeholder-type="end"' in html
print("render_placeholder_card tests passed!")
```

    render_placeholder_card tests passed!

## render_loading_state

Displayed while the card stack is initializing (e.g., fetching items
from a service).

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

<a
href="https://github.com/cj-mills/cjm-fasthtml-card-stack/blob/main/cjm_fasthtml_card_stack/components/states.py#L60"
target="_blank" style="float:right; font-size:smaller">source</a>

### render_loading_state

``` python

def render_loading_state(
    ids:CardStackHtmlIds, # HTML IDs for this card stack instance
    message:str='Loading...', # Loading message text
)->Any: # Loading component

```

*Render loading state with spinner and message.*

``` python
# Test render_loading_state
ids = CardStackHtmlIds(prefix="cs0")
loading_el = render_loading_state(ids)
html = to_xml(loading_el)
assert 'id="cs0-loading"' in html
assert "Loading..." in html

# Test custom message
loading_el = render_loading_state(ids, message="Initializing segments...")
html = to_xml(loading_el)
assert "Initializing segments..." in html
print("render_loading_state tests passed!")
```

    render_loading_state tests passed!

## render_empty_state

Displayed when the items list is empty.

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

<a
href="https://github.com/cj-mills/cjm-fasthtml-card-stack/blob/main/cjm_fasthtml_card_stack/components/states.py#L81"
target="_blank" style="float:right; font-size:smaller">source</a>

### render_empty_state

``` python

def render_empty_state(
    ids:CardStackHtmlIds, # HTML IDs for this card stack instance
    title:str='No items available', # Main empty state message
    subtitle:str='', # Optional subtitle text
)->Any: # Empty state component

```

*Render empty state when no items exist.*

``` python
# Test render_empty_state
ids = CardStackHtmlIds(prefix="cs0")
empty_el = render_empty_state(ids)
html = to_xml(empty_el)
assert 'id="cs0-card-stack-empty"' in html
assert "No items available" in html

# Test with subtitle
empty_el = render_empty_state(ids, title="Nothing here", subtitle="Add items to begin")
html = to_xml(empty_el)
assert "Nothing here" in html
assert "Add items to begin" in html
print("render_empty_state tests passed!")
```

    render_empty_state tests passed!