Beartropy Tables
General Configuration
Core settings configured in the settings() method.
Table Settings
setColumnID(string $id) — Define which column acts as the unique row identifier (default: 'id').
showColumnToggle(bool $bool) — Show/hide the column visibility toggle button.
setButtonVariant(string $variant) — Set the button style for all table buttons (e.g., 'glass', 'outline', 'solid'). Default: 'outline'.
showOptionsOnlyOnRowSelect(bool $bool) — Only show the options dropdown when rows are selected.
stripRows(bool $bool) — Toggle striped row backgrounds (default: true).
showOnlyTable(bool $bool) — Disable global search, pagination, and column toggle with one setting.
1$this->setColumnID('uuid');2$this->showColumnToggle(true);3$this->setButtonVariant('glass');4$this->showOptionsOnlyOnRowSelect(true);5$this->stripRows(true);6$this->showOnlyTable(false);Row Manipulation
Helper methods to modify table data at runtime.
Row CRUD
addRowToTable(array $row) — Add a new row to the dataset.
removeRowFromTable($id) — Remove a row by ID.
updateRowOnTable($id, array $data) — Update specific fields on a row.
toggleBoolean($id, string $column) — Toggle a boolean column value.
1$this->addRowToTable(['id' => 1, 'name' => 'New Row']);2$this->removeRowFromTable($id);3$this->updateRowOnTable($id, ['name' => 'Updated Name']);4$this->toggleBoolean($id, 'is_active');Useful in option handlers
options() action handlers. For example, removeRowFromTable() pairs well with a "Delete selected rows" bulk action.
Expanded Rows
Show additional content or nested components when a row is expanded.
Toggle Expanded Row
toggleExpandedRow($id, $content, $isComponent = false) — Expand a row to show additional content. Set $isComponent to true to render a nested Livewire component.
1$this->toggleExpandedRow($rowId, $viewContent, true);Search Configuration
Customize the global search behavior.
Search Settings
setSearchLabel(string $label) — Customize the search input placeholder text.
useGlobalSearch(bool $bool) — Enable or disable the global search input entirely.
1$this->setSearchLabel('Search Users...');2$this->useGlobalSearch(true);Caching
Avoid cache key collisions when using multiple tables.
Cache Prefix
setCachePrefix(string $prefix) — Set a unique prefix for cache keys when multiple tables exist on the same page or share the same component class.
1$this->setCachePrefix('users_table');Card View
Display data as cards instead of (or in addition to) the standard table layout.
Card View Settings
showCardsOnMobile(bool $bool) — Switch to card layout on mobile viewports.
useCards(bool $bool) — Force card view on all screen sizes.
addCardModalButtons(array $buttons) — Add custom action buttons to the card details modal. Each button's action receives the full row data.
1$this->showCardsOnMobile(true);2$this->useCards(true);3 4$this->addCardModalButtons([5 ["label" => 'Edit', "action" => "editRow", "color" => "blue"],6 ["label" => 'Delete', "action" => "deleteRow", "color" => "red"]7]);Mark columns for card display
->cardTitle() and ->showOnCard() on your columns to control which data appears in the card body. See the Columns documentation for details.
Examples
Playground tables demonstrating settings configurations.
CardViewTable.php
A card-view table using useCards(true) with cardTitle() and showOnCard() on columns.
1use Beartropy\Tables\Classes\Columns\Column; 2use Beartropy\Tables\YATBaseTable; 3 4class CardViewTable extends YATBaseTable 5{ 6 public function columns(): array 7 { 8 return [ 9 Column::make('Name', 'name')10 ->sortable()->searchable()11 ->cardTitle()->showOnCard(),12 Column::make('Role', 'role')13 ->sortable()->showOnCard(),14 Column::make('Location', 'location')15 ->showOnCard(),16 ];17 }18 19 public function data(): array20 {21 return [22 ['id' => 1, 'name' => 'Maria Garcia', 'role' => 'Developer', 'location' => 'Madrid'],23 // ...24 ];25 }26 27 public function settings(): void28 {29 $this->usePagination(false);30 $this->useCards(true);31 $this->setTitle('Card View');32 $this->useGlobalSearch(false);33 $this->showColumnToggle(false);34 }35}StripedTable.php
A minimal table with striped rows enabled (the default) and a clean, focused configuration.
1use Beartropy\Tables\Classes\Columns\Column; 2use Beartropy\Tables\YATBaseTable; 3 4class StripedTable extends YATBaseTable 5{ 6 public function columns(): array 7 { 8 return [ 9 Column::make('#', 'id')->sortable(),10 Column::make('Name', 'name')->sortable()->searchable(),11 Column::make('Department', 'department')->sortable(),12 ];13 }14 15 public function data(): array16 {17 return [18 ['id' => 1, 'name' => 'Frank Lee', 'department' => 'Engineering'],19 // ...20 ];21 }22 23 public function settings(): void24 {25 $this->usePagination(false);26 $this->setTitle('Striped Rows');27 $this->useGlobalSearch(false);28 $this->showColumnToggle(false);29 }30}Live Demo
Try it — a card-view table with clickable titles and card body content.
Card View Table
1<livewire:tables.demos.demo-card-table />