mirror of
https://github.com/Sevichecc/Urara-Blog.git
synced 2025-05-05 04:19:30 +08:00
860 lines
21 KiB
Text
860 lines
21 KiB
Text
'use strict';
|
|
const { list } = require('postcss');
|
|
const stylehacks = require('stylehacks');
|
|
const insertCloned = require('../insertCloned.js');
|
|
const parseTrbl = require('../parseTrbl.js');
|
|
const hasAllProps = require('../hasAllProps.js');
|
|
const getDecls = require('../getDecls.js');
|
|
const getRules = require('../getRules.js');
|
|
const getValue = require('../getValue.js');
|
|
const mergeRules = require('../mergeRules.js');
|
|
const minifyTrbl = require('../minifyTrbl.js');
|
|
const minifyWsc = require('../minifyWsc.js');
|
|
const canMerge = require('../canMerge.js');
|
|
const trbl = require('../trbl.js');
|
|
const isCustomProp = require('../isCustomProp.js');
|
|
const canExplode = require('../canExplode.js');
|
|
const getLastNode = require('../getLastNode.js');
|
|
const parseWsc = require('../parseWsc.js');
|
|
const { isValidWsc } = require('../validateWsc.js');
|
|
|
|
const wsc = ['width', 'style', 'color'];
|
|
const defaults = ['medium', 'none', 'currentcolor'];
|
|
const colorMightRequireFallback =
|
|
/(hsla|rgba|color|hwb|lab|lch|oklab|oklch)\(/i;
|
|
|
|
/**
|
|
* @param {...string} parts
|
|
* @return {string}
|
|
*/
|
|
function borderProperty(...parts) {
|
|
return `border-${parts.join('-')}`;
|
|
}
|
|
/**
|
|
* @param {string} value
|
|
* @return {string}
|
|
*/
|
|
function mapBorderProperty(value) {
|
|
return borderProperty(value);
|
|
}
|
|
|
|
const directions = trbl.map(mapBorderProperty);
|
|
const properties = wsc.map(mapBorderProperty);
|
|
/** @type {string[]} */
|
|
const directionalProperties = directions.reduce(
|
|
(prev, curr) => prev.concat(wsc.map((prop) => `${curr}-${prop}`)),
|
|
/** @type {string[]} */ ([])
|
|
);
|
|
|
|
const precedence = [
|
|
['border'],
|
|
directions.concat(properties),
|
|
directionalProperties,
|
|
];
|
|
|
|
const allProperties = precedence.reduce((a, b) => a.concat(b));
|
|
|
|
/**
|
|
* @param {string} prop
|
|
* @return {number | undefined}
|
|
*/
|
|
function getLevel(prop) {
|
|
for (let i = 0; i < precedence.length; i++) {
|
|
if (precedence[i].includes(prop.toLowerCase())) {
|
|
return i;
|
|
}
|
|
}
|
|
}
|
|
|
|
/** @type {(value: string) => boolean} */
|
|
const isValueCustomProp = (value) =>
|
|
value !== undefined && value.search(/var\s*\(\s*--/i) !== -1;
|
|
|
|
/**
|
|
* @param {string[]} values
|
|
* @return {boolean}
|
|
*/
|
|
function canMergeValues(values) {
|
|
return !values.some(isValueCustomProp);
|
|
}
|
|
|
|
/**
|
|
* @param {import('postcss').Declaration} decl
|
|
* @return {string}
|
|
*/
|
|
function getColorValue(decl) {
|
|
if (decl.prop.substr(-5) === 'color') {
|
|
return decl.value;
|
|
}
|
|
|
|
return parseWsc(decl.value)[2] || defaults[2];
|
|
}
|
|
|
|
/**
|
|
* @param {[string, string, string]} values
|
|
* @param {[string, string, string]} nextValues
|
|
* @return {string[]}
|
|
*/
|
|
function diffingProps(values, nextValues) {
|
|
return wsc.reduce((prev, curr, i) => {
|
|
if (values[i] === nextValues[i]) {
|
|
return prev;
|
|
}
|
|
|
|
return [...prev, curr];
|
|
}, /** @type {string[]} */ ([]));
|
|
}
|
|
|
|
/**
|
|
* @param {{values: [string, string, string], nextValues: [string, string, string], decl: import('postcss').Declaration, nextDecl: import('postcss').Declaration, index: number}} arg
|
|
* @return {void}
|
|
*/
|
|
function mergeRedundant({ values, nextValues, decl, nextDecl, index }) {
|
|
if (!canMerge([decl, nextDecl])) {
|
|
return;
|
|
}
|
|
|
|
if (stylehacks.detect(decl) || stylehacks.detect(nextDecl)) {
|
|
return;
|
|
}
|
|
|
|
const diff = diffingProps(values, nextValues);
|
|
|
|
if (diff.length !== 1) {
|
|
return;
|
|
}
|
|
|
|
const prop = /** @type {string} */ (diff.pop());
|
|
const position = wsc.indexOf(prop);
|
|
|
|
const prop1 = `${nextDecl.prop}-${prop}`;
|
|
const prop2 = `border-${prop}`;
|
|
|
|
let props = parseTrbl(values[position]);
|
|
|
|
props[index] = nextValues[position];
|
|
|
|
const borderValue2 = values.filter((e, i) => i !== position).join(' ');
|
|
const propValue2 = minifyTrbl(props);
|
|
|
|
const origLength = (minifyWsc(decl.value) + nextDecl.prop + nextDecl.value)
|
|
.length;
|
|
const newLength1 =
|
|
decl.value.length + prop1.length + minifyWsc(nextValues[position]).length;
|
|
const newLength2 = borderValue2.length + prop2.length + propValue2.length;
|
|
|
|
if (newLength1 < newLength2 && newLength1 < origLength) {
|
|
nextDecl.prop = prop1;
|
|
nextDecl.value = nextValues[position];
|
|
}
|
|
|
|
if (newLength2 < newLength1 && newLength2 < origLength) {
|
|
decl.value = borderValue2;
|
|
nextDecl.prop = prop2;
|
|
nextDecl.value = propValue2;
|
|
}
|
|
}
|
|
|
|
/**
|
|
* @param {string | string[]} mapped
|
|
* @return {boolean}
|
|
*/
|
|
function isCloseEnough(mapped) {
|
|
return (
|
|
(mapped[0] === mapped[1] && mapped[1] === mapped[2]) ||
|
|
(mapped[1] === mapped[2] && mapped[2] === mapped[3]) ||
|
|
(mapped[2] === mapped[3] && mapped[3] === mapped[0]) ||
|
|
(mapped[3] === mapped[0] && mapped[0] === mapped[1])
|
|
);
|
|
}
|
|
|
|
/**
|
|
* @param {string[]} mapped
|
|
* @return {string[]}
|
|
*/
|
|
function getDistinctShorthands(mapped) {
|
|
return [...new Set(mapped)];
|
|
}
|
|
/**
|
|
* @param {import('postcss').Rule} rule
|
|
* @return {void}
|
|
*/
|
|
function explode(rule) {
|
|
rule.walkDecls(/^border/i, (decl) => {
|
|
if (!canExplode(decl, false)) {
|
|
return;
|
|
}
|
|
|
|
if (stylehacks.detect(decl)) {
|
|
return;
|
|
}
|
|
|
|
const prop = decl.prop.toLowerCase();
|
|
|
|
// border -> border-trbl
|
|
if (prop === 'border') {
|
|
if (isValidWsc(parseWsc(decl.value))) {
|
|
directions.forEach((direction) => {
|
|
insertCloned(
|
|
/** @type {import('postcss').Rule} */ (decl.parent),
|
|
decl,
|
|
{ prop: direction }
|
|
);
|
|
});
|
|
|
|
decl.remove();
|
|
}
|
|
}
|
|
|
|
// border-trbl -> border-trbl-wsc
|
|
if (directions.some((direction) => prop === direction)) {
|
|
let values = parseWsc(decl.value);
|
|
|
|
if (isValidWsc(values)) {
|
|
wsc.forEach((d, i) => {
|
|
insertCloned(
|
|
/** @type {import('postcss').Rule} */ (decl.parent),
|
|
decl,
|
|
{
|
|
prop: `${prop}-${d}`,
|
|
value: values[i] || defaults[i],
|
|
}
|
|
);
|
|
});
|
|
|
|
decl.remove();
|
|
}
|
|
}
|
|
|
|
// border-wsc -> border-trbl-wsc
|
|
wsc.some((style) => {
|
|
if (prop !== borderProperty(style)) {
|
|
return false;
|
|
}
|
|
|
|
if (isCustomProp(decl)) {
|
|
decl.prop = decl.prop.toLowerCase();
|
|
return false;
|
|
}
|
|
parseTrbl(decl.value).forEach((value, i) => {
|
|
insertCloned(
|
|
/** @type {import('postcss').Rule} */ (decl.parent),
|
|
decl,
|
|
{
|
|
prop: borderProperty(trbl[i], style),
|
|
value,
|
|
}
|
|
);
|
|
});
|
|
|
|
return decl.remove();
|
|
});
|
|
});
|
|
}
|
|
|
|
/**
|
|
* @param {import('postcss').Rule} rule
|
|
* @return {void}
|
|
*/
|
|
function merge(rule) {
|
|
// border-trbl-wsc -> border-trbl
|
|
trbl.forEach((direction) => {
|
|
const prop = borderProperty(direction);
|
|
|
|
mergeRules(
|
|
rule,
|
|
wsc.map((style) => borderProperty(direction, style)),
|
|
(rules, lastNode) => {
|
|
if (canMerge(rules, false) && !rules.some(stylehacks.detect)) {
|
|
insertCloned(
|
|
/** @type {import('postcss').Rule} */ (lastNode.parent),
|
|
lastNode,
|
|
{
|
|
prop,
|
|
value: rules.map(getValue).join(' '),
|
|
}
|
|
);
|
|
for (const node of rules) {
|
|
node.remove();
|
|
}
|
|
|
|
return true;
|
|
}
|
|
return false;
|
|
}
|
|
);
|
|
});
|
|
|
|
// border-trbl-wsc -> border-wsc
|
|
wsc.forEach((style) => {
|
|
const prop = borderProperty(style);
|
|
|
|
mergeRules(
|
|
rule,
|
|
trbl.map((direction) => borderProperty(direction, style)),
|
|
(rules, lastNode) => {
|
|
if (canMerge(rules) && !rules.some(stylehacks.detect)) {
|
|
insertCloned(
|
|
/** @type {import('postcss').Rule} */ (lastNode.parent),
|
|
lastNode,
|
|
{
|
|
prop,
|
|
value: minifyTrbl(rules.map(getValue).join(' ')),
|
|
}
|
|
);
|
|
|
|
for (const node of rules) {
|
|
node.remove();
|
|
}
|
|
|
|
return true;
|
|
}
|
|
return false;
|
|
}
|
|
);
|
|
});
|
|
|
|
// border-trbl -> border-wsc
|
|
mergeRules(rule, directions, (rules, lastNode) => {
|
|
if (rules.some(stylehacks.detect)) {
|
|
return false;
|
|
}
|
|
|
|
const values = rules.map(({ value }) => value);
|
|
|
|
if (!canMergeValues(values)) {
|
|
return false;
|
|
}
|
|
|
|
const parsed = values.map((value) => parseWsc(value));
|
|
|
|
if (!parsed.every(isValidWsc)) {
|
|
return false;
|
|
}
|
|
|
|
wsc.forEach((d, i) => {
|
|
const value = parsed.map((v) => v[i] || defaults[i]);
|
|
|
|
if (canMergeValues(value)) {
|
|
insertCloned(
|
|
/** @type {import('postcss').Rule} */ (lastNode.parent),
|
|
lastNode,
|
|
{
|
|
prop: borderProperty(d),
|
|
value: minifyTrbl(
|
|
/** @type {[string, string, string, string]} */ (value)
|
|
),
|
|
}
|
|
);
|
|
} else {
|
|
insertCloned(
|
|
/** @type {import('postcss').Rule} */ (lastNode.parent),
|
|
lastNode
|
|
);
|
|
}
|
|
});
|
|
|
|
for (const node of rules) {
|
|
node.remove();
|
|
}
|
|
|
|
return true;
|
|
});
|
|
|
|
// border-wsc -> border
|
|
// border-wsc -> border + border-color
|
|
// border-wsc -> border + border-dir
|
|
mergeRules(rule, properties, (rules, lastNode) => {
|
|
if (rules.some(stylehacks.detect)) {
|
|
return false;
|
|
}
|
|
|
|
const values = rules.map((node) => parseTrbl(node.value));
|
|
const mapped = [0, 1, 2, 3].map((i) =>
|
|
[values[0][i], values[1][i], values[2][i]].join(' ')
|
|
);
|
|
|
|
if (!canMergeValues(mapped)) {
|
|
return false;
|
|
}
|
|
|
|
const [width, style, color] = rules;
|
|
const reduced = getDistinctShorthands(mapped);
|
|
|
|
if (isCloseEnough(mapped) && canMerge(rules, false)) {
|
|
const first =
|
|
mapped.indexOf(reduced[0]) !== mapped.lastIndexOf(reduced[0]);
|
|
|
|
const border = insertCloned(
|
|
/** @type {import('postcss').Rule} */ (lastNode.parent),
|
|
lastNode,
|
|
{
|
|
prop: 'border',
|
|
value: first ? reduced[0] : reduced[1],
|
|
}
|
|
);
|
|
|
|
if (reduced[1]) {
|
|
const value = first ? reduced[1] : reduced[0];
|
|
const prop = borderProperty(trbl[mapped.indexOf(value)]);
|
|
|
|
rule.insertAfter(
|
|
border,
|
|
Object.assign(lastNode.clone(), {
|
|
prop,
|
|
value,
|
|
})
|
|
);
|
|
}
|
|
for (const node of rules) {
|
|
node.remove();
|
|
}
|
|
|
|
return true;
|
|
} else if (reduced.length === 1) {
|
|
rule.insertBefore(
|
|
color,
|
|
Object.assign(lastNode.clone(), {
|
|
prop: 'border',
|
|
value: [width, style].map(getValue).join(' '),
|
|
})
|
|
);
|
|
rules
|
|
.filter((node) => node.prop.toLowerCase() !== properties[2])
|
|
.forEach((node) => node.remove());
|
|
|
|
return true;
|
|
}
|
|
return false;
|
|
});
|
|
|
|
// border-wsc -> border + border-trbl
|
|
mergeRules(rule, properties, (rules, lastNode) => {
|
|
if (rules.some(stylehacks.detect)) {
|
|
return false;
|
|
}
|
|
|
|
const values = rules.map((node) => parseTrbl(node.value));
|
|
const mapped = [0, 1, 2, 3].map((i) =>
|
|
[values[0][i], values[1][i], values[2][i]].join(' ')
|
|
);
|
|
const reduced = getDistinctShorthands(mapped);
|
|
const none = 'medium none currentcolor';
|
|
|
|
if (reduced.length > 1 && reduced.length < 4 && reduced.includes(none)) {
|
|
const filtered = mapped.filter((p) => p !== none);
|
|
const mostCommon = reduced.sort(
|
|
(a, b) =>
|
|
mapped.filter((v) => v === b).length -
|
|
mapped.filter((v) => v === a).length
|
|
)[0];
|
|
const borderValue = reduced.length === 2 ? filtered[0] : mostCommon;
|
|
|
|
rule.insertBefore(
|
|
lastNode,
|
|
Object.assign(lastNode.clone(), {
|
|
prop: 'border',
|
|
value: borderValue,
|
|
})
|
|
);
|
|
|
|
directions.forEach((dir, i) => {
|
|
if (mapped[i] !== borderValue) {
|
|
rule.insertBefore(
|
|
lastNode,
|
|
Object.assign(lastNode.clone(), {
|
|
prop: dir,
|
|
value: mapped[i],
|
|
})
|
|
);
|
|
}
|
|
});
|
|
|
|
for (const node of rules) {
|
|
node.remove();
|
|
}
|
|
|
|
return true;
|
|
}
|
|
return false;
|
|
});
|
|
|
|
// border-trbl -> border
|
|
// border-trbl -> border + border-trbl
|
|
mergeRules(rule, directions, (rules, lastNode) => {
|
|
if (rules.some(stylehacks.detect)) {
|
|
return false;
|
|
}
|
|
|
|
const values = rules.map((node) => {
|
|
const wscValue = parseWsc(node.value);
|
|
|
|
if (!isValidWsc(wscValue)) {
|
|
return node.value;
|
|
}
|
|
|
|
return wscValue.map((value, i) => value || defaults[i]).join(' ');
|
|
});
|
|
|
|
const reduced = getDistinctShorthands(values);
|
|
|
|
if (isCloseEnough(values)) {
|
|
const first =
|
|
values.indexOf(reduced[0]) !== values.lastIndexOf(reduced[0]);
|
|
|
|
rule.insertBefore(
|
|
lastNode,
|
|
Object.assign(lastNode.clone(), {
|
|
prop: 'border',
|
|
value: minifyWsc(first ? values[0] : values[1]),
|
|
})
|
|
);
|
|
|
|
if (reduced[1]) {
|
|
const value = first ? reduced[1] : reduced[0];
|
|
const prop = directions[values.indexOf(value)];
|
|
rule.insertBefore(
|
|
lastNode,
|
|
Object.assign(lastNode.clone(), {
|
|
prop: prop,
|
|
value: minifyWsc(value),
|
|
})
|
|
);
|
|
}
|
|
|
|
for (const node of rules) {
|
|
node.remove();
|
|
}
|
|
|
|
return true;
|
|
}
|
|
return false;
|
|
});
|
|
|
|
// border-trbl-wsc + border-trbl (custom prop) -> border-trbl + border-trbl-wsc (custom prop)
|
|
directions.forEach((direction) => {
|
|
wsc.forEach((style, i) => {
|
|
const prop = `${direction}-${style}`;
|
|
|
|
mergeRules(rule, [direction, prop], (rules, lastNode) => {
|
|
if (lastNode.prop !== direction) {
|
|
return false;
|
|
}
|
|
|
|
const values = parseWsc(lastNode.value);
|
|
|
|
if (!isValidWsc(values)) {
|
|
return false;
|
|
}
|
|
|
|
const wscProp = rules.filter((r) => r !== lastNode)[0];
|
|
|
|
if (!isValueCustomProp(values[i]) || isCustomProp(wscProp)) {
|
|
return false;
|
|
}
|
|
|
|
const wscValue = values[i];
|
|
|
|
values[i] = wscProp.value;
|
|
|
|
if (canMerge(rules, false) && !rules.some(stylehacks.detect)) {
|
|
insertCloned(
|
|
/** @type {import('postcss').Rule} */ (lastNode.parent),
|
|
lastNode,
|
|
{
|
|
prop,
|
|
value: wscValue,
|
|
}
|
|
);
|
|
lastNode.value = minifyWsc(/** @type {any} */ (values));
|
|
|
|
wscProp.remove();
|
|
|
|
return true;
|
|
}
|
|
return false;
|
|
});
|
|
});
|
|
});
|
|
|
|
// border-wsc + border (custom prop) -> border + border-wsc (custom prop)
|
|
wsc.forEach((style, i) => {
|
|
const prop = borderProperty(style);
|
|
mergeRules(rule, ['border', prop], (rules, lastNode) => {
|
|
if (lastNode.prop !== 'border') {
|
|
return false;
|
|
}
|
|
|
|
const values = parseWsc(lastNode.value);
|
|
|
|
if (!isValidWsc(values)) {
|
|
return false;
|
|
}
|
|
|
|
const wscProp = rules.filter((r) => r !== lastNode)[0];
|
|
|
|
if (!isValueCustomProp(values[i]) || isCustomProp(wscProp)) {
|
|
return false;
|
|
}
|
|
|
|
const wscValue = values[i];
|
|
|
|
values[i] = wscProp.value;
|
|
|
|
if (canMerge(rules, false) && !rules.some(stylehacks.detect)) {
|
|
insertCloned(
|
|
/** @type {import('postcss').Rule} */ (lastNode.parent),
|
|
lastNode,
|
|
{
|
|
prop,
|
|
value: wscValue,
|
|
}
|
|
);
|
|
lastNode.value = minifyWsc(/** @type {any} */ (values));
|
|
wscProp.remove();
|
|
|
|
return true;
|
|
}
|
|
return false;
|
|
});
|
|
});
|
|
|
|
// optimize border-trbl
|
|
let decls = getDecls(rule, directions);
|
|
|
|
while (decls.length) {
|
|
const lastNode = decls[decls.length - 1];
|
|
|
|
wsc.forEach((d, i) => {
|
|
const names = directions
|
|
.filter((name) => name !== lastNode.prop)
|
|
.map((name) => `${name}-${d}`);
|
|
|
|
let nodes = rule.nodes.slice(0, rule.nodes.indexOf(lastNode));
|
|
|
|
const border = getLastNode(nodes, 'border');
|
|
|
|
if (border) {
|
|
nodes = nodes.slice(nodes.indexOf(border));
|
|
}
|
|
|
|
const props = nodes.filter(
|
|
(node) =>
|
|
node.type === 'decl' &&
|
|
names.includes(node.prop) &&
|
|
node.important === lastNode.important
|
|
);
|
|
const rules = getRules(
|
|
/** @type {import('postcss').Declaration[]} */ (props),
|
|
names
|
|
);
|
|
|
|
if (hasAllProps(rules, ...names) && !rules.some(stylehacks.detect)) {
|
|
const values = rules.map((node) => (node ? node.value : null));
|
|
const filteredValues = values.filter(Boolean);
|
|
const lastNodeValue = list.space(lastNode.value)[i];
|
|
|
|
values[directions.indexOf(lastNode.prop)] = lastNodeValue;
|
|
|
|
let value = minifyTrbl(values.join(' '));
|
|
|
|
if (
|
|
filteredValues[0] === filteredValues[1] &&
|
|
filteredValues[1] === filteredValues[2]
|
|
) {
|
|
value = /** @type {string} */ (filteredValues[0]);
|
|
}
|
|
|
|
let refNode = props[props.length - 1];
|
|
|
|
if (value === lastNodeValue) {
|
|
refNode = lastNode;
|
|
let valueArray = list.space(lastNode.value);
|
|
valueArray.splice(i, 1);
|
|
lastNode.value = valueArray.join(' ');
|
|
}
|
|
|
|
insertCloned(
|
|
/** @type {import('postcss').Rule} */ (refNode.parent),
|
|
/** @type {import('postcss').Declaration} */ (refNode),
|
|
{
|
|
prop: borderProperty(d),
|
|
value,
|
|
}
|
|
);
|
|
|
|
decls = decls.filter((node) => !rules.includes(node));
|
|
for (const node of rules) {
|
|
node.remove();
|
|
}
|
|
}
|
|
});
|
|
|
|
decls = decls.filter((node) => node !== lastNode);
|
|
}
|
|
|
|
rule.walkDecls('border', (decl) => {
|
|
const nextDecl = decl.next();
|
|
|
|
if (!nextDecl || nextDecl.type !== 'decl') {
|
|
return false;
|
|
}
|
|
|
|
const index = directions.indexOf(nextDecl.prop);
|
|
|
|
if (index === -1) {
|
|
return;
|
|
}
|
|
|
|
const values = parseWsc(decl.value);
|
|
const nextValues = parseWsc(nextDecl.value);
|
|
|
|
if (!isValidWsc(values) || !isValidWsc(nextValues)) {
|
|
return;
|
|
}
|
|
|
|
const config = {
|
|
values,
|
|
nextValues,
|
|
decl,
|
|
nextDecl,
|
|
index,
|
|
};
|
|
|
|
return mergeRedundant(config);
|
|
});
|
|
|
|
rule.walkDecls(/^border($|-(top|right|bottom|left)$)/i, (decl) => {
|
|
let values = parseWsc(decl.value);
|
|
|
|
if (!isValidWsc(values)) {
|
|
return;
|
|
}
|
|
|
|
const position = directions.indexOf(decl.prop);
|
|
let dirs = [...directions];
|
|
|
|
dirs.splice(position, 1);
|
|
wsc.forEach((d, i) => {
|
|
const props = dirs.map((dir) => `${dir}-${d}`);
|
|
|
|
mergeRules(rule, [decl.prop, ...props], (rules) => {
|
|
if (!rules.includes(decl)) {
|
|
return false;
|
|
}
|
|
|
|
const longhands = rules.filter((p) => p !== decl);
|
|
|
|
if (
|
|
longhands[0].value.toLowerCase() ===
|
|
longhands[1].value.toLowerCase() &&
|
|
longhands[1].value.toLowerCase() ===
|
|
longhands[2].value.toLowerCase() &&
|
|
values[i] !== undefined &&
|
|
longhands[0].value.toLowerCase() === values[i].toLowerCase()
|
|
) {
|
|
for (const node of longhands) {
|
|
node.remove();
|
|
}
|
|
|
|
insertCloned(
|
|
/** @type {import('postcss').Rule} */ (decl.parent),
|
|
decl,
|
|
{
|
|
prop: borderProperty(d),
|
|
value: values[i],
|
|
}
|
|
);
|
|
|
|
/** @type {string|null} */ (values[i]) = null;
|
|
}
|
|
return false;
|
|
});
|
|
|
|
const newValue = values.join(' ');
|
|
|
|
if (newValue) {
|
|
decl.value = newValue;
|
|
} else {
|
|
decl.remove();
|
|
}
|
|
});
|
|
});
|
|
|
|
// clean-up values
|
|
rule.walkDecls(/^border($|-(top|right|bottom|left)$)/i, (decl) => {
|
|
decl.value = minifyWsc(decl.value);
|
|
});
|
|
|
|
// border-spacing-hv -> border-spacing
|
|
rule.walkDecls(/^border-spacing$/i, (decl) => {
|
|
const value = list.space(decl.value);
|
|
|
|
// merge vertical and horizontal dups
|
|
if (value.length > 1 && value[0] === value[1]) {
|
|
decl.value = value.slice(1).join(' ');
|
|
}
|
|
});
|
|
|
|
// clean-up rules
|
|
decls = getDecls(rule, allProperties);
|
|
|
|
while (decls.length) {
|
|
const lastNode = decls[decls.length - 1];
|
|
const lastPart = lastNode.prop.split('-').pop();
|
|
|
|
// remove properties of lower precedence
|
|
const lesser = decls.filter(
|
|
(node) =>
|
|
!stylehacks.detect(lastNode) &&
|
|
!stylehacks.detect(node) &&
|
|
!isCustomProp(lastNode) &&
|
|
node !== lastNode &&
|
|
node.important === lastNode.important &&
|
|
/** @type {number} */ (getLevel(node.prop)) >
|
|
/** @type {number} */ (getLevel(lastNode.prop)) &&
|
|
(node.prop.toLowerCase().includes(lastNode.prop) ||
|
|
node.prop.toLowerCase().endsWith(/** @type {string} */ (lastPart)))
|
|
);
|
|
|
|
for (const node of lesser) {
|
|
node.remove();
|
|
}
|
|
decls = decls.filter((node) => !lesser.includes(node));
|
|
|
|
// get duplicate properties
|
|
let duplicates = decls.filter(
|
|
(node) =>
|
|
!stylehacks.detect(lastNode) &&
|
|
!stylehacks.detect(node) &&
|
|
node !== lastNode &&
|
|
node.important === lastNode.important &&
|
|
node.prop === lastNode.prop &&
|
|
!(!isCustomProp(node) && isCustomProp(lastNode))
|
|
);
|
|
|
|
if (duplicates.length) {
|
|
if (colorMightRequireFallback.test(getColorValue(lastNode))) {
|
|
const preserve = duplicates
|
|
.filter(
|
|
(node) => !colorMightRequireFallback.test(getColorValue(node))
|
|
)
|
|
.pop();
|
|
|
|
duplicates = duplicates.filter((node) => node !== preserve);
|
|
}
|
|
for (const node of duplicates) {
|
|
node.remove();
|
|
}
|
|
}
|
|
|
|
decls = decls.filter(
|
|
(node) => node !== lastNode && !duplicates.includes(node)
|
|
);
|
|
}
|
|
}
|
|
|
|
module.exports = {
|
|
explode,
|
|
merge,
|
|
};
|