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

# Toggle

> Display a toggle switch that outputs true/false values for use in filters

<img src="https://mintcdn.com/evidence/lyRfl9dhvfuFUnx3/images/components/toggle/toggle.png?fit=max&auto=format&n=lyRfl9dhvfuFUnx3&q=85&s=aabf0876e9a4a0c433b1f5214ff3c254" alt="Basic Usage" width="1000" height="104" data-path="images/components/toggle/toggle.png" />

```liquid theme={null}
{% toggle
    id="show_legend"
    label="Show Legend"
/%}
```

## Examples

### Basic Usage

<img src="https://mintcdn.com/evidence/lyRfl9dhvfuFUnx3/images/components/toggle/toggle.png?fit=max&auto=format&n=lyRfl9dhvfuFUnx3&q=85&s=aabf0876e9a4a0c433b1f5214ff3c254" alt="Basic Usage" width="1000" height="104" data-path="images/components/toggle/toggle.png" />

```liquid theme={null}
{% toggle
    id="show_legend"
    label="Show Legend"
/%}
```

### Using `where`

<img src="https://mintcdn.com/evidence/ImoR9rIJqT9N0Esa/images/components/toggle/example-1.png?fit=max&auto=format&n=ImoR9rIJqT9N0Esa&q=85&s=b174f1c0e655d6ed78f2da1702d9b314" alt="Using where" width="1000" height="760" data-path="images/components/toggle/example-1.png" />

```liquid theme={null}
{% toggle
    id="active_only"
    label="Active Only"
/%}

{% table
    data="demo.daily_orders"
    where="{{active_only}} = false or total_sales > 1000"
/%}
```

### Using Inline SQL

<img src="https://mintcdn.com/evidence/ImoR9rIJqT9N0Esa/images/components/toggle/example-2.png?fit=max&auto=format&n=ImoR9rIJqT9N0Esa&q=85&s=3c4eafc986159f9a7045bb0c6ee8d881" alt="Using Inline SQL" width="1000" height="760" data-path="images/components/toggle/example-2.png" />

````liquid theme={null}
{% toggle
    id="active_only"
    label="Active Only"
/%}

```sql filtered_orders
select * from demo.daily_orders
where {{active_only}} = false or total_sales > 1000
```

{% table data="filtered_orders" /%}
````

## Attributes

<ResponseField name="id" type="string" required>
  The id of the toggle to be used in a `filters` prop
</ResponseField>

<ResponseField name="label" type="string">
  Text displayed next to the toggle inside the box. Defaults to the id if not provided.
</ResponseField>

<ResponseField name="info" type="string">
  Information tooltip text that appears after the label
</ResponseField>

<ResponseField name="invert" type="boolean" default="false">
  Invert the boolean value output. When true, checked = false and unchecked = true. Useful when toggle label semantics are opposite to the filter logic (e.g., a "Show inactive" toggle that filters for is\_active = false when checked).
</ResponseField>

<ResponseField name="initial_value" type="boolean" default="false">
  Initial state of the toggle
</ResponseField>

## Using the Filter Variable

Reference this filter using `{{filter_id}}`. The value returned depends on where you use it.

| Context           | Default Property | No Selection | Result |
| ----------------- | ---------------- | ------------ | ------ |
| Inline SQL query  | `.value`         |              | `true` |
| `where` attribute | `.value`         |              | `true` |
| Text / Markdown   | `.value`         |              | `true` |

### Available Properties

You can also access specific properties using `{{filter_id.property}}`:

#### .value

Returns the boolean value of the toggle.

````liquid theme={null}
{% toggle id="active_filter" /%}

```sql active_users
select * from users
where is_active = {{active_filter}}
```
````

**Example value:** `true`
