{{-- Expects: $name (form field name), $value (initial HTML/text content) --}}
<div class="rich-editor overflow-hidden rounded border border-gray-300">
    <div class="flex gap-1 border-b border-gray-200 bg-gray-50 px-2 py-1">
        <button type="button" data-cmd="bold" class="rounded px-2 py-1 text-sm font-bold text-gray-700 hover:bg-gray-200" title="Bold">B</button>
        <button type="button" data-cmd="insertOrderedList" class="rounded px-2 py-1 text-sm text-gray-700 hover:bg-gray-200" title="Penomoran">1.</button>
        <button type="button" data-cmd="insertUnorderedList" class="rounded px-2 py-1 text-sm text-gray-700 hover:bg-gray-200" title="Bullet">&bull;</button>
    </div>
    <div class="rich-editor-body min-h-[100px] px-3 py-2 text-sm focus:outline-none" contenteditable="true"></div>
    <textarea name="{{ $name }}" class="rich-editor-source hidden">{{ $value }}</textarea>
</div>