ui_guardrails 1.0.0 → 1.2.0

data/lib/guardrails/cross_codebase_patterns.rb

@@ -4,6 +4,7 @@ require "pathname"
 require "digest"
 require "set"
 require_relative "erb_parser"
+require_relative "report/style"
 
 module Guardrails
   # Finds recurring structural patterns across the codebase — element
@@ -50,12 +51,14 @@ module Guardrails
     def initialize(root:, output: $stdout,
                    min_size: DEFAULT_MIN_SIZE,
                    min_occurrences: DEFAULT_MIN_OCCURRENCES,
-                   max_occurrences_shown: DEFAULT_MAX_OCCURRENCES_SHOWN)
+                   max_occurrences_shown: DEFAULT_MAX_OCCURRENCES_SHOWN,
+                   style: nil)
       @root = Pathname(root)
       @output = output
       @min_size = min_size
       @min_occurrences = min_occurrences
       @max_occurrences_shown = max_occurrences_shown
+      @style = style || Report::Style.new(io: output)
     end
 
     def run
@@ -212,24 +215,52 @@ module Guardrails
       return if patterns.empty?
 
       total_occurrences = patterns.sum(&:count)
-      noun = patterns.length == 1 ? "shape" : "shapes"
+      noun = patterns.length == 1 ? "candidate" : "candidates"
+
       @output.puts ""
-      @output.puts "Guardrails patterns: #{patterns.length} recurring #{noun} " \
-                   "(#{total_occurrences} occurrences; >= #{@min_size} elements, >= #{@min_occurrences} occurrences)"
+      @output.puts @style.section_heading(
+        :suggestion,
+        "cross-codebase patterns (#{patterns.length} #{noun}, #{total_occurrences} occurrences)"
+      )
+      @output.puts "  These element subtrees repeat #{@min_occurrences}+ times across your views and"
+      @output.puts "  components. Each is a candidate for extracting into a shared partial or"
+      @output.puts "  ViewComponent. Threshold: >= #{@min_size} elements, >= #{@min_occurrences} occurrences."
 
       patterns.each do |pattern|
         @output.puts ""
-        @output.puts "  Pattern (#{pattern.size} elements, #{pattern.count} occurrences): #{truncate_shape(pattern.shape)}"
+        header = "shape: #{truncate_shape(pattern.shape)} (#{pattern.size} elements, #{pattern.count} occurrences)"
+        @output.puts "  #{@style.severity(:suggestion, header)}"
+        @output.puts "    #{@style.suggestion(suggestion_for(pattern))}"
         pattern.occurrences.first(@max_occurrences_shown).each do |occ|
-          @output.puts "    #{occ.file}:#{occ.line}"
+          @output.puts "    #{@style.location("#{occ.file}:#{occ.line}")}"
         end
         if pattern.occurrences.length > @max_occurrences_shown
           remaining = pattern.occurrences.length - @max_occurrences_shown
-          @output.puts "    … and #{remaining} more"
+          @output.puts "    #{@style.location("… and #{remaining} more")}"
         end
       end
     end
 
+    # The suggestion line varies with shape signal: small repeats want
+    # a generic partial; large/very-repeating shapes nudge toward a
+    # named component. Specific enough to be actionable without
+    # pretending we know the user's design system.
+    def suggestion_for(pattern)
+      if pattern.count >= 6
+        "repeats often enough that a named component is likely the right shape"
+      elsif pattern.size >= 10
+        "consider extracting into a ViewComponent (large enough to earn one)"
+      else
+        "consider extracting into a shared partial (e.g. _#{partial_hint(pattern)}.html.erb)"
+      end
+    end
+
+    # Quick name hint based on the root tag of the shape. Pure UX,
+    # not a contract — users will pick their own name.
+    def partial_hint(pattern)
+      pattern.shape[/\A(\w+)/, 1] || "shared"
+    end
+
     # Cap shape display length so deep nested patterns don't blow out
     # the terminal. The fingerprint is what we match on; the shape is
     # just for human inspection.

data/lib/guardrails/partial_similarity.rb

@@ -3,6 +3,7 @@
 require "pathname"
 require "set"
 require_relative "erb_parser"
+require_relative "report/style"
 
 module Guardrails
   class PartialSimilarity
@@ -20,11 +21,13 @@ module Guardrails
       "app/components/**/*_component.html.erb"
     ].freeze
 
