You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
181 lines
5.6 KiB
181 lines
5.6 KiB
'use strict';
|
|
|
|
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
|
|
|
|
var postcss = require('postcss');
|
|
var topologicalSort = require('./topologicalSort');
|
|
|
|
var declWhitelist = ['composes'];
|
|
var declFilter = new RegExp(`^(${declWhitelist.join('|')})$`);
|
|
var matchImports = /^(.+?)\s+from\s+(?:"([^"]+)"|'([^']+)'|(global))$/;
|
|
var icssImport = /^:import\((?:"([^"]+)"|'([^']+)')\)/;
|
|
|
|
var VISITED_MARKER = 1;
|
|
|
|
function createParentName(rule, root) {
|
|
return `__${root.index(rule.parent)}_${rule.selector}`;
|
|
}
|
|
|
|
function serializeImports(imports) {
|
|
return imports.map(function (importPath) {
|
|
return '`' + importPath + '`';
|
|
}).join(', ');
|
|
}
|
|
|
|
/**
|
|
* :import('G') {}
|
|
*
|
|
* Rule
|
|
* composes: ... from 'A'
|
|
* composes: ... from 'B'
|
|
|
|
* Rule
|
|
* composes: ... from 'A'
|
|
* composes: ... from 'A'
|
|
* composes: ... from 'C'
|
|
*
|
|
* Results in:
|
|
*
|
|
* graph: {
|
|
* G: [],
|
|
* A: [],
|
|
* B: ['A'],
|
|
* C: ['A'],
|
|
* }
|
|
*/
|
|
function addImportToGraph(importId, parentId, graph, visited) {
|
|
var siblingsId = parentId + '_' + 'siblings';
|
|
var visitedId = parentId + '_' + importId;
|
|
|
|
if (visited[visitedId] !== VISITED_MARKER) {
|
|
if (!Array.isArray(visited[siblingsId])) visited[siblingsId] = [];
|
|
|
|
var siblings = visited[siblingsId];
|
|
|
|
if (Array.isArray(graph[importId])) graph[importId] = graph[importId].concat(siblings);else graph[importId] = siblings.slice();
|
|
|
|
visited[visitedId] = VISITED_MARKER;
|
|
siblings.push(importId);
|
|
}
|
|
}
|
|
|
|
module.exports = postcss.plugin('modules-extract-imports', function () {
|
|
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
|
|
var failOnWrongOrder = options.failOnWrongOrder;
|
|
|
|
return function (css) {
|
|
var graph = {};
|
|
var visited = {};
|
|
|
|
var existingImports = {};
|
|
var importDecls = {};
|
|
var imports = {};
|
|
|
|
var importIndex = 0;
|
|
|
|
var createImportedName = typeof options.createImportedName !== 'function' ? function (importName /*, path*/) {
|
|
return `i__imported_${importName.replace(/\W/g, '_')}_${importIndex++}`;
|
|
} : options.createImportedName;
|
|
|
|
// Check the existing imports order and save refs
|
|
css.walkRules(function (rule) {
|
|
var matches = icssImport.exec(rule.selector);
|
|
|
|
if (matches) {
|
|
var _matches = _slicedToArray(matches, 3),
|
|
/*match*/doubleQuotePath = _matches[1],
|
|
singleQuotePath = _matches[2];
|
|
|
|
var importPath = doubleQuotePath || singleQuotePath;
|
|
|
|
addImportToGraph(importPath, 'root', graph, visited);
|
|
|
|
existingImports[importPath] = rule;
|
|
}
|
|
});
|
|
|
|
// Find any declaration that supports imports
|
|
css.walkDecls(declFilter, function (decl) {
|
|
var matches = decl.value.match(matchImports);
|
|
var tmpSymbols = void 0;
|
|
|
|
if (matches) {
|
|
var _matches2 = _slicedToArray(matches, 5),
|
|
|
|
/*match*/symbols = _matches2[1],
|
|
doubleQuotePath = _matches2[2],
|
|
singleQuotePath = _matches2[3],
|
|
global = _matches2[4];
|
|
|
|
if (global) {
|
|
// Composing globals simply means changing these classes to wrap them in global(name)
|
|
tmpSymbols = symbols.split(/\s+/).map(function (s) {
|
|
return `global(${s})`;
|
|
});
|
|
} else {
|
|
var importPath = doubleQuotePath || singleQuotePath;
|
|
var parentRule = createParentName(decl.parent, css);
|
|
|
|
addImportToGraph(importPath, parentRule, graph, visited);
|
|
|
|
importDecls[importPath] = decl;
|
|
imports[importPath] = imports[importPath] || {};
|
|
|
|
tmpSymbols = symbols.split(/\s+/).map(function (s) {
|
|
if (!imports[importPath][s]) {
|
|
imports[importPath][s] = createImportedName(s, importPath);
|
|
}
|
|
|
|
return imports[importPath][s];
|
|
});
|
|
}
|
|
|
|
decl.value = tmpSymbols.join(' ');
|
|
}
|
|
});
|
|
|
|
var importsOrder = topologicalSort(graph, failOnWrongOrder);
|
|
|
|
if (importsOrder instanceof Error) {
|
|
var importPath = importsOrder.nodes.find(function (importPath) {
|
|
return importDecls.hasOwnProperty(importPath);
|
|
});
|
|
var decl = importDecls[importPath];
|
|
|
|
var errMsg = 'Failed to resolve order of composed modules ' + serializeImports(importsOrder.nodes) + '.';
|
|
|
|
throw decl.error(errMsg, {
|
|
plugin: 'modules-extract-imports',
|
|
word: 'composes'
|
|
});
|
|
}
|
|
|
|
var lastImportRule = void 0;
|
|
importsOrder.forEach(function (path) {
|
|
var importedSymbols = imports[path];
|
|
var rule = existingImports[path];
|
|
|
|
if (!rule && importedSymbols) {
|
|
rule = postcss.rule({
|
|
selector: `:import("${path}")`,
|
|
raws: { after: '\n' }
|
|
});
|
|
|
|
if (lastImportRule) css.insertAfter(lastImportRule, rule);else css.prepend(rule);
|
|
}
|
|
|
|
lastImportRule = rule;
|
|
|
|
if (!importedSymbols) return;
|
|
|
|
Object.keys(importedSymbols).forEach(function (importedSymbol) {
|
|
rule.append(postcss.decl({
|
|
value: importedSymbol,
|
|
prop: importedSymbols[importedSymbol],
|
|
raws: { before: '\n ' }
|
|
}));
|
|
});
|
|
});
|
|
};
|
|
});
|