Class: Rubocop::Cop::Tailwind::StringInterpolation

Inherits:
RuboCop::Cop::Base
  • Object
show all
Defined in:
lib/rubocop/cop/tailwind/string_interpolation.rb

Overview

This prevents utility class names from being built dynamically using string interpolation. Tailwind needs to be able to parse fully qualified names to include the necessary utils in the bundle.

Examples:

# bad
bgColor = "gl-bg-#{palette}-#{variant}"
cssClasses = "gl-#{display} gl-border"
width = "gl-w-1/#{denominator}"

# good
bgColor = "gl-bg-red-800"
cssClasses = "gl-flex gl-border"
width = "gl-w-1/2"

Constant Summary collapse

TAILWIND_CSS_CLASS =
%r{(^|\s)gl-[a-z0-9\-/]*$}
MSG =
'String interpolations in CSS utility class names are forbidden. See https://gitlab.com/gitlab-org/ruby/gems/gitlab-styles/-/issues/73.'

Instance Method Summary collapse

Instance Method Details

#interpolated_tailwind_class?(node) ⇒ Object



24
25
26
27
28
29
30
# File 'lib/rubocop/cop/tailwind/string_interpolation.rb', line 24

def_node_matcher :interpolated_tailwind_class?, <<~PATTERN
  (dstr
    (str /#{TAILWIND_CSS_CLASS}/)
    (begin ...)
    ...
  )
PATTERN

#on_dstr(node) ⇒ Object



32
33
34
35
36
# File 'lib/rubocop/cop/tailwind/string_interpolation.rb', line 32

def on_dstr(node)
  return unless interpolated_tailwind_class?(node)

  add_offense(node)
end