import { element } from "html-standard";

// Basic elements
element("button").implicitRole(); // 'button'
element("nav").implicitRole(); // 'navigation'

// Attribute-dependent roles
element("a", {
  attributes: { get: (key) => (key === "href" ? "https://example.com" : null) },
}).implicitRole(); // 'link'

element("a").implicitRole(); // 'generic' (no href)

element("input", {
  attributes: { get: (key) => (key === "type" ? "checkbox" : null) },
}).implicitRole(); // 'checkbox'

import { element } from "html-standard";

const link = element("link");

// Validate 'rel' attribute
link.attributes.get("rel")?.validateValue("stylesheet"); // { valid: true, ... }
link.attributes.get("rel")?.validateValue("invalid-value"); // { valid: false, ... }