grouped_property_scss_linter 1.1.3 → 1.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: e22237fdcbef363b71f89896640289081051eeff
-  data.tar.gz: 0056fd882b1a9b93488294289b4dfa5b2c21d90e
+  metadata.gz: 6f8c803f54317ac3e4374581fcfb3dda569a7fc1
+  data.tar.gz: f00651abd47e49ac7f1cd7cabd85dac18d0ee70d
 SHA512:
-  metadata.gz: cfece3ebdca1ca05691671646bb7530c1fc2733674911c1f63aae367688fcceba950fa14a626c780575874a35ae66f625e54971111f87e32c1e8c7c4a3d6f1fa
-  data.tar.gz: bbf00eaf2b8a150e0da8c9db5d3661274f54c94eef766e3cef375f637d792ea72a8e9cc3f97893fd4417063c721e5fc5ea521339d8f3735cb17bb86efe7b72a3
+  metadata.gz: 6cb9ca4609aa14869698619c8395cc4f28b4d9b491ce18c4b65b73967dd031ba4af873426648373e1c9a2158ae3d370f1886b0054bd41606df66caf26c757979
+  data.tar.gz: 52b8291bfb2f463e6336950e9e3d9c754e63a4f5bc0699080f557a1cbb52599d4fe6a1b9de7c47d37e20f29d98cf950062e56f6d8045068f089446ddc3159bdf

data/.editorconfig

@@ -0,0 +1,13 @@
+# EditorConfig is awesome: http://EditorConfig.org
+
+# top-most EditorConfig file
+root = true
+
+# Defaults for all files
+[*]
+end_of_line = lf
+insert_final_newline = true
+charset = utf-8
+indent_style = space
+indent_size = 2
+trim_trailing_whitespace = true

data/.scss-lint.yml

@@ -10,6 +10,9 @@ linters:
     # preferred style
     style:  grouped-smacss
 
+    # whether CSS variables should go first, or be ignored
+    css_variables_first: true
+
     # or a definition of your own. Note that this takes precedence over style
     groups:
 

data/LICENSE.txt

@@ -1,4 +1,4 @@
-Copyright (c) 2016–2017 Jon Pearse
+Copyright (c) 2016–2018 Jon Pearse
 
 MIT License
 

data/README.textile

@@ -90,6 +90,7 @@ h3. Options
 - @enabled@ _(boolean)_ := switches the module on and off (default: on)
 - @defaults@ _(hash)_ := default linting settings that are applied to all groups (can be overridden per-group)
 - @style@ _(string, optional)_ := the name of a preconfigured style (see below, defaults to @grouped-smacss@)
+- @css_variables_first@ _(boolean, optional)_ := whether or not require CSS variables (custom properties) are defined first (default: @true@)
 - @groups@ _(hash, optional)_ := a hash of configured groups. Note that specifying anything here will override the @style@ option
 - @extended_hinting@ _(boolean, optional)_ := enables additional group information in hinting output (default @false@)
 
@@ -159,7 +160,12 @@ I’ve written a "blog post":https://jonpearse.net/articles/2016/07/on-linting-a
 
 h2. Version History
 
