Skip to content

Commit

Permalink
feature: Individual column state tooltips
Browse files Browse the repository at this point in the history
  • Loading branch information
danharrin committed Dec 2, 2024
1 parent 183ffe6 commit 2c7c693
Show file tree
Hide file tree
Showing 11 changed files with 135 additions and 15 deletions.
3 changes: 0 additions & 3 deletions packages/tables/resources/views/index.blade.php
Original file line number Diff line number Diff line change
Expand Up @@ -1649,9 +1649,6 @@ class="fi-ta-record-checkbox fi-checkbox-input"
}}
>
<{{ $columnWrapperTag }}
@if (filled($columnTooltip = $column->getTooltip()))
x-tooltip="{ content: @js($columnTooltip), theme: $store.theme }"
@endif
@if ($columnWrapperTag === 'a')
{{ \Filament\Support\generate_href_html($columnUrl ?: $recordUrl, $columnUrl ? $column->shouldOpenUrlInNewTab() : $openRecordUrlInNewTab) }}
@elseif ($columnWrapperTag === 'button')
Expand Down
6 changes: 6 additions & 0 deletions packages/tables/src/Columns/CheckboxColumn.php
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,12 @@ public function toEmbeddedHtml(): string
->merge([
'disabled' => $isDisabled,
'x-bind:disabled' => $isDisabled ? null : 'isLoading',
'x-tooltip' => filled($tooltip = $this->getTooltip($state))
? '{
content: ' . Js::from($tooltip) . ',
theme: $store.theme,
}'
: null,
], escape: false)
->class([
'fi-checkbox-input',
Expand Down
18 changes: 17 additions & 1 deletion packages/tables/src/Columns/ColorColumn.php
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,17 @@ public function toEmbeddedHtml(): string
'fi-inline' => $this->isInline(),
]);

