Columns

Custom columns

Render a cell with your own Vue component, one-off or as a reusable column class.

A one-off column

CustomColumn renders a Vue component you've registered.

use Xelqun\Tables\Columns\CustomColumn;

CustomColumn::make('stock')
    ->component('app/stock')
    ->props(fn (Product $record): array => ['low' => $record->stock < 20]);

The data is available as cell.props.

app.use(
    createXelqunForms({
        components: {
            'app/stock': () => import('./components/columns/StockCell.vue'),
        },
    }),
);

A reusable column

php artisan make:xelqun-column StockColumn --type=app/stock

That creates the class and its Vue component. Like built-in columns, it can be sorted, searched and linked.

To share one between apps, see plugins.