SxsnPC/node_modules/postcss-merge-longhand/dist/lib/decl/borders.js

'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});

var _postcss = require('postcss');

var _stylehacks = require('stylehacks');

var _insertCloned = require('../insertCloned');

var _insertCloned2 = _interopRequireDefault(_insertCloned);

var _parseTrbl = require('../parseTrbl');

var _parseTrbl2 = _interopRequireDefault(_parseTrbl);

var _hasAllProps = require('../hasAllProps');

var _hasAllProps2 = _interopRequireDefault(_hasAllProps);

var _getDecls = require('../getDecls');

var _getDecls2 = _interopRequireDefault(_getDecls);

var _getRules = require('../getRules');

var _getRules2 = _interopRequireDefault(_getRules);

var _getValue = require('../getValue');

var _getValue2 = _interopRequireDefault(_getValue);

var _mergeRules = require('../mergeRules');

var _mergeRules2 = _interopRequireDefault(_mergeRules);

var _minifyTrbl = require('../minifyTrbl');

var _minifyTrbl2 = _interopRequireDefault(_minifyTrbl);

var _minifyWsc = require('../minifyWsc');

var _minifyWsc2 = _interopRequireDefault(_minifyWsc);

var _canMerge = require('../canMerge');

var _canMerge2 = _interopRequireDefault(_canMerge);

var _remove = require('../remove');

var _remove2 = _interopRequireDefault(_remove);

var _trbl = require('../trbl');

var _trbl2 = _interopRequireDefault(_trbl);

var _isCustomProp = require('../isCustomProp');

var _isCustomProp2 = _interopRequireDefault(_isCustomProp);

var _canExplode = require('../canExplode');

var _canExplode2 = _interopRequireDefault(_canExplode);

var _getLastNode = require('../getLastNode');

var _getLastNode2 = _interopRequireDefault(_getLastNode);

var _parseWsc = require('../parseWsc');

var _parseWsc2 = _interopRequireDefault(_parseWsc);

var _validateWsc = require('../validateWsc');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

const wsc = ['width', 'style', 'color'];
const defaults = ['medium', 'none', 'currentcolor'];

function borderProperty(...parts) {
    return `border-${parts.join('-')}`;
}

function mapBorderProperty(value) {
    return borderProperty(value);
}

const directions = _trbl2.default.map(mapBorderProperty);
const properties = wsc.map(mapBorderProperty);
const directionalProperties = directions.reduce((prev, curr) => prev.concat(wsc.map(prop => `${curr}-${prop}`)), []);

const precedence = [['border'], directions.concat(properties), directionalProperties];

const allProperties = precedence.reduce((a, b) => a.concat(b));

function getLevel(prop) {
    for (let i = 0; i < precedence.length; i++) {
        if (!!~precedence[i].indexOf(prop.toLowerCase())) {
            return i;
        }
    }
}

const isValueCustomProp = value => value && !!~value.search(/var\s*\(\s*--/i);

function canMergeValues(values) {
    return !values.some(isValueCustomProp) || values.every(isValueCustomProp);
}

function getColorValue(decl) {
    if (decl.prop.substr(-5) === 'color') {
        return decl.value;
    }

    return (0, _parseWsc2.default)(decl.value)[2] || defaults[2];
}

function diffingProps(values, nextValues) {
    return wsc.reduce((prev, curr, i) => {
        if (values[i] === nextValues[i]) {
            return prev;
        }

        return [...prev, curr];
    }, []);
}

function mergeRedundant({ values, nextValues, decl, nextDecl, index }) {
    if (!(0, _canMerge2.default)([decl, nextDecl])) {
        return;
    }

    if ((0, _stylehacks.detect)(decl) || (0, _stylehacks.detect)(nextDecl)) {
        return;
    }

    const diff = diffingProps(values, nextValues);

    if (diff.length > 1) {
        return;
    }

    const prop = diff.pop();
    const position = wsc.indexOf(prop);

    const prop1 = `${nextDecl.prop}-${prop}`;
    const prop2 = `border-${prop}`;

    let props = (0, _parseTrbl2.default)(values[position]);

    props[index] = nextValues[position];

    const borderValue2 = values.filter((e, i) => i !== position).join(' ');
    const propValue2 = (0, _minifyTrbl2.default)(props);

    const origLength = ((0, _minifyWsc2.default)(decl.value) + nextDecl.prop + nextDecl.value).length;
    const newLength1 = decl.value.length + prop1.length + (0, _minifyWsc2.default)(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;
    }
}

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];
}

