120 lines
5.1 KiB
PHP
120 lines
5.1 KiB
PHP
@php
|
|
use Filament\Support\Enums\Width;
|
|
|
|
$livewire ??= null;
|
|
|
|
$hasTopbar = filament()->hasTopbar();
|
|
$isSidebarCollapsibleOnDesktop = filament()->isSidebarCollapsibleOnDesktop();
|
|
$isSidebarFullyCollapsibleOnDesktop = filament()->isSidebarFullyCollapsibleOnDesktop();
|
|
$hasTopNavigation = filament()->hasTopNavigation();
|
|
$hasNavigation = filament()->hasNavigation();
|
|
$renderHookScopes = $livewire?->getRenderHookScopes();
|
|
$maxContentWidth ??= (filament()->getMaxContentWidth() ?? Width::SevenExtraLarge);
|
|
|
|
if (is_string($maxContentWidth)) {
|
|
$maxContentWidth = Width::tryFrom($maxContentWidth) ?? $maxContentWidth;
|
|
}
|
|
@endphp
|
|
|
|
<x-filament-panels::layout.base
|
|
:livewire="$livewire"
|
|
@class([
|
|
'fi-body-has-navigation' => $hasNavigation,
|
|
'fi-body-has-sidebar-collapsible-on-desktop' => $isSidebarCollapsibleOnDesktop,
|
|
'fi-body-has-sidebar-fully-collapsible-on-desktop' => $isSidebarFullyCollapsibleOnDesktop,
|
|
'fi-body-has-topbar' => $hasTopbar,
|
|
'fi-body-has-top-navigation' => $hasTopNavigation,
|
|
])
|
|
>
|
|
@if ($hasTopbar)
|
|
{{ \Filament\Support\Facades\FilamentView::renderHook(\Filament\View\PanelsRenderHook::TOPBAR_BEFORE, scopes: $renderHookScopes) }}
|
|
|
|
@livewire(filament()->getTopbarLivewireComponent())
|
|
|
|
{{ \Filament\Support\Facades\FilamentView::renderHook(\Filament\View\PanelsRenderHook::TOPBAR_AFTER, scopes: $renderHookScopes) }}
|
|
@elseif ($hasNavigation)
|
|
<div
|
|
@if ($isSidebarFullyCollapsibleOnDesktop)
|
|
x-data="{}"
|
|
x-bind:class="{ 'lg:fi-hidden': $store.sidebar.isOpen }"
|
|
@endif
|
|
@class([
|
|
'fi-layout-sidebar-toggle-btn-ctn',
|
|
'lg:fi-hidden' => ! $isSidebarFullyCollapsibleOnDesktop,
|
|
])
|
|
>
|
|
<x-filament::icon-button
|
|
color="gray"
|
|
:icon="\Filament\Support\Icons\Heroicon::OutlinedBars3"
|
|
:icon-alias="\Filament\View\PanelsIconAlias::SIDEBAR_EXPAND_BUTTON"
|
|
icon-size="lg"
|
|
:label="__('filament-panels::layout.actions.sidebar.expand.label')"
|
|
x-cloak
|
|
x-data="{}"
|
|
x-on:click="$store.sidebar.open()"
|
|
class="fi-layout-sidebar-toggle-btn"
|
|
/>
|
|
</div>
|
|
@endif
|
|
|
|
<div class="fi-layout">
|
|
{{ \Filament\Support\Facades\FilamentView::renderHook(\Filament\View\PanelsRenderHook::LAYOUT_START, scopes: $renderHookScopes) }}
|
|
|
|
@if ($hasNavigation)
|
|
<div
|
|
x-cloak
|
|
x-data="{}"
|
|
x-on:click="$store.sidebar.close()"
|
|
x-show="$store.sidebar.isOpen"
|
|
x-transition.opacity.300ms
|
|
class="fi-sidebar-close-overlay"
|
|
></div>
|
|
|
|
@livewire(filament()->getSidebarLivewireComponent())
|
|
@endif
|
|
|
|
<div
|
|
@if ($isSidebarCollapsibleOnDesktop)
|
|
x-data="{}"
|
|
x-bind:class="{
|
|
'fi-main-ctn-sidebar-open': $store.sidebar.isOpen,
|
|
}"
|
|
x-bind:style="'display: flex; opacity:1;'"
|
|
{{-- Mimics `x-cloak`, as using `x-cloak` causes visual issues with chart widgets --}}
|
|
@elseif ($isSidebarFullyCollapsibleOnDesktop)
|
|
x-data="{}"
|
|
x-bind:class="{
|
|
'fi-main-ctn-sidebar-open': $store.sidebar.isOpen,
|
|
}"
|
|
x-bind:style="'display: flex; opacity:1;'"
|
|
{{-- Mimics `x-cloak`, as using `x-cloak` causes visual issues with chart widgets --}}
|
|
@elseif (! ($isSidebarCollapsibleOnDesktop || $isSidebarFullyCollapsibleOnDesktop || $hasTopNavigation || (! $hasNavigation)))
|
|
x-data="{}"
|
|
x-bind:style="'display: flex; opacity:1;'" {{-- Mimics `x-cloak`, as using `x-cloak` causes visual issues with chart widgets --}}
|
|
@endif
|
|
class="fi-main-ctn"
|
|
>
|
|
{{ \Filament\Support\Facades\FilamentView::renderHook(\Filament\View\PanelsRenderHook::CONTENT_BEFORE, scopes: $renderHookScopes) }}
|
|
|
|
<main
|
|
@class([
|
|
'fi-main',
|
|
($maxContentWidth instanceof Width) ? "fi-width-{$maxContentWidth->value}" : $maxContentWidth,
|
|
])
|
|
>
|
|
{{ \Filament\Support\Facades\FilamentView::renderHook(\Filament\View\PanelsRenderHook::CONTENT_START, scopes: $renderHookScopes) }}
|
|
|
|
{{ $slot }}
|
|
|
|
{{ \Filament\Support\Facades\FilamentView::renderHook(\Filament\View\PanelsRenderHook::CONTENT_END, scopes: $renderHookScopes) }}
|
|
</main>
|
|
|
|
{{ \Filament\Support\Facades\FilamentView::renderHook(\Filament\View\PanelsRenderHook::CONTENT_AFTER, scopes: $renderHookScopes) }}
|
|
|
|
{{ \Filament\Support\Facades\FilamentView::renderHook(\Filament\View\PanelsRenderHook::FOOTER, scopes: $renderHookScopes) }}
|
|
</div>
|
|
|
|
{{ \Filament\Support\Facades\FilamentView::renderHook(\Filament\View\PanelsRenderHook::LAYOUT_END, scopes: $renderHookScopes) }}
|
|
</div>
|
|
</x-filament-panels::layout.base>
|