The Changelog
What's new around here?
Succinct and informative updates about Flux.
RSS feed
September 15, 2026
Flux's searchable select now supports extra search terms with the keywords prop. Add it to an option to make that option easier to find without changing its label:
Copy to clipboard
<flux:select.option value="fruit" keywords="apple orange pear"> Fruit</flux:select.option>Now searching for “apple” finds “Fruit”, and “coffee” finds “Drinks”. The labels are still searchable too.
It's useful for abbreviations, alternate names, or related terms your users might reach for. Keywords work with the built-in filtering in searchable listboxes and comboboxes, using the same case-insensitive and accent-insensitive matching as labels.
September 8, 2026
Pie charts
Version ^2.19.0
Flux charts now support pies and donuts. Here’s what a basic pie chart looks like:
Copy to clipboard
<flux:chart wire:model="data" class="aspect-square"> <flux:chart.svg> <flux:chart.pie field="value" label-field="label" /> </flux:chart.svg></flux:chart>Each row in $data becomes a slice. Give it a label and a numeric value, and Flux handles the proportions and colors.
Tooltips that follow the slice
To let someone hover a slice and see its name and value, add a tooltip inside your chart:
Copy to clipboard
<flux:chart.tooltip> <flux:chart.tooltip.value field="value" label-field="label"> <flux:chart.tooltip.indicator /> </flux:chart.tooltip.value></flux:chart.tooltip>The same tooltip row works for every slice: label-field picks up its name, and the little indicator dot matches its color.
The little details
I wanted it to be easy to keep track of a slice as your data changes, so colors stay with their slices. Flux uses each row's id, or its label when there's no ID. Sorting your data or removing a row won't shuffle the remaining colors, and you can set a row's color yourself if you already have a palette in mind.
You can help someone follow a slice while they're hovering, too. Flux marks the hovered slice as active and the others as inactive, leaving the styling up to you. For example, these classes gently dim the other slices:
Copy to clipboard
class="transition-opacity data-inactive:opacity-40"To try these options together, pick the Pie preset in the interactive chart builder. You can tweak the chart there, then copy the Blade into your app.
September 8, 2026
Flux toasts now have an inverted treatment: dark in light mode, light in dark mode. Add invert to the toast component in your layout:
Copy to clipboard
<flux:toast invert />That sets the appearance for every toast. Your existing Flux::toast() calls stay the same.
The details follow along
The contrasting surface gives the message a little more separation from the page. Headings and body text switch colors with it, along with links, action buttons, and the close button's hover state.
You can still distinguish a successful save from a warning. invert controls the appearance, leaving variant available for the message:
Copy to clipboard
Flux::toast( 'Changes saved.', variant: 'success',);