html-validate 6.7.0 → 6.9.0

package/dist/cjs/core.js

@@ -1233,6 +1233,27 @@ class Attribute {
     }
 }
 
+function getCSSDeclarations(value) {
+    return value
+        .trim()
+        .split(";")
+        .filter(Boolean)
+        .map((it) => {
+        const [property, value] = it.split(":", 2);
+        return [property.trim(), value ? value.trim() : ""];
+    });
+}
+/**
+ * @internal
+ */
+function parseCssDeclaration(value) {
+    if (!value || value instanceof DynamicValue) {
+        return {};
+    }
+    const pairs = getCSSDeclarations(value);
+    return Object.fromEntries(pairs);
+}
+
 function sliceSize(size, begin, end) {
     if (typeof size !== "number") {
         return size;
@@ -1988,9 +2009,10 @@ class HtmlElement extends DOMNode {
             /* if a unique id is present, use it and short-circuit */
             if (cur.id) {
                 const escaped = escapeSelectorComponent(cur.id);
-                const matches = root.querySelectorAll(`#${escaped}`);
+                const selector = escaped.match(/^\d/) ? `[id="${escaped}"]` : `#${escaped}`;
+                const matches = root.querySelectorAll(selector);
                 if (matches.length === 1) {
-                    parts.push(`#${escaped}`);
+                    parts.push(selector);
                     break;
                 }
             }
@@ -2181,6 +2203,10 @@ class HtmlElement extends DOMNode {
     get id() {
         return this.getAttributeValue("id");
     }
+    get style() {
+        const attr = this.getAttribute("style");
+        return parseCssDeclaration(attr === null || attr === void 0 ? void 0 : attr.value);
+    }
     /**
      * Returns the first child element or null if there are no child elements.
      */
@@ -2986,7 +3012,7 @@ var TRANSFORMER_API;
 /** @public */
 const name = "html-validate";
 /** @public */
-const version = "6.7.0";
+const version = "6.9.0";
 /** @public */
 const homepage = "https://html-validate.org";
 /** @public */
@@ -3307,7 +3333,7 @@ function ruleDocumentationUrl(filename) {
     return `${homepage}/rules/${normalized}.html`;
 }
 
-const defaults$q = {
+const defaults$r = {
     allowExternal: true,
     allowRelative: true,
     allowAbsolute: true,
@@ -3351,7 +3377,7 @@ function matchList(value, list) {
 }
 class AllowedLinks extends Rule {
     constructor(options) {
-        super({ ...defaults$q, ...options });
+        super({ ...defaults$r, ...options });
         this.allowExternal = parseAllow(this.options.allowExternal);
         this.allowRelative = parseAllow(this.options.allowRelative);
         this.allowAbsolute = parseAllow(this.options.allowAbsolute);
@@ -3652,13 +3678,13 @@ class CaseStyle {
     }
 }
 
-const defaults$p = {
+const defaults$q = {
     style: "lowercase",
     ignoreForeign: true,
 };
 class AttrCase extends Rule {
     constructor(options) {
-        super({ ...defaults$p, ...options });
+        super({ ...defaults$q, ...options });
         this.style = new CaseStyle(this.options.style, "attr-case");
     }
     static schema() {
@@ -3720,7 +3746,7 @@ class AttrCase extends Rule {
     }
 }
 
-exports.TokenType = void 0;
+var TokenType;
 (function (TokenType) {
     TokenType[TokenType["UNICODE_BOM"] = 1] = "UNICODE_BOM";
     TokenType[TokenType["WHITESPACE"] = 2] = "WHITESPACE";
@@ -3739,7 +3765,7 @@ exports.TokenType = void 0;
     TokenType[TokenType["CONDITIONAL"] = 15] = "CONDITIONAL";
     TokenType[TokenType["DIRECTIVE"] = 16] = "DIRECTIVE";
     TokenType[TokenType["EOF"] = 17] = "EOF";
-})(exports.TokenType || (exports.TokenType = {}));
+})(TokenType || (TokenType = {}));
 
 /* eslint-disable no-useless-escape */
 const MATCH_UNICODE_BOM = /^\uFEFF/;
@@ -3818,7 +3844,7 @@ class Lexer {
             previousState = context.state;
             previousLength = context.string.length;
         }
-        yield this.token(context, exports.TokenType.EOF, []);
+        yield this.token(context, TokenType.EOF, []);
     }
     token(context, type, data) {
         const size = data.length > 0 ? data[0].length : 0;
@@ -3889,21 +3915,21 @@ class Lexer {
     }
     *tokenizeInitial(context) {
         yield* this.match(context, [
-            [MATCH_UNICODE_BOM, State.INITIAL, exports.TokenType.UNICODE_BOM],
+            [MATCH_UNICODE_BOM, State.INITIAL, TokenType.UNICODE_BOM],
             [MATCH_XML_TAG, State.INITIAL, false],
-            [MATCH_DOCTYPE_OPEN, State.DOCTYPE, exports.TokenType.DOCTYPE_OPEN],
-            [MATCH_WHITESPACE, State.INITIAL, exports.TokenType.WHITESPACE],
-            [MATCH_DIRECTIVE, State.INITIAL, exports.TokenType.DIRECTIVE],
-            [MATCH_CONDITIONAL, State.INITIAL, exports.TokenType.CONDITIONAL],
-            [MATCH_COMMENT, State.INITIAL, exports.TokenType.COMMENT],
+            [MATCH_DOCTYPE_OPEN, State.DOCTYPE, TokenType.DOCTYPE_OPEN],
+            [MATCH_WHITESPACE, State.INITIAL, TokenType.WHITESPACE],
+            [MATCH_DIRECTIVE, State.INITIAL, TokenType.DIRECTIVE],
+            [MATCH_CONDITIONAL, State.INITIAL, TokenType.CONDITIONAL],
+            [MATCH_COMMENT, State.INITIAL, TokenType.COMMENT],
             [false, State.TEXT, false],
         ], "expected doctype");
     }
     *tokenizeDoctype(context) {
         yield* this.match(context, [
-            [MATCH_WHITESPACE, State.DOCTYPE, exports.TokenType.WHITESPACE],
-            [MATCH_DOCTYPE_VALUE, State.DOCTYPE, exports.TokenType.DOCTYPE_VALUE],
-            [MATCH_DOCTYPE_CLOSE, State.TEXT, exports.TokenType.DOCTYPE_CLOSE],
+            [MATCH_WHITESPACE, State.DOCTYPE, TokenType.WHITESPACE],
+            [MATCH_DOCTYPE_VALUE, State.DOCTYPE, TokenType.DOCTYPE_VALUE],
+            [MATCH_DOCTYPE_CLOSE, State.TEXT, TokenType.DOCTYPE_CLOSE],
         ], "expected doctype name");
     }
     *tokenizeTag(context) {
@@ -3930,30 +3956,30 @@ class Lexer {
             }
         }
         yield* this.match(context, [
-            [MATCH_TAG_CLOSE, nextState, exports.TokenType.TAG_CLOSE],
-            [MATCH_ATTR_START, State.ATTR, exports.TokenType.ATTR_NAME],
-            [MATCH_WHITESPACE, State.TAG, exports.TokenType.WHITESPACE],
+            [MATCH_TAG_CLOSE, nextState, TokenType.TAG_CLOSE],
+            [MATCH_ATTR_START, State.ATTR, TokenType.ATTR_NAME],
+            [MATCH_WHITESPACE, State.TAG, TokenType.WHITESPACE],
         ], 'expected attribute, ">" or "/>"');
     }
     *tokenizeAttr(context) {
         yield* this.match(context, [
-            [MATCH_ATTR_SINGLE, State.TAG, exports.TokenType.ATTR_VALUE],
-            [MATCH_ATTR_DOUBLE, State.TAG, exports.TokenType.ATTR_VALUE],
-            [MATCH_ATTR_UNQUOTED, State.TAG, exports.TokenType.ATTR_VALUE],
+            [MATCH_ATTR_SINGLE, State.TAG, TokenType.ATTR_VALUE],
+            [MATCH_ATTR_DOUBLE, State.TAG, TokenType.ATTR_VALUE],
+            [MATCH_ATTR_UNQUOTED, State.TAG, TokenType.ATTR_VALUE],
             [false, State.TAG, false],
         ], 'expected attribute, ">" or "/>"');
     }
     *tokenizeText(context) {
         yield* this.match(context, [
-            [MATCH_WHITESPACE, State.TEXT, exports.TokenType.WHITESPACE],
+            [MATCH_WHITESPACE, State.TEXT, TokenType.WHITESPACE],
             [MATCH_CDATA_BEGIN, State.CDATA, false],
-            [MATCH_DIRECTIVE, State.TEXT, exports.TokenType.DIRECTIVE],
-            [MATCH_CONDITIONAL, State.TEXT, exports.TokenType.CONDITIONAL],
-            [MATCH_COMMENT, State.TEXT, exports.TokenType.COMMENT],
-            [MATCH_TEMPLATING, State.TEXT, exports.TokenType.TEMPLATING],
-            [MATCH_TAG_OPEN, State.TAG, exports.TokenType.TAG_OPEN],
-            [MATCH_TEXT, State.TEXT, exports.TokenType.TEXT],
-            [MATCH_TAG_LOOKAHEAD, State.TEXT, exports.TokenType.TEXT],
+            [MATCH_DIRECTIVE, State.TEXT, TokenType.DIRECTIVE],
+            [MATCH_CONDITIONAL, State.TEXT, TokenType.CONDITIONAL],
+            [MATCH_COMMENT, State.TEXT, TokenType.COMMENT],
+            [MATCH_TEMPLATING, State.TEXT, TokenType.TEMPLATING],
+            [MATCH_TAG_OPEN, State.TAG, TokenType.TAG_OPEN],
+            [MATCH_TEXT, State.TEXT, TokenType.TEXT],
+            [MATCH_TAG_LOOKAHEAD, State.TEXT, TokenType.TEXT],
         ], 'expected text or "<"');
     }
     *tokenizeCDATA(context) {
@@ -3961,21 +3987,21 @@ class Lexer {
     }
     *tokenizeScript(context) {
         yield* this.match(context, [
-            [MATCH_SCRIPT_END, State.TAG, exports.TokenType.TAG_OPEN],
-            [MATCH_SCRIPT_DATA, State.SCRIPT, exports.TokenType.SCRIPT],
+            [MATCH_SCRIPT_END, State.TAG, TokenType.TAG_OPEN],
+            [MATCH_SCRIPT_DATA, State.SCRIPT, TokenType.SCRIPT],
         ], "expected </script>");
     }
     *tokenizeStyle(context) {
         yield* this.match(context, [
-            [MATCH_STYLE_END, State.TAG, exports.TokenType.TAG_OPEN],
-            [MATCH_STYLE_DATA, State.STYLE, exports.TokenType.STYLE],
+            [MATCH_STYLE_END, State.TAG, TokenType.TAG_OPEN],
+            [MATCH_STYLE_DATA, State.STYLE, TokenType.STYLE],
         ], "expected </style>");
     }
 }
 
 const whitespace = /(\s+)/;
 function isRelevant$3(event) {
-    return event.type === exports.TokenType.ATTR_VALUE;
+    return event.type === TokenType.ATTR_VALUE;
 }
 class AttrDelimiter extends Rule {
     documentation() {
@@ -3997,7 +4023,7 @@ class AttrDelimiter extends Rule {
 }
 
 const DEFAULT_PATTERN = "[a-z0-9-:]+";
-const defaults$o = {
+const defaults$p = {
     pattern: DEFAULT_PATTERN,
     ignoreForeign: true,
 };
@@ -4034,7 +4060,7 @@ function generateDescription(name, pattern) {
 }
 class AttrPattern extends Rule {
     constructor(options) {
-        super({ ...defaults$o, ...options });
+        super({ ...defaults$p, ...options });
         this.pattern = generateRegexp(this.options.pattern);
     }
     static schema() {
@@ -4094,13 +4120,13 @@ var QuoteStyle;
     QuoteStyle["DOUBLE_QUOTE"] = "\"";
     QuoteStyle["AUTO_QUOTE"] = "auto";
 })(QuoteStyle || (QuoteStyle = {}));
-const defaults$n = {
+const defaults$o = {
     style: "auto",
     unquoted: false,
 };
 class AttrQuotes extends Rule {
     constructor(options) {
-        super({ ...defaults$n, ...options });
+        super({ ...defaults$o, ...options });
         this.style = parseStyle$4(this.options.style);
     }
     static schema() {
@@ -4179,7 +4205,7 @@ class AttrSpacing extends Rule {
     setup() {
         let previousToken;
         this.on("token", (event) => {
-            if (event.type === exports.TokenType.ATTR_NAME && previousToken !== exports.TokenType.WHITESPACE) {
+            if (event.type === TokenType.ATTR_NAME && previousToken !== TokenType.WHITESPACE) {
                 this.report(null, "No space between attributes", event.location);
             }
             previousToken = event.type;
@@ -4265,12 +4291,12 @@ class AttributeAllowedValues extends Rule {
     }
 }
 
-const defaults$m = {
+const defaults$n = {
     style: "omit",
 };
 class AttributeBooleanStyle extends Rule {
     constructor(options) {
-        super({ ...defaults$m, ...options });
+        super({ ...defaults$n, ...options });
         this.hasInvalidStyle = parseStyle$3(this.options.style);
     }
     static schema() {
@@ -4346,12 +4372,12 @@ function reportMessage$1(attr, style) {
     return "";
 }
 
-const defaults$l = {
+const defaults$m = {
     style: "omit",
 };
 class AttributeEmptyStyle extends Rule {
     constructor(options) {
-        super({ ...defaults$l, ...options });
+        super({ ...defaults$m, ...options });
         this.hasInvalidStyle = parseStyle$2(this.options.style);
     }
     static schema() {
@@ -4459,12 +4485,12 @@ function describePattern(pattern) {
     }
 }
 
-const defaults$k = {
+const defaults$l = {
     pattern: "kebabcase",
 };
 class ClassPattern extends Rule {
     constructor(options) {
-        super({ ...defaults$k, ...options });
+        super({ ...defaults$l, ...options });
         this.pattern = parsePattern(this.options.pattern);
     }
     static schema() {
@@ -4573,13 +4599,13 @@ class CloseOrder extends Rule {
     }
 }
 
-const defaults$j = {
+const defaults$k = {
     include: null,
     exclude: null,
 };
 class Deprecated extends Rule {
     constructor(options) {
-        super({ ...defaults$j, ...options });
+        super({ ...defaults$k, ...options });
     }
     static schema() {
         return {
@@ -4742,12 +4768,12 @@ class NoStyleTag$1 extends Rule {
     }
 }
 
-const defaults$i = {
+const defaults$j = {
     style: "uppercase",
 };
 class DoctypeStyle extends Rule {
     constructor(options) {
-        super({ ...defaults$i, ...options });
+        super({ ...defaults$j, ...options });
     }
     static schema() {
         return {
@@ -4779,12 +4805,12 @@ class DoctypeStyle extends Rule {
     }
 }
 
-const defaults$h = {
+const defaults$i = {
     style: "lowercase",
 };
 class ElementCase extends Rule {
     constructor(options) {
-        super({ ...defaults$h, ...options });
+        super({ ...defaults$i, ...options });
         this.style = new CaseStyle(this.options.style, "element-case");
     }
     static schema() {
@@ -4850,14 +4876,14 @@ class ElementCase extends Rule {
     }
 }
 
-const defaults$g = {
+const defaults$h = {
     pattern: "^[a-z][a-z0-9\\-._]*-[a-z0-9\\-._]*$",
     whitelist: [],
     blacklist: [],
 };
 class ElementName extends Rule {
     constructor(options) {
-        super({ ...defaults$g, ...options });
+        super({ ...defaults$h, ...options });
         // eslint-disable-next-line security/detect-non-literal-regexp
         this.pattern = new RegExp(this.options.pattern);
     }
@@ -4898,7 +4924,7 @@ class ElementName extends Rule {
                 ...context.blacklist.map((cur) => `- ${cur}`),
             ];
         }
-        if (context.pattern !== defaults$g.pattern) {
+        if (context.pattern !== defaults$h.pattern) {
             return [
                 `<${context.tagName}> is not a valid element name. This project is configured to only allow names matching the following regular expression:`,
                 "",
@@ -5300,7 +5326,7 @@ class EmptyTitle extends Rule {
     }
 }
 
-const defaults$f = {
+const defaults$g = {
     allowMultipleH1: false,
     minInitialRank: "h1",
     sectioningRoots: ["dialog", '[role="dialog"]'],
@@ -5331,7 +5357,7 @@ function parseMaxInitial(value) {
 }
 class HeadingLevel extends Rule {
     constructor(options) {
-        super({ ...defaults$f, ...options });
+        super({ ...defaults$g, ...options });
         this.stack = [];
         this.minInitialRank = parseMaxInitial(this.options.minInitialRank);
         this.sectionRoots = this.options.sectioningRoots.map((it) => new Pattern(it));
@@ -5489,12 +5515,12 @@ class HeadingLevel extends Rule {
     }
 }
 
-const defaults$e = {
+const defaults$f = {
     pattern: "kebabcase",
 };
 class IdPattern extends Rule {
     constructor(options) {
-        super({ ...defaults$e, ...options });
+        super({ ...defaults$f, ...options });
         this.pattern = parsePattern(this.options.pattern);
     }
     static schema() {
@@ -5845,12 +5871,12 @@ function findLabelByParent(el) {
     return [];
 }
 
-const defaults$d = {
+const defaults$e = {
     maxlength: 70,
 };
 class LongTitle extends Rule {
     constructor(options) {
-        super({ ...defaults$d, ...options });
+        super({ ...defaults$e, ...options });
         this.maxlength = this.options.maxlength;
     }
     static schema() {
@@ -5997,13 +6023,13 @@ class MultipleLabeledControls extends Rule {
     }
 }
 
-const defaults$c = {
+const defaults$d = {
     include: null,
     exclude: null,
 };
 class NoAutoplay extends Rule {
     constructor(options) {
-        super({ ...defaults$c, ...options });
+        super({ ...defaults$d, ...options });
     }
     documentation(context) {
         const tagName = context ? ` on <${context.tagName}>` : "";
@@ -6244,24 +6270,14 @@ Omitted end tags can be ambigious for humans to read and many editors have troub
     }
 }
 
-const defaults$b = {
+const defaults$c = {
     include: null,
     exclude: null,
     allowedProperties: ["display"],
 };
-function getCSSDeclarations(value) {
-    return value
-        .trim()
-        .split(";")
-        .filter(Boolean)
-        .map((it) => {
-        const [property, value] = it.split(":", 2);
-        return { property: property.trim(), value: value ? value.trim() : undefined };
-    });
-}
 class NoInlineStyle extends Rule {
     constructor(options) {
-        super({ ...defaults$b, ...options });
+        super({ ...defaults$c, ...options });
     }
     static schema() {
         return {
@@ -6339,18 +6355,15 @@ class NoInlineStyle extends Rule {
         return true;
     }
     allPropertiesAllowed(value) {
-        if (typeof value !== "string") {
-            return false;
-        }
         const allowProperties = this.options.allowedProperties;
         /* quick path: no properties are allowed, no need to check each one individually */
         if (allowProperties.length === 0) {
             return false;
         }
-        const declarations = getCSSDeclarations(value);
+        const declarations = Object.keys(parseCssDeclaration(value));
         return (declarations.length > 0 &&
             declarations.every((it) => {
-                return allowProperties.includes(it.property);
+                return allowProperties.includes(it);
             }));
     }
 }
@@ -6466,7 +6479,7 @@ class NoMultipleMain extends Rule {
     }
 }
 
-const defaults$a = {
+const defaults$b = {
     relaxed: false,
 };
 const textRegexp = /([<>]|&(?![a-zA-Z0-9#]+;))/g;
@@ -6483,7 +6496,7 @@ const replacementTable = {
 };
 class NoRawCharacters extends Rule {
     constructor(options) {
-        super({ ...defaults$a, ...options });
+        super({ ...defaults$b, ...options });
         this.relaxed = this.options.relaxed;
     }
     static schema() {
@@ -6661,13 +6674,13 @@ class NoRedundantRole extends Rule {
 }
 
 const xmlns = /^(.+):.+$/;
-const defaults$9 = {
+const defaults$a = {
     ignoreForeign: true,
     ignoreXML: true,
 };
 class NoSelfClosing extends Rule {
     constructor(options) {
-        super({ ...defaults$9, ...options });
+        super({ ...defaults$a, ...options });
     }
     static schema() {
         return {
@@ -6783,7 +6796,7 @@ class NoUtf8Bom extends Rule {
     }
     setup() {
         const unregister = this.on("token", (event) => {
-            if (event.type === exports.TokenType.UNICODE_BOM) {
+            if (event.type === TokenType.UNICODE_BOM) {
                 this.report(null, "File should be saved without UTF-8 BOM", event.location);
             }
             /* since the BOM must be the very first thing the rule can now be disabled for the rest of the run */
@@ -6800,13 +6813,13 @@ const replacement = {
     reset: '<button type="reset">',
     image: '<button type="button">',
 };
-const defaults$8 = {
+const defaults$9 = {
     include: null,
     exclude: null,
 };
 class PreferButton extends Rule {
     constructor(options) {
-        super({ ...defaults$8, ...options });
+        super({ ...defaults$9, ...options });
     }
     static schema() {
         return {
@@ -6881,7 +6894,7 @@ class PreferButton extends Rule {
     }
 }
 
-const defaults$7 = {
+const defaults$8 = {
     mapping: {
         article: "article",
         banner: "header",
@@ -6911,7 +6924,7 @@ const defaults$7 = {
 };
 class PreferNativeElement extends Rule {
     constructor(options) {
-        super({ ...defaults$7, ...options });
+        super({ ...defaults$8, ...options });
     }
     static schema() {
         return {
@@ -7031,7 +7044,7 @@ class PreferTbody extends Rule {
     }
 }
 
-const defaults$6 = {
+const defaults$7 = {
     target: "all",
 };
 const crossorigin = new RegExp("^(\\w+://|//)"); /* e.g. https:// or // */
@@ -7041,7 +7054,7 @@ const supportSri = {
 };
 class RequireSri extends Rule {
     constructor(options) {
-        super({ ...defaults$6, ...options });
+        super({ ...defaults$7, ...options });
         this.target = this.options.target;
     }
     static schema() {
@@ -7169,12 +7182,13 @@ class SvgFocusable extends Rule {
     }
 }
 
-const defaults$5 = {
+const defaults$6 = {
     characters: [
         { pattern: " ", replacement: "&nbsp;", description: "non-breaking space" },
         { pattern: "-", replacement: "&#8209;", description: "non-breaking hyphen" },
     ],
     ignoreClasses: [],
+    ignoreStyle: true,
 };
 function constructRegex(characters) {
     const disallowed = characters
@@ -7211,7 +7225,7 @@ function matchAll(text, regexp) {
 }
 class TelNonBreaking extends Rule {
     constructor(options) {
-        super({ ...defaults$5, ...options });
+        super({ ...defaults$6, ...options });
         this.regex = constructRegex(this.options.characters);
     }
     static schema() {
@@ -7240,6 +7254,9 @@ class TelNonBreaking extends Rule {
                     type: "string",
                 },
             },
+            ignoreStyle: {
+                type: "boolean",
+            },
         };
     }
     documentation(context) {
@@ -7266,13 +7283,10 @@ class TelNonBreaking extends Rule {
     setup() {
         this.on("element:ready", this.isRelevant, (event) => {
             const { target } = event;
-            const { ignoreClasses } = this.options;
-            /* skip if element has a class in the ignore list */
-            const isIgnored = ignoreClasses.some((it) => target.classList.contains(it));
-            if (isIgnored) {
+            if (this.isIgnored(target)) {
                 return;
             }
-            this.walk(target);
+            this.walk(target, target);
         });
     }
     isRelevant(event) {
@@ -7288,17 +7302,36 @@ class TelNonBreaking extends Rule {
         }
         return true;
     }
-    walk(node) {
+    isIgnoredClass(node) {
+        const { ignoreClasses } = this.options;
+        const { classList } = node;
+        return ignoreClasses.some((it) => classList.contains(it));
+    }
+    isIgnoredStyle(node) {
+        const { ignoreStyle } = this.options;
+        const { style } = node;
+        if (!ignoreStyle) {
+            return false;
+        }
+        if (style["white-space"] === "nowrap" || style["white-space"] === "pre") {
+            return true;
+        }
+        return false;
+    }
+    isIgnored(node) {
+        return this.isIgnoredClass(node) || this.isIgnoredStyle(node);
+    }
+    walk(anchor, node) {
         for (const child of node.childNodes) {
             if (isTextNode(child)) {
-                this.detectDisallowed(child);
+                this.detectDisallowed(anchor, child);
             }
             else if (isElementNode(child)) {
-                this.walk(child);
+                this.walk(anchor, child);
             }
         }
     }
-    detectDisallowed(node) {
+    detectDisallowed(anchor, node) {
         const [offset, text] = getText(node);
         const matches = matchAll(text, this.regex);
         for (const match of matches) {
@@ -7308,12 +7341,12 @@ class TelNonBreaking extends Rule {
             if (!entry) {
                 throw new Error(`Failed to find entry for "${detected}" when searching text "${text}"`);
             }
-            const message = `"${detected}" should be replaced with "${entry.replacement}" in telephone number`;
+            const message = `"${detected}" should be replaced with "${entry.replacement}" (${entry.description}) in telephone number`;
             const begin = offset + match.index;
             const end = begin + detected.length;
             const location = sliceLocation(node.location, begin, end);
             const context = entry;
-            this.report(node, message, location, context);
+            this.report(anchor, message, location, context);
         }
     }
 }
@@ -9271,6 +9304,95 @@ class UnknownCharReference extends Rule {
     }
 }
 
+var RuleContext;
+(function (RuleContext) {
+    RuleContext[RuleContext["EMPTY"] = 1] = "EMPTY";
+    RuleContext[RuleContext["WHITESPACE"] = 2] = "WHITESPACE";
+    RuleContext[RuleContext["LEADING_CHARACTER"] = 3] = "LEADING_CHARACTER";
+    RuleContext[RuleContext["DISALLOWED_CHARACTER"] = 4] = "DISALLOWED_CHARACTER";
+})(RuleContext || (RuleContext = {}));
+const defaults$5 = {
+    relaxed: false,
+};
+class ValidID extends Rule {
+    constructor(options) {
+        super({ ...defaults$5, ...options });
+    }
+    static schema() {
+        return {
+            relaxed: {
+                type: "boolean",
+            },
+        };
+    }
+    documentation(context) {
+        const { relaxed } = this.options;
+        const message = context
+            ? this.messages[context].replace("id", "ID").replace(/^(.)/, (m) => m.toUpperCase())
+            : "Element ID is not valid";
+        const relaxedDescription = relaxed
+            ? []
+            : [
+                "  - ID must begin with a letter",
+                "  - ID must only contain alphanumerical characters, `-` and `_`",
+            ];
+        return {
+            description: [
+                `${message}.`,
+                "",
+                "Under the current configuration the following rules are applied:",
+                "",
+                "  - ID must not be empty",
+                "  - ID must not contain any whitespace characters",
+                ...relaxedDescription,
+            ].join("\n"),
+            url: ruleDocumentationUrl("@/rules/valid-id.ts"),
+        };
+    }
+    setup() {
+        this.on("attr", this.isRelevant, (event) => {
+            const { value } = event;
+            if (value === null || value instanceof DynamicValue) {
+                return;
+            }
+            if (value === "") {
+                const context = RuleContext.EMPTY;
+                this.report(event.target, this.messages[context], event.location, context);
+                return;
+            }
+            if (value.match(/\s/)) {
+                const context = RuleContext.WHITESPACE;
+                this.report(event.target, this.messages[context], event.valueLocation, context);
+                return;
+            }
+            const { relaxed } = this.options;
+            if (relaxed) {
+                return;
+            }
+            if (value.match(/^[^a-zA-Z]/)) {
+                const context = RuleContext.LEADING_CHARACTER;
+                this.report(event.target, this.messages[context], event.valueLocation, context);
+                return;
+            }
+            if (value.match(/[^a-zA-Z0-9-_]/)) {
+                const context = RuleContext.DISALLOWED_CHARACTER;
+                this.report(event.target, this.messages[context], event.valueLocation, context);
+            }
+        });
+    }
+    get messages() {
+        return {
+            [RuleContext.EMPTY]: "element id must not be empty",
+            [RuleContext.WHITESPACE]: "element id must not contain whitespace",
+            [RuleContext.LEADING_CHARACTER]: "element id must begin with a letter",
+            [RuleContext.DISALLOWED_CHARACTER]: "element id must only contain alphanumerical, dash and underscore characters",
+        };
+    }
+    isRelevant(event) {
+        return event.key === "id";
+    }
+}
+
 var Style$1;
 (function (Style) {
     Style[Style["Any"] = 0] = "Any";
@@ -9782,6 +9904,7 @@ const bundledRules = {
     "tel-non-breaking": TelNonBreaking,
     "text-content": TextContent,
     "unrecognized-char-ref": UnknownCharReference,
+    "valid-id": ValidID,
     void: Void,
     "void-content": VoidContent,
     "void-style": VoidStyle,
@@ -9879,6 +10002,7 @@ const config$1 = {
         "tel-non-breaking": "error",
         "text-content": "error",
         "unrecognized-char-ref": "error",
+        "valid-id": ["error", { relaxed: false }],
         void: "off",
         "void-content": "error",
         "void-style": "error",
@@ -9914,6 +10038,7 @@ const config = {
         "no-raw-characters": ["error", { relaxed: true }],
         "script-element": "error",
         "unrecognized-char-ref": "error",
+        "valid-id": ["error", { relaxed: true }],
         "void-content": "error",
     },
 };
@@ -10243,7 +10368,7 @@ class Config {
             }
             let filename;
             /* try searching builtin metadata */
-            filename = path__default["default"].join(projectRoot, "elements", `${entry}.json`);
+            filename = path__default["default"].join(projectRoot, "elements", `${entry}.js`);
             if (fs__default["default"].existsSync(filename)) {
                 metaTable.loadFromFile(filename);
                 continue;
@@ -10657,7 +10782,7 @@ class ParserError extends Error {
 }
 
 function isAttrValueToken(token) {
-    return Boolean(token && token.type === exports.TokenType.ATTR_VALUE);
+    return Boolean(token && token.type === TokenType.ATTR_VALUE);
 }
 function svgShouldRetainTag(foreignTagName, tagName) {
     return foreignTagName === "svg" && ["title", "desc"].includes(tagName);
@@ -10765,43 +10890,43 @@ class Parser {
     /* eslint-disable-next-line complexity */
     consume(source, token, tokenStream) {
         switch (token.type) {
-            case exports.TokenType.UNICODE_BOM:
+            case TokenType.UNICODE_BOM:
                 /* ignore */
                 break;
-            case exports.TokenType.TAG_OPEN:
+            case TokenType.TAG_OPEN:
                 this.consumeTag(source, token, tokenStream);
                 break;
-            case exports.TokenType.WHITESPACE:
+            case TokenType.WHITESPACE:
                 this.trigger("whitespace", {
                     text: token.data[0],
                     location: token.location,
                 });
                 this.appendText(token.data[0], token.location);
                 break;
-            case exports.TokenType.DIRECTIVE:
+            case TokenType.DIRECTIVE:
                 this.consumeDirective(token);
                 break;
-            case exports.TokenType.CONDITIONAL:
+            case TokenType.CONDITIONAL:
                 this.consumeConditional(token);
                 break;
-            case exports.TokenType.COMMENT:
+            case TokenType.COMMENT:
                 this.consumeComment(token);
                 break;
-            case exports.TokenType.DOCTYPE_OPEN:
+            case TokenType.DOCTYPE_OPEN:
                 this.consumeDoctype(token, tokenStream);
                 break;
-            case exports.TokenType.TEXT:
-            case exports.TokenType.TEMPLATING:
+            case TokenType.TEXT:
+            case TokenType.TEMPLATING:
                 this.appendText(token.data[0], token.location);
                 break;
-            case exports.TokenType.EOF:
+            case TokenType.EOF:
                 this.closeTree(source, token.location);
                 break;
         }
     }
     /* eslint-disable-next-line complexity, sonarjs/cognitive-complexity */
     consumeTag(source, startToken, tokenStream) {
-        const tokens = Array.from(this.consumeUntil(tokenStream, exports.TokenType.TAG_CLOSE, startToken.location));
+        const tokens = Array.from(this.consumeUntil(tokenStream, TokenType.TAG_CLOSE, startToken.location));
         const endToken = tokens.slice(-1)[0];
         const closeOptional = this.closeOptional(startToken);
         const parent = closeOptional ? this.dom.getActive().parent : this.dom.getActive();
@@ -10827,9 +10952,9 @@ class Parser {
         for (let i = 0; i < tokens.length; i++) {
             const token = tokens[i];
             switch (token.type) {
-                case exports.TokenType.WHITESPACE:
+                case TokenType.WHITESPACE:
                     break;
-                case exports.TokenType.ATTR_NAME:
+                case TokenType.ATTR_NAME:
                     this.consumeAttribute(source, node, token, tokens[i + 1]);
                     break;
             }
@@ -10907,7 +11032,7 @@ class Parser {
         let endToken;
         do {
             /* search for tags */
-            const tokens = Array.from(this.consumeUntil(tokenStream, exports.TokenType.TAG_OPEN, errorLocation));
+            const tokens = Array.from(this.consumeUntil(tokenStream, TokenType.TAG_OPEN, errorLocation));
             const [last] = tokens.slice(-1);
             const [, tagClosed, tagName] = last.data;
             /* special case: svg <title> and <desc> should be intact as it affects accessibility */
@@ -10924,7 +11049,7 @@ class Parser {
                 continue;
             }
             /* locate end token and determine if this is a self-closed tag */
-            const endTokens = Array.from(this.consumeUntil(tokenStream, exports.TokenType.TAG_CLOSE, last.location));
+            const endTokens = Array.from(this.consumeUntil(tokenStream, TokenType.TAG_CLOSE, last.location));
             endToken = endTokens.slice(-1)[0];
             const selfClosed = endToken.data[0] === "/>";
             /* since foreign element may be nested keep a count for the number of
@@ -11010,7 +11135,7 @@ class Parser {
      *      ^^^          ^^^         ^^^    (null)   (null)
      */
     getAttributeValueLocation(token) {
-        if (!token || token.type !== exports.TokenType.ATTR_VALUE || token.data[2] === "") {
+        if (!token || token.type !== TokenType.ATTR_VALUE || token.data[2] === "") {
             return null;
         }
         const quote = token.data[3];
@@ -11028,7 +11153,7 @@ class Parser {
     getAttributeLocation(key, value) {
         var _a;
         const begin = key.location;
-        const end = value && value.type === exports.TokenType.ATTR_VALUE ? value.location : undefined;
+        const end = value && value.type === TokenType.ATTR_VALUE ? value.location : undefined;
         return {
             filename: begin.filename,
             line: begin.line,
@@ -11089,7 +11214,7 @@ class Parser {
      * Consumes doctype tokens. Emits doctype event.
      */
     consumeDoctype(startToken, tokenStream) {
-        const tokens = Array.from(this.consumeUntil(tokenStream, exports.TokenType.DOCTYPE_CLOSE, startToken.location));
+        const tokens = Array.from(this.consumeUntil(tokenStream, TokenType.DOCTYPE_CLOSE, startToken.location));
         /* first token is the doctype, second is the closing ">" */
         const doctype = tokens[0];
         const value = doctype.data[0];
@@ -11115,7 +11240,7 @@ class Parser {
                 return;
             it = this.next(tokenStream);
         }
-        throw new ParserError(errorLocation, `stream ended before ${exports.TokenType[search]} token was found`);
+        throw new ParserError(errorLocation, `stream ended before ${TokenType[search]} token was found`);
     }
     /**
      * Consumes tokens until a matching close-tag is found. Tags are appended to
@@ -11129,7 +11254,7 @@ class Parser {
         while (!it.done) {
             const token = it.value;
             this.consume(source, token, tokenStream);
-            if (token.type === exports.TokenType.TAG_OPEN) {
+            if (token.type === TokenType.TAG_OPEN) {
                 const [, close, tagName] = token.data;
                 if (tagName === searchTag) {
                     if (close) {
@@ -11202,6 +11327,12 @@ class Parser {
     }
 }
 
+function freeze(src) {
+    return {
+        ...src,
+        selector: src.selector(),
+    };
+}
 /**
  * @internal
  */
@@ -11253,7 +11384,9 @@ class Reporter {
             line: location.line,
             column: location.column,
             size: location.size || 0,
-            selector: node ? node.generateSelector() : null,
+            selector() {
+                return node ? node.generateSelector() : null;
+            },
             context,
         });
     }
@@ -11267,7 +11400,7 @@ class Reporter {
         const report = {
             valid: this.isValid(),
             results: Object.keys(this.result).map((filePath) => {
-                const messages = Array.from(this.result[filePath]).sort(messageSort);
+                const messages = Array.from(this.result[filePath], freeze).sort(messageSort);
                 const source = (sources || []).find((source) => { var _a; return filePath === ((_a = source.filename) !== null && _a !== void 0 ? _a : ""); });
                 return {
                     filePath,
@@ -11420,7 +11553,7 @@ class Engine {
             for (const token of lexer.tokenize(src)) {
                 const data = (_a = token.data[0]) !== null && _a !== void 0 ? _a : "";
                 lines.push({
-                    token: exports.TokenType[token.type],
+                    token: TokenType[token.type],
                     data,
                     location: `${token.location.filename}:${token.location.line}:${token.location.column}`,
                 });
@@ -11669,7 +11802,7 @@ class Engine {
             line: location.line,
             column: location.column,
             size: location.size || 0,
-            selector: null,
+            selector: () => null,
         });
     }
 }
@@ -12191,6 +12324,8 @@ const formatter$4 = checkstyleFormatter;
 
 const defaults = {
     showLink: true,
+    showSummary: true,
+    showSelector: false,
 };
 /**
  * Codeframe formatter based on ESLint codeframe.
@@ -12246,6 +12381,7 @@ function getEndLocation(message, source) {
  * @returns The formatted output.
  */
 function formatMessage(message, parentResult, options) {
+    var _a;
     const type = message.severity === 2 ? kleur__default["default"].red("error") : kleur__default["default"].yellow("warning");
     const msg = `${kleur__default["default"].bold(message.message.replace(/([^ ])\.$/, "$1"))}`;
     const ruleId = kleur__default["default"].dim(`(${message.ruleId})`);
@@ -12268,6 +12404,9 @@ function formatMessage(message, parentResult, options) {
             end: getEndLocation(message, sourceCode),
         }, { highlightCode: false }));
     }
+    if (options.showSelector) {
+        result.push(`${kleur__default["default"].bold("Selector:")} ${(_a = message.selector) !== null && _a !== void 0 ? _a : "-"}`);
+    }
     if (options.showLink && message.ruleUrl) {
         result.push(`${kleur__default["default"].bold("Details:")} ${message.ruleUrl}`);
     }
@@ -12305,9 +12444,11 @@ function codeframe(results, options) {
         return resultsOutput.concat(messages);
     }, [])
         .join("\n");
-    output += "\n";
-    output += formatSummary(errors, warnings);
-    output += "\n";
+    if (merged.showSummary) {
+        output += "\n";
+        output += formatSummary(errors, warnings);
+        output += "\n";
+    }
     return errors + warnings > 0 ? output : "";
 }
 const formatter$3 = codeframe;
@@ -12407,6 +12548,7 @@ exports.TemplateExtractor = TemplateExtractor;
 exports.TextNode = TextNode;
 exports.UserError = UserError;
 exports.bugs = bugs;
+exports.codeframe = codeframe;
 exports.compatibilityCheck = compatibilityCheck;
 exports.getFormatter = getFormatter;
 exports.legacyRequire = legacyRequire;