| FazBrowse GitHub Viewer | Trending | | Home |
| Tools: [Download Repo ZIP] [Original HTTPS Page] |
| Name | Name | Last commit date | ||
|---|---|---|---|---|
A feature-rich Filament v5 table column & infolist entry that renders progress as a horizontal bar. Built for dashboards, task progress, capacity gauges, skill levels, and any numeric value that fits on a 0–100% (or custom min–max) scale.
composer require aureuserp/progress-barService provider is auto-discovered. CSS is registered via FilamentAsset and published automatically during artisan filament:assets.
use Webkul\ProgressBar\Tables\Columns\ProgressBar;
ProgressBar::make('progress')
->label('Completion')
->color(fn ($record) => $record->progress >= 100 ? 'success' : 'primary');use Webkul\ProgressBar\Infolists\Components\ProgressBar;
ProgressBar::make('level')
->label('Skill level')
->getStateUsing(fn ($record) => $record->level);Both components extend Filament base classes (Column and Entry), so every standard method (->label(), ->sortable(), ->toggleable(), ->visible()) still works.
->max(int | float | Closure $max = 100) // upper bound (default 100)
->min(int | float | Closure $min = 0) // lower bound (default 0)
->value(int | float | Closure $value) // explicit state override
->precision(int $decimals = 2) // decimals for non-100% display
->formatLabel(Closure $fn) // full control: (value, percentage, min, max) → stringuse Webkul\ProgressBar\Enums\{Size, Shape, LabelPosition};
->size(Size::Large) // or 'lg' — Tiny | Small | Medium | Large
->shape(Shape::Pill) // or 'pill' — Rounded | Pill | Square
->labelPosition(LabelPosition::Outside) // or 'outside' — Inside | Outside | None
->showLabel(bool | Closure $condition = true) // shortcut: false → LabelPosition::None
->striped(bool | Closure = true) // diagonal stripes
->animated(bool | Closure = true) // scrolling stripes (implies striped)
->indeterminate(bool | Closure = true) // sliding animation (value ignored)
->gradient(bool | Closure = true) // left→right colour gradient->color(string | Closure $color) // primary / success / warning / danger / info / gray / custom
->trackColor(string | Closure $color = 'gray') // unfilled-track color
->thresholds(array | Closure $map) // [90=>'success', 75=>'info', 50=>'warning', 0=>'danger']
->warnAbove(int | float $threshold,
string $color = 'danger') // over-threshold paints with $colorResolution order: warnAbove → thresholds → color() → fallback primary.
use Webkul\ProgressBar\Enums\IconPosition;
->icon(string | Closure $heroicon) // 'heroicon-m-check-circle' etc.
->iconPosition(IconPosition::End) // or 'end' — Start | EndEvery render emits:
<div class="pb-track" role="progressbar"
aria-valuenow="{percentage}"
aria-valuemin="{min}"
aria-valuemax="{max}"
aria-label="{formatted label}">
<div class="pb-fill" style="width: {percentage}%"></div>
</div>For indeterminate bars, aria-valuenow is omitted (per the WAI-ARIA spec).
| Enum | Cases → values | Default |
|---|---|---|
| Size | Tiny → 'xs', Small → 'sm', Medium → 'md', Large → 'lg' | Size::Medium |
| Shape | Rounded, Pill, Square | Shape::Rounded |
| LabelPosition | Inside, Outside, None | LabelPosition::Inside |
| IconPosition | Start, End | IconPosition::Start |
Each exposes a default() static. Setters accept Enum | string | Closure; getters return the string value so Blade data-pb-* attributes and the CSS keep working unchanged.
use Webkul\ProgressBar\Enums\{Size, Shape, LabelPosition, IconPosition};
ProgressBar::make('progress')
->size(Size::Large)
->shape(Shape::Pill)
->labelPosition(LabelPosition::Outside)
->icon('heroicon-m-check-circle')
->iconPosition(IconPosition::End);Adapted from a skill-level table (the pattern that originally motivated the extraction):
use Webkul\ProgressBar\Enums\Shape;
use Webkul\ProgressBar\Enums\Size;
use Webkul\ProgressBar\Tables\Columns\ProgressBar;
ProgressBar::make('level')
->label('Proficiency')
->getStateUsing(fn ($record) => $record->level)
->size(Size::Small)
->shape(Shape::Pill)
->striped()
->thresholds([
80 => 'success',
50 => 'warning',
20 => 'info',
0 => 'danger',
])
->formatLabel(fn (float $percentage, float $value) => sprintf('%d / 100', $value))
->sortable()
->toggleable();Task progress in a project dashboard:
ProgressBar::make('progress')
->label('Completion')
->warnAbove(100, 'danger') // over-budget → red
->color(fn ($record) => $record->progress >= 100 ? 'success' : 'primary')
->animated()
->size(Size::Medium);The plugin ships a Tailwind-compiled CSS bundle keyed on stable data attributes you can target in your own theme:
Data attributes on .pb-track:
Data attributes on .pb-fill:
Register a panel color and reference it in the progress bar:
// AdminPanelProvider
->colors(['magenta' => '#b72d81'])
// Usage
->color('magenta')Ships with en and ar under the progress-bar:: namespace for aria labels and enum display names. Publish to override:
php artisan vendor:publish --tag="progress-bar-translations"php artisan vendor:publish --tag="progress-bar-config"
php artisan vendor:publish --tag="progress-bar-views"
php artisan vendor:publish --tag="progress-bar-translations"vendor/bin/pest plugins/aureuserp/progress-bar/tests/FeatureThe plugin ships a full Pest suite covering:
| Area | Coverage |
|---|---|
| Architecture | Column extends Filament\Tables\Columns\Column, Entry extends Filament\Infolists\Components\Entry, shared trait used on both, Plugin implements Filament\Contracts\Plugin, no debug calls in shipped code |
| Value API | max, min, value, precision, formatLabel, getPercentage edge cases (>100, <0, non-numeric, reversed min/max) |
| Layout API | size, shape, labelPosition, showLabel — enum + string input, default fallback |
| Behaviour | striped, animated (auto-enables striped), indeterminate, gradient |
| Status / threshold | thresholds() + warnAbove() correctly map value → color |
| Enum input | Size::Large, Shape::Pill, LabelPosition::Outside, IconPosition::End round-trip |
| Content | formatLabel closure, icon + iconPosition, precision formatting |
| Component instantiation | Base class, view paths, fluent chaining, Column-only color() / Infolist color() |
Fixtures live at tests/Feature/Fixtures/.
| Symptom | Likely cause | Fix |
|---|---|---|
| Target class not found | Autoload cache stale | composer dump-autoload && php artisan optimize:clear |
| View not found | Service provider not registered | php artisan package:discover |
| Styles missing | Filament asset cache stale | php artisan filament:assets |
| Bar stays empty | max() is smaller than current value, or min() equals max() | Verify min < max and the resolved state is numeric |
Email support@aureuserp.com for security-related reports instead of opening a public issue.
PRs welcome. Before submitting:
vendor/bin/pest plugins/aureuserp/progress-bar/tests/Feature
vendor/bin/pint plugins/aureuserp/progress-barWhen adding a new option:
MIT. See LICENSE.md.
| Back | FazBrowse Home | New Git URL |