<%
  // Multi-select label picker (checkboxes named "labels"). Expects locals:
  //   labelOptions – array of all selectable labels
  //   selected     – array of currently selected labels (optional)
  var _opts = (typeof labelOptions !== 'undefined' && labelOptions) ? labelOptions : [];
  var _sel = (typeof selected !== 'undefined' && selected) ? selected : [];
%>
<div class="flex flex-wrap gap-2">
    <% _opts.forEach(function (opt) { %>
        <label class="inline-flex items-center gap-2 px-3 py-1.5 rounded-full border cursor-pointer text-sm transition-colors border-gray-300 dark:border-gray-600 hover:bg-gray-50 dark:hover:bg-gray-700">
            <input type="checkbox" name="labels" value="<%= opt %>" <%= _sel.indexOf(opt) !== -1 ? 'checked' : '' %>
                class="rounded border-gray-300 dark:border-gray-500 text-blue-600 focus:ring-blue-500">
            <span class="text-gray-700 dark:text-gray-200"><%= opt %></span>
        </label>
    <% }); %>
</div>