-h3. 1.1.2 _(March 18th, 2017)_
+h3. 1.2.0 _(May 21st, 2018)_
+
+* *[FIX]* CSS variables no longer cause an infinite loop (fixes issue #1)
+* moved stuff around in my ‘personal’ preset
+
+h3. 1.1.3 _(March 18th, 2017)_
 
 * eventually pushing this up to RubyGems
 

data/data/concentric.yaml

@@ -1,9 +1,11 @@
 # Concentric CSS [ http://rhodesmill.org/brandon/2011/concentric-css/ ]
 #
-# This is roughly based on SCSS-Lint‘s specification, found at
-# [ https://github.com/brigade/scss-lint/blob/master/data/property-sort-orders/concentric.txt ]
+# This ordering is adapted from Brandon’s guidelines from [ https://github.com/brandon-rhodes/Concentric-CSS/blob/master/style3.css ]
 groups:
-  directions:
+  box-sizing:
+    - box-sizing
+
+  position:
     - display
     - position
     - top
@@ -11,72 +13,223 @@ groups:
     - bottom
     - left
 
-  columns:
-    - columns
-    - column*
-
   float:
     - float
     - clear
 
+  # Inserting grid here because it seems reasonable to have it ‘above’ flex: feel free to disagree =)
+  grid:
+    - grid
+    - grid-*
+
+  align-content:
+    - align-content
+    - align-items
+    - align-self
+
+  flex:
+    - flex
+    - flex-basis
+    - flex-direction
+    - flex-flow
+    - flex-grow
+    - flex-shrink
+    - flex-wrap
+    - justify-content
+
+  order:
+    - order
+
+  columns:
+    columns
+    column-*
+
   transform:
-    - transform*
+    - backface-visibility
+    - perspective
+    - perspective-origin
+    - transform
+    - transform-origin
+    - transform-style
+
+
+  transitions:
     - transition
-    - animation*
+    - transition-delay
+    - transition-duration
+    - transition-property
+    - transition-timing-function
 
   visibility:
     - visibility
     - opacity
     - z-index
 
-  box:
-    - margin*
+  margin:
+    - margin
+    - margin-top
+    - margin-right
+    - margin-bottom
+    - margin-left
+
+  outline:
     - outline
+    - outline-offset
+    - outline-width
+    - outline-style
+    - outline-color
+
+  borders:
     - border
+    - border-top
+    - border-right
+    - border-bottom
+    - border-left
+    - border-width
+    - border-top-width
+    - border-right-width
+    - border-bottom-width
+    - border-left-width
+
+  border-styles:
     - border-style
-    - border-color
+    - border-top-style
+    - border-right-style
+    - border-bottom-style
+    - border-left-style
+
+  border-radius:
     - border-radius
-    - border-width
+    - border-top-left-radius
+    - border-top-right-radius
+    - border-bottom-left-radius
+    - border-bottom-right-radius
+
+  border-colours:
+    - border-color
+    - border-top-color
+    - border-right-color
+    - border-bottom-color
+    - border-left-color
+
+  border-image:
     - border-image
-    - border-top*
-    - border-right*
-    - border-bottom*
-    - border-left*
+    - border-image-source
+    - border-image-width
+    - border-image-outset
+    - border-image-repeat
+    - border-image-slice
+
+  box-shadow:
     - box-shadow
-    - background*
+
+  background:
+    - background
+    - background-attachment
+    - background-clip
+    - background-color
+    - background-image
+    - background-origin
+    - background-position
+    - background-repeat
+    - background-size
+
+  cursor:
     - cursor
-    - padding*
 
-  dimensions:
+  padding:
+    - padding
+    - padding-top
+    - padding-right
+    - padding-bottom
+    - padding-left
+
+  width:
     - width
     - min-width
     - max-width
+
+  height:
     - height
     - min-height
     - max-height
-    - overflow*
 
-  lists:
-    - list-style*
+  overflow:
+    - overflow
+    - overflow-x
+    - overflow-y
+    - resize
 
-  tables:
+  list-style:
+    - list-style
+    - list-style-type
+    - list-style-position
+    - list-style-image
     - caption-side
+
+  tables:
     - table-layout
     - border-collapse
     - border-spacing
     - empty-cells
 
-  content:
+  animation:
+    - animation
+    - animation-name
+    - animation-duration
+    - animation-timing-function
+    - animation-delay
+    - animation-iteration-count
+    - animation-direction
+    - animation-fill-mode
+    - animation-play-state
+
+  vertical-aligment:
     - vertical-align
-    - text*
+
+  text-alignment-decoration:
+    - direction
+    - tab-size
+    - text-align
+    - text-align-last
+    - text-justify
+    - text-indent
+    - text-transform
+    - text-decoration
+    - text-decoration-color
+    - text-decoration-line
+    - text-decoration-style
+    - text-rendering
+    - text-shadow
+    - text-overflow
+
+  text-spacing:
     - line-height
     - word-spacing
     - letter-spacing
     - white-space
+    - word-break
+    - word-wrap
     - color
-    - font*
 
-  generated:
+  font:
+    - font
+    - font-family
+    - font-size
+    - font-size-adjust
+    - font-stretch
+    - font-weight
+    - font-smoothing
+    - font-variant
+    - font-style
+
+  content:
     - content
     - quotes
-    - counter*  # it strikes me that this should be in lists, but it’s generated, so…
+
+  counters:
+    - counter-reset
+    - counter-increment
+
+  breaks:
+    - page-break-*

data/data/grouped-smacss.yaml

@@ -9,6 +9,10 @@ groups:
     - bottom
     - left
 
+  grid:
+    - grid
+    - grid-*
+
   flex:
     - flex
     - flex-basis

data/data/personal.yaml

@@ -13,6 +13,25 @@ groups:
       - clear
       - content
       - box-sizing
+      - object-fit
+
+  grid-parent:
+    properties:
+      - grid
+      - grid-template
+      - grid-template-*
+      - grid-auto-*
+      - grid-gap
+      - grid-row-gap
+      - grid-column-gap
+
+  grid-child:
+    properties:
+      - grid-area
+      - grid-row-start
+      - grid-row-end
+      - grid-column-start
+      - grid-column-end
 
   flex-parent:
     properties:
@@ -32,6 +51,11 @@ groups:
       - flex-basis
       - align-self
 
+  columns:
+    properties:
+      - columns
+      - column-*
+
   tables:
     max_no_space: 1
     properties:
@@ -55,7 +79,7 @@ groups:
       - margin*
       - transform
 
-  presentational:
+  borders:
     properties:
       - outline*
       - border
@@ -68,6 +92,9 @@ groups:
       - border-right*
       - border-bottom*
       - border-left*
+
+  presentational:
+    properties:
       - background*
       - opacity
       - z-index
@@ -92,9 +119,12 @@ groups:
       - text-transform
       - text-shadow
       - white-space
-      - content
-      
+
   interaction:
     properties:
       - transition
       - animation
+
+  generated:
+    properties:
+      - content

data/data/smacss.yaml

@@ -11,6 +11,8 @@ groups:
     - right
     - bottom
     - left
+    - grid
+    - grid-*
     - flex
     - flex-basis
     - flex-direction

data/grouped_property_scss_linter.gemspec

@@ -7,7 +7,7 @@ Gem::Specification.new do |spec|
   spec.name          = "grouped_property_scss_linter"
   spec.version       = GroupedPropertyScssLinter::VERSION
   spec.authors       = ["Jon Pearse"]
-  spec.email         = ["jon@jonpearse.net"]
+  spec.email         = ["hello@jonpearse.net"]
   spec.summary       = "SCSS Lint plugin"
   spec.description   = "Plugin for SCSS lint that lints the order of properties based on fuzzy groups"
   spec.homepage      = "https://github.com/jonpearse/grouped_property_scss_linter"

data/lib/grouped_property_scss_linter/grouped_property_order.rb

@@ -13,11 +13,11 @@ module SCSSLint
       @property_to_group = {}
       count = 0
       @configured_groups.each_pair do |name, group|
-        @groups.push name
-        group['properties'].each do |property|
-          @property_to_group[property] = { name: name, idx: count }
-        end
-        count = count+1
+
+        @groups <<  name
+        group['properties'].each{ |property| @property_to_group[property] = { name: name, idx: count }}
+        count += 1
+
       end
 
       yield
@@ -28,9 +28,7 @@ module SCSSLint
     def check_order( node )
 
       # 1. get a list of properties we can sort
-      sortable_properties = node.children.select do |child|
-        child.is_a? Sass::Tree::PropNode
-      end
+      sortable_properties = node.children.select{ |child| child.is_a?( Sass::Tree::PropNode )}
 
       # 2. group things
       grouped_properties = {}
@@ -40,15 +38,13 @@ module SCSSLint
         name = prop.name.join
 
         # attempt to match the name
-        group = find_match_for_property name
+        group = find_match_for_property( name )
 
         # if it didn’t find anything, move on
         next if group.nil?
 
         # if there’s no existing group
-        unless grouped_properties.key? group[:name]
-          grouped_properties[group[:name]] = { first: 1.0/0, last: 0, props: [] }
-        end
+        grouped_properties[group[:name]] = { first: 1.0/0, last: 0, props: [] } unless grouped_properties.key?( group[:name] )
 
         # build a concat
         concat = { name: name, node: prop, group: group[:name], line: prop.line, group_idx: group[:idx] }
@@ -64,9 +60,7 @@ module SCSSLint
       props.compact!
 
       # 3. call down
-      unless grouped_properties.empty?
-        check_sort_order props, grouped_properties
-      end
+      check_sort_order( props, grouped_properties ) unless grouped_properties.empty?
 
       # 4. yield so we can process children
       yield
@@ -80,8 +74,10 @@ module SCSSLint
     alias visit_prop  check_order
 
     def visit_if(node, &block)
+
       check_order(node, &block)
       visit(node.else) if node.else
+
     end
 
     private
@@ -100,11 +96,24 @@ module SCSSLint
         # 3. if it failed, bail
         raise 'No groups configured' if groups.nil?
 
-        # 4. munge
-        groups.update(groups) do |name, group|
+        # 4. if we’re worrying about CSS variables
+        if config['css_variables_first']
+
+          groups = {
+            'css_vars' => {
+              'properties' => [ '{VARIABLE}' ],
+              'space_around' => true,
+              'max_no_space' => 0
+            }
+          }.merge( groups )
+
+        end
+
+        # 5. munge
+        groups.update( groups ) do |name, group|
 
           # a. if it’s an array, cast it
-          group = { 'properties' => group } if group.is_a? Array
+          group = { 'properties' => group } if group.is_a?( Array )
 
           # b. merge in some defaults
           group['space_around'] = defaults['space_around'] if group['space_around'].nil?
@@ -123,22 +132,22 @@ module SCSSLint
       def load_groups_from_style
 
         # 0. if the style is blank/empty…
-        (raise 'No style specified' and return) if config['style'].empty?
+        ( raise 'No style specified' and return ) if config['style'].empty?
 
         # 1. attempt to find the file
-        data_filename = File.join(GroupedPropertyScssLinter::STYLES_DIR, "#{config['style']}.yaml")
+        data_filename = File.join( GroupedPropertyScssLinter::STYLES_DIR, "#{config['style']}.yaml" )
 
         # 2. does it exist
-        (raise "No style ‘#{config['style']}’ found" and return) unless File.exists? data_filename
+        ( raise "No style ‘#{config['style']}’ found" and return ) unless File.exists?( data_filename )
 
         # 3. can we read it
-        (raise "Cannot read style ‘#{config['style']}’" and return) unless File.readable? data_filename
+        ( raise "Cannot read style ‘#{config['style']}’" and return ) unless File.readable?( data_filename )
 
         # 4. open
-        style_config = YAML.load_file data_filename
+        style_config = YAML.load_file( data_filename )
 
         # 5. barf?
-        (raise "Bad style file found for ‘#{config['style']}’" and return) if style_config.nil? or style_config['groups'].nil?
+        ( raise "Bad style file found for ‘#{config['style']}’" and return ) if ( style_config.nil? or style_config['groups'].nil? )
 
         style_config['groups']
       end
@@ -146,8 +155,11 @@ module SCSSLint
       # Finds a matching group for a specified property
       def find_match_for_property( prop )
 
+        # if it’s a property
+        prop = '{VARIABLE}' if ( prop.start_with?( '--' ))
+
         # sanitise the name by removing any browser prefixes
-        prop = prop.gsub(/^(-\w+(-osx)?-)?/, '')
+        prop = prop.gsub( /^(-\w+(-osx)?-)?/, '' )
 
         # iteratively remove hyphens from the property…
         while prop =~ /\-/
@@ -155,18 +167,19 @@ module SCSSLint
           # if we know about this property or its splatted variety…
           if @property_to_group.key? prop or @property_to_group.key? prop+'*'
 
-            return @property_to_group[prop] || @property_to_group[prop+'*']
+            return ( @property_to_group[prop] || @property_to_group[prop+'*'] )
 
           end
 
-          prop.gsub! /\-(\w+)$/, ''
+          # strip the leading hyphen and try again
+          prop.gsub!( /\-(\w+)$/, '' )
 
         end
 
         # finally…
         if @property_to_group.key? prop or @property_to_group.key? prop+'*'
 
-          return @property_to_group[prop] || @property_to_group[prop+'*']
+          return ( @property_to_group[prop] || @property_to_group[prop+'*'] )
 
         end
 
@@ -186,7 +199,7 @@ module SCSSLint
         end
 
         # quick duck-type
-        quick_check_order props, grouped
+        quick_check_order( props, grouped )
 
         # if we’re checking whitespace, do so
         check_whitespace( grouped ) unless grouped.length < 2
@@ -204,17 +217,28 @@ module SCSSLint
           next if prop[:group] == @groups[current_group]
 
           # find an index
-          idx = @groups.index prop[:group]
+          idx = @groups.index( prop[:group] )
 
           # if it’s less-than, error out
           if idx < current_group
 
-            ext = config['extended_hinting'] ? " (assigned group ‘#{prop[:group].bold}’, found group ‘#{@groups[current_group].bold}’)" : ""
+            if prop[:name].start_with?( '--' )
+
+              add_lint( prop[:node], "CSS variables should be defined at the beginning of the rule (found #{prop[:name].bold})")
+
+            else
 
-            add_lint prop[:node], "property ‘#{prop[:name].bold}’ should be #{hint_text_for(prop, grouped, props)}#{ext}"
+              ext = config['extended_hinting'] ? " (assigned group ‘#{prop[:group].bold}’, found group ‘#{@groups[current_group].bold}’)" : ""
+
+              add_lint( prop[:node], "property ‘#{prop[:name].bold}’ should be #{hint_text_for(prop, grouped, props)}#{ext}" )
+
+            end
             good = false
+
           else
+
             current_group = idx
+
           end
 
         end
@@ -236,10 +260,10 @@ module SCSSLint
           group_conf = @configured_groups[name]
 
           # if we don’t care about space, bail
-          (curr_idx += 1 and next) unless group_conf['space_around']
+          ( curr_idx += 1 and next ) unless group_conf['space_around']
 
           # similarly, if this group is too small to trigger spacing, bounce
-          (curr_idx += 1 and next)unless current[:props].length > group_conf['max_no_space']
+          ( curr_idx += 1 and next ) unless current[:props].length > group_conf['max_no_space']
 
           # set some easy references
           next_group = detected_groups.length > curr_idx ? grouped[detected_groups[curr_idx + 1]] : nil
@@ -249,17 +273,18 @@ module SCSSLint
           if !next_group.nil? and ((next_group[:first] - current[:last]) < 2)
 
             # raise a lint error
-            add_lint current[:props].last[:node], "Must be at least one empty line after ‘#{current[:props].last[:name]}’"
+            add_lint( current[:props].last[:node], "Must be at least one empty line after ‘#{current[:props].last[:name]}’" )
 
             # also, flag the next group so we don’t catch it next time ‘round
             next_group[:raised] = true
+
           end
 
           # if there’s something before us, and there’s no space…
           if !prev_group.nil? and ((current[:first] - prev_group[:last]) < 2) and current[:raised].nil?
 
             # raise a lint error
-            add_lint current[:props].first[:node], "Must be at least one empty line before ‘#{current[:props].first[:name]}’"
+            add_lint( current[:props].first[:node], "Must be at least one empty line before ‘#{current[:props].first[:name]}’" )
 
           end
 
@@ -275,13 +300,14 @@ module SCSSLint
         dst_group = prop[:group]
 
         # if we know about the group…
-        if grouped_props.key? dst_group
+        if grouped_props.key?( dst_group )
 
           # get the first property of the current group
           dst_prop = grouped_props[dst_group][:props].first
 
           # if it’s a different property, return
           return "after ‘#{dst_prop[:name].bold}’" if dst_prop != prop
+
         end
 
         # either our offending property is the sole member of a group, or it’s very lost… so look for a previous marker
@@ -300,11 +326,13 @@ module SCSSLint
 
             # and return
             return "after ‘#{dst_prop[:name].bold}’"
+
           end
         end
 
         # otherwise, it probably belongs right at the start
         "before ‘#{context.first[:name].bold}’"
+
       end
   end
 end

data/lib/grouped_property_scss_linter/version.rb

@@ -1,3 +1,3 @@
 module GroupedPropertyScssLinter
-  VERSION = "1.1.3"
+  VERSION = '1.2.0'.freeze
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: grouped_property_scss_linter
 version: !ruby/object:Gem::Version
-  version: 1.1.3
+  version: 1.2.0
 platform: ruby
 authors:
 - Jon Pearse
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2017-03-18 00:00:00.000000000 Z
+date: 2018-05-21 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bundler
@@ -55,11 +55,12 @@ dependencies:
 description: Plugin for SCSS lint that lints the order of properties based on fuzzy
   groups
 email:
-- jon@jonpearse.net
+- hello@jonpearse.net
 executables: []
 extensions: []
 extra_rdoc_files: []
 files:
+- ".editorconfig"
 - ".gitignore"
 - ".scss-lint.yml"
 - Gemfile
@@ -95,7 +96,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
       version: '0'
 requirements: []
 rubyforge_project: 
-rubygems_version: 2.6.10
+rubygems_version: 2.6.14
 signing_key: 
 specification_version: 4
 summary: SCSS Lint plugin