42 lines
1.5 KiB
PHP

@props([
'image' => config('bladewind.empty_state.image', '/vendor/bladewind/images/empty-state.svg'),
'heading' => '',
'buttonLabel' => '',
'message' => '', // message to display
// true or false. set to false if you want to fully control the content
'showImage' => config('bladewind.empty_state.show_image', true),
'onclick' => '',
'class' => '',
'imageCss' => '',
'imageSize' => 'medium',
])
@php
$show_image = parseBladewindVariable($showImage);
$button_label = $buttonLabel;
$size = in_array($imageSize, ['small','medium','large','xl','omg']) ? $imageSize : 'medium';
$sizes = [
'small' => 'h-28',
'medium' => 'h-40',
'large' => 'h-64',
'xl' => 'h-80',
'omg' => 'h-96',
];
@endphp
<div class="text-center px-4 pb-6 bw-empty-state {{$class}}">
@if($show_image == 'true')
<img src="{{ $image }}" class="{{$sizes[$size]}} mx-auto mb-3 {{$imageCss}}"/>
@endif
@if($heading != '')
<div class="text-slate-700 dark:text-dark-400 text-2xl pt-4 pb-3 px-4 font-light">{!!$heading!!}</div>
@endif
@if($message != '')
<div class="text-slate-600/70 dark:text-dark-500 px-6">{!!$message!!}</div>
@endif
<div class="pt-2 dark:text-dark-400">{!! $slot !!}</div>
@if($button_label != '')
<x-bladewind::button
onclick="{!!$onclick!!}" class="block mx-auto my-2"
size="small">{{$button_label}}</x-bladewind::button>
@endif
</div>