if (empty($state)) {
if (blank($state)) {
$attributes = $attributes
->merge([
'x-tooltip' => filled($tooltip = $this->getEmptyTooltip())
? '{
content: ' . Js::from($tooltip) . ',
theme: $store.theme,
}'
: null,
], escape: false);

$placeholder = $this->getPlaceholder();

ob_start(); ?>
Expand Down Expand Up @@ -83,6 +93,12 @@ public function toEmbeddedHtml(): string
})
JS
: null,
'x-tooltip' => filled($tooltip = $this->getTooltip($stateItem))
? '{
content: ' . Js::from($tooltip) . ',
theme: $store.theme,
}'
: null,
], escape: false)
->class([
'fi-ta-color-item',
Expand Down
9 changes: 1 addition & 8 deletions packages/tables/src/Columns/Column.php
Original file line number Diff line number Diff line change
Expand Up @@ -11,13 +11,12 @@
use Filament\Support\Concerns\HasCellState;
use Filament\Support\Concerns\HasExtraAttributes;
use Filament\Support\Concerns\HasPlaceholder;
use Filament\Support\Concerns\HasTooltip;
use Filament\Support\Concerns\HasVerticalAlignment;
use Filament\Support\Enums\Alignment;
use Filament\Tables\Columns\Concerns\HasTooltip;
use Filament\Tables\Table;
use Illuminate\Database\Eloquent\Model;
use Illuminate\Support\HtmlString;
use Illuminate\Support\Js;
use Illuminate\View\ComponentAttributeBag;

use function Filament\Support\generate_href_html;
Expand Down Expand Up @@ -157,12 +156,6 @@ public function renderInLayout(): ?HtmlString

$attributes = $attributes
->merge([
'x-tooltip' => filled($tooltip = $this->getTooltip())
? '{
content: ' . Js::from($tooltip) . ',
theme: $store.theme,
}'
: null,
'type' => ($wrapperTag === 'button') ? 'button' : null,
'wire:click' => $wireClickAction = match (true) {
($wrapperTag !== 'button') => null,
Expand Down
38 changes: 38 additions & 0 deletions packages/tables/src/Columns/Concerns/HasTooltip.php
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
<?php

namespace Filament\Tables\Columns\Concerns;

use Closure;

trait HasTooltip
{
protected string | Closure | null $tooltip = null;

protected string | Closure | null $emptyTooltip = null;

public function tooltip(string | Closure | null $tooltip): static
{
$this->tooltip = $tooltip;

return $this;
}

public function getTooltip(mixed $state = null): ?string
{
return $this->evaluate($this->tooltip, [
'state' => $state,
]);
}

public function emptyTooltip(string | Closure | null $tooltip): static
{
$this->emptyTooltip = $tooltip;

return $this;
}

public function getEmptyTooltip(): ?string
{
return $this->evaluate($this->emptyTooltip);
}
}
21 changes: 20 additions & 1 deletion packages/tables/src/Columns/IconColumn.php
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@
use Illuminate\Contracts\Support\Arrayable;
use Illuminate\Support\Arr;
use Illuminate\Support\Collection;
use Illuminate\Support\Js;
use Illuminate\View\ComponentAttributeBag;

use function Filament\Support\generate_icon_html;
Expand Down Expand Up @@ -254,7 +255,17 @@ public function toEmbeddedHtml(): string
'fi-inline' => $this->isInline(),
]);

if (empty($state)) {
if (blank($state)) {
$attributes = $attributes
->merge([
'x-tooltip' => filled($tooltip = $this->getEmptyTooltip())
? '{
content: ' . Js::from($tooltip) . ',
theme: $store.theme,
}'
: null,
], escape: false);

$placeholder = $this->getPlaceholder();

ob_start(); ?>
Expand Down Expand Up @@ -290,6 +301,14 @@ public function toEmbeddedHtml(): string
?>

<?= generate_icon_html($this->getIcon($stateItem), attributes: (new ComponentAttributeBag)
->merge([
'x-tooltip' => filled($tooltip = $this->getTooltip($stateItem))
? '{
content: ' . Js::from($tooltip) . ',
theme: $store.theme,
}'
: null,
], escape: false)
->class([
match ($color) {
null, 'gray' => null,
Expand Down
19 changes: 18 additions & 1 deletion packages/tables/src/Columns/ImageColumn.php
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@
use Illuminate\Support\Arr;
use Illuminate\Support\Collection;
use Illuminate\Support\Facades\Storage;
use Illuminate\Support\Js;
use Illuminate\View\ComponentAttributeBag;
use League\Flysystem\UnableToCheckFileExistence;
use Throwable;
Expand Down Expand Up @@ -349,7 +350,17 @@ public function toEmbeddedHtml(): string
'fi-inline' => $this->isInline(),
]);

if (empty($state)) {
if (blank($state)) {
$attributes = $attributes
->merge([
'x-tooltip' => filled($tooltip = $this->getEmptyTooltip())
? '{
content: ' . Js::from($tooltip) . ',
theme: $store.theme,
}'
: null,
], escape: false);

$placeholder = $this->getPlaceholder();

ob_start(); ?>
Expand Down Expand Up @@ -407,6 +418,12 @@ public function toEmbeddedHtml(): string
<?= $this->getExtraImgAttributeBag()
->merge([
'src' => filled($stateItem) ? $this->getImageUrl($stateItem) : $defaultImageUrl,
'x-tooltip' => filled($tooltip = $this->getTooltip($stateItem))
? '{
content: ' . Js::from($tooltip) . ',
theme: $store.theme,
}'
: null,
])
->style([
"height: {$height}" => $height,
Expand Down
6 changes: 6 additions & 0 deletions packages/tables/src/Columns/SelectColumn.php
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,12 @@ public function toEmbeddedHtml(): string
->merge([
'disabled' => $isDisabled,
'x-bind:disabled' => $isDisabled ? null : 'isLoading',
'x-tooltip' => filled($tooltip = $this->getTooltip($state))
? '{
content: ' . Js::from($tooltip) . ',
theme: $store.theme,
}'
: null,
], escape: false)
->class([
'fi-select-input',
Expand Down
18 changes: 17 additions & 1 deletion packages/tables/src/Columns/TextColumn.php
Original file line number Diff line number Diff line change
Expand Up @@ -183,7 +183,17 @@ public function toEmbeddedHtml(): string
'fi-inline' => $this->isInline(),
]);

if (empty($state)) {
if (blank($state)) {
$attributes = $attributes
->merge([
'x-tooltip' => filled($tooltip = $this->getEmptyTooltip())
? '{
content: ' . Js::from($tooltip) . ',
theme: $store.theme,
}'
: null,
], escape: false);

$placeholder = $this->getPlaceholder();

ob_start(); ?>
Expand Down Expand Up @@ -303,6 +313,12 @@ public function toEmbeddedHtml(): string
})
JS
: null,
'x-tooltip' => filled($tooltip = $this->getTooltip($stateItem))
? '{
content: ' . Js::from($tooltip) . ',
theme: $store.theme,
}'
: null,
], escape: false)
->class([
'fi-ta-text-item',
Expand Down
6 changes: 6 additions & 0 deletions packages/tables/src/Columns/TextInputColumn.php
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,12 @@ public function toEmbeddedHtml(): string
'step' => $this->getStep(),
'type' => $type,
'x-mask' . ($mask instanceof RawJs ? ':dynamic' : '') => filled($mask) ? $mask : null,
'x-tooltip' => filled($tooltip = $this->getTooltip($state))
? '{
content: ' . Js::from($tooltip) . ',
theme: $store.theme,
}'
: null,
], escape: false)
->class([
'fi-input',
Expand Down
6 changes: 6 additions & 0 deletions packages/tables/src/Columns/ToggleColumn.php
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,12 @@ public function toEmbeddedHtml(): string
$buttonAttributes = (new ComponentAttributeBag)
->merge([
'disabled' => $this->isDisabled(),
'x-tooltip' => filled($tooltip = $this->getTooltip($state))
? '{
content: ' . Js::from($tooltip) . ',
theme: $store.theme,
}'
: null,
], escape: false)
->class(['fi-toggle']);

Expand Down

0 comments on commit 2c7c693

Please sign in to comment.