-    def initialize(root:, output: $stdout, threshold: DEFAULT_THRESHOLD, ngram_size: DEFAULT_NGRAM_SIZE)
+    def initialize(root:, output: $stdout, threshold: DEFAULT_THRESHOLD,
+                   ngram_size: DEFAULT_NGRAM_SIZE, style: nil)
       @root = Pathname(root)
       @output = output
       @threshold = threshold
       @ngram_size = ngram_size
+      @style = style || Report::Style.new(io: output)
     end
 
     def run
@@ -202,30 +205,55 @@ module Guardrails
 
       groups = group_findings(findings)
       total_files = groups.sum { |g| g[:files].size }
+      group_noun = groups.length == 1 ? "group" : "groups"
 
       @output.puts ""
-      group_noun = groups.length == 1 ? "group" : "groups"
-      @output.puts "Guardrails templates: #{groups.length} similar #{group_noun} (#{findings.length} pairs across #{total_files} files; >= #{@threshold} structural similarity)"
+      @output.puts @style.section_heading(
+        :suggestion,
+        "similar partials (#{groups.length} #{group_noun}, #{findings.length} pairs, #{total_files} files)"
+      )
+      @output.puts "  Templates with >= #{@threshold} structural similarity. Likely duplicates;"
+      @output.puts "  consider extracting the common shape into a partial or parameterizing"
+      @output.puts "  one with locals to subsume the others."
 
       groups.each do |group|
+        @output.puts ""
         if group[:files].length == 2
-          # Use the original Finding so we keep the tag-count suffix
-          # (e.g. "(12 / 14 tags)") that single-pair output has always
-          # included. The sorted file list is still authoritative for
-          # display order.
+          # Pair — keep the tag-count suffix; it's a useful signal of
+          # how big the templates are.
           pair = group[:sample_pair]
           file_a, file_b = group[:files]
-          @output.puts "  #{format('%.2f', group[:score_max])}  #{file_a} ↔ #{file_b}  (#{pair.tag_count_a} / #{pair.tag_count_b} tags)"
+          header = "#{format('%.2f', group[:score_max])} similar: #{file_a} ↔ #{file_b}"
+          @output.puts "  #{@style.severity(:suggestion, header)}"
+          @output.puts "    #{@style.suggestion(suggestion_for_pair(group))}"
+          @output.puts "    #{@style.location("#{pair.tag_count_a} / #{pair.tag_count_b} tags")}"
         else
           score_label = if group[:score_min] == group[:score_max]
                          format("%.2f", group[:score_max])
                        else
                          "#{format('%.2f', group[:score_min])}–#{format('%.2f', group[:score_max])}"
                        end
-          @output.puts "  Group of #{group[:files].length} templates (#{score_label}, #{group[:pair_count]} pairs):"
-          group[:files].each { |f| @output.puts "    #{f}" }
+          header = "group of #{group[:files].length} similar templates (#{score_label}, #{group[:pair_count]} pairs)"
+          @output.puts "  #{@style.severity(:suggestion, header)}"
+          @output.puts "    #{@style.suggestion(suggestion_for_group(group))}"
+          group[:files].each { |f| @output.puts "    #{@style.location(f)}" }
         end
       end
     end
+
+    def suggestion_for_pair(group)
+      score = group[:score_max]
+      if score >= 0.95
+        "near-identical — pick one and delete the other, or merge with locals"
+      elsif score >= 0.85
+        "very similar — parameterize one with locals and render it from the other"
+      else
+        "shared structure — consider a partial that both can render"
+      end
+    end
+
+    def suggestion_for_group(group)
+      "#{group[:files].length} templates sharing structure — strong candidate for one shared partial"
+    end
   end
 end

data/lib/guardrails/report/style.rb

