diff --git a/app/Providers/MoonShineServiceProvider.php b/app/Providers/MoonShineServiceProvider.php
index 3783a0a3..bbaa885a 100644
--- a/app/Providers/MoonShineServiceProvider.php
+++ b/app/Providers/MoonShineServiceProvider.php
@@ -35,7 +35,7 @@ protected function menu(): array
                 foreach ($items as $item) {
                     if (!is_string($item)) {
                         $pages[] = DocSection::make(
-                            $item['label'],
+                            $item['title'] ?? $item['label'],
                             $item['slug'],
                         );
                     }
@@ -63,7 +63,7 @@ protected function menu(): array
                         $inner[] = MenuDivider::make($titleDivider);
                     } else {
                         $page = DocSection::make(
-                            $item['label'],
+                            $item['title'] ?? $item['label'],
                             $item['slug'],
                         )->setResource($resources[$slug]);
 
diff --git a/config/menu.php b/config/menu.php
index fd1d6c88..ad634b66 100644
--- a/config/menu.php
+++ b/config/menu.php
@@ -19,20 +19,30 @@
         ['slug' => 'page-instance', 'label' => 'Make instance'],
     ],
 
+    'Components:rectangle-group' => [
+        ['slug' => 'components-index', 'label' => 'Basics'],
+
+        // Decorations
+        'Decorations:_divider_',
+        ['slug' => 'components-decoration_tabs', 'label' => 'Tabs', 'title' => 'Decoration Tabs'],
+        ['slug' => 'components-decoration_heading', 'label' => 'Heading', 'title' => 'Decoration Heading'],
+        ['slug' => 'components-decoration_block', 'label' => 'Block', 'title' => 'Decoration Block'],
+        ['slug' => 'components-decoration_layout', 'label' => 'Layout', 'title' => 'Decoration Layout'],
+        ['slug' => 'components-decoration_collapse', 'label' => 'Collapse', 'title' => 'Decoration Collapse'],
+        ['slug' => 'components-decoration_divider', 'label' => 'Divider', 'title' => 'Decoration Divider'],
+
+        // Metrics
+        'Metrics:_divider_',
+        ['slug' => 'components-metric_donut_chart', 'label' => 'Donut Chart', 'title' => 'Metric Donut Chart'],
+        ['slug' => 'components-metric_line_chart', 'label' => 'Line Chart', 'title' => 'Metric Line Chart'],
+        ['slug' => 'components-metric_value', 'label' => 'Value', 'title' => 'Metric Value'],
+    ],
+
     'Appearance:photo' => [
         ['slug' => 'appearance-index', 'label' => 'Basics'],
         ['slug' => 'appearance-layout_builder', 'label' => 'LayoutBuilder'],
         ['slug' => 'appearance-assets', 'label' => 'AssetsManager'],
         ['slug' => 'appearance-icons', 'label' => 'Icons'],
-
-        // Text
-        'Decorations:_divider_',
-        ['slug' => 'appearance-decorations_tabs', 'label' => 'Tabs'],
-        ['slug' => 'appearance-decorations_heading', 'label' => 'Heading'],
-        ['slug' => 'appearance-decorations_block', 'label' => 'Block'],
-        ['slug' => 'appearance-decorations_layout', 'label' => 'Layout'],
-        ['slug' => 'appearance-decorations_collapse', 'label' => 'Collapse'],
-        ['slug' => 'appearance-decorations_divider', 'label' => 'Divider'],
     ],
 
     'Models Resources:document-duplicate' => [
@@ -48,6 +58,10 @@
         ['slug' => 'resources-metrics', 'label' => 'Metrics'],
         ['slug' => 'resources-events', 'label' => 'Events'],
         ['slug' => 'resources-authorization', 'label' => 'Authorization'],
+
+//        ['slug' => 'resources-export', 'label' => 'Export'],
+//        ['slug' => 'resources-import', 'label' => 'Import'],
+
 //        ['slug' => 'resources-actions', 'label' => 'Actions'],
 //        ['slug' => 'resources-active_actions', 'label' => 'Active actions'],
 //        ['slug' => 'resources-item_actions', 'label' => 'Item actions'],
@@ -61,22 +75,6 @@
         ['slug' => 'menu', 'label' => 'Menu'],
     ],
 
-    'Appearance:photo' => [
-        ['slug' => 'appearance-index', 'label' => 'Basics'],
-        ['slug' => 'appearance-layout_builder', 'label' => 'LayoutBuilder'],
-        ['slug' => 'appearance-assets', 'label' => 'AssetsManager'],
-        ['slug' => 'appearance-icons', 'label' => 'Icons'],
-
-        // Decorations
-        'Decorations:_divider_',
-        ['slug' => 'appearance-decorations_tabs', 'label' => 'Tabs'],
-        ['slug' => 'appearance-decorations_heading', 'label' => 'Heading'],
-        ['slug' => 'appearance-decorations_block', 'label' => 'Block'],
-        ['slug' => 'appearance-decorations_layout', 'label' => 'Layout'],
-        ['slug' => 'appearance-decorations_collapse', 'label' => 'Collapse'],
-        ['slug' => 'appearance-decorations_divider', 'label' => 'Divider'],
-    ],
-
     'Fields:table-cells' => [
         ['slug' => 'fields-index', 'label' => 'Basics'],
         // Text
@@ -149,32 +147,8 @@
         ['slug' => 'action_button', 'label' => 'ActionButton'],
     ],
 