function getDistinctShorthands(mapped) {
    return mapped.reduce((a, b) => {
        a = Array.isArray(a) ? a : [a];

        if (!~a.indexOf(b)) {
            a.push(b);
        }

        return a;
    });
}

function explode(rule) {
    rule.walkDecls(/^border/i, decl => {
        if (!(0, _canExplode2.default)(decl, false)) {
            return;
        }

        if ((0, _stylehacks.detect)(decl)) {
            return;
        }

        const prop = decl.prop.toLowerCase();

        // border -> border-trbl
        if (prop === 'border') {
            if ((0, _validateWsc.isValidWsc)((0, _parseWsc2.default)(decl.value))) {
                directions.forEach(direction => {
                    (0, _insertCloned2.default)(decl.parent, decl, { prop: direction });
                });

                return decl.remove();
            }
        }

        // border-trbl -> border-trbl-wsc
        if (directions.some(direction => prop === direction)) {
            let values = (0, _parseWsc2.default)(decl.value);

            if ((0, _validateWsc.isValidWsc)(values)) {
                wsc.forEach((d, i) => {
                    (0, _insertCloned2.default)(decl.parent, decl, {
                        prop: `${prop}-${d}`,
                        value: values[i] || defaults[i]
                    });
                });

                return decl.remove();
            }
        }

        // border-wsc -> border-trbl-wsc
        wsc.some(style => {
            if (prop !== borderProperty(style)) {
                return false;
            }

            (0, _parseTrbl2.default)(decl.value).forEach((value, i) => {
                (0, _insertCloned2.default)(decl.parent, decl, {
                    prop: borderProperty(_trbl2.default[i], style),
                    value
                });
            });

            return decl.remove();
        });
    });
}

