{{--
    Campo WYSIWYG editorial reutilizável. Porte de views/partials/rich-editor.php.
    Variáveis esperadas: $richEditorId, $richEditorName, $richEditorValue.
    Opcionais: $richEditorPlaceholder, $richEditorMaxlength, $richEditorUploadUrl, $richEditorHint.
--}}
@php
    $richEditorId = (string) ($richEditorId ?? $richEditorName ?? 'rich-text');
    $richEditorName = (string) ($richEditorName ?? $richEditorId);
    $richEditorValue = \App\Services\RichTextSanitizer::clean((string) ($richEditorValue ?? ''));
    $richEditorPlaceholder = (string) ($richEditorPlaceholder ?? 'Escreva aqui…');
    $richEditorMaxlength = (int) ($richEditorMaxlength ?? 0);
    $richEditorUploadUrl = (string) ($richEditorUploadUrl ?? '');
    $richEditorMentionsUrl = (string) ($richEditorMentionsUrl ?? '');
    $richEditorHint = (string) ($richEditorHint ?? 'Use formatação simples, links e listas.');
@endphp
<div class="rich-editor" data-rich-editor
     @if ($richEditorUploadUrl !== '') data-upload-url="{{ $richEditorUploadUrl }}" @endif
     @if ($richEditorMentionsUrl !== '') data-mentions-url="{{ $richEditorMentionsUrl }}" @endif
     @if ($richEditorMaxlength > 0) data-maxlength="{{ $richEditorMaxlength }}" @endif>
    <div class="rich-editor-toolbar" role="toolbar" aria-label="Formatação do campo">
        <button type="button" data-editor-command="bold" title="Negrito" aria-label="Negrito"><i class="ic sm">format_bold</i></button>
        <button type="button" data-editor-command="italic" title="Itálico" aria-label="Itálico"><i class="ic sm">format_italic</i></button>
        <button type="button" data-editor-command="underline" title="Sublinhado" aria-label="Sublinhado"><i class="ic sm">format_underlined</i></button>
        <button type="button" data-editor-command="insertUnorderedList" title="Lista" aria-label="Lista"><i class="ic sm">format_list_bulleted</i></button>
        <button type="button" data-editor-command="insertOrderedList" title="Lista numerada" aria-label="Lista numerada"><i class="ic sm">format_list_numbered</i></button>
        <button type="button" data-editor-command="formatBlock" data-editor-value="h3" title="Título" aria-label="Título"><i class="ic sm">title</i></button>
        <button type="button" data-editor-command="formatBlock" data-editor-value="blockquote" title="Citação" aria-label="Citação"><i class="ic sm">format_quote</i></button>
        <button type="button" data-editor-link title="Inserir link" aria-label="Inserir link"><i class="ic sm">link</i></button>
        @if ($richEditorUploadUrl !== '')
            <button type="button" data-editor-image title="Inserir imagem" aria-label="Inserir imagem"><i class="ic sm">image</i></button>
            <input type="file" data-editor-image-input accept="image/jpeg,image/png,image/webp" hidden>
        @endif
    </div>
    <div id="{{ $richEditorId }}-surface" class="rich-editor-surface" data-rich-editor-surface contenteditable="true" role="textbox" aria-multiline="true" data-placeholder="{{ $richEditorPlaceholder }}">{!! $richEditorValue !!}</div>
    @if ($richEditorMentionsUrl !== '')<div class="rich-editor-mention-suggestions" data-rich-editor-mentions role="listbox" aria-label="Referências" hidden></div>@endif
    <input type="hidden" id="{{ $richEditorId }}" name="{{ $richEditorName }}" data-rich-editor-input value="">
    <small class="rich-editor-hint">{{ $richEditorHint }}</small>
</div>