# Store List

### Overview <a href="#overview" id="overview"></a>

The `Store List` component displays a list of all stores/locations from the Carpose backend. It shows a loading indicator while fetching data and then renders each store using the Store Item component.

### Installation <a href="#installation" id="installation"></a>

The component is part of the Carpose application and requires no separate installation.

### Usage <a href="#usage" id="usage"></a>

To use the Store List component in a standard HTML page:

```html
<div 
  data-carpose-component="store-list"
  data-api-key="your-api-key"
></div>
```

### Configuration Attributes <a href="#configuration-attributes" id="configuration-attributes"></a>

The component reads configuration from data attributes on the provided element:

| Attribute                | Type   | Default | Description                                                                               |
| ------------------------ | ------ | ------- | ----------------------------------------------------------------------------------------- |
| `data-carpose-component` | string | -       | Identifies the component type, must be set to "store-list"                                |
| `data-api-key`           | string | -       | API key for authentication with the Carpose backend services. Required for data fetching. |

### Features <a href="#features" id="features"></a>

* Displays a list of all store locations
* Shows a loading indicator while data is being fetched
* Responsive layout that adapts to different screen sizes
* Each store is displayed with its details (name, address, contact information)

### Example <a href="#example" id="example"></a>

```html
<div 
  data-carpose-component="store-list"
  data-api-key="your-api-key"
></div>
```

### Behavior <a href="#behavior" id="behavior"></a>

1. **Data Loading**:
   * On initialization, the component fetches store data from the API using the provided API key.
   * While data is loading, a loading screen is displayed.
   * Once data is loaded, the list of stores is rendered.
2. **Store Display**:
   * Each store is displayed using the Store Item component.
   * Stores are displayed in the order returned by the API.
   * Each store item typically includes the store name, address, contact information, and possibly an image.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.carpose.de/misc-modules/store-list.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.