Skip to content
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Add prettier
  • Loading branch information
TrySound committed May 22, 2017
commit cd1874f5d13373d3b0c81958bbbd5729647be78a
16 changes: 12 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,15 @@
],
"scripts": {
"build": "babel --out-dir lib src",
"lint": "standard src test",
"test": "jest --coverage",
"posttest": "yarn run lint",
"prepublish": "yarn run build"
"precommit": "lint-staged",
"prepublish": "yarn run test && yarn run build"
},
"lint-staged": {
"*.js": [
"prettier --single-quote --no-semi --write",
"git add"
]
},
"babel": {
"presets": [
Expand Down Expand Up @@ -44,8 +49,11 @@
"babel-cli": "^6.5.2",
"babel-jest": "^20.0.3",
"babel-preset-env": "^1.5.0",
"husky": "^0.13.3",
"jest": "^20.0.3",
"standard": "^8.4.0"
"lint-staged": "^3.4.2",
"prettier": "^1.3.1",
"strip-indent": "^2.0.0"
},
"dependencies": {
"icss-replace-symbols": "^1.1.0",
Expand Down
61 changes: 36 additions & 25 deletions src/index.js
Original file line number Diff line number Diff line change
@@ -1,21 +1,27 @@
const postcss = require('postcss')
const {default: replaceSymbols, replaceAll} = require('icss-replace-symbols')
const { default: replaceSymbols, replaceAll } = require('icss-replace-symbols')

const matchImports = /^(.+?|\([\s\S]+?\))\s+from\s+("[^"]*"|'[^']*'|[\w-]+)$/
const matchValueDefinition = /(?:\s+|^)([\w-]+):?\s+(.+?)\s*$/g
const matchImport = /^([\w-]+)(?:\s+as\s+([\w-]+))?/
let options = {}
let importIndex = 0
let createImportedName = options && options.createImportedName || ((importName/*, path*/) => `i__const_${importName.replace(/\W/g, '_')}_${importIndex++}`)
let createImportedName =
(options && options.createImportedName) ||
((importName /*, path*/) =>
`i__const_${importName.replace(/\W/g, '_')}_${importIndex++}`)

module.exports = postcss.plugin('postcss-modules-values', () => (css, result) => {
module.exports = postcss.plugin('postcss-modules-values', () => (
css,
result
) => {
let importAliases = []
let definitions = {}

const addDefinition = atRule => {
let matches
while (matches = matchValueDefinition.exec(atRule.params)) {
let [/*match*/, key, value] = matches
while ((matches = matchValueDefinition.exec(atRule.params))) {
let [, key, value] = matches
// Add to the definitions, knowing that values can refer to each other
definitions[key] = replaceAll(definitions, value)
atRule.remove()
Expand All @@ -25,20 +31,23 @@ module.exports = postcss.plugin('postcss-modules-values', () => (css, result) =>
const addImport = atRule => {
let matches = matchImports.exec(atRule.params)
if (matches) {
let [/*match*/, aliases, path] = matches
let [, aliases, path] = matches
// We can use constants for path names
if (definitions[path]) path = definitions[path]
let imports = aliases.replace(/^\(\s*([\s\S]+)\s*\)$/, '$1').split(/\s*,\s*/).map(alias => {
let tokens = matchImport.exec(alias)
if (tokens) {
let [/*match*/, theirName, myName = theirName] = tokens
let importedName = createImportedName(myName)
definitions[myName] = importedName
return { theirName, importedName }
} else {
throw new Error(`@import statement "${alias}" is invalid!`)
}
})
let imports = aliases
.replace(/^\(\s*([\s\S]+)\s*\)$/, '$1')
.split(/\s*,\s*/)
.map(alias => {
let tokens = matchImport.exec(alias)
if (tokens) {
let [, /*match*/ theirName, myName = theirName] = tokens
let importedName = createImportedName(myName)
definitions[myName] = importedName
return { theirName, importedName }
} else {
throw new Error(`@import statement "${alias}" is invalid!`)
}
})
importAliases.push({ path, imports })
atRule.remove()
}
Expand All @@ -59,11 +68,13 @@ module.exports = postcss.plugin('postcss-modules-values', () => (css, result) =>

/* We want to export anything defined by now, but don't add it to the CSS yet or
it well get picked up by the replacement stuff */
let exportDeclarations = Object.keys(definitions).map(key => postcss.decl({
value: definitions[key],
prop: key,
raws: { before: "\n " }
}))
let exportDeclarations = Object.keys(definitions).map(key =>
postcss.decl({
value: definitions[key],
prop: key,
raws: { before: '\n ' }
})
)

/* If we have no definitions, don't continue */
if (!Object.keys(definitions).length) return
Expand All @@ -75,7 +86,7 @@ module.exports = postcss.plugin('postcss-modules-values', () => (css, result) =>
if (exportDeclarations.length > 0) {
let exportRule = postcss.rule({
selector: `:export`,
raws: { after: "\n" }
raws: { after: '\n' }
})
exportRule.append(exportDeclarations)
css.prepend(exportRule)
Expand All @@ -85,13 +96,13 @@ module.exports = postcss.plugin('postcss-modules-values', () => (css, result) =>
importAliases.reverse().forEach(({ path, imports }) => {
let importRule = postcss.rule({
selector: `:import(${path})`,
raws: { after: "\n" }
raws: { after: '\n' }
})
imports.forEach(({ theirName, importedName }) => {
importRule.append({
value: theirName,
prop: importedName,
raws: { before: "\n " }
raws: { before: '\n ' }
})
})

Expand Down
Loading