@@ -0,0 +1,124 @@
+# frozen_string_literal: true
+
+module Guardrails
+  module Report
+    # ANSI styling for the text audit report. Three rules:
+    #
+    #   1. Colors only when the output is a real terminal (TTY check).
+    #      Piping to a file or `tee` produces plain text.
+    #   2. `NO_COLOR=1` always wins. (https://no-color.org/ convention.)
+    #   3. Tests pass a non-TTY StringIO and get plain output by default
+    #      — no need to scrub ANSI sequences out of every expectation.
+    #
+    # Callers don't decide whether to colorize; they just call
+    # `Style.severity(:error, "raw_color")` and the style instance
+    # quietly emits ANSI or plain text based on those rules.
+    class Style
+      # Foreground codes, kept small. Bold + dim are modifiers, not
+      # colors — combined where we want emphasis without screaming.
+      ANSI = {
+        reset: "\e[0m",
+        bold: "\e[1m",
+        dim: "\e[2m",
+        red: "\e[31m",
+        yellow: "\e[33m",
+        green: "\e[32m",
+        cyan: "\e[36m",
+        blue: "\e[34m",
+        magenta: "\e[35m"
+      }.freeze
+
+      # Severity → (glyph, color) tuple. Glyphs are ASCII so they
+      # render in any terminal; we don't use emoji or box-drawing
+      # for the per-line tags. The summary box uses light box-drawing
+      # characters separately, with an ASCII fallback for terminals
+      # that mangle them (rare in 2026 but possible over SSH/PTY).
+      SEVERITY_FORMAT = {
+        error: { glyph: "x", color: :red, label: "ERROR" },
+        warning: { glyph: "!", color: :yellow, label: "WARNING" },
+        suggestion: { glyph: "i", color: :cyan, label: "SUGGEST" }
+      }.freeze
+
+      def initialize(io: $stdout, force: nil, no_color: nil)
+        @io = io
+        @force = force
+        @no_color = no_color
+      end
+
+      # True when we should emit ANSI sequences. Tests pass force:
+      # true/false to bypass auto-detection.
+      def color?
+        return @force unless @force.nil?
+        return false if no_color_env?
+
+        @io.respond_to?(:tty?) && @io.tty?
+      end
+
+      # Wrap text in an ANSI color code if `color?`, else return
+      # unchanged. `style` can be a single key or array (e.g.
+      # `[:bold, :red]`) — codes concatenate.
+      def colorize(text, style)
+        return text unless color?
+
+        codes = Array(style).map { |k| ANSI.fetch(k) }.join
+        "#{codes}#{text}#{ANSI[:reset]}"
+      end
+
+      # Tag a finding line with its severity. Output shape:
+      #
+      #   [error]   raw_color
+      #   [warning] helper_recommended
+      #   [suggest] pattern
+      #
+      # Padding aligns the brackets so columns line up across the
+      # report. Colorized form bolds the bracket+label.
+      def severity(level, category)
+        format = SEVERITY_FORMAT.fetch(level)
+        tag = "[#{format[:label].downcase}]".ljust(10)
+        "#{colorize(tag, [:bold, format[:color]])} #{category}"
+      end
+
+      # Section heading — bolded category label with a colored
+      # severity glyph in front. Used for the per-detector section
+      # intro: `x ERROR — raw_color (82 findings)`.
+      def section_heading(level, title)
+        format = SEVERITY_FORMAT.fetch(level)
+        glyph = colorize(format[:glyph], [:bold, format[:color]])
+        "#{glyph} #{colorize(format[:label], [:bold, format[:color]])} #{colorize("—", :dim)} #{colorize(title, :bold)}"
+      end
+
+      # File:line:col, in dim so it recedes when the content next to
+      # it is what matters. Returns plain text when colors are off.
+      def location(path)
+        colorize(path, :dim)
+      end
+
+      # Inline suggestion arrow. Always rendered the same way so the
+      # eye learns it: `→ <action>`. Cyan so it stands out from the
+      # finding line without competing with the severity color.
+      def suggestion(text)
+        "#{colorize("→", :cyan)} #{text}"
+      end
+
+      # Box-drawing characters for the top-of-report summary header.
+      # Falls back to ASCII (`+ - |`) when colors are off, since
+      # both behaviors track the same TTY/NO_COLOR signal.
+      def box_chars
+        if color?
+          { tl: "╭", tr: "╮", bl: "╰", br: "╯", h: "─", v: "│", t: "├", b: "┤" }
+        else
+          { tl: "+", tr: "+", bl: "+", br: "+", h: "-", v: "|", t: "+", b: "+" }
+        end
+      end
+
+      private
+
+      def no_color_env?
+        return @no_color unless @no_color.nil?
+
+        # Per https://no-color.org/: ANY value (even empty) disables color.
+        ENV.key?("NO_COLOR")
+      end
+    end
+  end
+end

