> This page is for Developer.

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://docs.bigcommerce.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://docs.bigcommerce.com/_mcp/server.

# Range

Allows you to display input controls for your widget.

---

**Widget Configuration Output**

```json showLineNumbers={false}
{
  "lineWidth": 100
}
```

> **Note**
>
> Units are not currently stored in the widget configuration.

---

**User Interface Output**

![output](/_fern-img/ced8c5dc177d66eee676a7ecb332eee175fe4e66b3537bf4866af56336285292.webp)

---

**JSON Schema**

| Property                    | Type    | Description                                                                         | Example      |
| --------------------------- | ------- | ----------------------------------------------------------------------------------- | ------------ |
| `type`                      | string  | The type of setting component to display.                                           | "range"      |
| `label`                     | string  | The user friendly message to inform the user how this setting will be used.         | "Line width" |
| `id`                        | string  | The variable name where the setting value will be available in the widget template. | "lineWidth"  |
| `default`                   | integer | The default value to use when rendering the widget for the first time.              | 100          |
| `typeMeta`                  | object  | Additional information needed based on the selected setting type.                   |              |
| `typeMeta.rangeValues`      | object  |                                                                                     |              |
| `typeMeta.rangeValues.min`  | integer | Minimum value in the range.                                                         | 0            |
| `typeMeta.rangeValues.max`  | integer | Maximum value in the range.                                                         | 100          |
| `typeMeta.rangeValues.step` | integer | Incrementation of the range values.                                                 | 1            |
| `typeMeta.rangeValues.unit` | string  | Unit of the range values.                                                           | "%"          |