tailwind-container-queries-2d/dist/index.js

Tailwind CSS plugin to enable tailwind container queries for both width and height

"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "default", {
    enumerable: true,
    get: function() {
        return _default;
    }
});
var _plugin = /*#__PURE__*/ _interop_require_default(require("tailwindcss/plugin"));
function _interop_require_default(obj) {
    return obj && obj.__esModule ? obj : {
        default: obj
    };
}
var _default = (0, _plugin.default)(function containerQueries(param) {
    var matchUtilities = param.matchUtilities, matchVariant = param.matchVariant, theme = param.theme;
    var _theme;
    var values = (_theme = theme('containers')) !== null && _theme !== void 0 ? _theme : {};
    function parseValue(value) {
        var _value_match;
        var _value_match_;
        var numericValue = (_value_match_ = (_value_match = value.match(/^(\d+\.\d+|\d+|\.\d+)\D+/)) === null || _value_match === void 0 ? void 0 : _value_match[1]) !== null && _value_match_ !== void 0 ? _value_match_ : null;
        if (numericValue === null) return null;
        return parseFloat(value);
    }
    var cbFor = function(selector) {
        return function() {
            var value = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : '', extra = arguments.length > 1 ? arguments[1] : void 0;
            var parsed = parseValue(value);
            var _extra_modifier;
            return parsed !== null ? "@container ".concat((_extra_modifier = extra.modifier) !== null && _extra_modifier !== void 0 ? _extra_modifier : '', " (").concat(selector, ": ").concat(value, ")") : [];
        };
    };
    var options = {
        values: values,
        sort: function sort(aVariant, zVariant) {
            var a = parseFloat(aVariant.value);
            var z = parseFloat(zVariant.value);
            if (a === null || z === null) return 0;
            // Sort values themselves regardless of unit
            if (a - z !== 0) return a - z;
            var _aVariant_modifier;
            var aLabel = (_aVariant_modifier = aVariant.modifier) !== null && _aVariant_modifier !== void 0 ? _aVariant_modifier : '';
            var _zVariant_modifier;
            var zLabel = (_zVariant_modifier = zVariant.modifier) !== null && _zVariant_modifier !== void 0 ? _zVariant_modifier : '';
            // Explicitly move empty labels to the end
            if (aLabel === '' && zLabel !== '') {
                return 1;
            } else if (aLabel !== '' && zLabel === '') {
                return -1;
            }
            // Sort labels alphabetically in the English locale
            // We are intentionally overriding the locale because we do not want the sort to
            // be affected by the machine's locale (be it a developer or CI environment)
            return aLabel.localeCompare(zLabel, 'en', {
                numeric: true
            });
        }
    };
    matchUtilities({
        '@container': function(value, param) {
            var modifier = param.modifier;
            return {
                'container-type': value,
                'container-name': modifier
            };
        }
    }, {
        values: {
            DEFAULT: 'size',
            'inline-size': 'inline-size',
            normal: 'normal'
        },
        modifiers: 'any'
    });
    matchVariant('@w', cbFor('min-width'), options);
    matchVariant('@h', cbFor('min-height'), options);
}, {
    theme: {
        containers: {
            '5xs': '4rem',
            '4xs': '8rem',
            '3xs': '12rem',
            '2xs': '16rem',
            xs: '20rem',
            sm: '24rem',
            md: '28rem',
            lg: '32rem',
            xl: '36rem',
            '2xl': '42rem',
            '3xl': '48rem',
            '4xl': '56rem',
            '5xl': '64rem',
            '6xl': '72rem',
            '7xl': '80rem'
        }
    }
});