-//    'Decorations:rocket-launch' => [
-//        ['slug' => 'decorations-index', 'label' => 'Basics'],
-//        ['slug' => 'decorations-tabs', 'label' => 'Tabs'],
-//        ['slug' => 'decorations-heading', 'label' => 'Heading'],
-//        ['slug' => 'decorations-block', 'label' => 'Block'],
-//        ['slug' => 'decorations-layout', 'label' => 'Layout', 'badge' => 'new'],
-//        ['slug' => 'decorations-button', 'label' => 'Button'],
-//        ['slug' => 'decorations-collapse', 'label' => 'Collapse'],
-//        ['slug' => 'decorations-divider', 'label' => 'Divider', 'badge' => 'new'],
-//    ],
-
-//    'Metrics:chart-bar' => [
-//        ['slug' => 'metrics-index', 'label' => 'Basics'],
-//        ['slug' => 'metrics-value', 'label' => 'Value'],
-//        ['slug' => 'metrics-line_chart', 'label' => 'Line Chart'],
-//        ['slug' => 'metrics-donut_chart', 'label' => 'Donut Chart', 'badge' => 'new'],
-//    ],
-
-//    'Actions:hand-raised' => [
-//        ['slug' => 'actions-index', 'label' => 'Basics'],
-//        ['slug' => 'actions-export', 'label' => 'Export'],
-//        ['slug' => 'actions-import', 'label' => 'Import'],
-//    ],
-
     'Advanced:moon' => [
-        //['slug' => 'advanced-resource', 'label' => 'Resource'],
+        ['slug' => 'advanced-resource', 'label' => 'Resource'],
         ['slug' => 'advanced-controller', 'label' => 'Controllers'],
         ['slug' => 'advanced-form_builder', 'label' => 'FormBuilder'],
         ['slug' => 'advanced-table_builder', 'label' => 'TableBuilder'],
@@ -192,35 +166,35 @@
 
     ':_divider_',
     'UI components:code-bracket-square' => [
-        ['slug' => 'components-index', 'label' => 'Basics'],
-        ['slug' => 'components-alert', 'label' => 'Alert'],
-        ['slug' => 'components-badge', 'label' => 'Badge'],
-        ['slug' => 'components-boolean', 'label' => 'Boolean'],
-        ['slug' => 'components-box', 'label' => 'Box'],
-        ['slug' => 'components-breadcrumbs', 'label' => 'Breadcrumbs'],
-        ['slug' => 'components-card', 'label' => 'Card'],
-        ['slug' => 'components-collapse', 'label' => 'Collapse'],
-        ['slug' => 'components-divider', 'label' => 'Divider'],
-        ['slug' => 'components-dropdown', 'label' => 'Dropdown'],
-        ['slug' => 'components-icon', 'label' => 'Icon'],
-        ['slug' => 'components-files', 'label' => 'Files'],
-        ['slug' => 'components-form', 'label' => 'Form elements'],
-        ['slug' => 'components-grid', 'label' => 'Grid/Column'],
-        ['slug' => 'components-link', 'label' => 'Link'],
-        ['slug' => 'components-loader', 'label' => 'Loader'],
-        ['slug' => 'components-modal', 'label' => 'Modal'],
-        ['slug' => 'components-offcanvas', 'label' => 'Offcanvas'],
-        ['slug' => 'components-paginations', 'label' => 'Paginations'],
-        ['slug' => 'components-popover', 'label' => 'Popover'],
-        ['slug' => 'components-progress_bar', 'label' => 'Progress bar'],
-        ['slug' => 'components-rating', 'label' => 'Rating'],
-        ['slug' => 'components-spinner', 'label' => 'Spinner'],
-        ['slug' => 'components-table', 'label' => 'Table'],
-        ['slug' => 'components-tabs', 'label' => 'Tabs'],
-        ['slug' => 'components-thumbnail', 'label' => 'Thumbnail'],
-        ['slug' => 'components-title', 'label' => 'Title'],
-        ['slug' => 'components-toast', 'label' => 'Toast'],
-        ['slug' => 'components-tooltip', 'label' => 'Tooltip'],
+        ['slug' => 'ui-index', 'label' => 'Basics'],
+        ['slug' => 'ui-alert', 'label' => 'Alert'],
+        ['slug' => 'ui-badge', 'label' => 'Badge'],
+        ['slug' => 'ui-boolean', 'label' => 'Boolean'],
+        ['slug' => 'ui-box', 'label' => 'Box'],
+        ['slug' => 'ui-breadcrumbs', 'label' => 'Breadcrumbs'],
+        ['slug' => 'ui-card', 'label' => 'Card'],
+        ['slug' => 'ui-collapse', 'label' => 'Collapse'],
+        ['slug' => 'ui-divider', 'label' => 'Divider'],
+        ['slug' => 'ui-dropdown', 'label' => 'Dropdown'],
+        ['slug' => 'ui-icon', 'label' => 'Icon'],
+        ['slug' => 'ui-files', 'label' => 'Files'],
+        ['slug' => 'ui-form', 'label' => 'Form elements'],
+        ['slug' => 'ui-grid', 'label' => 'Grid/Column'],
+        ['slug' => 'ui-link', 'label' => 'Link'],
+        ['slug' => 'ui-loader', 'label' => 'Loader'],
+        ['slug' => 'ui-modal', 'label' => 'Modal'],
+        ['slug' => 'ui-offcanvas', 'label' => 'Offcanvas'],
+        ['slug' => 'ui-paginations', 'label' => 'Paginations'],
+        ['slug' => 'ui-popover', 'label' => 'Popover'],
+        ['slug' => 'ui-progress_bar', 'label' => 'Progress bar'],
+        ['slug' => 'ui-rating', 'label' => 'Rating'],
+        ['slug' => 'ui-spinner', 'label' => 'Spinner'],
+        ['slug' => 'ui-table', 'label' => 'Table'],
+        ['slug' => 'ui-tabs', 'label' => 'Tabs'],
+        ['slug' => 'ui-thumbnail', 'label' => 'Thumbnail'],
+        ['slug' => 'ui-title', 'label' => 'Title'],
+        ['slug' => 'ui-toast', 'label' => 'Toast'],
+        ['slug' => 'ui-tooltip', 'label' => 'Tooltip'],
     ],
 
 //    ':_divider_',
diff --git a/public/screenshots/metrics_donut_chart.png b/public/screenshots/donut_chart_metric.png
similarity index 100%
rename from public/screenshots/metrics_donut_chart.png
rename to public/screenshots/donut_chart_metric.png
diff --git a/public/screenshots/donut_chart_metric_column_span.png b/public/screenshots/donut_chart_metric_column_span.png
new file mode 100644
index 00000000..c7c6b6ed
Binary files /dev/null and b/public/screenshots/donut_chart_metric_column_span.png differ
diff --git a/public/screenshots/donut_chart_metric_column_span_dark.png b/public/screenshots/donut_chart_metric_column_span_dark.png
new file mode 100644
index 00000000..94be8454
Binary files /dev/null and b/public/screenshots/donut_chart_metric_column_span_dark.png differ
diff --git a/public/screenshots/metrics_donut_chart_dark.png b/public/screenshots/donut_chart_metric_dark.png
similarity index 100%
rename from public/screenshots/metrics_donut_chart_dark.png
rename to public/screenshots/donut_chart_metric_dark.png
diff --git a/public/screenshots/metrics_line_chart.png b/public/screenshots/line_chart_metric.png
similarity index 100%
rename from public/screenshots/metrics_line_chart.png
rename to public/screenshots/line_chart_metric.png
diff --git a/public/screenshots/line_chart_metric_column_span.png b/public/screenshots/line_chart_metric_column_span.png
new file mode 100644
index 00000000..fb10940f
Binary files /dev/null and b/public/screenshots/line_chart_metric_column_span.png differ
diff --git a/public/screenshots/line_chart_metric_column_span_dark.png b/public/screenshots/line_chart_metric_column_span_dark.png
new file mode 100644
index 00000000..19baa246
Binary files /dev/null and b/public/screenshots/line_chart_metric_column_span_dark.png differ
diff --git a/public/screenshots/metrics_line_chart_dark.png b/public/screenshots/line_chart_metric_dark.png
similarity index 100%
rename from public/screenshots/metrics_line_chart_dark.png
rename to public/screenshots/line_chart_metric_dark.png
diff --git a/public/screenshots/metrics_value.png b/public/screenshots/metrics_value.png
deleted file mode 100644
index 40107668..00000000
Binary files a/public/screenshots/metrics_value.png and /dev/null differ
diff --git a/public/screenshots/metrics_value_dark.png b/public/screenshots/metrics_value_dark.png
deleted file mode 100644
index cea10e7c..00000000
Binary files a/public/screenshots/metrics_value_dark.png and /dev/null differ
diff --git a/public/screenshots/metrics_value_format.png b/public/screenshots/metrics_value_format.png
deleted file mode 100644
index a814f4d8..00000000
Binary files a/public/screenshots/metrics_value_format.png and /dev/null differ
diff --git a/public/screenshots/metrics_value_format_dark.png b/public/screenshots/metrics_value_format_dark.png
deleted file mode 100644
index 6cba1208..00000000
Binary files a/public/screenshots/metrics_value_format_dark.png and /dev/null differ
diff --git a/public/screenshots/metrics_value_progress.png b/public/screenshots/metrics_value_progress.png
deleted file mode 100644
index 11a5c19e..00000000
Binary files a/public/screenshots/metrics_value_progress.png and /dev/null differ
diff --git a/public/screenshots/metrics_value_progress_dark.png b/public/screenshots/metrics_value_progress_dark.png
deleted file mode 100644
index 9f9d5776..00000000
Binary files a/public/screenshots/metrics_value_progress_dark.png and /dev/null differ
diff --git a/public/screenshots/value_metric.png b/public/screenshots/value_metric.png
new file mode 100644
index 00000000..3720536b
Binary files /dev/null and b/public/screenshots/value_metric.png differ
diff --git a/public/screenshots/value_metric_column_span.png b/public/screenshots/value_metric_column_span.png
new file mode 100644
index 00000000..dbd66053
Binary files /dev/null and b/public/screenshots/value_metric_column_span.png differ
diff --git a/public/screenshots/value_metric_column_span_dark.png b/public/screenshots/value_metric_column_span_dark.png
new file mode 100644
index 00000000..5f868c02
Binary files /dev/null and b/public/screenshots/value_metric_column_span_dark.png differ
diff --git a/public/screenshots/value_metric_dark.png b/public/screenshots/value_metric_dark.png
new file mode 100644
index 00000000..42385b2c
Binary files /dev/null and b/public/screenshots/value_metric_dark.png differ
diff --git a/public/screenshots/value_metric_format.png b/public/screenshots/value_metric_format.png
new file mode 100644
index 00000000..bd37491c
Binary files /dev/null and b/public/screenshots/value_metric_format.png differ
diff --git a/public/screenshots/value_metric_format_dark.png b/public/screenshots/value_metric_format_dark.png
new file mode 100644
index 00000000..891ed0df
Binary files /dev/null and b/public/screenshots/value_metric_format_dark.png differ
diff --git a/public/screenshots/value_metric_icon.png b/public/screenshots/value_metric_icon.png
new file mode 100644
index 00000000..b640d8e7
Binary files /dev/null and b/public/screenshots/value_metric_icon.png differ
diff --git a/public/screenshots/value_metric_icon_dark.png b/public/screenshots/value_metric_icon_dark.png
new file mode 100644
index 00000000..fab07169
Binary files /dev/null and b/public/screenshots/value_metric_icon_dark.png differ
diff --git a/public/screenshots/value_metric_progress.png b/public/screenshots/value_metric_progress.png
new file mode 100644
index 00000000..fcc9041f
Binary files /dev/null and b/public/screenshots/value_metric_progress.png differ
diff --git a/public/screenshots/value_metric_progress_dark.png b/public/screenshots/value_metric_progress_dark.png
new file mode 100644
index 00000000..3015cb87
Binary files /dev/null and b/public/screenshots/value_metric_progress_dark.png differ
diff --git a/resources/views/pages/en/actions/export.blade.php b/resources/views/pages/en/actions/export.blade.php
deleted file mode 100644
index c5441f0a..00000000
--- a/resources/views/pages/en/actions/export.blade.php
+++ /dev/null
@@ -1,51 +0,0 @@
-<x-page title="Export">
-
-<x-p>
-    Exports all data considering filters
-</x-p>
-
-<x-code language="php">
-use MoonShine\Actions\ExportAction;
-
-//...
-public function actions(): array
-{
-    return [
-        ExportAction::make('Export')
-            // Optional methods
-            // If you want to run in the background
-            ->queue()
-            // Selecting a drive
-            ->disk('public')
-            // Selecting a save directory
-            ->dir('/exports')
-            // If you want to use csv format
-            ->csv()
-            // If you use csv
-            ->delimiter(',')
-        ,
-    ];
-}
-//...
-</x-code>
-
-<x-p>
-    Only fields having a <code>showOnExport</code> flag will be exported
-</x-p>
-
-<x-code language="php">
-
-//...
-public function fields(): array
-{
-    return [
-        ID::make()->showOnExport(),
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/export.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/export_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/actions/import.blade.php b/resources/views/pages/en/actions/import.blade.php
deleted file mode 100644
index 5506cd44..00000000
--- a/resources/views/pages/en/actions/import.blade.php
+++ /dev/null
@@ -1,53 +0,0 @@
-<x-page title="Import">
-
-<x-p>
-    Imports data
-</x-p>
-
-<x-code language="php">
-use MoonShine\Actions\ImportAction;
-
-//...
-public function actions(): array
-{
-    return [
-        ImportAction::make('Import')
-            // Optional methods
-            // If you want to run in the background
-            ->queue()
-            // Selecting a drive
-            ->disk('public')
-            // Selecting a save directory
-            ->dir('/exports')
-            // Delete after importing
-            ->deleteAfter()
-            // If you use csv
-            ->delimiter(',')
-        ,
-    ];
-}
-//...
-</x-code>
-
-<x-p>
-    Only those fields will be imported that are marked using the <code>useOnImport</code>
-</x-p>
-
-<x-code language="php">
-
-//...
-public function fields(): array
-{
-    return [
-        // Be sure to mark the identifier, otherwise all entries will be added and not edited
-        ID::make()
-            ->useOnImport(),
-
-        Text::make('Title')
-            ->useOnImport(),
-    ];
-}
-//...
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/actions/index.blade.php b/resources/views/pages/en/actions/index.blade.php
deleted file mode 100644
index d38f10dd..00000000
--- a/resources/views/pages/en/actions/index.blade.php
+++ /dev/null
@@ -1,10 +0,0 @@
-<x-page title="Basics">
-<x-p>
-    The actions are set in the <code>actions</code> resource method.
-</x-p>
-
-<x-p>
-    Could be used to append additional processes for the main page of the resource.
-</x-p>
-
-</x-page>
diff --git a/resources/views/pages/en/advanced/assets.blade.php b/resources/views/pages/en/advanced/assets.blade.php
deleted file mode 100644
index abcce6ea..00000000
--- a/resources/views/pages/en/advanced/assets.blade.php
+++ /dev/null
@@ -1,30 +0,0 @@
-<x-page title="Resources">
-
-<x-p>
-    MoonShine can include any of your css and js files by adding them to the
-    MoonShineServiceProvider
-</x-p>
-
-<x-code language="php">
-use MoonShine\Utilities\AssetManager;
-
-class MoonShineServiceProvider extends ServiceProvider
-{
-    //...
-    public function boot(): void
-    {
-        //...
-        app(AssetManager::class)->add([
-            '/css/style.css',
-            '/js/main.js',
-        ]);
-        //...
-    }
-    //...
-}
-</x-code>
-
-</x-page>
-
-
-
diff --git a/resources/views/pages/en/advanced/authentication.blade.php b/resources/views/pages/en/advanced/authentication.blade.php
deleted file mode 100644
index 879bcd8d..00000000
--- a/resources/views/pages/en/advanced/authentication.blade.php
+++ /dev/null
@@ -1,133 +0,0 @@
-<x-page title="Authentication" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#extending', 'label' => 'Extending capabilities'],
-        ['url' => '#greetings', 'label' => 'Greetings'],
-        ['url' => '#profile', 'label' => 'Profile']
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    The Moonshine admin panel implements an authentication system that is enabled by default,
-    but if you need to allow access for all users,
-    you can disable it in the configuration file <code>config/moonshine.php</code>
-</x-p>
-
-<x-code language="php">
-return [
-    // ...
-    'auth' => [
-        'enable' => true, // [tl! focus]
-        // ...
-    ],
-    // ...
-];
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/login.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/login_dark.png') }}"></x-image>
-
-<x-sub-title id="extending">Extending capabilities</x-sub-title>
-
-<x-p>
-    If you use your own guard, provider, then they can be redefined in the configuration,
-    as well as the <code>MoonshineUser</code> model
-</x-p>
-
-<x-code language="php">
-return [
-    // ...
-    'auth' => [
-        // ...
-        'guard' => 'moonshine', // [tl! focus:start]
-        'guards' => [
-            'moonshine' => [
-                'driver' => 'session',
-                'provider' => 'moonshine',
-            ],
-        ],
-        'providers' => [
-            'moonshine' => [
-                'driver' => 'eloquent',
-                'model' => MoonshineUser::class,
-            ],
-        ], // [tl! focus:end]
-        // ...
-    ],
-    // ...
-];
-</x-code>
-
-<x-p>
-    If there is a need to add text under the login button (for example, add a registration button),
-    then this can easily be done through the configuration file
-</x-p>
-
-<x-code language="php">
-return [
-    // ...
-    'auth' => [
-        // ...
-            'footer' => '<a href="https://cutcode.dev/" target="_blank">CutCode</a>' // [tl! focus]
-        ],
-        // ...
-    ],
-    // ...
-];
-</x-code>
-
-<x-sub-title id="greetings">Greetings</x-sub-title>
-
-<x-p>
-    To change the welcome text on the authentication page,
-    you need to create a language file <code>lang/vendor/moonshine/en/ui.php</code>
-</x-p>
-
-<x-code language="php">
-return [
-    // ...
-    'login' => [ // [tl! focus:start]
-        'title' => 'Welcome to :moonshine_title!',
-        'description' => 'Please sign-in to your account',
-    ], // [tl! focus:end]
-    // ...
-];
-</x-code>
-
-<x-sub-title id="profile">Profile</x-sub-title>
-
-<x-p>
-    You can override the fields for the profile in the configuration file <code>config/moonshine.php</code>
-</x-p>
-
-<x-code language="php">
-return [
-    // ...
-    'auth' => [
-        'enable' => true,
-        'fields' => [ // [tl! focus:start]
-            'username' => 'email',
-            'password' => 'password',
-            'name' => 'name',
-            'avatar' => 'avatar'
-        ], // [tl! focus:end]
-        'guard' => 'moonshine',
-        // ...
-    ],
-    // ...
-];
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.book-open">
-    If you don't want to use an avatar,
-    then specify <code>'avatar'=>''</code> or <code>'avatar'=>false</code>.
-</x-moonshine::alert>
-
-<x-moonshine::alert type="default" icon="heroicons.book-open">
-    If you want to change the look of your profile page,
-    then create a file <code>resources/views/vendor/moonshine/profile.blade.php</code>
-</x-moonshine::alert>
-
-</x-page>
diff --git a/resources/views/pages/en/advanced/authorization.blade.php b/resources/views/pages/en/advanced/authorization.blade.php
deleted file mode 100644
index 4a814012..00000000
--- a/resources/views/pages/en/advanced/authorization.blade.php
+++ /dev/null
@@ -1,92 +0,0 @@
-<x-page title="Authorization">
-
-<x-p>
-    We stick to the Laravel concept, so using the Laravel policy we can operate
-    access rights from the MoonShine admin panel
-</x-p>
-
-<x-p>
-    MoonShine resource controllers check each method for permissions.
-    If difficulties arise, check the official Laravel documentation
-</x-p>
-
-<x-p>
-    By default, permission checking is disabled for resources. To enable it, you must add the
-    <code>$withPolicy</code> property
-</x-p>
-
-<x-p>
-    Available Policy methods:
-</x-p>
-
-<x-ul :items="['viewAny', 'view', 'create', 'update', 'delete', 'massDelete', 'restore', 'forceDelete']"></x-ul>
-
-<x-code language="php">
-namespace App\Policies;
-
-use Illuminate\Auth\Access\HandlesAuthorization;
-use MoonShine\Models\MoonshineUser;
-use App\Models\Post;
-
-class PostPolicy
-{
-    use HandlesAuthorization;
-
-    public function viewAny(MoonshineUser $user)
-    {
-        //
-    }
-
-    public function view(MoonshineUser $user, Post $model)
-    {
-        //
-    }
-
-    public function create(MoonshineUser $user)
-    {
-        //
-    }
-
-    public function update(MoonshineUser $user, Post $model)
-    {
-        //
-    }
-
-    public function delete(MoonshineUser $user, Post $model)
-    {
-        //
-    }
-
-    public function massDelete(MoonshineUser $user)
-    {
-        //
-    }
-
-    public function restore(MoonshineUser $user, Post $model)
-    {
-        //
-    }
-
-    public function forceDelete(MoonshineUser $user, Post $model)
-    {
-        //
-    }
-}
-</x-code>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Models\MoonshineUser;
-
-class PostResource extends Resource
-{
-//...
-
-public static bool $withPolicy = true; // [tl! focus]
-
-//...
-}
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/advanced/dashboard.blade.php b/resources/views/pages/en/advanced/dashboard.blade.php
deleted file mode 100644
index 2d853b1f..00000000
--- a/resources/views/pages/en/advanced/dashboard.blade.php
+++ /dev/null
@@ -1,115 +0,0 @@
-<x-page title="Dashboard" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basic', 'label' => 'Basics'],
-        ['url' => '#resource-preview', 'label' => 'Block with resource records'],
-        ['url' => '#text-block', 'label' => 'Text block']
-    ]
-]">
-
-<x-sub-title id="basic">Basics</x-sub-title>
-<x-p>
-    The home page of the admin panel can be customized through the class <code>app/MoonShine/Dashboard.php</code>.
-</x-p>
-
-<x-p>
-    Currently you can display <x-link link="{{ route('moonshine.page', 'metrics-index') }}">metrics</x-link> in the control panel
-</x-p>
-
-<x-p>
-    The required metrics are registered in the blocks method and placed in the DashboardBlock wrapper for a convenient arrangement of the panel
-</x-p>
-
-<x-p>
-    <x-link link="{{ route('moonshine.page', 'decorations-layout#grid-column') }}">Layout (columnSpan)</x-link>
-    decorating methods are also available for the elements
-</x-p>
-
-<x-code language="php">
-namespace App\MoonShine;
-
-use App\Models\User;
-use MoonShine\Dashboard\DashboardBlock;
-use MoonShine\Dashboard\DashboardScreen;
-use MoonShine\Metrics\ValueMetric;
-
-class Dashboard extends DashboardScreen
-{
-    public function blocks(): array
-    {
-        return [
-            DashboardBlock::make([
-                ValueMetric::make('Users')
-                    ->value(User::query()->count())
-            ])
-        ];
-    }
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/dashboard.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/dashboard_dark.png') }}"></x-image>
-
-<x-sub-title id="resource-preview">Block with resource records</x-sub-title>
-
-<x-p>
-    Sometimes it is extremely convenient to add a table with records from a resource to the main page for quick access.
-    To do this, use <code>ResourcePreview</code>
-</x-p>
-
-<x-code language="php">
-namespace App\MoonShine;
-
-use App\Models\Article;
-use MoonShine\Dashboard\DashboardBlock;
-use MoonShine\Dashboard\DashboardScreen;
-use MoonShine\Dashboard\ResourcePreview;
-
-class Dashboard extends DashboardScreen
-{
-    public function blocks(): array
-    {
-        return [
-            DashboardBlock::make([
-                ResourcePreview::make(
-                    new ArticleResource(), // Mandatory parameter with MoonShine resource
-                    'Latest articles' // Optional - block header
-                    Article::query()->where('active', true)->limit(2) // Optional QueryBuilder
-                )
-            ])
-        ];
-    }
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/resource_preview.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/resource_preview_dark.png') }}"></x-image>
-
-<x-sub-title id="text-block">Text block</x-sub-title>
-
-<x-p>
-    To display plain text
-</x-p>
-
-<x-code language="php">
-namespace App\MoonShine;
-
-use MoonShine\Dashboard\DashboardBlock;
-use MoonShine\Dashboard\DashboardScreen;Welcome
-use MoonShine\Dashboard\TextBlock;
-
-class Dashboard extends DashboardScreen
-{
-    public function blocks(): array
-    {
-        return [
-            DashboardBlock::make([
-                TextBlock::make(
-                    'Welcome',
-                    view('welcome')->render()
-                )
-            ])
-        ];
-    }
-}
-</x-code>
-</x-page>
diff --git a/resources/views/pages/en/advanced/development.blade.php b/resources/views/pages/en/advanced/development.blade.php
deleted file mode 100644
index deee2407..00000000
--- a/resources/views/pages/en/advanced/development.blade.php
+++ /dev/null
@@ -1,122 +0,0 @@
-<x-page title="Development" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#custom-field', 'label' => 'Custom field'],
-        ['url' => '#custom-action', 'label' => 'Custom action'],
-    ]
-]">
-
-<x-p>
-    MoonShine provides opportunities to extend the basic functionality and write your own packages that improve the features.
-    In this section, we will provide a list of such packages, an example with creating your own field and action.
-</x-p>
-
-<x-p>
-    If you can't figure out how your MoonShine package should look like, we've prepared a ready-made template for you.
-    <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine-package-template">
-        Package template
-    </x-moonshine::link-button>
-</x-p>
-
-<x-p>
-    The following entities could be extended:
-    <x-ul :items="['Fields', 'Filters', 'Decorations', 'Actions', 'Metrics', 'InputExtension', 'FormComponent', 'Resource']"></x-ul>
-</x-p>
-
-<x-sub-title id="custom-field">Custom field</x-sub-title>
-
-<x-p>
-    Here is a small example of creating your own field!
-    It is a visual editor based on the CKEditor js plugin
-</x-p>
-
-<x-p>
-    First, let's create a class that extends the MoonShine fields
-</x-p>
-
-<x-code language="php">
-namespace App\MoonShine\Fields;
-
-use MoonShine\Fields\Field;
-
-final class CKEditor extends Field
-{
-    protected static string $view = 'fields.ckeditor';
-
-    protected array $assets = [
-        'https://cdn.ckeditor.com/ckeditor5/35.3.0/super-build/ckeditor.js'
-    ];
-}
-</x-code>
-
-<x-p>
-    Then, create a view with implementation
-</x-p>
-
-<x-code language="blade" file="examples/extensions/ckeditor.blade.php"></x-code>
-
-<x-p>
-    That's it!
-</x-p>
-
-<x-sub-title id="custom-action">Custom Action</x-sub-title>
-
-<x-p>
-    MoonShine comes with several built-in actions such as
-    <x-link :link="route('moonshine.page', 'actions-export')">Export</x-link> и
-    <x-link :link="route('moonshine.page', 'actions-import')">Import</x-link>
-    but you can also create your own custom actions.
-</x-p>
-
-<x-p>
-    To do this, you need to create a class that extends the MoonShine action class and define the handle method.
-</x-p>
-
-<x-code language="php">
-namespace App\MoonShine\Actions;
-
-use MoonShine\Actions\Action;
-
-class CustomAction extends Action
-{
-    public function handle(): mixed
-    {
-        // Code with the handler logic
-    }
-}
-</x-code>
-
-<x-p>
-    This is enough to display our custom action on the resource page.
-    However, let's take a look at what else we can define in our action class.
-</x-p>
-
-<x-code language="php">
-class CustomAction extends Action
-{
-    protected static string $view = 'view.custom'; // Custom blade mapping
-
-    protected bool $withQuery = true; // Whether to pass the entire current getQuery to the action's URL.
-
-    protected bool $inDropdown = false; // Display the button outside the dropdown menu.
-
-    protected ?string $icon = 'heroicons.outline.table-cells'; // Icon for the button.
-}
-</x-code>
-
-<x-p>
-    Next, register the action in the actions method of the resource where you want to display it.
-</x-p>
-
-<x-code language="php">
-public function actions(): array
-{
-    return [
-        CustomAction::make('Custom Action'),
-    ];
-}
-</x-code>
-
-<x-p>
-    That's it!
-</x-p>
-</x-page>
diff --git a/resources/views/pages/en/advanced/events.blade.php b/resources/views/pages/en/advanced/events.blade.php
deleted file mode 100644
index dff96205..00000000
--- a/resources/views/pages/en/advanced/events.blade.php
+++ /dev/null
@@ -1,57 +0,0 @@
-<x-page title="Events">
-
-<x-p>
-    Since MoonShine is based on standard eloquent methods for adding, editing and deleting, you can easily use standard Laravel events:
-</x-p>
-
-<x-link link="https://laravel.com/docs/9.x/eloquent#events">https://laravel.com/docs/9.x/eloquent#events</x-link>
-
-
-<x-p>
-    But sometimes you need to snap exactly to the events within the MoonShine resources!
-    To do this, you need to implement the events you want in the resource
-</x-p>
-
-<x-code language="php">
-protected function beforeCreating(Model $item)
-{
-    // Event before adding an entry
-}
-
-protected function afterCreated(Model $item)
-{
-    // Event after adding a record
-}
-
-protected function beforeUpdating(Model $item)
-{
-    // Event before record update
-}
-
-protected function afterUpdated(Model $item)
-{
-    // Event after record update
-}
-
-protected function beforeDeleting(Model $item)
-{
-    // Event before record deletion
-}
-
-protected function afterDeleted(Model $item)
-{
-    // Event after record deletion
-}
-
-protected function beforeMassDeleting(array $ids)
-{
-    // Event before mass deletion of records
-}
-
-protected function afterMassDeleted(array $ids)
-{
-    // Event after mass deletion of records
-}
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/advanced/localization.blade.php b/resources/views/pages/en/advanced/localization.blade.php
deleted file mode 100644
index 1cd127cb..00000000
--- a/resources/views/pages/en/advanced/localization.blade.php
+++ /dev/null
@@ -1,8 +0,0 @@
-<x-page title="Localization">
-
-<x-p>
-    After installing MoonShine you will see a folder with MoonShine translations in the translations folder.
-    Here you can add new languages or modify the current ones.
-</x-p>
-
-</x-page>
diff --git a/resources/views/pages/en/advanced/menu.blade.php b/resources/views/pages/en/advanced/menu.blade.php
deleted file mode 100644
index 5abb0970..00000000
--- a/resources/views/pages/en/advanced/menu.blade.php
+++ /dev/null
@@ -1,252 +0,0 @@
-<x-page title="Menu" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#register', 'label' => 'Registration'],
-        ['url' => '#condition', 'label' => 'Condition-based display'],
-        ['url' => '#link', 'label' => 'External link'],
-        ['url' => '#icon', 'label' => 'Icon'],
-        ['url' => '#badge', 'label' => 'Tag'],
-        ['url' => '#translation', 'label' => 'Translation'],
-        ['url' => '#divider', 'label' => 'Divider']
-    ]
-]">
-
-<x-sub-title id="register">Registration</x-sub-title>
-
-<x-p>
-    We have already figured out how to register sections of the admin panel
-    to make them appear in the menu
-</x-p>
-
-<x-code language="php">
-namespace App\Providers;
-
-use Illuminate\Support\ServiceProvider;
-use MoonShine\Menu\MenuItem; // [tl! focus]
-use MoonShine\MoonShine; // [tl! focus]
-use MoonShine\Resources\MoonShineUserResource;
-use MoonShine\Resources\MoonShineUserRoleResource;
-
-class MoonShineServiceProvider extends ServiceProvider
-{
-    //...
-
-    public function boot()
-    {
-        app(MoonShine::class)->menu([ // [tl! focus:start]
-            MenuItem::make('Admins', new MoonShineUserResource()),
-            MenuItem::make('Roles', new MoonShineUserRoleResource()),
-        ]); // [tl! focus:end]
-    }
-}
-</x-code>
-
-<x-p>
-    But to make our interface convenient we can also group menu items
-</x-p>
-
-<x-code language="php">
-namespace App\Providers;
-
-use Illuminate\Support\ServiceProvider;
-use MoonShine\Menu\MenuItem;
-use MoonShine\Menu\MenuGroup; // [tl! focus]
-use MoonShine\MoonShine;
-use MoonShine\Resources\MoonShineUserResource;
-use MoonShine\Resources\MoonShineUserRoleResource;
-
-class MoonShineServiceProvider extends ServiceProvider
-{
-    //...
-
-    public function boot()
-    {
-        app(MoonShine::class)->menu([
-            MenuGroup::make('System', [ // [tl! focus]
-                MenuItem::make('Admins', new MoonShineUserResource()),
-                MenuItem::make('Roles', new MoonShineUserRoleResource()),
-            ]) // [tl! focus]
-        ]);
-    }
-}
-</x-code>
-
-<x-p>
-    You just need to add the resources as a second parameter to the <code>MoonShine\Menu\MenuGroup</code> class.
-    And the first parameter is the name of the group!
-</x-p>
-
-<x-image theme="light" src="{{ asset('screenshots/menu.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/menu_dark.png') }}"></x-image>
-
-<x-sub-title id="condition">Condition-based display</x-sub-title>
-
-<x-p>
-    Displays menu based on the condition
-</x-p>
-
-<x-code language="php">
-//...
-app(MoonShine::class)->menu([
-    MenuGroup::make('System', [
-        MenuItem::make('Admins', new MoonShineUserResource()),
-        MenuItem::make('Roles', new MoonShineUserRoleResource()),
-    ])->canSee(function(Request $request) { // [tl! focus:start]
-        return $request->user('moonshine')?->id === 1;
-    }) // [tl! focus:end]
-]);
-//...
-</x-code>
-
-<x-sub-title id="link">External link</x-sub-title>
-
-<x-p>
-    Adding a custom link
-</x-p>
-
-<x-code language="php">
-//...
-app(MoonShine::class)->menu([
-    MenuItem::make('Документация Laravel', 'https://laravel.com') // [tl! focus]
-]);
-//...
-</x-code>
-
-<x-p>
-     Links can be passed through a function
-</x-p>
-
-<x-code language="php">
-//...
-app(MoonShine::class)->menu([
-    MenuItem::make('Admins', function () { // [tl! focus:start]
-        return (new MoonShineUserResource())->route('index');
-    }),
-    MenuItem::make('Home', fn() => route('home')) // [tl! focus:end]
-]);
-//...
-</x-code>
-
-<x-sub-title id="icon">Icon</x-sub-title>
-
-<x-p>
-    You can also change the icon of the menu item
-</x-p>
-
-<x-code language="php">
-//...
-app(MoonShine::class)->menu([
-    MenuGroup::make('Система', [ // [tl! focus:start]
-        MenuItem::make('Admins', new MoonShineUserResource())->icon('heroicons.hashtag'),
-        MenuItem::make('Roles', new MoonShineUserRoleResource())->icon('heroicons.hashtag'),
-    ])->icon('app') // [tl! focus:end]
-    // or
-    MenuGroup::make('Blog', [ // [tl! focus:start]
-        MenuItem::make('Comments', new CommentResource(), 'heroicons.chat-bubble-left')
-    ], 'heroicons.newspaper') // [tl! focus:end]
-]);
-//...
-</x-code>
-
-<x-p>
-    For more information, see <x-link link="{{ route('moonshine.page', 'icons-index') }}">Icons</x-link>
-</x-p>
-
-<x-sub-title id="badge">Tag</x-sub-title>
-
-<x-p>
-    You can add a counter to the menu item
-</x-p>
-
-<x-code language="php">
-//...
-app(MoonShine::class)->menu([
-    MenuItem::make('Comments', new CommentResource())
-        ->badge(fn() => Comment::query()->count()), // [tl! focus]
-]);
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/menu_badge.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/menu_badge_dark.png') }}"></x-image>
-
-<x-sub-title id="translation">Translation</x-sub-title>
-
-<x-p>
-    To translate menu items, you need to add the translation key as the name
-    and add the <code>translatable()</code> method
-</x-p>
-
-<x-code language="php">
-//...
-app(MoonShine::class)->menu([
-    MenuItem::make('menu.Comments', new CommentResource())
-        ->translatable() // [tl! focus]
-    // or
-    MenuItem::make('Comments', new CommentResource())
-        ->translatable('menu') // [tl! focus]
-]);
-//...
-</x-code>
-
-<x-code language="php">
-// lang/ru/menu.php
-
-return [
-    'Comments' => 'Комментарии',
-];
-</x-code>
-
-<x-p>
-    To translate menu labels, you can use Laravel's translation tools
-</x-p>
-
-<x-code language="php">
-//...
-app(MoonShine::class)->menu([
-    MenuItem::make('Comments', new CommentResource())
-        ->badge(fn() => __('menu.badge.new')) // [tl! focus]
-]);
-//...
-</x-code>
-
-<x-sub-title id="divider">Divider</x-sub-title>
-
-<x-p>
-    Menu items can be visually separated using <code>MenuDivider</code>
-</x-p>
-
-<x-code language="php">
-use MoonShine\Menu\MenuDivider; // [tl! focus]
-
-//...
-app(MoonShine::class)->menu([
-    MenuItem::make('Categories', new CategoryResource()),
-    MenuDivider::make(), // [tl! focus]
-    MenuItem::make('Articles', new ArticleResource()),
-]);
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/menu_divider.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/menu_divider_dark.png') }}"></x-image>
-
-<x-p>
-    You can use text as a separator, for this you need to pass it to the <code>make()</code> method
-</x-p>
-
-<x-code language="php">
-use MoonShine\Menu\MenuDivider; // [tl! focus]
-
-//...
-app(MoonShine::class)->menu([
-    MenuItem::make('Categories', new CategoryResource()),
-    MenuDivider::make('Divider'), // [tl! focus]
-    MenuItem::make('Articles', new ArticleResource()),
-]);
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/menu_divider_label.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/menu_divider_label_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/advanced/notifications.blade.php b/resources/views/pages/en/advanced/notifications.blade.php
deleted file mode 100644
index 400286b1..00000000
--- a/resources/views/pages/en/advanced/notifications.blade.php
+++ /dev/null
@@ -1,25 +0,0 @@
-<x-page title="Notifications">
-
-<x-p>
-    If you need to add notifications to the MoonShine notification center,
-    you can use the class: <code>MoonShine\Notifications\MoonShineNotification</code>
-</x-p>
-
-<x-code language="php">
-use MoonShine\Notifications\MoonShineNotification;
-
-MoonShineNotification::send(
-    message: 'Notification message',
-    // Optional button
-    button: ['link' => 'https://moonshine.cutcode.dev', 'label' => 'Click me'],
-    // Optional id administrators (by default for everyone)
-    ids: [1,2,3],
-    // Optional icon color (purple, pink, blue, green, yellow, red, gray)
-    color: 'green'
-);
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/notifications.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/notifications_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/advanced/pages.blade.php b/resources/views/pages/en/advanced/pages.blade.php
deleted file mode 100644
index 02712e12..00000000
--- a/resources/views/pages/en/advanced/pages.blade.php
+++ /dev/null
@@ -1,150 +0,0 @@
-<x-page title="Pages" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#without-title', 'label' => 'Without title'],
-        ['url' => '#layout', 'label' => 'Layout'],
-        ['url' => '#class', 'label' => 'class CustomPage'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    You can create your own blank pages based on the blade view
-    and <x-link link="{{ route('moonshine.page', 'components-index') }}">UI components</x-link>,
-    style in your own way, as well as organize some kind of logic.
-</x-p>
-
-<x-code language="php">
-use Illuminate\Support\ServiceProvider;
-use MoonShine\Menu\MenuItem;
-use MoonShine\MoonShine;
-use MoonShine\Resources\CustomPage; // [tl! focus]
-
-class MoonShineServiceProvider extends ServiceProvider
-{
-    public function boot(): void
-    {
-        app(MoonShine::class)->menu([
-            MenuItem::make(
-                'Page title',
-                CustomPage::make('Page title', 'slug', 'view', fn() => []) // [tl! focus]
-            )
-        ]);
-    }
-}
-</x-code>
-
-<x-p>
-    The first argument - page title.
-</x-p>
-
-<x-p>
-    The second argument - page slug to generate url.
-</x-p>
-
-<x-p>
-    The third argument - your custom blade view, which could be found in the resources/views.
-</x-p>
-
-<x-p>
-    The fourth argument - the data required for view.
-</x-p>
-
-<x-moonshine::alert type="default" icon="heroicons.book-open">
-    You can use <code>blade components</code> which have a handler class to add your own logic.
-</x-moonshine::alert>
-
-<x-sub-title id="without-title">Without title</x-sub-title>
-
-<x-p>
-    Sometimes it is not required to display the title on a custom page, so it can be hidden using the <code>withoutTitle</code> method.
-</x-p>
-
-<x-code language="php">
-use Illuminate\Support\ServiceProvider;
-use MoonShine\Menu\MenuItem;
-use MoonShine\MoonShine;
-use MoonShine\Resources\CustomPage;
-
-class MoonShineServiceProvider extends ServiceProvider
-{
-    public function boot(): void
-    {
-        app(MoonShine::class)->menu([
-            MenuItem::make(
-                'Page title',
-                CustomPage::make('Page title', 'slug', 'view', fn() => [])
-                    ->withoutTitle()  // [tl! focus]
-            )
-        ]);
-    }
-}
-</x-code>
-
-<x-sub-title id="layout">Layout</x-sub-title>
-
-<x-p>
-    You can use custom <code>layout</code>, for this you need to specify the path to it in the corresponding method.
-</x-p>
-
-<x-code language="php">
-use Illuminate\Support\ServiceProvider;
-use MoonShine\Menu\MenuItem;
-use MoonShine\MoonShine;
-use MoonShine\Resources\CustomPage;
-
-class MoonShineServiceProvider extends ServiceProvider
-{
-    public function boot(): void
-    {
-        app(MoonShine::class)->menu([
-            MenuItem::make(
-                'Page title',
-                CustomPage::make('Page title', 'slug', 'view', fn() => [])
-                    ->layout('path') // [tl! focus]
-            )
-        ]);
-    }
-}
-</x-code>
-]
-<x-sub-title id="class">class CustomPage</x-sub-title>
-
-<x-p>
-    Pages can be created through a class, just run the command:
-</x-p>
-
-<x-code language="shell">
-    php artisan moonshine:page ExamplePage
-</x-code>
-
-<x-p>
-    As a result, a <code>ExamplePage</code> class will be created, which will be the basis of the custom page.
-    It is located by default in the <code>app/MoonShine/Pages</code> directory.
-</x-p>
-
-<x-p>When executing the command, you can immediately set an alias, title and blade view for your page.</x-p>
-
-<x-code language="shell">
-    php artisan moonshine:page ExamplePage --alias="example" --title="Example Page" --view="pages.example"
-</x-code>
-
-<x-p>After creating a page, it can be added to the menu.</x-p>
-
-<x-code language="php">
-use Illuminate\Support\ServiceProvider;
-use MoonShine\Pages\ExamplePage; // [tl! focus]
-
-class MoonShineServiceProvider extends ServiceProvider
-{
-    public function boot(): void
-    {
-        app(MoonShine::class)->menu([
-            MenuItem::make('Example', new ExamplePage()) // [tl! focus]
-        ]);
-    }
-}
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/advanced/routes.blade.php b/resources/views/pages/en/advanced/routes.blade.php
deleted file mode 100644
index 348d4ffa..00000000
--- a/resources/views/pages/en/advanced/routes.blade.php
+++ /dev/null
@@ -1,68 +0,0 @@
-<x-page
-    title="Routes"
-    :sectionMenu="[
-        'Sections' => [
-            ['url' => '#basics', 'label' => 'Resource routes'],
-            ['url' => '#resolve', 'label' => 'Custom routes'],
-        ]
-    ]"
->
-
-<x-sub-title id="basics">Resource routes</x-sub-title>
-
-<x-p>
-    In MoonShine, the resource has many routes registered for various actions:
-</x-p>
-
-<x-code language="php">
-$this->route('index'); // GET|HEAD - list of items
-$this->route('create'); // GET|HEAD - create a new item
-$this->route('store'); // POST - save a new item
-$this->route('edit', $resourceItem); // GET|HEAD - edit an item
-$this->route('update', $resourceItem); // PUT|PATCH - save an item
-$this->route('destroy', $resourceItem); // DELETE - delete an item
-$this->route('show', $resourceItem); // GET|HEAD - view an item
-$this->route('query-tag', $queryTag); // GET|HEAD - filtered list of items by query filter / tag
-$this->route('update-column', $resourceItem); // PUT - save an item`s field
-</x-code>
-
-<x-sub-title id="resolve">Custom routes</x-sub-title>
-
-<x-p>
-    Through the <code>resolveRoutes()</code> method, you can add or override default routes.
-</x-p>
-
-<x-code language="php">
-namespace App\MoonShine\Resources;
-
-use App\Models\Post;
-use MoonShine\Resources\Resource;
-
-class PostResource extends Resource
-{
-    public static string $model = Post::class;
-
-    // ...
-
-    public function resolveRoutes(): void // [tl! focus:start]
-    {
-        parent::resolveRoutes();
-
-        Route::prefix('resource')->group(function (): void {
-            Route::get("{$this->uriKey()}/restore/{resourceItem}", function (Post $item) {
-                $item->restore();
-
-                return redirect()->back();
-            });
-        });
-    } // [tl! focus:end]
-
-    // ...
-}
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.book-open">
-    To access a route outside of a resource, use <code>(new Resource())->route('index')</code>.
-</x-moonshine::alert>
-
-</x-page>
diff --git a/resources/views/pages/en/advanced/socialite.blade.php b/resources/views/pages/en/advanced/socialite.blade.php
deleted file mode 100644
index 1f7167d7..00000000
--- a/resources/views/pages/en/advanced/socialite.blade.php
+++ /dev/null
@@ -1,36 +0,0 @@
-<x-page title="Socialite">
-
-<x-p>
-    For convenience, you can link the account to social networks and simplify the authentication process
-</x-p>
-
-<x-p>
-    The process is based on a Laravel package - Socialite
-</x-p>
-
-<x-link link="https://laravel.com/docs/socialite">Socialite</x-link>
-
-<x-p>
-    Make sure you have it installed and configured
-</x-p>
-
-<x-p>
-    Next, in the moonshine config <code>config/moonshine.php</code> install the available drivers (you should already have them set up) and the image for the button
-</x-p>
-
-<x-code language="php">
-return [
-    //
-    'socialite' => [
-        'github' => '/images/github.png',
-        'facebook' => '/images/facebook.svg'
-    ]
-    //
-];
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    If you use your model for authentication, then you need to add the trait <code>HasMoonShineSocialite</code> to it
-</x-moonshine::alert>
-
-</x-page>
diff --git a/resources/views/pages/en/components/alert.blade.php b/resources/views/pages/en/components/alert.blade.php
deleted file mode 100644
index a0180816..00000000
--- a/resources/views/pages/en/components/alert.blade.php
+++ /dev/null
@@ -1,58 +0,0 @@
-<x-page title="Alert" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#type', 'label' => 'Notification type'],
-        ['url' => '#icon', 'label' => 'Icon'],
-        ['url' => '#removable', 'label' => 'Removing notifications'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    If you need a notification on the page,
-    you can use the <code>moonshine::alert</code> component
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/alert.blade.php"></x-code>
-
-@include("examples/components/alert")
-
-<x-sub-title id="type">Notification type</x-sub-title>
-
-<x-p>
-    You can change the notification type by specifying the component <code>type</code>
-</x-p>
-
-@include('pages.en.components.shared.type')
-
-<x-code language="blade" file="resources/views/examples/components/alert-type.blade.php"></x-code>
-
-@include("examples/components/alert-type")
-
-<x-sub-title id="icon">Icon</x-sub-title>
-
-<x-p>
-    The notification has the ability to change the icon, for this you need to pass it to the <code>icon</code> parameter
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/alert-icon.blade.php"></x-code>
-
-@include("examples/components/alert-icon")
-
-<x-p>
-    For more information, see <x-link link="{{ route('moonshine.page', 'icons-index') }}">Icons</x-link>
-</x-p>
-
-<x-sub-title id="removable">Removing notifications</x-sub-title>
-
-<x-p>
-    To remove notifications after some time, you must pass the parameter <code>removable</code>
-    with the value <code>TRUE</code>
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/alert-removable.blade.php"></x-code>
-
-@include("examples/components/alert-removable")
-
-</x-page>
diff --git a/resources/views/pages/en/components/badge.blade.php b/resources/views/pages/en/components/badge.blade.php
deleted file mode 100644
index 034974d8..00000000
--- a/resources/views/pages/en/components/badge.blade.php
+++ /dev/null
@@ -1,22 +0,0 @@
-<x-page title="Badge" :sectionMenu="[]">
-
-<x-p>
-    If you need to place a badge on a custom page,
-    you can use the <code>moonshine::badge</code> component
-</x-p>
-
-<x-p>
-    The following badges are available:
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/badge.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box class="flex flex-wrap gap-2">
-            @include("examples/components/badge")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/boolean.blade.php b/resources/views/pages/en/components/boolean.blade.php
deleted file mode 100644
index fc1cb2aa..00000000
--- a/resources/views/pages/en/components/boolean.blade.php
+++ /dev/null
@@ -1,27 +0,0 @@
-<x-page title="Boolean" :sectionMenu="[]">
-
-<x-p>
-    A simple <code>moonshine::boolean</code> component allows you to create an indicator <code>TRUE</code> / <code>FALSE</code>
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/boolean.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::card>
-            @include("examples/components/boolean")
-        </x-moonshine::card>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-code language="blade" file="resources/views/examples/components/boolean-false.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::card>
-            @include("examples/components/boolean-false")
-        </x-moonshine::card>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/box.blade.php b/resources/views/pages/en/components/box.blade.php
deleted file mode 100644
index 16c70d44..00000000
--- a/resources/views/pages/en/components/box.blade.php
+++ /dev/null
@@ -1,50 +0,0 @@
-<x-page title="Box" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#title', 'label' => 'Title'],
-        ['url' => '#dark', 'label' => 'Dark style'],
-    ]
-]">
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    To highlight content, you can use the <code>moonshine::box</code> component
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/box.blade.php" />
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        @include("examples/components/box")
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="title">Title</x-sub-title>
-
-<x-p>
-    The <code>title</code> parameter sets the title of the block
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/box-title.blade.php" />
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        @include("examples/components/box-title")
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="dark">Dark style</x-sub-title>
-
-<x-p>
-    You can set a dark style for a block by specifying the <code>dark</code> parameter with the value <code>TRUE</code>
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/box-dark.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        @include("examples/components/box-dark")
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/breadcrumbs.blade.php b/resources/views/pages/en/components/breadcrumbs.blade.php
deleted file mode 100644
index a39f5f98..00000000
--- a/resources/views/pages/en/components/breadcrumbs.blade.php
+++ /dev/null
@@ -1,17 +0,0 @@
-<x-page title="Breadcrumbs" :sectionMenu="[]">
-
-<x-p>
-    The <code>moonshine::breadcrumbs</code> component is used to create <code>breadcrumbs</code>
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/breadcrumbs.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/breadcrumbs")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/card.blade.php b/resources/views/pages/en/components/card.blade.php
deleted file mode 100644
index 51e3ba68..00000000
--- a/resources/views/pages/en/components/card.blade.php
+++ /dev/null
@@ -1,40 +0,0 @@
-<x-page title="Card" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#overlay', 'label' => 'Overlay view'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    To create cards in the admin panel, use the <code>moonshine::card</code> component
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/card.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <div class="mb-6">
-            @include("examples/components/card")
-        </div>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="overlay">Overlay view</x-sub-title>
-
-<x-p>
-    The <code>overlay</code> view is available for the card
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/card-overlay.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <div class="mb-6">
-            @include("examples/components/card-overlay")
-        </div>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/dropdown.blade.php b/resources/views/pages/en/components/dropdown.blade.php
deleted file mode 100644
index 11970cf6..00000000
--- a/resources/views/pages/en/components/dropdown.blade.php
+++ /dev/null
@@ -1,46 +0,0 @@
-<x-page title="Dropdown" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#title', 'label' => 'Title'],
-        ['url' => '#footer', 'label' => 'Footer'],
-        ['url' => '#placement', 'label' => 'Placement'],
-    ]
-]">
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    Using the <code>moonshine::dropdown</code> component, you can create dropdown blocks
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/dropdown.blade.php"></x-code>
-
-@include("examples/components/dropdown")
-
-<x-sub-title id="title">Title</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/dropdown-title.blade.php"></x-code>
-
-@include("examples/components/dropdown-title")
-
-<x-sub-title id="footer">Footer</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/dropdown-footer.blade.php"></x-code>
-
-@include("examples/components/dropdown-footer")
-
-<x-sub-title id="placement">Placement</x-sub-title>
-
-@include('pages.en.components.shared.placement')
-
-<x-code language="blade" file="resources/views/examples/components/dropdown-placement.blade.php"></x-code>
-
-@include("examples/components/dropdown-placement")
-
-<x-p>
-    <x-moonshine::alert type="default" icon="heroicons.book-open">
-        For additional location options, see the official documentation
-        <x-link link="https://atomiks.github.io/tippyjs/v6/all-props/#placement" target="_blank">tippy.js</x-link>
-    </x-moonshine::alert>
-</x-p>
-
-</x-page>
diff --git a/resources/views/pages/en/components/files.blade.php b/resources/views/pages/en/components/files.blade.php
deleted file mode 100644
index a7edbc9d..00000000
--- a/resources/views/pages/en/components/files.blade.php
+++ /dev/null
@@ -1,41 +0,0 @@
-<x-page title="Files" :sectionMenu="[
-    'Разделы' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#no-download', 'label' => 'No download'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    To display a list of files, you can use the <code>moonshine::files</code> component.
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/files.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box class="flex items-center flex-wrap gap-4">
-            @include("examples/components/files")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="no-download">No download</x-sub-title>
-
-<x-p>
-    To disable the ability to download files, the component must
-    pass the <code>download</code> parameter with the value FALSE.
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/files-no-download.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box class="flex items-center flex-wrap gap-4">
-            @include("examples/components/files-no-download")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/form.blade.php b/resources/views/pages/en/components/form.blade.php
deleted file mode 100644
index 1b3d2ae3..00000000
--- a/resources/views/pages/en/components/form.blade.php
+++ /dev/null
@@ -1,269 +0,0 @@
-<x-page title="Form elements" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#label', 'label' => 'Label'],
-        ['url' => '#input', 'label' => 'Input'],
-        ['url' => '#checkbox', 'label' => 'Checkbox'],
-        ['url' => '#radio', 'label' => 'Radio'],
-        ['url' => '#color', 'label' => 'Color'],
-        ['url' => '#button', 'label' => 'Button'],
-        ['url' => '#hint', 'label' => 'Hint'],
-        ['url' => '#file', 'label' => 'File'],
-        ['url' => '#range', 'label' => 'Range'],
-        ['url' => '#select', 'label' => 'Select'],
-        ['url' => '#switcher', 'label' => 'Switcher'],
-        ['url' => '#textarea', 'label' => 'Textarea'],
-    ]
-]">
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle" class="my-4">
-    Form components are a wrapper for similar html elements, they can be passed all the necessary attributes.
-</x-moonshine::alert>
-
-<x-sub-title id="label">Label</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/form/label.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/form/label")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-p>
-    If the field is required, then you can pass the <code>required</code> attribute to style the element
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/form/label-required.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/form/label-required")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="input">Input</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/form/input.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/form/input")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="checkbox">Checkbox</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/form/checkbox.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/form/checkbox")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="radio">Radio</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/form/radio.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/form/radio")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="color">Color select</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/form/color.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/form/color")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="button">Button</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/form/button.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/form/button")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="hint">Hint</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/form/hint.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/form/hint")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="file">File</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/form/file.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/form/file")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-p>
-    Using the component, you can display previously uploaded files.
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/form/file-files.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/form/file-files")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-p>
-    <x-moonshine::alert type="default" icon="heroicons.book-open">
-        Additionally, hidden fields will be created with the values passed in the <code>files[]</code> array.
-    </x-moonshine::alert>
-</x-p>
-
-<x-p>
-    You can pass additional parameters to the component:
-</x-p>
-<x-p>
-    <code>download</code> - download downloaded file <br>
-    <code>removable</code> - removal from the list of downloaded files <br>
-    <code>imageable</code> - display image previews
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/form/file-full.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/form/file-full")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="range">Range</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/form/range.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/form/range")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="select">Select</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/form/select.blade.php"></x-code>
-
-<x-p>
-    or via <code>slot:options</code>
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/form/select-slot.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/form/select")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-p>
-    You can combine values into groups.
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/form/select-groups.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/form/select-groups")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-p>
-    You can pass additional parameters to the component:
-</x-p>
-<x-p>
-    <code>searchable</code> - search by values <br>
-    <code>nullable</code> - can be NULL
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/form/select-full.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/form/select-full")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-p>
-    For asynchronous loading of values, you need to specify the url in the <code>asyncRoute</code> attribute,
-    which will return data in json format
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/form/select-async.blade.php"></x-code>
-
-<x-sub-title id="switcher">Switcher</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/form/switcher.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/form/switcher")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-p>
-    <code>onValue</code> - value when active<br>
-    <code>offValue</code> - value when inactive
-</x-p>
-
-<x-sub-title id="textarea">Textarea</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/form/textarea.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/form/textarea")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/grid.blade.php b/resources/views/pages/en/components/grid.blade.php
deleted file mode 100644
index 7ced2e4c..00000000
--- a/resources/views/pages/en/components/grid.blade.php
+++ /dev/null
@@ -1,27 +0,0 @@
-<x-page title="Grid" :sectionMenu="[]">
-
-<x-p>
-    You can use <code>moonshine::grid</code> to arrange elements on the page
-    and <code>moonshine::column</code> components.
-</x-p>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    The grid consists of 12 columns.
-</x-moonshine::alert>
-
-<x-code language="blade" file="resources/views/examples/components/grid.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/grid")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-p>
-    <code>adaptiveColSpan</code> - the number of columns that occupy the block when the screen size is up to 1280 pixels.<br>
-    <code>colSpan</code> - the number of columns that occupy a block with a screen size of 1280px.
-</x-p>
-
-</x-page>
diff --git a/resources/views/pages/en/components/icon.blade.php b/resources/views/pages/en/components/icon.blade.php
deleted file mode 100644
index aaa4b6ff..00000000
--- a/resources/views/pages/en/components/icon.blade.php
+++ /dev/null
@@ -1,77 +0,0 @@
-<x-page title="Icons" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#size', 'label' => 'Size'],
-        ['url' => '#color', 'label' => 'Color'],
-        ['url' => '#customization', 'label' => 'Customization'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    To insert icons into your custom elements,
-    you can use the <code>moonshine::icon</code> component
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/icon.blade.php"></x-code>
-
-<x-p>
-    @include("examples/components/icon")
-</x-p>
-
-<x-moonshine::alert type="default" icon="heroicons.book-open">
-    All available <x-link link="{{ route('moonshine.page', 'icons-index') }}">icons</x-link>
-</x-moonshine::alert>
-
-<x-sub-title id="size">Size</x-sub-title>
-
-<x-p>
-    Using the <code>size</code> parameter, you can set the size of the icon.
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/icon-size.blade.php"></x-code>
-
-<x-p>
-    @include("examples/components/icon-size")
-</x-p>
-
-<x-moonshine::alert type="default" icon="heroicons.book-open">
-    The value of the size parameter corresponds to the sizes in tailwindcss
-</x-moonshine::alert>
-
-<x-sub-title id="color">Color</x-sub-title>
-
-<x-p>
-    Using the <code>color</code> parameter, you can set the color of the icon
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/icon-color.blade.php"></x-code>
-
-<x-p class="flex">
-    @include("examples/components/icon-color")
-</x-p>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    Several colors are available by default, but you can expand them using your own
-    <x-link link="{{ route('moonshine.page', 'advanced-assets') }}">color classes</x-link> tailwindcss
-</x-moonshine::alert>
-
-<x-sub-title id="customization">Customization</x-sub-title>
-
-<x-p>
-    An arbitrary style for icons can be set via the <code>class</code> parameter
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/icon-class.blade.php"></x-code>
-
-<x-p>
-    @include("examples/components/icon-class")
-</x-p>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    Build MoonShine contains a limited list of tailwindcss classes,
-    use <x-link link="{{ route('moonshine.page', 'advanced-assets') }}">custom styles</x-link>
-</x-moonshine::alert>
-
-</x-page>
diff --git a/resources/views/pages/en/components/index.blade.php b/resources/views/pages/en/components/index.blade.php
deleted file mode 100644
index 26fa1212..00000000
--- a/resources/views/pages/en/components/index.blade.php
+++ /dev/null
@@ -1,15 +0,0 @@
-<x-page title="Components">
-
-<x-p>
-    A lot of UI components are used to create the MoonShine admin panel interface.
-</x-p>
-
-<x-p>
-    You can use these components to build your own templates, custom fields, filters, decorations or pages.
-</x-p>
-
-<x-p>
-    The use of components speeds up development and allows you to maintain a single style of the project.
-</x-p>
-
-</x-page>
diff --git a/resources/views/pages/en/components/link.blade.php b/resources/views/pages/en/components/link.blade.php
deleted file mode 100644
index 5817019a..00000000
--- a/resources/views/pages/en/components/link.blade.php
+++ /dev/null
@@ -1,58 +0,0 @@
-<x-page title="Link" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#filled', 'label' => 'Filled'],
-        ['url' => '#icon', 'label' => 'Icon'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    To create a stylized link, you can use the <code>moonshine::link-button</code>
-    or <code>moonshine::link-native</code> components
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/link.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box class="flex items-center flex-wrap gap-4">
-            @include("examples/components/link")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="filled">Filled</x-sub-title>
-
-<x-p>
-    The <code>filled</code> parameter is responsible for filling
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/link-filled.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box class="flex items-center flex-wrap gap-4">
-            @include("examples/components/link-filled")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="icon">Icon</x-sub-title>
-
-<x-p>
-    You can pass the parameter <code>icon</code>
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/link-icon.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box class="flex items-center flex-wrap gap-4">
-            @include("examples/components/link-icon")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/loader.blade.php b/resources/views/pages/en/components/loader.blade.php
deleted file mode 100644
index 26d856f8..00000000
--- a/resources/views/pages/en/components/loader.blade.php
+++ /dev/null
@@ -1,17 +0,0 @@
-<x-page title="Loader" :sectionMenu="[]">
-
-<x-p>
-    The <code>moonshine::loader</code> component allows you to create a stylized loading indicator
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/loader.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/loader")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/modal.blade.php b/resources/views/pages/en/components/modal.blade.php
deleted file mode 100644
index 948c19d2..00000000
--- a/resources/views/pages/en/components/modal.blade.php
+++ /dev/null
@@ -1,28 +0,0 @@
-<x-page title="Modal" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#wide', 'label' => 'Wide'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    The <code>moonshine::modal</code> component is used to create modal windows.
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/modal.blade.php"></x-code>
-
-@include("examples/components/modal")
-
-<x-sub-title id="wide">Wide</x-sub-title>
-
-<x-p>
-    The <code>wide</code> parameter allows modal windows to take up the entire width.
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/modal-wide.blade.php"></x-code>
-
-@include("examples/components/modal-wide")
-
-</x-page>
diff --git a/resources/views/pages/en/components/offcanvas.blade.php b/resources/views/pages/en/components/offcanvas.blade.php
deleted file mode 100644
index 044a0658..00000000
--- a/resources/views/pages/en/components/offcanvas.blade.php
+++ /dev/null
@@ -1,17 +0,0 @@
-<x-page title="Offcanvas" :sectionMenu="[]">
-
-<x-p>
-    The <code>moonshine::offcanvas</code> component allows you to create sidebars.
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/offcanvas.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/offcanvas")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/paginations.blade.php b/resources/views/pages/en/components/paginations.blade.php
deleted file mode 100644
index 566b6fd8..00000000
--- a/resources/views/pages/en/components/paginations.blade.php
+++ /dev/null
@@ -1,41 +0,0 @@
-<x-page title="Paginations" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#simple', 'label' => 'Simple pagination'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    The <code>moonshine::pagination</code> component allows you to create a stylized page-by-page pagination.<br>
-    To do this, add a component to the pagination blade view.
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/pagination.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/pagination-mock")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="simple">Simple pagination</x-sub-title>
-
-<x-p>
-    The <code>simple</code> parameter with the value <code>TRUE</code> allows you to display the pagination in a simplified way.
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/pagination-simple.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/pagination-mock", ['simple' => true])
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/popover.blade.php b/resources/views/pages/en/components/popover.blade.php
deleted file mode 100644
index 2877159f..00000000
--- a/resources/views/pages/en/components/popover.blade.php
+++ /dev/null
@@ -1,37 +0,0 @@
-<x-page title="Popover" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#without', 'label' => 'Without use component'],
-    ]
-]">
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    Using the <code>moonshine::popover</code> component, you can create a popup window
-</x-p>
-
-@include('pages.ru.components.shared.placement')
-
-<x-code language="blade" file="resources/views/examples/components/popover.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/popover")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="without">Without use component</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/popover-without.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/popover-without")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/progress_bar.blade.php b/resources/views/pages/en/components/progress_bar.blade.php
deleted file mode 100644
index cc1a4fc7..00000000
--- a/resources/views/pages/en/components/progress_bar.blade.php
+++ /dev/null
@@ -1,44 +0,0 @@
-<x-page title="Progress bar" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#radial', 'label' => 'Radial'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    The <code>moonshine::progress-bar</code> component allows you to create a progress bar
-</x-p>
-
-@include('pages.en.components.shared.colors')
-
-<x-code language="blade" file="resources/views/examples/components/progress_bar.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/progress_bar")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="radial">Radial</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/progress_bar-radial.blade.php"></x-code>
-
-<x-p>
-    To create a radial progress indicator, you need to pass the <code>radial</code> parameter to the component with the value <code>TRUE</code>
-</x-p>
-
-@include('pages.en.components.shared.sizes')
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/progress_bar-radial")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/rating.blade.php b/resources/views/pages/en/components/rating.blade.php
deleted file mode 100644
index b2af1e2c..00000000
--- a/resources/views/pages/en/components/rating.blade.php
+++ /dev/null
@@ -1,17 +0,0 @@
-<x-page title="Rating" :sectionMenu="[]">
-
-<x-p>
-    The <code>moonshine::rating</code> component allows you to create stylized ratings
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/rating.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/rating")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/shared/colors.blade.php b/resources/views/pages/en/components/shared/colors.blade.php
deleted file mode 100644
index 16ae6346..00000000
--- a/resources/views/pages/en/components/shared/colors.blade.php
+++ /dev/null
@@ -1,13 +0,0 @@
-<x-p>
-    Available colors:
-</x-p>
-
-<x-p>
-    <x-moonshine::badge color="purple">Purple</x-moonshine::badge>
-    <x-moonshine::badge color="pink">Pink</x-moonshine::badge>
-    <x-moonshine::badge color="blue">Blue</x-moonshine::badge>
-    <x-moonshine::badge color="green">Green</x-moonshine::badge>
-    <x-moonshine::badge color="yellow">Yellow</x-moonshine::badge>
-    <x-moonshine::badge color="red">Red</x-moonshine::badge>
-    <x-moonshine::badge color="gray">Gray</x-moonshine::badge>
-</x-p>
diff --git a/resources/views/pages/en/components/shared/placement.blade.php b/resources/views/pages/en/components/shared/placement.blade.php
deleted file mode 100644
index a2f91c4a..00000000
--- a/resources/views/pages/en/components/shared/placement.blade.php
+++ /dev/null
@@ -1,10 +0,0 @@
-<x-p>
-    Available placement:
-</x-p>
-
-<x-p>
-    <x-moonshine::badge color="gray">bottom</x-moonshine::badge>
-    <x-moonshine::badge color="gray">top</x-moonshine::badge>
-    <x-moonshine::badge color="gray">left</x-moonshine::badge>
-    <x-moonshine::badge color="gray">right</x-moonshine::badge>
-</x-p>
diff --git a/resources/views/pages/en/components/shared/sizes.blade.php b/resources/views/pages/en/components/shared/sizes.blade.php
deleted file mode 100644
index 38a524eb..00000000
--- a/resources/views/pages/en/components/shared/sizes.blade.php
+++ /dev/null
@@ -1,10 +0,0 @@
-<x-p>
-    Available sizes:
-</x-p>
-
-<x-p>
-    <x-moonshine::badge color="gray">sm</x-moonshine::badge>
-    <x-moonshine::badge color="gray">md</x-moonshine::badge>
-    <x-moonshine::badge color="gray">lg</x-moonshine::badge>
-    <x-moonshine::badge color="gray">xl</x-moonshine::badge>
-</x-p>
diff --git a/resources/views/pages/en/components/shared/type.blade.php b/resources/views/pages/en/components/shared/type.blade.php
deleted file mode 100644
index b23f124f..00000000
--- a/resources/views/pages/en/components/shared/type.blade.php
+++ /dev/null
@@ -1,10 +0,0 @@
-<x-p>
-    Available types:
-</x-p>
-
-<x-p>
-    <x-moonshine::badge color="green">success</x-moonshine::badge>
-    <x-moonshine::badge color="blue">info</x-moonshine::badge>
-    <x-moonshine::badge color="yellow">warning</x-moonshine::badge>
-    <x-moonshine::badge color="red">error</x-moonshine::badge>
-</x-p>
diff --git a/resources/views/pages/en/components/spinner.blade.php b/resources/views/pages/en/components/spinner.blade.php
deleted file mode 100644
index e4575072..00000000
--- a/resources/views/pages/en/components/spinner.blade.php
+++ /dev/null
@@ -1,67 +0,0 @@
-<x-page title="Spinner" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#size', 'label' => 'Size'],
-        ['url' => '#color', 'label' => 'Color'],
-        ['url' => '#position', 'label' => 'Position'],
-    ]
-]">
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    Using the <code>moonshine::spinner</code> component, you can create loading indicators
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/spinner.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/spinner")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="size">Size</x-sub-title>
-
-@include('pages.en.components.shared.sizes')
-
-<x-code language="blade" file="resources/views/examples/components/spinner-size.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box class="flex gap-2">
-            @include("examples/components/spinner-size")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="color">Color</x-sub-title>
-
-@include('pages.en.components.shared.colors')
-
-<x-code language="blade" file="resources/views/examples/components/spinner-color.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box class="flex gap-2">
-            @include("examples/components/spinner-color")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="position">Position</x-sub-title>
-
-<x-p>
-    The <code>absolute="true"</code> parameter sets the absolute position of the loading indicator
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/spinner-absolute.blade.php"></x-code>
-
-<x-p>
-    The <code>fixed="true"</code> parameter specifies a fixed positioning of the loading indicator
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/spinner-fixed.blade.php"></x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/components/table.blade.php b/resources/views/pages/en/components/table.blade.php
deleted file mode 100644
index 940f8fbb..00000000
--- a/resources/views/pages/en/components/table.blade.php
+++ /dev/null
@@ -1,103 +0,0 @@
-<x-page title="Table" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#crud', 'label' => 'Crud mode'],
-        ['url' => '#notfound', 'label' => 'Not found'],
-        ['url' => '#slots', 'label' => 'Slots'],
-        ['url' => '#styles', 'label' => 'Styles'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    Styled tables can be created using the <code>moonshine::table</code> component
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/table.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="8">
-        <x-moonshine::box>
-            @include("examples/components/table")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="crud">Crud mode</x-sub-title>
-
-<x-p>
-    The <code>crudMode</code> parameter allows you to additionally style tables
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/table-crud.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="8">
-        @include("examples/components/table-crud")
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="notfound">Not found</x-sub-title>
-
-<x-p>
-    The <code>notfound</code> parameter allows you to display a message if there are no table elements
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/table-notfound.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="8">
-        <x-moonshine::box>
-            @include("examples/components/table-notfound")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="slots">Slots</x-sub-title>
-
-<x-p>
-    The table can be formed using slots
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/table-slots.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="8">
-        <x-moonshine::box>
-            @include("examples/components/table-slots")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="styles">Styles</x-sub-title>
-
-<x-p>
-    To style the table, there are predefined classes that can be used for <code>tr</code> / <code>td</code>
-</x-p>
-
-<x-p>
-    Available classes:
-</x-p>
-
-<x-p class="flex flex-wrap gap-2">
-    <x-moonshine::badge color="purple">bgc-purple</x-moonshine::badge>
-    <x-moonshine::badge color="pink">bgc-pink</x-moonshine::badge>
-    <x-moonshine::badge color="blue">bgc-blue</x-moonshine::badge>
-    <x-moonshine::badge color="green">bgc-green</x-moonshine::badge>
-    <x-moonshine::badge color="yellow">bgc-yellow</x-moonshine::badge>
-    <x-moonshine::badge color="red">bgc-red</x-moonshine::badge>
-    <x-moonshine::badge color="gray">bgc-gray</x-moonshine::badge>
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/table-slots-color.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="8">
-        <x-moonshine::box>
-            @include("examples/components/table-slots-color")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/tabs.blade.php b/resources/views/pages/en/components/tabs.blade.php
deleted file mode 100644
index dbd63d88..00000000
--- a/resources/views/pages/en/components/tabs.blade.php
+++ /dev/null
@@ -1,40 +0,0 @@
-<x-page title="Tabs" :sectionMenu="[
-    'Разделы' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#active', 'label' => 'Active tab'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    To create tabs, you can use the <code>moonshine::tabs</code> component
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/tabs.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/tabs")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="active">Active tab</x-sub-title>
-
-<x-p>
-    You can specify the default active tab by setting the <code>activeTab</code>.
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/tabs-active.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/tabs-active")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/thumbnail.blade.php b/resources/views/pages/en/components/thumbnail.blade.php
deleted file mode 100644
index ae6a3443..00000000
--- a/resources/views/pages/en/components/thumbnail.blade.php
+++ /dev/null
@@ -1,46 +0,0 @@
-<x-page title="Thumbnails" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#multiple', 'label' => 'Group of images'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    To create thumbnails, you can use the <code>moonshine::thumbnails</code> component
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/thumbnails.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/thumbnails")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-p>
-    You can also specify the attribute <code>alt</code>
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/thumbnails-alt.blade.php"></x-code>
-
-<x-sub-title id="multiple">Group of images</x-sub-title>
-
-<x-p>
-    Component can be passed an array of images
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/thumbnails-multiple.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/thumbnails-multiple")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/title.blade.php b/resources/views/pages/en/components/title.blade.php
deleted file mode 100644
index 5300ded3..00000000
--- a/resources/views/pages/en/components/title.blade.php
+++ /dev/null
@@ -1,17 +0,0 @@
-<x-page title="Title" :sectionMenu="[]">
-
-<x-p>
-    If you want to place a stylized title, you can use the <code>moonshine::title</code> component
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/title.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/title")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/components/toast.blade.php b/resources/views/pages/en/components/toast.blade.php
deleted file mode 100644
index d7797dcb..00000000
--- a/resources/views/pages/en/components/toast.blade.php
+++ /dev/null
@@ -1,39 +0,0 @@
-<x-page title="Toast" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#without', 'label' => 'Without use component'],
-    ]
-]">
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    Using the <code>moonshine::toast</code> component, you can create notifications
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/toast.blade.php"></x-code>
-
-@include('pages.en.components.shared.type')
-
-<x-code language="blade" file="resources/views/examples/components/toast-type.blade.php"></x-code>
-
-<div class="flex gap-2">
-    @include("examples/components/toast-default")
-    @include("examples/components/toast-success")
-    @include("examples/components/toast-info")
-    @include("examples/components/toast-warning")
-    @include("examples/components/toast-error")
-</div>
-
-<x-sub-title id="without">Without use component</x-sub-title>
-
-<x-p>
-    You can create a notification using the <code>MoonShineUi::toast()</code> method
-</x-p>
-
-<x-code language="php">
-use MoonShine\MoonShineUI;
-
-MoonShineUi::toast('Toast content', 'error');
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/components/tooltip.blade.php b/resources/views/pages/en/components/tooltip.blade.php
deleted file mode 100644
index cbdf8312..00000000
--- a/resources/views/pages/en/components/tooltip.blade.php
+++ /dev/null
@@ -1,38 +0,0 @@
-<x-page title="Tooltip" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#without', 'label' => 'Without use component'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    Using the <code>moonshine::tooltip</code> component, you can create handy tooltips
-</x-p>
-
-@include('pages.ru.components.shared.placement')
-
-<x-code language="blade" file="resources/views/examples/components/tooltip.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/tooltip")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="without">Without use component</x-sub-title>
-
-<x-code language="blade" file="resources/views/examples/components/tooltip-without.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="4">
-        <x-moonshine::box>
-            @include("examples/components/tooltip-without")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-</x-page>
diff --git a/resources/views/pages/en/concept.blade.php b/resources/views/pages/en/concept.blade.php
deleted file mode 100644
index 444c0419..00000000
--- a/resources/views/pages/en/concept.blade.php
+++ /dev/null
@@ -1,31 +0,0 @@
-<x-page title="The concept" :sectionMenu="null">
-    <x-p>
-        The idea of the Moonshine project is to create a versatile and customizable admin panel for Laravel projects.
-        Almost all serious projects require an admin panel, and it takes a lot of time to create it.
-        So I've got an idea to make my own admin panel, but it's a huge job
-        and in a few years I managed to create a working version for the most common tasks. However, there are some serious drawbacks.
-    </x-p>
-
-    <x-p>
-        Recently I saw the initiative in my CutCode community for Laravel to create their own open-source project,
-        and I’ve decided this was the proper approach to make a good admin panel together
-        by joining resources for a common target.
-    </x-p>
-
-    <x-p>
-        Everyone will benefit from the interaction - you will be able to use a quality product that will always evolve.
-    </x-p>
-
-    <x-p>
-        An active and vibrant community is the heart of the project. Therefore, the most active users will be encouraged.
-        What kind of incentive? The very first idea about the incentive is to create a system of donations.
-        Donated money is distributed among the main participants of the developer team.
-        Project MoonShine participates in the "Free License Programs" support program provided by JetBrains -
-        active developers receive a license for products from JetBrains.
-    </x-p>
-
-    <x-p>
-        My goal is to make the project a place where developers will want to come back.
-        We can make a functional and comfortable machine together only! Together we will do more than one at a time!
-    </x-p>
-</x-page>
diff --git a/resources/views/pages/en/configuration.blade.php b/resources/views/pages/en/configuration.blade.php
deleted file mode 100644
index ec0a18e1..00000000
--- a/resources/views/pages/en/configuration.blade.php
+++ /dev/null
@@ -1,102 +0,0 @@
-<x-page title="Configuration" :sectionMenu="[]">
-
-<x-code language="php">
-use MoonShine\Exceptions\MoonShineNotFoundException;
-use MoonShine\Models\MoonshineUser;
-
-return [
-    # The directory where the resources are located
-    'dir' => 'app/MoonShine',
-    # If you change the directory, you must also change the namespace according to psr-4
-    'namespace' => 'App\MoonShine',
-
-    # Admin panel header
-    'title' => env('MOONSHINE_TITLE', 'MoonShine'),
-    # You can change the logo by specifying the path (example - /images/logo.svg)
-    'logo' => env('MOONSHINE_LOGO', '/images/logo.svg'),
-    'logo_small' => env('MOONSHINE_LOGO_SMALL', '/images/logo-icon.svg'),
-
-    'route' => [
-        # Which url will be available for the control panel (as a rule admin)
-        # If the value is left empty, the panel will be accessible from /
-        'prefix' => env('MOONSHINE_ROUTE_PREFIX', 'moonshine'),
-        # Starting route in admin panel
-        'index_route' => env('MOONSHINE_INDEX_ROUTE', 'moonshine.index'),
-        # Groups of middlewares in the panel
-        'middleware' => ['moonshine'],
-        # Slug of the url formation for custom pages
-        'custom_page_slug' => 'custom_page',
-        # You can change 404 error exception (for ModelNotFound you need to implement it yourself)
-        'notFoundHandler' => MoonShineNotFoundException::class
-    ],
-
-    # If you want to replace MoonshineUser with your own model, you can disable default migrations
-    'use_migrations' => true,
-    # On/Off notifications
-    'use_notifications' => true,
-
-    'auth' => [
-        # On/Off authentication. If false, the panel will be available to all
-        'enable' => true,
-        # If you use your own guard, provider
-        'guard' => 'moonshine',
-        'guards' => [
-            'moonshine' => [
-                'driver' => 'session',
-                'provider' => 'moonshine',
-            ],
-        ],
-        'providers' => [
-            'moonshine' => [
-                'driver' => 'eloquent',
-                'model' => MoonshineUser::class,
-            ],
-        ],
-        # Text under the sign in button. As an example, you can add a sign-in button
-        'footer' => ''
-    ],
-    # Possible translations
-    'locales' => [
-        'en', 'ru'
-    ],
-    # Additional middlewares
-    'middlewares' => [],
-    'tinymce' => [
-        # File manager root, see the Fields section for details
-        'file_manager' => false, // or 'laravel-filemanager' prefix for lfm
-        'token' => env('MOONSHINE_TINYMCE_TOKEN', ''),
-        'version' => env('MOONSHINE_TINYMCE_VERSION', '6')
-    ],
-    # Authenticate via social networks and socialite, list the drivers and specify the logo
-    'socialite' => [
-        // 'driver' => 'path_to_image_for_button'
-    ],
-    # Template customization
-    'header' => null, // blade path
-    'footer' => [
-        'copyright' => 'Made with ❤️ by <a href="https://cutcode.dev" class="font-semibold text-purple hover:text-pink" target="_blank">CutCode</a>',
-        'nav' => [
-            'https://github.com/moonshine/moonshine/blob/1.x/LICENSE.md' => 'License',
-            'https://moonshine.cutcode.dev' => 'Documentation',
-            'https://github.com/moonshine/moonshine' => 'GitHub',
-        ],
-    ]
-];
-</x-code>
-
-<x-p>
-    For basic use it is enough to edit the parameters below
-</x-p>
-
-<x-code language="php">
-return [
-    // ..
-    'title' => env('MOONSHINE_TITLE', 'MoonShine'), // [tl! focus]
-    'logo' => env('MOONSHINE_LOGO', ''), // [tl! focus]
-
-    'route' => [
-        'prefix' => env('MOONSHINE_ROUTE_PREFIX', 'moonshine'), // [tl! focus]
-    ],
-    // ..
-</x-code>
-</x-page>
diff --git a/resources/views/pages/en/contribution.blade.php b/resources/views/pages/en/contribution.blade.php
deleted file mode 100644
index 8fb42a67..00000000
--- a/resources/views/pages/en/contribution.blade.php
+++ /dev/null
@@ -1,162 +0,0 @@
-<x-page title="Contribution Guide" :sectionMenu="[
-     'Sections' => [
-         ['url' => '#dev-guide', 'label' => 'Developers guide'],
-         ['url' => '#pr', 'label' => 'How to make a pull request'],
-     ]
-]">
-
-<x-sub-title>What can you do to help?</x-sub-title>
-
-<x-p>
-    Our community needs active users. You can help in many ways
-</x-p>
-
-<x-ul :items="[
-'Add new code',
-'Front-end development',
-'Submit bug reports',
-'Help other users understand the details',
-'Writing documentation',
-'Engage new participants'
-]"></x-ul>
-
-<x-sub-title>We are using a technology stack</x-sub-title>
-
-<x-ul :items="[
-'Blade',
-'Tailwindcss',
-'AlpineJs',
-]"></x-ul>
-
-<x-sub-title>Where do we start?</x-sub-title>
-
-<x-p>
-    The product is working already, fully functional and testable.
-    But working doesn't mean great, so the goal is to make the project better.
-</x-p>
-
-<x-sub-title>Pull requests</x-sub-title>
-
-<x-p>
-    You can suggest new features or improvements to MoonShine! Bugs and errors - all this could be documented and sent for improvement.
-    I'm also glad to meet new open source project development specialists
-</x-p>
-
-<x-sub-title>Where shall we discuss development?</x-sub-title>
-
-<x-p>
-    For active participants in the project created a separate chat in telegram. If you are ready to participate in the development,
-    then join - <x-link link="https://t.me/laravel_chat/24568">MoonShine</x-link>.
-</x-p>
-
-
-<x-sub-title>If you found a mistake</x-sub-title>
-
-<x-p>
-    1. You have enough experience to offer a solution.
-    I would be very happy to receive your PR with a description of the error and a way to fix it.
-    <br>
-    2. If you don't know how to solve the problem, create GitHub issues, and we will fix the problem soon.
-
-    <div class="text-sm my-4">* It is important that your pr passed all the tests of the platform and had a detailed description,
-        so that all participants of the development process understand what exactly happened.</div>
-</x-p>
-
-<x-sub-title>Main branch</x-sub-title>
-
-<x-p>
-    At the moment, the main branch is <code>1.5.x</code>
-</x-p>
-
-<x-sub-title>Coding style</x-sub-title>
-
-<x-p>
-    MoonShine adheres to the PSR-12 standard and PSR-4 autoload standard.
-</x-p>
-
-<x-sub-title id="dev-guide">Developer's guide</x-sub-title>
-
-<x-moonshine::badge color="green">1</x-moonshine::badge> Make project dir and clone demo project
-
-<x-code language="shell">
-    git clone git@github.com:moonshine-software/demo-project.git .
-</x-code>
-
-<x-moonshine::badge color="green">2</x-moonshine::badge> Add packages directory and execute the command below
-
-<x-code language="shell">
-    cd packages && git clone git@github.com:moonshine-software/moonshine.git && cd moonshine && composer install && npm install
-</x-code>
-
-<x-moonshine::badge color="green">3</x-moonshine::badge> Go back to the project directory and remove moonshine/moonshine dependency from the composer.json
-
-<x-code language="shell">
-    "moonshine/moonshine": "^1.50",
-</x-code>
-
-<x-moonshine::badge color="green">3</x-moonshine::badge> Add MoonShine from the packages directory to autoload section in the composer.json
-
-<x-code language="shell">
-"autoload": {
-    "psr-4": {
-        "App\\": "app/",
-        "Database\\Factories\\": "database/factories/",
-        "Database\\Seeders\\": "database/seeders/",
-        "MoonShine\\": "packages/moonshine/src"
-    }
-},
-</x-code>
-
-<x-moonshine::badge color="green">4</x-moonshine::badge> Add MoonShineServiceProvider to config/app.php
-
-<x-code language="php">
-use App\Providers\MoonShineServiceProvider;
-// Import vendor provider
-use MoonShine\Providers\MoonShineServiceProvider as MSProvider;
-
-// ..
-
-/*
-* Package Service Providers...
-*/
-// Add vendor provider
-MSProvider::class,
-
-// ..
-</x-code>
-
-<x-moonshine::badge color="green">5</x-moonshine::badge> Create .env from .env.example (don't forget to create a database) and complete the install below
-
-<x-code language="shell">
-composer require lee-to/laravel-package-command && composer require rap2hpoutre/fast-excel && composer install && npm install
-</x-code>
-
-<x-code language="shell">
-php artisan key:generate
-php artisan storage:link
-php artisan migrate --seed
-php artisan moonshine:user
-php artisan serve
-</x-code>
-
-<x-moonshine::badge color="green">#</x-moonshine::badge> Make something great
-
-<x-sub-title id="pr">How to make a pull request?</x-sub-title>
-<x-ul :items="[
-'Go to the MoonShine repository and press Fork',
-'Make a git clone of your fork',
-'Create a new branch for your changes',
-'Make commits following the convention. Use https://www.conventionalcommits.org',
-'Push your changes to your fork',
-'Go to the MoonShine repository again and press New pull request',
-'Describe the changes you made and explain why they are valuable',
-'Wait for review',
-]"></x-ul>
-
-<x-sub-title>Any questions?</x-sub-title>
-
-<x-p>
-    My name is Danil! Email me at <x-link link="mailto:thecutcode@gmail.com">thecutcode@gmail.com</x-link>
-</x-p>
-
-</x-page>
diff --git a/resources/views/pages/en/decorations/block.blade.php b/resources/views/pages/en/decorations/block.blade.php
deleted file mode 100644
index c55ea5a8..00000000
--- a/resources/views/pages/en/decorations/block.blade.php
+++ /dev/null
@@ -1,47 +0,0 @@
-<x-page title="Block">
-
-<x-p>
-    Substrate with header for form features
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Block; // [tl! focus]
-
-//...
-public function fields(): array
-{
-    return [
-        Block::make('Block title', [ // [tl! focus]
-            Text::make('Name', 'first_name'),
-        ]), // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/block.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/block_dark.png') }}"></x-image>
-
-<x-p>
-    If you don't need a header
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Block; // [tl! focus]
-
-//...
-public function fields(): array
-{
-    return [
-        Block::make([ // [tl! focus]
-            Text::make('Name', 'first_name'),
-        ]), // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/block_without_title.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/block_without_title_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/decorations/button.blade.php b/resources/views/pages/en/decorations/button.blade.php
deleted file mode 100644
index 7be16367..00000000
--- a/resources/views/pages/en/decorations/button.blade.php
+++ /dev/null
@@ -1,27 +0,0 @@
-<x-page title="Button">
-
-<x-p>
-    To add a button with a link to a form
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Button;
-
-//...
-public function fields(): array
-{
-    return [
-        Button::make(
-            'Link to article',
-            $this->getItem() ? route('articles.show', $this->getItem()) : '/',
-            true
-        )->icon('clip'),
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/button.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/button_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/decorations/collapse.blade.php b/resources/views/pages/en/decorations/collapse.blade.php
deleted file mode 100644
index eb3bb6a3..00000000
--- a/resources/views/pages/en/decorations/collapse.blade.php
+++ /dev/null
@@ -1,33 +0,0 @@
-<x-page title="Collapse">
-
-<x-p>
-    The Collapse decorator allows you to minimize <code>fields</code> and <code>blocks</code> while keeping their state
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Collapse;  // [tl! focus]
-use MoonShine\Decorations\Block;
-
-//...
-public function fields(): array
-{
-    return [
-        Block::make([
-            Collapse::make('Title/Slug', [  // [tl! focus]
-                Text::make('Title')
-                    ->fieldContainer(false),
-
-                Text::make('Slug')
-                    ->fieldContainer(false),
-            ])  // [tl! focus]
-            ->show() // Display expanded (optional) [tl! focus]
-        ]);
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/collapse.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/collapse_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/decorations/divider.blade.php b/resources/views/pages/en/decorations/divider.blade.php
deleted file mode 100644
index 3c591871..00000000
--- a/resources/views/pages/en/decorations/divider.blade.php
+++ /dev/null
@@ -1,82 +0,0 @@
-<x-page
-    title="Divider"
-    :sectionMenu="[
-        'Sections' => [
-            ['url' => '#basics', 'label' => 'Basics'],
-            ['url' => '#label', 'label' => 'Label'],
-        ]
-    ]"
->
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    To divide into areas, you can use the <code>Divider</code> decorator
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Divider;
-
-//...
-public function fields(): array
-{
-    return [
-        //...
-        Divider::make(), // [tl! focus]
-        //...
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/divider.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/divider_dark.png') }}"></x-image>
-
-<x-sub-title id="label">Label</x-sub-title>
-
-<x-p>
-    You can use text as a separator, for this you need to pass it to the <code>make()</code> method
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Divider;
-
-//...
-public function fields(): array
-{
-    return [
-        //...
-        Divider::make('Divider'), // [tl! focus]
-        //...
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/divider_label.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/divider_label_dark.png') }}"></x-image>
-
-<x-p>
-    The <code>centered()</code> method allows you to center the text
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Divider;
-
-//...
-public function fields(): array
-{
-    return [
-        //...
-        Divider::make('Divider')
-            ->centered(), // [tl! focus]
-        //...
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/divider_label_center.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/divider_label_center_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/decorations/heading.blade.php b/resources/views/pages/en/decorations/heading.blade.php
deleted file mode 100644
index 8e7734c3..00000000
--- a/resources/views/pages/en/decorations/heading.blade.php
+++ /dev/null
@@ -1,28 +0,0 @@
-<x-page title="Title">
-
-<x-p>
-    You can add headers to separate areas of the form
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Heading;
-
-//...
-public function fields(): array
-{
-    return [
-        Heading::make('Title/Slug'),
-
-        Text::make('Title')
-            ->fieldContainer(false),
-        Text::make('Slug')
-            ->fieldContainer(false),
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/heading.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/heading_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/decorations/index.blade.php b/resources/views/pages/en/decorations/index.blade.php
deleted file mode 100644
index d1fb9a5e..00000000
--- a/resources/views/pages/en/decorations/index.blade.php
+++ /dev/null
@@ -1,10 +0,0 @@
-<x-page title="Basics">
-<x-p>
-    Decorations are set in the <code>fields</code> or <code>filters</code> resource methods.
-</x-p>
-
-<x-p>
-    Improve the appearance of the fields and the quality of the interface
-</x-p>
-
-</x-page>
diff --git a/resources/views/pages/en/decorations/layout.blade.php b/resources/views/pages/en/decorations/layout.blade.php
deleted file mode 100644
index f647d6cd..00000000
--- a/resources/views/pages/en/decorations/layout.blade.php
+++ /dev/null
@@ -1,94 +0,0 @@
-<x-page title="Layout" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#flex', 'label' => 'Flex'],
-        ['url' => '#grid-column', 'label' => 'Grid/Column'],
-    ]
-]">
-<x-p>
-    Sometimes it is necessary to divide the form into several blocks for convenience, by default they go under each other, but with the help of scenery <code>Layout</code> you can easily change the display
-</x-p>
-
-<x-sub-title id="flex">Flex</x-sub-title>
-
-<x-p>
-    Changing the positioning of the fields in the line
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Flex;
-
-    //...
-    public function fields(): array
-{
-    return [
-        Flex::make([
-            Text::make('Title'),
-            Text::make('Slug'),
-        ])
-            // Additional options
-            ->withoutSpace() // Eliminate indentation
-            ->justifyAlign('start') // Based on tailwind classes justify-[param]
-            ->itemsAlign('start') // Based on tailwind classes items-[param]
-    ];
-}
-//...
-</x-code>
-
-<x-moonshine::table
-    :columns="['param', 'justifyAlign()', 'itemsAlign()']"
-    :values="[
-        ['normal', 'justify-content: normal;', null],
-        ['start', 'justify-content: flex-start;', 'align-items: flex-start;'],
-        ['end', 'justify-content: flex-end;', 'align-items: flex-end;'],
-        ['center', 'justify-content: center;', 'align-items: center;'],
-        ['between', 'justify-content: space-between;', null],
-        ['around', 'justify-content: space-around;', null],
-        ['evenly', 'justify-content: space-evenly;', null],
-        ['baseline', null, 'align-items: baseline;'],
-        ['stretch', 'justify-content: stretch;', 'align-items: stretch;'],
-    ]"
-/>
-
-<x-image theme="light" src="{{ asset('screenshots/flex.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/flex_dark.png') }}"></x-image>
-
-<x-sub-title id="grid-column">Grid/Column</x-sub-title>
-
-<x-p>
-    Grid with speakers
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Grid;
-use MoonShine\Decorations\Column;
-
-//...
-public function fields(): array
-{
-    return [
-        Grid::make([
-            Column::make([
-                Block::make('Main information', [
-                    // Fields here
-                ])
-            ])->columnSpan(6), // 6 out of 12 is half of the screen
-
-            Column::make([
-                Block::make('Contact information', [
-                    // Fields here
-                ])
-            ])->columnSpan(6), // 6 out of 12 is half of the screen
-        ])
-    ];
-}
-//...
-</x-code>
-
-<x-p>
-    The result is two columns with blocks
-</x-p>
-
-<x-image theme="light" src="{{ asset('screenshots/grid.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/grid_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/decorations/tabs.blade.php b/resources/views/pages/en/decorations/tabs.blade.php
deleted file mode 100644
index 27f9f80b..00000000
--- a/resources/views/pages/en/decorations/tabs.blade.php
+++ /dev/null
@@ -1,36 +0,0 @@
-<x-page title="Tabs">
-<x-p>
-    You can add tabs and group fields in the form for convenience
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Block;
-use MoonShine\Decorations\Tabs;
-use MoonShine\Decorations\Tab;
-use MoonShine\Fields\Text;
-
-//...
-public function fields(): array
-{
-    return [
-        Block::make('Main', [
-            Tabs::make([
-                Tab::make('Seo', [
-                    Text::make('Seo title')
-                        ->fieldContainer(false),
-                    //...
-                ]),
-                Tab::make('Categories', [
-                    //...
-                ])
-            ])
-        ]),
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/tabs.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/tabs_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/belongs_to.blade.php b/resources/views/pages/en/fields/belongs_to.blade.php
deleted file mode 100644
index 7b2c10c7..00000000
--- a/resources/views/pages/en/fields/belongs_to.blade.php
+++ /dev/null
@@ -1,140 +0,0 @@
-<x-page title="BelongsTo" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#searchable', 'label' => 'Searching values'],
-		['url' => '#async-search', 'label' => 'Async search'],
-        ['url' => '#values-query', 'label' => 'Values query'],
-        ['url' => '#nullable', 'label' => 'Empty value'],
-    ]
-]">
-
-<x-extendby :href="route('moonshine.page', 'fields-select')">
-    Select
-</x-extendby>
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>Field for relationships in Laravel, <code>BelongsTo</code> type. Displayed as select.</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\BelongsTo; // [tl! focus]
-
-//...
-public function fields(): array
-{
-    return [
-        // indicating the relationship
-        BelongsTo::make('Country', 'country', 'name') // [tl! focus]
-        // or you can field
-        BelongsTo::make('Country', 'country_id', 'name') // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-p>The third argument with the "name" value is a field in the linked "countries" table to display the values.</x-p>
-
-<x-image theme="light" src="{{ asset('screenshots/belongs_to.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/belongs_to_dark.png') }}"></x-image>
-
-<x-p>You can also pass a resource with a field to display as a third parameter</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\BelongsTo;
-use App\MoonShine\Resources\CountryResource;  // [tl! focus]
-
-//...
-public function fields(): array
-{
-    return [
-        BelongsTo::make('Country', 'country', new CountryResource()) // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-code language="php">
-namespace App\MoonShine\Resources;
-
-use MoonShine\Resources\Resource;
-use App\Models\Country;
-
-class CountryResource extends Resource
-{
-    //...
-
-    public string $titleField = 'name'; // [tl! focus]
-
-    //...
-}
-</x-code>
-
-<x-p>If you need a more complex value to display, you can pass a function to the third argument</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\BelongsTo;
-
-//...
-public function fields(): array
-{
-    return [
-        BelongsTo::make(
-            'Country',
-            'country',
-            fn($item) => "$item->id.) $item->name" // [tl! focus]
-        )
-    ];
-}
-//...
-</x-code>
-
-<x-sub-title id="searchable">Searching values</x-sub-title>
-
-<x-p>
-    If you need to search among values, then you need to add the <code>searchable()</code> method.
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\BelongsTo;
-use App\MoonShine\Resources\CountryResource;
-
-//...
-public function fields(): array
-{
-    return [
-        BelongsTo::make('Country', 'country', new CountryResource())
-            ->searchable() // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-@include('pages.en.fields.shared.async_search', ['field' => 'BelongsTo'])
-
-@include('pages.en.fields.shared.values_query', ['field' => 'BelongsTo'])
-
-<x-sub-title id="nullable">Empty value</x-sub-title>
-
-<x-p>
-    If you need the default value <code>Null</code>
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\BelongsTo;
-
-//...
-public function fields(): array
-{
-    return [
-        BelongsTo::make('Country', 'country')
-            ->nullable() // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    Don't forget to specify in the database table that the field can be <code>Null</code>.
-</x-moonshine::alert>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/belongs_to_many.blade.php b/resources/views/pages/en/fields/belongs_to_many.blade.php
deleted file mode 100644
index 6f88956e..00000000
--- a/resources/views/pages/en/fields/belongs_to_many.blade.php
+++ /dev/null
@@ -1,167 +0,0 @@
-<x-page title="BelongsToMany" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#pivot', 'label' => 'Pivot'],
-		['url' => '#async-search', 'label' => 'Async search'],
-        ['url' => '#select', 'label' => 'Select'],
-        ['url' => '#values-query', 'label' => 'Values query'],
-        ['url' => '#tree', 'label' => 'Tree'],
-        ['url' => '#onlycount', 'label' => 'onlyCount'],
-        ['url' => '#inline', 'label' => 'inLine'],
-    ]
-]">
-
-<x-extendby :href="route('moonshine.page', 'fields-select')">
-    Select
-</x-extendby>
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>Field for relationships in Laravel, <code>BelongsToMany</code> type.</x-p>
-
-<x-p>Displayed as a group of checkboxes, you can also transform into select multiple.</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\BelongsToMany; // [tl! focus]
-
-//...
-public function fields(): array
-{
-    return [
-        BelongsToMany::make('Categories', 'categories', 'name') // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/belongs_to_many.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/belongs_to_many_dark.png') }}"></x-image>
-
-<x-sub-title id="pivot">Pivot</x-sub-title>
-
-<x-p>To implement pivot fields, use the <code>fields()</code> method.</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\BelongsToMany;
-
-//...
-public function fields(): array
-{
-    return [
-        BelongsToMany::make('Contacts', 'contacts', 'name')
-            ->fields([
-                Text::make('Contact', 'text'),
-            ]) // [tl! focus:-2]
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/belongs_to_many_pivot.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/belongs_to_many_pivot_dark.png') }}"></x-image>
-
-@include('pages.en.fields.shared.async_search', ['field' => 'BelongsToMany'])
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    Requests must be customized via the <code>asyncSearch()</code> method,
-     don't use <code>valuesQuery()</code>!
-</x-moonshine::alert>
-
-
-
-<x-sub-title id="select">Select</x-sub-title>
-
-<x-p>To transform the display into select, use the <code>select()</code> method.</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\BelongsToMany;
-
-//...
-public function fields(): array
-{
-    return [
-        BelongsToMany::make('Categories', 'categories', 'name')
-            ->select() // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/belongs_to_many_select.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/belongs_to_many_select_dark.png') }}"></x-image>
-
-@include('pages.en.fields.shared.values_query', ['field' => 'BelongsToMany'])
-
-<x-sub-title id="tree">Tree</x-sub-title>
-
-<x-p>
-    Sometimes it makes sense to display checkboxes with a hierarchy, example for categories that have nesting,
-    there is a <code>tree()</code> method for this.</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\BelongsToMany;
-
-//...
-public function fields(): array
-{
-    return [
-        BelongsToMany::make('Categories', 'categories', 'name')
-            ->tree('parent_id') // Contact field // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-sub-title id="onlycount">onlyCount</x-sub-title>
-
-<x-p>
-    If you want to display only the number of selected values on the index page,
-    then you should use the <code>onlyCount()</code> method.
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\BelongsToMany;
-
-//...
-public function fields(): array
-{
-    return [
-        BelongsToMany::make('Categories', 'categories', 'name')
-            ->onlyCount() // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-sub-title id="inline">inLine</x-sub-title>
-
-<x-p>
-    By default, the index page will display the field as a table,
-    but if you want to display it in a line, you can use the <code>inLine()</code> method.
-</x-p>
-<x-p>
-    Optional parameters can be passed to the method:
-    <ul>
-        <li><code>separator</code> - separator between elements</li>
-        <li><code>badge</code> - display elements as badge</li>
-    </ul>
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\BelongsToMany;
-
-//...
-public function fields(): array
-{
-    return [
-        BelongsToMany::make('Categories', 'categories', 'name')
-            ->inLine(separator: ' ', badge: true) // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/belongs_to_many_index_in_line.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/belongs_to_many_index_in_line_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/checkbox.blade.php b/resources/views/pages/en/fields/checkbox.blade.php
deleted file mode 100644
index 60234387..00000000
--- a/resources/views/pages/en/fields/checkbox.blade.php
+++ /dev/null
@@ -1,25 +0,0 @@
-<x-page title="Checkbox">
-
-<x-p>
-    The Checkbox field includes all the basic methods
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Checkbox;
-
-//...
-
-public function fields(): array
-{
-    return [
-        Checkbox::make('Label', 'table_field')
-    ];
-}
-
-//...
-</x-code>
-
-</x-page>
-
-
-
diff --git a/resources/views/pages/en/fields/code.blade.php b/resources/views/pages/en/fields/code.blade.php
deleted file mode 100644
index ee01b9e8..00000000
--- a/resources/views/pages/en/fields/code.blade.php
+++ /dev/null
@@ -1,31 +0,0 @@
-<x-page title="Code">
-
-<x-extendby :href="route('moonshine.page', 'fields-textarea')">
-    Textarea
-</x-extendby>
-
-<x-p>Code Editor</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Code;
-
-//...
-public function fields(): array
-{
-    return [
-        Code::make('Code', 'code')
-            ->language('js')
-            ->lineNumbers()
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/code.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/code_dark.png') }}"></x-image>
-
-</x-page>
-
-
-
diff --git a/resources/views/pages/en/fields/color.blade.php b/resources/views/pages/en/fields/color.blade.php
deleted file mode 100644
index 2b3873ac..00000000
--- a/resources/views/pages/en/fields/color.blade.php
+++ /dev/null
@@ -1,31 +0,0 @@
-<x-page title="Colour">
-
-<x-extendby :href="route('moonshine.page', 'fields-text')">
-    Text
-</x-extendby>
-
-<x-p>
-    Everything is the same as "Text field", the only difference is input type = color
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Color;
-
-//...
-public function fields(): array
-{
-    return [
-        Color::make('Color')
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/color.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/color_dark.png') }}"></x-image>
-
-</x-page>
-
-
-
diff --git a/resources/views/pages/en/fields/date.blade.php b/resources/views/pages/en/fields/date.blade.php
deleted file mode 100644
index 1e7e4e90..00000000
--- a/resources/views/pages/en/fields/date.blade.php
+++ /dev/null
@@ -1,51 +0,0 @@
-<x-page title="Date">
-
-<x-extendby :href="route('moonshine.page', 'fields-text')">
-    Text
-</x-extendby>
-
-<x-p>
-    Input has date type and additional method - <code>format</code>
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Date;
-
-//...
-public function fields(): array
-{
-    return [
-        Date::make('Creation date', 'created_at')
-            ->format('d.m.Y') // Date display format on the main resource
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/date.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/date_dark.png') }}"></x-image>
-
-<x-p>
-    Use the <code>withTime</code> method to display not only the date but also the time in the field
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Date;
-
-//...
-public function fields(): array
-{
-    return [
-        Date::make('Date and time of creation', 'created_at')
-            ->withTime()
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/date_time.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/date_time_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/email.blade.php b/resources/views/pages/en/fields/email.blade.php
deleted file mode 100644
index 65d71219..00000000
--- a/resources/views/pages/en/fields/email.blade.php
+++ /dev/null
@@ -1,17 +0,0 @@
-<x-page title="E-mail">
-
-<x-extendby :href="route('moonshine.page', 'fields-text')">
-    Text
-</x-extendby>
-
-<x-p>
-    Everything is the same as "Text field", the only difference is input type = email
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Email;
-
-Email::make('E-mail', 'email')
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/enum.blade.php b/resources/views/pages/en/fields/enum.blade.php
deleted file mode 100644
index c06586fe..00000000
--- a/resources/views/pages/en/fields/enum.blade.php
+++ /dev/null
@@ -1,30 +0,0 @@
-<x-page title="Enum field">
-
-<x-extendby :href="route('moonshine.page', 'fields-select')">
-    Select
-</x-extendby>
-
-<x-p>
-    Works the same as the Select field but accepts Enum
-</x-p>
-
-<x-p>
-    Model attribute requires EnumCast
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Enum;
-
-//...
-
-public function fields(): array
-{
-    return [
-        Enum::make('Status', 'status_id')->attach(EnumStatus::class)
-    ];
-}
-
-//...
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/file.blade.php b/resources/views/pages/en/fields/file.blade.php
deleted file mode 100644
index 418e8b33..00000000
--- a/resources/views/pages/en/fields/file.blade.php
+++ /dev/null
@@ -1,217 +0,0 @@
-<x-page
-    title="File"
-    :sectionMenu="[
-        'Sections' => [
-            ['url' => '#multiple', 'label' => 'Multiple'],
-            ['url' => '#removable', 'label' => 'Removing files'],
-            ['url' => '#download', 'label' => 'Disabling download'],
-            ['url' => '#filename', 'label' => 'Original filename'],
-            ['url' => '#customname', 'label' => 'Custom filename']
-        ]
-    ]"
->
-
-<x-p>
-    Before using the file field,
-    make sure that a symbolic link is set to the storage directory
-</x-p>
-
-<x-code language="shell">
-    php artisan storage:link
-</x-code>
-
-<x-code language="php">
-use MoonShine\Fields\File;
-
-//...
-public function fields(): array
-{
-    return [
-        //...
-        // [tl! focus:start]
-        File::make('File', 'file')
-            ->dir('/') // The directory where the files will be stored in storage (by default /)
-            ->disk('public') // Filesystems disk
-            ->allowedExtensions(['jpg', 'gif', 'png']) // Allowable extensions
-        // [tl! focus:end]
-        //...
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/file.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/file_dark.png') }}"></x-image>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    To correctly generate the file URL, you must define the environment variable <code>APP_URL</code> in this way,
-    to match your app's URL.
-</x-moonshine::alert>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    When using the <code>local</code> driver, the return value of <code>url</code> is not URL encoded.
-    For this reason, we recommend always storing your files using names that will create valid URLs.
-</x-moonshine::alert>
-
-<x-sub-title id="multiple">Multiple</x-sub-title>
-
-<x-p>
-    The <code>multiple()</code> method is used to upload multiple files
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\File;
-
-//...
-public function fields(): array
-{
-    return [
-        //...
-        File::make('File', 'file')
-            ->multiple(), // [tl! focus]
-        //...
-    ];
-}
-//...
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    The field in the database must be of text or json type.<br>
-    You also need to add cast for eloquent model - json or array or collection.
-</x-moonshine::alert>
-
-<x-sub-title id="removable">Removing files</x-sub-title>
-
-<x-p>
-    To be able to delete files, you must use the <code>removable()</code> method
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\File;
-
-//...
-public function fields(): array
-{
-    return [
-        //...
-        File::make('File', 'file')
-            ->removable(), // [tl! focus]
-        //...
-    ];
-}
-//...
-</x-code>
-
-<x-p>
-    The <code>disableDeleteFiles()</code> method will allow you to delete only the record in the database,
-    but not delete the file itself
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\File;
-
-//...
-public function fields(): array
-{
-    return [
-        //...
-        File::make('File', 'file')
-            ->removable()
-            ->disableDeleteFiles(), // [tl! focus]
-        //...
-    ];
-}
-//...
-</x-code>
-
-<x-p>
-    The <code>enableDeleteDir()</code> method deletes the directory specified in the <code>dir()</code> method if it is empty
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\File;
-
-//...
-public function fields(): array
-{
-    return [
-        //...
-        File::make('File', 'file')
-            ->dir('/images/')
-            ->removable()
-            ->enableDeleteDir(), // [tl! focus]
-        //...
-    ];
-}
-//...
-</x-code>
-
-<x-sub-title id="download">Disabling download</x-sub-title>
-
-<x-p>
-    If you want to protect the file from download, you must use the <code>disableDownload()</code> method
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\File;
-
-//...
-public function fields(): array
-{
-    return [
-        //...
-        File::make('File', 'file')
-            ->disableDownload(), // [tl! focus]
-        //...
-    ];
-}
-//...
-</x-code>
-
-<x-sub-title id="filename">Original filename</x-sub-title>
-
-<x-p>
-    If you want to keep the original filename received from the client, use the <code>keepOriginalFileName()</code> method
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\File;
-
-//...
-public function fields(): array
-{
-    return [
-        //...
-        File::make('File', 'file')
-            ->keepOriginalFileName(), // [tl! focus]
-        //...
-    ];
-}
-//...
-</x-code>
-
-<x-sub-title id="customname">Custom file name</x-sub-title>
-
-<x-p>
-    If you need to save a custom file name, use the method <code>customName('file_name'))</code>
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\File;
-use Illuminate\Http\UploadedFile;
-use Illuminate\Support\Str;
-
-//...
-public function fields(): array
-{
-    return [
-        //...
-        File::make('File', 'file')
-            ->customName(fn(UploadedFile $file) =>  Str::random(10) . '.' . $file->extension()), // [tl! focus]
-        //...
-    ];
-}
-//...
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/has_many.blade.php b/resources/views/pages/en/fields/has_many.blade.php
deleted file mode 100644
index 8f97279d..00000000
--- a/resources/views/pages/en/fields/has_many.blade.php
+++ /dev/null
@@ -1,70 +0,0 @@
-<x-page title="HasMany">
-
-<x-p>Field for relationships in Laravel, hasMany type</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\HasMany;
-
-//...
-public function fields(): array
-{
-    return [
-        HasMany::make('Comments')
-            ->fields([
-                ID::make(),
-                BelongsTo::make('Article'),
-                BelongsTo::make('User'),
-                Text::make('Text')->required(),
-            ])
-            ->removable()
-    ];
-}
-//...
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    ID in the fields method is required
-</x-moonshine::alert>
-
-<x-p>
-    It often happens that there are a lot of fields for relations and they look small in the table, and this is inconvenient.
-    In many cases, you have to move this relation to a separate resource, however if you must leave it within the current resource,
-    but display the fields completely,
-    you can use the <code>fullPage()</code> method, and the fields will get a standard shape
-</x-p>
-
-<x-image theme="light" src="{{ asset('screenshots/has_many.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/has_many_dark.png') }}"></x-image>
-
-<x-p>
-    Anyway, the table and fullPage modes are more suitable for relations with primitive fields, such modes
-    do not support Json, HasOne, HasMany fields and many others.
-    But you can switch the field to <code>ResourceMode</code> to render a list of related records, or a related form
-    as a standalone resource.
-    To do this, you need to specify the <code>resourceMode()</code> method for the field and in this case you shouldn't specify the field set
-    in the <code>fields()</code> method, but the resource associated with the fields will be required
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\HasMany;
-
-//...
-public function fields(): array
-{
-    return [
-        HasMany::make('Rates', 'prices', new PriceResource())
-            ->resourceMode()
-    ];
-}
-//...
-</x-code>
-
-<x-p>
-    Pay attention that the presence of a resource in this mode is a mandatory criterion.
-    However, it can be omitted if it does not violate the naming convention. As a result of which, it will be found automatically.
-</x-p>
-
-<x-image theme="light" src="{{ asset('screenshots/resource_mode.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/resource_mode_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/has_many_through.blade.php b/resources/views/pages/en/fields/has_many_through.blade.php
deleted file mode 100644
index 207b00c9..00000000
--- a/resources/views/pages/en/fields/has_many_through.blade.php
+++ /dev/null
@@ -1,13 +0,0 @@
-<x-page title="HasManyThrough">
-
-<x-extendby :href="route('moonshine.page', 'fields-has_many')">
-    HasMany
-</x-extendby>
-
-<x-p>Field for relationships in Laravel, hasManyThrough type</x-p>
-
-<x-p>Same as <code>MoonShine\Fields\HasMany</code> only for hasManyThrough relationships</x-p>
-
-<x-p><code>MoonShine\Fields\hasManyThrough</code></x-p>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/has_one.blade.php b/resources/views/pages/en/fields/has_one.blade.php
deleted file mode 100644
index c6edd1a2..00000000
--- a/resources/views/pages/en/fields/has_one.blade.php
+++ /dev/null
@@ -1,51 +0,0 @@
-<x-page title="HasOne">
-
-<x-extendby :href="route('moonshine.page', 'fields-has_many')">
-    HasMany
-</x-extendby>
-
-<x-p>Field for relationships in Laravel, hasOne type</x-p>
-
-<x-p>Creates a new record in the linked table and binds it to the current record</x-p>
-
-<x-p>In case of relationship the record is edited</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\HasOne;
-
-//...
-public function fields(): array
-{
-    return [
-        HasOne::make('City', 'city', 'name')
-            ->fields([
-                ID::make(),
-                Text::make('Value', 'name'),
-            ])
-    ];
-}
-//...
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    ID in the fields method is required
-</x-moonshine::alert>
-
-<x-p>
-    It often happens that there are a lot of fields for relations and they look small in the table, and this is inconvenient.
-    In many cases, you have to move this relation to a separate resource, however if you must leave it within the current resource,
-    but display the fields completely, you can use
-    the <code>fullPage()</code> method, and the fields will get a standard shape
-</x-p>
-
-<x-image theme="light" src="{{ asset('screenshots/has_one_1.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/has_one_1_dark.png') }}"></x-image>
-
-<x-image theme="light" src="{{ asset('screenshots/has_one_2.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/has_one_2_dark.png') }}"></x-image>
-
-<x-p>
-    <code>resourceMode</code> is also available, details in the HasMany field
-</x-p>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/has_one_through.blade.php b/resources/views/pages/en/fields/has_one_through.blade.php
deleted file mode 100644
index 9021819a..00000000
--- a/resources/views/pages/en/fields/has_one_through.blade.php
+++ /dev/null
@@ -1,13 +0,0 @@
-<x-page title="HasOneThrough">
-
-<x-extendby :href="route('moonshine.page', 'fields-has_one')">
-    HasOne
-</x-extendby>
-
-<x-p>Field for relationships in Laravel, hasOneThrough type</x-p>
-
-<x-p>Same as <code>MoonShine\Fields\HasOne</code> but for hasOneThrough relationships</x-p>
-
-<x-p><code>MoonShine\Fields\HasOne</code></x-p>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/id.blade.php b/resources/views/pages/en/fields/id.blade.php
deleted file mode 100644
index 7e18db11..00000000
--- a/resources/views/pages/en/fields/id.blade.php
+++ /dev/null
@@ -1,42 +0,0 @@
-<x-page title="ID">
-
-<x-extendby :href="route('moonshine.page', 'fields-text')">
-    Text
-</x-extendby>
-
-<x-p>
-    It is almost always present and will be hidden by default on the add/edit page.
-    If the primary key has a name other than id you have to specify its name as the first argument of the <code>make</code> method.
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\ID; // [tl! focus]
-
-//...
-
-public function fields(): array
-{
-    return [
-        ID::make()  // [tl! focus]
-    ];
-}
-
-//...
-</x-code>
-
-<x-code language="php">
-use MoonShine\Fields\ID; // [tl! focus]
-
-//...
-
-public function fields(): array
-{
-    return [
-        ID::make('primary_key')  // [tl! focus]
-    ];
-}
-
-//...
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/image.blade.php b/resources/views/pages/en/fields/image.blade.php
deleted file mode 100644
index ede3759e..00000000
--- a/resources/views/pages/en/fields/image.blade.php
+++ /dev/null
@@ -1,42 +0,0 @@
-<x-page title="Image">
-
-<x-extendby :href="route('moonshine.page', 'fields-file')">
-    File
-</x-extendby>
-
-<x-p>
-    Everything is the same as <code>File</code>, only the display changes
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Image;
-
-//...
-public function fields(): array
-{
-    return [
-        //... [tl! focus:start]
-        Image::make('Thumbnail', 'thumbnail')
-            ->dir('/') // The directory where the files will be stored in storage (by default /)
-            ->disk('public') // Filesystems disk
-            ->allowedExtensions(['jpg', 'gif', 'png']) // Allowable extensions
-        //... [tl! focus:end]
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/image.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/image_dark.png') }}"></x-image>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    To correctly generate the file URL, you must define the environment variable <code>APP_URL</code> in this way,
-    to match your app's URL.
-</x-moonshine::alert>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    When using the <code>local</code> driver, the return value of <code>url</code> is not URL encoded.
-    For this reason, we recommend always storing your files using names that will create valid URLs.
-</x-moonshine::alert>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/index.blade.php b/resources/views/pages/en/fields/index.blade.php
deleted file mode 100644
index 62f6f57b..00000000
--- a/resources/views/pages/en/fields/index.blade.php
+++ /dev/null
@@ -1,502 +0,0 @@
-<x-page title="Basics" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#make', 'label' => 'Make'],
-        ['url' => '#hide-show', 'label' => 'Displaying'],
-        ['url' => '#hide-show-conditions', 'label' => 'Conditional display'],
-        ['url' => '#attributes', 'label' => 'Attributes'],
-        ['url' => '#custom-attributes', 'label' => 'Arbitrary attributes'],
-        ['url' => '#required', 'label' => 'Required field'],
-        ['url' => '#dynamic', 'label' => 'Dynamic value'],
-        ['url' => '#hint', 'label' => 'Hint'],
-        ['url' => '#link', 'label' => 'Link'],
-        ['url' => '#nullable', 'label' => 'Nullable'],
-        ['url' => '#sortable', 'label' => 'Sorting'],
-        ['url' => '#label', 'label' => 'Hide label'],
-        ['url' => '#default', 'label' => 'Default value'],
-        ['url' => '#show-when', 'label' => 'Display condition'],
-        ['url' => '#can-save', 'label' => 'Ability to save'],
-        ['url' => '#events', 'label' => 'Events'],
-        ['url' => '#custom-view', 'label' => 'Change view'],
-        ['url' => '#when-unless', 'label' => 'Methods by condition'],
-    ]
-]">
-
-<x-p>
-    Fields is one of the most important sections along with resources.
-    We have already discussed the process of Fields registration in the Resource section,
-    but let's figure out how to customize them to your needs! The fluent interface is used for convenience
-</x-p>
-
-<x-sub-title id="make">Make</x-sub-title>
-
-<x-p>
-    First of all, let's understand how the <code>make</code> method works when creating an instance of a field
-</x-p>
-
-<x-code language="php">
-Text::make(string $label = null, string $column = null, ResourceContract|string|null $resource = null)
-</x-code>
-
-<x-p>
-    $label - Label, field header<br>
-    $column - A field in the database (e.g. name) or a relation (e.g. countries)<br>
-    $resource - If $field is a relation, then in this parameter you need to specify a field
-    in the linked table that will be displayed in the view
-</x-p>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    $resource can also be a Resource class. In this case, if the
-    <code>$titleField</code> property is specified, the field of the relation will be defined through it
-</x-moonshine::alert>
-
-<x-code language="php">
-//...
-class MoonShineUserResource extends Resource
-{
-public static string $model = MoonshineUser::class;
-
-public static string $title = 'Administrators';
-
-public string $titleField = 'name'; // [tl! focus]
-//...
-</x-code>
-
-<x-sub-title id="hide-show">Displaying</x-sub-title>
-
-<x-p>
-    The fields are displayed at the page (the main page of the resource) and at the create/edit page.
-    To exclude the field from the main page or the page with the form, you can use
-    <code>hideOnIndex/hideOnForm/hideOnDetail</code> methods and <code>showOnIndex/showOnForm/showOnDetail</code> reverse methods.
-    To exclude it from the edit or add page only -
-    use <code>hideOnCreate/hideOnUpdate/showOnCreate/showOnUpdate</code>
-</x-p>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Block::make('Block title', [
-            ID::make(),
-            Text::make('Title', 'title')
-            // [tl! focus:start]
-                ->hideOnIndex()
-                ->hideOnForm()
-            // [tl! focus:end]
-            ,
-        ])
-    ];
-}
-
-//...
-</x-code>
-
-<x-sub-title id="hide-show-conditions">Conditional display</x-sub-title>
-
-<x-p>
-    This method also accepts bool, or Closure
-</x-p>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Block::make('Block title', [
-            ID::make(),
-            Text::make('Title', 'title')
-            // [tl! focus:start]
-                ->hideOnIndex(auth()->check())
-            // [tl! focus:end]
-            ,
-        ])
-    ];
-}
-
-//...
-</x-code>
-
-<x-sub-title id="attributes">Attributes</x-sub-title>
-
-<x-p>
-    As the form renders the html element, you can use basic html attributes as well.
-    Such as <code>disabled</code>, <code>autocomplete</code>, <code>readonly</code>, <code>multiple</code> etc.
-</x-p>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Block::make('Block title', [
-            Text::make('Title', 'title')
-                ->disabled() // [tl! focus]
-                ->hidden() // [tl! focus]
-                ->readonly(), // [tl! focus]
-            ];
-        ])
-    }
-
-//...
-</x-code>
-
-<x-sub-title id="custom-attributes">Arbitrary attributes</x-sub-title>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Block::make('Block title', [
-            Password::make('Password', 'password')
-                ->customAttributes(['autocomplete' => 'off']) // [tl! focus]
-        ])
-    ];
-}
-
-//...
-</x-code>
-
-<x-sub-title id="required">Required field</x-sub-title>
-
-<x-p>
-    To make the field mandatory, you must use the <code>required</code> method
-</x-p>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Block::make('Block title', [
-            Text::make('Title', 'title')
-                ->required() // [tl! focus]
-        ])
-    ];
-}
-
-//...
-</x-code>
-
-<x-sub-title id="dynamic">Dynamic value</x-sub-title>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Block::make('Block title', [
-            Text::make('Name', 'first_name', fn($item) => $item->first_name . ' ' . $item->last_name)
-
-            // Example if you want to separate the logic for the main and for editing
-            Text::make('Price', resource: function ($item) {
-                if(request()->routeIs('*.index')) {
-                    return $item->price;
-                }
-
-                return $item->exists ? $item->price->raw() : 0;
-            }),
-        ])
-    ];
-}
-
-//...
-</x-code>
-
-<x-sub-title id="hint">Hint</x-sub-title>
-
-<x-p>
-    You can add a hint with a description to the field by calling the <code>hint</code>
-</x-p>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Number::make('Rating')
-            ->hint('From 0 to 5') // [tl! focus]
-            ->min(0)
-            ->max(5)
-            ->stars()
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/hint.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/hint_dark.png') }}"></x-image>
-
-<x-sub-title id="link">Link</x-sub-title>
-
-<x-p>
-    You can add a link to the field (e.g. with instructions)
-    <code>addLink(string $name, string $link, bool $blank = false)</code>
-</x-p>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Text::make('Title', 'title')
-            ->addLink('YouTube', 'https://youtube.com') // [tl! focus]
-            // or with the anonymous function
-            ->addLink('Test', function() {
-                if(!$this->getItem()) {
-                    return route('admin.brands.index');
-                }
-
-                return route('admin.brands.edit', $this->getItem()->brand_id);
-            }),
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/link.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/link_dark.png') }}"></x-image>
-
-<x-sub-title id="nullable">Nullable</x-sub-title>
-
-<x-p>
-    If you want to save NULL <code>nullable()</code> by default
-</x-p>
-
-<x-sub-title id="sortable">Sorting</x-sub-title>
-
-<x-p>
-    To be able to sort the field on the main page of the resource, you must add the <code>sortable</code> method
-</x-p>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Text::make('Title', 'title')
-            ->sortable() // [tl! focus]
-    ];
-}
-
-//...
-</x-code>
-
-<x-sub-title id="label">Hide label</x-sub-title>
-
-<x-p>
-    The <code>fieldContainer</code> method hides Label fields to save space,
-    especially useful in conjunction with the <code>Flex</code> decoration
-</x-p>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Text::make('Title', 'title')
-            ->fieldContainer(false) // [tl! focus]
-    ];
-}
-
-//...
-</x-code>
-
-<x-sub-title id="default">Default value</x-sub-title>
-
-<x-p>
-    Use the <code>default</code> method if you want to specify a default value for the field
-</x-p>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Text::make('Title', 'title')
-            ->default('-') // [tl! focus]
-    ];
-}
-
-//...
-</x-code>
-
-<x-sub-title id="show-when">Display condition</x-sub-title>
-
-<x-p>
-    There may be a need to display a field only if the value of another field
-    in the form has a certain value (For example: display the phone only if there is a check mark for it).
-    For these purposes, the <code>showWhen($column, $operator, $value)</code> method is used
-</x-p>
-
-<x-p>
-    Available operators:
-</x-p>
-
-<x-p>
-    <x-moonshine::badge color="gray">=</x-moonshine::badge>
-    <x-moonshine::badge color="gray"><</x-moonshine::badge>
-    <x-moonshine::badge color="gray">></x-moonshine::badge>
-    <x-moonshine::badge color="gray"><=</x-moonshine::badge>
-    <x-moonshine::badge color="gray">>=</x-moonshine::badge>
-    <x-moonshine::badge color="gray">!=</x-moonshine::badge>
-    <x-moonshine::badge color="gray">in</x-moonshine::badge>
-    <x-moonshine::badge color="gray">not in</x-moonshine::badge>
-</x-p>
-
-<x-moonshine::alert type="default" icon="heroicons.book-open">
-    If the operator is not specified, then <code>=</code> will be used
-</x-moonshine::alert>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Phone::make('Phone', 'phone')
-            ->showWhen('has_phone','=', 1) // [tl! focus]
-        // или
-        Phone::make('Phone', 'phone')
-            ->showWhen('has_phone', 1) // [tl! focus]
-    ];
-}
-
-//...
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    If the statement is <code>in</code> or <code>not in</code>,
-    then in <code>$value</code> you need to pass an array
-</x-moonshine::alert>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Select::make('List', 'list')->multiple()->options([
-            'value 1' => 'Option Label 1',
-            'value 2' => 'Option Label 2',
-            'value 3' => 'Option Label 3',
-        ]),
-
-        Text::make('Name', 'name')
-            ->showWhen('list', 'not in', ['value 1', 'value 3']), // [tl! focus]
-
-        Textarea::make('Content', 'content')
-            ->showWhen('list', 'in', ['value 2', 'value 3']) // [tl! focus]
-    ];
-}
-
-//...
-</x-code>
-
-<x-sub-title id="can-save">Ability to save</x-sub-title>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Text::make('Title', 'title')
-            ->canSave(false) // [tl! focus]
-            // or
-            ->canSave(fn() => false) // [tl! focus]
-    ];
-}
-
-//...
-</x-code>
-
-<x-sub-title id="events">Events</x-sub-title>
-
-<x-p>
-    When writing your own Fields, you may need to interact with events before and after saving.
-    To do this, you have to implement the relevant methods in your custom field
-</x-p>
-
-<x-code language="php">
-public function beforeSave(Model $item): void
-{
-    //
-}
-
-public function afterSave(Model $item): void
-{
-    //
-}
-</x-code>
-
-<x-sub-title id="custom-view">Change view</x-sub-title>
-
-<x-p>
-    Sometimes it makes sense to change the view using a fluent interface
-    (For example, if you use filters or fields outside of MoonShine)
-</x-p>
-
-<x-code language="php">
-Text::make('Title')
-    ->customView('fields.my-custom-input'),
-</x-code>
-
-<x-sub-title id="when-unless">Methods by condition</x-sub-title>
-
-<x-p>
-    The <code>when</code> method implements the <code>fluent interface</code>
-    and will execute a callback when the first argument, passed to the method is true.
-</x-p>
-
-<x-code language="php">
-Text::make('Slug')
-    ->when(isset($this->getItem()->id), fn(Text $field) => $field->locked()),
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    The field instance will be passed to the callback function.
-</x-moonshine::alert>
-
-<x-p>
-    The second callback can be passed to the <code>when</code> method, it will be executed,
-    when the first argument passed to the method has a false value.
-</x-p>
-
-<x-code language="php">
-Text::make('Slug')
-    ->when(
-        isset($this->getItem()->id),
-        fn(Text $field) => $field->locked(),
-        fn(Text $field) => $field->hidden()
-    ),
-</x-code>
-
-<x-p>
-    The <code>unless</code> method is the reverse of the <code>when</code> method and will execute the first callback,
-    when the first argument has a false value, otherwise the second callback will be executed if it was passed to the method.
-</x-p>
-
-<x-code language="php">
-Text::make('Slug')
-    ->unless(
-        auth('moonshine')->user()->moonshine_user_role_id === 1,
-        fn(Text $field) => $field->readonly()->hideOnCreate(),
-        fn(Text $field) => $field->locked()
-    ),
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/json.blade.php b/resources/views/pages/en/fields/json.blade.php
deleted file mode 100644
index aceb7dec..00000000
--- a/resources/views/pages/en/fields/json.blade.php
+++ /dev/null
@@ -1,90 +0,0 @@
-<x-page title="Json" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#key-value', 'label' => 'Key/Value'],
-        ['url' => '#fields', 'label' => 'With a set of fields'],
-        ['url' => '#removable', 'label' => 'Deleting'],
-        ['url' => '#value-only', 'label' => 'Value only'],
-    ]
-]">
-
-<x-moonshine::alert class="mt-8" type="default" icon="heroicons.information-circle">
-    In the database, the field must be of type text or json. Also cast eloquent array or json or collection models.
-</x-moonshine::alert>
-
-<x-sub-title id="key-value">Key/Value</x-sub-title>
-
-<x-p>
-    The easiest way is to use the keyValue method, in which case the database will have a simple json [{key: value}]
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Json;
-
-//...
-public function fields(): array
-{
-    return [
-        Json::make('Product Options', 'options') // [tl! focus]
-            ->keyValue('Characteristic', 'Value') // First argument Key label, second argument Value label [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/json_fields.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/json_fields_dark.png') }}"></x-image>
-
-<x-sub-title id="fields">With a set of fields</x-sub-title>
-
-<x-p>
-    For more advanced use, use the fields method and pass the required set of fields in a similar way to how the resource works
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Json;
-
-//...
-public function fields(): array
-{
-    return [
-        Json::make('Product Options', 'options') // [tl! focus:start]
-            ->fields([
-                Text::make('Title', 'title'),
-                Text::make('Value', 'value')
-            ]) // [tl! focus:end]
-    ];
-}
-//...
-</x-code>
-
-<x-p>
-    json [{title: 'value', value: 'value'}]
-</x-p>
-
-<x-image theme="light" src="{{ asset('screenshots/json_key_value.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/json_key_value_dark.png') }}"></x-image>
-
-<x-sub-title id="removable">Deleting</x-sub-title>
-
-<x-code language="php">
-Json::make('Product Options', 'options')
-    ->keyValue('Characteristics', 'Value')
-    ->removable() // [tl! focus]
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/json_removable.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/json_removable_dark.png') }}"></x-image>
-
-<x-sub-title id="value-only">Value only</x-sub-title>
-
-<x-p>
-    Sometimes you only need to store the values in the database
-    for this you can use the <code>onlyValue()</code> method.
-</x-p>
-
-<x-code language="php">
-Json::make('Product Options', 'options')
-    ->onlyValue() // [tl! focus]
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/morph_many.blade.php b/resources/views/pages/en/fields/morph_many.blade.php
deleted file mode 100644
index 21ce53a1..00000000
--- a/resources/views/pages/en/fields/morph_many.blade.php
+++ /dev/null
@@ -1,13 +0,0 @@
-<x-page title="MorphMany">
-
-<x-extendby :href="route('moonshine.page', 'fields-has_many')">
-    HasMany
-</x-extendby>
-
-<x-p>Field for relationships in Laravel, morphMany type</x-p>
-
-<x-p>Same as <code>MoonShine\Fields\HasMany</code> only for morphMany relations</x-p>
-
-<x-p><code>MoonShine\Fields\MorphMany</code></x-p>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/morph_one.blade.php b/resources/views/pages/en/fields/morph_one.blade.php
deleted file mode 100644
index 396b62f7..00000000
--- a/resources/views/pages/en/fields/morph_one.blade.php
+++ /dev/null
@@ -1,16 +0,0 @@
-<x-page title="MorphOne">
-
-<x-extendby :href="route('moonshine.page', 'fields-has_one')">
-    HasOne
-</x-extendby>
-
-<x-p>Field for relationships in Laravel, morphOne type</x-p>
-
-<x-p>Same as <code>MoonShine\Fields\HasOne</code> but for MorphOne relations</x-p>
-
-<x-p><code>MoonShine\Fields\MorphOne</code></x-p>
-
-</x-page>
-
-
-
diff --git a/resources/views/pages/en/fields/morph_to.blade.php b/resources/views/pages/en/fields/morph_to.blade.php
deleted file mode 100644
index 353bf7b6..00000000
--- a/resources/views/pages/en/fields/morph_to.blade.php
+++ /dev/null
@@ -1,35 +0,0 @@
-<x-page title="MorphTo">
-
-<x-extendby :href="route('moonshine.page', 'fields-belongs_to')">
-    BelongsTo
-</x-extendby>
-
-<x-p>Relationship field in Laravel like MorphTo</x-p>
-
-<x-p>Same as <code>MoonShine\Fields\BelongsTo</code> but for MorphTo relationships</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\MorphTo;
-
-//...
-
-public function fields(): array
-{
-    return [
-        MorphTo::make('Commentable')->types([
-            Article::class => 'title'
-        ]),
-    ];
-}
-//...
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    Required <code>types</code> method specifying the classes available.<br/>
-    The key is a reference to the model, and the value is the field to display.
-</x-moonshine::alert>
-
-<x-image theme="light" src="{{ asset('screenshots/morph_to.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/morph_to_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/morph_to_many.blade.php b/resources/views/pages/en/fields/morph_to_many.blade.php
deleted file mode 100644
index 1c42d29a..00000000
--- a/resources/views/pages/en/fields/morph_to_many.blade.php
+++ /dev/null
@@ -1,16 +0,0 @@
-<x-page title="MorphToMany">
-
-<x-extendby :href="route('moonshine.page', 'fields-belongs_to_many')">
-    BelongsToMany
-</x-extendby>
-
-<x-p>Field for relationships in Laravel, MorphToMany type</x-p>
-
-<x-p>Same as <code>MoonShine\Fields\BelongsToMany</code> only for MorphToMany relationships</x-p>
-
-<x-p><code>MoonShine\Fields\MorphToMany</code></x-p>
-
-</x-page>
-
-
-
diff --git a/resources/views/pages/en/fields/no_input.blade.php b/resources/views/pages/en/fields/no_input.blade.php
deleted file mode 100644
index 124903e2..00000000
--- a/resources/views/pages/en/fields/no_input.blade.php
+++ /dev/null
@@ -1,106 +0,0 @@
-<x-page title="NoInput" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basic', 'label' => 'Basic application'],
-        ['url' => '#badge', 'label' => 'Badge'],
-        ['url' => '#boolean', 'label' => 'Boolean'],
-        ['url' => '#link', 'label' => 'Link'],
-    ]
-]">
-
-<x-p>
-    <b>The field is not for data input/amendment!</b>
-</x-p>
-
-<x-sub-title id="basic">Basic application</x-sub-title>
-
-<x-p>
-    With this default field, you can display text data from any field in the model,
-    or generate text based on the model.
-</x-p>
-
-<x-code language="php">
-//...
-use MoonShine\Fields\NoInput;
-
-public function fields(): array
-{
-    return [
-        NoInput::make('No input field', 'no_input', static fn() => fake()->realText()),
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/no-input.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/no-input_dark.png') }}"></x-image>
-
-<x-sub-title id="badge">Badge</x-sub-title>
-
-<x-p>
-    Displays a label, could be used for order status, as an example!
-    We use the badge method with a color parameter,
-    which can be either a string or a closure with the current element in the parameter
-</x-p>
-
-<x-code language="php">
-//...
-use MoonShine\Fields\NoInput;
-
-public function fields(): array
-{
-    return [
-        NoInput::make('Status')->badge(fn($item) => $item->status_id === 1 ? 'green' : 'gray'),
-    ];
-}
-
-//...
-</x-code>
-
-<x-sub-title id="boolean">Boolean</x-sub-title>
-
-<x-p>
-    Display a label (green or red) for boolean values.
-    Using the hideTrue and hideFalse options you can hide the label for values input
-</x-p>
-
-<x-code language="php">
-//...
-use MoonShine\Fields\NoInput;
-
-public function fields(): array
-{
-    return [
-        NoInput::make('Active')->boolean(hideTrue: false, hideFalse: false),
-    ];
-}
-
-//...
-</x-code>
-
-<x-sub-title id="link">Link</x-sub-title>
-
-<x-p>
-    Displays a link.
-    We can show the value and specify the link using the parameter (string or closure with the current element)
-</x-p>
-
-<x-code language="php">
-//...
-use MoonShine\Fields\NoInput;
-
-public function fields(): array
-{
-    return [
-        NoInput::make('Link')->link('https://cutcode.dev', blank: false),
-        NoInput::make('Link')->link(fn($item) => $item->link, blank: true),
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/no-input_all.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/no-input_all_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/number.blade.php b/resources/views/pages/en/fields/number.blade.php
deleted file mode 100644
index 79d0ab8a..00000000
--- a/resources/views/pages/en/fields/number.blade.php
+++ /dev/null
@@ -1,48 +0,0 @@
-<x-page title="Number">
-
-<x-extendby :href="route('moonshine.page', 'fields-text')">
-    Text
-</x-extendby>
-
-<x-p>
-    Input with the number type and additional methods: <code>stars</code>, <code>min</code>, <code>max</code>
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Number;
-
-//...
-public function fields(): array
-{
-    return [
-        Number::make('Rating', 'rating')
-            ->min(1)
-            ->max(5)
-    ];
-}
-
-//...
-</x-code>
-
-<x-p>
-    To display a numerical value as stars (e.g. for rating), you need the <code>stars</code> method
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Number;
-
-//...
-public function fields(): array
-{
-    return [
-        Number::make('Rating', 'rating')
-            ->stars() // [tl! focus]
-            ->min(1)
-            ->max(5)
-    ];
-}
-
-//...
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/password.blade.php b/resources/views/pages/en/fields/password.blade.php
deleted file mode 100644
index e3590c87..00000000
--- a/resources/views/pages/en/fields/password.blade.php
+++ /dev/null
@@ -1,33 +0,0 @@
-<x-page title="Password">
-
-<x-extendby :href="route('moonshine.page', 'fields-text')">
-    Text
-</x-extendby>
-
-<x-p>
-    Everything is the same as the "Text field", the only difference is input type = password
-</x-p>
-
-<x-p>
-    And usually it could be accompanied with the password confirmation field
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Password;
-use MoonShine\Fields\PasswordRepeat;
-
-//...
-
-public function fields(): array
-{
-    return [
-        Password::make('Password', 'password')->hideOnIndex(),  // [tl! focus]
-        PasswordRepeat::make('Repeat password', 'password_repeat')->hideOnIndex(),  // [tl! focus]
-    ];
-}
-
-//...
-
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/phone.blade.php b/resources/views/pages/en/fields/phone.blade.php
deleted file mode 100644
index 4715c10d..00000000
--- a/resources/views/pages/en/fields/phone.blade.php
+++ /dev/null
@@ -1,19 +0,0 @@
-<x-page title="Phone">
-
-<x-extendby :href="route('moonshine.page', 'fields-text')">
-    Text
-</x-extendby>
-
-<x-p>
-    Everything is the same as the "Text field", the only difference is input type = tel
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Phone;
-
-Phone::make('Phone', 'tel')
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">To mask the telephone number, use the mask('7 999 999-99-99') method</x-moonshine::alert>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/select.blade.php b/resources/views/pages/en/fields/select.blade.php
deleted file mode 100644
index 47e73726..00000000
--- a/resources/views/pages/en/fields/select.blade.php
+++ /dev/null
@@ -1,105 +0,0 @@
-<x-page title="Select field" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#nullable', 'label' => 'Nullable'],
-        ['url' => '#groups', 'label' => 'Groups'],
-        ['url' => '#multiple', 'label' => 'Multiple select'],
-        ['url' => '#searchable', 'label' => 'Search'],
-    ]
-]">
-
-<x-p>
-    The text field includes all the basic methods and additional methods for select fields
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Select;
-
-//...
-
-public function fields(): array
-{
-    return [
-        Select::make('Country', 'country_id')
-            ->options([
-                'value 1' => 'Option Label 2',
-                'value 2' => 'Option Label 2'
-            ])
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/select.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/select_dark.png') }}"></x-image>
-
-<x-sub-title id="nullable">Nullable</x-sub-title>
-
-<x-p>
-    If you need to save NULL, then you need to add a <code>nullable</code> method
-</x-p>
-
-<x-code language="php">
-    Select::make('Country', 'country_id')
-    ->nullable() // [tl! focus]
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/select_nullable.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/select_nullable_dark.png') }}"></x-image>
-
-<x-sub-title id="groups">Groups</x-sub-title>
-
-<x-p>
-    You can combine values into groups
-</x-p>
-
-<x-code language="php">
-Select::make('City')->options([
-    'Italy' => [
-        1 => 'Rome',
-        2 => 'Milan'
-    ],
-    'France' => [
-        3 => 'Paris',
-        4 => 'Marseille'
-    ],
-]),
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/select_group.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/select_group_dark.png') }}"></x-image>
-
-<x-sub-title id="multiple">Multiple select</x-sub-title>
-
-<x-p>
-    To select multiple values, you need the <code>multiple</code> method
-</x-p>
-
-<x-code language="php">
-Select::make('Country', 'country_id')
-    ->multiple() // [tl! focus]
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    The field in the database must be of the text or json type.<br>
-    You also need to add a cast for the eloquent model - json or array or collection.
-</x-moonshine::alert>
-
-<x-image theme="light" src="{{ asset('screenshots/select_multiple.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/select_multiple_dark.png') }}"></x-image>
-
-<x-sub-title id="searchable">Search</x-sub-title>
-
-<x-p>
-    If you want to add a search among values, you need to add the <code>searchable</code> method
-</x-p>
-
-<x-code language="php">
-    Select::make('Country', 'country_id')
-    ->searchable() // [tl! focus]
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/select_searchable.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/select_searchable_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/shared/async_search.blade.php b/resources/views/pages/en/fields/shared/async_search.blade.php
deleted file mode 100644
index 9172f369..00000000
--- a/resources/views/pages/en/fields/shared/async_search.blade.php
+++ /dev/null
@@ -1,90 +0,0 @@
-<x-sub-title id="async-search">Async search</x-sub-title>
-
-<x-p>
-    Async search for values is provided by the <code>asyncSearch()</code> method.
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\{{ $field }}; // [tl! focus]
-
-//...
-public function fields(): array
-{
-    return [
-        {{ $field }}::make('Contacts') // [tl! focus]
-            ->asyncSearch(){!!$field === 'BelongsToMany' ? "->fields([Text::make('Contact', 'text')])" : ""!!} // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    The search will be performed on the resource relation field <code>titleField</code>. The default is <code>titleField=id</code>.
-</x-moonshine::alert>
-
-<x-p>
-    You can pass parameters to the <code>asyncSearch()</code> method:
-</x-p>
-
-<x-p>
-    <ul>
-        <li><code>title</code> - search field</li>
-        <li><code>count</code> - amount of items in output</li>
-        <li><code>asyncSearchQuery()</code> - callback function for filtering values</li>
-        <li><code>asyncSearchValueCallback()</code> - callback function for output customization.</li>
-    </ul>
-</x-p>
-
-<x-code language="php">
-use Illuminate\Contracts\Database\Eloquent\Builder; // [tl! focus]
-use MoonShine\Fields\{{ $field }}; // [tl! focus]
-
-//...
-public function fields(): array
-{
-    return [
-        {{ $field }}::make('Contacts')->asyncSearch(
-            'title',
-            10,
-            asyncSearchQuery: function (Builder $query) {
-                return $query->where('id', '!=', 2);
-            },
-            asyncSearchValueCallback: function ($contact) {
-                return $contact->id . ' | ' . $contact->title;
-            }
-        ){!!$field === 'BelongsToMany' ? "->fields([Text::make('Contact', 'text')])" : ""!!} // [tl! focus:-9]
-    ];
-}
-//...
-</x-code>
-
-<x-p>
-    When building a query in <code>asyncSearchQuery()</code>, you can use the current form values.
-    To do this, you need to pass <code>Request</code> to the callback functions.
-</x-p>
-
-<x-code language="php">
-use Illuminate\Contracts\Database\Eloquent\Builder; // [tl! focus]
-use Illuminate\Http\Request; // [tl! focus]
-use MoonShine\Fields\{{ $field }};
-use MoonShine\Fields\Select;
-
-//...
-public function fields(): array
-{
-    return [
-        Select::make('Country', 'country_id'), // [tl! focus]
-        {{ $field }}::make('City')->asyncSearch(
-            'title',
-            asyncSearchQuery: function (Builder $query, Request $request): Builder {
-                return $query->where('country_id', $request->get('country_id'));
-            } // [tl! focus:-2]
-        )
-    ];
-}
-//...
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    Relations that use async search in their fields are recommended to be used in <code>ResourceMode</code>.
-</x-moonshine::alert>
diff --git a/resources/views/pages/en/fields/shared/values_query.blade.php b/resources/views/pages/en/fields/shared/values_query.blade.php
deleted file mode 100644
index 71793e18..00000000
--- a/resources/views/pages/en/fields/shared/values_query.blade.php
+++ /dev/null
@@ -1,18 +0,0 @@
-<x-sub-title id="values-query">Values query</x-sub-title>
-
-To filter values, use the <code>valuesQuery</code> method
-
-<x-code language="php">
-use Illuminate\Contracts\Database\Eloquent\Builder; // [tl! focus]
-use MoonShine\Fields\{{ $field }};
-
-//...
-public function fields(): array
-{
-    return [
-        {{ $field }}::make('Categories', 'categories', 'name')
-            ->valuesQuery(fn(Builder $query) => $query->where('active', true)) // [tl! focus]
-    ];
-}
-//...
-</x-code>
diff --git a/resources/views/pages/en/fields/slide.blade.php b/resources/views/pages/en/fields/slide.blade.php
deleted file mode 100644
index 526907b2..00000000
--- a/resources/views/pages/en/fields/slide.blade.php
+++ /dev/null
@@ -1,39 +0,0 @@
-<x-page title="Range">
-
-<x-extendby :href="route('moonshine.page', 'fields-text')">
-    Text
-</x-extendby>
-
-<x-p>
-    Has the same methods as the "Number" field, plus additional methods: <code>step</code>,
-    <code>fromField</code>, <code>toField</code>
-</x-p>
-
-<x-p>
-    Since the range has two values, you have to specify these two fields in the database by means of
-    <code>fromField</code> and <code>toField</code> methods
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\SlideField;
-
-//...
-public function fields(): array
-{
-    return [
-        SlideField::make('Age')
-            ->fromField('age_from') // Field in the table for the value "From"
-            ->toField('age_to') // Field in the table for the value "Before"
-            ->min(0)
-            ->max(60)
-            ->step(1) // Slider pitch
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/slide.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/slide_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/slug.blade.php b/resources/views/pages/en/fields/slug.blade.php
deleted file mode 100644
index 901cbaa5..00000000
--- a/resources/views/pages/en/fields/slug.blade.php
+++ /dev/null
@@ -1,28 +0,0 @@
-<x-page title="Slug">
-
-<x-extendby :href="route('moonshine.page', 'fields-text')">
-    Text
-</x-extendby>
-
-<x-p>
-    Using this field you can generate a slug based on the selected field and keep it unique too
-</x-p>
-
-<x-code language="php">
-//...
-use MoonShine\Fields\Slug;
-
-public function fields(): array
-{
-    return [
-        Slug::make('Slug')->from('title')->separator('-')->unique(),
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/slug.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/slug_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/spatie/medialibrary.blade.php b/resources/views/pages/en/fields/spatie/medialibrary.blade.php
deleted file mode 100644
index a45e33af..00000000
--- a/resources/views/pages/en/fields/spatie/medialibrary.blade.php
+++ /dev/null
@@ -1,88 +0,0 @@
-<x-page title="Spatie\MediaLibrary">
-
-    <x-extendby :href="route('moonshine.page', 'fields-image')">
-        Image
-    </x-extendby>
-
-    <x-p class="font-bold text-pink">
-        This field belongs to a separate package, you have to complete the installation before using it
-    </x-p>
-
-    <x-code language="shell">
-        composer require visual-ideas/moonshine-spatie-medialibrary
-    </x-code>
-
-    <x-p>
-        The field is purposed for work with the
-        <x-link link="https://github.com/spatie/laravel-medialibrary" target="_blank">Laravel-medialibrary</x-link>
-        package made by
-        <x-link link="https://spatie.be/open-source" target="_blank">Spatie</x-link>
-    </x-p>
-
-    <x-p>
-        Before using the Spatie\MediaLibrary field, make sure that:
-    </x-p>
-
-    <x-ul :items="[
-'The spatie/laravel-medialibrary package is installed and configured',
-'The visual-ideas/moonshine-spatie-medialibrary package is installed',
-'The field passed to Spatie\MediaLibrary is added as the name of the collection via ->addMediaCollection(\'Field\')'
-]"></x-ul>
-
-    <x-p>
-        In the model:
-    </x-p>
-    <x-code language="php">
-use Spatie\MediaLibrary\HasMedia;
-use Spatie\MediaLibrary\InteractsWithMedia;
-
-class ModelClass extends Model implements HasMedia
-    //...
-    use InteractsWithMedia;
-
-    //...
-    public function registerMediaCollections(): void
-    {
-        $this->addMediaCollection('cover');
-    }
-    //...
-    </x-code>
-
-    <x-p>
-        In the MoonShine-resource:
-    </x-p>
-    <x-code language="php">
-        use VI\MoonShineSpatieMediaLibrary\Fields\MediaLibrary;
-        //...
-        MediaLibrary::make('Cover', 'cover'),
-        //...
-    </x-code>
-
-    <x-p>
-        By default, the field works in a single image mode
-    </x-p>
-    <x-code language="php">
-use Spatie\MediaLibrary\HasMedia;
-use Spatie\MediaLibrary\InteractsWithMedia;
-
-class ModelClass extends Model implements HasMedia
-//...
-use InteractsWithMedia;
-//...
-public function registerMediaCollections(): void
-{
-    $this->addMediaCollection('cover')->singleFile();
-}
-//...
-    </x-code>
-    <x-p>
-        If you want to use a field to load multiple images, add the ->multiple() method when declaring the field
-    </x-p>
-    <x-code language="php">
-//...
-MediaLibrary::make('Gallery', 'gallery')->multiple(),
-//...
-    </x-code>
-
-
-</x-page>
diff --git a/resources/views/pages/en/fields/spatie/translatable.blade.php b/resources/views/pages/en/fields/spatie/translatable.blade.php
deleted file mode 100644
index 537d2344..00000000
--- a/resources/views/pages/en/fields/spatie/translatable.blade.php
+++ /dev/null
@@ -1,99 +0,0 @@
-<x-page title="Spatie\Translatable" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#fields', 'label' => 'With a set of fields'],
-        ['url' => '#required', 'label' => 'Mandatory translations'],
-        ['url' => '#priority', 'label' => 'Recommended translations'],
-    ]
-]">
-
-<x-extendby :href="route('moonshine.page', 'fields-json')">
-    Json
-</x-extendby>
-
-<x-p class="font-bold text-pink">
-    This field belongs to a separate package, you have to complete the installation before using it
-</x-p>
-
-<x-code language="shell">
-    composer require visual-ideas/moonshine-spatie-translatable
-</x-code>
-
-<x-p>
-    The field is purposed for work with the
-    <x-link link="https://github.com/spatie/laravel-translatable" target="_blank">Laravel-translatable</x-link>
-    package made by
-    <x-link link="https://spatie.be/open-source" target="_blank">Spatie</x-link>
-</x-p>
-
-<x-p>
-    Before using the Spatie\Translatable field, make sure that:
-</x-p>
-
-<x-ul :items="[
-'The spatie/laravel-translatable package is installed and configured',
-'The field passed to the Spatie\Translatable is added to the $translatable array of the model'
-]"></x-ul>
-
-<x-code language="php">
-use VI\MoonShineSpatieTranslatable\Fields\Translatable;
-//...
-Translatable::make('Title', 'name')
-//...
-</x-code>
-
-<x-sub-title id="required">Mandatory translations</x-sub-title>
-
-<x-p>
-    The ->requiredLanguages(array $languages) method is used to specify the languages required by the validator for creating/saving a record.
-</x-p>
-
-<x-p>
-    It is recommended to pass the config('app.fallback_locale') value to this method
-</x-p>
-
-
-<x-code language="php">
-use VI\MoonShineSpatieTranslatable\Fields\Translatable;
-//...
-Translatable::make('Title', 'name')
-    ->requiredLanguages([config('app.fallback_locale'), 'ru'])
-//...
-</x-code>
-
-<x-sub-title id="priority">Recommended translations</x-sub-title>
-
-<x-p>
-    If you specify this array, the language codes in the forms for adding/modifying a specific translation will be placed at the beginning of the list of all possible languages.
-</x-p>
-
-<x-code language="php">
-use VI\MoonShineSpatieTranslatable\Fields\Translatable;
-//...
-Translatable::make('Title', 'name')
-    ->priorityLanguages([config('app.fallback_locale'), config('app.locale'), 'de', 'fr', 'uk'])
-//...
-</x-code>
-
-<x-sub-title id="removable">Deleting</x-sub-title>
-
-<x-p>
-    You can delete specific translations from out of the entered ones
-</x-p>
-
-<x-code language="php">
-Translatable::make('Field', 'field')
-    ->removable() // [tl! focus]
-</x-code>
-
-<x-p>
-    If you leave the translation text blank, it will be deleted!
-</x-p>
-
-<x-p>
-    If there are two translations into the same language, the translation that comes first will be deleted (replaced)!
-</x-p>
-
-</x-page>
-
-
-
diff --git a/resources/views/pages/en/fields/stack_fields.blade.php b/resources/views/pages/en/fields/stack_fields.blade.php
deleted file mode 100644
index 3f022046..00000000
--- a/resources/views/pages/en/fields/stack_fields.blade.php
+++ /dev/null
@@ -1,37 +0,0 @@
-<x-page title="StackFields" :sectionMenu="[]">
-
-<x-p>
-    The <code>StackFields</code> field allows you to group fields when displayed on the index page.
-</x-p>
-
-<x-p>
-    The <code>fields()</code> method needs to pass an array of fields for grouping.
-</x-p>
-
-<x-p>
-    The <code>withLabels()</code> method can be used to display labels on the index page
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\BelongsTo;
-use MoonShine\Fields\StackFields; // [tl! focus]
-use MoonShine\Fields\Text;
-//...
-
-public function fields(): array
-{
-    return [
-        StackFields::make('Title')->fields([ // [tl! focus]
-            Text::make('Title'),
-            BelongsTo::make('Author', resource: 'name'),
-        ]) // [tl! focus]
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/stack_fields.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/stack_fields_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/switch.blade.php b/resources/views/pages/en/fields/switch.blade.php
deleted file mode 100644
index ce3a5861..00000000
--- a/resources/views/pages/en/fields/switch.blade.php
+++ /dev/null
@@ -1,58 +0,0 @@
-<x-page title="Switch">
-
-<x-extendby :href="route('moonshine.page', 'fields-checkbox')">
-    Checkbox
-</x-extendby>
-
-<x-code language="php">
-use MoonShine\Fields\SwitchBoolean;
-
-//...
-public function fields(): array
-{
-    return [
-        SwitchBoolean::make('Publish', 'active')
-    ];
-}
-
-//...
-</x-code>
-
-<x-code language="php">
-use MoonShine\Fields\SwitchBoolean;
-
-//...
-public function fields(): array
-{
-    return [
-        SwitchBoolean::make('Publish', 'active')
-            ->onValue(1) // Active value of a form element
-            ->offValue(0) // Inactive value of a form element
-    ];
-}
-
-//...
-</x-code>
-
-
-<x-code language="php">
-use MoonShine\Fields\SwitchBoolean;
-
-//...
-public function fields(): array
-{
-    return [
-        SwitchBoolean::make('Publish', 'active')
-            ->autoUpdate(false) // The option to change on the main page is disabled
-            ->autoUpdate(true) // The option to change on the home page is enabled
-            ->autoUpdate(fn() => true)
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/switch.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/switch_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/text.blade.php b/resources/views/pages/en/fields/text.blade.php
deleted file mode 100644
index b2497164..00000000
--- a/resources/views/pages/en/fields/text.blade.php
+++ /dev/null
@@ -1,83 +0,0 @@
-<x-page title="Text" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#mask', 'label' => 'Mask'],
-        ['url' => '#extensions', 'label' => 'Extensions'],
-    ]
-]">
-
-<x-p>
-    The text field includes all the basic methods
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Text; // [tl! focus]
-
-//...
-
-public function fields(): array
-{
-    return [
-        Text::make('Title', 'title')  // [tl! focus]
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/input.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/input_dark.png') }}"></x-image>
-
-<x-sub-title id="mask">Mask</x-sub-title>
-
-<x-p>
-    Use the <code>mask</code> method if you want to add a mask to the field
-</x-p>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Text::make('Title', 'title')
-            ->mask('7 (999) 999-99-99') // [tl! focus]
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/mask.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/mask_dark.png') }}"></x-image>
-
-<x-sub-title id="extensions">Extensions</x-sub-title>
-
-<x-code language="php">
-//...
-
-public function fields(): array
-{
-    return [
-        Text::make('Title', 'title')
-            // Copy input value to clipboard
-            ->copy()
-            // Disable/enable input
-            ->locked()
-            // Expansion
-            ->expansion('kg')
-            // Switch type password/text
-            ->eye()
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/expansion.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/expansion_dark.png') }}"></x-image>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    The <code>copy</code> method uses the <code>Clipboard API</code> which is only available for HTTPS or localhost
-</x-moonshine::alert>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/textarea.blade.php b/resources/views/pages/en/fields/textarea.blade.php
deleted file mode 100644
index 0ce86b06..00000000
--- a/resources/views/pages/en/fields/textarea.blade.php
+++ /dev/null
@@ -1,22 +0,0 @@
-<x-page title="Textarea">
-
-<x-p>
-    The Textarea field includes all the basic methods
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Textarea;
-
-//...
-
-public function fields(): array
-{
-    return [
-        Textarea::make('Label', 'table_field')
-    ];
-}
-
-//...
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/url.blade.php b/resources/views/pages/en/fields/url.blade.php
deleted file mode 100644
index 19e08df1..00000000
--- a/resources/views/pages/en/fields/url.blade.php
+++ /dev/null
@@ -1,17 +0,0 @@
-<x-page title="Url">
-
-<x-extendby :href="route('moonshine.page', 'fields-text')">
-    Text
-</x-extendby>
-
-<x-p>
-    Everything is the same as the "Text field", the only difference is input type = url
-</x-p>
-
-<x-code language="php">
-use MoonShine\Fields\Url;
-
-Url::make('Url', 'url')
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/fields/wysiwyg.blade.php b/resources/views/pages/en/fields/wysiwyg.blade.php
deleted file mode 100644
index 50b32541..00000000
--- a/resources/views/pages/en/fields/wysiwyg.blade.php
+++ /dev/null
@@ -1,209 +0,0 @@
-<x-page title="WYSIWYG" :sectionMenu="[
-'Sections' => [
-    ['url' => '#trix', 'label' => 'Trix'],
-    ['url' => '#ckeditor', 'label' => 'CKEditor'],
-    ['url' => '#quill', 'label' => 'Quill'],
-    ['url' => '#tinymce', 'label' => 'TinyMce'],
-]
-]">
-
-<x-extendby :href="route('moonshine.page', 'fields-textarea')">
-    Textarea
-</x-extendby>
-
-<x-sub-title id="tinymce">TinyMce</x-sub-title>
-
-<x-code language="php">
-use MoonShine\Fields\TinyMce; // [tl! focus]
-
-//...
-public function fields(): array
-{
-    return [
-        TinyMce::make('Description', 'description'), // [tl! focus]
-
-        // More advanced settings
-
-        TinyMce::make('Text') // [tl! focus]
-            // Override the plugin set
-            ->plugins('anchor') // [tl! focus]
-            // Adding plugins to the base set
-            ->addPlugins('code codesample') // [tl! focus]
-            // Override the set toolbar
-            ->toolbar('undo redo | blocks fontfamily fontsize') // [tl! focus]
-            // Adding a toolbar to the base set
-            ->addToolbar('code codesample') // [tl! focus]
-            // To change the author name for a plugin tinycomments
-            ->commentAuthor('Danil Shutsky') // [tl! focus]
-            // Tags
-            ->mergeTags([
-                ['value' => 'tag', 'title' => 'Title']
-            ]) // [tl! focus:-2]
-            // Override the current locale
-            ->locale('en'), // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    Translation files are placed in the <code>public/vendor/moonshine/libs/tinymce/langs</code> directory
-</x-moonshine::alert>
-
-<x-image theme="light" src="{{ asset('screenshots/tinymce.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/tinymce_dark.png') }}"></x-image>
-
-<x-p>
-    Sign up at <x-link link="https://www.tiny.cloud" target="_blank">Tiny.Cloud</x-link> and get a token. Then add it to <code>config/moonshine.php</code> config
-</x-p>
-
-<x-code language="php">
-//...
-'tinymce' => [
-    'token' => 'YOUR_TOKEN' // [tl! focus]
-]
-//...
-</x-code>
-
-<x-sub-title>Laravel File manager</x-sub-title>
-<x-link link="https://github.com/UniSharp/laravel-filemanager" target="_blank">Laravel FileManager</x-link>
-
-<x-p>
-    If you want to use the file manager in tinymce, you need to install the Laravel FileManager package
-</x-p>
-
-<x-sub-title hashtag="1">Installing</x-sub-title>
-
-<x-code language="shell">
-composer require unisharp/laravel-filemanager
-
-php artisan vendor:publish --tag=lfm_config
-php artisan vendor:publish --tag=lfm_public
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    Be sure to set the 'use_package_routes' flag in the lfm config to false, otherwise the route caching will cause an error
-</x-moonshine::alert>
-
-<x-code language="php">
-return [
-    // ...
-    'use_package_routes' => false, // [tl! focus]
-    // ...
-];
-
-</x-code>
-
-<x-sub-title hashtag="2">Add routes to the app/Providers/RouteServiceProvider.php</x-sub-title>
-
-<x-code language="php">
-// ..
-Route::middleware('web')
-->group(base_path('routes/web.php'));
-
-Route::group(['prefix' => 'laravel-filemanager', 'middleware' => ['moonshine', 'auth.moonshine']], function () {
-    UniSharp\LaravelFilemanager\Lfm::routes();
-}); // [tl! focus:-2]
-
-// ..
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    The file manager route must be in the <code>moonshine</code> middleware group, not in the web!
-</x-moonshine::alert>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    To allow access only to users authorized in the admin panel
-    middleware <code>auth.moonshine</code> must be used
-</x-moonshine::alert>
-
-<x-sub-title hashtag="3">Add the prefix to config/moonshine.php</x-sub-title>
-
-<x-code language="php">
-//...
-'tinymce' => [
-    'file_manager' => 'laravel-filemanager', // [tl! focus]
-    // ...
-]
-//...
-</x-code>
-
-<x-sub-title id="trix">Trix</x-sub-title>
-
-<x-p class="font-bold text-pink">
-    This field belongs to a separate package, complete the installation before use
-</x-p>
-
-<x-code language="shell">
-composer require moonshine/trix
-</x-code>
-
-<x-code language="php">
-use MoonShine\Fields\Trix; // [tl! focus]
-
-//...
-public function fields(): array
-{
-    return [
-        Trix::make('Description', 'description'), // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/wysiwyg.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/wysiwyg_dark.png') }}"></x-image>
-
-<x-sub-title id="ckeditor">CKEditor</x-sub-title>
-
-<x-p class="font-bold text-pink">
-    The field is placed in a separate package, before use it is necessary to perform the installation
-</x-p>
-
-<x-code language="shell">
-composer require moonshine/ckeditor
-</x-code>
-
-<x-code language="php">
-use MoonShine\CKEditor\Fields\CKEditor; // [tl! focus]
-
-//...
-public function fields(): array
-{
-    return [
-        CKEditor::make('Description', 'description'), // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/ckeditor.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/ckeditor_dark.png') }}"></x-image>
-
-<x-sub-title id="quill">Quill</x-sub-title>
-
-<x-p class="font-bold text-pink">
-    The field is placed in a separate package, before use it is necessary to perform the installation
-</x-p>
-
-<x-code language="shell">
-    composer require moonshine/quill
-</x-code>
-
-<x-code language="php">
-use MoonShine\Quill\Fields\Quill; // [tl! focus]
-
-//...
-public function fields(): array
-{
-    return [
-        Quill::make('Description', 'description'), // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/quill.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/quill_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/filters/belongs_to.blade.php b/resources/views/pages/en/filters/belongs_to.blade.php
deleted file mode 100644
index 8e5ad172..00000000
--- a/resources/views/pages/en/filters/belongs_to.blade.php
+++ /dev/null
@@ -1,27 +0,0 @@
-<x-page title="BelongsToFilter">
-
-<x-extendby :href="route('moonshine.page', 'fields-belongs_to')">
-    BelongsTo
-</x-extendby>
-
-<x-code language="php">
-use MoonShine\Filters\BelongsToFilter;
-
-//...
-
-public function filters(): array
-{
-    return [
-        BelongsToFilter::make('Author', resource: 'name')
-            ->nullable()
-            ->canSee(fn() => auth('moonshine')->user()->moonshine_user_role_id === 1),
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/filter_belongs_to.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/filter_belongs_to_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/filters/belongs_to_many.blade.php b/resources/views/pages/en/filters/belongs_to_many.blade.php
deleted file mode 100644
index 4e2d1d22..00000000
--- a/resources/views/pages/en/filters/belongs_to_many.blade.php
+++ /dev/null
@@ -1,25 +0,0 @@
-<x-page title="BelongsToManyFilter">
-
-<x-extendby :href="route('moonshine.page', 'fields-belongs_to_many')">
-    BelongsToMany
-</x-extendby>
-
-<x-code language="php">
-use MoonShine\Filters\BelongsToManyFilter;
-
-//...
-
-public function filters(): array
-{
-    return [
-        BelongsToManyFilter::make('Categories')
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/filter_belongs_to_many.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/filter_belongs_to_many_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/filters/date.blade.php b/resources/views/pages/en/filters/date.blade.php
deleted file mode 100644
index e5cd68e9..00000000
--- a/resources/views/pages/en/filters/date.blade.php
+++ /dev/null
@@ -1,25 +0,0 @@
-<x-page title="DateFilter">
-
-<x-extendby :href="route('moonshine.page', 'fields-date')">
-    Date
-</x-extendby>
-
-<x-code language="php">
-use MoonShine\Filters\DateFilter;
-
-//...
-
-public function filters(): array
-{
-    return [
-        DateFilter::make('Created at')
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/filter_date.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/filter_date_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/filters/date_range.blade.php b/resources/views/pages/en/filters/date_range.blade.php
deleted file mode 100644
index 8dfba5a5..00000000
--- a/resources/views/pages/en/filters/date_range.blade.php
+++ /dev/null
@@ -1,25 +0,0 @@
-<x-page title="DateRangeFilter">
-
-<x-extendby :href="route('moonshine.page', 'fields-date')">
-    Date
-</x-extendby>
-
-<x-code language="php">
-use MoonShine\Filters\DateRangeFilter;
-
-//...
-
-public function filters(): array
-{
-    return [
-        DateRangeFilter::make('Created at')
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/filter_date_range.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/filter_date_range_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/filters/has_one.blade.php b/resources/views/pages/en/filters/has_one.blade.php
deleted file mode 100644
index 7057730c..00000000
--- a/resources/views/pages/en/filters/has_one.blade.php
+++ /dev/null
@@ -1,26 +0,0 @@
-<x-page title="HasOneFilter">
-
-<x-extendby :href="route('moonshine.page', 'fields-has_one')">
-    HasOne
-</x-extendby>
-
-<x-code language="php">
-use MoonShine\Filters\HasOneFilter;
-
-//...
-
-public function filters(): array
-{
-    return [
-        HasOne::make('Phone', resource: 'number')
-            ->nullable()
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/filter_has_one.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/filter_has_one_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/filters/index.blade.php b/resources/views/pages/en/filters/index.blade.php
deleted file mode 100644
index d16eb115..00000000
--- a/resources/views/pages/en/filters/index.blade.php
+++ /dev/null
@@ -1,100 +0,0 @@
-<x-page title="Basics" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#filters', 'label' => 'Adding a filter'],
-        ['url' => '#custom-query', 'label' => 'Custom query'],
-    ]
-]">
-
-<x-sub-title id="filters">Adding a filter</x-sub-title>
-
-<x-extendby :href="route('moonshine.page', 'fields-index')">
-    Fields
-</x-extendby>
-
-<x-p>
-    Filters are shown on the main page of the resource to filter data.
-    They implement from the corresponding fields, so all methods of these fields are available here as well.
-</x-p>
-
-<x-p>
-    Filters work in exactly the same way as fields, except that they are declared in the
-     <code>filters</code> resource method
-</x-p>
-
-<x-code language="php">
-use MoonShine\Filters\BelongsToFilter;
-use MoonShine\Filters\BelongsToManyFilter;
-use MoonShine\Filters\DateRangeFilter;
-use MoonShine\Filters\SlideFilter;
-use MoonShine\Filters\SwitchBooleanFilter;
-use MoonShine\Filters\TextFilter;
-
-//...
-
-public function filters(): array
-{
-    return [
-        TextFilter::make('Title'),
-
-        BelongsToFilter::make('Author', resource: 'name')
-            ->nullable()
-            ->canSee(fn() => auth('moonshine')->user()->moonshine_user_role_id === 1),
-
-        TextFilter::make('Slug'),
-
-        BelongsToManyFilter::make('Categories')
-            ->select(),
-
-        DateRangeFilter::make('Created at'),
-
-        SlideFilter::make('Age')
-            ->fromField('age_from')
-            ->toField('age_to')
-            ->min(0)
-            ->max(60),
-
-        SwitchBooleanFilter::make('Active')
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/filters.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/filters_dark.png') }}"></x-image>
-
-<x-sub-title id="custom-query">Custom query</x-sub-title>
-
-<x-p>
-    Using the <code>customQuery</code> method, you can create a custom query for the filter
-</x-p>
-
-<x-code language="php">
-use MoonShine\Filters\DateRangeFilter;
-use MoonShine\Filters\TextFilter;
-
-//...
-
-public function filters(): array
-{
-    return [
-        TextFilter::make('Title')
-            ->customQuery(fn(Builder $query, $value) => $query->where('title', 'LIKE', "%${value}%")), // [tl! focus]
-
-        DateRangeFilter::make('Created at')
-            ->customQuery(function (Builder $query, $values) {
-                return $query
-                    ->when($values['from'] ?? null, function ($query, $fromDate) {
-                        $query->whereDate('created_at', '>=', Carbon::parse($fromDate));
-                    })
-                    ->when($values['to'] ?? null, function ($query, $toDate) {
-                        $query->whereDate('created_at', '<=', Carbon::parse($toDate));
-                    });
-            }), // [tl! focus]
-    ];
-}
-
-//...
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/filters/is_empty.blade.php b/resources/views/pages/en/filters/is_empty.blade.php
deleted file mode 100644
index bdb8ce14..00000000
--- a/resources/views/pages/en/filters/is_empty.blade.php
+++ /dev/null
@@ -1,32 +0,0 @@
-<x-page title="IsEmptyFilter/IsNotEmptyFilter">
-
-<x-extendby :href="route('moonshine.page', 'filters-switch')">
-    SwitchBooleanFilter
-</x-extendby>
-
-<x-p>Enables displaying only rows with empty (not empty for IsNotEmptyFilter) field values</x-p>
-
-<x-p>Empty values are the following:</x-p>
-<x-ul :items="['NULL', '\'\'', 0]"></x-ul>
-
-<x-code language="php">
-use MoonShine\Filters\IsEmptyFilter;
-use MoonShine\Filters\IsNotEmptyFilter;
-
-//...
-
-public function filters(): array
-{
-    return [
-        IsEmptyFilter::make('Url'),
-        IsNotEmptyFilter::make('Active')
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/filter_is_empty.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/filter_is_empty_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/filters/select.blade.php b/resources/views/pages/en/filters/select.blade.php
deleted file mode 100644
index 23858932..00000000
--- a/resources/views/pages/en/filters/select.blade.php
+++ /dev/null
@@ -1,29 +0,0 @@
-<x-page title="SelectFilter">
-
-<x-extendby :href="route('moonshine.page', 'fields-select')">
-    Select
-</x-extendby>
-
-<x-code language="php">
-use MoonShine\Filters\SelectFilter;
-
-//...
-
-public function filters(): array
-{
-    return [
-        SelectFilter::make('Country', 'country_id')
-            ->options([
-                'value 1' => 'Option Label 1',
-                'value 2' => 'Option Label 2'
-            ])
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/filter_select.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/filter_select_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/filters/slide.blade.php b/resources/views/pages/en/filters/slide.blade.php
deleted file mode 100644
index 4714e0d5..00000000
--- a/resources/views/pages/en/filters/slide.blade.php
+++ /dev/null
@@ -1,29 +0,0 @@
-<x-page title="SlideFilter">
-
-<x-extendby :href="route('moonshine.page', 'fields-slide')">
-    Slide
-</x-extendby>
-
-<x-code language="php">
-use MoonShine\Filters\SlideFilter;
-
-//...
-
-public function filters(): array
-{
-    return [
-        SlideFilter::make('Age')
-            ->fromField('age_from')
-            ->toField('age_to')
-            ->min(0)
-            ->max(60)
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/filter_slide.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/filter_slide_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/filters/switch.blade.php b/resources/views/pages/en/filters/switch.blade.php
deleted file mode 100644
index 58d08f00..00000000
--- a/resources/views/pages/en/filters/switch.blade.php
+++ /dev/null
@@ -1,25 +0,0 @@
-<x-page title="SwitchBooleanFilter">
-
-<x-extendby :href="route('moonshine.page', 'fields-switch')">
-    Switch
-</x-extendby>
-
-<x-code language="php">
-use MoonShine\Filters\SwitchBooleanFilter;
-
-//...
-
-public function filters(): array
-{
-    return [
-        SwitchBooleanFilter::make('Active')
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/filter_switch.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/filter_switch_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/filters/text.blade.php b/resources/views/pages/en/filters/text.blade.php
deleted file mode 100644
index e2118f48..00000000
--- a/resources/views/pages/en/filters/text.blade.php
+++ /dev/null
@@ -1,25 +0,0 @@
-<x-page title="TextFilter">
-
-<x-extendby :href="route('moonshine.page', 'fields-text')">
-    Text
-</x-extendby>
-
-<x-code language="php">
-use MoonShine\Filters\TextFilter;
-
-//...
-
-public function filters(): array
-{
-    return [
-        TextFilter::make('Title')
-    ];
-}
-
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/filter_text.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/filter_text_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/home.blade.php b/resources/views/pages/en/home.blade.php
deleted file mode 100644
index 76898a1e..00000000
--- a/resources/views/pages/en/home.blade.php
+++ /dev/null
@@ -1,28 +0,0 @@
-<x-page title="MoonShine">
-    <x-image theme="light" src="{{ asset('moon-promo.svg') }}"></x-image>
-    <x-image theme="dark" src="{{ asset('moon-promo-dark.svg') }}"></x-image>
-
-    <x-sub-title>Hello Laravel user!</x-sub-title>
-
-     <x-p>
-         Welcome to the open-source project dedicated to the "MoonShine" admin panel.
-     </x-p>
-     <x-p>
-         I've been working on it for several years and have used it on dozens of small projects constantly tweaking it.
-     </x-p>
-     <x-p>
-         What does moonshine mean? It's not exactly "moonlight" - my idea is the "moonshine" concept.
-         The term means the independent production of a drink in illegal conditions under the cover of the night :)
-         So I developed this admin panel at night in my free time under the moonlight ;)
-     </x-p>
-     <x-p>
-         Everything is already ready for use in your projects,
-         documentation has been created describing the installation, configuration and features.
-     </x-p>
-     <x-p class="font-bold">
-         I invite interested users to use and develop Moonshine together.
-     </x-p>
-
-    <x-image theme="light" src="{{ asset('screenshots/main.png') }}"></x-image>
-    <x-image theme="dark" src="{{ asset('screenshots/main_dark.png') }}"></x-image>
-</x-page>
diff --git a/resources/views/pages/en/icons/heroicons.blade.php b/resources/views/pages/en/icons/heroicons.blade.php
deleted file mode 100644
index de8eba9e..00000000
--- a/resources/views/pages/en/icons/heroicons.blade.php
+++ /dev/null
@@ -1,37 +0,0 @@
-<x-page title="Heroicons" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#solid', 'label' => 'Solid'],
-        ['url' => '#outline', 'label' => 'Outline']
-    ]
-]">
-
-<x-p>
-    In addition to the standard icons, you can find preinstalled
-    icons from the <x-link link="https://heroicons.com" target="_blank">Heroicons</x-link> collection
-    (<b>Solid</b> set is the default one, plus <b>Outline</b>) in the <code>resources/views/vendor/moonshine/shared/icons/heroicons</code> folder.
-    You can use them wherever you use the <code>icon()</code> method
-</x-p>
-
-<x-sub-title id="solid">Solid</x-sub-title>
-
-<x-code language="php">
-    ->icon('heroicons.academic-cap') // [tl! focus]
-</x-code>
-
-<x-icon-list
-    pattern="../vendor/moonshine/moonshine/resources/views/ui/icons/heroicons/*.blade.php"
-    prefix="heroicons."
-/>
-
-<x-sub-title id="outline">Outline</x-sub-title>
-
-<x-code language="php">
-    ->icon('heroicons.outline.academic-cap') // [tl! focus]
-</x-code>
-
-<x-icon-list
-    pattern="../vendor/moonshine/moonshine/resources/views/ui/icons/heroicons/outline/*.blade.php"
-    prefix="heroicons.outline."
-/>
-
-</x-page>
diff --git a/resources/views/pages/en/icons/index.blade.php b/resources/views/pages/en/icons/index.blade.php
deleted file mode 100644
index 25d4c877..00000000
--- a/resources/views/pages/en/icons/index.blade.php
+++ /dev/null
@@ -1,31 +0,0 @@
-<x-page title="Icons" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#system', 'label' => 'System icons'],
-        ['url' => '#custom', 'label' => 'Custom icons']
-    ]
-]">
-
-<x-p>
-    For all entities that have the <code>icon()</code> method,
-    you can use one of the proposed icon sets or create your own set
-</x-p>
-
-<x-sub-title id="system">System icons</x-sub-title>
-
-<x-code language="php">
-    ->icon('add') // [tl! focus]
-</x-code>
-
-<x-icon-list
-    pattern="../vendor/moonshine/moonshine/resources/views/ui/icons/*.blade.php"
-/>
-
-<x-sub-title id="custom">Custom icons</x-sub-title>
-
-<x-p>
-    You can also create a blade file with your custom icon. To do this you have to create a blade file in
-    <code>resources/views/vendor/moonshine/shared/icons</code> (e.g. - my-icon.blade.php) containing the icon image inside (e.g. svg code)
-    and then specify the <code>icon('my-icon')</code>
-</x-p>
-
-</x-page>
diff --git a/resources/views/pages/en/installation.blade.php b/resources/views/pages/en/installation.blade.php
deleted file mode 100644
index 7c6c690e..00000000
--- a/resources/views/pages/en/installation.blade.php
+++ /dev/null
@@ -1,99 +0,0 @@
-<x-page
-    title="Installation"
-    :sectionMenu="[
-        'Sections' => [
-            ['url' => '#requirements', 'label' => 'Requirements'],
-            ['url' => '#composer', 'label' => 'Composer'],
-            ['url' => '#install', 'label' => 'Installation'],
-            ['url' => '#config', 'label' => 'Configuration'],
-        ]
-    ]"
->
-
-<x-sub-title id="requirements">Requirements</x-sub-title>
-
-<x-p>
-     To use MoonShine, the following requirements must be met prior to installation:
-</x-p>
-
-<x-ul :items="['php >=8.0', 'laravel >= 9.0', 'composer']"></x-ul>
-<x-sub-title id="composer" hashtag="1">Composer</x-sub-title>
-
-<x-code language="shell">
-    composer require moonshine/moonshine:2.0.0.alpha.1
-</x-code>
-
-<x-sub-title id="install" hashtag="2">Installation</x-sub-title>
-
-<x-code language="shell">
-    php artisan moonshine:install
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    This command will add <code>config/moonshine.php</code> with the basic settings.
-    <x-link link="{{ route('moonshine.page', 'configuration') }}">More about the config file</x-link>
-</x-moonshine::alert>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    A directory containing the admin panel and resources will also be added - <code>app/MoonShine</code>.
-    <x-link link="{{ route('moonshine.page', 'resources-index') }}">More about Resources</x-link>
-</x-moonshine::alert>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-     It will also add MoonShineServiceProvider <code>App\Providers\MoonShineServiceProvider</code> where you need to register resources.
-     <x-link link="{{ route('moonshine.page', 'resources-index') }}">More about Resources</x-link>
-</x-moonshine::alert>
-
-<x-sub-title id="admin" hashtag="3">
-    Create an Administrator
-</x-sub-title>
-
-<x-code language="shell">
-    php artisan moonshine:user
-</x-code>
-
-<x-sub-title id="config" hashtag="4">
-    Resource registration and menu configuration
-</x-sub-title>
-
-<x-p>
-    To register new resources in the MoonShine and configure a menu, we need <code>app/Providers/MoonShineServiceProvider.php</code>
-</x-p>
-
-<x-code language="php">
-namespace App\Providers;
-
-use Illuminate\Support\ServiceProvider;
-use MoonShine\MoonShine;
-use MoonShine\Menu\MenuItem;
-use MoonShine\Resources\MoonShineUserResource;
-
-class MoonShineServiceProvider extends ServiceProvider
-{
-    public function boot(): void
-    {
-        // [tl! focus:start]
-        app(MoonShine::class)->menu([
-            MenuItem::make('Admins', new MoonShineUserResource()),
-        ]);
-        // [tl! focus:end]
-    }
-}
-</x-code>
-
-<x-p>
-    In this example, we have added a menu item with panel admins.
-    <x-link link="{{ route('moonshine.page', 'advanced-menu') }}">More about Menu</x-link>
-</x-p>
-
-<x-p>
-    Great! Now you can create and register sections of the future admin panel and proceed with the real work!
-    But don't forget to read the documentation all the way through!
-</x-p>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    By default, the admin panel is accessed by url <code>/moonshine</code>. You can change the url in
-    <x-link link="{{ route('moonshine.page', 'configuration') }}">config file</x-link>.
-</x-moonshine::alert>
-
-</x-page>
diff --git a/resources/views/pages/en/metrics/donut_chart.blade.php b/resources/views/pages/en/metrics/donut_chart.blade.php
deleted file mode 100644
index 4c9034e6..00000000
--- a/resources/views/pages/en/metrics/donut_chart.blade.php
+++ /dev/null
@@ -1,31 +0,0 @@
-<x-page title="DonutChart">
-
-<x-p>
-    Provides the ability to create a donut chart for metric
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Metrics\DonutChartMetric;
-
-class PostResource extends Resource
-{
-    //...
-
-    public function metrics(): array // [tl! focus:start]
-    {
-        return [
-            DonutChartMetric::make('Subscribers')
-                ->values(['CutCode' => 10000, 'Apple' => 9999]),
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/metrics_donut_chart.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/metrics_donut_chart_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/metrics/index.blade.php b/resources/views/pages/en/metrics/index.blade.php
deleted file mode 100644
index 33a266ea..00000000
--- a/resources/views/pages/en/metrics/index.blade.php
+++ /dev/null
@@ -1,16 +0,0 @@
-<x-page title="Metrics">
-
-<x-p>
-    These blocks are intended for displaying statistics
-</x-p>
-
-<x-p>
-    You can show them on the <x-link link="{{ route('moonshine.page', 'advanced-dashboard') }}">admin panel</x-link> home page
-    and in every individual <x-link link="{{ route('moonshine.page', 'resources-index') }}">resource</x-link> as well
-</x-p>
-
-<x-p>
-    Metrics are also provided with
-    <x-link link="{{ route('moonshine.page', 'decorations-layout#grid-column') }}">Layout (columnSpan)</x-link> decorator features
-</x-p>
-</x-page>
diff --git a/resources/views/pages/en/metrics/line_chart.blade.php b/resources/views/pages/en/metrics/line_chart.blade.php
deleted file mode 100644
index 0872fb56..00000000
--- a/resources/views/pages/en/metrics/line_chart.blade.php
+++ /dev/null
@@ -1,99 +0,0 @@
-<x-page title="LineChart">
-
-<x-p>
-    Provides the ability to create a line chart for metric
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Metrics\LineChartMetric;
-
-class PostResource extends Resource
-{
-    //...
-
-    public function metrics(): array // [tl! focus:start]
-    {
-        return [
-            LineChartMetric::make('Orders')
-                ->line([
-                    'Profit' => Order::query()
-                        ->selectRaw('SUM(price) as sum, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
-                        ->groupBy('date')
-                        ->pluck('sum','date')
-                        ->toArray()
-                ])
-                ->line([
-                    'Avg' => Order::query()
-                        ->selectRaw('AVG(price) as avg, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
-                        ->groupBy('date')
-                        ->pluck('avg','date')
-                        ->toArray()
-                ], '#EC4176'),
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-p>
-    or using one <code>line</code> method
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Metrics\LineChartMetric;
-
-class PostResource extends Resource
-{
-    //...
-
-    public function metrics(): array // [tl! focus:start]
-    {
-        return [
-            LineChartMetric::make('Orders')
-                ->line([
-                    'Profit' => Order::query()
-                        ->selectRaw('SUM(price) as sum, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
-                        ->groupBy('date')
-                        ->pluck('sum','date')
-                        ->toArray(),
-                    'Avg' => Order::query()
-                        ->selectRaw('AVG(price) as avg, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
-                        ->groupBy('date')
-                        ->pluck('avg','date')
-                        ->toArray()
-                ],[
-                    'red', 'blue'
-                ])
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/metrics_line_chart.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/metrics_line_chart_dark.png') }}"></x-image>
-
-<x-moonshine::alert type="default" icon="heroicons.book-open">
-    By default, LineChart graphics sort keys in ascending order.
-    This feature can be used with the usual <code>withoutSortKeys()</code> method.
-</x-moonshine::alert>
-
-<x-code language="php">
-LineChartMetric::make('Orders')
-    ->line([
-        'Profit' => Order::query()
-            ->selectRaw('SUM(price) as sum, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
-            ->groupBy('date')
-            ->pluck('sum','date')
-            ->toArray()
-    ])
-    ->withoutSortKeys(), // [tl! focus]
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/metrics/value.blade.php b/resources/views/pages/en/metrics/value.blade.php
deleted file mode 100644
index ce30ff2d..00000000
--- a/resources/views/pages/en/metrics/value.blade.php
+++ /dev/null
@@ -1,89 +0,0 @@
-<x-page title="Value">
-
-<x-p>
-    Displays a simple value, such as how many specific records a table contains
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Metrics\ValueMetric;
-
-class PostResource extends Resource
-{
-    //...
-
-    public function metrics(): array // [tl! focus:start]
-    {
-        return [
-            ValueMetric::make('Completed orders')
-                ->value(Orders::completed()->count())
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/metrics.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/metrics_dark.png') }}"></x-image>
-
-<x-p>
-    You can also display a value as a goal progress indicator
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Metrics\ValueMetric;
-
-class PostResource extends Resource
-{
-    //...
-
-    public function metrics(): array // [tl! focus:start]
-    {
-        return [
-            ValueMetric::make('Open orders left')
-                ->value(Orders::completed()->count())
-                ->progress(200) // Ultimate goal
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/metrics_value_progress.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/metrics_value_progress_dark.png') }}"></x-image>
-
-<x-p>
-    You can add formatting, prefix, and suffix to the output value
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Metrics\ValueMetric;
-
-class PostResource extends Resource
-{
-    //...
-
-    public function metrics(): array // [tl! focus:start]
-    {
-        return [
-            ValueMetric::make('Revenue')
-                ->value(Orders::completed()->sum('price'))
-                ->valueFormat('for today {value} rub.')
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/metrics_value_format.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/metrics_value_format_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/packages.blade.php b/resources/views/pages/en/packages.blade.php
deleted file mode 100644
index ca325aff..00000000
--- a/resources/views/pages/en/packages.blade.php
+++ /dev/null
@@ -1,3 +0,0 @@
-<x-page title="Packages" :sectionMenu="null">
-    @include('packages')
-</x-page>
diff --git a/resources/views/pages/en/releases.blade.php b/resources/views/pages/en/releases.blade.php
deleted file mode 100644
index e57a14e4..00000000
--- a/resources/views/pages/en/releases.blade.php
+++ /dev/null
@@ -1,272 +0,0 @@
-<x-page title="Updates" :sectionMenu="null">
-<ul class="tree-list">
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.50.0">v1.50.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-				<li>New unique design</li>
-				<li>A new approach to grid customization (Grid, Grid Column, Flex)</li>
-				<li>An option to disable authentication</li>
-				<li>Changing localization</li>
-				<li>Improvements for the decorator interface</li>
-				<li>Component approach for blade</li>
-				<li>Text Dashboard block</li>
-				<li>Improvements for custom pages</li>
-                <li>New onlySelected mode for BelongsToMany</li>
-				<li>Laravel file manager is excluded from the package</li>
-				<li>and much more ...</li>
-            </ul>
-        </div>
-    </li>
-
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.27.0">v1.27.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-                <li>MorphTo,MorphToMany fields</li>
-                <li>Detail page</li>
-            </ul>
-        </div>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.26.0">v1.26.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-                <li>Collapse decoration</li>
-                <li>Design fixes</li>
-            </ul>
-        </div>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.25.0">v1.25.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-                <li>Resource query tags</li>
-                <li>NoInput field</li>
-                <li>Fields fullWidth method</li>
-                <li>Form components</li>
-                <li>User permissions</li>
-                <li>Resource show action</li>
-            </ul>
-        </div>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.24.0">v1.24.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-                <li>FormActions</li>
-                <li>FieldContainer</li>
-            </ul>
-        </div>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.23.0">v1.23.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-                <li>New decoration added - Block, Flex, Button</li>
-                <li>Changed structure Tabs</li>
-            </ul>
-        </div>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.22.0">v1.22.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-                <li>Added Dashboard block - ResourcePreview</li>
-                <li>Fixed select mode for BelongsToMany</li>
-            </ul>
-        </div>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.21.0">v1.21.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-                <li>ResourceMode for HasOne/HasMany fields</li>
-                <li>Precognition</li>
-                <li>Enabling adding and editing content in modal windows</li>
-            </ul>
-        </div>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.20.0">v1.20.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-                <li>Added notifications</li>
-                <li>Import</li>
-				<li>Import and Export Queues</li>
-				<li>Storage disk and directory for import and export</li>
-				<li>Arbitrary Views</li>
-				<li>AddLink method with empty parameter</li>
-				<li>phpoffice/phpspreadsheet package was replaced with a lightweight and efficient rap2hpoutre/fast-excel</li>
-            </ul>
-        </div>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.19.0">v1.19.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-				 <li>Login via social networks based on the Socialite login</li>
-                 <li>withTime method for the Date field</li>
-                 <li>History of changes in resources made by user (to keep track of the author and subject of amendments)</li>
-                 <li>Fulltext search</li>
-            </ul>
-        </div>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.18.0">v1.18.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-				 <li>canSee method for fields and filters</li>
-                 <li>ValuesQuery method for Relationship fields</li>
-                 <li>Fix attributes for Json(KeyValue)</li>
-            </ul>
-        </div>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.17.0">v1.17.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-                <li>Subheader for resources</li>
-            </ul>
-        </div>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.16.0">v1.16.0</x-moonshine::link-button>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.15.0">v1.15.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-                <li>New CKEditor field</li>
-                <li>New Quill field</li>
-                <li>New Translatable field to work with <x-moonshine::link-button href="https://github.com/spatie/laravel-translatable">Laravel-translatable</x-moonshine::link-button> made by
-                     <x-moonshine::link-button href="https://spatie.be/open-source">Spatie</x-moonshine::link-button></li>
-                <li>Labels for menu items</li>
-                <li>onlyCount method for the BelongsToMany field</li>
-                <li>ShowOnUpdateForm/showOnCreateForm methods for fields</li>
-                <li>The autoUpdate method for the "Switch" field that enables/disables the option to change the field on the main page</li>
-                <li>The addLink method for adding a hint link to a field</li>
-                <li>Custom bulk actions</li>
-                <li>Custom styles for rows and cells of the table for displaying data</li>
-                <li>Profile page</li>
-                <li>Custom pages</li>
-            </ul>
-        </div>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.14.0">v1.14.0</x-moonshine::link-button>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.13.0">v1.13.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-                <li>New MediaLibrary field to work with <x-moonshine::link-button href="https://github.com/spatie/laravel-medialibrary">Laravel-medialibrary</x-moonshine::link-button> made by
-                     <x-moonshine::link-button href="https://spatie.be/open-source">Spatie</x-moonshine::link-button></li>
-            </ul>
-        </div>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.12.0">v1.12.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-                <li>BeforeSave and afterSave events for fields</li>
-            </ul>
-        </div>
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.11.0">v1.11.0</x-moonshine::link-button>
-
-    </li>
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.10.0">v1.10.0</x-moonshine::link-button>
-
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-                <li>New parameter: config/moonshine.php</li>
-            </ul>
-        </div>
-    </li>
-
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.9.0">v1.9.0</x-moonshine::link-button>
-    </li>
-
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.8.0">v1.8.0</x-moonshine::link-button>
-    </li>
-
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.7.0">v1.7.0</x-moonshine::link-button>
-    </li>
-
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.6.0">v1.6.0</x-moonshine::link-button>
-    </li>
-
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.5.0">v1.5.0</x-moonshine::link-button>
-        <div class="">
-            <div class="font-bold">Changes</div>
-            <ul class="list-decimal">
-                 <li>Simplified installation. Everything is wrapped in the artisan moonshine:install command</li>
-                 <li>New config/moonshine.php</li>
-                 <li>App/MoonShine/Controllers directory removed</li>
-                 <li>Changing the resource base class: MoonShine\Resources\BaseResource -> MoonShine\Resources\Resource</li>
-                 <li>Dashboard.php added to the main app/MoonShine directory to customize the admin panel</li>
-            </ul>
-        </div>
-    </li>
-
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.4.0">v1.4.0</x-moonshine::link-button>
-    </li>
-
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.3.0">v1.3.0</x-moonshine::link-button>
-    </li>
-
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.2.0">v1.2.0</x-moonshine::link-button>
-    </li>
-
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.1.0">v1.1.0</x-moonshine::link-button>
-    </li>
-
-    <li class="my-2">
-        <x-moonshine::link-button href="https://github.com/moonshine-software/moonshine/releases/tag/1.0.0">v1.0.0</x-moonshine::link-button>
-    </li>
-</ul>
-<div class="my-4"></div>
-</x-page>
diff --git a/resources/views/pages/en/resources/actions.blade.php b/resources/views/pages/en/resources/actions.blade.php
deleted file mode 100644
index 8477bff3..00000000
--- a/resources/views/pages/en/resources/actions.blade.php
+++ /dev/null
@@ -1,54 +0,0 @@
-<x-page title="Action" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#view', 'label' => 'Display method'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    Often it is necessary to do something with the list of the section and "Actions" serve for this purpose.
-    At the moment, there is only one Action class in MoonShine, which is responsible for exporting data,
-    but actions could be extended and you can easily write your own.
-</x-p>
-
-<x-p>
-    You can simply return all the necessary actions in the <code>actions</code> method which returns an array.
-    And we will talk about actions structure in the <x-link link="{{ route('moonshine.page', 'actions-index') }}">"Actions"</x-link> section.
-</x-p>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    If the method is absent or returns an empty array, then the actions will not be displayed
-</x-moonshine::alert>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Models\MoonshineUser;
-use MoonShine\Actions\ExportAction; // [tl! focus]
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class;
-
-    public static string $title = 'Articles';
-    //...
-
-    public function actions(): array // [tl! focus:start]
-    {
-        return [
-            ExportAction::make('Export')
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/export.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/export_dark.png') }}"></x-image>
-
-@include('pages.en.resources.shared.actions_view', ['action' => 'ExportAction'])
-
-</x-page>
diff --git a/resources/views/pages/en/resources/active_actions.blade.php b/resources/views/pages/en/resources/active_actions.blade.php
deleted file mode 100644
index 514fe339..00000000
--- a/resources/views/pages/en/resources/active_actions.blade.php
+++ /dev/null
@@ -1,55 +0,0 @@
-<x-page title="Available sections" :sectionMenu="$sectionMenu ?? null">
-
-<x-p>
-    Quite often you need to create a resource with the disabled delete
-    or add or edit section. And we are not talking about authorization here, but about the global exclusion of these sections.
-    This could be done very easy by using the <code>activeActions</code> property in the resource
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class;
-
-    public static string $title = 'Articles';
-
-    public static array $activeActions = ['create', 'show', 'edit', 'delete']; // [tl! focus]
-    //...
-}
-</x-code>
-
-<x-p>Just eliminate the needless one</x-p>
-
-<x-code language="php">
-    public static array $activeActions = ['create']; // [tl! focus]
-</x-code>
-
-<x-p>You can also use the <code>getActiveActions()</code> method and set your own logic for the available sections</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class;
-
-    public static string $title = 'Articles';
-
-    public static array $activeActions = ['create', 'show', 'edit']; // [tl! focus]
-
-    //...
-
-    public function getActiveActions(): array // [tl! focus:start]
-    {
-        if (auth()->id() === $this->getItem()?->author_id) {
-            return array_merge(static::$activeActions, ['delete']);
-        }
-
-        return static::$activeActions;
-    } // [tl! focus:end]
-}
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/resources/bulk_actions.blade.php b/resources/views/pages/en/resources/bulk_actions.blade.php
deleted file mode 100644
index 3289cd5a..00000000
--- a/resources/views/pages/en/resources/bulk_actions.blade.php
+++ /dev/null
@@ -1,48 +0,0 @@
-<x-page title="Mass actions" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#view', 'label' => 'Display method'],
-        ['url' => '#confirm', 'label' => 'Confirm the action'],
-    ]
-]">
-
-<x-p>
-    By default, the table in the MoonShine panel contains only 1 mass action for the elements - deletion.
-    But you can also add your own custom bulk actions
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Models\MoonshineUser;
-use MoonShine\BulkActions\BulkAction; // [tl! focus]
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class;
-
-    public static string $title = 'Articles';
-    //...
-
-    public function bulkActions(): array // [tl! focus:start]
-    {
-        return [
-            BulkAction::make('Deactivation', function (Model $item) {
-                $item->update(['active' => false]);
-            }, 'Deactivated')->icon('app')
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<p>
-    The first argument is the name of the action.
-    The second argument is a callback with the current element parameter.
-    The third argument is the message that will be displayed after the execution of the action.
-</p>
-
-@include('pages.en.resources.shared.actions_view', ['action' => 'BulkAction'])
-@include('pages.en.resources.shared.actions_confirm', ['action' => 'BulkAction'])
-
-</x-page>
diff --git a/resources/views/pages/en/resources/components.blade.php b/resources/views/pages/en/resources/components.blade.php
deleted file mode 100644
index fc312ccd..00000000
--- a/resources/views/pages/en/resources/components.blade.php
+++ /dev/null
@@ -1,133 +0,0 @@
-<x-page
-    title="Components"
-    :sectionMenu="[
-        'Sections' => [
-            ['url' => '#basics', 'label' => 'Basics'],
-            ['url' => '#permissions', 'label' => 'Permissions'],
-            ['url' => '#changelog', 'label' => 'Change log'],
-        ]
-    ]
-">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    You can add your own components based on the <code>MoonShine\IndexComponent</code>, <code>MoonShine\FormComponent</code>
-    or <code>MoonShine\DetailComponent</code> abstract classes to extend the functionality,
-    they will be displayed below the main form or below detailed information respectively
-</x-p>
-
-<x-p>
-    All custom components must be registered in the <code>components()</code> method
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-class ArticleResource extends Resource
-{
-    //...
-
-    public function components(): array // [tl! focus:2]
-    {
-        return [
-            // ...
-        ];
-    } // [tl! focus:-1]
-
-    //...
-}
-</x-code>
-
-<x-sub-title id="permissions">Permissions</x-sub-title>
-
-<x-p>
-    Example of adding a <code>PermissionFormComponent</code> component
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\FormComponents\PermissionFormComponent; // [tl! focus]
-use MoonShine\Models\MoonshineUserRole;
-use MoonShine\Resources\Resource;
-
-class MoonShineUserResource extends Resource
-{
-    //...
-
-    public function components(): array
-    {
-        return [
-            PermissionFormComponent::make('Permissions') // [tl! focus]
-                ->canSee(fn() => auth()->user()->moonshine_user_role_id === MoonshineUserRole::DEFAULT_ROLE_ID)
-        ];
-    }
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/form_components.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/form_components_dark.png') }}"></x-image>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    If you use your model for authentication,
-    then you need to add the <code>MoonShine\Traits\Models\HasMoonShinePermissions</code> trait to it
-</x-moonshine::alert>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    If you use your resource with admin output,
-    you need to add the <code>MoonShine\Traits\Resource\WithUserPermissions</code> trait to the resource
-</x-moonshine::alert>
-
-<x-sub-title id="changelog">Change log</x-sub-title>
-
-<x-p>
-    To display the log of edits in the admin panel based on the user you must add
-    the <code>MoonShine\Traits\Models\HasMoonShineChangeLog</code> trait to the model being used in the resource
-</x-p>
-
-<x-code language="php">
-namespace App\Models;
-
-use Illuminate\Database\Eloquent\Model;
-use MoonShine\Traits\Models\HasMoonShineChangeLog; // [tl! focus]
-
-class Article extends Model
-{
-    use HasMoonShineChangeLog; // [tl! focus]
-
-    //...
-}
-</x-code>
-
-<x-p>
-    And also add a component in the <code>ChangeLogFormComponent</code> resource
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\FormComponents\ChangeLogFormComponent; // [tl! focus]
-use MoonShine\Models\MoonshineUserRole;
-use MoonShine\Resources\Resource;
-
-class ArticleResource extends Resource
-{
-    // ...
-    public function components(): array
-    {
-        return [
-            ChangeLogFormComponent::make('Change log') // [tl! focus]
-                ->canSee(fn() => auth()->user()->moonshine_user_role_id === MoonshineUserRole::DEFAULT_ROLE_ID),
-        ];
-    }
-    // ...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/changelogs.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/changelogs_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/resources/fields.blade.php b/resources/views/pages/en/resources/fields.blade.php
deleted file mode 100644
index 93169f67..00000000
--- a/resources/views/pages/en/resources/fields.blade.php
+++ /dev/null
@@ -1,49 +0,0 @@
-<x-page title="Fields" :sectionMenu="$sectionMenu ?? null">
-
-<x-p>
-    Fields in most cases refer to table fields from the database. Within CRUD they will be displayed
-    with a list on the main page of the section (resource) and on the page for creating and editing records.
-    There are many types of fields in the MoonShine admin panel to cover all possible requirements!
-    They also cover all possible relationships in Laravel and are named in the same way as relationship methods for convenience:
-    <code>BelongsTo</code>, <code>BelongsToMany</code>, <code>HasOne</code>, <code>HasMany</code>,
-    <code>HasOneThrough</code>, <code>HasManyThrough</code>, <code>MorphOne</code>, <code>MorphMany</code>
-</x-p>
-
-<x-p>
-    Adding new fields is extremely easy! You can simply return all the required fields in the <code>fields</code> method which returns an array.
-    And we will talk about fields structure in the <x-link link="{{ route('moonshine.page', 'fields-index') }}">"Fields"</x-link> section.
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Models\MoonshineUser;
-use MoonShine\Fields\ID; // [tl! focus]
-use MoonShine\Fields\Text; // [tl! focus]
-use MoonShine\Decorations\Block;
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class;
-
-    public static string $title = 'Articles';
-    //...
-
-    public function fields(): array // [tl! focus:start]
-    {
-        return [
-            Block::make('Block title', [
-                ID::make(),
-                Text::make('header', 'title'),
-            ])
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/form.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/form_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/resources/filters.blade.php b/resources/views/pages/en/resources/filters.blade.php
deleted file mode 100644
index 0472dbe7..00000000
--- a/resources/views/pages/en/resources/filters.blade.php
+++ /dev/null
@@ -1,55 +0,0 @@
-<x-page title="Filters" :sectionMenu="$sectionMenu ?? null">
-
-<x-p>
-    Filters are not much different from fields and inherit their properties and methods!
-    They are displayed on the main page of the section to filter the list of data.
-</x-p>
-
-<x-p>
-    Adding new filters is easy! You can simply return all the necessary filters in the <code>filters</code> method which returns an array.
-    And we will talk about filters structure in the <x-link link="{{ route('moonshine.page', 'filters-index') }}">"Filters"</x-link> section.
-</x-p>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    If the method is absent or returns an empty array, then the filters will not be displayed
-</x-moonshine::alert>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Models\MoonshineUser;
-use MoonShine\Filters\TextFilter; // [tl! focus]
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class;
-
-    public static string $title = 'Articles';
-    //...
-
-    // [tl! focus:start]
-    public function filters(): array
-    {
-        return [
-            TextFilter::make('header', 'title')
-        ];
-    }
-
-    // Don't forget to connect filters to the resource
-    public function actions(): array
-    {
-        return [
-            FiltersAction::make(trans('moonshine::ui.filters')),
-        ];
-    }
-
-    // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/filters.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/filters_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/resources/form_actions.blade.php b/resources/views/pages/en/resources/form_actions.blade.php
deleted file mode 100644
index 1faf37e1..00000000
--- a/resources/views/pages/en/resources/form_actions.blade.php
+++ /dev/null
@@ -1,45 +0,0 @@
-<x-page title="Form Actions" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#view', 'label' => 'Display method'],
-        ['url' => '#confirm', 'label' => 'Confirm the action'],
-    ]
-]">
-
-<x-p>
-    By default, forms in the MoonShine panel contain only 1 action - saving.
-    But you can add your own custom actions
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Models\MoonshineUser;
-use MoonShine\FormActions\FormAction; // [tl! focus]
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class;
-
-    public static string $title = 'Articles';
-    //...
-
-    public function formActions(): array // [tl! focus:start]
-    {
-        return [
-            FormAction::make('Delete', function (Model $item) {
-                $item->delete();
-            }, 'Removed')->icon('delete')
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/form_actions.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/form_actions_dark.png') }}"></x-image>
-
-@include('pages.en.resources.shared.actions_view', ['action' => 'FormAction'])
-@include('pages.en.resources.shared.actions_confirm', ['action' => 'FormAction'])
-
-</x-page>
diff --git a/resources/views/pages/en/resources/index.blade.php b/resources/views/pages/en/resources/index.blade.php
deleted file mode 100644
index 4220fcee..00000000
--- a/resources/views/pages/en/resources/index.blade.php
+++ /dev/null
@@ -1,370 +0,0 @@
-<x-page
-    title="Basics"
-    :sectionMenu="[
-        'Sections' => [
-            ['url' => '#basics', 'label' => 'Basics'],
-            ['url' => '#variables', 'label' => 'Main features'],
-            ['url' => '#create', 'label' => 'Creating'],
-            ['url' => '#define', 'label' => 'Announcement'],
-            ['url' => '#item', 'label' => 'Current item/model'],
-            ['url' => '#modal', 'label' => 'Modal windows'],
-            ['url' => '#after', 'label' => 'Route after save'],
-            ['url' => '#simple-pagination', 'label' => 'Simple pagination'],
-            ['url' => '#disable-pagination', 'label' => 'Disable pagination'],
-            ['url' => '#views', 'label' => 'Customization of views'],
-            ['url' => '#precognition', 'label' => 'Precognition'],
-        ]
-    ]
-">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    What is an administrative panel? Basically, these are partitions based on data from the database, based on eloquent models.
-</x-p>
-
-<x-p>
-    MoonShine is based on standard Laravel resource controllers and resource routes
-
-    <x-code language="shell">
-        php artisan make:controller Controller --resource
-    </x-code>
-
-    <x-code language="php">
-        Route::resources('resources', Controller::class);
-    </x-code>
-
-    But system will generate and declare them independently.
-</x-p>
-
-<x-p>
-    Therefore, the MoonShine resources (admin panel sections) are based on the eloquent model.
-</x-p>
-
-<x-sub-title id="create">Creating a section in the admin panel</x-sub-title>
-
-<x-code language="shell">
-    php artisan moonshine:resource Post
-</x-code>
-
-<x-p>
-    This will create a Resource class that will be the basis of the new section in the panel.
-    By default, it is located in the <code>app/MoonShine/Resources/PostResource</code> directory.
-    And it will be automatically bound to the <code>app/Models/Post</code> model.
-    The section title will keep the Posts name
-</x-p>
-
-<x-p>
-    You can change the model binding and section title along with the command
-
-    <x-code language="shell">
-        php artisan moonshine:resource Post --model=CustomPost --title="Articles"
-    </x-code>
-
-    <x-code language="shell">
-        php artisan moonshine:resource Post --model="App\Models\CustomPost" --title="Articles"
-    </x-code>
-</x-p>
-
-<x-sub-title id="variables">Main properties of the section</x-sub-title>
-<x-p>
-    The main parameters of the resource that could be changed in order to customize its work
-</x-p>
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Models\MoonshineUser;
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class; // Model [tl! focus]
-
-    public static string $title = 'Articles'; // Section name [tl! focus]
-
-    public static string $subTitle = 'Article Management'; // Text under section heading [tl! focus]
-
-    public static array $with = ['category']; // Eager load [tl! focus]
-
-    public static bool $withPolicy = false; // Authorization [tl! focus]
-
-    public static string $orderField = 'id'; // Default sort field [tl! focus]
-
-    public static string $orderType = 'DESC'; // Default sort type [tl! focus]
-
-    public static int $itemsPerPage = 25; // Number of items per page [tl! focus]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/resource_paginate.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/resource_paginate_dark.png') }}"></x-image>
-
-<x-sub-title id="define">Declaring a partition in the system</x-sub-title>
-
-<x-p>
-    New resources are added to the system in the <code>service provider</code> using the singleton class
-    <code>MoonShine\MoonShine</code>.
-</x-p>
-
-<x-code language="php">
-namespace App\Providers;
-
-use App\MoonShine\Resources\PostResource; // [tl! focus]
-
-class MoonShineServiceProvider extends ServiceProvider
-{
-    //...
-
-    public function boot()
-    {
-        app(MoonShine::class)->resources([
-            new PostResource(),
-        ])  // [tl! focus: -2]
-    }
-</x-code>
-
-<x-p>
-    To add a resource link to the navigation menu, the resource can be registered using the <code>menu()</code> method.
-</x-p>
-
-<x-code language="php">
-namespace App\Providers;
-
-use App\MoonShine\Resources\PostResource; // [tl! focus]
-use Illuminate\Support\ServiceProvider;
-use MoonShine\Menu\MenuItem; // [tl! focus]
-use MoonShine\MoonShine; // [tl! focus]
-use MoonShine\Resources\MoonShineUserResource;
-use MoonShine\Resources\MoonShineUserRoleResource;
-
-class MoonShineServiceProvider extends ServiceProvider
-{
-    //...
-
-    public function boot()
-    {
-        app(MoonShine::class)->menu([ // [tl! focus]
-            MenuItem::make('Admins', new MoonShineUserResource()),
-            MenuItem::make('Roles', new MoonShineUserRoleResource()),
-            MenuItem::make('Posts', new PostResource()), // [tl! focus]
-        ]); // [tl! focus]
-    }
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/menu.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/menu_dark.png') }}"></x-image>
-
-<x-moonshine::alert type="default" icon="heroicons.book-open">
-    For advanced settings, see <x-link :link="route('moonshine.page', 'advanced-menu')" ><code>Digging Deeper > Menu</code></x-link>.
-</x-moonshine::alert>
-
-<x-sub-title id="item">Current item/model</x-sub-title>
-
-<x-p>
-    In the resource you have access to the current element and model via the relevant methods.
-</x-p>
-
-<x-code language="php">
-    $this->getItem();
-</x-code>
-
-<x-code language="php">
-    $this->getModel();
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    If the element does not yet exist (action create), then the <code>getItem()</code> method will return <code>NULL</code>.
-</x-moonshine::alert>
-
-<x-sub-title id="modal">Modal windows</x-sub-title>
-
-<x-p>
-    Ability to add, edit and view entries directly on the list page in a modal window.
-</x-p>
-
-<x-code language="php">
-namespace App\MoonShine\Resources;
-
-use App\Models\Post;
-
-use MoonShine\Resources\Resource;
-
-class PostResource extends Resource
-{
-    public static string $model = Post::class;
-
-    public static string $title = 'Posts';
-
-    protected bool $createInModal = true; // [tl! focus]
-
-    protected bool $editInModal = true; // [tl! focus]
-
-    protected bool $showInModal = true; // [tl! focus]
-
-    // ...
-</x-code>
-
-<x-sub-title id="after">Route after save</x-sub-title>
-
-<x-p>
-    After saving the resource, you can specify which route to go to:
-    the list page, the detail page, or the edit page.
-</x-p>
-
-<x-p>Default <code>index</code></x-p>
-
-<x-code language="php">
-namespace App\MoonShine\Resources;
-
-use App\Models\Post;
-use MoonShine\Resources\Resource;
-
-class PostResource extends Resource
-{
-    public static string $model = Post::class;
-
-    protected string $routeAfterSave = 'index'; // index, show, edit [tl! focus]
-
-    // ...
-}
-</x-code>
-
-<x-sub-title id="simple-pagination">Simple pagination</x-sub-title>
-
-<x-p>
-    If you don't plan to display the total number of pages, use <code>Simple Pagination</code>.
-    This will avoid additional queries on the total number of records in the database.
-</x-p>
-
-<x-code language="php">
-namespace App\MoonShine\Resources;
-
-use App\Models\Post;
-use MoonShine\Resources\Resource;
-
-class PostResource extends Resource
-{
-    public static string $model = Post::class;
-
-    public static bool $simplePaginate = true; // [tl! focus]
-
-    // ...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/resource_simple_paginate.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/resource_simple_paginate_dark.png') }}"></x-image>
-
-<x-sub-title id="disable-pagination">Disable pagination</x-sub-title>
-
-<x-p>
-    If you do not plan to use pagination, then you can turn it off.
-</x-p>
-
-<x-code language="php">
-namespace App\MoonShine\Resources;
-
-use App\Models\Post;
-use MoonShine\Resources\Resource;
-
-class PostResource extends Resource
-{
-    public static string $model = Post::class;
-
-    protected bool $usePagination = false; // [tl! focus]
-
-    // ...
-}
-</x-code>
-
-<x-sub-title id="views">Customization of views</x-sub-title>
-
-<x-p>
-    You can customize the display of the list and form through
-    the properties <code>itemsView</code>, <code>formView</code> and <code>detailView</code>.
-</x-p>
-
-<x-code language="php">
-namespace App\MoonShine\Resources;
-
-use App\Models\Post;
-use MoonShine\Resources\Resource;
-
-class PostResource extends Resource
-{
-    public static string $model = Post::class;
-
-    protected string $itemsView = 'moonshine::crud.shared.table'; // [tl! focus]
-
-    protected string $formView = 'moonshine::crud.shared.form'; // [tl! focus]
-
-    protected string $detailView = 'moonshine::crud.shared.detail-card'; // [tl! focus]
-
-    // ...
-}
-</x-code>
-
-<x-p>
-    Or by overriding the appropriate methods
-</x-p>
-
-<x-code language="php">
-namespace App\MoonShine\Resources;
-
-use App\Models\Post;
-use MoonShine\Resources\Resource;
-
-class PostResource extends Resource
-{
-    public static string $model = Post::class;
-
-    public function itemsView(): string
-    {
-        return $this->itemsView;
-    } // [tl! focus:-3]
-
-    public function formView(): string
-    {
-        return $this->formView;
-    } // [tl! focus:-3]
-
-    public function detailView(): string
-    {
-        return $this->detailView;
-    } // [tl! focus:-3]
-
-    // ...
-}
-</x-code>
-
-<x-sub-title id="precognition">Precognition</x-sub-title>
-
-<x-p>
-    Precognition in Laravel allows you to create a "live" check for your application
-    without having to duplicate validation rules.
-</x-p>
-
-<x-p>
-    In Moonshine, you can use precognition when sending requests to your resource.
-    To do this, set the <code>precognition</code> property to <code>true</code>.
-</x-p>
-
-<x-code language="php">
-namespace App\MoonShine\Resources;
-
-use App\Models\Post;
-use MoonShine\Resources\Resource;
-
-class PostResource extends Resource
-{
-    public static string $model = Post::class;
-
-    protected bool $precognition = true; // [tl! focus]
-
-    // ...
-}
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/resources/item_actions.blade.php b/resources/views/pages/en/resources/item_actions.blade.php
deleted file mode 100644
index 1ad60045..00000000
--- a/resources/views/pages/en/resources/item_actions.blade.php
+++ /dev/null
@@ -1,72 +0,0 @@
-<x-page title="Custom actions" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#register', 'label' => 'Registration'],
-        ['url' => '#condition', 'label' => 'Display condition'],
-        ['url' => '#view', 'label' => 'Display method'],
-        ['url' => '#confirm', 'label' => 'Confirm the action'],
-    ]
-]">
-
-<x-sub-title id="register">Registration</x-sub-title>
-
-<x-p>
-    By default, the table in the MoonShine panel contains only 2 actions for items - edit and delete.
-    But you can also add your own custom actions
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Models\MoonshineUser;
-use MoonShine\ItemActions\ItemAction; // [tl! focus]
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class;
-
-    public static string $title = 'Articles';
-    //...
-
-    public function itemActions(): array // [tl! focus:start]
-    {
-        return [
-            ItemAction::make('Deactivating', function (Model $item) {
-                $item->update(['active' => false]);
-            }, 'Deactivated')->icon('app')
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<p>
-    The first argument is the name of the action.
-    The second argument is the callback with the current item parameter.
-    The third argument - the message that will be displayed after the action is executed
-</p>
-
-<x-sub-title id="condition">Display condition</x-sub-title>
-
-<x-p>
-    Display action by condition
-</x-p>
-
-<x-code language="php">
-...
-public function itemActions(): array
-{
-    return [
-        ItemAction::make('Restore', function (Model $item) {
-            $item->restore();
-        }, 'Retrieved')
-            ->canSee(fn(Model $item) => $item->trashed()) // [tl! focus]
-    ];
-}
-...
-</x-code>
-
-@include('pages.en.resources.shared.actions_view', ['action' => 'ItemAction'])
-@include('pages.en.resources.shared.actions_confirm', ['action' => 'ItemAction'])
-
-</x-page>
diff --git a/resources/views/pages/en/resources/metrics.blade.php b/resources/views/pages/en/resources/metrics.blade.php
deleted file mode 100644
index 0de98cb5..00000000
--- a/resources/views/pages/en/resources/metrics.blade.php
+++ /dev/null
@@ -1,33 +0,0 @@
-<x-page title="Metrics" :sectionMenu="$sectionMenu ?? null">
-
-<x-p>
-    Same as the <x-link link="{{ route('moonshine.page', 'advanced-dashboard') }}">control panel</x-link> you can
-    display <x-link link="{{ route('moonshine.page', 'metrics-index') }}">metrics</x-link> in every resource
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-
-use MoonShine\Metrics\ValueMetric;
-
-class PostResource extends Resource
-{
-    //...
-
-    public function metrics(): array // [tl! focus:start]
-    {
-        return [
-            ValueMetric::make('Completed orders')
-                ->value(Orders::completed()->count())
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/metrics.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/metrics_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/resources/query.blade.php b/resources/views/pages/en/resources/query.blade.php
deleted file mode 100644
index e4d062da..00000000
--- a/resources/views/pages/en/resources/query.blade.php
+++ /dev/null
@@ -1,93 +0,0 @@
-<x-page title="Query" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#filter', 'label' => 'Filter'],
-        ['url' => '#order', 'label' => 'Order'],
-        ['url' => '#scopes', 'label' => 'Scopes'],
-    ]
-]">
-
-<x-sub-title id="filter">Filter</x-sub-title>
-
-<x-p>
-    Quite often you have to filter the output with a list of records from the very start.
-</x-p>
-
-<x-p>
-    In general, you can easily override the query builder in the resource.
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use Illuminate\Contracts\Database\Eloquent\Builder; // [tl! focus]
-
-class PostResource extends Resource
-{
-    //...
-    public function query(): Builder // [tl! focus:start]
-    {
-        return parent::query()
-            ->where('active', true);
-    } // [tl! focus:end]
-    //...
-}
-</x-code>
-
-<x-sub-title id="order">Order</x-sub-title>
-
-<x-p>
-    By overriding the <code>performOrder()</code> method, you can customize the sorting of elements.
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use Illuminate\Contracts\Database\Eloquent\Builder; // [tl! focus]
-
-class PostResource extends Resource
-{
-    //...
-    public function performOrder(Builder $query, string $column, string $direction): Builder // [tl! focus:start]
-    {
-        return $query->orderBy(
-            $column,
-            $direction
-        );
-    } // [tl! focus:end]
-    //...
-}
-</x-code>
-
-<x-sub-title id="scopes">Scopes</x-sub-title>
-
-<x-p>
-    Laravel has a handy scopes functionality that could be used within the MoonShine admin panel.
-</x-p>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    At first, you need to create the scopes required.
-</x-moonshine::alert>
-
-<x-code language="shell">
-php artisan make:scope ActiveUserScope
-</x-code>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use App\Models\Scopes\ActiveUserScope; // [tl! focus]
-
-class PostResource extends Resource
-{
-    //...
-    public function scopes(): array // [tl! focus:start]
-    {
-        return [
-            new ActiveUserScope()
-        ];
-    } // [tl! focus:end]
-    //...
-}
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/resources/query_tags.blade.php b/resources/views/pages/en/resources/query_tags.blade.php
deleted file mode 100644
index ae18b55e..00000000
--- a/resources/views/pages/en/resources/query_tags.blade.php
+++ /dev/null
@@ -1,44 +0,0 @@
-<x-page title="Quick filters (tags)" :sectionMenu="[]">
-
-<x-p>
-    Sometimes you may need to create a set of filters (collection of results)
-    and display it in the listing. Tags have been created for these cases.
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Models\MoonshineUser;
-use MoonShine\QueryTags\QueryTag; // [tl! focus]
-use Illuminate\Contracts\Database\Eloquent\Builder;
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class;
-
-    public static string $title = 'Articles';
-    //...
-
-    public function queryTags(): array // [tl! focus:start]
-    {
-        return [
-            QueryTag::make(
-                'Post with author', // Tag Title
-                fn(Builder $query) => $query->whereNotNull('author_id') // Query builder
-            ),
-
-            QueryTag::make(
-                'Post without an author',
-                fn(Builder $query) => $query->whereNull('author_id')
-            )->icon('users')
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/query_tags.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/query_tags_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/resources/search.blade.php b/resources/views/pages/en/resources/search.blade.php
deleted file mode 100644
index c46ce92e..00000000
--- a/resources/views/pages/en/resources/search.blade.php
+++ /dev/null
@@ -1,79 +0,0 @@
-<x-page title="Search" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#global', 'label' => 'Global search'],
-    ]
-]">
-
-<x-sub-title id="basics">Основы</x-sub-title>
-
-<x-p>
-    Everything is simple here! For a full-text search, you need to specify which fields will be included into the search.
-    To do this, you need to list them in the return array in the <code>search()</code> method
-</x-p>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    If the method is missing or returns an empty array, the search string will not be displayed
-</x-moonshine::alert>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Models\MoonshineUser;
-
-class PostResource extends Resource
-{
-    //...
-
-    public function search(): array // [tl! focus:start]
-    {
-        return ['id', 'title'];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-p>
-    If a fulltext search is required, you must use the <code>MoonShine\Attributes\SearchUsingFullText</code>
-</x-p>
-
-<x-code language="php">
-    namespace MoonShine\Resources;
-
-    use MoonShine\Attributes\SearchUsingFullText; // [tl! focus]
-
-    class PostResource extends Resource
-    {
-    //...
-
-    #[SearchUsingFullText(['title', 'text'])] // [tl! focus]
-    public function search(): array
-    {
-        return ['id'];
-    }
-
-    //...
-    }
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    Don't forget to add the fulltext index
-</x-moonshine::alert>
-
-<x-image theme="light" src="{{ asset('screenshots/search.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/search_dark.png') }}"></x-image>
-
-<x-sub-title id="global">Global search</x-sub-title>
-
-<x-p>
-    To organize a global search, you can use the package
-    <x-link link="https://github.com/lee-to/moonshine-algolia-search" target="_blank">Algolias search for MoonShine</x-link>
-</x-p>
-
-<x-p>
-    This package uses the <code>Algolia</code> search engine, which takes context and query type into account,
-    possible typos, synonyms and word forms, entering a query in different languages and much more.
-</x-p>
-
-</x-page>
diff --git a/resources/views/pages/en/resources/shared/actions_confirm.blade.php b/resources/views/pages/en/resources/shared/actions_confirm.blade.php
deleted file mode 100644
index 45b14f46..00000000
--- a/resources/views/pages/en/resources/shared/actions_confirm.blade.php
+++ /dev/null
@@ -1,78 +0,0 @@
-<x-sub-title id="confirm">Confirm the action</x-sub-title>
-
-<x-p>
-    To confirm the action, you must use the <code>withConfirm</code> method
-</x-p>
-
-<x-code language="php">
-use MoonShine\{!! ($action === 'ExportAction' ||  $action === 'ImportAction') ? 'Action' : $action !!}s\{{ $action }};
-
-//...
-public function {!! ($action === 'ExportAction' ||  $action === 'ImportAction') ? 'action' : str($action)->camel() !!}s(): array
-{
-    return [
-    @if ( $action === 'ExportAction' ||  $action === 'ImportAction')
-    {!! $action !!}::make('{!! str($action)->replace('Action', '') !!}')
-    @else
-    {{ $action }}::make('Deactivation', function (Model $item) {
-            $item->update(['active' => false]);
-        }, 'Deactivated')
-    @endif
-        ->withConfirm() // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/actions_confirm.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/actions_confirm_dark.png') }}"></x-image>
-
-<x-p>
-    The <code>withConfirm()</code> method can be passed the title and text for the modal window, as well as the title
-    for confirmation button
-</x-p>
-
-<x-code language="php">
-use MoonShine\{!! ($action === 'ExportAction' ||  $action === 'ImportAction') ? 'Action' : $action !!}s\{{ $action }};
-
-//...
-public function {!! ($action === 'ExportAction' ||  $action === 'ImportAction') ? 'action' : str($action)->camel() !!}s(): array
-{
-    return [
-    @if ( $action === 'ExportAction' ||  $action === 'ImportAction')
-    {!! $action !!}::make('{!! str($action)->replace('Action', '') !!}')
-    @else
-    {{ $action }}::make('Deactivation', function (Model $item) {
-            $item->update(['active' => false]);
-        }, 'Deactivated')
-    @endif
-        ->withConfirm('Title', 'Modal content', 'Accept') // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-p>
-    The <code>errorMessage()</code> method allows you to set the text of the error message
-</x-p>
-
-<x-code language="php">
-use MoonShine\{!! ($action === 'ExportAction' ||  $action === 'ImportAction') ? 'Action' : $action !!}s\{{ $action }};
-
-//...
-public function {!! ($action === 'ExportAction' ||  $action === 'ImportAction') ? 'action' : str($action)->camel() !!}s(): array
-{
-    return [
-    @if ( $action === 'ExportAction' ||  $action === 'ImportAction')
-    {!! $action !!}::make('{!! str($action)->replace('Action', '') !!}')
-    @else
-    {{ $action }}::make('Deactivation', function (Model $item) {
-            $item->update(['active' => false]);
-        }, 'Deactivated')
-    @endif
-        ->withConfirm('Title', 'Modal content', 'Accept')
-        ->errorMessage('Fail') // [tl! focus]
-    ];
-}
-//...
-</x-code>
diff --git a/resources/views/pages/en/resources/shared/actions_view.blade.php b/resources/views/pages/en/resources/shared/actions_view.blade.php
deleted file mode 100644
index ef2448da..00000000
--- a/resources/views/pages/en/resources/shared/actions_view.blade.php
+++ /dev/null
@@ -1,59 +0,0 @@
-<x-sub-title id="view">Display method</x-sub-title>
-
-<x-p>
-    To display actions as a dropdown list, you can use the <code>showInDropdown</code> method
-</x-p>
-
-<x-code language="php">
-use MoonShine\{!! ($action === 'ExportAction' ||  $action === 'ImportAction') ? 'Action' : $action !!}s\{{ $action }};
-
-//...
-public function {!! ($action === 'ExportAction' ||  $action === 'ImportAction') ? 'action' : str($action)->camel() !!}s(): array
-{
-    return [
-    @if ( $action === 'ExportAction' ||  $action === 'ImportAction')
-    {!! $action !!}::make('{!! str($action)->replace('Action', '') !!}')
-    @else
-    {{ $action }}::make('Deactivation', function (Model $item) {
-            $item->update(['active' => false]);
-        }, 'Deactivated')
-    @endif
-        ->showInDropdown() // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-moonshine::alert type="default" icon="heroicons.information-circle">
-    This display method is used by default
-</x-moonshine::alert>
-
-<x-image theme="light" src="{{ asset('screenshots/actions_dropdown.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/actions_dropdown_dark.png') }}"></x-image>
-
-<x-p>
-    To display actions as a horizontal list, you can use the <code>showInLine</code> method
-</x-p>
-
-<x-code language="php">
-use MoonShine\{!! ($action === 'ExportAction' ||  $action === 'ImportAction') ? 'Action' : $action !!}s\{{ $action }};
-
-//...
-public function {!! ($action === 'ExportAction' ||  $action === 'ImportAction') ? 'action' : str($action)->camel() !!}s(): array
-{
-    return [
-    @if ( $action === 'ExportAction' ||  $action === 'ImportAction')
-    {!! $action !!}::make('{!! str($action)->replace('Action', '') !!}')
-    @else
-    {{ $action }}::make('Deactivation', function (Model $item) {
-            $item->update(['active' => false]);
-        }, 'Deactivated')
-    @endif
-        ->showInLine() // [tl! focus]
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/actions_line.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/actions_line_dark.png') }}"></x-image>
diff --git a/resources/views/pages/en/resources/singleton.blade.php b/resources/views/pages/en/resources/singleton.blade.php
deleted file mode 100644
index 5dc97dd1..00000000
--- a/resources/views/pages/en/resources/singleton.blade.php
+++ /dev/null
@@ -1,52 +0,0 @@
-<x-page title="Singleton" :sectionMenu="$sectionMenu ?? null">
-
-<x-p>
-    A resource for one entry without the ability to list, add and delete! Perfect for resources with settings.
-    Implements singletonResource in Laravel routing.
-</x-p>
-
-<x-p>
-    To use it, you need to implement the getId method specifying the id of the record in the database.
-</x-p>
-
-<x-code language="php">
-// ...
-
-class SettingResource extends SingletonResource
-{
-    public static string $model = Setting::class;
-
-    public static string $title = 'Settings';
-
-    public function getId(): int|string
-    {
-        return 1;
-    }
-// ...
-</x-code>
-
-<x-p>
-    You can create <code>SingletonResource</code> using the artisan command
-</x-p>
-
-<x-code language="shell">
-    php artisan moonshine:resource Setting --singleton
-</x-code>
-
-<x-p>
-    or
-</x-p>
-
-<x-code language="shell">
-    php artisan moonshine:resource Setting --s
-</x-code>
-
-<x-p>
-    with id
-</x-p>
-
-<x-code language="shell">
-    php artisan moonshine:resource Setting --s --id=1
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/resources/table_styles.blade.php b/resources/views/pages/en/resources/table_styles.blade.php
deleted file mode 100644
index 28655c0e..00000000
--- a/resources/views/pages/en/resources/table_styles.blade.php
+++ /dev/null
@@ -1,81 +0,0 @@
-<x-page title="Table styles" :sectionMenu="$sectionMenu ?? null">
-
-<x-p>
-    Using resources you can customize the color for <code>tr</code> and <code>td</code> for tables with data
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class;
-
-    public static string $title = 'Articles';
-    //...
-
-    public function trClass(Model $item, int $index): string // [tl! focus:start]
-    {
-        if($item->id === 1 || $index === 2) {
-            return 'green';
-        }
-
-        return parent::trClass($item, $index);
-    }
-
-    public function tdClass(Model $item, int $index, int $cell): string
-    {
-        if($cell === 6) {
-            return 'red';
-        }
-
-        return parent::tdClass($item, $index, $cell);
-    } // [tl! focus:end]
-    //...
-}
-</x-code>
-
-@include('pages.en.components.shared.colors')
-
-<x-image theme="light" src="{{ asset('screenshots/table_class.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/table_class_dark.png') }}"></x-image>
-
-<x-p>
-    You can also add custom styles
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class;
-
-    public static string $title = 'Articles';
-    //...
-
-    public function trStyles(Model $item, int $index): string // [tl! focus:start]
-    {
-        if ($item->id === 1 || $index === 2) {
-            return 'background: rgba(128, 152, 253, .5);';
-        }
-
-        return parent::trStyles($item, $index);
-    }
-
-    public function tdStyles(Model $item, int $index, int $cell): string
-    {
-        if ($cell === 3) {
-            return 'background: rgba(128, 253, 163, .5); text-align:center;';
-        }
-
-        return parent::tdStyles($item, $index, $cell);
-    } // [tl! focus:end]
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/table_style.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/table_style_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/en/resources/validation.blade.php b/resources/views/pages/en/resources/validation.blade.php
deleted file mode 100644
index 3a669777..00000000
--- a/resources/views/pages/en/resources/validation.blade.php
+++ /dev/null
@@ -1,103 +0,0 @@
-<x-page title="Validation" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#messages', 'label' => 'Messages'],
-        ['url' => '#prepare', 'label' => 'Preparing Input For Validation'],
-    ]
-]">
-
-<x-sub-title id="basics">Basics</x-sub-title>
-
-<x-p>
-    Validation is as simple as in the <code>FormRequests</code> classes provided by Laravel.
-</x-p>
-
-<x-p>
-    You can simply add rules to the <code>rules()</code> method of the resource in the usual way.
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Models\MoonshineUser;
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class;
-
-    public static string $title = 'Articles';
-    //...
-
-    public function rules($item): array // [tl! focus:start]
-    {
-        return [
-            'title' => ['required', 'string', 'min:5']
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/validation.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/validation_dark.png') }}"></x-image>
-
-<x-sub-title id="messages">Messages</x-sub-title>
-
-<x-p>
-    Using the <code>validationMessages()</code> method, you can create your own validation error messages
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Models\MoonshineUser;
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class;
-    //...
-
-    public function validationMessages(): array // [tl! focus:start]
-    {
-        return [
-            'email.required' => 'Required email'
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-sub-title id="prepare">Preparing Input For Validation</x-sub-title>
-
-<x-p>
-    If you need to prepare or sanitize any data from the request before you apply your validation rules,
-    you may use the <code>prepareForValidation()</code> method.
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Models\MoonshineUser;
-
-class PostResource extends Resource
-{
-    public static string $model = App\Models\Post::class;
-    //...
-
-    public function prepareForValidation(): void // [tl! focus:start]
-    {
-        request()?->merge([
-            'email' => request()
-                ?->string('email')
-                ->lower()
-                ->value()
-        ]);
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/en/upgrade_guide.blade.php b/resources/views/pages/en/upgrade_guide.blade.php
deleted file mode 100644
index ebb06fda..00000000
--- a/resources/views/pages/en/upgrade_guide.blade.php
+++ /dev/null
@@ -1,38 +0,0 @@
-<x-page title="Upgrade Guide" :sectionMenu="null">
-
-<x-moonshine::badge color="green">
-    Upgrading To 1.50 From 1.0
-</x-moonshine::badge>
-
-<x-sub-title>
-    registerResources is outdated and will be removed in 2.0 version
-</x-sub-title>
-
-<x-code language="php">
-app(MoonShine::class)->registerResources([
-    MenuItem::make('Admins', new MoonShineUserResource()),
-]);
-</x-code>
-
-<x-p>
-    We recommend to use the menu method
-</x-p>
-
-<x-code language="php">
-app(MoonShine::class)->menu([
-    MenuItem::make('Admins', new MoonShineUserResource()),
-]);
-</x-code>
-
-<x-sub-title>
-    The fullWidth field method is outdated and will be removed
-</x-sub-title>
-
-<x-sub-title>
-    To create a display grid in a form, you should use the Grid/Column decorations
-</x-sub-title>
-
-<x-sub-title>
-    Laravel filemanager is excluded from the base package, it should be installed separately
-</x-sub-title>
-</x-page>
diff --git a/resources/views/pages/ru/decorations/block.blade.php b/resources/views/pages/ru/components/block.blade.php
similarity index 100%
rename from resources/views/pages/ru/decorations/block.blade.php
rename to resources/views/pages/ru/components/block.blade.php
diff --git a/resources/views/pages/ru/decorations/button.blade.php b/resources/views/pages/ru/components/button.blade.php
similarity index 100%
rename from resources/views/pages/ru/decorations/button.blade.php
rename to resources/views/pages/ru/components/button.blade.php
diff --git a/resources/views/pages/ru/components/collapse.blade.php b/resources/views/pages/ru/components/collapse.blade.php
index f67800ee..c1a8470f 100644
--- a/resources/views/pages/ru/components/collapse.blade.php
+++ b/resources/views/pages/ru/components/collapse.blade.php
@@ -1,58 +1,38 @@
-<x-page title="Collapse" :sectionMenu="[
-    'Разделы' => [
-        ['url' => '#basics', 'label' => 'Основы'],
-        ['url' => '#show', 'label' => 'Отобразить развернутым'],
-        ['url' => '#persist', 'label' => 'Сохранение состояния'],
-    ]
-]">
-
-<x-sub-title id="basics">Основы</x-sub-title>
-
-<x-p>
-    Компонент <code>moonshine::collapse</code> позволяет сворачивать контент.
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/collapse.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/collapse")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="show">Отобразить развернутым</x-sub-title>
+<x-page
+    title="Collapse"
+    :videos="[
+        ['url' => 'https://www.youtube.com/embed/7HGaebxlcFM?start=251&end=306', 'title' => 'Screencasts: Декорация Collapse'],
+    ]"
+>
 
 <x-p>
-    Если параметр <code>show</code> имеет значение <code>TRUE</code>,
-    то по умолчанию блок будет отображаться развернутым.
+    Декоратор Collapse позволяет сворачивать <code>fields</code> и <code>blocks</code> с сохранением состояния.
 </x-p>
 
-<x-code language="blade" file="resources/views/examples/components/collapse-show.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/collapse-show")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
-
-<x-sub-title id="persist">Сохранение состояния</x-sub-title>
-
-<x-p>
-    Если параметр <code>persist</code> имеет значение <code>TRUE</code>, то будет сохраняться состояние блока.
-</x-p>
-
-<x-code language="blade" file="resources/views/examples/components/collapse-persist.blade.php"></x-code>
-
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/collapse-persist")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
+<x-code language="php">
+use MoonShine\Decorations\Collapse;  // [tl! focus]
+use MoonShine\Decorations\Block;
+
+//...
+public function fields(): array
+{
+    return [
+        Block::make([
+            Collapse::make('Title/Slug', [  // [tl! focus]
+                Text::make('Title')
+                ->fieldContainer(false),
+
+                Text::make('Slug')
+                    ->fieldContainer(false),
+            ])  // [tl! focus]
+            ->show() // отобразить развернутым (дополнительная опция) [tl! focus]
+        ]);
+    ];
+}
+//...
+</x-code>
+
+<x-image theme="light" src="{{ asset('screenshots/collapse.png') }}"></x-image>
+<x-image theme="dark" src="{{ asset('screenshots/collapse_dark.png') }}"></x-image>
 
 </x-page>
diff --git a/resources/views/pages/ru/decorations/tabs.blade.php b/resources/views/pages/ru/components/decoration_tabs.blade.php
similarity index 71%
rename from resources/views/pages/ru/decorations/tabs.blade.php
rename to resources/views/pages/ru/components/decoration_tabs.blade.php
index 83dad1bd..7f24b6ee 100644
--- a/resources/views/pages/ru/decorations/tabs.blade.php
+++ b/resources/views/pages/ru/components/decoration_tabs.blade.php
@@ -1,12 +1,17 @@
 <x-page
     title="Вкладки"
-    :videos="[
-        ['url' => 'https://www.youtube.com/embed/7HGaebxlcFM?start=713&end=819', 'title' => 'Screencasts: Декорация Tabs'],
+    :sectionMenu="[
+        'Разделы' => [
+            ['url' => '#make', 'label' => 'Make'],
+            ['url' => '#active-tab', 'label' => 'Активная вкладка'],
+        ]
     ]"
 >
 
+<x-sub-title id="make">Make</x-sub-title>
+
 <x-p>
-    На форму для удобства можно добавить вкладки и сгруппировать поля.
+    Компонент <em>Tabs</em> позволяет создавать вкладки.
 </x-p>
 
 <x-code language="php">
diff --git a/resources/views/pages/ru/components/divider.blade.php b/resources/views/pages/ru/components/divider.blade.php
index 3698f838..d6713788 100644
--- a/resources/views/pages/ru/components/divider.blade.php
+++ b/resources/views/pages/ru/components/divider.blade.php
@@ -1,54 +1,82 @@
-<x-page title="Divider" :sectionMenu="[
-    'Разделы' => [
-        ['url' => '#basics', 'label' => 'Основы'],
-        ['url' => '#text', 'label' => 'Текстовый разделитель'],
-    ]
-]">
+<x-page
+    title="Разделитель"
+    :sectionMenu="[
+        'Разделы' => [
+            ['url' => '#basics', 'label' => 'Основы'],
+            ['url' => '#label', 'label' => 'Label'],
+        ]
+    ]"
+>
 
 <x-sub-title id="basics">Основы</x-sub-title>
 
 <x-p>
-    Компонент <code>moonshine::divider</code> позволяет создать стилизованный разделитель контента.
+    Для разделения на зоны можно воспользоваться декорацией <code>Divider</code>.
 </x-p>
 
-<x-code language="blade" file="resources/views/examples/components/divider.blade.php"></x-code>
+<x-code language="php">
+use MoonShine\Decorations\Divider;
 
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/divider")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
+//...
+public function fields(): array
+{
+    return [
+        //...
+        Divider::make(), // [tl! focus]
+        //...
+    ];
+}
+//...
+</x-code>
 
-<x-sub-title id="text">Текстовый разделитель</x-sub-title>
+<x-image theme="light" src="{{ asset('screenshots/divider.png') }}"></x-image>
+<x-image theme="dark" src="{{ asset('screenshots/divider_dark.png') }}"></x-image>
+
+<x-sub-title id="label">Label</x-sub-title>
 
 <x-p>
-    В качестве разделителя можно использовать текст. Для этого необходимо указать текст в параметре <code>label</code>.
+    В качестве разделителя можно использовать текст, для этого его необходимо передать методу <code>make()</code> в качестве аргумента.
 </x-p>
 
-<x-code language="blade" file="resources/views/examples/components/divider-label.blade.php"></x-code>
+<x-code language="php">
+use MoonShine\Decorations\Divider;
+
+//...
+public function fields(): array
+{
+    return [
+        //...
+        Divider::make('Divider'), // [tl! focus]
+        //...
+    ];
+}
+//...
+</x-code>
 
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/divider-label")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
+<x-image theme="light" src="{{ asset('screenshots/divider_label.png') }}"></x-image>
+<x-image theme="dark" src="{{ asset('screenshots/divider_label_dark.png') }}"></x-image>
 
 <x-p>
-    Параметр <code>centered</code> позволяет разместить текст по центру.
+    Метод <code>centered()</code> позволяет отцентрировать текст.
 </x-p>
 
-<x-code language="blade" file="resources/views/examples/components/divider-label-center.blade.php"></x-code>
+<x-code language="php">
+use MoonShine\Decorations\Divider;
+
+//...
+public function fields(): array
+{
+    return [
+        //...
+        Divider::make('Divider')
+            ->centered(), // [tl! focus]
+        //...
+    ];
+}
+//...
+</x-code>
 
-<x-moonshine::grid>
-    <x-moonshine::column adaptiveColSpan="12" colSpan="6">
-        <x-moonshine::box>
-            @include("examples/components/divider-label-center")
-        </x-moonshine::box>
-    </x-moonshine::column>
-</x-moonshine::grid>
+<x-image theme="light" src="{{ asset('screenshots/divider_label_center.png') }}"></x-image>
+<x-image theme="dark" src="{{ asset('screenshots/divider_label_center_dark.png') }}"></x-image>
 
 </x-page>
diff --git a/resources/views/pages/ru/decorations/heading.blade.php b/resources/views/pages/ru/components/heading.blade.php
similarity index 100%
rename from resources/views/pages/ru/decorations/heading.blade.php
rename to resources/views/pages/ru/components/heading.blade.php
diff --git a/resources/views/pages/ru/components/index.blade.php b/resources/views/pages/ru/components/index.blade.php
index a18687a3..3aae7092 100644
--- a/resources/views/pages/ru/components/index.blade.php
+++ b/resources/views/pages/ru/components/index.blade.php
@@ -1,19 +1,102 @@
-<x-page title="Components">
+<x-page
+    title="Moonshine компоненты"
+    :sectionMenu="[
+        'Разделы' => [
+            ['url' => '#basics', 'label' => 'Основы'],
+            ['url' => '#moonshine-component', 'label' => 'MoonshineComponent'],
+        ]
+    ]"
+>
+
+<x-sub-title id="basics">Основы</x-sub-title>
+
+<x-p>
+    Компоненты в <strong>MoonShine</strong> являются основой для построения интерфейса.<br />
+    В админ-панели уже реализовано множество компонентов, которые можно разделить на несколько групп:
+    Layouts, Decorations и Metrics.
+</x-p>
+
+<x-p>
+    <em>Layouts</em> - компоненты используются для создания основных блоков админ-панели:
+    Flash, Footer, Header, LayoutBlock, LayoutBuilder, Menu, Profile, Sidebar, TopBar.
+</x-p>
+
+<x-p>
+    <em>Decorations</em> - компоненты используются для визуального оформления пользовательского интерфейса:
+    Block, Collapse, Divider, Flex, Fragment, Grid, Heading, LineBreak, Tabs, TextBlock.
+</x-p>
+
+<x-p>
+    <em>Metrics</em> - компоненты используются для создания информационных блоков:
+    <x-link link="{{ route('moonshine.page', 'components-metric_donut_chart') }}">DonutChartMetric</x-link>,
+    <x-link link="{{ route('moonshine.page', 'components-metric_line_chart') }}">LineChartMetric</x-link>,
+    <x-link link="{{ route('moonshine.page', 'components-metric_value') }}">ValueMetric</x-link>.
+</x-p>
+
+<x-p>
+    Админ-панель <strong>MoonShine</strong> не ограничивает вас в использовании других компонентов,
+    которые могут быть реализованы с использованием
+    <x-link link="https://livewire.laravel.com/docs/quickstart" target="_blank"><em>Livewire</em></x-link>,
+    а так же <x-link link="https://laravel.com/docs/10.x/blade#components" target="_blank"><em>Blade</em></x-link>
+    компоненты.
+</x-p>
+
+<x-sub-title id="moonshine-component">MoonshineComponent</x-sub-title>
 
 <x-p>
-    Для создания интерфейса админ-панели <strong>MoonShine</strong> используется множество <em>UI компонентов</em>.<br />
-    Вы можете воспользоваться этими компонентами для построения своих шаблонов,
-    кастомных полей, фильтров, декораций или страниц.<br />
-    Использование компонентов ускоряет разработку и позволяет сохранить единую стилистику проекта.
+    В <strong>MoonShine</strong> реализована консольная команда для создания <em>MoonshineComponent</em>,
+    в котором уже реализованы основные методы для использования в админ панели.
 </x-p>
 
+<x-code language="shell">
+php artisan moonshine:component
+</x-code>
+
 <x-p>
-    Если вы планируете использовать компоненты за пределами админ-панели,
-    то необходимо ваш шаблон добавить директиву с ассетами MoonShine.
+    В результате будет создан класс <code>NameComponent</code>, который является основой нового компонента.<br />
+    Располагается он, по умолчанию, в директории <code>app/MoonShine/Components</code>.<br />
+    А так же Blade файл для компонента в директории <code>resources/views/admin/components</code>.
 </x-p>
 
-<x-code language="blade">
-    @@moonShineAssets
+<x-moonshine::divider label="Методы компонента" />
+
+<x-p>
+    Метод <code>make()</code> предназначен для создания экземпляра компонента.
+</x-p>
+
+<x-code language="php">
+use App\MoonShine\Components\NameComponent; // [tl! focus]
+
+//...
+
+public function components(): array
+{
+    return [
+        NameComponent::make() // [tl! focus]
+    ];
+}
+
+//...
+</x-code>
+
+<x-p>
+    Метод <code>viewData()</code> позволяет передать данные в шаблон компонента.
+</x-p>
+
+<x-code language="php">
+namespace App\MoonShine\Components; // [tl! focus]
+
+//...
+
+final class Test extends MoonshineComponent
+{
+    protected function viewData(): array
+    {
+        return [];
+    }
+}
+
+//...
 </x-code>
 
 </x-page>
diff --git a/resources/views/pages/ru/decorations/layout.blade.php b/resources/views/pages/ru/components/layout.blade.php
similarity index 100%
rename from resources/views/pages/ru/decorations/layout.blade.php
rename to resources/views/pages/ru/components/layout.blade.php
diff --git a/resources/views/pages/ru/components/metric_donut_chart.blade.php b/resources/views/pages/ru/components/metric_donut_chart.blade.php
new file mode 100644
index 00000000..66520e27
--- /dev/null
+++ b/resources/views/pages/ru/components/metric_donut_chart.blade.php
@@ -0,0 +1,56 @@
+<x-page
+    title="Метрика DonutChart"
+    :sectionMenu="[
+        'Разделы' => [
+            ['url' => '#make', 'label' => 'Make'],
+            ['url' => '#column-span', 'label' => 'Ширина блока'],
+        ]
+    ]"
+>
+
+<x-sub-title id="make">Make</x-sub-title>
+
+<x-p>
+    Метрика <em>DonutChartMetric</em> предназначена для создания Donut графиков.
+</x-p>
+
+<x-p>
+    Создать <em>DonutChartMetric</em> можно воспользовавшись статическим методом <code>make()</code>.
+</x-p>
+
+<x-code language="php">
+make(Closure|string $label)
+</x-code>
+
+<x-p>
+    Метод <code>values()</code> позволяет указать значение для метрики.
+</x-p>
+
+<x-code language="php">
+values(array|Closure $values)
+</x-code>
+
+<x-code language="php">
+use MoonShine\Metrics\DonutChartMetric; // [tl! focus]
+
+//...
+
+public function components(): array
+{
+    return [
+        DonutChartMetric::make('Subscribers') // [tl! focus]
+            ->values(['CutCode' => 10000, 'Apple' => 9999]) // [tl! focus]
+    ];
+}
+
+//...
+</x-code>
+
+<x-image theme="light" src="{{ asset('screenshots/donut_chart_metric.png') }}"></x-image>
+<x-image theme="dark" src="{{ asset('screenshots/donut_chart_metric_dark.png') }}"></x-image>
+
+<x-sub-title id="column-span">Ширина блока</x-sub-title>
+
+@include('pages.ru.components.shared.metric_column_span', ['metric' => 'DonutChartMetric'])
+
+</x-page>
diff --git a/resources/views/pages/ru/components/metric_line_chart.blade.php b/resources/views/pages/ru/components/metric_line_chart.blade.php
new file mode 100644
index 00000000..458090ad
--- /dev/null
+++ b/resources/views/pages/ru/components/metric_line_chart.blade.php
@@ -0,0 +1,131 @@
+<x-page
+    title="Метрика LineChart"
+    :sectionMenu="[
+        'Разделы' => [
+            ['url' => '#make', 'label' => 'Make'],
+            ['url' => '#keys-sort', 'label' => 'Сортировка ключей'],
+            ['url' => '#column-span', 'label' => 'Ширина блока'],
+        ]
+    ]"
+>
+
+<x-sub-title id="make">Make</x-sub-title>
+
+<x-p>
+    Метрика <em>LineChartMetric</em> предназначена для отображения линейных графиков.
+</x-p>
+
+<x-p>
+    Создать <em>LineChartMetric</em> можно воспользовавшись статическим методом <code>make()</code>.
+</x-p>
+
+<x-code language="php">
+make(Closure|string $label)
+</x-code>
+
+<x-p>
+    Метод <code>line()</code> позволяет добавить линию значений в метрику.
+    В <em>ValueMetric</em> можно добавить несколько линий.
+</x-p>
+
+<x-code language="php">
+line(
+    array|Closure $line,
+    string|array|Closure $color = '#7843E9'
+)
+</x-code>
+
+<x-p>
+    <code>$line</code> - значения для построения графика,<br>
+    <code>$color</code> - цвет линии.
+</x-p>
+
+<x-code language="php">
+use MoonShine\Metrics\LineChartMetric; // [tl! focus]
+
+//...
+
+public function components(): array
+{
+    return [
+        LineChartMetric::make('Orders') // [tl! focus:start]
+            ->line([
+                'Profit' => Order::query()
+                    ->selectRaw('SUM(price) as sum, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
+                    ->groupBy('date')
+                    ->pluck('sum','date')
+                    ->toArray()
+            ])
+            ->line([
+                'Avg' => Order::query()
+                    ->selectRaw('AVG(price) as avg, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
+                    ->groupBy('date')
+                    ->pluck('avg','date')
+                    ->toArray()
+            ], '#EC4176') // [tl! focus:end]
+    ];
+}
+
+//...
+</x-code>
+
+<x-p>
+    Можно задать несколько линий через один метод <code>line</code>.
+</x-p>
+
+<x-code language="php">
+use MoonShine\Metrics\LineChartMetric; // [tl! focus]
+
+//...
+
+public function components(): array
+{
+    return [
+        LineChartMetric::make('Orders') // [tl! focus:start]
+            ->line([
+                'Profit' => Order::query()
+                    ->selectRaw('SUM(price) as sum, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
+                    ->groupBy('date')
+                    ->pluck('sum','date')
+                    ->toArray(),
+                'Avg' => Order::query()
+                    ->selectRaw('AVG(price) as avg, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
+                    ->groupBy('date')
+                    ->pluck('avg','date')
+                    ->toArray()
+            ],[
+                'red', 'blue'
+            ]) // [tl! focus:end]
+    ];
+}
+
+//...
+</x-code>
+
+<x-image theme="light" src="{{ asset('screenshots/line_chart_metrics.png') }}"></x-image>
+<x-image theme="dark" src="{{ asset('screenshots/line_chart_metric_dark.png') }}"></x-image>
+
+<x-sub-title id="keys-sort">Сортировка ключей</x-sub-title>
+
+<x-p>
+    По умолчанию у графика <em>LineChart</em> ключи сортируются по возрастанию.
+    Эту особенность можно отключить, используя метод <code>withoutSortKeys()</code>.
+</x-p>
+
+<x-code language="php">
+LineChartMetric::make('Orders')
+    ->line([
+        'Profit' => Order::query()
+            ->selectRaw('SUM(price) as sum, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
+            ->groupBy('date')
+            ->pluck('sum','date')
+            ->toArray()
+    ])
+    ->withoutSortKeys(), // [tl! focus]
+</x-code>
+
+<x-sub-title id="column-span">Ширина блока</x-sub-title>
+
+@include('pages.ru.components.shared.metric_column_span', ['metric' => 'LineChartMetric'])
+
+</x-page>
diff --git a/resources/views/pages/ru/components/metric_value.blade.php b/resources/views/pages/ru/components/metric_value.blade.php
new file mode 100644
index 00000000..4956a5e4
--- /dev/null
+++ b/resources/views/pages/ru/components/metric_value.blade.php
@@ -0,0 +1,129 @@
+<x-page
+    title="Метрика Value"
+    :sectionMenu="[
+        'Разделы' => [
+            ['url' => '#make', 'label' => 'Make'],
+            ['url' => '#progress', 'label' => 'Прогресс'],
+            ['url' => '#value-format', 'label' => 'Формат значения'],
+            ['url' => '#icon', 'label' => 'Icon'],
+            ['url' => '#column-span', 'label' => 'Ширина блока'],
+        ]
+    ]"
+>
+
+<x-sub-title id="make">Make</x-sub-title>
+
+<x-p>
+    Метрика <em>ValueMetric</em> предназначена для отображения какого-либо значения.
+    Например, сколько всего записей в таблице.
+</x-p>
+
+<x-p>
+    Создать <em>ValueMetric</em> можно воспользовавшись статическим методом <code>make()</code>.
+</x-p>
+
+<x-code language="php">
+make(Closure|string $label)
+</x-code>
+
+<x-p>
+    Метод <code>value()</code> позволяет указать значение для метрики.
+</x-p>
+
+<x-code language="php">
+value(int|string|float|Closure $value)
+</x-code>
+
+<x-code language="php">
+use MoonShine\Metrics\ValueMetric; // [tl! focus]
+
+//...
+
+public function components(): array
+{
+    return [
+        ValueMetric::make('Completed orders')
+            ->value(Order::completed()->count()) // [tl! focus:-1]
+    ];
+}
+
+//...
+</x-code>
+
+<x-image theme="light" src="{{ asset('screenshots/value_metric.png') }}"></x-image>
+<x-image theme="dark" src="{{ asset('screenshots/value_metric_dark.png') }}"></x-image>
+
+<x-sub-title id="progress">Прогресс</x-sub-title>
+
+<x-p>
+    Метод <code>progress()</code> позволяет отобразить индикатор прогресса достижения цели в метрике.
+</x-p>
+
+<x-code language="php">
+progress(int|float|Closure $target)
+</x-code>
+
+<x-code language="php">
+use MoonShine\Metrics\ValueMetric;
+
+//...
+
+public function components(): array
+{
+    return [
+        ValueMetric::make('Open tasks')
+            ->value(Task::opened()->count())
+            ->progress(Task::count()) // [tl! focus]
+    ];
+}
+
+//...
+</x-code>
+
+<x-moonshine::alert type="default" icon="heroicons.information-circle">
+    При использовании индикатора прогресса, методу <code>value()</code> необходимо передать числовое значение
+    или замыкание, которое вернет число.
+</x-moonshine::alert>
+
+<x-image theme="light" src="{{ asset('screenshots/value_metric_progress.png') }}"></x-image>
+<x-image theme="dark" src="{{ asset('screenshots/value_metric_progress_dark.png') }}"></x-image>
+
+<x-sub-title id="value-format">Формат значения</x-sub-title>
+
+<x-p>
+    Метод <code>valueFormat()</code> позволяет отформатировать значение метрики и добавить префикс и суффикс.
+</x-p>
+
+<x-code language="php">
+valueFormat(string|Closure $value)
+</x-code>
+
+<x-code language="php">
+use MoonShine\Metrics\ValueMetric;
+
+//...
+
+public function components(): array
+{
+    return [
+        ValueMetric::make('Profit')
+            ->value(Order::completed()->sum('price'))
+            ->valueFormat('Today ${value}') // [tl! focus:-1]
+    ];
+}
+
+//...
+</x-code>
+
+<x-image theme="light" src="{{ asset('screenshots/value_metric_format.png') }}"></x-image>
+<x-image theme="dark" src="{{ asset('screenshots/value_metric_format_dark.png') }}"></x-image>
+
+<x-sub-title id="icon">Icon</x-sub-title>
+
+@include('pages.ru.components.shared.metric_icon', ['metric' => 'ValueMetric'])
+
+<x-sub-title id="column-span">Ширина блока</x-sub-title>
+
+@include('pages.ru.components.shared.metric_column_span', ['metric' => 'ValueMetric'])
+
+</x-page>
diff --git a/resources/views/pages/ru/components/shared/metric_column_span.blade.php b/resources/views/pages/ru/components/shared/metric_column_span.blade.php
new file mode 100644
index 00000000..60b5d610
--- /dev/null
+++ b/resources/views/pages/ru/components/shared/metric_column_span.blade.php
@@ -0,0 +1,81 @@
+<x-p>
+    Метод <code>columnSpan()</code> позволяет задать ширину блока в <em>Grid</em> сетке.
+</x-p>
+
+<x-code language="php">
+columnSpan(
+    int $columnSpan,
+    int $adaptiveColumnSpan = 12
+)
+</x-code>
+
+<x-code language="php">
+use App\Models\Article;
+use MoonShine\Decorations\Grid;
+use MoonShine\Metrics\{{ $metric }};
+
+//...
+
+public function components(): array
+{
+    return [
+        Grid::make([ // [tl! focus]
+            {{ $metric }}::make({{ $metric === 'DonutChartMetric' ? 'Subscribers' : 'Articles' }})
+@if( $metric === 'ValueMetric')
+                ->value(Article::count())
+@elseif( $metric === 'DonutChartMetric')
+                ->values(['CutCode' => 10000, 'Apple' => 9999])
+@elseif( $metric === 'LineChartMetric')
+                ->line([
+                    'Count' => [
+                        now()->subDays()->format('Y-m-d') =>
+                            Article::whereDate(
+                                'created_at',
+                                now()->subDays()->format('Y-m-d')
+                            )->count(),
+                        now()->format('Y-m-d') =>
+                            Article::whereDate(
+                                'created_at',
+                                now()->subDays()->format('Y-m-d')
+                            )->count()
+                    ]
+                ])
+@endif
+                ->columnSpan(6), // [tl! focus]
+            {{ $metric }}::make( {{ $metric === 'DonutChartMetric' ? 'Tasks' : 'Comments' }})
+@if( $metric === 'ValueMetric')
+                ->value(Comment::count())
+@elseif( $metric === 'DonutChartMetric')
+                ->values(['New' => 234, 'Done' => 421])
+@elseif( $metric === 'LineChartMetric')
+                ->line([
+                    'Count' => [
+                        now()->subDays()->format('Y-m-d') =>
+                            Comment::whereDate(
+                                'created_at',
+                                now()->subDays()->format('Y-m-d')
+                            )->count(),
+                        now()->format('Y-m-d') =>
+                            Comment::whereDate(
+                                'created_at',
+                                now()->subDays()->format('Y-m-d')
+                            )->count()
+                    ]
+                ])
+@endif
+                ->columnSpan(6) // [tl! focus]
+        ]) // [tl! focus]
+    ];
+}
+
+//...
+</x-code>
+
+<x-moonshine::alert type="default" icon="heroicons.book-open">
+    За более подробной информацией обратитесь к разделу
+    <x-link link="{{ route('moonshine.page', 'components-decoration_layout') }}">Декорация Layout</x-link>.
+</x-moonshine::alert>
+
+
+<x-image theme="light" src="{{ asset('screenshots/' . str($metric)->snake('_')->append('_column_span.png')) }}"></x-image>
+<x-image theme="dark" src="{{ asset('screenshots/' . str($metric)->snake('_')->append('_column_span_dark.png')) }}"></x-image>
diff --git a/resources/views/pages/ru/components/shared/metric_icon.blade.php b/resources/views/pages/ru/components/shared/metric_icon.blade.php
new file mode 100644
index 00000000..a800f4ff
--- /dev/null
+++ b/resources/views/pages/ru/components/shared/metric_icon.blade.php
@@ -0,0 +1,29 @@
+<x-p>
+    Метод <code>icon()</code> позволяет добавить иконку к метрике.
+</x-p>
+
+<x-code language="php">
+use MoonShine\Metrics\ValueMetric;
+
+//...
+
+public function components(): array
+{
+    return [
+        ValueMetric::make('Orders')
+            ->value(Order::count())
+            ->icon('heroicons.shopping-bag') // [tl! focus]
+    ];
+}
+
+//...
+</x-code>
+
+<x-moonshine::alert type="default" icon="heroicons.book-open">
+    За более подробной информацией обратитесь к разделу
+    <x-link link="{{ route('moonshine.page', 'appearance-icons') }}">Icons</x-link>.
+</x-moonshine::alert>
+
+
+<x-image theme="light" src="{{ asset('screenshots/' . str($metric)->snake('_')->append('_icon.png')) }}"></x-image>
+<x-image theme="dark" src="{{ asset('screenshots/' . str($metric)->snake('_')->append('_icon_dark.png')) }}"></x-image>
diff --git a/resources/views/pages/ru/configuration.blade.php b/resources/views/pages/ru/configuration.blade.php
index e6428cca..4470a83e 100644
--- a/resources/views/pages/ru/configuration.blade.php
+++ b/resources/views/pages/ru/configuration.blade.php
@@ -57,7 +57,7 @@
     'disk' => 'public', // [tl! focus]
 
     'forms' => [ // [tl! focus]
-        # форма аунтификации
+        # форма аутентификации
         'login' => LoginForm::class // [tl! focus]
     ], // [tl! focus]
 
diff --git a/resources/views/pages/ru/decorations/collapse.blade.php b/resources/views/pages/ru/decorations/collapse.blade.php
deleted file mode 100644
index c1a8470f..00000000
--- a/resources/views/pages/ru/decorations/collapse.blade.php
+++ /dev/null
@@ -1,38 +0,0 @@
-<x-page
-    title="Collapse"
-    :videos="[
-        ['url' => 'https://www.youtube.com/embed/7HGaebxlcFM?start=251&end=306', 'title' => 'Screencasts: Декорация Collapse'],
-    ]"
->
-
-<x-p>
-    Декоратор Collapse позволяет сворачивать <code>fields</code> и <code>blocks</code> с сохранением состояния.
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Collapse;  // [tl! focus]
-use MoonShine\Decorations\Block;
-
-//...
-public function fields(): array
-{
-    return [
-        Block::make([
-            Collapse::make('Title/Slug', [  // [tl! focus]
-                Text::make('Title')
-                ->fieldContainer(false),
-
-                Text::make('Slug')
-                    ->fieldContainer(false),
-            ])  // [tl! focus]
-            ->show() // отобразить развернутым (дополнительная опция) [tl! focus]
-        ]);
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/collapse.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/collapse_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/ru/decorations/divider.blade.php b/resources/views/pages/ru/decorations/divider.blade.php
deleted file mode 100644
index d6713788..00000000
--- a/resources/views/pages/ru/decorations/divider.blade.php
+++ /dev/null
@@ -1,82 +0,0 @@
-<x-page
-    title="Разделитель"
-    :sectionMenu="[
-        'Разделы' => [
-            ['url' => '#basics', 'label' => 'Основы'],
-            ['url' => '#label', 'label' => 'Label'],
-        ]
-    ]"
->
-
-<x-sub-title id="basics">Основы</x-sub-title>
-
-<x-p>
-    Для разделения на зоны можно воспользоваться декорацией <code>Divider</code>.
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Divider;
-
-//...
-public function fields(): array
-{
-    return [
-        //...
-        Divider::make(), // [tl! focus]
-        //...
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/divider.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/divider_dark.png') }}"></x-image>
-
-<x-sub-title id="label">Label</x-sub-title>
-
-<x-p>
-    В качестве разделителя можно использовать текст, для этого его необходимо передать методу <code>make()</code> в качестве аргумента.
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Divider;
-
-//...
-public function fields(): array
-{
-    return [
-        //...
-        Divider::make('Divider'), // [tl! focus]
-        //...
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/divider_label.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/divider_label_dark.png') }}"></x-image>
-
-<x-p>
-    Метод <code>centered()</code> позволяет отцентрировать текст.
-</x-p>
-
-<x-code language="php">
-use MoonShine\Decorations\Divider;
-
-//...
-public function fields(): array
-{
-    return [
-        //...
-        Divider::make('Divider')
-            ->centered(), // [tl! focus]
-        //...
-    ];
-}
-//...
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/divider_label_center.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/divider_label_center_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/ru/decorations/index.blade.php b/resources/views/pages/ru/decorations/index.blade.php
deleted file mode 100644
index 0bc2b4c7..00000000
--- a/resources/views/pages/ru/decorations/index.blade.php
+++ /dev/null
@@ -1,15 +0,0 @@
-<x-page
-    title="Основы"
-    :videos="[
-        ['url' => 'https://www.youtube.com/embed/1WxCBvejwqw?start=917', 'title' => 'Screencasts: Декорации'],
-    ]"
->
-<x-p>
-    Декорации задаются в методах ресурса <code>fields</code> или <code>filters</code>.
-</x-p>
-
-<x-p>
-    Служат для улучшения внешнего вида полей и повышения качества интерфейса.
-</x-p>
-
-</x-page>
diff --git a/resources/views/pages/ru/fields/enum.blade.php b/resources/views/pages/ru/fields/enum.blade.php
index 1f2e3cb3..ddaf3ca8 100644
--- a/resources/views/pages/ru/fields/enum.blade.php
+++ b/resources/views/pages/ru/fields/enum.blade.php
@@ -74,7 +74,7 @@ public function toString(): ?string
     то в <em>preview</em> поле отобразиться в виде значка определенного цвета.
 </x-p>
 
-@include('pages.ru.components.shared.colors')
+@include('pages.ru.ui.shared.colors')
 
 <x-code language="php">
 namespace App\Enums;
diff --git a/resources/views/pages/ru/fields/index.blade.php b/resources/views/pages/ru/fields/index.blade.php
index 9d4b4e2c..9346735e 100644
--- a/resources/views/pages/ru/fields/index.blade.php
+++ b/resources/views/pages/ru/fields/index.blade.php
@@ -320,7 +320,7 @@ public function fields(): array
 badge(string|Closure|null $color = null)
 </x-code>
 
-@include('pages.ru.components.shared.colors')
+@include('pages.ru.ui.shared.colors')
 
 <x-code language="php">
 //...
diff --git a/resources/views/pages/ru/menu.blade.php b/resources/views/pages/ru/menu.blade.php
index 49cdf273..7287a249 100644
--- a/resources/views/pages/ru/menu.blade.php
+++ b/resources/views/pages/ru/menu.blade.php
@@ -264,7 +264,7 @@ protected function menu(): array
 <x-sub-title id="icon">Иконка</x-sub-title>
 
 <x-p>
-    У пункта меню и у группы можно задать иконку. Это можно реализовать несколькоми методами.
+    У пункта меню и у группы можно задать иконку. Это можно реализовать несколькими методами.
 </x-p>
 
 <x-moonshine::divider label="Через параметр" />
diff --git a/resources/views/pages/ru/metrics/donut_chart.blade.php b/resources/views/pages/ru/metrics/donut_chart.blade.php
deleted file mode 100644
index b22efe89..00000000
--- a/resources/views/pages/ru/metrics/donut_chart.blade.php
+++ /dev/null
@@ -1,31 +0,0 @@
-<x-page title="DonutChart">
-
-<x-p>
-   Позволяет создавать Donut график для метрик.
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Metrics\DonutChartMetric;
-
-class PostResource extends Resource
-{
-    //...
-
-    public function metrics(): array // [tl! focus:start]
-    {
-        return [
-            DonutChartMetric::make('Подписчики')
-                ->values(['CutCode' => 10000, 'Apple' => 9999]),
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/metrics_donut_chart.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/metrics_donut_chart_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/ru/metrics/index.blade.php b/resources/views/pages/ru/metrics/index.blade.php
deleted file mode 100644
index c1c25d89..00000000
--- a/resources/views/pages/ru/metrics/index.blade.php
+++ /dev/null
@@ -1,16 +0,0 @@
-<x-page title="Метрики">
-
-<x-p>
-    Блоки для отображения статистики.
-</x-p>
-
-<x-p>
-    Можно вывести на главной странице <x-link link="{{ route('moonshine.page', 'advanced-dashboard') }}">панели управления</x-link>
-    и в каждом отдельном <x-link link="{{ route('moonshine.page', 'resources-index') }}">ресурсе</x-link>.
-</x-p>
-
-<x-p>
-    Метрикам также доступны методы декораций
-    <x-link link="{{ route('moonshine.page', 'decorations-layout#grid-column') }}">Layout (columnSpan)</x-link>.
-</x-p>
-</x-page>
diff --git a/resources/views/pages/ru/metrics/line_chart.blade.php b/resources/views/pages/ru/metrics/line_chart.blade.php
deleted file mode 100644
index ccbbe738..00000000
--- a/resources/views/pages/ru/metrics/line_chart.blade.php
+++ /dev/null
@@ -1,99 +0,0 @@
-<x-page title="LineChart">
-
-<x-p>
-   Позволяет создавать линейный график для метрик.
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Metrics\LineChartMetric;
-
-class PostResource extends Resource
-{
-    //...
-
-    public function metrics(): array // [tl! focus:start]
-    {
-        return [
-            LineChartMetric::make('Orders')
-                ->line([
-                    'Profit' => Order::query()
-                        ->selectRaw('SUM(price) as sum, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
-                        ->groupBy('date')
-                        ->pluck('sum','date')
-                        ->toArray()
-                ])
-                ->line([
-                    'Avg' => Order::query()
-                        ->selectRaw('AVG(price) as avg, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
-                        ->groupBy('date')
-                        ->pluck('avg','date')
-                        ->toArray()
-                ], '#EC4176'),
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-p>
-    или используя один метод <code>line</code>:
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Metrics\LineChartMetric;
-
-class PostResource extends Resource
-{
-    //...
-
-    public function metrics(): array // [tl! focus:start]
-    {
-        return [
-            LineChartMetric::make('Orders')
-                ->line([
-                    'Profit' => Order::query()
-                        ->selectRaw('SUM(price) as sum, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
-                        ->groupBy('date')
-                        ->pluck('sum','date')
-                        ->toArray(),
-                    'Avg' => Order::query()
-                        ->selectRaw('AVG(price) as avg, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
-                        ->groupBy('date')
-                        ->pluck('avg','date')
-                        ->toArray()
-                ],[
-                    'red', 'blue'
-                ])
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/metrics_line_chart.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/metrics_line_chart_dark.png') }}"></x-image>
-
-<x-moonshine::alert type="default" icon="heroicons.book-open">
-    По умолчанию у графика LineChart ключи сортируются по возрастанию.
-    Эту особенность можно отключить, используя метод <code>withoutSortKeys()</code>.
-</x-moonshine::alert>
-
-<x-code language="php">
-LineChartMetric::make('Orders')
-    ->line([
-        'Profit' => Order::query()
-            ->selectRaw('SUM(price) as sum, DATE_FORMAT(created_at, "%d.%m.%Y") as date')
-            ->groupBy('date')
-            ->pluck('sum','date')
-            ->toArray()
-    ])
-    ->withoutSortKeys(), // [tl! focus]
-</x-code>
-
-</x-page>
diff --git a/resources/views/pages/ru/metrics/value.blade.php b/resources/views/pages/ru/metrics/value.blade.php
deleted file mode 100644
index eed90e43..00000000
--- a/resources/views/pages/ru/metrics/value.blade.php
+++ /dev/null
@@ -1,89 +0,0 @@
-<x-page title="Значение">
-
-<x-p>
-    Предназначено для отображения простого значения. Например, сколько всего в таблице определенных записей.
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Metrics\ValueMetric;
-
-class PostResource extends Resource
-{
-    //...
-
-    public function metrics(): array // [tl! focus:start]
-    {
-        return [
-            ValueMetric::make('Завершенных заказов')
-                ->value(Orders::completed()->count())
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/metrics.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/metrics_dark.png') }}"></x-image>
-
-<x-p>
-    Также есть возможность отображения в виде прогресса достижения цели.
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Metrics\ValueMetric;
-
-class PostResource extends Resource
-{
-    //...
-
-    public function metrics(): array // [tl! focus:start]
-    {
-        return [
-            ValueMetric::make('Open tasks')
-                ->value(Task::opened()->count())
-                ->progress(200) // Конечная цель
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/metrics_value_progress.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/metrics_value_progress_dark.png') }}"></x-image>
-
-<x-p>
-Выводимое значение можно отформатировать и добавить префикс и суффикс.
-</x-p>
-
-<x-code language="php">
-namespace MoonShine\Resources;
-
-use MoonShine\Metrics\ValueMetric;
-
-class PostResource extends Resource
-{
-    //...
-
-    public function metrics(): array // [tl! focus:start]
-    {
-        return [
-            ValueMetric::make('Profit')
-                ->value(Orders::completed()->sum('price'))
-                ->valueFormat('Today ${value}')
-        ];
-    } // [tl! focus:end]
-
-    //...
-}
-</x-code>
-
-<x-image theme="light" src="{{ asset('screenshots/metrics_value_format.png') }}"></x-image>
-<x-image theme="dark" src="{{ asset('screenshots/metrics_value_format_dark.png') }}"></x-image>
-
-</x-page>
diff --git a/resources/views/pages/ru/components/alert.blade.php b/resources/views/pages/ru/ui/alert.blade.php
similarity index 98%
rename from resources/views/pages/ru/components/alert.blade.php
rename to resources/views/pages/ru/ui/alert.blade.php
index 01e16ef4..f9359642 100644
--- a/resources/views/pages/ru/components/alert.blade.php
+++ b/resources/views/pages/ru/ui/alert.blade.php
@@ -24,7 +24,7 @@
     Изменить тип уведомления можно указав у компонента <code>type</code>.
 </x-p>
 
-@include('pages.ru.components.shared.type')
+@include('pages.ru.ui.shared.type')
 
 <x-code language="blade" file="resources/views/examples/components/alert-type.blade.php"></x-code>
 
diff --git a/resources/views/pages/ru/components/badge.blade.php b/resources/views/pages/ru/ui/badge.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/badge.blade.php
rename to resources/views/pages/ru/ui/badge.blade.php
diff --git a/resources/views/pages/ru/components/boolean.blade.php b/resources/views/pages/ru/ui/boolean.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/boolean.blade.php
rename to resources/views/pages/ru/ui/boolean.blade.php
diff --git a/resources/views/pages/ru/components/box.blade.php b/resources/views/pages/ru/ui/box.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/box.blade.php
rename to resources/views/pages/ru/ui/box.blade.php
diff --git a/resources/views/pages/ru/components/breadcrumbs.blade.php b/resources/views/pages/ru/ui/breadcrumbs.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/breadcrumbs.blade.php
rename to resources/views/pages/ru/ui/breadcrumbs.blade.php
diff --git a/resources/views/pages/ru/components/card.blade.php b/resources/views/pages/ru/ui/card.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/card.blade.php
rename to resources/views/pages/ru/ui/card.blade.php
diff --git a/resources/views/pages/en/components/collapse.blade.php b/resources/views/pages/ru/ui/collapse.blade.php
similarity index 54%
rename from resources/views/pages/en/components/collapse.blade.php
rename to resources/views/pages/ru/ui/collapse.blade.php
index 64ef72f8..f67800ee 100644
--- a/resources/views/pages/en/components/collapse.blade.php
+++ b/resources/views/pages/ru/ui/collapse.blade.php
@@ -1,15 +1,15 @@
 <x-page title="Collapse" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#show', 'label' => 'Show expanded'],
-        ['url' => '#persist', 'label' => 'Save state'],
+    'Разделы' => [
+        ['url' => '#basics', 'label' => 'Основы'],
+        ['url' => '#show', 'label' => 'Отобразить развернутым'],
+        ['url' => '#persist', 'label' => 'Сохранение состояния'],
     ]
 ]">
 
-<x-sub-title id="basics">Basics</x-sub-title>
+<x-sub-title id="basics">Основы</x-sub-title>
 
 <x-p>
-    The <code>moonshine::collapse</code> component allows you to collapse content
+    Компонент <code>moonshine::collapse</code> позволяет сворачивать контент.
 </x-p>
 
 <x-code language="blade" file="resources/views/examples/components/collapse.blade.php"></x-code>
@@ -22,10 +22,11 @@
     </x-moonshine::column>
 </x-moonshine::grid>
 
-<x-sub-title id="show">Show expanded</x-sub-title>
+<x-sub-title id="show">Отобразить развернутым</x-sub-title>
 
 <x-p>
-    If the <code>show</code> parameter is set to <code>TRUE</code>, then by default the block will be displayed expanded
+    Если параметр <code>show</code> имеет значение <code>TRUE</code>,
+    то по умолчанию блок будет отображаться развернутым.
 </x-p>
 
 <x-code language="blade" file="resources/views/examples/components/collapse-show.blade.php"></x-code>
@@ -38,10 +39,10 @@
     </x-moonshine::column>
 </x-moonshine::grid>
 
-<x-sub-title id="persist">Save state</x-sub-title>
+<x-sub-title id="persist">Сохранение состояния</x-sub-title>
 
 <x-p>
-    If the <code>persist</code> parameter is set to <code>TRUE</code>, then the state of the block will be saved
+    Если параметр <code>persist</code> имеет значение <code>TRUE</code>, то будет сохраняться состояние блока.
 </x-p>
 
 <x-code language="blade" file="resources/views/examples/components/collapse-persist.blade.php"></x-code>
diff --git a/resources/views/pages/en/components/divider.blade.php b/resources/views/pages/ru/ui/divider.blade.php
similarity index 59%
rename from resources/views/pages/en/components/divider.blade.php
rename to resources/views/pages/ru/ui/divider.blade.php
index df427e91..3698f838 100644
--- a/resources/views/pages/en/components/divider.blade.php
+++ b/resources/views/pages/ru/ui/divider.blade.php
@@ -1,14 +1,14 @@
 <x-page title="Divider" :sectionMenu="[
-    'Sections' => [
-        ['url' => '#basics', 'label' => 'Basics'],
-        ['url' => '#text', 'label' => 'Text divider'],
+    'Разделы' => [
+        ['url' => '#basics', 'label' => 'Основы'],
+        ['url' => '#text', 'label' => 'Текстовый разделитель'],
     ]
 ]">
 
-<x-sub-title id="basics">Basics</x-sub-title>
+<x-sub-title id="basics">Основы</x-sub-title>
 
 <x-p>
-    The <code>moonshine::divider</code> component allows you to create a stylized content divider
+    Компонент <code>moonshine::divider</code> позволяет создать стилизованный разделитель контента.
 </x-p>
 
 <x-code language="blade" file="resources/views/examples/components/divider.blade.php"></x-code>
@@ -21,10 +21,10 @@
     </x-moonshine::column>
 </x-moonshine::grid>
 
-<x-sub-title id="text">Text divider</x-sub-title>
+<x-sub-title id="text">Текстовый разделитель</x-sub-title>
 
 <x-p>
-    You can use text as a separator, for this you need to specify the text in the <code>label</code> parameter
+    В качестве разделителя можно использовать текст. Для этого необходимо указать текст в параметре <code>label</code>.
 </x-p>
 
 <x-code language="blade" file="resources/views/examples/components/divider-label.blade.php"></x-code>
@@ -38,7 +38,7 @@
 </x-moonshine::grid>
 
 <x-p>
-    The <code>centered</code> parameter allows you to center the text
+    Параметр <code>centered</code> позволяет разместить текст по центру.
 </x-p>
 
 <x-code language="blade" file="resources/views/examples/components/divider-label-center.blade.php"></x-code>
diff --git a/resources/views/pages/ru/components/dropdown.blade.php b/resources/views/pages/ru/ui/dropdown.blade.php
similarity index 97%
rename from resources/views/pages/ru/components/dropdown.blade.php
rename to resources/views/pages/ru/ui/dropdown.blade.php
index 3b5d94ba..c40b8930 100644
--- a/resources/views/pages/ru/components/dropdown.blade.php
+++ b/resources/views/pages/ru/ui/dropdown.blade.php
@@ -30,7 +30,7 @@
 
 <x-sub-title id="placement">Расположение</x-sub-title>
 
-@include('pages.ru.components.shared.placement')
+@include('pages.ru.ui.shared.placement')
 
 <x-code language="blade" file="resources/views/examples/components/dropdown-placement.blade.php"></x-code>
 
diff --git a/resources/views/pages/ru/components/files.blade.php b/resources/views/pages/ru/ui/files.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/files.blade.php
rename to resources/views/pages/ru/ui/files.blade.php
diff --git a/resources/views/pages/ru/components/form.blade.php b/resources/views/pages/ru/ui/form.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/form.blade.php
rename to resources/views/pages/ru/ui/form.blade.php
diff --git a/resources/views/pages/ru/components/grid.blade.php b/resources/views/pages/ru/ui/grid.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/grid.blade.php
rename to resources/views/pages/ru/ui/grid.blade.php
diff --git a/resources/views/pages/ru/components/icon.blade.php b/resources/views/pages/ru/ui/icon.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/icon.blade.php
rename to resources/views/pages/ru/ui/icon.blade.php
diff --git a/resources/views/pages/ru/ui/index.blade.php b/resources/views/pages/ru/ui/index.blade.php
new file mode 100644
index 00000000..a18687a3
--- /dev/null
+++ b/resources/views/pages/ru/ui/index.blade.php
@@ -0,0 +1,19 @@
+<x-page title="Components">
+
+<x-p>
+    Для создания интерфейса админ-панели <strong>MoonShine</strong> используется множество <em>UI компонентов</em>.<br />
+    Вы можете воспользоваться этими компонентами для построения своих шаблонов,
+    кастомных полей, фильтров, декораций или страниц.<br />
+    Использование компонентов ускоряет разработку и позволяет сохранить единую стилистику проекта.
+</x-p>
+
+<x-p>
+    Если вы планируете использовать компоненты за пределами админ-панели,
+    то необходимо ваш шаблон добавить директиву с ассетами MoonShine.
+</x-p>
+
+<x-code language="blade">
+    @@moonShineAssets
+</x-code>
+
+</x-page>
diff --git a/resources/views/pages/ru/components/link.blade.php b/resources/views/pages/ru/ui/link.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/link.blade.php
rename to resources/views/pages/ru/ui/link.blade.php
diff --git a/resources/views/pages/ru/components/loader.blade.php b/resources/views/pages/ru/ui/loader.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/loader.blade.php
rename to resources/views/pages/ru/ui/loader.blade.php
diff --git a/resources/views/pages/ru/components/modal.blade.php b/resources/views/pages/ru/ui/modal.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/modal.blade.php
rename to resources/views/pages/ru/ui/modal.blade.php
diff --git a/resources/views/pages/ru/components/offcanvas.blade.php b/resources/views/pages/ru/ui/offcanvas.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/offcanvas.blade.php
rename to resources/views/pages/ru/ui/offcanvas.blade.php
diff --git a/resources/views/pages/ru/components/paginations.blade.php b/resources/views/pages/ru/ui/paginations.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/paginations.blade.php
rename to resources/views/pages/ru/ui/paginations.blade.php
diff --git a/resources/views/pages/ru/components/popover.blade.php b/resources/views/pages/ru/ui/popover.blade.php
similarity index 96%
rename from resources/views/pages/ru/components/popover.blade.php
rename to resources/views/pages/ru/ui/popover.blade.php
index 2fc247a4..b9edec0f 100644
--- a/resources/views/pages/ru/components/popover.blade.php
+++ b/resources/views/pages/ru/ui/popover.blade.php
@@ -10,7 +10,7 @@
     C помощью компонента <code>moonshine::popover</code> можно создать всплывающее окно.
 </x-p>
 
-@include('pages.ru.components.shared.placement')
+@include('pages.ru.ui.shared.placement')
 
 <x-code language="blade" file="resources/views/examples/components/popover.blade.php"></x-code>
 
diff --git a/resources/views/pages/ru/components/progress_bar.blade.php b/resources/views/pages/ru/ui/progress_bar.blade.php
similarity index 93%
rename from resources/views/pages/ru/components/progress_bar.blade.php
rename to resources/views/pages/ru/ui/progress_bar.blade.php
index 514a5e60..f631d55e 100644
--- a/resources/views/pages/ru/components/progress_bar.blade.php
+++ b/resources/views/pages/ru/ui/progress_bar.blade.php
@@ -11,7 +11,7 @@
     Компонент <code>moonshine::progress-bar</code> позволяет создавать индикатор прогресса.
 </x-p>
 
-@include('pages.ru.components.shared.themes-colors')
+@include('pages.ru.ui.shared.themes-colors')
 
 <x-code language="blade" file="resources/views/examples/components/progress_bar.blade.php"></x-code>
 
@@ -29,7 +29,7 @@
     Для создания радиального индикатора прогресса необходимо компоненту передать параметр <code>radial</code> со значением <code>TRUE</code>.
 </x-p>
 
-@include('pages.ru.components.shared.sizes')
+@include('pages.ru.ui.shared.sizes')
 
 <x-code language="blade" file="resources/views/examples/components/progress_bar-radial.blade.php"></x-code>
 
diff --git a/resources/views/pages/ru/components/rating.blade.php b/resources/views/pages/ru/ui/rating.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/rating.blade.php
rename to resources/views/pages/ru/ui/rating.blade.php
diff --git a/resources/views/pages/ru/components/shared/colors.blade.php b/resources/views/pages/ru/ui/shared/colors.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/shared/colors.blade.php
rename to resources/views/pages/ru/ui/shared/colors.blade.php
diff --git a/resources/views/pages/ru/components/shared/placement.blade.php b/resources/views/pages/ru/ui/shared/placement.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/shared/placement.blade.php
rename to resources/views/pages/ru/ui/shared/placement.blade.php
diff --git a/resources/views/pages/ru/components/shared/sizes.blade.php b/resources/views/pages/ru/ui/shared/sizes.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/shared/sizes.blade.php
rename to resources/views/pages/ru/ui/shared/sizes.blade.php
diff --git a/resources/views/pages/ru/components/shared/themes-colors.blade.php b/resources/views/pages/ru/ui/shared/themes-colors.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/shared/themes-colors.blade.php
rename to resources/views/pages/ru/ui/shared/themes-colors.blade.php
diff --git a/resources/views/pages/ru/components/shared/type.blade.php b/resources/views/pages/ru/ui/shared/type.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/shared/type.blade.php
rename to resources/views/pages/ru/ui/shared/type.blade.php
diff --git a/resources/views/pages/ru/components/spinner.blade.php b/resources/views/pages/ru/ui/spinner.blade.php
similarity index 95%
rename from resources/views/pages/ru/components/spinner.blade.php
rename to resources/views/pages/ru/ui/spinner.blade.php
index 90a2f550..eb2956a4 100644
--- a/resources/views/pages/ru/components/spinner.blade.php
+++ b/resources/views/pages/ru/ui/spinner.blade.php
@@ -24,7 +24,7 @@
 
 <x-sub-title id="size">Размер</x-sub-title>
 
-@include('pages.ru.components.shared.sizes')
+@include('pages.ru.ui.shared.sizes')
 
 <x-code language="blade" file="resources/views/examples/components/spinner-size.blade.php"></x-code>
 
@@ -38,7 +38,7 @@
 
 <x-sub-title id="color">Цвет</x-sub-title>
 
-@include('pages.ru.components.shared.themes-colors')
+@include('pages.ru.ui.shared.themes-colors')
 
 <x-code language="blade" file="resources/views/examples/components/spinner-color.blade.php"></x-code>
 
diff --git a/resources/views/pages/ru/components/table.blade.php b/resources/views/pages/ru/ui/table.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/table.blade.php
rename to resources/views/pages/ru/ui/table.blade.php
diff --git a/resources/views/pages/ru/components/tabs.blade.php b/resources/views/pages/ru/ui/tabs.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/tabs.blade.php
rename to resources/views/pages/ru/ui/tabs.blade.php
diff --git a/resources/views/pages/ru/components/thumbnail.blade.php b/resources/views/pages/ru/ui/thumbnail.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/thumbnail.blade.php
rename to resources/views/pages/ru/ui/thumbnail.blade.php
diff --git a/resources/views/pages/ru/components/title.blade.php b/resources/views/pages/ru/ui/title.blade.php
similarity index 100%
rename from resources/views/pages/ru/components/title.blade.php
rename to resources/views/pages/ru/ui/title.blade.php
diff --git a/resources/views/pages/ru/components/toast.blade.php b/resources/views/pages/ru/ui/toast.blade.php
similarity index 96%
rename from resources/views/pages/ru/components/toast.blade.php
rename to resources/views/pages/ru/ui/toast.blade.php
index f9b85b0b..a88c419d 100644
--- a/resources/views/pages/ru/components/toast.blade.php
+++ b/resources/views/pages/ru/ui/toast.blade.php
@@ -12,7 +12,7 @@
 
 <x-code language="blade" file="resources/views/examples/components/toast.blade.php"></x-code>
 
-@include('pages.ru.components.shared.type')
+@include('pages.ru.ui.shared.type')
 
 <x-code language="blade" file="resources/views/examples/components/toast-type.blade.php"></x-code>
 
diff --git a/resources/views/pages/ru/components/tooltip.blade.php b/resources/views/pages/ru/ui/tooltip.blade.php
similarity index 96%
rename from resources/views/pages/ru/components/tooltip.blade.php
rename to resources/views/pages/ru/ui/tooltip.blade.php
index 75ec3c5f..7a19b466 100644
--- a/resources/views/pages/ru/components/tooltip.blade.php
+++ b/resources/views/pages/ru/ui/tooltip.blade.php
@@ -11,7 +11,7 @@
     C помощью компонента <code>moonshine::tooltip</code> можно создавать удобные подсказки.
 </x-p>
 
-@include('pages.ru.components.shared.placement')
+@include('pages.ru.ui.shared.placement')
 
 <x-code language="blade" file="resources/views/examples/components/tooltip.blade.php"></x-code>