@herb-tools/linter 0.4.1 → 0.4.3

package/dist/types/types.d.ts

@@ -1,4 +1,4 @@
-import { Node, Diagnostic } from "@herb-tools/core";
+import { Node, Diagnostic, LexResult } from "@herb-tools/core";
 import type { defaultRules } from "./default-rules.js";
 export type LintSeverity = "error" | "warning";
 /**
@@ -15,12 +15,55 @@ export interface LintResult {
     errors: number;
     warnings: number;
 }
-export interface Rule {
-    name: string;
-    check(node: Node): LintOffense[];
+export declare abstract class ParserRule {
+    static type: "parser";
+    abstract name: string;
+    abstract check(node: Node, context?: Partial<LintContext>): LintOffense[];
+}
+export declare abstract class LexerRule {
+    static type: "lexer";
+    abstract name: string;
+    abstract check(lexResult: LexResult, context?: Partial<LintContext>): LintOffense[];
+}
+export interface LexerRuleConstructor {
+    type: "lexer";
+    new (): LexerRule;
 }
 /**
- * Type representing a rule class constructor.
+ * Complete lint context with all properties defined.
+ * Use Partial<LintContext> when passing context to rules.
+ */
+export interface LintContext {
+    fileName: string | undefined;
+}
+/**
+ * Default context object with all keys defined but set to undefined
+ */
+export declare const DEFAULT_LINT_CONTEXT: LintContext;
+export declare abstract class SourceRule {
+    static type: "source";
+    abstract name: string;
+    abstract check(source: string, context?: Partial<LintContext>): LintOffense[];
+}
+export interface SourceRuleConstructor {
+    type: "source";
+    new (): SourceRule;
+}
+/**
+ * Type representing a parser/AST rule class constructor.
  * The Linter accepts rule classes rather than instances for better performance and memory usage.
+ * Parser rules are the default and don't require static properties.
+ */
+export type ParserRuleClass = (new () => ParserRule) & {
+    type?: "parser";
+};
+export type LexerRuleClass = LexerRuleConstructor;
+export type SourceRuleClass = SourceRuleConstructor;
+/**
+ * Union type for any rule instance (Parser/AST, Lexer, or Source)
+ */
+export type Rule = ParserRule | LexerRule | SourceRule;
+/**
+ * Union type for any rule class (Parser/AST, Lexer, or Source)
  */
-export type RuleClass = new () => Rule;
+export type RuleClass = ParserRuleClass | LexerRuleClass | SourceRuleClass;

package/docs/rules/README.md

@@ -6,9 +6,12 @@ This page contains documentation for all Herb Linter rules.
 
 - [`erb-no-empty-tags`](./erb-no-empty-tags.md) - Disallow empty ERB tags
 - [`erb-no-output-control-flow`](./erb-no-output-control-flow.md) - Prevents outputting control flow blocks
+- [`erb-prefer-image-tag-helper`](./erb-prefer-image-tag-helper.md) - Prefer `image_tag` helper over `<img>` with ERB expressions
 - [`erb-require-whitespace-inside-tags`](./erb-require-whitespace-inside-tags.md) - Requires whitespace around erb tags
+- [`erb-requires-trailing-newline`](./erb-requires-trailing-newline.md) - Enforces that all HTML+ERB template files end with exactly one trailing newline character.
 - [`html-anchor-require-href`](./html-anchor-require-href.md) - Requires an href attribute on anchor tags
 - [`html-aria-attribute-must-be-valid`](./html-aria-attribute-must-be-valid.md) - Disallow invalid or unknown `aria-*` attributes.
+- [`html-aria-level-must-be-valid`](./html-aria-level-must-be-valid.md) - `aria-level` must be between 1 and 6
 - [`html-aria-role-heading-requires-level`](./html-aria-role-heading-requires-level.md) - Requires `aria-level` when supplying a `role`
 - [`html-aria-role-must-be-valid`](./html-aria-role-must-be-valid.md) - The `role` attribute must have a valid WAI-ARIA Role.
 - [`html-attribute-double-quotes`](./html-attribute-double-quotes.md) - Enforces double quotes for attribute values
