'use strict';
const browserslist = require('browserslist');
const { sameParent } = require('cssnano-utils');
const {
ensureCompatibility,
sameVendor,
noVendor,
} = require('./lib/ensureCompatibility');
function declarationIsEqual(a, b) {
return (
a.important === b.important && a.prop === b.prop && a.value === b.value
);
}
function indexOfDeclaration(array, decl) {
return array.findIndex((d) => declarationIsEqual(d, decl));
}
function intersect(a, b, not) {
return a.filter((c) => {
const index = indexOfDeclaration(b, c) !== -1;
return not ? !index : index;
});
}
function sameDeclarationsAndOrder(a, b) {
if (a.length !== b.length) {
return false;
}
return a.every((d, index) => declarationIsEqual(d, b[index]));
}
function canMerge(ruleA, ruleB, browsers, compatibilityCache) {
const a = ruleA.selectors;
const b = ruleB.selectors;
const selectors = a.concat(b);
if (!ensureCompatibility(selectors, browsers, compatibilityCache)) {
return false;
}
const parent = sameParent(
(ruleA),
(ruleB)
);
if (
parent &&
ruleA.parent &&
ruleA.parent.type === 'atrule' &&
(ruleA.parent).name.includes(
'keyframes'
)
) {
return false;
}
return parent && (selectors.every(noVendor) || sameVendor(a, b));
}
function isDeclaration(node) {
return node.type === 'decl';
}
function getDecls(rule) {
return rule.nodes.filter(isDeclaration);
}
const joinSelectors = (...rules) => rules.map((s) => s.selector).join();
function ruleLength(...rules) {
return rules.map((r) => (r.nodes.length ? String(r) : '')).join('').length;
}
function splitProp(prop) {
const parts = prop.split('-');
if (prop[0] !== '-') {
return {
prefix: '',
base: parts[0],
rest: parts.slice(1),
};
}
if (prop[1] === '-') {
return {
prefix: null,
base: null,
rest: [prop],
};
}
return {
prefix: parts[1],
base: parts[2],
rest: parts.slice(3),
};
}
function isConflictingProp(propA, propB) {
if (propA === propB) {
return true;
}
const a = splitProp(propA);
const b = splitProp(propB);
if (!a.base && !b.base) {
return true;
}
if (a.base !== b.base && a.base !== 'place' && b.base !== 'place') {
return false;
}
if (a.rest.length !== b.rest.length) {
return true;
}
if (a.base === 'border') {
const allRestProps = new Set([...a.rest, ...b.rest]);
if (
allRestProps.has('image') ||
allRestProps.has('width') ||
allRestProps.has('color') ||
allRestProps.has('style')
) {
return true;
}
}
return a.rest.every((s, index) => b.rest[index] === s);
}
function mergeParents(first, second) {
if (!first.parent || !second.parent) {
return false;
}
if (first.parent === second.parent) {
return false;
}
second.remove();
first.parent.append(second);
return true;
}
function partialMerge(first, second) {
let intersection = intersect(getDecls(first), getDecls(second));
if (intersection.length === 0) {
return second;
}
let nextRule = second.next();
if (!nextRule) {
const parentSibling =
(
second.parent
).next();
nextRule = parentSibling && parentSibling.nodes && parentSibling.nodes[0];
}
if (nextRule && nextRule.type === 'rule' && canMerge(second, nextRule)) {
let nextIntersection = intersect(getDecls(second), getDecls(nextRule));
if (nextIntersection.length > intersection.length) {
mergeParents(second, nextRule);
first = second;
second = nextRule;
intersection = nextIntersection;
}
}
const firstDecls = getDecls(first);
intersection = intersection.filter((decl, intersectIndex) => {
const indexOfDecl = indexOfDeclaration(firstDecls, decl);
const nextConflictInFirst = firstDecls
.slice(indexOfDecl + 1)
.filter((d) => isConflictingProp(d.prop, decl.prop));
if (nextConflictInFirst.length === 0) {
return true;
}
const nextConflictInIntersection = intersection
.slice(intersectIndex + 1)
.filter((d) => isConflictingProp(d.prop, decl.prop));
if (nextConflictInFirst.length !== nextConflictInIntersection.length) {
return false;
}
return nextConflictInFirst.every((d, index) =>
declarationIsEqual(d, nextConflictInIntersection[index])
);
});
const secondDecls = getDecls(second);
intersection = intersection.filter((decl) => {
const nextConflictIndex = secondDecls.findIndex((d) =>
isConflictingProp(d.prop, decl.prop)
);
if (nextConflictIndex === -1) {
return false;
}
if (!declarationIsEqual(secondDecls[nextConflictIndex], decl)) {
return false;
}
if (
decl.prop.toLowerCase() !== 'direction' &&
decl.prop.toLowerCase() !== 'unicode-bidi' &&
secondDecls.some(
(declaration) => declaration.prop.toLowerCase() === 'all'
)
) {
return false;
}
secondDecls.splice(nextConflictIndex, 1);
return true;
});
if (intersection.length === 0) {
return second;
}
const receivingBlock = second.clone();
receivingBlock.selector = joinSelectors(first, second);
receivingBlock.nodes = [];
(
second.parent
).insertBefore(second, receivingBlock);
const firstClone = first.clone();
const secondClone = second.clone();
function moveDecl(callback) {
return (decl) => {
if (indexOfDeclaration(intersection, decl) !== -1) {
callback.call(this, decl);
}
};
}
firstClone.walkDecls(
moveDecl((decl) => {
decl.remove();
receivingBlock.append(decl);
})
);
secondClone.walkDecls(moveDecl((decl) => decl.remove()));
const merged = ruleLength(firstClone, receivingBlock, secondClone);
const original = ruleLength(first, second);
if (merged < original) {
first.replaceWith(firstClone);
second.replaceWith(secondClone);
[firstClone, receivingBlock, secondClone].forEach((r) => {
if (r.nodes.length === 0) {
r.remove();
}
});
if (!secondClone.parent) {
return receivingBlock;
}
return secondClone;
} else {
receivingBlock.remove();
return second;
}
}
function selectorMerger(browsers, compatibilityCache) {
let cache = null;
return function (rule) {
if (!cache || !canMerge(rule, cache, browsers, compatibilityCache)) {
cache = rule;
return;
}
if (cache === rule) {
cache = rule;
return;
}
mergeParents(cache, rule);
if (sameDeclarationsAndOrder(getDecls(rule), getDecls(cache))) {
rule.selector = joinSelectors(cache, rule);
cache.remove();
cache = rule;
return;
}
if (cache.selector === rule.selector) {
const cached = getDecls(cache);
rule.walk((node) => {
if (node.type === 'decl' && indexOfDeclaration(cached, node) !== -1) {
node.remove();
return;
}
(cache).append(node);
});
rule.remove();
return;
}
cache = partialMerge(cache, rule);
};
}
function pluginCreator() {
return {
postcssPlugin: 'postcss-merge-rules',
prepare(result) {
const resultOpts = result.opts || {};
const browsers = browserslist(null, {
stats: resultOpts.stats,
path: __dirname,
env: resultOpts.env,
});
const compatibilityCache = new Map();
return {
OnceExit(css) {
css.walkRules(selectorMerger(browsers, compatibilityCache));
},
};
},
};
}
pluginCreator.postcss = true;
module.exports = pluginCreator;