Ai Loop Shell code

@props([
    'title' => 'Agent loops',
    'description' => null,
    'layout' => 'default',
])

@php
    /*
    | Page layout for AI agent loop workflows. Compose loop list, goal tracker,
    | activity feed, approvals, summaries and the prompt composer.
    |
    | layout:
    |   default   — classic stacked layout for the component showcase
    |   workspace — context + secondary panels in the sidebar; expandable
    |               main panels via `panels` and `sidebarStack` slots
    |
    | Slots:
    |   sidebar       — loop list or secondary navigation
    |   sidebarStack  — expandable panels below the loop list (workspace)
    |   context       — project / branch selectors
    |   panels        — expandable main-column panels (workspace)
    |   goal          — goal tracker
    |   history       — cross-iteration timeline (default layout)
    |   activity      — iteration activity feed (default layout)
    |   summary       — run summary cards (default layout)
    |   changeSet     — files changed this run (default layout)
    |   runLog        — scrollable conversation log (default layout)
    |   approvals     — pending approval requests (default layout)
    |   prompter      — prompt composer
    */
    $hasSidebar = isset($sidebar);
    $isWorkspace = $layout === 'workspace';
@endphp

<div {{ $attributes->merge(['class' => 'mx-auto w-full min-w-0 max-w-7xl space-y-6']) }}>
    <div class="grid gap-6 lg:grid-cols-12 lg:items-start">
        <header class="space-y-2 lg:col-span-12">
            <h1 class="text-xl font-semibold tracking-tight text-gray-900 sm:text-2xl dark:text-white">{{ $title }}</h1>
            @if ($description)
                <p class="max-w-3xl text-sm leading-6 text-gray-600 dark:text-gray-400">{{ $description }}</p>
            @endif
        </header>

        @if ($hasSidebar)
            <aside class="min-w-0 space-y-4 lg:sticky lg:top-24 lg:col-span-4 xl:col-span-3">
                @if ($isWorkspace && isset($context))
                    <section class="min-w-0 w-full">{{ $context }}</section>
                @endif

                {{ $sidebar }}

                @if ($isWorkspace && isset($sidebarStack))
                    <div class="space-y-3">
                        {{ $sidebarStack }}
                    </div>
                @endif
            </aside>
        @endif

        <div @class([
            'min-w-0 space-y-4',
            'lg:col-span-8 xl:col-span-9' => $hasSidebar,
            'lg:col-span-12' => ! $hasSidebar,
        ])>
            @if (! $isWorkspace && isset($context))
                <section class="min-w-0 w-full">{{ $context }}</section>
            @endif

            @if ($isWorkspace)
                @isset($goal)
                    <section class="min-w-0 w-full">{{ $goal }}</section>
                @endisset

                @isset($panels)
                    <div class="space-y-3">
                        {{ $panels }}
                    </div>
                @endisset

                @isset($prompter)
                    <section class="min-w-0 w-full">{{ $prompter }}</section>
                @endisset
            @else
                @isset($approvals)
                    <section class="min-w-0 w-full">{{ $approvals }}</section>
                @endisset

                @isset($goal)
                    <section class="min-w-0 w-full">{{ $goal }}</section>
                @endisset

                @isset($history)
                    <section class="min-w-0 w-full">{{ $history }}</section>
                @endisset

                @if (isset($activity) || isset($summary))
                    <div class="grid min-w-0 gap-6 lg:grid-cols-2">
                        @isset($activity)
                            <section class="min-w-0 w-full">{{ $activity }}</section>
                        @endisset

                        @isset($summary)
                            <section class="min-w-0 w-full">{{ $summary }}</section>
                        @endisset
                    </div>
                @endif

                @if (isset($changeSet) || isset($runLog))
                    <div class="grid min-w-0 gap-6 lg:grid-cols-2">
                        @isset($changeSet)
                            <section class="min-w-0 w-full">{{ $changeSet }}</section>
                        @endisset

                        @isset($runLog)
                            <section class="min-w-0 w-full">{{ $runLog }}</section>
                        @endisset
                    </div>
                @endif

                @isset($prompter)
                    <section class="min-w-0 w-full">{{ $prompter }}</section>
                @endisset
            @endif

            @if (trim($slot) !== '')
                <div class="min-w-0 w-full">{{ $slot }}</div>
            @endif
        </div>
    </div>
</div>