data/lib/guardrails/report/summary.rb

@@ -0,0 +1,104 @@
+# frozen_string_literal: true
+
+require_relative "style"
+
+module Guardrails
+  module Report
+    # Top-of-report triage view. Builds a grouped severity rollup from
+    # the audit's per-detector counts, so the reader sees the shape of
+    # the findings before scrolling through the per-section detail.
+    #
+    # Each detector contributes one Entry. The rake task assembles the
+    # full list after running its sub-audits and hands it to Summary.
+    # Detector logic isn't aware of the report; Summary doesn't know
+    # about specific detectors. That decoupling matters when we add
+    # new detectors — they only need to register an Entry.
+    class Summary
+      # Severity order in the report: errors first (urgent), warnings
+      # next (probably-fix), suggestions last (consider).
+      SEVERITY_ORDER = %i[error warning suggestion].freeze
+
+      Entry = Struct.new(:category, :count, :severity, :unit, :action, :auto_fix,
+                         keyword_init: true) do
+        # `unit` is the noun shown after the count: "findings",
+        # "candidates", "groups", "clusters" — each detector picks
+        # what reads naturally. Defaults to "findings".
+        def unit
+          self[:unit] || "findings"
+        end
+      end
+
+      def initialize(entries:, output:, style: nil)
+        @entries = entries.reject { |e| e.count.zero? }
+        @output = output
+        @style = style || Style.new(io: output)
+      end
+
+      def render(recap: false)
+        return if @entries.empty?
+
+        @output.puts ""
+        @output.puts header_line(recap: recap)
+        @output.puts ""
+
+        SEVERITY_ORDER.each do |severity|
+          group = @entries.select { |e| e.severity == severity }
+          next if group.empty?
+
+          render_severity_group(severity, group)
+        end
+
+        @output.puts divider
+      end
+
+      private
+
+      def header_line(recap: false)
+        kind = recap ? "recap" : "audit"
+        title = "Guardrails #{kind}  —  #{total_findings} #{total_findings == 1 ? "finding" : "findings"}"
+        bar = "═" * 3
+        bar_plain = "=" * 3
+        # The divider character tracks the color setting so an
+        # ANSI-stripped pipe stays ASCII-only.
+        bar_used = @style.color? ? bar : bar_plain
+        rest = (@style.color? ? "═" : "=") * [70 - title.length - bar_used.length - 4, 4].max
+
+        "#{@style.colorize(bar_used + ' ', :bold)}" \
+          "#{@style.colorize(title, :bold)} " \
+          "#{@style.colorize(rest, :dim)}"
+      end
+
+      def render_severity_group(severity, entries)
+        total = entries.sum(&:count)
+        @output.puts "  #{@style.section_heading(severity, "#{entries.length} #{entries.length == 1 ? "category" : "categories"}, #{total} #{total == 1 ? "finding" : "findings"}")}"
+
+        entries.sort_by { |e| -e.count }.each do |entry|
+          render_entry(entry)
+        end
+        @output.puts ""
+      end
+
+      def render_entry(entry)
+        name = entry.category.ljust(32)
+        unit = entry.unit
+        unit = unit.sub(/s\z/, "") if entry.count == 1 && unit.end_with?("s")
+        count_str = "#{entry.count.to_s.rjust(4)} #{unit}".ljust(22)
+        flags = []
+        flags << @style.colorize("[auto-fix available]", :green) if entry.auto_fix
+        flags << @style.colorize(entry.action, :dim) if entry.action && !entry.auto_fix
+
+        line = "    #{name}#{count_str}#{flags.join(' ')}".rstrip
+        @output.puts line
+      end
+
+      def divider
+        char = @style.color? ? "═" : "="
+        @style.colorize(char * 75, :dim)
+      end
+
+      def total_findings
+        @entries.sum(&:count)
+      end
+    end
+  end
+end

data/lib/guardrails/stimulus_audit.rb

@@ -1,6 +1,7 @@
 # frozen_string_literal: true
 
 require "pathname"
+require_relative "report/style"
 
 module Guardrails
   class StimulusAudit
@@ -36,9 +37,10 @@ module Guardrails
     RUBY_DATA_CONTROLLER_PATTERN =
       /data:?\s*(?:=>)?\s*\{[^}]*?controller:?\s*(?:=>)?\s*["']([^"']+)["']/m
 
