mirror of
https://github.com/primer/css.git
synced 2024-12-25 07:03:35 +03:00
create classes.json at prepare time
This commit is contained in:
parent
9c6e29f935
commit
3af1845f12
1
tools/stylelint-selector-no-utility/.gitignore
vendored
Normal file
1
tools/stylelint-selector-no-utility/.gitignore
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
classes.json
|
@ -1,34 +1,31 @@
|
|||||||
var stylelint = require("stylelint")
|
const stylelint = require('stylelint')
|
||||||
var primerUtilities = require("primer-utilities")
|
|
||||||
|
|
||||||
var ruleName = "primer/selector-no-utility"
|
const ruleName = 'primer/selector-no-utility'
|
||||||
var messages = stylelint.utils.ruleMessages(ruleName, {
|
const messages = stylelint.utils.ruleMessages(ruleName, {
|
||||||
rejected: function(classname) { return "Avoid styling the utilty class `" + classname + "`" }
|
rejected: classname => `Avoid styling the utilty class "${classname}"`
|
||||||
})
|
})
|
||||||
|
|
||||||
module.exports = stylelint.createPlugin(ruleName, function(enabled) {
|
const match = require('./match')
|
||||||
return function(root, result) {
|
const utilityClasses = require('./classes.json')
|
||||||
|
|
||||||
var validOptions = stylelint.utils.validateOptions(result, ruleName, {
|
module.exports = stylelint.createPlugin(ruleName, enabled => {
|
||||||
|
return (root, result) => {
|
||||||
|
|
||||||
|
const validOptions = stylelint.utils.validateOptions(result, ruleName, {
|
||||||
actual: enabled,
|
actual: enabled,
|
||||||
possible: [true, false]
|
possible: [true, false]
|
||||||
})
|
})
|
||||||
|
|
||||||
if (!validOptions) { return }
|
if (!validOptions) {
|
||||||
|
|
||||||
var utilityClasses = primerUtilities.cssstats.selectors.values
|
|
||||||
|
|
||||||
if (utilityClasses.length === 0) {
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
root.walkRules(function(rule) {
|
root.walkRules(rule => {
|
||||||
|
const matches = match(rule.selector)
|
||||||
var ruleClasses = rule.selector.match(/\.[a-z\-_0-9]+/ig)
|
if (!matches) {
|
||||||
|
return
|
||||||
if (ruleClasses != null) {
|
}
|
||||||
for (var i = 0; i < ruleClasses.length; i++) {
|
for (const ruleClass of Array.from(matches)) {
|
||||||
var ruleClass = ruleClasses[i]
|
|
||||||
if (utilityClasses.indexOf(ruleClass) >= 0) {
|
if (utilityClasses.indexOf(ruleClass) >= 0) {
|
||||||
stylelint.utils.report({
|
stylelint.utils.report({
|
||||||
message: messages.rejected(ruleClass),
|
message: messages.rejected(ruleClass),
|
||||||
@ -38,7 +35,6 @@ module.exports = stylelint.createPlugin(ruleName, function(enabled) {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
5
tools/stylelint-selector-no-utility/match.js
Normal file
5
tools/stylelint-selector-no-utility/match.js
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
const UTILITY_CLASS_PATTERN = /\.[-\w]+/g
|
||||||
|
|
||||||
|
module.exports = function matchUtilities(selector) {
|
||||||
|
return selector.match(UTILITY_CLASS_PATTERN)
|
||||||
|
}
|
@ -4,9 +4,10 @@
|
|||||||
"description": "Stylelint rule that doesn't allow the styling of utility classes in CSS",
|
"description": "Stylelint rule that doesn't allow the styling of utility classes in CSS",
|
||||||
"main": "index.js",
|
"main": "index.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
"prepare": "node prepare.js",
|
||||||
"lint": "eslint .",
|
"lint": "eslint .",
|
||||||
"tape": "node test/index.js",
|
"test": "node test/index.js",
|
||||||
"test": "../../script/npm-run-all lint tape",
|
"pretest": "npm run prepare",
|
||||||
"prepublishOnly": "../../script/notify pending",
|
"prepublishOnly": "../../script/notify pending",
|
||||||
"publish": "../../script/notify success"
|
"publish": "../../script/notify success"
|
||||||
},
|
},
|
||||||
@ -29,6 +30,7 @@
|
|||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"eslint": "^3.19.0",
|
"eslint": "^3.19.0",
|
||||||
"eslint-plugin-github": "^0.12.0",
|
"eslint-plugin-github": "^0.12.0",
|
||||||
|
"fs-extra": "^4.0.2",
|
||||||
"stylelint-test-rule-tape": "^0.2.0"
|
"stylelint-test-rule-tape": "^0.2.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
24
tools/stylelint-selector-no-utility/prepare.js
Normal file
24
tools/stylelint-selector-no-utility/prepare.js
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
const {join} = require('path')
|
||||||
|
const {writeFile} = require('fs-extra')
|
||||||
|
const utilities = require('primer-utilities')
|
||||||
|
|
||||||
|
const match = require('./match')
|
||||||
|
const classes = utilities.cssstats.selectors.values.reduce((set, selector) => {
|
||||||
|
const matches = match(selector)
|
||||||
|
if (matches) {
|
||||||
|
for (const klass of Array.from(matches)) {
|
||||||
|
set.add(klass)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return set
|
||||||
|
}, new Set())
|
||||||
|
|
||||||
|
const data = JSON.stringify(Array.from(classes), null, 2)
|
||||||
|
const filename = join(__dirname, 'classes.json')
|
||||||
|
|
||||||
|
writeFile(filename, data, 'utf8')
|
||||||
|
.then(() => console.warn(`wrote ${classes.size} classes to: ${filename}`))
|
||||||
|
.catch(error => {
|
||||||
|
console.error(error)
|
||||||
|
process.exitCode = 1
|
||||||
|
})
|
@ -1,5 +1,5 @@
|
|||||||
var testRule = require("stylelint-test-rule-tape")
|
const testRule = require('stylelint-test-rule-tape')
|
||||||
var rule = require("..")
|
const rule = require('..')
|
||||||
|
|
||||||
testRule(rule.rule, {
|
testRule(rule.rule, {
|
||||||
ruleName: rule.ruleName,
|
ruleName: rule.ruleName,
|
||||||
@ -7,24 +7,24 @@ testRule(rule.rule, {
|
|||||||
skipBasicChecks: true,
|
skipBasicChecks: true,
|
||||||
accept: [
|
accept: [
|
||||||
{
|
{
|
||||||
code: "a { }"
|
code: 'a { }'
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
reject: [
|
reject: [
|
||||||
{
|
{
|
||||||
code: ".m-0 { color: #fff; }"
|
code: '.m-0 { color: #fff; }'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
code: ".m-0:hover { color: #fff; }"
|
code: '.m-0:hover { color: #fff; }'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
code: ".m-2, .foo { color: #fff; }"
|
code: '.m-2, .foo { color: #fff; }'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
code: ".m-2[type=button] { color: #fff; }"
|
code: '.m-2[type=button] { color: #fff; }'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
code: ".foo.m-0 { color: #fff; }"
|
code: '.foo.m-0 { color: #fff; }'
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
})
|
})
|
||||||
|
Loading…
Reference in New Issue
Block a user