{% props id: String, action: String, note: String = "Answers come from your organisation's documents.", history: Slot = Slot::default(), inner_block: Slot, open: bool = false %}
{#- action: where a message posts (as message); history: the recent chats' links; inner_block: the thread. #}
<dialog class="ui-assistant" id="{{ id }}" aria-label="Assistant"{% if open %} open{% end %}>
<nav class="ui-assistant-history" aria-label="Previous chats">{{ history }}</nav>
<div class="ui-assistant-main">
<div class="ui-assistant-head"><strong>Assistant</strong><span class="ui-ai-badge"><svg class="ui-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M9.937 15.5A2 2 0 0 0 8.5 14.063l-6.135-1.582a.5.5 0 0 1 0-.962L8.5 9.936A2 2 0 0 0 9.937 8.5l1.582-6.135a.5.5 0 0 1 .963 0L14.063 8.5A2 2 0 0 0 15.5 9.937l6.135 1.581a.5.5 0 0 1 0 .964L15.5 14.063a2 2 0 0 0-1.437 1.437l-1.582 6.135a.5.5 0 0 1-.963 0z"/><path d="M20 3v4"/><path d="M22 5h-4"/></svg>AI</span><form method="dialog" style="margin-left:auto"><button class="ui-btn" data-variant="ghost" data-size="icon-sm" aria-label="Close"><svg class="ui-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg></button></form></div>
<div class="ui-assistant-thread" aria-live="polite">{{ inner_block }}</div>
<form class="ui-assistant-compose" method="post" action="{{ action }}">{{ csrf_field() }}<div class="ui-assistant-box"><textarea name="message" placeholder="Ask about a policy or process…" aria-label="Message"></textarea><button class="ui-btn" data-size="icon-sm" aria-label="Send"><svg class="ui-icon" viewBox="0 0 24 24" aria-hidden="true"><path d="M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z"/><path d="m21.854 2.147-10.94 10.939"/></svg></button></div><div class="ui-assistant-note">{{ note }}</div></form>
</div>
</dialog>