-    def initialize(root:, output: $stdout)
+    def initialize(root:, output: $stdout, style: nil)
       @root = Pathname(root)
       @output = output
+      @style = style || Report::Style.new(io: output)
     end
 
     def run
@@ -102,16 +104,38 @@ module Guardrails
     def print_report(result)
       return unless result.violations?
 
-      @output.puts ""
       unless result.orphaned.empty?
         noun = result.orphaned.length == 1 ? "controller" : "controllers"
-        @output.puts "Guardrails stimulus: #{result.orphaned.length} orphaned #{noun} (referenced in HTML, no JS file)"
-        result.orphaned.each { |name| @output.puts "  - #{name}" }
+        @output.puts ""
+        @output.puts @style.section_heading(
+          :warning,
+          "stimulus orphaned (#{result.orphaned.length} #{noun})"
+        )
+        @output.puts "  data-controller=\"…\" references a Stimulus controller, but no matching"
+        @output.puts "  *_controller.{js,ts} file exists. Either create the controller or"
+        @output.puts "  remove the reference."
+        result.orphaned.each do |name|
+          @output.puts ""
+          @output.puts "  #{@style.severity(:warning, "stimulus orphaned: #{name}")}"
+          @output.puts "    #{@style.suggestion("create app/javascript/controllers/#{name}_controller.js or remove the data-controller=\"#{name}\" reference")}"
+        end
       end
+
       unless result.dead.empty?
         noun = result.dead.length == 1 ? "controller" : "controllers"
-        @output.puts "Guardrails stimulus: #{result.dead.length} dead #{noun} (JS file, never referenced)"
-        result.dead.each { |name| @output.puts "  - #{name}" }
+        @output.puts ""
+        @output.puts @style.section_heading(
+          :warning,
+          "stimulus dead (#{result.dead.length} #{noun})"
+        )
+        @output.puts "  *_controller.{js,ts} file exists, but no view references it via"
+        @output.puts "  data-controller=\"…\". Either wire the controller into a template"
+        @output.puts "  or delete the file."
+        result.dead.each do |name|
+          @output.puts ""
+          @output.puts "  #{@style.severity(:warning, "stimulus dead: #{name}")}"
+          @output.puts "    #{@style.suggestion("reference it via data-controller=\"#{name}\" in a view, or delete the JS file")}"
+        end
       end
     end
   end

data/lib/guardrails/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module Guardrails
-  VERSION = "1.0.0"
+  VERSION = "1.2.0"
 end

data/lib/guardrails/view_component_audit.rb

@@ -1,6 +1,7 @@
 # frozen_string_literal: true
 
 require "pathname"
+require_relative "report/style"
 
 module Guardrails
   class ViewComponentAudit
@@ -22,9 +23,10 @@ module Guardrails
 
     SLOT_PATTERN = /^\s*(renders_one|renders_many)\s+:([a-z_][\w]*)/
 
-    def initialize(root:, output: $stdout)
+    def initialize(root:, output: $stdout, style: nil)
       @root = Pathname(root)
       @output = output
+      @style = style || Report::Style.new(io: output)
     end
 
     def run
@@ -132,17 +134,38 @@ module Guardrails
     def print_report(result)
       return unless result.violations?
 
-      @output.puts ""
       unless result.missing_previews.empty?
         noun = result.missing_previews.length == 1 ? "component" : "components"
-        @output.puts "Guardrails view_components: #{result.missing_previews.length} #{noun} without a preview"
-        result.missing_previews.each { |name| @output.puts "  - #{name}_component.rb (no #{name}_component_preview.rb)" }
+        @output.puts ""
+        @output.puts @style.section_heading(
+          :warning,
+          "view_components missing previews (#{result.missing_previews.length} #{noun})"
+        )
+        @output.puts "  Component classes without a corresponding Lookbook preview file."
+        @output.puts "  Add #{noun} previews so the component is discoverable + visually testable."
+        result.missing_previews.each do |name|
+          @output.puts ""
+          @output.puts "  #{@style.severity(:warning, "missing preview: #{name}_component")}"
+          @output.puts "    #{@style.suggestion("create test/components/previews/#{name}_component_preview.rb (or lookbook/previews/...)")}"
+        end
       end
