> ## Documentation Index
> Fetch the complete documentation index at: https://docs.metabind.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# List Components

> List and search available components

List components using standard filters or semantic search.

## Input Schema

```json theme={null}
{
  "type": "object",
  "properties": {
    "projectId": {
      "type": "string",
      "description": "Project ID (optional, uses session default if not provided)"
    },
    "query": {
      "type": "string",
      "description": "Natural language search query for semantic search. Uses AI-powered vector search to find relevant components based on meaning, not just keywords.",
      "minLength": 1,
      "maxLength": 500,
      "example": "layout for product listings"
    },
    "type": {
      "type": "string",
      "enum": ["view", "layout", "assetCatalog"],
      "description": "Filter by component type (optional)"
    },
    "status": {
      "type": "string",
      "enum": ["draft", "published", "deleted"],
      "default": "published",
      "description": "Filter by component status (optional)"
    },
    "collectionId": {
      "type": "string",
      "description": "Filter by collection ID (optional)"
    },
    "page": {
      "type": "number",
      "default": 1,
      "description": "Page number for paginated results (1-based indexing)"
    },
    "limit": {
      "type": "number",
      "default": 20,
      "maximum": 100,
      "description": "Maximum items to return per page"
    }
  }
}
```

## Parameters

| Parameter      | Type   | Default         | Description                            |
| -------------- | ------ | --------------- | -------------------------------------- |
| `projectId`    | string | session default | Project to search in                   |
| `query`        | string | -               | Natural language semantic search query |
| `type`         | string | -               | Filter by component type               |
| `status`       | string | published       | Filter by status                       |
| `collectionId` | string | -               | Filter by collection                   |
| `page`         | number | 1               | Page number                            |
| `limit`        | number | 20              | Items per page (max 100)               |

## Component Types

| Type           | Description                                        |
| -------------- | -------------------------------------------------- |
| `view`         | UI display components (cards, headers, etc.)       |
| `layout`       | Structural layout components (grids, stacks, etc.) |
| `assetCatalog` | Asset catalog components for media management      |

## Response

| Field                      | Type   | Description                                  |
| -------------------------- | ------ | -------------------------------------------- |
| `components`               | array  | Array of component objects                   |
| `components[].id`          | string | Unique component identifier                  |
| `components[].name`        | string | Display name of the component                |
| `components[].description` | string | Component description                        |
| `components[].type`        | string | Component type (view, layout, assetCatalog)  |
| `components[].status`      | string | Publication status                           |
| `components[].version`     | number | Version number                               |
| `components[].excerpt`     | string | Relevant text excerpt (when `query` is used) |
| `components[].similarity`  | number | Similarity score 0-1 (when `query` is used)  |
| `total`                    | number | Total number of matching items               |

## Examples

### Semantic Search

Search for components using natural language:

```json theme={null}
{
  "query": "layout for product listings"
}
```

Response:

```json theme={null}
{
  "components": [
    {
      "id": "comp_product_layout_001",
      "name": "Product Listing Layout",
      "description": "Layout component for displaying product listings with grid or list view options",
      "type": "layout",
      "status": "published",
      "version": 2,
      "excerpt": "...Layout component for displaying product listings with grid or list view options...",
      "similarity": 0.94
    },
    {
      "id": "comp_product_grid_001",
      "name": "Product Grid",
      "description": "Grid layout for showcasing multiple products",
      "type": "layout",
      "status": "published",
      "version": 1,
      "excerpt": "...Grid layout for showcasing multiple products in a responsive grid...",
      "similarity": 0.87
    }
  ],
  "total": 2
}
```

### Filter by Type

List all published layout components:

```json theme={null}
{
  "type": "layout",
  "status": "published"
}
```

Response:

```json theme={null}
{
  "components": [
    {
      "id": "comp_product_layout_001",
      "name": "Product Listing Layout",
      "description": "Layout component for displaying product listings",
      "type": "layout",
      "status": "published",
      "version": 2
    },
    {
      "id": "comp_article_layout_001",
      "name": "Article Layout",
      "description": "Layout for long-form article content",
      "type": "layout",
      "status": "published",
      "version": 3
    }
  ],
  "total": 2
}
```

### Filter by Collection

List components in a specific collection:

```json theme={null}
{
  "collectionId": "coll_marketing_001"
}
```

## Usage

### Browse Components by Type

```javascript theme={null}
// List all view components
const views = await mcp.call("list_components", {
  type: "view"
});

// List all layout components
const layouts = await mcp.call("list_components", {
  type: "layout"
});
```

### Search with Combined Filters

```javascript theme={null}
// Search for hero components within views
const result = await mcp.call("list_components", {
  query: "hero banner",
  type: "view"
});
```

<Tip>
  Combine semantic search with filters for precise results. For example, search for "hero banner" within the `view` type to find relevant display components.
</Tip>