@php
use Filament\Support\Enums\ActionSize;
use Filament\Support\Enums\IconPosition;
use Filament\Support\Enums\IconSize;
@endphp
@props([
'badge' => null,
'badgeColor' => 'primary',
'color' => 'primary',
'disabled' => false,
'form' => null,
'href' => null,
'icon' => null,
'iconAlias' => null,
'iconPosition' => IconPosition::Before,
'iconSize' => null,
'keyBindings' => null,
'loadingIndicator' => true,
'size' => ActionSize::Medium,
'tag' => 'a',
'target' => null,
'tooltip' => null,
'type' => 'button',
])
@php
if (! $iconPosition instanceof IconPosition) {
$iconPosition = filled($iconPosition) ? (IconPosition::tryFrom($iconPosition) ?? $iconPosition) : null;
}
if (! $size instanceof ActionSize) {
$size = filled($size) ? (ActionSize::tryFrom($size) ?? $size) : null;
}
$iconSize ??= match ($size) {
ActionSize::ExtraSmall, ActionSize::Small => IconSize::Small,
default => IconSize::Medium,
};
if (! $iconSize instanceof IconSize) {
$iconSize = filled($iconSize) ? (IconSize::tryFrom($iconSize) ?? $iconSize) : null;
}
$linkClasses = \Illuminate\Support\Arr::toCssClasses([
'fi-link group/link relative inline-flex items-center justify-center outline-none',
'pe-4' => $badge,
'pointer-events-none opacity-70' => $disabled,
"fi-size-{$size->value}" => $size instanceof ActionSize,
// @deprecated `fi-link-size-*` has been replaced by `fi-size-*`.
"fi-link-size-{$size->value}" => $size instanceof ActionSize,
match ($size) {
ActionSize::ExtraSmall => 'gap-1',
ActionSize::Small => 'gap-1',
ActionSize::Medium => 'gap-1.5',
ActionSize::Large => 'gap-1.5',
ActionSize::ExtraLarge => 'gap-1.5',
default => $size,
},
match ($color) {
'gray' => 'fi-color-gray',
default => 'fi-color-custom',
},
]);
$labelClasses = \Illuminate\Support\Arr::toCssClasses([
'font-semibold group-hover/link:underline group-focus-visible/link:underline',
match ($size) {
ActionSize::ExtraSmall => 'text-xs',
ActionSize::Small => 'text-sm',
ActionSize::Medium => 'text-sm',
ActionSize::Large => 'text-sm',
ActionSize::ExtraLarge => 'text-sm',
default => null,
},
match ($color) {
'gray' => 'text-gray-700 dark:text-gray-200',
default => 'text-custom-600 dark:text-custom-400',
},
]);
$labelStyles = \Illuminate\Support\Arr::toCssStyles([
\Filament\Support\get_color_css_variables(
$color,
shades: [400, 600],
alias: 'link.label',
) => $color !== 'gray',
]);
$iconClasses = \Illuminate\Support\Arr::toCssClasses([
'fi-link-icon',
match ($iconSize) {
IconSize::Small => 'h-4 w-4',
IconSize::Medium => 'h-5 w-5',
IconSize::Large => 'h-6 w-6',
default => $iconSize,
},
match ($color) {
'gray' => 'text-gray-400 dark:text-gray-500',
default => 'text-custom-600 dark:text-custom-400',
},
]);
$iconStyles = \Illuminate\Support\Arr::toCssStyles([
\Filament\Support\get_color_css_variables(
$color,
shades: [400, 600],
alias: 'link.icon',
) => $color !== 'gray',
]);
$badgeContainerClasses = 'fi-link-badge-ctn absolute -top-1 start-full z-[1] -ms-1 w-max -translate-x-1/2 rounded-md bg-white rtl:translate-x-1/2 dark:bg-gray-900';
$wireTarget = $loadingIndicator ? $attributes->whereStartsWith(['wire:target', 'wire:click'])->filter(fn ($value): bool => filled($value))->first() : null;
$hasLoadingIndicator = filled($wireTarget) || ($type === 'submit' && filled($form));
if ($hasLoadingIndicator) {
$loadingIndicatorTarget = html_entity_decode($wireTarget ?: $form, ENT_QUOTES);
}
$hasTooltip = filled($tooltip);
@endphp
@if ($tag === 'a')
map(fn (string $keyBinding): string => str_replace('+', '-', $keyBinding))->implode('.') }}
@endif
@if ($hasTooltip)
x-tooltip="{
content: @js($tooltip),
theme: $store.theme,
}"
@endif
{{ $attributes->class([$linkClasses]) }}
>
@if ($icon && $iconPosition === IconPosition::Before)
@endif
{{ $slot }}
@if ($icon && $iconPosition === IconPosition::After)
@endif
@if (filled($badge))
{{ $badge }}
@endif
@trim
@elseif ($tag === 'button')
@trim
@endif