> ## Documentation Index
> Fetch the complete documentation index at: https://flex-fields.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# PriceRangeField

<img src="https://mintcdn.com/flex-fields/AtYa9gTYnesC_HJb/art/sc-9.png?fit=max&auto=format&n=AtYa9gTYnesC_HJb&q=85&s=b7b709b71f923554b6004cfb3e511edd" alt="PriceRangeField" width="2752" height="1536" data-path="art/sc-9.png" />

[← Back to Table of Contents](/docs/index)

### Summary

Dual-handle **price range** slider with histogram backdrop, min/max numeric inputs, and currency prefix.

|                |                                                                         |                 |          |
| -------------- | ----------------------------------------------------------------------- | --------------- | -------- |
| **Class**      | `Bjanczak\FilamentFlexFields\Filament\Forms\Components\PriceRangeField` |                 |          |
| **State type** | \`array\<min: int                                                       | float, max: int | float>\` |
| **Model cast** | `'price_range' =&gt; 'array'` or `'json'`                               |                 |          |
| **FieldType**  | `price_range`                                                           |                 |          |

Example state: `['min' =&gt; 100, 'max' =&gt; 1124]`.

### Basic usage

```php theme={null}
use Bjanczak\FilamentFlexFields\Filament\Forms\Components\PriceRangeField;

PriceRangeField::make('price_range')
    ->label('Price range')
    ->min(0)
    ->max(5000)
    ->step(1)
    ->prefix('$')
    ->histogram([30, 74, 85, 36, 98])
    ->showInputs()
    ->variant('bordered')
    ->default(['min' => 100, 'max' => 1124]);
```

### Validation

Built-in rules via custom validator:

| Failure               | Translation key                    |
| --------------------- | ---------------------------------- |
| Non-numeric min/max   | `price_range.invalid`              |
| Values outside bounds | `price_range.out_of_bounds`        |
| min > max             | `price_range.min_greater_than_max` |

### Configuration API

#### `min(int|float|Closure $min = 0)` / `max(int|float|Closure $max = 1000)`

Range boundaries for slider and inputs.

```php theme={null}
PriceRangeField::make('field_name')
    ->min(1)
    ->max(10);
```

#### `step(int|float|Closure $step = 1)`

Snap increment.

```php theme={null}
PriceRangeField::make('field_name')
    ->step(1);
```

#### `integer(bool|Closure $condition = true)`

Restrict to whole numbers. **Default: true.**

```php theme={null}
PriceRangeField::make('field_name')
    ->integer(true);
```

#### `decimalPlaces(int|Closure|null $places)`

Fixed decimal precision when not integer.

```php theme={null}
PriceRangeField::make('field_name')
    ->decimalPlaces(2);
```

#### `prefix(string|Closure|null $prefix)` / `withoutPrefix()`

Currency or unit prefix shown in inputs. Default config: `$`.

```php theme={null}
PriceRangeField::make('field_name')
    ->prefix('value')
    ->withoutPrefix();
```

#### `variant(string|Closure $variant)`

| Value      | Description                  |
| ---------- | ---------------------------- |
| `bordered` | Bordered track. **Default.** |
| `flat`     | Flat styling.                |
| `faded`    | Subtle faded track.          |

```php theme={null}
PriceRangeField::make('field_name')
    ->variant('primary');
```

#### `showInputs(bool|Closure $condition = true)`

Min/max numeric inputs below the slider. **Default: true.**

```php theme={null}
PriceRangeField::make('field_name')
    ->showInputs(true);
```

#### `minInputLabel(string|Closure|null $label)` / `maxInputLabel(string|Closure|null $label)`

Accessible labels for the numeric inputs.

```php theme={null}
PriceRangeField::make('field_name')
    ->minInputLabel('value')
    ->maxInputLabel('value');
```

#### `histogram(array|Closure $heights)`

Bar heights (8–100) for the background chart. Uses a built-in default pattern when omitted.

```php theme={null}
PriceRangeField::make('field_name')
    ->histogram(['value1', 'value2']);
```

#### `size(string|ControlSize|Closure $size)`

See [Control size](/docs/shared-concepts).

```php theme={null}
PriceRangeField::make('field_name')
    ->size('md');
```

### State normalization

On hydrate and dehydrate, values are clamped to `[min, max]`, stepped, and `min` is never greater than `max`.

### FlexField schema config

| Config key        | Maps to           |
| ----------------- | ----------------- |
| `min`             | `min()`           |
| `max`             | `max()`           |
| `step`            | `step()`          |
| `size`            | `size()`          |
| `variant`         | `variant()`       |
| `prefix`          | `prefix()`        |
| `histogram`       | `histogram()`     |
| `integer`         | `integer()`       |
| `decimal_places`  | `decimalPlaces()` |
| `show_inputs`     | `showInputs()`    |
| `min_input_label` | `minInputLabel()` |
| `max_input_label` | `maxInputLabel()` |

### Public helper methods

| Method                         | Returns                 | Description                                                                 |
| ------------------------------ | ----------------------- | --------------------------------------------------------------------------- |
| `normalizeState(array $state)` | `array&lt;min, max&gt;` | Clamps min/max to bounds, applies step rounding, ensures `min ≤ max`.       |
| `defaultHistogram()`           | `list&lt;float&gt;`     | Built-in 32-bar histogram heights (8–100) used when `histogram()` is empty. |
| `hasPrefix()`                  | `bool`                  | Whether a currency/unit prefix is configured (not `withoutPrefix()`).       |

***