/**
 * `<mark-ui>` — token-driven inline text highlight (search-match,
 * "new since", diff prose). Theme-aware wrapper around the native
 * `<mark>` semantic role. Pure CSS atom — no template, no JS behavior.
 */

import { UIElement } from '../../core/element.js';

export class UIMark extends UIElement {
  static properties = {
    variant: { type: String, default: 'warning', reflect: true }, // warning | info | success | danger | muted
  };

  static template = () => null;

  connected() {
    super.connected();
    // Inherit the <mark> role for screen readers — "highlighted" / "marked"
    // is the conventional AT announcement for search matches.
    if (!this.hasAttribute('role')) this.setAttribute('role', 'mark');
  }
}
