// Tiny DOM-builder helper shared by the dashboard and the per-agent UI —
// both packages built their own copy independently; this is the merged
// canonical version (dashboard's, which had the extra `data-` branch;
// functionally identical to the `class`/`html` handling either package
// used).
//
// `el(tag, attrs, ...children)` creates an element, applying `attrs` as
// either the `class`/`html`/`is` special cases or plain attributes, and
// appending `children` (strings become text nodes, `null`/`undefined`
// entries are skipped so callers can inline conditional children).
// `is: 'custom-name'` creates a customized built-in element (e.g.
// `el('button', { is: 'hive-btn' }, 'label')` → `<button is="hive-btn">`)
// — passed to `document.createElement` itself, since a customized
// built-in has to be created with its `is` option up front, not upgraded
// after the fact via `setAttribute`.
export const el = (tag, attrs = {}, ...children) => {
  const e = attrs.is ? document.createElement(tag, { is: attrs.is }) : document.createElement(tag);
  for (const [k, v] of Object.entries(attrs)) {
    if (k === 'is') continue;
    if (k === 'class') e.className = v;
    else if (k === 'html') e.innerHTML = v;
    else e.setAttribute(k, v);
  }
  for (const c of children) {
    if (c == null) continue;
    e.append(c.nodeType ? c : document.createTextNode(c));
  }
  return e;
};