function merge(rule) {
    // border-trbl-wsc -> border-trbl
    _trbl2.default.forEach(direction => {
        const prop = borderProperty(direction);

        (0, _mergeRules2.default)(rule, wsc.map(style => borderProperty(direction, style)), (rules, lastNode) => {
            if ((0, _canMerge2.default)(rules, false) && !rules.some(_stylehacks.detect)) {
                (0, _insertCloned2.default)(lastNode.parent, lastNode, {
                    prop,
                    value: rules.map(_getValue2.default).join(' ')
                });

                rules.forEach(_remove2.default);

                return true;
            }
        });
    });

    // border-trbl-wsc -> border-wsc
    wsc.forEach(style => {
        const prop = borderProperty(style);

        (0, _mergeRules2.default)(rule, _trbl2.default.map(direction => borderProperty(direction, style)), (rules, lastNode) => {
            if ((0, _canMerge2.default)(rules) && !rules.some(_stylehacks.detect)) {
                (0, _insertCloned2.default)(lastNode.parent, lastNode, {
                    prop,
                    value: (0, _minifyTrbl2.default)(rules.map(_getValue2.default).join(' '))
                });

                rules.forEach(_remove2.default);

                return true;
            }
        });
    });

    // border-trbl -> border-wsc
    (0, _mergeRules2.default)(rule, directions, (rules, lastNode) => {
        if (rules.some(_stylehacks.detect)) {
            return;
        }

        const values = rules.map(({ value }) => value);

        if (!canMergeValues(values)) {
            return;
        }

        const parsed = values.map(value => (0, _parseWsc2.default)(value));

        if (!parsed.every(_validateWsc.isValidWsc)) {
            return;
        }

        wsc.forEach((d, i) => {
            const value = parsed.map(v => v[i] || defaults[i]);

            if (canMergeValues(value)) {
                (0, _insertCloned2.default)(lastNode.parent, lastNode, {
                    prop: borderProperty(d),
                    value: (0, _minifyTrbl2.default)(value)
                });
            } else {
                (0, _insertCloned2.default)(lastNode.parent, lastNode);
            }
        });

        rules.forEach(_remove2.default);

        return true;
    });

    // border-wsc -> border
    // border-wsc -> border + border-color
    // border-wsc -> border + border-dir
    (0, _mergeRules2.default)(rule, properties, (rules, lastNode) => {
        if (rules.some(_stylehacks.detect)) {
            return;
        }

        const values = rules.map(node => (0, _parseTrbl2.default)(node.value));
        const mapped = [0, 1, 2, 3].map(i => [values[0][i], values[1][i], values[2][i]].join(' '));

        if (!canMergeValues(mapped)) {
            return;
        }

        const [width, style, color] = rules;
        const reduced = getDistinctShorthands(mapped);

        if (isCloseEnough(mapped) && (0, _canMerge2.default)(rules, false)) {
            const first = mapped.indexOf(reduced[0]) !== mapped.lastIndexOf(reduced[0]);

            const border = (0, _insertCloned2.default)(lastNode.parent, lastNode, {
                prop: 'border',
                value: first ? reduced[0] : reduced[1]
            });

            if (reduced[1]) {
                const value = first ? reduced[1] : reduced[0];
                const prop = borderProperty(_trbl2.default[mapped.indexOf(value)]);

                rule.insertAfter(border, Object.assign(lastNode.clone(), {
                    prop,
                    value
                }));
            }
            rules.forEach(_remove2.default);

            return true;
        } else if (reduced.length === 1) {
            rule.insertBefore(color, Object.assign(lastNode.clone(), {
                prop: 'border',
                value: [width, style].map(_getValue2.default).join(' ')
            }));
            rules.filter(node => node.prop.toLowerCase() !== properties[2]).forEach(_remove2.default);

            return true;
        }
    });

    // border-wsc -> border + border-trbl
    (0, _mergeRules2.default)(rule, properties, (rules, lastNode) => {
        if (rules.some(_stylehacks.detect)) {
            return;
        }

        const values = rules.map(node => (0, _parseTrbl2.default)(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]
                    }));
                }
            });

            rules.forEach(_remove2.default);

            return true;
        }
    });

    // border-trbl -> border
    // border-trbl -> border + border-trbl
    (0, _mergeRules2.default)(rule, directions, (rules, lastNode) => {
        if (rules.some(_stylehacks.detect)) {
            return;
        }

        const values = rules.map(node => {
            const wscValue = (0, _parseWsc2.default)(node.value);

            if (!(0, _validateWsc.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: (0, _minifyWsc2.default)(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: (0, _minifyWsc2.default)(value)
                }));
            }

            rules.forEach(_remove2.default);

            return true;
        }
    });

    // 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}`;

            (0, _mergeRules2.default)(rule, [direction, prop], (rules, lastNode) => {
                if (lastNode.prop !== direction) {
                    return;
                }

                const values = (0, _parseWsc2.default)(lastNode.value);

                if (!(0, _validateWsc.isValidWsc)(values)) {
                    return;
                }

                const wscProp = rules.filter(r => r !== lastNode)[0];

                if (!isValueCustomProp(values[i]) || (0, _isCustomProp2.default)(wscProp)) {
                    return;
                }

                const wscValue = values[i];

                values[i] = wscProp.value;

                if ((0, _canMerge2.default)(rules, false) && !rules.some(_stylehacks.detect)) {
                    (0, _insertCloned2.default)(lastNode.parent, lastNode, {
                        prop,
                        value: wscValue
                    });
                    lastNode.value = (0, _minifyWsc2.default)(values);

                    wscProp.remove();

                    return true;
                }
            });
        });
    });

    // border-wsc + border (custom prop) -> border + border-wsc (custom prop)
    wsc.forEach((style, i) => {
        const prop = borderProperty(style);
        (0, _mergeRules2.default)(rule, ['border', prop], (rules, lastNode) => {
            if (lastNode.prop !== 'border') {
                return;
            }

            const values = (0, _parseWsc2.default)(lastNode.value);

            if (!(0, _validateWsc.isValidWsc)(values)) {
                return;
            }

            const wscProp = rules.filter(r => r !== lastNode)[0];

            if (!isValueCustomProp(values[i]) || (0, _isCustomProp2.default)(wscProp)) {
                return;
            }

            const wscValue = values[i];

            values[i] = wscProp.value;

            if ((0, _canMerge2.default)(rules, false) && !rules.some(_stylehacks.detect)) {
                (0, _insertCloned2.default)(lastNode.parent, lastNode, {
                    prop,
                    value: wscValue
                });
                lastNode.value = (0, _minifyWsc2.default)(values);
                wscProp.remove();

                return true;
            }
        });
    });

    // optimize border-trbl
    let decls = (0, _getDecls2.default)(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 = (0, _getLastNode2.default)(nodes, 'border');

            if (border) {
                nodes = nodes.slice(nodes.indexOf(border));
            }

            const props = nodes.filter(node => node.prop && ~names.indexOf(node.prop) && node.important === lastNode.important);
            const rules = (0, _getRules2.default)(props, names);

            if ((0, _hasAllProps2.default)(rules, ...names) && !rules.some(_stylehacks.detect)) {
                const values = rules.map(node => node ? node.value : null);
                const filteredValues = values.filter(Boolean);
                const lastNodeValue = _postcss.list.space(lastNode.value)[i];

                values[directions.indexOf(lastNode.prop)] = lastNodeValue;

                let value = (0, _minifyTrbl2.default)(values.join(' '));

                if (filteredValues[0] === filteredValues[1] && filteredValues[1] === filteredValues[2]) {
                    value = filteredValues[0];
                }

                let refNode = props[props.length - 1];

                if (value === lastNodeValue) {
                    refNode = lastNode;
                    let valueArray = _postcss.list.space(lastNode.value);
                    valueArray.splice(i, 1);
                    lastNode.value = valueArray.join(' ');
                }

                (0, _insertCloned2.default)(refNode.parent, refNode, {
                    prop: borderProperty(d),
                    value
                });

                decls = decls.filter(node => !~rules.indexOf(node));
                rules.forEach(_remove2.default);
            }
        });

        decls = decls.filter(node => node !== lastNode);
    }

    rule.walkDecls('border', decl => {
        const nextDecl = decl.next();

        if (!nextDecl || nextDecl.type !== 'decl') {
            return;
        }

        const index = directions.indexOf(nextDecl.prop);

        if (!~index) {
            return;
        }

        const values = (0, _parseWsc2.default)(decl.value);
        const nextValues = (0, _parseWsc2.default)(nextDecl.value);

        if (!(0, _validateWsc.isValidWsc)(values) || !(0, _validateWsc.isValidWsc)(nextValues)) {
            return;
        }

        const config = {
            values,
            nextValues,
            decl,
            nextDecl,
            index
        };

        return mergeRedundant(config);
    });

    rule.walkDecls(/^border($|-(top|right|bottom|left)$)/i, decl => {
        let values = (0, _parseWsc2.default)(decl.value);

        if (!(0, _validateWsc.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}`);

            (0, _mergeRules2.default)(rule, [decl.prop, ...props], rules => {
                if (!rules.includes(decl)) {
                    return;
                }

                const longhands = rules.filter(p => p !== decl);

                if (longhands[0].value.toLowerCase() === longhands[1].value.toLowerCase() && longhands[1].value.toLowerCase() === longhands[2].value.toLowerCase() && longhands[0].value.toLowerCase() === values[i].toLowerCase()) {
                    longhands.forEach(_remove2.default);

                    (0, _insertCloned2.default)(decl.parent, decl, {
                        prop: borderProperty(d),
                        value: values[i]
                    });

                    values[i] = null;
                }
            });

            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 = (0, _minifyWsc2.default)(decl.value);
    });

    // border-spacing-hv -> border-spacing
    rule.walkDecls(/^border-spacing$/i, decl => {
        const value = _postcss.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 = (0, _getDecls2.default)(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 => !(0, _stylehacks.detect)(lastNode) && !(0, _stylehacks.detect)(node) && !(0, _isCustomProp2.default)(lastNode) && node !== lastNode && node.important === lastNode.important && getLevel(node.prop) > getLevel(lastNode.prop) && (!!~node.prop.toLowerCase().indexOf(lastNode.prop) || node.prop.toLowerCase().endsWith(lastPart)));

        lesser.forEach(_remove2.default);
        decls = decls.filter(node => !~lesser.indexOf(node));

        // get duplicate properties
        let duplicates = decls.filter(node => !(0, _stylehacks.detect)(lastNode) && !(0, _stylehacks.detect)(node) && node !== lastNode && node.important === lastNode.important && node.prop === lastNode.prop && !(!(0, _isCustomProp2.default)(node) && (0, _isCustomProp2.default)(lastNode)));

        if (duplicates.length) {
            if (/hsla\(|rgba\(/i.test(getColorValue(lastNode))) {
                const preserve = duplicates.filter(node => !/hsla\(|rgba\(/i.test(getColorValue(node))).pop();

                duplicates = duplicates.filter(node => node !== preserve);
            }

            duplicates.forEach(_remove2.default);
        }

        decls = decls.filter(node => node !== lastNode && !~duplicates.indexOf(node));
    }
}

exports.default = {
    explode,
    merge
};
module.exports = exports['default'];