twrnc/dist/cjs/resolve/filter.js

simple, expressive API for tailwindcss + react-native

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.filterHueRotate = exports.filterSepia = exports.filterInvert = exports.filterGrayscale = exports.filterSaturate = exports.filterContrast = exports.filterBrightness = void 0;
const helpers_1 = require("../helpers");
function filterBrightness(value, context = {}, config) {
    const styleVal = getBaseFilterStyleValue(value, context, config === null || config === void 0 ? void 0 : config[value]);
    return createStyle(`brightness`, styleVal);
}
exports.filterBrightness = filterBrightness;
function filterContrast(value, context = {}, config) {
    const styleVal = getBaseFilterStyleValue(value, context, config === null || config === void 0 ? void 0 : config[value]);
    return createStyle(`contrast`, styleVal);
}
exports.filterContrast = filterContrast;
function filterSaturate(value, context = {}, config) {
    const styleVal = getBaseFilterStyleValue(value, context, config === null || config === void 0 ? void 0 : config[value]);
    return createStyle(`saturate`, styleVal);
}
exports.filterSaturate = filterSaturate;
function filterGrayscale(value, context = {}, config) {
    const parsed = value.startsWith(`-`) ? value.slice(1) : `100`;
    const styleVal = getPercentageFilterStyleValue(parsed, context, config === null || config === void 0 ? void 0 : config[value]);
    return createStyle(`grayscale`, styleVal);
}
exports.filterGrayscale = filterGrayscale;
function filterInvert(value, context = {}, config) {
    const parsed = value.startsWith(`-`) ? value.slice(1) : `100`;
    const styleVal = getPercentageFilterStyleValue(parsed, context, config === null || config === void 0 ? void 0 : config[value]);
    return createStyle(`invert`, styleVal);
}
exports.filterInvert = filterInvert;
function filterSepia(value, context = {}, config) {
    const parsed = value.startsWith(`-`) ? value.slice(1) : `100`;
    const styleVal = getPercentageFilterStyleValue(parsed, context, config === null || config === void 0 ? void 0 : config[value]);
    return createStyle(`sepia`, styleVal);
}
exports.filterSepia = filterSepia;
function filterHueRotate(value, context = {}, config) {
    const configValue = config === null || config === void 0 ? void 0 : config[value];
    let styleVal;
    if (configValue) {
        styleVal = (0, helpers_1.parseStyleVal)(configValue, context);
    }
    else if ((0, helpers_1.isArbitraryValue)(value)) {
        const parsed = (0, helpers_1.parseNumericValue)(value.slice(1, -1));
        styleVal = parsed ? `${parsed[0]}${parsed[1]}` : null;
    }
    else {
        const parsed = (0, helpers_1.parseNumericValue)(value);
        styleVal = parsed ? `${parsed[0]}${parsed[1]}` : null;
    }
    return createStyle(`hueRotate`, styleVal);
}
exports.filterHueRotate = filterHueRotate;
function getBaseFilterStyleValue(value, context = {}, configValue) {
    if (configValue) {
        return (0, helpers_1.parseStyleVal)(configValue, context);
    }
    else if ((0, helpers_1.isArbitraryValue)(value)) {
        const parsed = (0, helpers_1.parseNumericValue)(value.slice(1, -1));
        return parsed ? parsed[0] : null;
    }
    else {
        const parsed = (0, helpers_1.parseNumericValue)(value);
        return parsed ? parsed[0] / 100 : null;
    }
}
function getPercentageFilterStyleValue(value, context = {}, configValue) {
    var _a;
    if (configValue) {
        const parsed = (_a = (0, helpers_1.parseStyleVal)(configValue, context)) === null || _a === void 0 ? void 0 : _a.toString().slice(0, -1);
        return parsed ? parseInt(parsed) / 100 : null;
    }
    else if ((0, helpers_1.isArbitraryValue)(value)) {
        const parsed = (0, helpers_1.parseNumericValue)(value.slice(1, -1));
        if (parsed === null) {
            return null;
        }
        if (Number.isInteger(parsed[0])) {
            return parsed[0] / 100;
        }
        return parsed[0];
    }
    else {
        const parsed = (0, helpers_1.parseNumericValue)(value);
        if (parsed === null) {
            return null;
        }
        if (Number.isInteger(parsed[0])) {
            return parsed[0] / 100;
        }
        return parsed[0];
    }
}
function createStyle(filterType, styleVal) {
    return {
        kind: `dependent`,
        complete(style) {
            updateFilterStyle(style, filterType, styleVal);
        },
    };
}
function updateFilterStyle(style, key, styleVal) {
    if (styleVal === null) {
        return;
    }
    const existingFilter = (style.filter || []);
    if (Array.isArray(existingFilter) && existingFilter) {
        style.filter = [...existingFilter, { [key]: styleVal }];
    }
    else {
        style.filter = existingFilter;
    }
}