Merge remote-tracking branch 'origin/main'

# Conflicts:
#	README.md

Author: sten

README.md

@@ -196,19 +196,33 @@ class Product extends Model implements HasMenuLabel
 If you are using the Flexible Content Blocks title trait in your model, you can implement `HasMenuLabel` 
 easily with [`HasTitleMenuLabelTrait`](src/Models/Concerns/HasTitleMenuLabelTrait.php).
 
-### Customizing menu styles
+### Using the 'default' menu style
 
-The package includes several built-in menu styles, but you can easily add your own:
+The package includes a `default` built-in menu style which is developed in a generic way so that you can tweak its styling by passing some attributes without having to publish the corresponding blade templates.
+
+Example usage to have a horizontal menu using tailwind:
+```blade
+<x-flexible-pages-menu
+    code="HEADER"
+    style="default"
+    ulClass="flex flex-row justify-start items-center gap-x-4"
+    itemLinkClass="text-black hover:text-primary hover:underline"
+    currentItemLinkClass="text-grey hover:no-underline"
+/>
+```
+
+See the file `../tailwind/components/menu/default.blade.php` for all possible attributes.
+
+### Customizing additional menu styles
+
+If needed, you can easily add your own menu styles in addition to the `default` style:
 
 1. **Add new styles to config:**
 ```php
 // config/filament-flexible-content-block-pages.php
 'menu' => [
     'styles' => [
         'default',
-        'horizontal', 
-        'vertical',
-        'dropdown',
         'mega', // Your custom style
     ],
 ],
@@ -226,7 +240,7 @@ resources/views/vendor/filament-flexible-content-block-pages/tailwind/components
 
 3. **Use in your templates:**
 ```blade
-<x-flexible-pages-menu code="header" style="mega" />
+<x-flexible-pages-menu code="HEADER" style="mega" />
 ```
 
 The style can also be configured in the database model, then you can skip the `style` attribute.
@@ -385,17 +399,19 @@ TODO
 
 check: 
 - do install docs work
-- tailwind config complete? do we need to add flexible content blocks styling?
-- menu components ok?
+- Seppe: tailwind config complete? do we need to add flexible content blocks styling?
+- Seppe: menu components ok?
 
-menu: 
+menu:
 - page delete modal when page used in menu
   - orm listeners for linkable models that are in a menu to avoid accidental deletion.
 - caching tree model + observer to clear cache
-- add menu to default page template
+- Menu titels
+- Ben: add menu to default page template
 - test global search and improve table search and ordering
 
 page:
+- Kristof: make table searchable, columns orderable, test global search
 - make table searchable, columns orderable, test global search
 - laravel scout
 
@@ -406,7 +422,7 @@ release:
 - redirect controller
 - tag controller
 - documentation
-- screenshots + banner + packagist + filament plugin store
+- Kristof: screenshots + banner + packagist + slack + filament plugin store
 
 future:
 - A simple asset manager (include or not?)

config/filament-flexible-content-block-pages.php

@@ -112,14 +112,9 @@
         'styles' => [
             // Available menu styles (codes only - labels come from translations)
             'default',
-            'horizontal',
-            'vertical',
-            'dropdown',
 
-            // Add your custom styles here:
+            // If needed, add your custom style(s) here:
             // 'mega',
-            // 'mobile',
-            // 'breadcrumb',
         ],
     ],
 

documentation/seeders.md

@@ -59,7 +59,7 @@ $headerMenu = $this->createMenu(
     name: 'Header Navigation',
     code: 'header',
     description: 'Main navigation menu displayed in the header',
-    style: 'horizontal',
+    style: 'default',
     maxDepth: 3
 );
 ```
