Merge pull request #7 from tjodalv/feature/infolists-support-and-badg…

…e-fix

added support for filament infolist components and correctly implement accordion item badge

resources/views/components/accordion/item.blade.php

@@ -3,6 +3,8 @@
     'isIsolated' => false,
     'icon' => null,
     'label' => '',
+    'badge' => null,
+    'badgeColor' => null,
 ])
 <div
     x-data="{
@@ -34,6 +36,12 @@ class="fi-accordion-item-icon h-6 w-6 shrink-0 transition duration-75"
                 />
             @endif
             {{ $label }}
+
+            @if (filled($badge))
+                <x-filament::badge :color="$badgeColor" size="sm" class="w-max">
+                    {{ $badge }}
+                </x-filament::badge>
+            @endif
         </span>
         <span :class="{ 'rotate-180': activeAccordion == id }">
             @svg('heroicon-m-chevron-down','w-4 h-4 duration-200 ease-out')

resources/views/forms/accordions.blade.php

@@ -25,6 +25,8 @@
             <x-zeus-accordion::accordion.item
                     :label="$accordion->getLabel()"
                     :icon="$accordion->getIcon()"
+                    :badge="$accordion->getBadge()"
+                    :badge-color="$accordion->getBadgeColor()"
                     :isIsolated="$isIsolated"
                     :activeAccordion="$getActiveAccordion">
                 {{ $accordion }}

resources/views/infolists/accordion.blade.php

@@ -0,0 +1,3 @@
+<div>
+    {{ $getChildComponentContainer() }}
+</div>

resources/views/infolists/accordions.blade.php

@@ -0,0 +1,36 @@
+<div
+    wire:ignore.self
+    x-cloak
+    {{
+        $attributes
+            ->merge([
+                'id' => $getId(),
+                'wire:key' => "{$this->getId()}.{$getStatePath()}." . Accordions::class . '.container',
+            ], escape: false)
+            ->merge($getExtraAttributes(), escape: false)
+            ->merge($getExtraAlpineAttributes(), escape: false)
+            ->class([
+                'rounded-xl bg-white shadow-sm ring-1 ring-gray-950/5 dark:bg-gray-900 dark:ring-white/10',
+            ])
+    }}
+>
+
+    @php
+        $isIsolated = $isIsolated();
+        $getActiveAccordion = $getActiveAccordion();
+    @endphp
+
+    <x-zeus-accordion::accordion :activeAccordion="$getActiveAccordion">
+        @foreach ($getChildComponentContainer()->getComponents() as $accordion)
+            <x-zeus-accordion::accordion.item
+                    :label="$accordion->getLabel()"
+                    :icon="$accordion->getIcon()"
+                    :badge="$accordion->getBadge()"
+                    :badge-color="$accordion->getBadgeColor()"
+                    :isIsolated="$isIsolated"
+                    :activeAccordion="$getActiveAccordion">
+                {{ $accordion }}
+            </x-zeus-accordion::accordion.item>
+        @endforeach
+    </x-zeus-accordion::accordion>
+</div>

src/Forms/Accordion.php

@@ -5,12 +5,14 @@
 use Closure;
 use Filament\Forms\Components\Component;
 use Filament\Forms\Components\Contracts\CanConcealComponents;
+use Filament\Support\Concerns\HasBadge;
 use Filament\Support\Concerns\HasIcon;
 use Illuminate\Support\Str;
 
 class Accordion extends Component implements CanConcealComponents
 {
     use HasIcon;
+    use HasBadge;
 
     protected string $view = 'zeus-accordion::forms.accordion';
 
@@ -42,11 +44,4 @@ public static function make(string | Closure | null $label = null): static
 
         return $static;
     }
-
-    public function badge(string | Closure | null $badge): static
-    {
-        $this->badge = $badge;
-
-        return $this;
-    }
 }

src/Infolists/Accordion.php

@@ -0,0 +1,41 @@
+<?php
+
+namespace LaraZeus\Accordion\Infolists;
+
+use Closure;
+use Filament\Infolists\Components\Component;
+use Filament\Support\Concerns\HasBadge;
+use Filament\Support\Concerns\HasIcon;
+use Illuminate\Support\Str;
+
+class Accordion extends Component
+{
+    use HasIcon;
+    use HasBadge;
+
+    protected string $view = 'zeus-accordion::infolists.accordion';
+
+    final public function __construct(string $label)
+    {
+        $this->label($label);
+        $this->id(Str::slug($label));
+    }
+
+    public function getId(): string
+    {
+        return $this->getContainer()->getParentComponent()->getId() . '-' . parent::getId() . '-accordion';
+    }
+
+    public function getColumnsConfig(): array
+    {
+        return $this->columns ?? $this->getContainer()->getColumnsConfig();
+    }
+
+    public static function make(string | Closure | null $label = null): static
+    {
+        $static = app(static::class, ['label' => $label]);
+        $static->configure();
+
+        return $static;
+    }
+}

src/Infolists/Accordions.php

@@ -0,0 +1,50 @@
+<?php
+
+namespace LaraZeus\Accordion\Infolists;
+
+use Closure;
+use Filament\Infolists\Components\Component;
+use Filament\Support\Concerns;
+use LaraZeus\Accordion\Concerns\CanBeIsolated;
+
+class Accordions extends Component
+{
+    use CanBeIsolated;
+    use Concerns\HasExtraAlpineAttributes;
+
+    protected string $view = 'zeus-accordion::infolists.accordions';
+
+    protected int | Closure $activeAccordion = 1;
+
+    final public function __construct(?string $label = null)
+    {
+        $this->label($label);
+    }
+
+    public static function make(?string $label = null): static
+    {
+        $static = app(static::class, ['label' => $label]);
+        $static->configure();
+
+        return $static;
+    }
+
+    public function activeAccordion(int | Closure $activeAccordion): static
+    {
+        $this->activeAccordion = $activeAccordion;
+
+        return $this;
+    }
+
+    public function getActiveAccordion(): int
+    {
+        return $this->evaluate($this->activeAccordion);
+    }
+
+    public function accordions(array | Closure $accordions): static
+    {
+        $this->childComponents($accordions);
+
+        return $this;
+    }
+}