+
       unless result.orphan_slots.empty?
-        noun = result.orphan_slots.length == 1 ? "slot declared" : "slots declared"
-        @output.puts "Guardrails view_components: #{result.orphan_slots.length} #{noun} but never referenced in template"
+        noun = result.orphan_slots.length == 1 ? "slot" : "slots"
+        @output.puts ""
+        @output.puts @style.section_heading(
+          :warning,
+          "view_components orphan slots (#{result.orphan_slots.length} #{noun})"
+        )
+        @output.puts "  renders_one / renders_many declared in the component class but never"
+        @output.puts "  referenced in the template. Either reference the slot or remove the"
+        @output.puts "  declaration."
         result.orphan_slots.each do |o|
-          @output.puts "  - #{o.component}_component: :#{o.slot} (#{o.slot_kind} at #{o.file}:#{o.line})"
+          @output.puts ""
+          header = "orphan slot: #{o.component}_component##{o.slot} (#{o.slot_kind})"
+          @output.puts "  #{@style.severity(:warning, header)}"
+          @output.puts "    #{@style.suggestion("reference :#{o.slot} in the template, or remove the #{o.slot_kind} declaration")}"
+          @output.puts "    #{@style.location("#{o.file}:#{o.line}")}"
         end
       end
     end

data/lib/guardrails/visual_diff.rb

@@ -2,6 +2,7 @@
 
 require "pathname"
 require_relative "configuration"
+require_relative "report/style"
 
 module Guardrails
   # Consumes screenshot-diff tool output and folds findings into the
@@ -36,7 +37,7 @@ module Guardrails
     end
 
     def initialize(root:, output: $stdout,
-                   adapter: nil, threshold: nil)
+                   adapter: nil, threshold: nil, style: nil)
       @root = Pathname(root)
       @output = output
       cfg = Guardrails.configuration.visual_diff
@@ -46,6 +47,7 @@ module Guardrails
       # adapter = "snap_diff"; c.visual_diff.threshold = "0.1" }`.
       @adapter_name = coerce_adapter(adapter) || cfg.adapter
       @threshold = threshold.nil? ? cfg.threshold : Float(threshold)
+      @style = style || Report::Style.new(io: output)
     end
 
     def run
@@ -96,19 +98,27 @@ module Guardrails
     def print_report(findings)
       return if findings.empty?
 
+      noun = findings.length == 1 ? "finding" : "findings"
       @output.puts ""
-      @output.puts "Guardrails visual diff: #{findings.length} finding#{'s' if findings.length != 1} " \
-                   "(adapter: #{@adapter_name}, threshold: #{@threshold})"
+      @output.puts @style.section_heading(
+        :error,
+        "visual diff (#{findings.length} #{noun}, adapter: #{@adapter_name}, threshold: #{@threshold})"
+      )
+      @output.puts "  Screenshot-diff tool flagged these scenarios. Review each diff image"
+      @output.puts "  and either accept the new baseline (commit the updated screenshot) or"
+      @output.puts "  fix the regression that caused the visual change."
 
       findings.each do |f|
         ratio_label = f.mismatch_ratio.nil? ? "[diff present]" : "[#{(f.mismatch_ratio * 100).round(2)}% mismatch]"
         suffix = f.viewport ? " (#{f.viewport})" : ""
+
         @output.puts ""
-        @output.puts "  #{ratio_label} #{f.scenario}#{suffix}"
-        @output.puts "    baseline: #{f.baseline_path}" if f.baseline_path
-        @output.puts "    diff:     #{f.diff_path}" if f.diff_path
-        @output.puts "    url:      #{f.url}" if f.url
-        @output.puts "    selector: #{f.selector}" if f.selector
+        @output.puts "  #{@style.severity(:error, "#{ratio_label} #{f.scenario}#{suffix}")}"
+        @output.puts "    #{@style.suggestion("compare baseline ↔ diff; accept the new baseline or fix the regression")}"
+        @output.puts "    #{@style.location("baseline: #{f.baseline_path}")}" if f.baseline_path
+        @output.puts "    #{@style.location("diff:     #{f.diff_path}")}" if f.diff_path
+        @output.puts "    #{@style.location("url:      #{f.url}")}" if f.url
+        @output.puts "    #{@style.location("selector: #{f.selector}")}" if f.selector
       end
     end
   end