@@ -153,6 +153,7 @@ protected function createMenuItemForModel(
     Menu|int $menu,
     Model $model,
     string|array|null $label = null,
+    string $link_type = 'model',
     bool $useModelTitle = true,
     bool $isVisible = true,
     string $target = '_self',
@@ -166,6 +167,7 @@ protected function createMenuItemForModel(
 - Falls back to class name + ID if no label provided
 - Sets up polymorphic relationship correctly
 - Supports `use_model_title` for dynamic labels
+- There is also a convenience function `createMenuItemForPageCode` (uses `createMenuItemForModel` under the hood) which will search the Page model based on an input `pageCode`
 
 **Example:**
 ```php
@@ -175,6 +177,7 @@ $page = Page::where('slug', 'about')->first();
 $aboutItem = $this->createMenuItemForModel(
     menu: $menu,
     model: $page,
+    link_type: 'filament-flexible-content-block-pages::page',
     useModelTitle: true
 );
 
@@ -183,6 +186,7 @@ $contactItem = $this->createMenuItemForModel(
     menu: $menu,
     model: $contactPage,
     label: 'Get in Touch',
+    link_type: 'filament-flexible-content-block-pages::page',
     useModelTitle: false
 );
 ```
@@ -252,7 +256,7 @@ class MainMenuSeeder extends MenuSeeder
             name: 'Main Navigation',
             code: 'main',
             description: 'Primary website navigation',
-            style: 'horizontal',
+            style: 'default',
             maxDepth: 3
         );
 

resources/lang/en/filament-flexible-content-block-pages.php

@@ -89,9 +89,6 @@
     'menu' => [
         'styles' => [
             'default' => 'Default menu',
-            'horizontal' => 'Horizontal navigation',
-            'vertical' => 'Sidebar navigation',
-            'dropdown' => 'Dropdown menu',
         ],
         'no_items' => 'No menu items available',
         'mobile_toggle_label' => 'Open main menu',

resources/views/tailwind/components/menu/default-item.blade.php

@@ -1,36 +1,75 @@
 {{-- Default menu item template --}}
+
+@props([
+    'item',
+    'style',
+    'locale',
+
+    'itemClass' => 'menu-item',
+    'itemHasChildrenClass' => 'menu-item--has-children',
+    'currentItemClass' => 'menu-item--current',
+    'activeItemClass' => 'menu-item--active',
+
+    'itemLinkClass' => 'menu-item-link',
+    'currentItemLinkClass' => 'menu-item-link--current',
+    'activeItemLinkClass' => 'menu-item-link--active',
+
+    'subMenuClass' => 'navigation-sub-menu',
+    'level' => 1,
+])
+
 @php
     $hasChildren = $item->children && $item->children->isNotEmpty();
     $isCurrent = $item->isCurrentMenuItem();
     $isActive = $isCurrent || ($hasChildren && $item->hasActiveChildren());
-    
-    $classes = collect(['menu-item'])
-        ->when($hasChildren, fn($collection) => $collection->push('has-children'))
-        ->when($isCurrent, fn($collection) => $collection->push('current'))
-        ->when($isActive, fn($collection) => $collection->push('active'))
-        ->filter()
-        ->implode(' ');
-
-    $linkClasses = collect(['menu-link'])
-        ->when($isCurrent, fn($collection) => $collection->push('current'))
-        ->when($isActive, fn($collection) => $collection->push('active'))
-        ->filter()
-        ->implode(' ');
+
+    $wrapperTag = $isCurrent
+        ? 'span'
+        : 'a';
 @endphp
 
-<li class="{{ $classes }}">
-    <a href="{{ $item->getCompleteUrl($locale) }}" 
-       class="{{ $linkClasses }}"
-       @if($item->getTarget() !== '_self') target="{{ $item->getTarget() }}" @endif
-       @if($isCurrent) aria-current="page" @endif>
+<li @class([
+    $itemClass,
+    "menu-item--level-{$level}",
+    $itemHasChildrenClass => $hasChildren,
+    $currentItemClass => $isCurrent,
+    $activeItemClass => $isActive,
+])>
+    <{{ $wrapperTag }}
+        @if (!$isCurrent) href="{{ $item->getCompleteUrl($locale) }}" @endif
+        @class([
+            $itemLinkClass,
+            "menu-item-link--level-{$level}",
+            $currentItemLinkClass => $isCurrent,
+            $activeItemLinkClass => $isActive,
+        ])
+        @if (!$isCurrent && $item->getTarget() !== '_self') target="{{ $item->getTarget() }}" @endif
+        @if ($isCurrent) aria-current="page" @endif
+    >
         {{ $item->getDisplayLabel($locale) }}
-    </a>
-    
-    @if($hasChildren)
-        <ul class="menu submenu">
-            @foreach($item->children as $child)
-                <x-flexible-pages-menu-item :item="$child" :style="$style" :locale="$locale" />
-            @endforeach
+    </{{ $wrapperTag }}>
+
+    @if ($hasChildren)
+        <ul @class([
+                $subMenuClass,
+                "navigation-sub-menu--level-{$level}",
+            ])
+        >
+            @foreach ($item->children as $child)
+                <x-flexible-pages-menu-item :item="$child"
+                                            :style="$style"
+                                            :locale="$locale"
+                                            :itemClass="$itemClass"
+                                            :itemHasChildrenClass="$itemHasChildrenClass"
+                                            :currentItemClass="$currentItemClass"
+                                            :activeItemClass="$activeItemClass"
+                                            :itemLinkClass="$itemLinkClass"
+                                            :currentItemLinkClass="$currentItemLinkClass"
+                                            :activeItemLinkClass="$activeItemLinkClass"
+                                            :subMenuClass="$subMenuClass"
+                                            :level="$level + 1"
+                />
+          @endforeach
         </ul>
     @endif
-</li>
+</li>

resources/views/tailwind/components/menu/default.blade.php

@@ -1,10 +1,57 @@
 {{-- Default menu template --}}
+
+@props([
+    /* provided by the component */
+    'menu',
+    'items',
+    'style',
+    'locale',
+
+    /* to tweak the display of the menu */
+    'wrapWithNav' => true,
+    'navClass' => 'navigation-menu',
+    'ulClass' => 'navigation-menu-list',
+
+    /* to tweak the display of the individual menu items */
+    'itemClass' => null,
+    'itemHasChildrenClass' => null,
+    'currentItemClass' => null,
+    'activeItemClass' => null,
+    'itemLinkClass' => null,
+    'currentItemLinkClass' => null,
+    'activeItemLinkClass' => null,
+    'subMenuClass' => null,
+
+    /* optional slots */
+    'title',
+])
+
 @if($items && $items->isNotEmpty() && $menu)
-<nav class="menu-navigation" role="navigation" aria-label="{{ $menu->name }}">
-    <ul class="menu">
-        @foreach($items as $item)
-            <x-flexible-pages-menu-item :item="$item" :style="$style" :locale="$locale" />
-        @endforeach
-    </ul>
-</nav>
-@endif
+    @if ($wrapWithNav)
+        <nav class="{{ $navClass }}" aria-label="{{ $menu->name }}">
+    @endif
+        @if (isset($title))
+            {{ $title }}
+        @endif
+
+        <ul class="{{ $ulClass }}">
+            @foreach ($items as $item)
+                <x-flexible-pages-menu-item :item="$item"
+                                            :style="$style"
+                                            :locale="$locale"
+                                            :itemClass="$itemClass"
+                                            :itemHasChildrenClass="$itemHasChildrenClass"
+                                            :currentItemClass="$currentItemClass"
+                                            :activeItemClass="$activeItemClass"
+                                            :itemLinkClass="$itemLinkClass"
+                                            :currentItemLinkClass="$currentItemLinkClass"
+                                            :activeItemLinkClass="$activeItemLinkClass"
+                                            :subMenuClass="$subMenuClass"
+                />
+            @endforeach
+        </ul>
+
+    @if ($wrapWithNav)
+        </nav>
+    @endif
+@endif