Skip to main content
RatingField ← Back to Table of Contents

Summary

Interactive rating input for scores, feedback, and reviews. Supports custom icons (stars, hearts, etc.), semantic colors, and various sizes. Includes a read-only mode that supports fractional values (e.g., 3.7) with partial icon fill.
ClassBjanczak\FilamentFlexFields\Filament\Forms\Components\RatingField
State typeint|null (interactive) · float|null (read-only display)
Model cast'rating' => 'integer' · 'average_score' => 'float'
FieldTyperating
Playgroundrating slug in Flex Fields playground
Shares rating display configuration with RatingColumn via matching fluent API.

Basic usage

Standard 5-star rating

use Bjanczak\FilamentFlexFields\Filament\Forms\Components\RatingField;

RatingField::make('score')
    ->label('How would you rate this product?')
    ->required();

Custom icon and color

use Bjanczak\FilamentFlexFields\Filament\Forms\Components\RatingField;
use Filament\Support\Icons\Heroicon;

RatingField::make('score')
    ->icon(Heroicon::Heart)
    ->color('danger')
    ->stars(10);

Read-only fractional display

RatingField::make('average_score')
    ->label('Average rating')
    ->readOnly()
    ->default(3.7);

State & validation

Stored value

In interactive mode, the state is an integer representing the number of selected items. In read-only mode, it can be a float.
$record->score; // int|null — e.g. 4
$record->average_score; // float|null — e.g. 4.2

Validation rules (built-in)

RuleWhen
nullableAlways (unless required())
numericAlways
min:0Always
max:{stars}Matches stars() / max()
integerInteractive mode only
requiredWhen ->required()

Configuration API

All methods accept Closure unless noted.
MethodTypeDefaultDescription
stars(int|Closure $count)Setup5Number of rating items. Alias: max().
icon(string|BackedEnum|Htmlable|Closure|null $icon)SetupHeroicon::StarCustom icon for every item.
color(string|Closure|null $color)SetupwarningSemantic fill color for active icons.
size(string|ControlSize|Closure $size)SetupmdControl size: sm, md, lg.
readOnly(bool|Closure $condition = true)SetupfalseDisplay-only mode with fractional support.
showValue(bool|Closure $condition = true)SetuptrueShow numeric value beside icons in read-only mode.
extraAlpineAttributes(array|Closure $attributes)Setup[]Extra Alpine bindings on the root element.

Public helper methods

MethodReturnsDescription
getFillPercentageForValue(float|int|null $value, int $index)floatFill ratio 0.0–1.0 for icon at 1-based $index.

Real-world examples

Feedback form with required rating

public static function form(Form $form): Form
{
    return $form->schema([
        Section::make('Customer Feedback')->schema([
            RatingField::make('satisfaction_score')
                ->label('Overall Satisfaction')
                ->stars(5)
                ->required(),
            
            Textarea::make('feedback_text')
                ->label('Comments')
                ->visible(fn (Get $get) => $get('satisfaction_score') <= 3),
        ]),
    ]);
}

Product list with average rating

RatingField::make('avg_rating')
    ->readOnly()
    ->size('sm')
    ->color('primary')
    ->default(fn ($record) => $record->reviews()->avg('rating'));

Playground

/admin/flex-fields-playground/rating See Playground for setup.
ComponentWhen to use instead
RatingColumnRead-only rating display in tables.
NpsFieldSurvey-specific scales (0–10) with color coding.
SegmentControlGeneric single-select segments.

CSS classes (reference)

ClassRole
fff-rating-fieldRoot wrapper
fff-rating-field--{sm|md|lg}Size variant
fff-rating-field__containerIcons container
fff-rating-field__itemIndividual icon wrapper
fff-rating-field__valueNumeric value (read-only)