@@ -16,10 +19,11 @@ This page contains documentation for all Herb Linter rules.
 - [`html-boolean-attributes-no-value`](./html-boolean-attributes-no-value.md) - Prevents values on boolean attributes
 - [`html-img-require-alt`](./html-img-require-alt.md) - Requires alt attributes on img tags
 - [`html-no-block-inside-inline`](./html-no-block-inside-inline.md) - Prevents block-level elements inside inline elements
-- [`html-no-duplicate-ids`](./html-no-duplicate-ids.md) - Prevents duplicate IDs within a document
 - [`html-no-duplicate-attributes`](./html-no-duplicate-attributes.md) - Prevents duplicate attributes on HTML elements
+- [`html-no-duplicate-ids`](./html-no-duplicate-ids.md) - Prevents duplicate IDs within a document
 - [`html-no-nested-links`](./html-no-nested-links.md) - Prevents nested anchor tags
 - [`html-tag-name-lowercase`](./html-tag-name-lowercase.md) - Enforces lowercase tag names in HTML
+- [`svg-tag-name-capitalization`](./svg-tag-name-capitalization.md) - Enforces proper camelCase capitalization for SVG elements
 
 ## Contributing
 

package/docs/rules/erb-prefer-image-tag-helper.md

@@ -0,0 +1,65 @@
+# Linter Rule: Prefer `image_tag` helper over `<img>` with ERB expressions
+
+**Rule:** `erb-prefer-image-tag-helper`
+
+## Description
+
+Prefer using Rails' `image_tag` helper over manual `<img>` tags with dynamic ERB expressions like `image_path` or `asset_path`.
+
+## Rationale
+
+The `image_tag` helper provides several advantages over manual `<img>` tags with dynamic ERB expressions. It properly escapes the `src` value to prevent XSS vulnerabilities and ensures consistent rendering across different contexts. Using `image_tag` also reduces template complexity by eliminating the need for manual string interpolation and makes it easier to add additional attributes like `alt`, `class`, or `data-*` attributes in a clean, readable way. Additionally, it prevents common interpolation issues that can arise when mixing ERB expressions with static text in attribute values.
+
+## Examples
+
+### ✅ Good
+
+```erb
+<!-- Simple image_tag usage -->
+<%= image_tag "logo.png", alt: "Logo" %>
+<%= image_tag "banner.jpg", alt: "Banner", class: "hero-image" %>
+<%= image_tag "icon.svg", alt: "Icon", size: "24x24" %>
+
+<!-- Dynamic expressions -->
+<%= image_tag user.avatar.url, alt: "User avatar" %>
+
+<!-- Mixed content using string interpolation -->
+<%= image_tag "#{root_url}/banner.jpg", alt: "Banner" %>
+<%= image_tag "#{base_url}#{image_path('icon.png')}", alt: "Icon" %>
+
+<!-- Static image paths are fine -->
+<img src="/static/logo.png" alt="Logo">
+```
+
+### 🚫 Bad
+
+```erb
+<!-- Single ERB expressions -->
+<img src="<%= image_path("logo.png") %>" alt="Logo">
+
+<img src="<%= asset_path("banner.jpg") %>" alt="Banner">
+
+<img src="<%= user.avatar.url %>" alt="User avatar">
+
+<img src="<%= product.image %>" alt="Product image">
+
+
+<!-- Mixed ERB and text content -->
+<img src="<%= Rails.application.routes.url_helpers.root_url %>/icon.png" alt="Logo">
+
+<img src="<%= root_url %>/banner.jpg" alt="Banner">
+
+<img src="<%= admin_path %>/icon.png" alt="Admin icon">
+
+
+<!-- Multiple ERB expressions -->
+<img src="<%= base_url %><%= image_path("logo.png") %>" alt="Logo">
+
+<img src="<%= root_path %><%= "icon.png" %>" alt="Icon">
+```
+
+## References
+
+* [Rails `image_tag` helper documentation](https://api.rubyonrails.org/classes/ActionView/Helpers/AssetTagHelper.html#method-i-image_tag)
+* [Rails `image_path` helper documentation](https://api.rubyonrails.org/classes/ActionView/Helpers/AssetUrlHelper.html#method-i-image_path)
+* [Rails `asset_path` helper documentation](https://api.rubyonrails.org/classes/ActionView/Helpers/AssetUrlHelper.html#method-i-asset_path)

package/docs/rules/erb-requires-trailing-newline.md

@@ -0,0 +1,37 @@
+# Linter Rule: Enforce trailing newline
+
+**Rule:** `erb-requires-trailing-newline`
+
+## Description
+
+This rule enforces that all HTML+ERB template files end with exactly one trailing newline character. This is a formatting convention widely adopted across many languages and tools.
+
+## Rationale
+
+Ensuring HTML+ERB files end with a single trailing newline aligns with POSIX conventions, where text files should end with a newline character.
+
+This practice avoids unnecessary diffs from editors or formatters that auto-insert final newlines, improving compatibility with command-line tools and version control systems. It also helps maintain a clean, predictable structure across view files.
+
+Trailing newlines are a common convention in Ruby and are enforced by tools like RuboCop and many Git-based workflows.
+
+## Examples
+
+### ✅ Good
+
+```
+<%= render partial: "header" %>
+<%= render partial: "footer" %>
+```
+
+### 🚫 Bad
+
+```erb
+<%= render partial: "header" %>
+<%= render partial: "footer" %>▌
+```
+
+## References
+
+- [POSIX: Text files and trailing newlines](https://pubs.opengroup.org/onlinepubs/9699919799/basedefs/V1_chap03.html#tag_03_206)
+- [Git: Trailing newlines and diffs](https://git-scm.com/docs/git-diff#_generating_patches_with_p)
+- [EditorConfig: `insert_final_newline`](https://github.com/editorconfig/editorconfig/wiki/EditorConfig-Properties#insert_final_newline)

package/docs/rules/html-anchor-require-href.md

@@ -4,7 +4,7 @@
 
 ## Description
 
-Disallow the use of anchor tags without anhref attribute in HTML templates. Use if you want to perform an action without having the user navigated to a new URL.
+Disallow the use of anchor tags without an `href` attribute in HTML templates. Use if you want to perform an action without having the user navigated to a new URL.
 
 ## Rationale
 

package/docs/rules/html-aria-level-must-be-valid.md

@@ -0,0 +1,37 @@
+# Linter Rule: `aria-level` must be between 1 and 6
+
+**Rule:** `html-aria-level-must-be-valid`
+
+## Description
+
+Ensure that the value of the `aria-level` attribute is a valid heading level: an integer between `1` and `6`. This attribute is used with `role="heading"` to indicate a heading level for non-semantic elements like `<div>` or `<span>`.
+
+## Rationale
+
+The WAI-ARIA specification defines `aria-level` as an integer between `1` (highest/most important) and `6` (lowest/subheading). Any other value is invalid and may confuse screen readers or fail accessibility audits.
+
+## Examples
+
+### ✅ Good
+
+```erb
+<div role="heading" aria-level="1">Main</div>
+<div role="heading" aria-level="6">Footnote</div>
+```
+
+### 🚫 Bad
+
+```erb
+<div role="heading" aria-level="-1">Negative</div>
+
+<div role="heading" aria-level="0">Main</div>
+
+<div role="heading" aria-level="7">Too deep</div>
+
+<div role="heading" aria-level="foo">Invalid</div>
+```
+
+## References
+
+- [ARIA: `heading` role](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/heading_role)
+- [ARIA: `aria-level` attribute](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-level)

package/docs/rules/svg-tag-name-capitalization.md

@@ -0,0 +1,57 @@
+# Linter Rule: SVG tag name capitalization
+
+**Rule:** `svg-tag-name-capitalization`
+
+## Description
+
+Enforces proper camelCase capitalization for SVG element names within SVG contexts.
+
+## Rationale
+
+SVG elements use camelCase naming conventions (e.g., `linearGradient`, `clipPath`, `feGaussianBlur`) rather than the lowercase conventions used in HTML. This rule ensures that SVG elements within `<svg>` tags use the correct capitalization for proper rendering and standards compliance.
+
+This rule only applies to elements within SVG contexts and does not check the `<svg>` tag itself (that's handled by the `html-tag-name-lowercase` rule).
+
+## Examples
+
+### ✅ Good
+
+```html
+<svg>
+  <linearGradient id="grad1">
+    <stop offset="0%" stop-color="rgb(255,255,0)" />
+  </linearGradient>
+</svg>
+```
+
+```html
+<svg>
+  <clipPath id="clip">
+    <rect width="100" height="100" />
+  </clipPath>
+  <feGaussianBlur stdDeviation="5" />
+</svg>
+```
+
+### 🚫 Bad
+
+```html
+<svg>
+  <lineargradient id="grad1">
+    <stop offset="0%" stop-color="rgb(255,255,0)" />
+  </lineargradient>
+</svg>
+```
+
+```html
+<svg>
+  <CLIPPATH id="clip">
+    <rect width="100" height="100" />
+  </CLIPPATH>
+</svg>
+```
+
+## References
+
+* [SVG Element Reference](https://developer.mozilla.org/en-US/docs/Web/SVG/Element)
+* [SVG Naming Conventions](https://www.w3.org/TR/SVG2/)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@herb-tools/linter",
-  "version": "0.4.1",
+  "version": "0.4.3",
   "description": "HTML+ERB linter for validating HTML structure and enforcing best practices",
   "license": "MIT",
   "homepage": "https://herb-tools.dev",
@@ -33,9 +33,9 @@
     }
   },
   "dependencies": {
-    "@herb-tools/core": "0.4.1",
-    "@herb-tools/highlighter": "0.4.1",
-    "@herb-tools/node-wasm": "0.4.1",
+    "@herb-tools/core": "0.4.3",
+    "@herb-tools/highlighter": "0.4.3",
+    "@herb-tools/node-wasm": "0.4.3",
     "glob": "^11.0.3"
   },
   "files": [

package/src/cli/file-processor.ts

@@ -50,12 +50,11 @@ export class FileProcessor {
       }
 
       if (!this.linter) {
-        this.linter = new Linter()
+        this.linter = new Linter(Herb)
       }
 
-      const lintResult = this.linter.lint(parseResult.value)
+      const lintResult = this.linter.lint(content, { fileName: filename })
 
-      // Get rule count on first file
       if (ruleCount === 0) {
         ruleCount = this.linter.getRuleCount()
       }
@@ -65,7 +64,6 @@ export class FileProcessor {
           console.log(`${colorize("✓", "brightGreen")} ${colorize(filename, "cyan")} - ${colorize("No issues found", "green")}`)
         }
       } else {
-        // Collect messages for later display
         for (const offense of lintResult.offenses) {
           allDiagnostics.push({ filename, diagnostic: offense, content })
 

package/src/default-rules.ts

@@ -2,9 +2,12 @@ import type { RuleClass } from "./types.js"
 
 import { ERBNoEmptyTagsRule } from "./rules/erb-no-empty-tags.js"
 import { ERBNoOutputControlFlowRule } from "./rules/erb-no-output-control-flow.js"
+import { ERBPreferImageTagHelperRule } from "./rules/erb-prefer-image-tag-helper.js"
+import { ERBRequiresTrailingNewlineRule } from "./rules/erb-requires-trailing-newline.js"
 import { ERBRequireWhitespaceRule } from "./rules/erb-require-whitespace-inside-tags.js"
 import { HTMLAnchorRequireHrefRule } from "./rules/html-anchor-require-href.js"
 import { HTMLAriaAttributeMustBeValid } from "./rules/html-aria-attribute-must-be-valid.js"
+import { HTMLAriaLevelMustBeValidRule } from "./rules/html-aria-level-must-be-valid.js"
 import { HTMLAriaRoleHeadingRequiresLevelRule } from "./rules/html-aria-role-heading-requires-level.js"
 import { HTMLAriaRoleMustBeValidRule } from "./rules/html-aria-role-must-be-valid.js"
 import { HTMLAttributeDoubleQuotesRule } from "./rules/html-attribute-double-quotes.js"
@@ -17,13 +20,17 @@ import { HTMLNoDuplicateIdsRule } from "./rules/html-no-duplicate-ids.js"
 import { HTMLNoEmptyHeadingsRule } from "./rules/html-no-empty-headings.js"
 import { HTMLNoNestedLinksRule } from "./rules/html-no-nested-links.js"
 import { HTMLTagNameLowercaseRule } from "./rules/html-tag-name-lowercase.js"
+import { SVGTagNameCapitalizationRule } from "./rules/svg-tag-name-capitalization.js"
 
 export const defaultRules: RuleClass[] = [
   ERBNoEmptyTagsRule,
   ERBNoOutputControlFlowRule,
+  ERBPreferImageTagHelperRule,
+  ERBRequiresTrailingNewlineRule,
   ERBRequireWhitespaceRule,
   HTMLAnchorRequireHrefRule,
   HTMLAriaAttributeMustBeValid,
+  HTMLAriaLevelMustBeValidRule,
   HTMLAriaRoleHeadingRequiresLevelRule,
   HTMLAriaRoleMustBeValidRule,
   HTMLAttributeDoubleQuotesRule,
@@ -36,4 +43,5 @@ export const defaultRules: RuleClass[] = [
   HTMLNoEmptyHeadingsRule,
   HTMLNoNestedLinksRule,
   HTMLTagNameLowercaseRule,
+  SVGTagNameCapitalizationRule,
 ]

package/src/linter.ts

@@ -1,17 +1,20 @@
 import { defaultRules } from "./default-rules.js"
 
-import type { RuleClass, LintResult, LintOffense } from "./types.js"
-import type { DocumentNode } from "@herb-tools/core"
+import type { RuleClass, Rule, ParserRule, LexerRule, SourceRule, LintResult, LintOffense, LintContext } from "./types.js"
+import type { HerbBackend } from "@herb-tools/core"
 
 export class Linter {
   private rules: RuleClass[]
+  private herb: HerbBackend
   private offenses: LintOffense[]
 
   /**
    * Creates a new Linter instance.
-   * @param rules - Array of rule classes (not instances) to use. If not provided, uses default rules.
+   * @param herb - The Herb backend instance for parsing and lexing
+   * @param rules - Array of rule classes (Parser/AST or Lexer) to use. If not provided, uses default rules.
    */
-  constructor(rules?: RuleClass[]) {
+  constructor(herb: HerbBackend, rules?: RuleClass[]) {
+    this.herb = herb
     this.rules = rules !== undefined ? rules : this.getDefaultRules()
     this.offenses = []
   }
@@ -28,12 +31,43 @@ export class Linter {
     return this.rules.length
   }
 
-  lint(document: DocumentNode): LintResult {
+  /**
+   * Type guard to check if a rule is a LexerRule
+   */
+  private isLexerRule(rule: Rule): rule is LexerRule {
+    return (rule.constructor as any).type === "lexer"
+  }
+
+  /**
+   * Type guard to check if a rule is a SourceRule
+   */
+  private isSourceRule(rule: Rule): rule is SourceRule {
+    return (rule.constructor as any).type === "source"
+  }
+
+  /**
+   * Lint source code using Parser/AST, Lexer, and Source rules.
+   * @param source - The source code to lint
+   * @param context - Optional context for linting (e.g., fileName for distinguishing files vs snippets)
+   */
+  lint(source: string, context?: Partial<LintContext>): LintResult {
     this.offenses = []
 
-    for (const Rule of this.rules) {
-      const rule = new Rule()
-      const ruleOffenses = rule.check(document)
+    const parseResult = this.herb.parse(source)
+    const lexResult = this.herb.lex(source)
+
+    for (const RuleClass of this.rules) {
+      const rule = new RuleClass()
+
+      let ruleOffenses: LintOffense[]
+
+      if (this.isLexerRule(rule)) {
+        ruleOffenses = (rule as LexerRule).check(lexResult, context)
+      } else if (this.isSourceRule(rule)) {
+        ruleOffenses = (rule as SourceRule).check(source, context)
+      } else {
+        ruleOffenses = (rule as ParserRule).check(parseResult.value, context)
+      }
 
       this.offenses.push(...ruleOffenses)
     }

package/src/rules/erb-no-empty-tags.ts

@@ -1,6 +1,7 @@
 import { BaseRuleVisitor } from "./rule-utils.js"
 
-import type { Rule, LintOffense } from "../types.js"
+import { ParserRule } from "../types.js"
+import type { LintOffense, LintContext } from "../types.js"
 import type { Node, ERBContentNode } from "@herb-tools/core"
 
 class ERBNoEmptyTagsVisitor extends BaseRuleVisitor {
@@ -21,11 +22,11 @@ class ERBNoEmptyTagsVisitor extends BaseRuleVisitor {
   }
 }
 
-export class ERBNoEmptyTagsRule implements Rule {
+export class ERBNoEmptyTagsRule extends ParserRule {
   name = "erb-no-empty-tags"
 
-  check(node: Node): LintOffense[] {
-    const visitor = new ERBNoEmptyTagsVisitor(this.name)
+  check(node: Node, context?: Partial<LintContext>): LintOffense[] {
+    const visitor = new ERBNoEmptyTagsVisitor(this.name, context)
 
     visitor.visit(node)
 

package/src/rules/erb-no-output-control-flow.ts

@@ -1,7 +1,8 @@
 import { BaseRuleVisitor } from "./rule-utils.js"
 
 import type { Node, ERBIfNode, ERBUnlessNode, ERBElseNode, ERBEndNode } from "@herb-tools/core"
-import type { Rule, LintOffense } from "../types.js"
+import { ParserRule } from "../types.js"
+import type { LintOffense, LintContext } from "../types.js"
 
 class ERBNoOutputControlFlowRuleVisitor extends BaseRuleVisitor {
   visitERBIfNode(node: ERBIfNode): void {
@@ -49,10 +50,11 @@ class ERBNoOutputControlFlowRuleVisitor extends BaseRuleVisitor {
   }
 }
 
-export class ERBNoOutputControlFlowRule implements Rule {
+export class ERBNoOutputControlFlowRule extends ParserRule {
   name = "erb-no-output-control-flow"
-  check(node: Node): LintOffense[] {
-    const visitor = new ERBNoOutputControlFlowRuleVisitor(this.name)
+
+  check(node: Node, context?: Partial<LintContext>): LintOffense[] {
+    const visitor = new ERBNoOutputControlFlowRuleVisitor(this.name, context)
 
     visitor.visit(node)
 

package/src/rules/erb-prefer-image-tag-helper.ts

@@ -0,0 +1,124 @@
+import { BaseRuleVisitor, getTagName, findAttributeByName, getAttributes } from "./rule-utils.js"
+
+import { ParserRule } from "../types.js"
+import type { LintOffense, LintContext } from "../types.js"
+import type { HTMLOpenTagNode, HTMLSelfCloseTagNode, HTMLAttributeValueNode, ERBContentNode, LiteralNode, Node } from "@herb-tools/core"
+
+class ERBPreferImageTagHelperVisitor extends BaseRuleVisitor {
+  visitHTMLOpenTagNode(node: HTMLOpenTagNode): void {
+    this.checkImgTag(node)
+    super.visitHTMLOpenTagNode(node)
+  }
+
+  visitHTMLSelfCloseTagNode(node: HTMLSelfCloseTagNode): void {
+    this.checkImgTag(node)
+    super.visitHTMLSelfCloseTagNode(node)
+  }
+
+  private checkImgTag(node: HTMLOpenTagNode | HTMLSelfCloseTagNode): void {
+    const tagName = getTagName(node)
+
+    if (tagName !== "img") {
+      return
+    }
+
+    const attributes = getAttributes(node)
+    const srcAttribute = findAttributeByName(attributes, "src")
+
+    if (!srcAttribute) {
+      return
+    }
+
+    if (!srcAttribute.value) {
+      return
+    }
+
+    const valueNode = srcAttribute.value as HTMLAttributeValueNode
+    const hasERBContent = this.containsERBContent(valueNode)
+
+    if (hasERBContent) {
+      const suggestedExpression = this.buildSuggestedExpression(valueNode)
+
+      this.addOffense(
+        `Prefer \`image_tag\` helper over manual \`<img>\` with dynamic ERB expressions. Use \`<%= image_tag ${suggestedExpression}, alt: "..." %>\` instead.`,
+        srcAttribute.location,
+        "warning"
+      )
+    }
+  }
+
+  private containsERBContent(valueNode: HTMLAttributeValueNode): boolean {
+    if (!valueNode.children) return false
+
+    return valueNode.children.some(child => child.type === "AST_ERB_CONTENT_NODE")
+  }
+
+  private buildSuggestedExpression(valueNode: HTMLAttributeValueNode): string {
+    if (!valueNode.children) return "expression"
+
+    let hasText = false
+    let hasERB = false
+
+    for (const child of valueNode.children) {
+      if (child.type === "AST_ERB_CONTENT_NODE") {
+        hasERB = true
+      } else if (child.type === "AST_LITERAL_NODE") {
+        const literalNode = child as LiteralNode
+
+        if (literalNode.content && literalNode.content.trim()) {
+          hasText = true
+        }
+      }
+    }
+
+    if (hasText && hasERB) {
+      let result = '"'
+
+      for (const child of valueNode.children) {
+        if (child.type === "AST_ERB_CONTENT_NODE") {
+          const erbNode = child as ERBContentNode
+
+          result += `#{${(erbNode.content?.value || "").trim()}}`
+        } else if (child.type === "AST_LITERAL_NODE") {
+          const literalNode = child as LiteralNode
+
+          result += literalNode.content || ""
+        }
+      }
+
+      result += '"'
+
+      return result
+    }
+
+    if (hasERB && !hasText) {
+      const erbNodes = valueNode.children.filter(child => child.type === "AST_ERB_CONTENT_NODE") as ERBContentNode[]
+
+      if (erbNodes.length === 1) {
+        return (erbNodes[0].content?.value || "").trim()
+      } else if (erbNodes.length > 1) {
+        let result = '"'
+
+        for (const erbNode of erbNodes) {
+          result += `#{${(erbNode.content?.value || "").trim()}}`
+        }
+
+        result += '"'
+
+        return result
+      }
+    }
+
+    return "expression"
+  }
+}
+
+export class ERBPreferImageTagHelperRule extends ParserRule {
+  name = "erb-prefer-image-tag-helper"
+
+  check(node: Node, context?: Partial<LintContext>): LintOffense[] {
+    const visitor = new ERBPreferImageTagHelperVisitor(this.name, context)
+    visitor.visit(node)
+    return visitor.offenses
+  }
+}