@props([
    'value' => null,
    'type' => 'phone',
    'business',
    'variant' => 'card',
    'class' => '',
    'iconClass' => '',
    'websiteExists' => false,
])

@php
    $canView = can_view_business_contact($business);
    $loginUrl = business_contact_login_url(route('business.custom.slug', $business->slug));
    $masked = mask_business_contact($value);
    $contactLabel = $type === 'phone' ? 'phone' : 'email';
@endphp

@if ($value)
    @if ($variant === 'profile-email')
        <div class="detail-label {{ $websiteExists ? 'mt-3' : '' }}">Email</div>
        <div class="detail-value">
            @if ($canView)
                <a href="mailto:{{ $value }}" class="email-link">{{ $value }}</a>
            @else
                <a href="{{ $loginUrl }}" class="contact-login-link" title="Login to view email">
                    <span class="masked-contact">{{ $masked }}</span>
                    <i class="fas fa-eye contact-reveal-toggle" aria-hidden="true"></i>
                </a>
            @endif
        </div>
    @elseif ($variant === 'profile-phone')
        <div class="info-item mt-2 business-profile-phone {{ $class }}">
            <i class="fas fa-phone text-info mr-10"></i>
            @if ($canView)
                <a href="tel:{{ $value }}" class="phone-link">{{ $value }}</a>
            @else
                <a href="{{ $loginUrl }}" class="contact-login-link" title="Login to view phone">
                    <span class="masked-contact">{{ $masked }}</span>
                    <i class="fas fa-eye contact-reveal-toggle" aria-hidden="true"></i>
                </a>
            @endif
        </div>
    @else
        <div class="info-item business-contact-item {{ $class }}">
            @if ($type === 'phone')
                <i class="fas fa-phone {{ $iconClass }}"></i>
            @else
                <i class="fas fa-envelope {{ $iconClass }}"></i>
            @endif

            @if ($canView)
                @if ($type === 'phone')
                    <span>{{ $value }}</span>
                @else
                    <a href="mailto:{{ $value }}">{{ $value }}</a>
                @endif
            @else
                <a href="{{ $loginUrl }}" class="contact-login-link" title="Login to view {{ $contactLabel }}">
                    <span class="masked-contact">{{ $masked }}</span>
                    <i class="fas fa-eye contact-reveal-toggle" aria-hidden="true"></i>
                </a>
            @endif
        </div>
    @endif
@endif