'use strict';
const valueParser = require('postcss-value-parser');
function getValues(list, node, index) {
if (index % 2 === 0) {
let value = NaN;
if (
node.type === 'function' &&
(node.value === 'var' || node.value === 'env') &&
node.nodes.length === 1
) {
value = valueParser.stringify(node.nodes);
} else if (node.type === 'word') {
value = parseFloat(node.value);
}
return [...list, value];
}
return list;
}
function matrix3d(node, values) {
if (values.length !== 16) {
return;
}
if (
values[15] &&
values[2] === 0 &&
values[3] === 0 &&
values[6] === 0 &&
values[7] === 0 &&
values[8] === 0 &&
values[9] === 0 &&
values[10] === 1 &&
values[11] === 0 &&
values[14] === 0 &&
values[15] === 1
) {
const { nodes } = node;
node.value = 'matrix';
node.nodes = [
nodes[0], nodes[1], nodes[2], nodes[3], nodes[8], nodes[9], nodes[10], nodes[11], nodes[24], nodes[25], nodes[26], ];
}
}
const rotate3dMappings = new Map([
[[1, 0, 0].toString(), 'rotateX'], [[0, 1, 0].toString(), 'rotateY'], [[0, 0, 1].toString(), 'rotate'], ]);
function rotate3d(node, values) {
if (values.length !== 4) {
return;
}
const { nodes } = node;
const match = rotate3dMappings.get(values.slice(0, 3).toString());
if (match) {
node.value = match;
node.nodes = [nodes[6]];
}
}
function rotateZ(node, values) {
if (values.length !== 1) {
return;
}
node.value = 'rotate';
}
function scale(node, values) {
if (values.length !== 2) {
return;
}
const { nodes } = node;
const [first, second] = values;
if (first === second) {
node.nodes = [nodes[0]];
return;
}
if (second === 1) {
node.value = 'scaleX';
node.nodes = [nodes[0]];
return;
}
if (first === 1) {
node.value = 'scaleY';
node.nodes = [nodes[2]];
return;
}
}
function scale3d(node, values) {
if (values.length !== 3) {
return;
}
const { nodes } = node;
const [first, second, third] = values;
if (second === 1 && third === 1) {
node.value = 'scaleX';
node.nodes = [nodes[0]];
return;
}
if (first === 1 && third === 1) {
node.value = 'scaleY';
node.nodes = [nodes[2]];
return;
}
if (first === 1 && second === 1) {
node.value = 'scaleZ';
node.nodes = [nodes[4]];
return;
}
}
function translate(node, values) {
if (values.length !== 2) {
return;
}
const { nodes } = node;
if (values[1] === 0) {
node.nodes = [nodes[0]];
return;
}
if (values[0] === 0) {
node.value = 'translateY';
node.nodes = [nodes[2]];
return;
}
}
function translate3d(node, values) {
if (values.length !== 3) {
return;
}
const { nodes } = node;
if (values[0] === 0 && values[1] === 0) {
node.value = 'translateZ';
node.nodes = [nodes[4]];
}
}
const reducers = new Map([
['matrix3d', matrix3d],
['rotate3d', rotate3d],
['rotateZ', rotateZ],
['scale', scale],
['scale3d', scale3d],
['translate', translate],
['translate3d', translate3d],
]);
function normalizeReducerName(name) {
const lowerCasedName = name.toLowerCase();
if (lowerCasedName === 'rotatez') {
return 'rotateZ';
}
return lowerCasedName;
}
function reduce(node) {
if (node.type === 'function') {
const normalizedReducerName = normalizeReducerName(node.value);
const reducer = reducers.get(normalizedReducerName);
if (reducer !== undefined) {
reducer(node, node.nodes.reduce(getValues, []));
}
}
return false;
}
function pluginCreator() {
return {
postcssPlugin: 'postcss-reduce-transforms',
prepare() {
const cache = new Map();
return {
OnceExit(css) {
css.walkDecls(/transform$/i, (decl) => {
const value = decl.value;
if (!value) {
return;
}
if (cache.has(value)) {
decl.value = cache.get(value);
return;
}
const result = valueParser(value).walk(reduce).toString();
decl.value = result;
cache.set(value, result);
});
},
};
},
};
}
pluginCreator.postcss = true;
module.exports = pluginCreator;