BOC v1.0: RS256 auth, Ledger integration, Prometheus metrics, CI/CD, backup

This commit is contained in:
Bernt
2026-07-28 23:08:32 +00:00
parent 0b4f160af1
commit af874040ca
11541 changed files with 1654104 additions and 1103 deletions
+21
View File
@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2021 Dany Castillo
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
+38
View File
@@ -0,0 +1,38 @@
<!-- This file is autogenerated. If you want to change this content, please do the changes in `./docs/README.md` instead. -->
<div align="center">
<br />
<a href="https://github.com/dcastil/tailwind-merge">
<img src="https://github.com/dcastil/tailwind-merge/raw/v2.6.1/assets/logo.svg" alt="tailwind-merge" height="150px" />
</a>
</div>
# tailwind-merge
Utility function to efficiently merge [Tailwind CSS](https://tailwindcss.com) classes in JS without style conflicts.
```ts
import { twMerge } from 'tailwind-merge'
twMerge('px-2 py-1 bg-red hover:bg-dark-red', 'p-3 bg-[#B91C1C]')
// → 'hover:bg-dark-red p-3 bg-[#B91C1C]'
```
- Supports Tailwind v3.0 up to v3.4 (if you use Tailwind v2, use [tailwind-merge v0.9.0](https://github.com/dcastil/tailwind-merge/tree/v0.9.0))
- Works in all modern browsers and maintained Node versions
- Fully typed
- [Check bundle size on Bundlephobia](https://bundlephobia.com/package/tailwind-merge)
## Get started
- [What is it for](https://github.com/dcastil/tailwind-merge/tree/v2.6.1/docs/what-is-it-for.md)
- [When and how to use it](https://github.com/dcastil/tailwind-merge/tree/v2.6.1/docs/when-and-how-to-use-it.md)
- [Features](https://github.com/dcastil/tailwind-merge/tree/v2.6.1/docs/features.md)
- [Limitations](https://github.com/dcastil/tailwind-merge/tree/v2.6.1/docs/limitations.md)
- [Configuration](https://github.com/dcastil/tailwind-merge/tree/v2.6.1/docs/configuration.md)
- [Recipes](https://github.com/dcastil/tailwind-merge/tree/v2.6.1/docs/recipes.md)
- [API reference](https://github.com/dcastil/tailwind-merge/tree/v2.6.1/docs/api-reference.md)
- [Writing plugins](https://github.com/dcastil/tailwind-merge/tree/v2.6.1/docs/writing-plugins.md)
- [Versioning](https://github.com/dcastil/tailwind-merge/tree/v2.6.1/docs/versioning.md)
- [Contributing](https://github.com/dcastil/tailwind-merge/tree/v2.6.1/docs/contributing.md)
- [Similar packages](https://github.com/dcastil/tailwind-merge/tree/v2.6.1/docs/similar-packages.md)
+2571
View File
@@ -0,0 +1,2571 @@
'use strict';
Object.defineProperty(exports, Symbol.toStringTag, {
value: 'Module'
});
const CLASS_PART_SEPARATOR = '-';
const createClassGroupUtils = config => {
const classMap = createClassMap(config);
const {
conflictingClassGroups,
conflictingClassGroupModifiers
} = config;
const getClassGroupId = className => {
const classParts = className.split(CLASS_PART_SEPARATOR);
// Classes like `-inset-1` produce an empty string as first classPart. We assume that classes for negative values are used correctly and remove it from classParts.
if (classParts[0] === '' && classParts.length !== 1) {
classParts.shift();
}
return getGroupRecursive(classParts, classMap) || getGroupIdForArbitraryProperty(className);
};
const getConflictingClassGroupIds = (classGroupId, hasPostfixModifier) => {
const conflicts = conflictingClassGroups[classGroupId] || [];
if (hasPostfixModifier && conflictingClassGroupModifiers[classGroupId]) {
return [...conflicts, ...conflictingClassGroupModifiers[classGroupId]];
}
return conflicts;
};
return {
getClassGroupId,
getConflictingClassGroupIds
};
};
const getGroupRecursive = (classParts, classPartObject) => {
if (classParts.length === 0) {
return classPartObject.classGroupId;
}
const currentClassPart = classParts[0];
const nextClassPartObject = classPartObject.nextPart.get(currentClassPart);
const classGroupFromNextClassPart = nextClassPartObject ? getGroupRecursive(classParts.slice(1), nextClassPartObject) : undefined;
if (classGroupFromNextClassPart) {
return classGroupFromNextClassPart;
}
if (classPartObject.validators.length === 0) {
return undefined;
}
const classRest = classParts.join(CLASS_PART_SEPARATOR);
return classPartObject.validators.find(({
validator
}) => validator(classRest))?.classGroupId;
};
const arbitraryPropertyRegex = /^\[(.+)\]$/;
const getGroupIdForArbitraryProperty = className => {
if (arbitraryPropertyRegex.test(className)) {
const arbitraryPropertyClassName = arbitraryPropertyRegex.exec(className)[1];
const property = arbitraryPropertyClassName?.substring(0, arbitraryPropertyClassName.indexOf(':'));
if (property) {
// I use two dots here because one dot is used as prefix for class groups in plugins
return 'arbitrary..' + property;
}
}
};
/**
* Exported for testing only
*/
const createClassMap = config => {
const {
theme,
prefix
} = config;
const classMap = {
nextPart: new Map(),
validators: []
};
const prefixedClassGroupEntries = getPrefixedClassGroupEntries(Object.entries(config.classGroups), prefix);
prefixedClassGroupEntries.forEach(([classGroupId, classGroup]) => {
processClassesRecursively(classGroup, classMap, classGroupId, theme);
});
return classMap;
};
const processClassesRecursively = (classGroup, classPartObject, classGroupId, theme) => {
classGroup.forEach(classDefinition => {
if (typeof classDefinition === 'string') {
const classPartObjectToEdit = classDefinition === '' ? classPartObject : getPart(classPartObject, classDefinition);
classPartObjectToEdit.classGroupId = classGroupId;
return;
}
if (typeof classDefinition === 'function') {
if (isThemeGetter(classDefinition)) {
processClassesRecursively(classDefinition(theme), classPartObject, classGroupId, theme);
return;
}
classPartObject.validators.push({
validator: classDefinition,
classGroupId
});
return;
}
Object.entries(classDefinition).forEach(([key, classGroup]) => {
processClassesRecursively(classGroup, getPart(classPartObject, key), classGroupId, theme);
});
});
};
const getPart = (classPartObject, path) => {
let currentClassPartObject = classPartObject;
path.split(CLASS_PART_SEPARATOR).forEach(pathPart => {
if (!currentClassPartObject.nextPart.has(pathPart)) {
currentClassPartObject.nextPart.set(pathPart, {
nextPart: new Map(),
validators: []
});
}
currentClassPartObject = currentClassPartObject.nextPart.get(pathPart);
});
return currentClassPartObject;
};
const isThemeGetter = func => func.isThemeGetter;
const getPrefixedClassGroupEntries = (classGroupEntries, prefix) => {
if (!prefix) {
return classGroupEntries;
}
return classGroupEntries.map(([classGroupId, classGroup]) => {
const prefixedClassGroup = classGroup.map(classDefinition => {
if (typeof classDefinition === 'string') {
return prefix + classDefinition;
}
if (typeof classDefinition === 'object') {
return Object.fromEntries(Object.entries(classDefinition).map(([key, value]) => [prefix + key, value]));
}
return classDefinition;
});
return [classGroupId, prefixedClassGroup];
});
};
// LRU cache inspired from hashlru (https://github.com/dominictarr/hashlru/blob/v1.0.4/index.js) but object replaced with Map to improve performance
const createLruCache = maxCacheSize => {
if (maxCacheSize < 1) {
return {
get: () => undefined,
set: () => {}
};
}
let cacheSize = 0;
let cache = new Map();
let previousCache = new Map();
const update = (key, value) => {
cache.set(key, value);
cacheSize++;
if (cacheSize > maxCacheSize) {
cacheSize = 0;
previousCache = cache;
cache = new Map();
}
};
return {
get(key) {
let value = cache.get(key);
if (value !== undefined) {
return value;
}
if ((value = previousCache.get(key)) !== undefined) {
update(key, value);
return value;
}
},
set(key, value) {
if (cache.has(key)) {
cache.set(key, value);
} else {
update(key, value);
}
}
};
};
const IMPORTANT_MODIFIER = '!';
const createParseClassName = config => {
const {
separator,
experimentalParseClassName
} = config;
const isSeparatorSingleCharacter = separator.length === 1;
const firstSeparatorCharacter = separator[0];
const separatorLength = separator.length;
// parseClassName inspired by https://github.com/tailwindlabs/tailwindcss/blob/v3.2.2/src/util/splitAtTopLevelOnly.js
const parseClassName = className => {
const modifiers = [];
let bracketDepth = 0;
let modifierStart = 0;
let postfixModifierPosition;
for (let index = 0; index < className.length; index++) {
let currentCharacter = className[index];
if (bracketDepth === 0) {
if (currentCharacter === firstSeparatorCharacter && (isSeparatorSingleCharacter || className.slice(index, index + separatorLength) === separator)) {
modifiers.push(className.slice(modifierStart, index));
modifierStart = index + separatorLength;
continue;
}
if (currentCharacter === '/') {
postfixModifierPosition = index;
continue;
}
}
if (currentCharacter === '[') {
bracketDepth++;
} else if (currentCharacter === ']') {
bracketDepth--;
}
}
const baseClassNameWithImportantModifier = modifiers.length === 0 ? className : className.substring(modifierStart);
const hasImportantModifier = baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER);
const baseClassName = hasImportantModifier ? baseClassNameWithImportantModifier.substring(1) : baseClassNameWithImportantModifier;
const maybePostfixModifierPosition = postfixModifierPosition && postfixModifierPosition > modifierStart ? postfixModifierPosition - modifierStart : undefined;
return {
modifiers,
hasImportantModifier,
baseClassName,
maybePostfixModifierPosition
};
};
if (experimentalParseClassName) {
return className => experimentalParseClassName({
className,
parseClassName
});
}
return parseClassName;
};
/**
* Sorts modifiers according to following schema:
* - Predefined modifiers are sorted alphabetically
* - When an arbitrary variant appears, it must be preserved which modifiers are before and after it
*/
const sortModifiers = modifiers => {
if (modifiers.length <= 1) {
return modifiers;
}
const sortedModifiers = [];
let unsortedModifiers = [];
modifiers.forEach(modifier => {
const isArbitraryVariant = modifier[0] === '[';
if (isArbitraryVariant) {
sortedModifiers.push(...unsortedModifiers.sort(), modifier);
unsortedModifiers = [];
} else {
unsortedModifiers.push(modifier);
}
});
sortedModifiers.push(...unsortedModifiers.sort());
return sortedModifiers;
};
const createConfigUtils = config => ({
cache: createLruCache(config.cacheSize),
parseClassName: createParseClassName(config),
...createClassGroupUtils(config)
});
const SPLIT_CLASSES_REGEX = /\s+/;
const mergeClassList = (classList, configUtils) => {
const {
parseClassName,
getClassGroupId,
getConflictingClassGroupIds
} = configUtils;
/**
* Set of classGroupIds in following format:
* `{importantModifier}{variantModifiers}{classGroupId}`
* @example 'float'
* @example 'hover:focus:bg-color'
* @example 'md:!pr'
*/
const classGroupsInConflict = [];
const classNames = classList.trim().split(SPLIT_CLASSES_REGEX);
let result = '';
for (let index = classNames.length - 1; index >= 0; index -= 1) {
const originalClassName = classNames[index];
const {
modifiers,
hasImportantModifier,
baseClassName,
maybePostfixModifierPosition
} = parseClassName(originalClassName);
let hasPostfixModifier = Boolean(maybePostfixModifierPosition);
let classGroupId = getClassGroupId(hasPostfixModifier ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
if (!classGroupId) {
if (!hasPostfixModifier) {
// Not a Tailwind class
result = originalClassName + (result.length > 0 ? ' ' + result : result);
continue;
}
classGroupId = getClassGroupId(baseClassName);
if (!classGroupId) {
// Not a Tailwind class
result = originalClassName + (result.length > 0 ? ' ' + result : result);
continue;
}
hasPostfixModifier = false;
}
const variantModifier = sortModifiers(modifiers).join(':');
const modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier;
const classId = modifierId + classGroupId;
if (classGroupsInConflict.includes(classId)) {
// Tailwind class omitted due to conflict
continue;
}
classGroupsInConflict.push(classId);
const conflictGroups = getConflictingClassGroupIds(classGroupId, hasPostfixModifier);
for (let i = 0; i < conflictGroups.length; ++i) {
const group = conflictGroups[i];
classGroupsInConflict.push(modifierId + group);
}
// Tailwind class not in conflict
result = originalClassName + (result.length > 0 ? ' ' + result : result);
}
return result;
};
/**
* The code in this file is copied from https://github.com/lukeed/clsx and modified to suit the needs of tailwind-merge better.
*
* Specifically:
* - Runtime code from https://github.com/lukeed/clsx/blob/v1.2.1/src/index.js
* - TypeScript types from https://github.com/lukeed/clsx/blob/v1.2.1/clsx.d.ts
*
* Original code has MIT license: Copyright (c) Luke Edwards <luke.edwards05@gmail.com> (lukeed.com)
*/
function twJoin() {
let index = 0;
let argument;
let resolvedValue;
let string = '';
while (index < arguments.length) {
if (argument = arguments[index++]) {
if (resolvedValue = toValue(argument)) {
string && (string += ' ');
string += resolvedValue;
}
}
}
return string;
}
const toValue = mix => {
if (typeof mix === 'string') {
return mix;
}
let resolvedValue;
let string = '';
for (let k = 0; k < mix.length; k++) {
if (mix[k]) {
if (resolvedValue = toValue(mix[k])) {
string && (string += ' ');
string += resolvedValue;
}
}
}
return string;
};
function createTailwindMerge(createConfigFirst, ...createConfigRest) {
let configUtils;
let cacheGet;
let cacheSet;
let functionToCall = initTailwindMerge;
function initTailwindMerge(classList) {
const config = createConfigRest.reduce((previousConfig, createConfigCurrent) => createConfigCurrent(previousConfig), createConfigFirst());
configUtils = createConfigUtils(config);
cacheGet = configUtils.cache.get;
cacheSet = configUtils.cache.set;
functionToCall = tailwindMerge;
return tailwindMerge(classList);
}
function tailwindMerge(classList) {
const cachedResult = cacheGet(classList);
if (cachedResult) {
return cachedResult;
}
const result = mergeClassList(classList, configUtils);
cacheSet(classList, result);
return result;
}
return function callTailwindMerge() {
return functionToCall(twJoin.apply(null, arguments));
};
}
const fromTheme = key => {
const themeGetter = theme => theme[key] || [];
themeGetter.isThemeGetter = true;
return themeGetter;
};
const arbitraryValueRegex = /^\[(?:([a-z-]+):)?(.+)\]$/i;
const fractionRegex = /^\d+\/\d+$/;
const stringLengths = /*#__PURE__*/new Set(['px', 'full', 'screen']);
const tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
const lengthUnitRegex = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/;
const colorFunctionRegex = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/;
// Shadow always begins with x and y offset separated by underscore optionally prepended by inset
const shadowRegex = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
const imageRegex = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/;
const isLength = value => isNumber(value) || stringLengths.has(value) || fractionRegex.test(value);
const isArbitraryLength = value => getIsArbitraryValue(value, 'length', isLengthOnly);
const isNumber = value => Boolean(value) && !Number.isNaN(Number(value));
const isArbitraryNumber = value => getIsArbitraryValue(value, 'number', isNumber);
const isInteger = value => Boolean(value) && Number.isInteger(Number(value));
const isPercent = value => value.endsWith('%') && isNumber(value.slice(0, -1));
const isArbitraryValue = value => arbitraryValueRegex.test(value);
const isTshirtSize = value => tshirtUnitRegex.test(value);
const sizeLabels = /*#__PURE__*/new Set(['length', 'size', 'percentage']);
const isArbitrarySize = value => getIsArbitraryValue(value, sizeLabels, isNever);
const isArbitraryPosition = value => getIsArbitraryValue(value, 'position', isNever);
const imageLabels = /*#__PURE__*/new Set(['image', 'url']);
const isArbitraryImage = value => getIsArbitraryValue(value, imageLabels, isImage);
const isArbitraryShadow = value => getIsArbitraryValue(value, '', isShadow);
const isAny = () => true;
const getIsArbitraryValue = (value, label, testValue) => {
const result = arbitraryValueRegex.exec(value);
if (result) {
if (result[1]) {
return typeof label === 'string' ? result[1] === label : label.has(result[1]);
}
return testValue(result[2]);
}
return false;
};
const isLengthOnly = value =>
// `colorFunctionRegex` check is necessary because color functions can have percentages in them which which would be incorrectly classified as lengths.
// For example, `hsl(0 0% 0%)` would be classified as a length without this check.
// I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
lengthUnitRegex.test(value) && !colorFunctionRegex.test(value);
const isNever = () => false;
const isShadow = value => shadowRegex.test(value);
const isImage = value => imageRegex.test(value);
const validators = /*#__PURE__*/Object.defineProperty({
__proto__: null,
isAny,
isArbitraryImage,
isArbitraryLength,
isArbitraryNumber,
isArbitraryPosition,
isArbitraryShadow,
isArbitrarySize,
isArbitraryValue,
isInteger,
isLength,
isNumber,
isPercent,
isTshirtSize
}, Symbol.toStringTag, {
value: 'Module'
});
const getDefaultConfig = () => {
const colors = fromTheme('colors');
const spacing = fromTheme('spacing');
const blur = fromTheme('blur');
const brightness = fromTheme('brightness');
const borderColor = fromTheme('borderColor');
const borderRadius = fromTheme('borderRadius');
const borderSpacing = fromTheme('borderSpacing');
const borderWidth = fromTheme('borderWidth');
const contrast = fromTheme('contrast');
const grayscale = fromTheme('grayscale');
const hueRotate = fromTheme('hueRotate');
const invert = fromTheme('invert');
const gap = fromTheme('gap');
const gradientColorStops = fromTheme('gradientColorStops');
const gradientColorStopPositions = fromTheme('gradientColorStopPositions');
const inset = fromTheme('inset');
const margin = fromTheme('margin');
const opacity = fromTheme('opacity');
const padding = fromTheme('padding');
const saturate = fromTheme('saturate');
const scale = fromTheme('scale');
const sepia = fromTheme('sepia');
const skew = fromTheme('skew');
const space = fromTheme('space');
const translate = fromTheme('translate');
const getOverscroll = () => ['auto', 'contain', 'none'];
const getOverflow = () => ['auto', 'hidden', 'clip', 'visible', 'scroll'];
const getSpacingWithAutoAndArbitrary = () => ['auto', isArbitraryValue, spacing];
const getSpacingWithArbitrary = () => [isArbitraryValue, spacing];
const getLengthWithEmptyAndArbitrary = () => ['', isLength, isArbitraryLength];
const getNumberWithAutoAndArbitrary = () => ['auto', isNumber, isArbitraryValue];
const getPositions = () => ['bottom', 'center', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top', 'top'];
const getLineStyles = () => ['solid', 'dashed', 'dotted', 'double', 'none'];
const getBlendModes = () => ['normal', 'multiply', 'screen', 'overlay', 'darken', 'lighten', 'color-dodge', 'color-burn', 'hard-light', 'soft-light', 'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity'];
const getAlign = () => ['start', 'end', 'center', 'between', 'around', 'evenly', 'stretch'];
const getZeroAndEmpty = () => ['', '0', isArbitraryValue];
const getBreaks = () => ['auto', 'avoid', 'all', 'avoid-page', 'page', 'left', 'right', 'column'];
const getNumberAndArbitrary = () => [isNumber, isArbitraryValue];
return {
cacheSize: 500,
separator: ':',
theme: {
colors: [isAny],
spacing: [isLength, isArbitraryLength],
blur: ['none', '', isTshirtSize, isArbitraryValue],
brightness: getNumberAndArbitrary(),
borderColor: [colors],
borderRadius: ['none', '', 'full', isTshirtSize, isArbitraryValue],
borderSpacing: getSpacingWithArbitrary(),
borderWidth: getLengthWithEmptyAndArbitrary(),
contrast: getNumberAndArbitrary(),
grayscale: getZeroAndEmpty(),
hueRotate: getNumberAndArbitrary(),
invert: getZeroAndEmpty(),
gap: getSpacingWithArbitrary(),
gradientColorStops: [colors],
gradientColorStopPositions: [isPercent, isArbitraryLength],
inset: getSpacingWithAutoAndArbitrary(),
margin: getSpacingWithAutoAndArbitrary(),
opacity: getNumberAndArbitrary(),
padding: getSpacingWithArbitrary(),
saturate: getNumberAndArbitrary(),
scale: getNumberAndArbitrary(),
sepia: getZeroAndEmpty(),
skew: getNumberAndArbitrary(),
space: getSpacingWithArbitrary(),
translate: getSpacingWithArbitrary()
},
classGroups: {
// Layout
/**
* Aspect Ratio
* @see https://tailwindcss.com/docs/aspect-ratio
*/
aspect: [{
aspect: ['auto', 'square', 'video', isArbitraryValue]
}],
/**
* Container
* @see https://tailwindcss.com/docs/container
*/
container: ['container'],
/**
* Columns
* @see https://tailwindcss.com/docs/columns
*/
columns: [{
columns: [isTshirtSize]
}],
/**
* Break After
* @see https://tailwindcss.com/docs/break-after
*/
'break-after': [{
'break-after': getBreaks()
}],
/**
* Break Before
* @see https://tailwindcss.com/docs/break-before
*/
'break-before': [{
'break-before': getBreaks()
}],
/**
* Break Inside
* @see https://tailwindcss.com/docs/break-inside
*/
'break-inside': [{
'break-inside': ['auto', 'avoid', 'avoid-page', 'avoid-column']
}],
/**
* Box Decoration Break
* @see https://tailwindcss.com/docs/box-decoration-break
*/
'box-decoration': [{
'box-decoration': ['slice', 'clone']
}],
/**
* Box Sizing
* @see https://tailwindcss.com/docs/box-sizing
*/
box: [{
box: ['border', 'content']
}],
/**
* Display
* @see https://tailwindcss.com/docs/display
*/
display: ['block', 'inline-block', 'inline', 'flex', 'inline-flex', 'table', 'inline-table', 'table-caption', 'table-cell', 'table-column', 'table-column-group', 'table-footer-group', 'table-header-group', 'table-row-group', 'table-row', 'flow-root', 'grid', 'inline-grid', 'contents', 'list-item', 'hidden'],
/**
* Floats
* @see https://tailwindcss.com/docs/float
*/
float: [{
float: ['right', 'left', 'none', 'start', 'end']
}],
/**
* Clear
* @see https://tailwindcss.com/docs/clear
*/
clear: [{
clear: ['left', 'right', 'both', 'none', 'start', 'end']
}],
/**
* Isolation
* @see https://tailwindcss.com/docs/isolation
*/
isolation: ['isolate', 'isolation-auto'],
/**
* Object Fit
* @see https://tailwindcss.com/docs/object-fit
*/
'object-fit': [{
object: ['contain', 'cover', 'fill', 'none', 'scale-down']
}],
/**
* Object Position
* @see https://tailwindcss.com/docs/object-position
*/
'object-position': [{
object: [...getPositions(), isArbitraryValue]
}],
/**
* Overflow
* @see https://tailwindcss.com/docs/overflow
*/
overflow: [{
overflow: getOverflow()
}],
/**
* Overflow X
* @see https://tailwindcss.com/docs/overflow
*/
'overflow-x': [{
'overflow-x': getOverflow()
}],
/**
* Overflow Y
* @see https://tailwindcss.com/docs/overflow
*/
'overflow-y': [{
'overflow-y': getOverflow()
}],
/**
* Overscroll Behavior
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
overscroll: [{
overscroll: getOverscroll()
}],
/**
* Overscroll Behavior X
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
'overscroll-x': [{
'overscroll-x': getOverscroll()
}],
/**
* Overscroll Behavior Y
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
'overscroll-y': [{
'overscroll-y': getOverscroll()
}],
/**
* Position
* @see https://tailwindcss.com/docs/position
*/
position: ['static', 'fixed', 'absolute', 'relative', 'sticky'],
/**
* Top / Right / Bottom / Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
inset: [{
inset: [inset]
}],
/**
* Right / Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
'inset-x': [{
'inset-x': [inset]
}],
/**
* Top / Bottom
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
'inset-y': [{
'inset-y': [inset]
}],
/**
* Start
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
start: [{
start: [inset]
}],
/**
* End
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
end: [{
end: [inset]
}],
/**
* Top
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
top: [{
top: [inset]
}],
/**
* Right
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
right: [{
right: [inset]
}],
/**
* Bottom
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
bottom: [{
bottom: [inset]
}],
/**
* Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
left: [{
left: [inset]
}],
/**
* Visibility
* @see https://tailwindcss.com/docs/visibility
*/
visibility: ['visible', 'invisible', 'collapse'],
/**
* Z-Index
* @see https://tailwindcss.com/docs/z-index
*/
z: [{
z: ['auto', isInteger, isArbitraryValue]
}],
// Flexbox and Grid
/**
* Flex Basis
* @see https://tailwindcss.com/docs/flex-basis
*/
basis: [{
basis: getSpacingWithAutoAndArbitrary()
}],
/**
* Flex Direction
* @see https://tailwindcss.com/docs/flex-direction
*/
'flex-direction': [{
flex: ['row', 'row-reverse', 'col', 'col-reverse']
}],
/**
* Flex Wrap
* @see https://tailwindcss.com/docs/flex-wrap
*/
'flex-wrap': [{
flex: ['wrap', 'wrap-reverse', 'nowrap']
}],
/**
* Flex
* @see https://tailwindcss.com/docs/flex
*/
flex: [{
flex: ['1', 'auto', 'initial', 'none', isArbitraryValue]
}],
/**
* Flex Grow
* @see https://tailwindcss.com/docs/flex-grow
*/
grow: [{
grow: getZeroAndEmpty()
}],
/**
* Flex Shrink
* @see https://tailwindcss.com/docs/flex-shrink
*/
shrink: [{
shrink: getZeroAndEmpty()
}],
/**
* Order
* @see https://tailwindcss.com/docs/order
*/
order: [{
order: ['first', 'last', 'none', isInteger, isArbitraryValue]
}],
/**
* Grid Template Columns
* @see https://tailwindcss.com/docs/grid-template-columns
*/
'grid-cols': [{
'grid-cols': [isAny]
}],
/**
* Grid Column Start / End
* @see https://tailwindcss.com/docs/grid-column
*/
'col-start-end': [{
col: ['auto', {
span: ['full', isInteger, isArbitraryValue]
}, isArbitraryValue]
}],
/**
* Grid Column Start
* @see https://tailwindcss.com/docs/grid-column
*/
'col-start': [{
'col-start': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Column End
* @see https://tailwindcss.com/docs/grid-column
*/
'col-end': [{
'col-end': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Template Rows
* @see https://tailwindcss.com/docs/grid-template-rows
*/
'grid-rows': [{
'grid-rows': [isAny]
}],
/**
* Grid Row Start / End
* @see https://tailwindcss.com/docs/grid-row
*/
'row-start-end': [{
row: ['auto', {
span: [isInteger, isArbitraryValue]
}, isArbitraryValue]
}],
/**
* Grid Row Start
* @see https://tailwindcss.com/docs/grid-row
*/
'row-start': [{
'row-start': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Row End
* @see https://tailwindcss.com/docs/grid-row
*/
'row-end': [{
'row-end': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Auto Flow
* @see https://tailwindcss.com/docs/grid-auto-flow
*/
'grid-flow': [{
'grid-flow': ['row', 'col', 'dense', 'row-dense', 'col-dense']
}],
/**
* Grid Auto Columns
* @see https://tailwindcss.com/docs/grid-auto-columns
*/
'auto-cols': [{
'auto-cols': ['auto', 'min', 'max', 'fr', isArbitraryValue]
}],
/**
* Grid Auto Rows
* @see https://tailwindcss.com/docs/grid-auto-rows
*/
'auto-rows': [{
'auto-rows': ['auto', 'min', 'max', 'fr', isArbitraryValue]
}],
/**
* Gap
* @see https://tailwindcss.com/docs/gap
*/
gap: [{
gap: [gap]
}],
/**
* Gap X
* @see https://tailwindcss.com/docs/gap
*/
'gap-x': [{
'gap-x': [gap]
}],
/**
* Gap Y
* @see https://tailwindcss.com/docs/gap
*/
'gap-y': [{
'gap-y': [gap]
}],
/**
* Justify Content
* @see https://tailwindcss.com/docs/justify-content
*/
'justify-content': [{
justify: ['normal', ...getAlign()]
}],
/**
* Justify Items
* @see https://tailwindcss.com/docs/justify-items
*/
'justify-items': [{
'justify-items': ['start', 'end', 'center', 'stretch']
}],
/**
* Justify Self
* @see https://tailwindcss.com/docs/justify-self
*/
'justify-self': [{
'justify-self': ['auto', 'start', 'end', 'center', 'stretch']
}],
/**
* Align Content
* @see https://tailwindcss.com/docs/align-content
*/
'align-content': [{
content: ['normal', ...getAlign(), 'baseline']
}],
/**
* Align Items
* @see https://tailwindcss.com/docs/align-items
*/
'align-items': [{
items: ['start', 'end', 'center', 'baseline', 'stretch']
}],
/**
* Align Self
* @see https://tailwindcss.com/docs/align-self
*/
'align-self': [{
self: ['auto', 'start', 'end', 'center', 'stretch', 'baseline']
}],
/**
* Place Content
* @see https://tailwindcss.com/docs/place-content
*/
'place-content': [{
'place-content': [...getAlign(), 'baseline']
}],
/**
* Place Items
* @see https://tailwindcss.com/docs/place-items
*/
'place-items': [{
'place-items': ['start', 'end', 'center', 'baseline', 'stretch']
}],
/**
* Place Self
* @see https://tailwindcss.com/docs/place-self
*/
'place-self': [{
'place-self': ['auto', 'start', 'end', 'center', 'stretch']
}],
// Spacing
/**
* Padding
* @see https://tailwindcss.com/docs/padding
*/
p: [{
p: [padding]
}],
/**
* Padding X
* @see https://tailwindcss.com/docs/padding
*/
px: [{
px: [padding]
}],
/**
* Padding Y
* @see https://tailwindcss.com/docs/padding
*/
py: [{
py: [padding]
}],
/**
* Padding Start
* @see https://tailwindcss.com/docs/padding
*/
ps: [{
ps: [padding]
}],
/**
* Padding End
* @see https://tailwindcss.com/docs/padding
*/
pe: [{
pe: [padding]
}],
/**
* Padding Top
* @see https://tailwindcss.com/docs/padding
*/
pt: [{
pt: [padding]
}],
/**
* Padding Right
* @see https://tailwindcss.com/docs/padding
*/
pr: [{
pr: [padding]
}],
/**
* Padding Bottom
* @see https://tailwindcss.com/docs/padding
*/
pb: [{
pb: [padding]
}],
/**
* Padding Left
* @see https://tailwindcss.com/docs/padding
*/
pl: [{
pl: [padding]
}],
/**
* Margin
* @see https://tailwindcss.com/docs/margin
*/
m: [{
m: [margin]
}],
/**
* Margin X
* @see https://tailwindcss.com/docs/margin
*/
mx: [{
mx: [margin]
}],
/**
* Margin Y
* @see https://tailwindcss.com/docs/margin
*/
my: [{
my: [margin]
}],
/**
* Margin Start
* @see https://tailwindcss.com/docs/margin
*/
ms: [{
ms: [margin]
}],
/**
* Margin End
* @see https://tailwindcss.com/docs/margin
*/
me: [{
me: [margin]
}],
/**
* Margin Top
* @see https://tailwindcss.com/docs/margin
*/
mt: [{
mt: [margin]
}],
/**
* Margin Right
* @see https://tailwindcss.com/docs/margin
*/
mr: [{
mr: [margin]
}],
/**
* Margin Bottom
* @see https://tailwindcss.com/docs/margin
*/
mb: [{
mb: [margin]
}],
/**
* Margin Left
* @see https://tailwindcss.com/docs/margin
*/
ml: [{
ml: [margin]
}],
/**
* Space Between X
* @see https://tailwindcss.com/docs/space
*/
'space-x': [{
'space-x': [space]
}],
/**
* Space Between X Reverse
* @see https://tailwindcss.com/docs/space
*/
'space-x-reverse': ['space-x-reverse'],
/**
* Space Between Y
* @see https://tailwindcss.com/docs/space
*/
'space-y': [{
'space-y': [space]
}],
/**
* Space Between Y Reverse
* @see https://tailwindcss.com/docs/space
*/
'space-y-reverse': ['space-y-reverse'],
// Sizing
/**
* Width
* @see https://tailwindcss.com/docs/width
*/
w: [{
w: ['auto', 'min', 'max', 'fit', 'svw', 'lvw', 'dvw', isArbitraryValue, spacing]
}],
/**
* Min-Width
* @see https://tailwindcss.com/docs/min-width
*/
'min-w': [{
'min-w': [isArbitraryValue, spacing, 'min', 'max', 'fit']
}],
/**
* Max-Width
* @see https://tailwindcss.com/docs/max-width
*/
'max-w': [{
'max-w': [isArbitraryValue, spacing, 'none', 'full', 'min', 'max', 'fit', 'prose', {
screen: [isTshirtSize]
}, isTshirtSize]
}],
/**
* Height
* @see https://tailwindcss.com/docs/height
*/
h: [{
h: [isArbitraryValue, spacing, 'auto', 'min', 'max', 'fit', 'svh', 'lvh', 'dvh']
}],
/**
* Min-Height
* @see https://tailwindcss.com/docs/min-height
*/
'min-h': [{
'min-h': [isArbitraryValue, spacing, 'min', 'max', 'fit', 'svh', 'lvh', 'dvh']
}],
/**
* Max-Height
* @see https://tailwindcss.com/docs/max-height
*/
'max-h': [{
'max-h': [isArbitraryValue, spacing, 'min', 'max', 'fit', 'svh', 'lvh', 'dvh']
}],
/**
* Size
* @see https://tailwindcss.com/docs/size
*/
size: [{
size: [isArbitraryValue, spacing, 'auto', 'min', 'max', 'fit']
}],
// Typography
/**
* Font Size
* @see https://tailwindcss.com/docs/font-size
*/
'font-size': [{
text: ['base', isTshirtSize, isArbitraryLength]
}],
/**
* Font Smoothing
* @see https://tailwindcss.com/docs/font-smoothing
*/
'font-smoothing': ['antialiased', 'subpixel-antialiased'],
/**
* Font Style
* @see https://tailwindcss.com/docs/font-style
*/
'font-style': ['italic', 'not-italic'],
/**
* Font Weight
* @see https://tailwindcss.com/docs/font-weight
*/
'font-weight': [{
font: ['thin', 'extralight', 'light', 'normal', 'medium', 'semibold', 'bold', 'extrabold', 'black', isArbitraryNumber]
}],
/**
* Font Family
* @see https://tailwindcss.com/docs/font-family
*/
'font-family': [{
font: [isAny]
}],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-normal': ['normal-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-ordinal': ['ordinal'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-slashed-zero': ['slashed-zero'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-figure': ['lining-nums', 'oldstyle-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-spacing': ['proportional-nums', 'tabular-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-fraction': ['diagonal-fractions', 'stacked-fractions'],
/**
* Letter Spacing
* @see https://tailwindcss.com/docs/letter-spacing
*/
tracking: [{
tracking: ['tighter', 'tight', 'normal', 'wide', 'wider', 'widest', isArbitraryValue]
}],
/**
* Line Clamp
* @see https://tailwindcss.com/docs/line-clamp
*/
'line-clamp': [{
'line-clamp': ['none', isNumber, isArbitraryNumber]
}],
/**
* Line Height
* @see https://tailwindcss.com/docs/line-height
*/
leading: [{
leading: ['none', 'tight', 'snug', 'normal', 'relaxed', 'loose', isLength, isArbitraryValue]
}],
/**
* List Style Image
* @see https://tailwindcss.com/docs/list-style-image
*/
'list-image': [{
'list-image': ['none', isArbitraryValue]
}],
/**
* List Style Type
* @see https://tailwindcss.com/docs/list-style-type
*/
'list-style-type': [{
list: ['none', 'disc', 'decimal', isArbitraryValue]
}],
/**
* List Style Position
* @see https://tailwindcss.com/docs/list-style-position
*/
'list-style-position': [{
list: ['inside', 'outside']
}],
/**
* Placeholder Color
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/placeholder-color
*/
'placeholder-color': [{
placeholder: [colors]
}],
/**
* Placeholder Opacity
* @see https://tailwindcss.com/docs/placeholder-opacity
*/
'placeholder-opacity': [{
'placeholder-opacity': [opacity]
}],
/**
* Text Alignment
* @see https://tailwindcss.com/docs/text-align
*/
'text-alignment': [{
text: ['left', 'center', 'right', 'justify', 'start', 'end']
}],
/**
* Text Color
* @see https://tailwindcss.com/docs/text-color
*/
'text-color': [{
text: [colors]
}],
/**
* Text Opacity
* @see https://tailwindcss.com/docs/text-opacity
*/
'text-opacity': [{
'text-opacity': [opacity]
}],
/**
* Text Decoration
* @see https://tailwindcss.com/docs/text-decoration
*/
'text-decoration': ['underline', 'overline', 'line-through', 'no-underline'],
/**
* Text Decoration Style
* @see https://tailwindcss.com/docs/text-decoration-style
*/
'text-decoration-style': [{
decoration: [...getLineStyles(), 'wavy']
}],
/**
* Text Decoration Thickness
* @see https://tailwindcss.com/docs/text-decoration-thickness
*/
'text-decoration-thickness': [{
decoration: ['auto', 'from-font', isLength, isArbitraryLength]
}],
/**
* Text Underline Offset
* @see https://tailwindcss.com/docs/text-underline-offset
*/
'underline-offset': [{
'underline-offset': ['auto', isLength, isArbitraryValue]
}],
/**
* Text Decoration Color
* @see https://tailwindcss.com/docs/text-decoration-color
*/
'text-decoration-color': [{
decoration: [colors]
}],
/**
* Text Transform
* @see https://tailwindcss.com/docs/text-transform
*/
'text-transform': ['uppercase', 'lowercase', 'capitalize', 'normal-case'],
/**
* Text Overflow
* @see https://tailwindcss.com/docs/text-overflow
*/
'text-overflow': ['truncate', 'text-ellipsis', 'text-clip'],
/**
* Text Wrap
* @see https://tailwindcss.com/docs/text-wrap
*/
'text-wrap': [{
text: ['wrap', 'nowrap', 'balance', 'pretty']
}],
/**
* Text Indent
* @see https://tailwindcss.com/docs/text-indent
*/
indent: [{
indent: getSpacingWithArbitrary()
}],
/**
* Vertical Alignment
* @see https://tailwindcss.com/docs/vertical-align
*/
'vertical-align': [{
align: ['baseline', 'top', 'middle', 'bottom', 'text-top', 'text-bottom', 'sub', 'super', isArbitraryValue]
}],
/**
* Whitespace
* @see https://tailwindcss.com/docs/whitespace
*/
whitespace: [{
whitespace: ['normal', 'nowrap', 'pre', 'pre-line', 'pre-wrap', 'break-spaces']
}],
/**
* Word Break
* @see https://tailwindcss.com/docs/word-break
*/
break: [{
break: ['normal', 'words', 'all', 'keep']
}],
/**
* Hyphens
* @see https://tailwindcss.com/docs/hyphens
*/
hyphens: [{
hyphens: ['none', 'manual', 'auto']
}],
/**
* Content
* @see https://tailwindcss.com/docs/content
*/
content: [{
content: ['none', isArbitraryValue]
}],
// Backgrounds
/**
* Background Attachment
* @see https://tailwindcss.com/docs/background-attachment
*/
'bg-attachment': [{
bg: ['fixed', 'local', 'scroll']
}],
/**
* Background Clip
* @see https://tailwindcss.com/docs/background-clip
*/
'bg-clip': [{
'bg-clip': ['border', 'padding', 'content', 'text']
}],
/**
* Background Opacity
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/background-opacity
*/
'bg-opacity': [{
'bg-opacity': [opacity]
}],
/**
* Background Origin
* @see https://tailwindcss.com/docs/background-origin
*/
'bg-origin': [{
'bg-origin': ['border', 'padding', 'content']
}],
/**
* Background Position
* @see https://tailwindcss.com/docs/background-position
*/
'bg-position': [{
bg: [...getPositions(), isArbitraryPosition]
}],
/**
* Background Repeat
* @see https://tailwindcss.com/docs/background-repeat
*/
'bg-repeat': [{
bg: ['no-repeat', {
repeat: ['', 'x', 'y', 'round', 'space']
}]
}],
/**
* Background Size
* @see https://tailwindcss.com/docs/background-size
*/
'bg-size': [{
bg: ['auto', 'cover', 'contain', isArbitrarySize]
}],
/**
* Background Image
* @see https://tailwindcss.com/docs/background-image
*/
'bg-image': [{
bg: ['none', {
'gradient-to': ['t', 'tr', 'r', 'br', 'b', 'bl', 'l', 'tl']
}, isArbitraryImage]
}],
/**
* Background Color
* @see https://tailwindcss.com/docs/background-color
*/
'bg-color': [{
bg: [colors]
}],
/**
* Gradient Color Stops From Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-from-pos': [{
from: [gradientColorStopPositions]
}],
/**
* Gradient Color Stops Via Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-via-pos': [{
via: [gradientColorStopPositions]
}],
/**
* Gradient Color Stops To Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-to-pos': [{
to: [gradientColorStopPositions]
}],
/**
* Gradient Color Stops From
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-from': [{
from: [gradientColorStops]
}],
/**
* Gradient Color Stops Via
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-via': [{
via: [gradientColorStops]
}],
/**
* Gradient Color Stops To
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-to': [{
to: [gradientColorStops]
}],
// Borders
/**
* Border Radius
* @see https://tailwindcss.com/docs/border-radius
*/
rounded: [{
rounded: [borderRadius]
}],
/**
* Border Radius Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-s': [{
'rounded-s': [borderRadius]
}],
/**
* Border Radius End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-e': [{
'rounded-e': [borderRadius]
}],
/**
* Border Radius Top
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-t': [{
'rounded-t': [borderRadius]
}],
/**
* Border Radius Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-r': [{
'rounded-r': [borderRadius]
}],
/**
* Border Radius Bottom
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-b': [{
'rounded-b': [borderRadius]
}],
/**
* Border Radius Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-l': [{
'rounded-l': [borderRadius]
}],
/**
* Border Radius Start Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-ss': [{
'rounded-ss': [borderRadius]
}],
/**
* Border Radius Start End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-se': [{
'rounded-se': [borderRadius]
}],
/**
* Border Radius End End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-ee': [{
'rounded-ee': [borderRadius]
}],
/**
* Border Radius End Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-es': [{
'rounded-es': [borderRadius]
}],
/**
* Border Radius Top Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-tl': [{
'rounded-tl': [borderRadius]
}],
/**
* Border Radius Top Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-tr': [{
'rounded-tr': [borderRadius]
}],
/**
* Border Radius Bottom Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-br': [{
'rounded-br': [borderRadius]
}],
/**
* Border Radius Bottom Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-bl': [{
'rounded-bl': [borderRadius]
}],
/**
* Border Width
* @see https://tailwindcss.com/docs/border-width
*/
'border-w': [{
border: [borderWidth]
}],
/**
* Border Width X
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-x': [{
'border-x': [borderWidth]
}],
/**
* Border Width Y
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-y': [{
'border-y': [borderWidth]
}],
/**
* Border Width Start
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-s': [{
'border-s': [borderWidth]
}],
/**
* Border Width End
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-e': [{
'border-e': [borderWidth]
}],
/**
* Border Width Top
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-t': [{
'border-t': [borderWidth]
}],
/**
* Border Width Right
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-r': [{
'border-r': [borderWidth]
}],
/**
* Border Width Bottom
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-b': [{
'border-b': [borderWidth]
}],
/**
* Border Width Left
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-l': [{
'border-l': [borderWidth]
}],
/**
* Border Opacity
* @see https://tailwindcss.com/docs/border-opacity
*/
'border-opacity': [{
'border-opacity': [opacity]
}],
/**
* Border Style
* @see https://tailwindcss.com/docs/border-style
*/
'border-style': [{
border: [...getLineStyles(), 'hidden']
}],
/**
* Divide Width X
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-x': [{
'divide-x': [borderWidth]
}],
/**
* Divide Width X Reverse
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-x-reverse': ['divide-x-reverse'],
/**
* Divide Width Y
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-y': [{
'divide-y': [borderWidth]
}],
/**
* Divide Width Y Reverse
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-y-reverse': ['divide-y-reverse'],
/**
* Divide Opacity
* @see https://tailwindcss.com/docs/divide-opacity
*/
'divide-opacity': [{
'divide-opacity': [opacity]
}],
/**
* Divide Style
* @see https://tailwindcss.com/docs/divide-style
*/
'divide-style': [{
divide: getLineStyles()
}],
/**
* Border Color
* @see https://tailwindcss.com/docs/border-color
*/
'border-color': [{
border: [borderColor]
}],
/**
* Border Color X
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-x': [{
'border-x': [borderColor]
}],
/**
* Border Color Y
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-y': [{
'border-y': [borderColor]
}],
/**
* Border Color S
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-s': [{
'border-s': [borderColor]
}],
/**
* Border Color E
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-e': [{
'border-e': [borderColor]
}],
/**
* Border Color Top
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-t': [{
'border-t': [borderColor]
}],
/**
* Border Color Right
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-r': [{
'border-r': [borderColor]
}],
/**
* Border Color Bottom
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-b': [{
'border-b': [borderColor]
}],
/**
* Border Color Left
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-l': [{
'border-l': [borderColor]
}],
/**
* Divide Color
* @see https://tailwindcss.com/docs/divide-color
*/
'divide-color': [{
divide: [borderColor]
}],
/**
* Outline Style
* @see https://tailwindcss.com/docs/outline-style
*/
'outline-style': [{
outline: ['', ...getLineStyles()]
}],
/**
* Outline Offset
* @see https://tailwindcss.com/docs/outline-offset
*/
'outline-offset': [{
'outline-offset': [isLength, isArbitraryValue]
}],
/**
* Outline Width
* @see https://tailwindcss.com/docs/outline-width
*/
'outline-w': [{
outline: [isLength, isArbitraryLength]
}],
/**
* Outline Color
* @see https://tailwindcss.com/docs/outline-color
*/
'outline-color': [{
outline: [colors]
}],
/**
* Ring Width
* @see https://tailwindcss.com/docs/ring-width
*/
'ring-w': [{
ring: getLengthWithEmptyAndArbitrary()
}],
/**
* Ring Width Inset
* @see https://tailwindcss.com/docs/ring-width
*/
'ring-w-inset': ['ring-inset'],
/**
* Ring Color
* @see https://tailwindcss.com/docs/ring-color
*/
'ring-color': [{
ring: [colors]
}],
/**
* Ring Opacity
* @see https://tailwindcss.com/docs/ring-opacity
*/
'ring-opacity': [{
'ring-opacity': [opacity]
}],
/**
* Ring Offset Width
* @see https://tailwindcss.com/docs/ring-offset-width
*/
'ring-offset-w': [{
'ring-offset': [isLength, isArbitraryLength]
}],
/**
* Ring Offset Color
* @see https://tailwindcss.com/docs/ring-offset-color
*/
'ring-offset-color': [{
'ring-offset': [colors]
}],
// Effects
/**
* Box Shadow
* @see https://tailwindcss.com/docs/box-shadow
*/
shadow: [{
shadow: ['', 'inner', 'none', isTshirtSize, isArbitraryShadow]
}],
/**
* Box Shadow Color
* @see https://tailwindcss.com/docs/box-shadow-color
*/
'shadow-color': [{
shadow: [isAny]
}],
/**
* Opacity
* @see https://tailwindcss.com/docs/opacity
*/
opacity: [{
opacity: [opacity]
}],
/**
* Mix Blend Mode
* @see https://tailwindcss.com/docs/mix-blend-mode
*/
'mix-blend': [{
'mix-blend': [...getBlendModes(), 'plus-lighter', 'plus-darker']
}],
/**
* Background Blend Mode
* @see https://tailwindcss.com/docs/background-blend-mode
*/
'bg-blend': [{
'bg-blend': getBlendModes()
}],
// Filters
/**
* Filter
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/filter
*/
filter: [{
filter: ['', 'none']
}],
/**
* Blur
* @see https://tailwindcss.com/docs/blur
*/
blur: [{
blur: [blur]
}],
/**
* Brightness
* @see https://tailwindcss.com/docs/brightness
*/
brightness: [{
brightness: [brightness]
}],
/**
* Contrast
* @see https://tailwindcss.com/docs/contrast
*/
contrast: [{
contrast: [contrast]
}],
/**
* Drop Shadow
* @see https://tailwindcss.com/docs/drop-shadow
*/
'drop-shadow': [{
'drop-shadow': ['', 'none', isTshirtSize, isArbitraryValue]
}],
/**
* Grayscale
* @see https://tailwindcss.com/docs/grayscale
*/
grayscale: [{
grayscale: [grayscale]
}],
/**
* Hue Rotate
* @see https://tailwindcss.com/docs/hue-rotate
*/
'hue-rotate': [{
'hue-rotate': [hueRotate]
}],
/**
* Invert
* @see https://tailwindcss.com/docs/invert
*/
invert: [{
invert: [invert]
}],
/**
* Saturate
* @see https://tailwindcss.com/docs/saturate
*/
saturate: [{
saturate: [saturate]
}],
/**
* Sepia
* @see https://tailwindcss.com/docs/sepia
*/
sepia: [{
sepia: [sepia]
}],
/**
* Backdrop Filter
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/backdrop-filter
*/
'backdrop-filter': [{
'backdrop-filter': ['', 'none']
}],
/**
* Backdrop Blur
* @see https://tailwindcss.com/docs/backdrop-blur
*/
'backdrop-blur': [{
'backdrop-blur': [blur]
}],
/**
* Backdrop Brightness
* @see https://tailwindcss.com/docs/backdrop-brightness
*/
'backdrop-brightness': [{
'backdrop-brightness': [brightness]
}],
/**
* Backdrop Contrast
* @see https://tailwindcss.com/docs/backdrop-contrast
*/
'backdrop-contrast': [{
'backdrop-contrast': [contrast]
}],
/**
* Backdrop Grayscale
* @see https://tailwindcss.com/docs/backdrop-grayscale
*/
'backdrop-grayscale': [{
'backdrop-grayscale': [grayscale]
}],
/**
* Backdrop Hue Rotate
* @see https://tailwindcss.com/docs/backdrop-hue-rotate
*/
'backdrop-hue-rotate': [{
'backdrop-hue-rotate': [hueRotate]
}],
/**
* Backdrop Invert
* @see https://tailwindcss.com/docs/backdrop-invert
*/
'backdrop-invert': [{
'backdrop-invert': [invert]
}],
/**
* Backdrop Opacity
* @see https://tailwindcss.com/docs/backdrop-opacity
*/
'backdrop-opacity': [{
'backdrop-opacity': [opacity]
}],
/**
* Backdrop Saturate
* @see https://tailwindcss.com/docs/backdrop-saturate
*/
'backdrop-saturate': [{
'backdrop-saturate': [saturate]
}],
/**
* Backdrop Sepia
* @see https://tailwindcss.com/docs/backdrop-sepia
*/
'backdrop-sepia': [{
'backdrop-sepia': [sepia]
}],
// Tables
/**
* Border Collapse
* @see https://tailwindcss.com/docs/border-collapse
*/
'border-collapse': [{
border: ['collapse', 'separate']
}],
/**
* Border Spacing
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing': [{
'border-spacing': [borderSpacing]
}],
/**
* Border Spacing X
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing-x': [{
'border-spacing-x': [borderSpacing]
}],
/**
* Border Spacing Y
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing-y': [{
'border-spacing-y': [borderSpacing]
}],
/**
* Table Layout
* @see https://tailwindcss.com/docs/table-layout
*/
'table-layout': [{
table: ['auto', 'fixed']
}],
/**
* Caption Side
* @see https://tailwindcss.com/docs/caption-side
*/
caption: [{
caption: ['top', 'bottom']
}],
// Transitions and Animation
/**
* Tranisition Property
* @see https://tailwindcss.com/docs/transition-property
*/
transition: [{
transition: ['none', 'all', '', 'colors', 'opacity', 'shadow', 'transform', isArbitraryValue]
}],
/**
* Transition Duration
* @see https://tailwindcss.com/docs/transition-duration
*/
duration: [{
duration: getNumberAndArbitrary()
}],
/**
* Transition Timing Function
* @see https://tailwindcss.com/docs/transition-timing-function
*/
ease: [{
ease: ['linear', 'in', 'out', 'in-out', isArbitraryValue]
}],
/**
* Transition Delay
* @see https://tailwindcss.com/docs/transition-delay
*/
delay: [{
delay: getNumberAndArbitrary()
}],
/**
* Animation
* @see https://tailwindcss.com/docs/animation
*/
animate: [{
animate: ['none', 'spin', 'ping', 'pulse', 'bounce', isArbitraryValue]
}],
// Transforms
/**
* Transform
* @see https://tailwindcss.com/docs/transform
*/
transform: [{
transform: ['', 'gpu', 'none']
}],
/**
* Scale
* @see https://tailwindcss.com/docs/scale
*/
scale: [{
scale: [scale]
}],
/**
* Scale X
* @see https://tailwindcss.com/docs/scale
*/
'scale-x': [{
'scale-x': [scale]
}],
/**
* Scale Y
* @see https://tailwindcss.com/docs/scale
*/
'scale-y': [{
'scale-y': [scale]
}],
/**
* Rotate
* @see https://tailwindcss.com/docs/rotate
*/
rotate: [{
rotate: [isInteger, isArbitraryValue]
}],
/**
* Translate X
* @see https://tailwindcss.com/docs/translate
*/
'translate-x': [{
'translate-x': [translate]
}],
/**
* Translate Y
* @see https://tailwindcss.com/docs/translate
*/
'translate-y': [{
'translate-y': [translate]
}],
/**
* Skew X
* @see https://tailwindcss.com/docs/skew
*/
'skew-x': [{
'skew-x': [skew]
}],
/**
* Skew Y
* @see https://tailwindcss.com/docs/skew
*/
'skew-y': [{
'skew-y': [skew]
}],
/**
* Transform Origin
* @see https://tailwindcss.com/docs/transform-origin
*/
'transform-origin': [{
origin: ['center', 'top', 'top-right', 'right', 'bottom-right', 'bottom', 'bottom-left', 'left', 'top-left', isArbitraryValue]
}],
// Interactivity
/**
* Accent Color
* @see https://tailwindcss.com/docs/accent-color
*/
accent: [{
accent: ['auto', colors]
}],
/**
* Appearance
* @see https://tailwindcss.com/docs/appearance
*/
appearance: [{
appearance: ['none', 'auto']
}],
/**
* Cursor
* @see https://tailwindcss.com/docs/cursor
*/
cursor: [{
cursor: ['auto', 'default', 'pointer', 'wait', 'text', 'move', 'help', 'not-allowed', 'none', 'context-menu', 'progress', 'cell', 'crosshair', 'vertical-text', 'alias', 'copy', 'no-drop', 'grab', 'grabbing', 'all-scroll', 'col-resize', 'row-resize', 'n-resize', 'e-resize', 's-resize', 'w-resize', 'ne-resize', 'nw-resize', 'se-resize', 'sw-resize', 'ew-resize', 'ns-resize', 'nesw-resize', 'nwse-resize', 'zoom-in', 'zoom-out', isArbitraryValue]
}],
/**
* Caret Color
* @see https://tailwindcss.com/docs/just-in-time-mode#caret-color-utilities
*/
'caret-color': [{
caret: [colors]
}],
/**
* Pointer Events
* @see https://tailwindcss.com/docs/pointer-events
*/
'pointer-events': [{
'pointer-events': ['none', 'auto']
}],
/**
* Resize
* @see https://tailwindcss.com/docs/resize
*/
resize: [{
resize: ['none', 'y', 'x', '']
}],
/**
* Scroll Behavior
* @see https://tailwindcss.com/docs/scroll-behavior
*/
'scroll-behavior': [{
scroll: ['auto', 'smooth']
}],
/**
* Scroll Margin
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-m': [{
'scroll-m': getSpacingWithArbitrary()
}],
/**
* Scroll Margin X
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mx': [{
'scroll-mx': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Y
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-my': [{
'scroll-my': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Start
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-ms': [{
'scroll-ms': getSpacingWithArbitrary()
}],
/**
* Scroll Margin End
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-me': [{
'scroll-me': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Top
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mt': [{
'scroll-mt': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Right
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mr': [{
'scroll-mr': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Bottom
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mb': [{
'scroll-mb': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Left
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-ml': [{
'scroll-ml': getSpacingWithArbitrary()
}],
/**
* Scroll Padding
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-p': [{
'scroll-p': getSpacingWithArbitrary()
}],
/**
* Scroll Padding X
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-px': [{
'scroll-px': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Y
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-py': [{
'scroll-py': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Start
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-ps': [{
'scroll-ps': getSpacingWithArbitrary()
}],
/**
* Scroll Padding End
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pe': [{
'scroll-pe': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Top
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pt': [{
'scroll-pt': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Right
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pr': [{
'scroll-pr': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Bottom
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pb': [{
'scroll-pb': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Left
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pl': [{
'scroll-pl': getSpacingWithArbitrary()
}],
/**
* Scroll Snap Align
* @see https://tailwindcss.com/docs/scroll-snap-align
*/
'snap-align': [{
snap: ['start', 'end', 'center', 'align-none']
}],
/**
* Scroll Snap Stop
* @see https://tailwindcss.com/docs/scroll-snap-stop
*/
'snap-stop': [{
snap: ['normal', 'always']
}],
/**
* Scroll Snap Type
* @see https://tailwindcss.com/docs/scroll-snap-type
*/
'snap-type': [{
snap: ['none', 'x', 'y', 'both']
}],
/**
* Scroll Snap Type Strictness
* @see https://tailwindcss.com/docs/scroll-snap-type
*/
'snap-strictness': [{
snap: ['mandatory', 'proximity']
}],
/**
* Touch Action
* @see https://tailwindcss.com/docs/touch-action
*/
touch: [{
touch: ['auto', 'none', 'manipulation']
}],
/**
* Touch Action X
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-x': [{
'touch-pan': ['x', 'left', 'right']
}],
/**
* Touch Action Y
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-y': [{
'touch-pan': ['y', 'up', 'down']
}],
/**
* Touch Action Pinch Zoom
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-pz': ['touch-pinch-zoom'],
/**
* User Select
* @see https://tailwindcss.com/docs/user-select
*/
select: [{
select: ['none', 'text', 'all', 'auto']
}],
/**
* Will Change
* @see https://tailwindcss.com/docs/will-change
*/
'will-change': [{
'will-change': ['auto', 'scroll', 'contents', 'transform', isArbitraryValue]
}],
// SVG
/**
* Fill
* @see https://tailwindcss.com/docs/fill
*/
fill: [{
fill: [colors, 'none']
}],
/**
* Stroke Width
* @see https://tailwindcss.com/docs/stroke-width
*/
'stroke-w': [{
stroke: [isLength, isArbitraryLength, isArbitraryNumber]
}],
/**
* Stroke
* @see https://tailwindcss.com/docs/stroke
*/
stroke: [{
stroke: [colors, 'none']
}],
// Accessibility
/**
* Screen Readers
* @see https://tailwindcss.com/docs/screen-readers
*/
sr: ['sr-only', 'not-sr-only'],
/**
* Forced Color Adjust
* @see https://tailwindcss.com/docs/forced-color-adjust
*/
'forced-color-adjust': [{
'forced-color-adjust': ['auto', 'none']
}]
},
conflictingClassGroups: {
overflow: ['overflow-x', 'overflow-y'],
overscroll: ['overscroll-x', 'overscroll-y'],
inset: ['inset-x', 'inset-y', 'start', 'end', 'top', 'right', 'bottom', 'left'],
'inset-x': ['right', 'left'],
'inset-y': ['top', 'bottom'],
flex: ['basis', 'grow', 'shrink'],
gap: ['gap-x', 'gap-y'],
p: ['px', 'py', 'ps', 'pe', 'pt', 'pr', 'pb', 'pl'],
px: ['pr', 'pl'],
py: ['pt', 'pb'],
m: ['mx', 'my', 'ms', 'me', 'mt', 'mr', 'mb', 'ml'],
mx: ['mr', 'ml'],
my: ['mt', 'mb'],
size: ['w', 'h'],
'font-size': ['leading'],
'fvn-normal': ['fvn-ordinal', 'fvn-slashed-zero', 'fvn-figure', 'fvn-spacing', 'fvn-fraction'],
'fvn-ordinal': ['fvn-normal'],
'fvn-slashed-zero': ['fvn-normal'],
'fvn-figure': ['fvn-normal'],
'fvn-spacing': ['fvn-normal'],
'fvn-fraction': ['fvn-normal'],
'line-clamp': ['display', 'overflow'],
rounded: ['rounded-s', 'rounded-e', 'rounded-t', 'rounded-r', 'rounded-b', 'rounded-l', 'rounded-ss', 'rounded-se', 'rounded-ee', 'rounded-es', 'rounded-tl', 'rounded-tr', 'rounded-br', 'rounded-bl'],
'rounded-s': ['rounded-ss', 'rounded-es'],
'rounded-e': ['rounded-se', 'rounded-ee'],
'rounded-t': ['rounded-tl', 'rounded-tr'],
'rounded-r': ['rounded-tr', 'rounded-br'],
'rounded-b': ['rounded-br', 'rounded-bl'],
'rounded-l': ['rounded-tl', 'rounded-bl'],
'border-spacing': ['border-spacing-x', 'border-spacing-y'],
'border-w': ['border-w-s', 'border-w-e', 'border-w-t', 'border-w-r', 'border-w-b', 'border-w-l'],
'border-w-x': ['border-w-r', 'border-w-l'],
'border-w-y': ['border-w-t', 'border-w-b'],
'border-color': ['border-color-s', 'border-color-e', 'border-color-t', 'border-color-r', 'border-color-b', 'border-color-l'],
'border-color-x': ['border-color-r', 'border-color-l'],
'border-color-y': ['border-color-t', 'border-color-b'],
'scroll-m': ['scroll-mx', 'scroll-my', 'scroll-ms', 'scroll-me', 'scroll-mt', 'scroll-mr', 'scroll-mb', 'scroll-ml'],
'scroll-mx': ['scroll-mr', 'scroll-ml'],
'scroll-my': ['scroll-mt', 'scroll-mb'],
'scroll-p': ['scroll-px', 'scroll-py', 'scroll-ps', 'scroll-pe', 'scroll-pt', 'scroll-pr', 'scroll-pb', 'scroll-pl'],
'scroll-px': ['scroll-pr', 'scroll-pl'],
'scroll-py': ['scroll-pt', 'scroll-pb'],
touch: ['touch-x', 'touch-y', 'touch-pz'],
'touch-x': ['touch'],
'touch-y': ['touch'],
'touch-pz': ['touch']
},
conflictingClassGroupModifiers: {
'font-size': ['leading']
}
};
};
/**
* @param baseConfig Config where other config will be merged into. This object will be mutated.
* @param configExtension Partial config to merge into the `baseConfig`.
*/
const mergeConfigs = (baseConfig, {
cacheSize,
prefix,
separator,
experimentalParseClassName,
extend = {},
override = {}
}) => {
overrideProperty(baseConfig, 'cacheSize', cacheSize);
overrideProperty(baseConfig, 'prefix', prefix);
overrideProperty(baseConfig, 'separator', separator);
overrideProperty(baseConfig, 'experimentalParseClassName', experimentalParseClassName);
for (const configKey in override) {
overrideConfigProperties(baseConfig[configKey], override[configKey]);
}
for (const key in extend) {
mergeConfigProperties(baseConfig[key], extend[key]);
}
return baseConfig;
};
const overrideProperty = (baseObject, overrideKey, overrideValue) => {
if (overrideValue !== undefined) {
baseObject[overrideKey] = overrideValue;
}
};
const overrideConfigProperties = (baseObject, overrideObject) => {
if (overrideObject) {
for (const key in overrideObject) {
overrideProperty(baseObject, key, overrideObject[key]);
}
}
};
const mergeConfigProperties = (baseObject, mergeObject) => {
if (mergeObject) {
for (const key in mergeObject) {
const mergeValue = mergeObject[key];
if (mergeValue !== undefined) {
baseObject[key] = (baseObject[key] || []).concat(mergeValue);
}
}
}
};
const extendTailwindMerge = (configExtension, ...createConfig) => typeof configExtension === 'function' ? createTailwindMerge(getDefaultConfig, configExtension, ...createConfig) : createTailwindMerge(() => mergeConfigs(getDefaultConfig(), configExtension), ...createConfig);
const twMerge = /*#__PURE__*/createTailwindMerge(getDefaultConfig);
exports.createTailwindMerge = createTailwindMerge;
exports.extendTailwindMerge = extendTailwindMerge;
exports.fromTheme = fromTheme;
exports.getDefaultConfig = getDefaultConfig;
exports.mergeConfigs = mergeConfigs;
exports.twJoin = twJoin;
exports.twMerge = twMerge;
exports.validators = validators;
//# sourceMappingURL=bundle-cjs.js.map
File diff suppressed because one or more lines are too long
+2559
View File
@@ -0,0 +1,2559 @@
const CLASS_PART_SEPARATOR = '-';
const createClassGroupUtils = config => {
const classMap = createClassMap(config);
const {
conflictingClassGroups,
conflictingClassGroupModifiers
} = config;
const getClassGroupId = className => {
const classParts = className.split(CLASS_PART_SEPARATOR);
// Classes like `-inset-1` produce an empty string as first classPart. We assume that classes for negative values are used correctly and remove it from classParts.
if (classParts[0] === '' && classParts.length !== 1) {
classParts.shift();
}
return getGroupRecursive(classParts, classMap) || getGroupIdForArbitraryProperty(className);
};
const getConflictingClassGroupIds = (classGroupId, hasPostfixModifier) => {
const conflicts = conflictingClassGroups[classGroupId] || [];
if (hasPostfixModifier && conflictingClassGroupModifiers[classGroupId]) {
return [...conflicts, ...conflictingClassGroupModifiers[classGroupId]];
}
return conflicts;
};
return {
getClassGroupId,
getConflictingClassGroupIds
};
};
const getGroupRecursive = (classParts, classPartObject) => {
if (classParts.length === 0) {
return classPartObject.classGroupId;
}
const currentClassPart = classParts[0];
const nextClassPartObject = classPartObject.nextPart.get(currentClassPart);
const classGroupFromNextClassPart = nextClassPartObject ? getGroupRecursive(classParts.slice(1), nextClassPartObject) : undefined;
if (classGroupFromNextClassPart) {
return classGroupFromNextClassPart;
}
if (classPartObject.validators.length === 0) {
return undefined;
}
const classRest = classParts.join(CLASS_PART_SEPARATOR);
return classPartObject.validators.find(({
validator
}) => validator(classRest))?.classGroupId;
};
const arbitraryPropertyRegex = /^\[(.+)\]$/;
const getGroupIdForArbitraryProperty = className => {
if (arbitraryPropertyRegex.test(className)) {
const arbitraryPropertyClassName = arbitraryPropertyRegex.exec(className)[1];
const property = arbitraryPropertyClassName?.substring(0, arbitraryPropertyClassName.indexOf(':'));
if (property) {
// I use two dots here because one dot is used as prefix for class groups in plugins
return 'arbitrary..' + property;
}
}
};
/**
* Exported for testing only
*/
const createClassMap = config => {
const {
theme,
prefix
} = config;
const classMap = {
nextPart: new Map(),
validators: []
};
const prefixedClassGroupEntries = getPrefixedClassGroupEntries(Object.entries(config.classGroups), prefix);
prefixedClassGroupEntries.forEach(([classGroupId, classGroup]) => {
processClassesRecursively(classGroup, classMap, classGroupId, theme);
});
return classMap;
};
const processClassesRecursively = (classGroup, classPartObject, classGroupId, theme) => {
classGroup.forEach(classDefinition => {
if (typeof classDefinition === 'string') {
const classPartObjectToEdit = classDefinition === '' ? classPartObject : getPart(classPartObject, classDefinition);
classPartObjectToEdit.classGroupId = classGroupId;
return;
}
if (typeof classDefinition === 'function') {
if (isThemeGetter(classDefinition)) {
processClassesRecursively(classDefinition(theme), classPartObject, classGroupId, theme);
return;
}
classPartObject.validators.push({
validator: classDefinition,
classGroupId
});
return;
}
Object.entries(classDefinition).forEach(([key, classGroup]) => {
processClassesRecursively(classGroup, getPart(classPartObject, key), classGroupId, theme);
});
});
};
const getPart = (classPartObject, path) => {
let currentClassPartObject = classPartObject;
path.split(CLASS_PART_SEPARATOR).forEach(pathPart => {
if (!currentClassPartObject.nextPart.has(pathPart)) {
currentClassPartObject.nextPart.set(pathPart, {
nextPart: new Map(),
validators: []
});
}
currentClassPartObject = currentClassPartObject.nextPart.get(pathPart);
});
return currentClassPartObject;
};
const isThemeGetter = func => func.isThemeGetter;
const getPrefixedClassGroupEntries = (classGroupEntries, prefix) => {
if (!prefix) {
return classGroupEntries;
}
return classGroupEntries.map(([classGroupId, classGroup]) => {
const prefixedClassGroup = classGroup.map(classDefinition => {
if (typeof classDefinition === 'string') {
return prefix + classDefinition;
}
if (typeof classDefinition === 'object') {
return Object.fromEntries(Object.entries(classDefinition).map(([key, value]) => [prefix + key, value]));
}
return classDefinition;
});
return [classGroupId, prefixedClassGroup];
});
};
// LRU cache inspired from hashlru (https://github.com/dominictarr/hashlru/blob/v1.0.4/index.js) but object replaced with Map to improve performance
const createLruCache = maxCacheSize => {
if (maxCacheSize < 1) {
return {
get: () => undefined,
set: () => {}
};
}
let cacheSize = 0;
let cache = new Map();
let previousCache = new Map();
const update = (key, value) => {
cache.set(key, value);
cacheSize++;
if (cacheSize > maxCacheSize) {
cacheSize = 0;
previousCache = cache;
cache = new Map();
}
};
return {
get(key) {
let value = cache.get(key);
if (value !== undefined) {
return value;
}
if ((value = previousCache.get(key)) !== undefined) {
update(key, value);
return value;
}
},
set(key, value) {
if (cache.has(key)) {
cache.set(key, value);
} else {
update(key, value);
}
}
};
};
const IMPORTANT_MODIFIER = '!';
const createParseClassName = config => {
const {
separator,
experimentalParseClassName
} = config;
const isSeparatorSingleCharacter = separator.length === 1;
const firstSeparatorCharacter = separator[0];
const separatorLength = separator.length;
// parseClassName inspired by https://github.com/tailwindlabs/tailwindcss/blob/v3.2.2/src/util/splitAtTopLevelOnly.js
const parseClassName = className => {
const modifiers = [];
let bracketDepth = 0;
let modifierStart = 0;
let postfixModifierPosition;
for (let index = 0; index < className.length; index++) {
let currentCharacter = className[index];
if (bracketDepth === 0) {
if (currentCharacter === firstSeparatorCharacter && (isSeparatorSingleCharacter || className.slice(index, index + separatorLength) === separator)) {
modifiers.push(className.slice(modifierStart, index));
modifierStart = index + separatorLength;
continue;
}
if (currentCharacter === '/') {
postfixModifierPosition = index;
continue;
}
}
if (currentCharacter === '[') {
bracketDepth++;
} else if (currentCharacter === ']') {
bracketDepth--;
}
}
const baseClassNameWithImportantModifier = modifiers.length === 0 ? className : className.substring(modifierStart);
const hasImportantModifier = baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER);
const baseClassName = hasImportantModifier ? baseClassNameWithImportantModifier.substring(1) : baseClassNameWithImportantModifier;
const maybePostfixModifierPosition = postfixModifierPosition && postfixModifierPosition > modifierStart ? postfixModifierPosition - modifierStart : undefined;
return {
modifiers,
hasImportantModifier,
baseClassName,
maybePostfixModifierPosition
};
};
if (experimentalParseClassName) {
return className => experimentalParseClassName({
className,
parseClassName
});
}
return parseClassName;
};
/**
* Sorts modifiers according to following schema:
* - Predefined modifiers are sorted alphabetically
* - When an arbitrary variant appears, it must be preserved which modifiers are before and after it
*/
const sortModifiers = modifiers => {
if (modifiers.length <= 1) {
return modifiers;
}
const sortedModifiers = [];
let unsortedModifiers = [];
modifiers.forEach(modifier => {
const isArbitraryVariant = modifier[0] === '[';
if (isArbitraryVariant) {
sortedModifiers.push(...unsortedModifiers.sort(), modifier);
unsortedModifiers = [];
} else {
unsortedModifiers.push(modifier);
}
});
sortedModifiers.push(...unsortedModifiers.sort());
return sortedModifiers;
};
const createConfigUtils = config => ({
cache: createLruCache(config.cacheSize),
parseClassName: createParseClassName(config),
...createClassGroupUtils(config)
});
const SPLIT_CLASSES_REGEX = /\s+/;
const mergeClassList = (classList, configUtils) => {
const {
parseClassName,
getClassGroupId,
getConflictingClassGroupIds
} = configUtils;
/**
* Set of classGroupIds in following format:
* `{importantModifier}{variantModifiers}{classGroupId}`
* @example 'float'
* @example 'hover:focus:bg-color'
* @example 'md:!pr'
*/
const classGroupsInConflict = [];
const classNames = classList.trim().split(SPLIT_CLASSES_REGEX);
let result = '';
for (let index = classNames.length - 1; index >= 0; index -= 1) {
const originalClassName = classNames[index];
const {
modifiers,
hasImportantModifier,
baseClassName,
maybePostfixModifierPosition
} = parseClassName(originalClassName);
let hasPostfixModifier = Boolean(maybePostfixModifierPosition);
let classGroupId = getClassGroupId(hasPostfixModifier ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
if (!classGroupId) {
if (!hasPostfixModifier) {
// Not a Tailwind class
result = originalClassName + (result.length > 0 ? ' ' + result : result);
continue;
}
classGroupId = getClassGroupId(baseClassName);
if (!classGroupId) {
// Not a Tailwind class
result = originalClassName + (result.length > 0 ? ' ' + result : result);
continue;
}
hasPostfixModifier = false;
}
const variantModifier = sortModifiers(modifiers).join(':');
const modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier;
const classId = modifierId + classGroupId;
if (classGroupsInConflict.includes(classId)) {
// Tailwind class omitted due to conflict
continue;
}
classGroupsInConflict.push(classId);
const conflictGroups = getConflictingClassGroupIds(classGroupId, hasPostfixModifier);
for (let i = 0; i < conflictGroups.length; ++i) {
const group = conflictGroups[i];
classGroupsInConflict.push(modifierId + group);
}
// Tailwind class not in conflict
result = originalClassName + (result.length > 0 ? ' ' + result : result);
}
return result;
};
/**
* The code in this file is copied from https://github.com/lukeed/clsx and modified to suit the needs of tailwind-merge better.
*
* Specifically:
* - Runtime code from https://github.com/lukeed/clsx/blob/v1.2.1/src/index.js
* - TypeScript types from https://github.com/lukeed/clsx/blob/v1.2.1/clsx.d.ts
*
* Original code has MIT license: Copyright (c) Luke Edwards <luke.edwards05@gmail.com> (lukeed.com)
*/
function twJoin() {
let index = 0;
let argument;
let resolvedValue;
let string = '';
while (index < arguments.length) {
if (argument = arguments[index++]) {
if (resolvedValue = toValue(argument)) {
string && (string += ' ');
string += resolvedValue;
}
}
}
return string;
}
const toValue = mix => {
if (typeof mix === 'string') {
return mix;
}
let resolvedValue;
let string = '';
for (let k = 0; k < mix.length; k++) {
if (mix[k]) {
if (resolvedValue = toValue(mix[k])) {
string && (string += ' ');
string += resolvedValue;
}
}
}
return string;
};
function createTailwindMerge(createConfigFirst, ...createConfigRest) {
let configUtils;
let cacheGet;
let cacheSet;
let functionToCall = initTailwindMerge;
function initTailwindMerge(classList) {
const config = createConfigRest.reduce((previousConfig, createConfigCurrent) => createConfigCurrent(previousConfig), createConfigFirst());
configUtils = createConfigUtils(config);
cacheGet = configUtils.cache.get;
cacheSet = configUtils.cache.set;
functionToCall = tailwindMerge;
return tailwindMerge(classList);
}
function tailwindMerge(classList) {
const cachedResult = cacheGet(classList);
if (cachedResult) {
return cachedResult;
}
const result = mergeClassList(classList, configUtils);
cacheSet(classList, result);
return result;
}
return function callTailwindMerge() {
return functionToCall(twJoin.apply(null, arguments));
};
}
const fromTheme = key => {
const themeGetter = theme => theme[key] || [];
themeGetter.isThemeGetter = true;
return themeGetter;
};
const arbitraryValueRegex = /^\[(?:([a-z-]+):)?(.+)\]$/i;
const fractionRegex = /^\d+\/\d+$/;
const stringLengths = /*#__PURE__*/new Set(['px', 'full', 'screen']);
const tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
const lengthUnitRegex = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/;
const colorFunctionRegex = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/;
// Shadow always begins with x and y offset separated by underscore optionally prepended by inset
const shadowRegex = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
const imageRegex = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/;
const isLength = value => isNumber(value) || stringLengths.has(value) || fractionRegex.test(value);
const isArbitraryLength = value => getIsArbitraryValue(value, 'length', isLengthOnly);
const isNumber = value => Boolean(value) && !Number.isNaN(Number(value));
const isArbitraryNumber = value => getIsArbitraryValue(value, 'number', isNumber);
const isInteger = value => Boolean(value) && Number.isInteger(Number(value));
const isPercent = value => value.endsWith('%') && isNumber(value.slice(0, -1));
const isArbitraryValue = value => arbitraryValueRegex.test(value);
const isTshirtSize = value => tshirtUnitRegex.test(value);
const sizeLabels = /*#__PURE__*/new Set(['length', 'size', 'percentage']);
const isArbitrarySize = value => getIsArbitraryValue(value, sizeLabels, isNever);
const isArbitraryPosition = value => getIsArbitraryValue(value, 'position', isNever);
const imageLabels = /*#__PURE__*/new Set(['image', 'url']);
const isArbitraryImage = value => getIsArbitraryValue(value, imageLabels, isImage);
const isArbitraryShadow = value => getIsArbitraryValue(value, '', isShadow);
const isAny = () => true;
const getIsArbitraryValue = (value, label, testValue) => {
const result = arbitraryValueRegex.exec(value);
if (result) {
if (result[1]) {
return typeof label === 'string' ? result[1] === label : label.has(result[1]);
}
return testValue(result[2]);
}
return false;
};
const isLengthOnly = value =>
// `colorFunctionRegex` check is necessary because color functions can have percentages in them which which would be incorrectly classified as lengths.
// For example, `hsl(0 0% 0%)` would be classified as a length without this check.
// I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
lengthUnitRegex.test(value) && !colorFunctionRegex.test(value);
const isNever = () => false;
const isShadow = value => shadowRegex.test(value);
const isImage = value => imageRegex.test(value);
const validators = /*#__PURE__*/Object.defineProperty({
__proto__: null,
isAny,
isArbitraryImage,
isArbitraryLength,
isArbitraryNumber,
isArbitraryPosition,
isArbitraryShadow,
isArbitrarySize,
isArbitraryValue,
isInteger,
isLength,
isNumber,
isPercent,
isTshirtSize
}, Symbol.toStringTag, {
value: 'Module'
});
const getDefaultConfig = () => {
const colors = fromTheme('colors');
const spacing = fromTheme('spacing');
const blur = fromTheme('blur');
const brightness = fromTheme('brightness');
const borderColor = fromTheme('borderColor');
const borderRadius = fromTheme('borderRadius');
const borderSpacing = fromTheme('borderSpacing');
const borderWidth = fromTheme('borderWidth');
const contrast = fromTheme('contrast');
const grayscale = fromTheme('grayscale');
const hueRotate = fromTheme('hueRotate');
const invert = fromTheme('invert');
const gap = fromTheme('gap');
const gradientColorStops = fromTheme('gradientColorStops');
const gradientColorStopPositions = fromTheme('gradientColorStopPositions');
const inset = fromTheme('inset');
const margin = fromTheme('margin');
const opacity = fromTheme('opacity');
const padding = fromTheme('padding');
const saturate = fromTheme('saturate');
const scale = fromTheme('scale');
const sepia = fromTheme('sepia');
const skew = fromTheme('skew');
const space = fromTheme('space');
const translate = fromTheme('translate');
const getOverscroll = () => ['auto', 'contain', 'none'];
const getOverflow = () => ['auto', 'hidden', 'clip', 'visible', 'scroll'];
const getSpacingWithAutoAndArbitrary = () => ['auto', isArbitraryValue, spacing];
const getSpacingWithArbitrary = () => [isArbitraryValue, spacing];
const getLengthWithEmptyAndArbitrary = () => ['', isLength, isArbitraryLength];
const getNumberWithAutoAndArbitrary = () => ['auto', isNumber, isArbitraryValue];
const getPositions = () => ['bottom', 'center', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top', 'top'];
const getLineStyles = () => ['solid', 'dashed', 'dotted', 'double', 'none'];
const getBlendModes = () => ['normal', 'multiply', 'screen', 'overlay', 'darken', 'lighten', 'color-dodge', 'color-burn', 'hard-light', 'soft-light', 'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity'];
const getAlign = () => ['start', 'end', 'center', 'between', 'around', 'evenly', 'stretch'];
const getZeroAndEmpty = () => ['', '0', isArbitraryValue];
const getBreaks = () => ['auto', 'avoid', 'all', 'avoid-page', 'page', 'left', 'right', 'column'];
const getNumberAndArbitrary = () => [isNumber, isArbitraryValue];
return {
cacheSize: 500,
separator: ':',
theme: {
colors: [isAny],
spacing: [isLength, isArbitraryLength],
blur: ['none', '', isTshirtSize, isArbitraryValue],
brightness: getNumberAndArbitrary(),
borderColor: [colors],
borderRadius: ['none', '', 'full', isTshirtSize, isArbitraryValue],
borderSpacing: getSpacingWithArbitrary(),
borderWidth: getLengthWithEmptyAndArbitrary(),
contrast: getNumberAndArbitrary(),
grayscale: getZeroAndEmpty(),
hueRotate: getNumberAndArbitrary(),
invert: getZeroAndEmpty(),
gap: getSpacingWithArbitrary(),
gradientColorStops: [colors],
gradientColorStopPositions: [isPercent, isArbitraryLength],
inset: getSpacingWithAutoAndArbitrary(),
margin: getSpacingWithAutoAndArbitrary(),
opacity: getNumberAndArbitrary(),
padding: getSpacingWithArbitrary(),
saturate: getNumberAndArbitrary(),
scale: getNumberAndArbitrary(),
sepia: getZeroAndEmpty(),
skew: getNumberAndArbitrary(),
space: getSpacingWithArbitrary(),
translate: getSpacingWithArbitrary()
},
classGroups: {
// Layout
/**
* Aspect Ratio
* @see https://tailwindcss.com/docs/aspect-ratio
*/
aspect: [{
aspect: ['auto', 'square', 'video', isArbitraryValue]
}],
/**
* Container
* @see https://tailwindcss.com/docs/container
*/
container: ['container'],
/**
* Columns
* @see https://tailwindcss.com/docs/columns
*/
columns: [{
columns: [isTshirtSize]
}],
/**
* Break After
* @see https://tailwindcss.com/docs/break-after
*/
'break-after': [{
'break-after': getBreaks()
}],
/**
* Break Before
* @see https://tailwindcss.com/docs/break-before
*/
'break-before': [{
'break-before': getBreaks()
}],
/**
* Break Inside
* @see https://tailwindcss.com/docs/break-inside
*/
'break-inside': [{
'break-inside': ['auto', 'avoid', 'avoid-page', 'avoid-column']
}],
/**
* Box Decoration Break
* @see https://tailwindcss.com/docs/box-decoration-break
*/
'box-decoration': [{
'box-decoration': ['slice', 'clone']
}],
/**
* Box Sizing
* @see https://tailwindcss.com/docs/box-sizing
*/
box: [{
box: ['border', 'content']
}],
/**
* Display
* @see https://tailwindcss.com/docs/display
*/
display: ['block', 'inline-block', 'inline', 'flex', 'inline-flex', 'table', 'inline-table', 'table-caption', 'table-cell', 'table-column', 'table-column-group', 'table-footer-group', 'table-header-group', 'table-row-group', 'table-row', 'flow-root', 'grid', 'inline-grid', 'contents', 'list-item', 'hidden'],
/**
* Floats
* @see https://tailwindcss.com/docs/float
*/
float: [{
float: ['right', 'left', 'none', 'start', 'end']
}],
/**
* Clear
* @see https://tailwindcss.com/docs/clear
*/
clear: [{
clear: ['left', 'right', 'both', 'none', 'start', 'end']
}],
/**
* Isolation
* @see https://tailwindcss.com/docs/isolation
*/
isolation: ['isolate', 'isolation-auto'],
/**
* Object Fit
* @see https://tailwindcss.com/docs/object-fit
*/
'object-fit': [{
object: ['contain', 'cover', 'fill', 'none', 'scale-down']
}],
/**
* Object Position
* @see https://tailwindcss.com/docs/object-position
*/
'object-position': [{
object: [...getPositions(), isArbitraryValue]
}],
/**
* Overflow
* @see https://tailwindcss.com/docs/overflow
*/
overflow: [{
overflow: getOverflow()
}],
/**
* Overflow X
* @see https://tailwindcss.com/docs/overflow
*/
'overflow-x': [{
'overflow-x': getOverflow()
}],
/**
* Overflow Y
* @see https://tailwindcss.com/docs/overflow
*/
'overflow-y': [{
'overflow-y': getOverflow()
}],
/**
* Overscroll Behavior
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
overscroll: [{
overscroll: getOverscroll()
}],
/**
* Overscroll Behavior X
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
'overscroll-x': [{
'overscroll-x': getOverscroll()
}],
/**
* Overscroll Behavior Y
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
'overscroll-y': [{
'overscroll-y': getOverscroll()
}],
/**
* Position
* @see https://tailwindcss.com/docs/position
*/
position: ['static', 'fixed', 'absolute', 'relative', 'sticky'],
/**
* Top / Right / Bottom / Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
inset: [{
inset: [inset]
}],
/**
* Right / Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
'inset-x': [{
'inset-x': [inset]
}],
/**
* Top / Bottom
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
'inset-y': [{
'inset-y': [inset]
}],
/**
* Start
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
start: [{
start: [inset]
}],
/**
* End
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
end: [{
end: [inset]
}],
/**
* Top
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
top: [{
top: [inset]
}],
/**
* Right
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
right: [{
right: [inset]
}],
/**
* Bottom
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
bottom: [{
bottom: [inset]
}],
/**
* Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
left: [{
left: [inset]
}],
/**
* Visibility
* @see https://tailwindcss.com/docs/visibility
*/
visibility: ['visible', 'invisible', 'collapse'],
/**
* Z-Index
* @see https://tailwindcss.com/docs/z-index
*/
z: [{
z: ['auto', isInteger, isArbitraryValue]
}],
// Flexbox and Grid
/**
* Flex Basis
* @see https://tailwindcss.com/docs/flex-basis
*/
basis: [{
basis: getSpacingWithAutoAndArbitrary()
}],
/**
* Flex Direction
* @see https://tailwindcss.com/docs/flex-direction
*/
'flex-direction': [{
flex: ['row', 'row-reverse', 'col', 'col-reverse']
}],
/**
* Flex Wrap
* @see https://tailwindcss.com/docs/flex-wrap
*/
'flex-wrap': [{
flex: ['wrap', 'wrap-reverse', 'nowrap']
}],
/**
* Flex
* @see https://tailwindcss.com/docs/flex
*/
flex: [{
flex: ['1', 'auto', 'initial', 'none', isArbitraryValue]
}],
/**
* Flex Grow
* @see https://tailwindcss.com/docs/flex-grow
*/
grow: [{
grow: getZeroAndEmpty()
}],
/**
* Flex Shrink
* @see https://tailwindcss.com/docs/flex-shrink
*/
shrink: [{
shrink: getZeroAndEmpty()
}],
/**
* Order
* @see https://tailwindcss.com/docs/order
*/
order: [{
order: ['first', 'last', 'none', isInteger, isArbitraryValue]
}],
/**
* Grid Template Columns
* @see https://tailwindcss.com/docs/grid-template-columns
*/
'grid-cols': [{
'grid-cols': [isAny]
}],
/**
* Grid Column Start / End
* @see https://tailwindcss.com/docs/grid-column
*/
'col-start-end': [{
col: ['auto', {
span: ['full', isInteger, isArbitraryValue]
}, isArbitraryValue]
}],
/**
* Grid Column Start
* @see https://tailwindcss.com/docs/grid-column
*/
'col-start': [{
'col-start': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Column End
* @see https://tailwindcss.com/docs/grid-column
*/
'col-end': [{
'col-end': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Template Rows
* @see https://tailwindcss.com/docs/grid-template-rows
*/
'grid-rows': [{
'grid-rows': [isAny]
}],
/**
* Grid Row Start / End
* @see https://tailwindcss.com/docs/grid-row
*/
'row-start-end': [{
row: ['auto', {
span: [isInteger, isArbitraryValue]
}, isArbitraryValue]
}],
/**
* Grid Row Start
* @see https://tailwindcss.com/docs/grid-row
*/
'row-start': [{
'row-start': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Row End
* @see https://tailwindcss.com/docs/grid-row
*/
'row-end': [{
'row-end': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Auto Flow
* @see https://tailwindcss.com/docs/grid-auto-flow
*/
'grid-flow': [{
'grid-flow': ['row', 'col', 'dense', 'row-dense', 'col-dense']
}],
/**
* Grid Auto Columns
* @see https://tailwindcss.com/docs/grid-auto-columns
*/
'auto-cols': [{
'auto-cols': ['auto', 'min', 'max', 'fr', isArbitraryValue]
}],
/**
* Grid Auto Rows
* @see https://tailwindcss.com/docs/grid-auto-rows
*/
'auto-rows': [{
'auto-rows': ['auto', 'min', 'max', 'fr', isArbitraryValue]
}],
/**
* Gap
* @see https://tailwindcss.com/docs/gap
*/
gap: [{
gap: [gap]
}],
/**
* Gap X
* @see https://tailwindcss.com/docs/gap
*/
'gap-x': [{
'gap-x': [gap]
}],
/**
* Gap Y
* @see https://tailwindcss.com/docs/gap
*/
'gap-y': [{
'gap-y': [gap]
}],
/**
* Justify Content
* @see https://tailwindcss.com/docs/justify-content
*/
'justify-content': [{
justify: ['normal', ...getAlign()]
}],
/**
* Justify Items
* @see https://tailwindcss.com/docs/justify-items
*/
'justify-items': [{
'justify-items': ['start', 'end', 'center', 'stretch']
}],
/**
* Justify Self
* @see https://tailwindcss.com/docs/justify-self
*/
'justify-self': [{
'justify-self': ['auto', 'start', 'end', 'center', 'stretch']
}],
/**
* Align Content
* @see https://tailwindcss.com/docs/align-content
*/
'align-content': [{
content: ['normal', ...getAlign(), 'baseline']
}],
/**
* Align Items
* @see https://tailwindcss.com/docs/align-items
*/
'align-items': [{
items: ['start', 'end', 'center', 'baseline', 'stretch']
}],
/**
* Align Self
* @see https://tailwindcss.com/docs/align-self
*/
'align-self': [{
self: ['auto', 'start', 'end', 'center', 'stretch', 'baseline']
}],
/**
* Place Content
* @see https://tailwindcss.com/docs/place-content
*/
'place-content': [{
'place-content': [...getAlign(), 'baseline']
}],
/**
* Place Items
* @see https://tailwindcss.com/docs/place-items
*/
'place-items': [{
'place-items': ['start', 'end', 'center', 'baseline', 'stretch']
}],
/**
* Place Self
* @see https://tailwindcss.com/docs/place-self
*/
'place-self': [{
'place-self': ['auto', 'start', 'end', 'center', 'stretch']
}],
// Spacing
/**
* Padding
* @see https://tailwindcss.com/docs/padding
*/
p: [{
p: [padding]
}],
/**
* Padding X
* @see https://tailwindcss.com/docs/padding
*/
px: [{
px: [padding]
}],
/**
* Padding Y
* @see https://tailwindcss.com/docs/padding
*/
py: [{
py: [padding]
}],
/**
* Padding Start
* @see https://tailwindcss.com/docs/padding
*/
ps: [{
ps: [padding]
}],
/**
* Padding End
* @see https://tailwindcss.com/docs/padding
*/
pe: [{
pe: [padding]
}],
/**
* Padding Top
* @see https://tailwindcss.com/docs/padding
*/
pt: [{
pt: [padding]
}],
/**
* Padding Right
* @see https://tailwindcss.com/docs/padding
*/
pr: [{
pr: [padding]
}],
/**
* Padding Bottom
* @see https://tailwindcss.com/docs/padding
*/
pb: [{
pb: [padding]
}],
/**
* Padding Left
* @see https://tailwindcss.com/docs/padding
*/
pl: [{
pl: [padding]
}],
/**
* Margin
* @see https://tailwindcss.com/docs/margin
*/
m: [{
m: [margin]
}],
/**
* Margin X
* @see https://tailwindcss.com/docs/margin
*/
mx: [{
mx: [margin]
}],
/**
* Margin Y
* @see https://tailwindcss.com/docs/margin
*/
my: [{
my: [margin]
}],
/**
* Margin Start
* @see https://tailwindcss.com/docs/margin
*/
ms: [{
ms: [margin]
}],
/**
* Margin End
* @see https://tailwindcss.com/docs/margin
*/
me: [{
me: [margin]
}],
/**
* Margin Top
* @see https://tailwindcss.com/docs/margin
*/
mt: [{
mt: [margin]
}],
/**
* Margin Right
* @see https://tailwindcss.com/docs/margin
*/
mr: [{
mr: [margin]
}],
/**
* Margin Bottom
* @see https://tailwindcss.com/docs/margin
*/
mb: [{
mb: [margin]
}],
/**
* Margin Left
* @see https://tailwindcss.com/docs/margin
*/
ml: [{
ml: [margin]
}],
/**
* Space Between X
* @see https://tailwindcss.com/docs/space
*/
'space-x': [{
'space-x': [space]
}],
/**
* Space Between X Reverse
* @see https://tailwindcss.com/docs/space
*/
'space-x-reverse': ['space-x-reverse'],
/**
* Space Between Y
* @see https://tailwindcss.com/docs/space
*/
'space-y': [{
'space-y': [space]
}],
/**
* Space Between Y Reverse
* @see https://tailwindcss.com/docs/space
*/
'space-y-reverse': ['space-y-reverse'],
// Sizing
/**
* Width
* @see https://tailwindcss.com/docs/width
*/
w: [{
w: ['auto', 'min', 'max', 'fit', 'svw', 'lvw', 'dvw', isArbitraryValue, spacing]
}],
/**
* Min-Width
* @see https://tailwindcss.com/docs/min-width
*/
'min-w': [{
'min-w': [isArbitraryValue, spacing, 'min', 'max', 'fit']
}],
/**
* Max-Width
* @see https://tailwindcss.com/docs/max-width
*/
'max-w': [{
'max-w': [isArbitraryValue, spacing, 'none', 'full', 'min', 'max', 'fit', 'prose', {
screen: [isTshirtSize]
}, isTshirtSize]
}],
/**
* Height
* @see https://tailwindcss.com/docs/height
*/
h: [{
h: [isArbitraryValue, spacing, 'auto', 'min', 'max', 'fit', 'svh', 'lvh', 'dvh']
}],
/**
* Min-Height
* @see https://tailwindcss.com/docs/min-height
*/
'min-h': [{
'min-h': [isArbitraryValue, spacing, 'min', 'max', 'fit', 'svh', 'lvh', 'dvh']
}],
/**
* Max-Height
* @see https://tailwindcss.com/docs/max-height
*/
'max-h': [{
'max-h': [isArbitraryValue, spacing, 'min', 'max', 'fit', 'svh', 'lvh', 'dvh']
}],
/**
* Size
* @see https://tailwindcss.com/docs/size
*/
size: [{
size: [isArbitraryValue, spacing, 'auto', 'min', 'max', 'fit']
}],
// Typography
/**
* Font Size
* @see https://tailwindcss.com/docs/font-size
*/
'font-size': [{
text: ['base', isTshirtSize, isArbitraryLength]
}],
/**
* Font Smoothing
* @see https://tailwindcss.com/docs/font-smoothing
*/
'font-smoothing': ['antialiased', 'subpixel-antialiased'],
/**
* Font Style
* @see https://tailwindcss.com/docs/font-style
*/
'font-style': ['italic', 'not-italic'],
/**
* Font Weight
* @see https://tailwindcss.com/docs/font-weight
*/
'font-weight': [{
font: ['thin', 'extralight', 'light', 'normal', 'medium', 'semibold', 'bold', 'extrabold', 'black', isArbitraryNumber]
}],
/**
* Font Family
* @see https://tailwindcss.com/docs/font-family
*/
'font-family': [{
font: [isAny]
}],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-normal': ['normal-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-ordinal': ['ordinal'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-slashed-zero': ['slashed-zero'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-figure': ['lining-nums', 'oldstyle-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-spacing': ['proportional-nums', 'tabular-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-fraction': ['diagonal-fractions', 'stacked-fractions'],
/**
* Letter Spacing
* @see https://tailwindcss.com/docs/letter-spacing
*/
tracking: [{
tracking: ['tighter', 'tight', 'normal', 'wide', 'wider', 'widest', isArbitraryValue]
}],
/**
* Line Clamp
* @see https://tailwindcss.com/docs/line-clamp
*/
'line-clamp': [{
'line-clamp': ['none', isNumber, isArbitraryNumber]
}],
/**
* Line Height
* @see https://tailwindcss.com/docs/line-height
*/
leading: [{
leading: ['none', 'tight', 'snug', 'normal', 'relaxed', 'loose', isLength, isArbitraryValue]
}],
/**
* List Style Image
* @see https://tailwindcss.com/docs/list-style-image
*/
'list-image': [{
'list-image': ['none', isArbitraryValue]
}],
/**
* List Style Type
* @see https://tailwindcss.com/docs/list-style-type
*/
'list-style-type': [{
list: ['none', 'disc', 'decimal', isArbitraryValue]
}],
/**
* List Style Position
* @see https://tailwindcss.com/docs/list-style-position
*/
'list-style-position': [{
list: ['inside', 'outside']
}],
/**
* Placeholder Color
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/placeholder-color
*/
'placeholder-color': [{
placeholder: [colors]
}],
/**
* Placeholder Opacity
* @see https://tailwindcss.com/docs/placeholder-opacity
*/
'placeholder-opacity': [{
'placeholder-opacity': [opacity]
}],
/**
* Text Alignment
* @see https://tailwindcss.com/docs/text-align
*/
'text-alignment': [{
text: ['left', 'center', 'right', 'justify', 'start', 'end']
}],
/**
* Text Color
* @see https://tailwindcss.com/docs/text-color
*/
'text-color': [{
text: [colors]
}],
/**
* Text Opacity
* @see https://tailwindcss.com/docs/text-opacity
*/
'text-opacity': [{
'text-opacity': [opacity]
}],
/**
* Text Decoration
* @see https://tailwindcss.com/docs/text-decoration
*/
'text-decoration': ['underline', 'overline', 'line-through', 'no-underline'],
/**
* Text Decoration Style
* @see https://tailwindcss.com/docs/text-decoration-style
*/
'text-decoration-style': [{
decoration: [...getLineStyles(), 'wavy']
}],
/**
* Text Decoration Thickness
* @see https://tailwindcss.com/docs/text-decoration-thickness
*/
'text-decoration-thickness': [{
decoration: ['auto', 'from-font', isLength, isArbitraryLength]
}],
/**
* Text Underline Offset
* @see https://tailwindcss.com/docs/text-underline-offset
*/
'underline-offset': [{
'underline-offset': ['auto', isLength, isArbitraryValue]
}],
/**
* Text Decoration Color
* @see https://tailwindcss.com/docs/text-decoration-color
*/
'text-decoration-color': [{
decoration: [colors]
}],
/**
* Text Transform
* @see https://tailwindcss.com/docs/text-transform
*/
'text-transform': ['uppercase', 'lowercase', 'capitalize', 'normal-case'],
/**
* Text Overflow
* @see https://tailwindcss.com/docs/text-overflow
*/
'text-overflow': ['truncate', 'text-ellipsis', 'text-clip'],
/**
* Text Wrap
* @see https://tailwindcss.com/docs/text-wrap
*/
'text-wrap': [{
text: ['wrap', 'nowrap', 'balance', 'pretty']
}],
/**
* Text Indent
* @see https://tailwindcss.com/docs/text-indent
*/
indent: [{
indent: getSpacingWithArbitrary()
}],
/**
* Vertical Alignment
* @see https://tailwindcss.com/docs/vertical-align
*/
'vertical-align': [{
align: ['baseline', 'top', 'middle', 'bottom', 'text-top', 'text-bottom', 'sub', 'super', isArbitraryValue]
}],
/**
* Whitespace
* @see https://tailwindcss.com/docs/whitespace
*/
whitespace: [{
whitespace: ['normal', 'nowrap', 'pre', 'pre-line', 'pre-wrap', 'break-spaces']
}],
/**
* Word Break
* @see https://tailwindcss.com/docs/word-break
*/
break: [{
break: ['normal', 'words', 'all', 'keep']
}],
/**
* Hyphens
* @see https://tailwindcss.com/docs/hyphens
*/
hyphens: [{
hyphens: ['none', 'manual', 'auto']
}],
/**
* Content
* @see https://tailwindcss.com/docs/content
*/
content: [{
content: ['none', isArbitraryValue]
}],
// Backgrounds
/**
* Background Attachment
* @see https://tailwindcss.com/docs/background-attachment
*/
'bg-attachment': [{
bg: ['fixed', 'local', 'scroll']
}],
/**
* Background Clip
* @see https://tailwindcss.com/docs/background-clip
*/
'bg-clip': [{
'bg-clip': ['border', 'padding', 'content', 'text']
}],
/**
* Background Opacity
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/background-opacity
*/
'bg-opacity': [{
'bg-opacity': [opacity]
}],
/**
* Background Origin
* @see https://tailwindcss.com/docs/background-origin
*/
'bg-origin': [{
'bg-origin': ['border', 'padding', 'content']
}],
/**
* Background Position
* @see https://tailwindcss.com/docs/background-position
*/
'bg-position': [{
bg: [...getPositions(), isArbitraryPosition]
}],
/**
* Background Repeat
* @see https://tailwindcss.com/docs/background-repeat
*/
'bg-repeat': [{
bg: ['no-repeat', {
repeat: ['', 'x', 'y', 'round', 'space']
}]
}],
/**
* Background Size
* @see https://tailwindcss.com/docs/background-size
*/
'bg-size': [{
bg: ['auto', 'cover', 'contain', isArbitrarySize]
}],
/**
* Background Image
* @see https://tailwindcss.com/docs/background-image
*/
'bg-image': [{
bg: ['none', {
'gradient-to': ['t', 'tr', 'r', 'br', 'b', 'bl', 'l', 'tl']
}, isArbitraryImage]
}],
/**
* Background Color
* @see https://tailwindcss.com/docs/background-color
*/
'bg-color': [{
bg: [colors]
}],
/**
* Gradient Color Stops From Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-from-pos': [{
from: [gradientColorStopPositions]
}],
/**
* Gradient Color Stops Via Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-via-pos': [{
via: [gradientColorStopPositions]
}],
/**
* Gradient Color Stops To Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-to-pos': [{
to: [gradientColorStopPositions]
}],
/**
* Gradient Color Stops From
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-from': [{
from: [gradientColorStops]
}],
/**
* Gradient Color Stops Via
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-via': [{
via: [gradientColorStops]
}],
/**
* Gradient Color Stops To
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-to': [{
to: [gradientColorStops]
}],
// Borders
/**
* Border Radius
* @see https://tailwindcss.com/docs/border-radius
*/
rounded: [{
rounded: [borderRadius]
}],
/**
* Border Radius Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-s': [{
'rounded-s': [borderRadius]
}],
/**
* Border Radius End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-e': [{
'rounded-e': [borderRadius]
}],
/**
* Border Radius Top
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-t': [{
'rounded-t': [borderRadius]
}],
/**
* Border Radius Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-r': [{
'rounded-r': [borderRadius]
}],
/**
* Border Radius Bottom
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-b': [{
'rounded-b': [borderRadius]
}],
/**
* Border Radius Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-l': [{
'rounded-l': [borderRadius]
}],
/**
* Border Radius Start Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-ss': [{
'rounded-ss': [borderRadius]
}],
/**
* Border Radius Start End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-se': [{
'rounded-se': [borderRadius]
}],
/**
* Border Radius End End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-ee': [{
'rounded-ee': [borderRadius]
}],
/**
* Border Radius End Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-es': [{
'rounded-es': [borderRadius]
}],
/**
* Border Radius Top Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-tl': [{
'rounded-tl': [borderRadius]
}],
/**
* Border Radius Top Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-tr': [{
'rounded-tr': [borderRadius]
}],
/**
* Border Radius Bottom Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-br': [{
'rounded-br': [borderRadius]
}],
/**
* Border Radius Bottom Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-bl': [{
'rounded-bl': [borderRadius]
}],
/**
* Border Width
* @see https://tailwindcss.com/docs/border-width
*/
'border-w': [{
border: [borderWidth]
}],
/**
* Border Width X
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-x': [{
'border-x': [borderWidth]
}],
/**
* Border Width Y
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-y': [{
'border-y': [borderWidth]
}],
/**
* Border Width Start
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-s': [{
'border-s': [borderWidth]
}],
/**
* Border Width End
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-e': [{
'border-e': [borderWidth]
}],
/**
* Border Width Top
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-t': [{
'border-t': [borderWidth]
}],
/**
* Border Width Right
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-r': [{
'border-r': [borderWidth]
}],
/**
* Border Width Bottom
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-b': [{
'border-b': [borderWidth]
}],
/**
* Border Width Left
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-l': [{
'border-l': [borderWidth]
}],
/**
* Border Opacity
* @see https://tailwindcss.com/docs/border-opacity
*/
'border-opacity': [{
'border-opacity': [opacity]
}],
/**
* Border Style
* @see https://tailwindcss.com/docs/border-style
*/
'border-style': [{
border: [...getLineStyles(), 'hidden']
}],
/**
* Divide Width X
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-x': [{
'divide-x': [borderWidth]
}],
/**
* Divide Width X Reverse
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-x-reverse': ['divide-x-reverse'],
/**
* Divide Width Y
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-y': [{
'divide-y': [borderWidth]
}],
/**
* Divide Width Y Reverse
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-y-reverse': ['divide-y-reverse'],
/**
* Divide Opacity
* @see https://tailwindcss.com/docs/divide-opacity
*/
'divide-opacity': [{
'divide-opacity': [opacity]
}],
/**
* Divide Style
* @see https://tailwindcss.com/docs/divide-style
*/
'divide-style': [{
divide: getLineStyles()
}],
/**
* Border Color
* @see https://tailwindcss.com/docs/border-color
*/
'border-color': [{
border: [borderColor]
}],
/**
* Border Color X
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-x': [{
'border-x': [borderColor]
}],
/**
* Border Color Y
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-y': [{
'border-y': [borderColor]
}],
/**
* Border Color S
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-s': [{
'border-s': [borderColor]
}],
/**
* Border Color E
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-e': [{
'border-e': [borderColor]
}],
/**
* Border Color Top
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-t': [{
'border-t': [borderColor]
}],
/**
* Border Color Right
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-r': [{
'border-r': [borderColor]
}],
/**
* Border Color Bottom
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-b': [{
'border-b': [borderColor]
}],
/**
* Border Color Left
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-l': [{
'border-l': [borderColor]
}],
/**
* Divide Color
* @see https://tailwindcss.com/docs/divide-color
*/
'divide-color': [{
divide: [borderColor]
}],
/**
* Outline Style
* @see https://tailwindcss.com/docs/outline-style
*/
'outline-style': [{
outline: ['', ...getLineStyles()]
}],
/**
* Outline Offset
* @see https://tailwindcss.com/docs/outline-offset
*/
'outline-offset': [{
'outline-offset': [isLength, isArbitraryValue]
}],
/**
* Outline Width
* @see https://tailwindcss.com/docs/outline-width
*/
'outline-w': [{
outline: [isLength, isArbitraryLength]
}],
/**
* Outline Color
* @see https://tailwindcss.com/docs/outline-color
*/
'outline-color': [{
outline: [colors]
}],
/**
* Ring Width
* @see https://tailwindcss.com/docs/ring-width
*/
'ring-w': [{
ring: getLengthWithEmptyAndArbitrary()
}],
/**
* Ring Width Inset
* @see https://tailwindcss.com/docs/ring-width
*/
'ring-w-inset': ['ring-inset'],
/**
* Ring Color
* @see https://tailwindcss.com/docs/ring-color
*/
'ring-color': [{
ring: [colors]
}],
/**
* Ring Opacity
* @see https://tailwindcss.com/docs/ring-opacity
*/
'ring-opacity': [{
'ring-opacity': [opacity]
}],
/**
* Ring Offset Width
* @see https://tailwindcss.com/docs/ring-offset-width
*/
'ring-offset-w': [{
'ring-offset': [isLength, isArbitraryLength]
}],
/**
* Ring Offset Color
* @see https://tailwindcss.com/docs/ring-offset-color
*/
'ring-offset-color': [{
'ring-offset': [colors]
}],
// Effects
/**
* Box Shadow
* @see https://tailwindcss.com/docs/box-shadow
*/
shadow: [{
shadow: ['', 'inner', 'none', isTshirtSize, isArbitraryShadow]
}],
/**
* Box Shadow Color
* @see https://tailwindcss.com/docs/box-shadow-color
*/
'shadow-color': [{
shadow: [isAny]
}],
/**
* Opacity
* @see https://tailwindcss.com/docs/opacity
*/
opacity: [{
opacity: [opacity]
}],
/**
* Mix Blend Mode
* @see https://tailwindcss.com/docs/mix-blend-mode
*/
'mix-blend': [{
'mix-blend': [...getBlendModes(), 'plus-lighter', 'plus-darker']
}],
/**
* Background Blend Mode
* @see https://tailwindcss.com/docs/background-blend-mode
*/
'bg-blend': [{
'bg-blend': getBlendModes()
}],
// Filters
/**
* Filter
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/filter
*/
filter: [{
filter: ['', 'none']
}],
/**
* Blur
* @see https://tailwindcss.com/docs/blur
*/
blur: [{
blur: [blur]
}],
/**
* Brightness
* @see https://tailwindcss.com/docs/brightness
*/
brightness: [{
brightness: [brightness]
}],
/**
* Contrast
* @see https://tailwindcss.com/docs/contrast
*/
contrast: [{
contrast: [contrast]
}],
/**
* Drop Shadow
* @see https://tailwindcss.com/docs/drop-shadow
*/
'drop-shadow': [{
'drop-shadow': ['', 'none', isTshirtSize, isArbitraryValue]
}],
/**
* Grayscale
* @see https://tailwindcss.com/docs/grayscale
*/
grayscale: [{
grayscale: [grayscale]
}],
/**
* Hue Rotate
* @see https://tailwindcss.com/docs/hue-rotate
*/
'hue-rotate': [{
'hue-rotate': [hueRotate]
}],
/**
* Invert
* @see https://tailwindcss.com/docs/invert
*/
invert: [{
invert: [invert]
}],
/**
* Saturate
* @see https://tailwindcss.com/docs/saturate
*/
saturate: [{
saturate: [saturate]
}],
/**
* Sepia
* @see https://tailwindcss.com/docs/sepia
*/
sepia: [{
sepia: [sepia]
}],
/**
* Backdrop Filter
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/backdrop-filter
*/
'backdrop-filter': [{
'backdrop-filter': ['', 'none']
}],
/**
* Backdrop Blur
* @see https://tailwindcss.com/docs/backdrop-blur
*/
'backdrop-blur': [{
'backdrop-blur': [blur]
}],
/**
* Backdrop Brightness
* @see https://tailwindcss.com/docs/backdrop-brightness
*/
'backdrop-brightness': [{
'backdrop-brightness': [brightness]
}],
/**
* Backdrop Contrast
* @see https://tailwindcss.com/docs/backdrop-contrast
*/
'backdrop-contrast': [{
'backdrop-contrast': [contrast]
}],
/**
* Backdrop Grayscale
* @see https://tailwindcss.com/docs/backdrop-grayscale
*/
'backdrop-grayscale': [{
'backdrop-grayscale': [grayscale]
}],
/**
* Backdrop Hue Rotate
* @see https://tailwindcss.com/docs/backdrop-hue-rotate
*/
'backdrop-hue-rotate': [{
'backdrop-hue-rotate': [hueRotate]
}],
/**
* Backdrop Invert
* @see https://tailwindcss.com/docs/backdrop-invert
*/
'backdrop-invert': [{
'backdrop-invert': [invert]
}],
/**
* Backdrop Opacity
* @see https://tailwindcss.com/docs/backdrop-opacity
*/
'backdrop-opacity': [{
'backdrop-opacity': [opacity]
}],
/**
* Backdrop Saturate
* @see https://tailwindcss.com/docs/backdrop-saturate
*/
'backdrop-saturate': [{
'backdrop-saturate': [saturate]
}],
/**
* Backdrop Sepia
* @see https://tailwindcss.com/docs/backdrop-sepia
*/
'backdrop-sepia': [{
'backdrop-sepia': [sepia]
}],
// Tables
/**
* Border Collapse
* @see https://tailwindcss.com/docs/border-collapse
*/
'border-collapse': [{
border: ['collapse', 'separate']
}],
/**
* Border Spacing
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing': [{
'border-spacing': [borderSpacing]
}],
/**
* Border Spacing X
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing-x': [{
'border-spacing-x': [borderSpacing]
}],
/**
* Border Spacing Y
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing-y': [{
'border-spacing-y': [borderSpacing]
}],
/**
* Table Layout
* @see https://tailwindcss.com/docs/table-layout
*/
'table-layout': [{
table: ['auto', 'fixed']
}],
/**
* Caption Side
* @see https://tailwindcss.com/docs/caption-side
*/
caption: [{
caption: ['top', 'bottom']
}],
// Transitions and Animation
/**
* Tranisition Property
* @see https://tailwindcss.com/docs/transition-property
*/
transition: [{
transition: ['none', 'all', '', 'colors', 'opacity', 'shadow', 'transform', isArbitraryValue]
}],
/**
* Transition Duration
* @see https://tailwindcss.com/docs/transition-duration
*/
duration: [{
duration: getNumberAndArbitrary()
}],
/**
* Transition Timing Function
* @see https://tailwindcss.com/docs/transition-timing-function
*/
ease: [{
ease: ['linear', 'in', 'out', 'in-out', isArbitraryValue]
}],
/**
* Transition Delay
* @see https://tailwindcss.com/docs/transition-delay
*/
delay: [{
delay: getNumberAndArbitrary()
}],
/**
* Animation
* @see https://tailwindcss.com/docs/animation
*/
animate: [{
animate: ['none', 'spin', 'ping', 'pulse', 'bounce', isArbitraryValue]
}],
// Transforms
/**
* Transform
* @see https://tailwindcss.com/docs/transform
*/
transform: [{
transform: ['', 'gpu', 'none']
}],
/**
* Scale
* @see https://tailwindcss.com/docs/scale
*/
scale: [{
scale: [scale]
}],
/**
* Scale X
* @see https://tailwindcss.com/docs/scale
*/
'scale-x': [{
'scale-x': [scale]
}],
/**
* Scale Y
* @see https://tailwindcss.com/docs/scale
*/
'scale-y': [{
'scale-y': [scale]
}],
/**
* Rotate
* @see https://tailwindcss.com/docs/rotate
*/
rotate: [{
rotate: [isInteger, isArbitraryValue]
}],
/**
* Translate X
* @see https://tailwindcss.com/docs/translate
*/
'translate-x': [{
'translate-x': [translate]
}],
/**
* Translate Y
* @see https://tailwindcss.com/docs/translate
*/
'translate-y': [{
'translate-y': [translate]
}],
/**
* Skew X
* @see https://tailwindcss.com/docs/skew
*/
'skew-x': [{
'skew-x': [skew]
}],
/**
* Skew Y
* @see https://tailwindcss.com/docs/skew
*/
'skew-y': [{
'skew-y': [skew]
}],
/**
* Transform Origin
* @see https://tailwindcss.com/docs/transform-origin
*/
'transform-origin': [{
origin: ['center', 'top', 'top-right', 'right', 'bottom-right', 'bottom', 'bottom-left', 'left', 'top-left', isArbitraryValue]
}],
// Interactivity
/**
* Accent Color
* @see https://tailwindcss.com/docs/accent-color
*/
accent: [{
accent: ['auto', colors]
}],
/**
* Appearance
* @see https://tailwindcss.com/docs/appearance
*/
appearance: [{
appearance: ['none', 'auto']
}],
/**
* Cursor
* @see https://tailwindcss.com/docs/cursor
*/
cursor: [{
cursor: ['auto', 'default', 'pointer', 'wait', 'text', 'move', 'help', 'not-allowed', 'none', 'context-menu', 'progress', 'cell', 'crosshair', 'vertical-text', 'alias', 'copy', 'no-drop', 'grab', 'grabbing', 'all-scroll', 'col-resize', 'row-resize', 'n-resize', 'e-resize', 's-resize', 'w-resize', 'ne-resize', 'nw-resize', 'se-resize', 'sw-resize', 'ew-resize', 'ns-resize', 'nesw-resize', 'nwse-resize', 'zoom-in', 'zoom-out', isArbitraryValue]
}],
/**
* Caret Color
* @see https://tailwindcss.com/docs/just-in-time-mode#caret-color-utilities
*/
'caret-color': [{
caret: [colors]
}],
/**
* Pointer Events
* @see https://tailwindcss.com/docs/pointer-events
*/
'pointer-events': [{
'pointer-events': ['none', 'auto']
}],
/**
* Resize
* @see https://tailwindcss.com/docs/resize
*/
resize: [{
resize: ['none', 'y', 'x', '']
}],
/**
* Scroll Behavior
* @see https://tailwindcss.com/docs/scroll-behavior
*/
'scroll-behavior': [{
scroll: ['auto', 'smooth']
}],
/**
* Scroll Margin
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-m': [{
'scroll-m': getSpacingWithArbitrary()
}],
/**
* Scroll Margin X
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mx': [{
'scroll-mx': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Y
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-my': [{
'scroll-my': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Start
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-ms': [{
'scroll-ms': getSpacingWithArbitrary()
}],
/**
* Scroll Margin End
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-me': [{
'scroll-me': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Top
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mt': [{
'scroll-mt': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Right
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mr': [{
'scroll-mr': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Bottom
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mb': [{
'scroll-mb': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Left
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-ml': [{
'scroll-ml': getSpacingWithArbitrary()
}],
/**
* Scroll Padding
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-p': [{
'scroll-p': getSpacingWithArbitrary()
}],
/**
* Scroll Padding X
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-px': [{
'scroll-px': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Y
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-py': [{
'scroll-py': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Start
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-ps': [{
'scroll-ps': getSpacingWithArbitrary()
}],
/**
* Scroll Padding End
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pe': [{
'scroll-pe': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Top
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pt': [{
'scroll-pt': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Right
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pr': [{
'scroll-pr': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Bottom
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pb': [{
'scroll-pb': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Left
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pl': [{
'scroll-pl': getSpacingWithArbitrary()
}],
/**
* Scroll Snap Align
* @see https://tailwindcss.com/docs/scroll-snap-align
*/
'snap-align': [{
snap: ['start', 'end', 'center', 'align-none']
}],
/**
* Scroll Snap Stop
* @see https://tailwindcss.com/docs/scroll-snap-stop
*/
'snap-stop': [{
snap: ['normal', 'always']
}],
/**
* Scroll Snap Type
* @see https://tailwindcss.com/docs/scroll-snap-type
*/
'snap-type': [{
snap: ['none', 'x', 'y', 'both']
}],
/**
* Scroll Snap Type Strictness
* @see https://tailwindcss.com/docs/scroll-snap-type
*/
'snap-strictness': [{
snap: ['mandatory', 'proximity']
}],
/**
* Touch Action
* @see https://tailwindcss.com/docs/touch-action
*/
touch: [{
touch: ['auto', 'none', 'manipulation']
}],
/**
* Touch Action X
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-x': [{
'touch-pan': ['x', 'left', 'right']
}],
/**
* Touch Action Y
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-y': [{
'touch-pan': ['y', 'up', 'down']
}],
/**
* Touch Action Pinch Zoom
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-pz': ['touch-pinch-zoom'],
/**
* User Select
* @see https://tailwindcss.com/docs/user-select
*/
select: [{
select: ['none', 'text', 'all', 'auto']
}],
/**
* Will Change
* @see https://tailwindcss.com/docs/will-change
*/
'will-change': [{
'will-change': ['auto', 'scroll', 'contents', 'transform', isArbitraryValue]
}],
// SVG
/**
* Fill
* @see https://tailwindcss.com/docs/fill
*/
fill: [{
fill: [colors, 'none']
}],
/**
* Stroke Width
* @see https://tailwindcss.com/docs/stroke-width
*/
'stroke-w': [{
stroke: [isLength, isArbitraryLength, isArbitraryNumber]
}],
/**
* Stroke
* @see https://tailwindcss.com/docs/stroke
*/
stroke: [{
stroke: [colors, 'none']
}],
// Accessibility
/**
* Screen Readers
* @see https://tailwindcss.com/docs/screen-readers
*/
sr: ['sr-only', 'not-sr-only'],
/**
* Forced Color Adjust
* @see https://tailwindcss.com/docs/forced-color-adjust
*/
'forced-color-adjust': [{
'forced-color-adjust': ['auto', 'none']
}]
},
conflictingClassGroups: {
overflow: ['overflow-x', 'overflow-y'],
overscroll: ['overscroll-x', 'overscroll-y'],
inset: ['inset-x', 'inset-y', 'start', 'end', 'top', 'right', 'bottom', 'left'],
'inset-x': ['right', 'left'],
'inset-y': ['top', 'bottom'],
flex: ['basis', 'grow', 'shrink'],
gap: ['gap-x', 'gap-y'],
p: ['px', 'py', 'ps', 'pe', 'pt', 'pr', 'pb', 'pl'],
px: ['pr', 'pl'],
py: ['pt', 'pb'],
m: ['mx', 'my', 'ms', 'me', 'mt', 'mr', 'mb', 'ml'],
mx: ['mr', 'ml'],
my: ['mt', 'mb'],
size: ['w', 'h'],
'font-size': ['leading'],
'fvn-normal': ['fvn-ordinal', 'fvn-slashed-zero', 'fvn-figure', 'fvn-spacing', 'fvn-fraction'],
'fvn-ordinal': ['fvn-normal'],
'fvn-slashed-zero': ['fvn-normal'],
'fvn-figure': ['fvn-normal'],
'fvn-spacing': ['fvn-normal'],
'fvn-fraction': ['fvn-normal'],
'line-clamp': ['display', 'overflow'],
rounded: ['rounded-s', 'rounded-e', 'rounded-t', 'rounded-r', 'rounded-b', 'rounded-l', 'rounded-ss', 'rounded-se', 'rounded-ee', 'rounded-es', 'rounded-tl', 'rounded-tr', 'rounded-br', 'rounded-bl'],
'rounded-s': ['rounded-ss', 'rounded-es'],
'rounded-e': ['rounded-se', 'rounded-ee'],
'rounded-t': ['rounded-tl', 'rounded-tr'],
'rounded-r': ['rounded-tr', 'rounded-br'],
'rounded-b': ['rounded-br', 'rounded-bl'],
'rounded-l': ['rounded-tl', 'rounded-bl'],
'border-spacing': ['border-spacing-x', 'border-spacing-y'],
'border-w': ['border-w-s', 'border-w-e', 'border-w-t', 'border-w-r', 'border-w-b', 'border-w-l'],
'border-w-x': ['border-w-r', 'border-w-l'],
'border-w-y': ['border-w-t', 'border-w-b'],
'border-color': ['border-color-s', 'border-color-e', 'border-color-t', 'border-color-r', 'border-color-b', 'border-color-l'],
'border-color-x': ['border-color-r', 'border-color-l'],
'border-color-y': ['border-color-t', 'border-color-b'],
'scroll-m': ['scroll-mx', 'scroll-my', 'scroll-ms', 'scroll-me', 'scroll-mt', 'scroll-mr', 'scroll-mb', 'scroll-ml'],
'scroll-mx': ['scroll-mr', 'scroll-ml'],
'scroll-my': ['scroll-mt', 'scroll-mb'],
'scroll-p': ['scroll-px', 'scroll-py', 'scroll-ps', 'scroll-pe', 'scroll-pt', 'scroll-pr', 'scroll-pb', 'scroll-pl'],
'scroll-px': ['scroll-pr', 'scroll-pl'],
'scroll-py': ['scroll-pt', 'scroll-pb'],
touch: ['touch-x', 'touch-y', 'touch-pz'],
'touch-x': ['touch'],
'touch-y': ['touch'],
'touch-pz': ['touch']
},
conflictingClassGroupModifiers: {
'font-size': ['leading']
}
};
};
/**
* @param baseConfig Config where other config will be merged into. This object will be mutated.
* @param configExtension Partial config to merge into the `baseConfig`.
*/
const mergeConfigs = (baseConfig, {
cacheSize,
prefix,
separator,
experimentalParseClassName,
extend = {},
override = {}
}) => {
overrideProperty(baseConfig, 'cacheSize', cacheSize);
overrideProperty(baseConfig, 'prefix', prefix);
overrideProperty(baseConfig, 'separator', separator);
overrideProperty(baseConfig, 'experimentalParseClassName', experimentalParseClassName);
for (const configKey in override) {
overrideConfigProperties(baseConfig[configKey], override[configKey]);
}
for (const key in extend) {
mergeConfigProperties(baseConfig[key], extend[key]);
}
return baseConfig;
};
const overrideProperty = (baseObject, overrideKey, overrideValue) => {
if (overrideValue !== undefined) {
baseObject[overrideKey] = overrideValue;
}
};
const overrideConfigProperties = (baseObject, overrideObject) => {
if (overrideObject) {
for (const key in overrideObject) {
overrideProperty(baseObject, key, overrideObject[key]);
}
}
};
const mergeConfigProperties = (baseObject, mergeObject) => {
if (mergeObject) {
for (const key in mergeObject) {
const mergeValue = mergeObject[key];
if (mergeValue !== undefined) {
baseObject[key] = (baseObject[key] || []).concat(mergeValue);
}
}
}
};
const extendTailwindMerge = (configExtension, ...createConfig) => typeof configExtension === 'function' ? createTailwindMerge(getDefaultConfig, configExtension, ...createConfig) : createTailwindMerge(() => mergeConfigs(getDefaultConfig(), configExtension), ...createConfig);
const twMerge = /*#__PURE__*/createTailwindMerge(getDefaultConfig);
export { createTailwindMerge, extendTailwindMerge, fromTheme, getDefaultConfig, mergeConfigs, twJoin, twMerge, validators };
//# sourceMappingURL=bundle-mjs.mjs.map
File diff suppressed because one or more lines are too long
+2658
View File
@@ -0,0 +1,2658 @@
'use strict';
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
Object.defineProperty(exports, Symbol.toStringTag, {
value: 'Module'
});
var CLASS_PART_SEPARATOR = '-';
var createClassGroupUtils = function createClassGroupUtils(config) {
var classMap = createClassMap(config);
var conflictingClassGroups = config.conflictingClassGroups,
conflictingClassGroupModifiers = config.conflictingClassGroupModifiers;
var getClassGroupId = function getClassGroupId(className) {
var classParts = className.split(CLASS_PART_SEPARATOR);
// Classes like `-inset-1` produce an empty string as first classPart. We assume that classes for negative values are used correctly and remove it from classParts.
if (classParts[0] === '' && classParts.length !== 1) {
classParts.shift();
}
return _getGroupRecursive(classParts, classMap) || getGroupIdForArbitraryProperty(className);
};
var getConflictingClassGroupIds = function getConflictingClassGroupIds(classGroupId, hasPostfixModifier) {
var conflicts = conflictingClassGroups[classGroupId] || [];
if (hasPostfixModifier && conflictingClassGroupModifiers[classGroupId]) {
return [].concat(conflicts, conflictingClassGroupModifiers[classGroupId]);
}
return conflicts;
};
return {
getClassGroupId: getClassGroupId,
getConflictingClassGroupIds: getConflictingClassGroupIds
};
};
var _getGroupRecursive = function getGroupRecursive(classParts, classPartObject) {
var _classPartObject$vali;
if (classParts.length === 0) {
return classPartObject.classGroupId;
}
var currentClassPart = classParts[0];
var nextClassPartObject = classPartObject.nextPart.get(currentClassPart);
var classGroupFromNextClassPart = nextClassPartObject ? _getGroupRecursive(classParts.slice(1), nextClassPartObject) : undefined;
if (classGroupFromNextClassPart) {
return classGroupFromNextClassPart;
}
if (classPartObject.validators.length === 0) {
return undefined;
}
var classRest = classParts.join(CLASS_PART_SEPARATOR);
return (_classPartObject$vali = classPartObject.validators.find(function (_ref) {
var validator = _ref.validator;
return validator(classRest);
})) == null ? void 0 : _classPartObject$vali.classGroupId;
};
var arbitraryPropertyRegex = /^\[(.+)\]$/;
var getGroupIdForArbitraryProperty = function getGroupIdForArbitraryProperty(className) {
if (arbitraryPropertyRegex.test(className)) {
var arbitraryPropertyClassName = arbitraryPropertyRegex.exec(className)[1];
var property = arbitraryPropertyClassName == null ? void 0 : arbitraryPropertyClassName.substring(0, arbitraryPropertyClassName.indexOf(':'));
if (property) {
// I use two dots here because one dot is used as prefix for class groups in plugins
return 'arbitrary..' + property;
}
}
};
/**
* Exported for testing only
*/
var createClassMap = function createClassMap(config) {
var theme = config.theme,
prefix = config.prefix;
var classMap = {
nextPart: new Map(),
validators: []
};
var prefixedClassGroupEntries = getPrefixedClassGroupEntries(Object.entries(config.classGroups), prefix);
prefixedClassGroupEntries.forEach(function (_ref2) {
var classGroupId = _ref2[0],
classGroup = _ref2[1];
_processClassesRecursively(classGroup, classMap, classGroupId, theme);
});
return classMap;
};
var _processClassesRecursively = function processClassesRecursively(classGroup, classPartObject, classGroupId, theme) {
classGroup.forEach(function (classDefinition) {
if (typeof classDefinition === 'string') {
var classPartObjectToEdit = classDefinition === '' ? classPartObject : getPart(classPartObject, classDefinition);
classPartObjectToEdit.classGroupId = classGroupId;
return;
}
if (typeof classDefinition === 'function') {
if (isThemeGetter(classDefinition)) {
_processClassesRecursively(classDefinition(theme), classPartObject, classGroupId, theme);
return;
}
classPartObject.validators.push({
validator: classDefinition,
classGroupId: classGroupId
});
return;
}
Object.entries(classDefinition).forEach(function (_ref3) {
var key = _ref3[0],
classGroup = _ref3[1];
_processClassesRecursively(classGroup, getPart(classPartObject, key), classGroupId, theme);
});
});
};
var getPart = function getPart(classPartObject, path) {
var currentClassPartObject = classPartObject;
path.split(CLASS_PART_SEPARATOR).forEach(function (pathPart) {
if (!currentClassPartObject.nextPart.has(pathPart)) {
currentClassPartObject.nextPart.set(pathPart, {
nextPart: new Map(),
validators: []
});
}
currentClassPartObject = currentClassPartObject.nextPart.get(pathPart);
});
return currentClassPartObject;
};
var isThemeGetter = function isThemeGetter(func) {
return func.isThemeGetter;
};
var getPrefixedClassGroupEntries = function getPrefixedClassGroupEntries(classGroupEntries, prefix) {
if (!prefix) {
return classGroupEntries;
}
return classGroupEntries.map(function (_ref4) {
var classGroupId = _ref4[0],
classGroup = _ref4[1];
var prefixedClassGroup = classGroup.map(function (classDefinition) {
if (typeof classDefinition === 'string') {
return prefix + classDefinition;
}
if (typeof classDefinition === 'object') {
return Object.fromEntries(Object.entries(classDefinition).map(function (_ref5) {
var key = _ref5[0],
value = _ref5[1];
return [prefix + key, value];
}));
}
return classDefinition;
});
return [classGroupId, prefixedClassGroup];
});
};
// LRU cache inspired from hashlru (https://github.com/dominictarr/hashlru/blob/v1.0.4/index.js) but object replaced with Map to improve performance
var createLruCache = function createLruCache(maxCacheSize) {
if (maxCacheSize < 1) {
return {
get: function get() {
return undefined;
},
set: function set() {}
};
}
var cacheSize = 0;
var cache = new Map();
var previousCache = new Map();
var update = function update(key, value) {
cache.set(key, value);
cacheSize++;
if (cacheSize > maxCacheSize) {
cacheSize = 0;
previousCache = cache;
cache = new Map();
}
};
return {
get: function get(key) {
var value = cache.get(key);
if (value !== undefined) {
return value;
}
if ((value = previousCache.get(key)) !== undefined) {
update(key, value);
return value;
}
},
set: function set(key, value) {
if (cache.has(key)) {
cache.set(key, value);
} else {
update(key, value);
}
}
};
};
var IMPORTANT_MODIFIER = '!';
var createParseClassName = function createParseClassName(config) {
var separator = config.separator,
experimentalParseClassName = config.experimentalParseClassName;
var isSeparatorSingleCharacter = separator.length === 1;
var firstSeparatorCharacter = separator[0];
var separatorLength = separator.length;
// parseClassName inspired by https://github.com/tailwindlabs/tailwindcss/blob/v3.2.2/src/util/splitAtTopLevelOnly.js
var parseClassName = function parseClassName(className) {
var modifiers = [];
var bracketDepth = 0;
var modifierStart = 0;
var postfixModifierPosition;
for (var index = 0; index < className.length; index++) {
var currentCharacter = className[index];
if (bracketDepth === 0) {
if (currentCharacter === firstSeparatorCharacter && (isSeparatorSingleCharacter || className.slice(index, index + separatorLength) === separator)) {
modifiers.push(className.slice(modifierStart, index));
modifierStart = index + separatorLength;
continue;
}
if (currentCharacter === '/') {
postfixModifierPosition = index;
continue;
}
}
if (currentCharacter === '[') {
bracketDepth++;
} else if (currentCharacter === ']') {
bracketDepth--;
}
}
var baseClassNameWithImportantModifier = modifiers.length === 0 ? className : className.substring(modifierStart);
var hasImportantModifier = baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER);
var baseClassName = hasImportantModifier ? baseClassNameWithImportantModifier.substring(1) : baseClassNameWithImportantModifier;
var maybePostfixModifierPosition = postfixModifierPosition && postfixModifierPosition > modifierStart ? postfixModifierPosition - modifierStart : undefined;
return {
modifiers: modifiers,
hasImportantModifier: hasImportantModifier,
baseClassName: baseClassName,
maybePostfixModifierPosition: maybePostfixModifierPosition
};
};
if (experimentalParseClassName) {
return function (className) {
return experimentalParseClassName({
className: className,
parseClassName: parseClassName
});
};
}
return parseClassName;
};
/**
* Sorts modifiers according to following schema:
* - Predefined modifiers are sorted alphabetically
* - When an arbitrary variant appears, it must be preserved which modifiers are before and after it
*/
var sortModifiers = function sortModifiers(modifiers) {
if (modifiers.length <= 1) {
return modifiers;
}
var sortedModifiers = [];
var unsortedModifiers = [];
modifiers.forEach(function (modifier) {
var isArbitraryVariant = modifier[0] === '[';
if (isArbitraryVariant) {
sortedModifiers.push.apply(sortedModifiers, unsortedModifiers.sort().concat([modifier]));
unsortedModifiers = [];
} else {
unsortedModifiers.push(modifier);
}
});
sortedModifiers.push.apply(sortedModifiers, unsortedModifiers.sort());
return sortedModifiers;
};
var createConfigUtils = function createConfigUtils(config) {
return _extends({
cache: createLruCache(config.cacheSize),
parseClassName: createParseClassName(config)
}, createClassGroupUtils(config));
};
var SPLIT_CLASSES_REGEX = /\s+/;
var mergeClassList = function mergeClassList(classList, configUtils) {
var parseClassName = configUtils.parseClassName,
getClassGroupId = configUtils.getClassGroupId,
getConflictingClassGroupIds = configUtils.getConflictingClassGroupIds;
/**
* Set of classGroupIds in following format:
* `{importantModifier}{variantModifiers}{classGroupId}`
* @example 'float'
* @example 'hover:focus:bg-color'
* @example 'md:!pr'
*/
var classGroupsInConflict = [];
var classNames = classList.trim().split(SPLIT_CLASSES_REGEX);
var result = '';
for (var index = classNames.length - 1; index >= 0; index -= 1) {
var originalClassName = classNames[index];
var _parseClassName = parseClassName(originalClassName),
modifiers = _parseClassName.modifiers,
hasImportantModifier = _parseClassName.hasImportantModifier,
baseClassName = _parseClassName.baseClassName,
maybePostfixModifierPosition = _parseClassName.maybePostfixModifierPosition;
var hasPostfixModifier = Boolean(maybePostfixModifierPosition);
var classGroupId = getClassGroupId(hasPostfixModifier ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
if (!classGroupId) {
if (!hasPostfixModifier) {
// Not a Tailwind class
result = originalClassName + (result.length > 0 ? ' ' + result : result);
continue;
}
classGroupId = getClassGroupId(baseClassName);
if (!classGroupId) {
// Not a Tailwind class
result = originalClassName + (result.length > 0 ? ' ' + result : result);
continue;
}
hasPostfixModifier = false;
}
var variantModifier = sortModifiers(modifiers).join(':');
var modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier;
var classId = modifierId + classGroupId;
if (classGroupsInConflict.includes(classId)) {
// Tailwind class omitted due to conflict
continue;
}
classGroupsInConflict.push(classId);
var conflictGroups = getConflictingClassGroupIds(classGroupId, hasPostfixModifier);
for (var i = 0; i < conflictGroups.length; ++i) {
var group = conflictGroups[i];
classGroupsInConflict.push(modifierId + group);
}
// Tailwind class not in conflict
result = originalClassName + (result.length > 0 ? ' ' + result : result);
}
return result;
};
/**
* The code in this file is copied from https://github.com/lukeed/clsx and modified to suit the needs of tailwind-merge better.
*
* Specifically:
* - Runtime code from https://github.com/lukeed/clsx/blob/v1.2.1/src/index.js
* - TypeScript types from https://github.com/lukeed/clsx/blob/v1.2.1/clsx.d.ts
*
* Original code has MIT license: Copyright (c) Luke Edwards <luke.edwards05@gmail.com> (lukeed.com)
*/
function twJoin() {
var index = 0;
var argument;
var resolvedValue;
var string = '';
while (index < arguments.length) {
if (argument = arguments[index++]) {
if (resolvedValue = _toValue(argument)) {
string && (string += ' ');
string += resolvedValue;
}
}
}
return string;
}
var _toValue = function toValue(mix) {
if (typeof mix === 'string') {
return mix;
}
var resolvedValue;
var string = '';
for (var k = 0; k < mix.length; k++) {
if (mix[k]) {
if (resolvedValue = _toValue(mix[k])) {
string && (string += ' ');
string += resolvedValue;
}
}
}
return string;
};
function createTailwindMerge(createConfigFirst) {
for (var _len = arguments.length, createConfigRest = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
createConfigRest[_key - 1] = arguments[_key];
}
var configUtils;
var cacheGet;
var cacheSet;
var functionToCall = initTailwindMerge;
function initTailwindMerge(classList) {
var config = createConfigRest.reduce(function (previousConfig, createConfigCurrent) {
return createConfigCurrent(previousConfig);
}, createConfigFirst());
configUtils = createConfigUtils(config);
cacheGet = configUtils.cache.get;
cacheSet = configUtils.cache.set;
functionToCall = tailwindMerge;
return tailwindMerge(classList);
}
function tailwindMerge(classList) {
var cachedResult = cacheGet(classList);
if (cachedResult) {
return cachedResult;
}
var result = mergeClassList(classList, configUtils);
cacheSet(classList, result);
return result;
}
return function callTailwindMerge() {
return functionToCall(twJoin.apply(null, arguments));
};
}
var fromTheme = function fromTheme(key) {
var themeGetter = function themeGetter(theme) {
return theme[key] || [];
};
themeGetter.isThemeGetter = true;
return themeGetter;
};
var arbitraryValueRegex = /^\[(?:([a-z-]+):)?(.+)\]$/i;
var fractionRegex = /^\d+\/\d+$/;
var stringLengths = /*#__PURE__*/new Set(['px', 'full', 'screen']);
var tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
var lengthUnitRegex = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/;
var colorFunctionRegex = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/;
// Shadow always begins with x and y offset separated by underscore optionally prepended by inset
var shadowRegex = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
var imageRegex = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/;
var isLength = function isLength(value) {
return isNumber(value) || stringLengths.has(value) || fractionRegex.test(value);
};
var isArbitraryLength = function isArbitraryLength(value) {
return getIsArbitraryValue(value, 'length', isLengthOnly);
};
var isNumber = function isNumber(value) {
return Boolean(value) && !Number.isNaN(Number(value));
};
var isArbitraryNumber = function isArbitraryNumber(value) {
return getIsArbitraryValue(value, 'number', isNumber);
};
var isInteger = function isInteger(value) {
return Boolean(value) && Number.isInteger(Number(value));
};
var isPercent = function isPercent(value) {
return value.endsWith('%') && isNumber(value.slice(0, -1));
};
var isArbitraryValue = function isArbitraryValue(value) {
return arbitraryValueRegex.test(value);
};
var isTshirtSize = function isTshirtSize(value) {
return tshirtUnitRegex.test(value);
};
var sizeLabels = /*#__PURE__*/new Set(['length', 'size', 'percentage']);
var isArbitrarySize = function isArbitrarySize(value) {
return getIsArbitraryValue(value, sizeLabels, isNever);
};
var isArbitraryPosition = function isArbitraryPosition(value) {
return getIsArbitraryValue(value, 'position', isNever);
};
var imageLabels = /*#__PURE__*/new Set(['image', 'url']);
var isArbitraryImage = function isArbitraryImage(value) {
return getIsArbitraryValue(value, imageLabels, isImage);
};
var isArbitraryShadow = function isArbitraryShadow(value) {
return getIsArbitraryValue(value, '', isShadow);
};
var isAny = function isAny() {
return true;
};
var getIsArbitraryValue = function getIsArbitraryValue(value, label, testValue) {
var result = arbitraryValueRegex.exec(value);
if (result) {
if (result[1]) {
return typeof label === 'string' ? result[1] === label : label.has(result[1]);
}
return testValue(result[2]);
}
return false;
};
var isLengthOnly = function isLengthOnly(value) {
return (
// `colorFunctionRegex` check is necessary because color functions can have percentages in them which which would be incorrectly classified as lengths.
// For example, `hsl(0 0% 0%)` would be classified as a length without this check.
// I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
lengthUnitRegex.test(value) && !colorFunctionRegex.test(value)
);
};
var isNever = function isNever() {
return false;
};
var isShadow = function isShadow(value) {
return shadowRegex.test(value);
};
var isImage = function isImage(value) {
return imageRegex.test(value);
};
var validators = /*#__PURE__*/Object.defineProperty({
__proto__: null,
isAny: isAny,
isArbitraryImage: isArbitraryImage,
isArbitraryLength: isArbitraryLength,
isArbitraryNumber: isArbitraryNumber,
isArbitraryPosition: isArbitraryPosition,
isArbitraryShadow: isArbitraryShadow,
isArbitrarySize: isArbitrarySize,
isArbitraryValue: isArbitraryValue,
isInteger: isInteger,
isLength: isLength,
isNumber: isNumber,
isPercent: isPercent,
isTshirtSize: isTshirtSize
}, Symbol.toStringTag, {
value: 'Module'
});
var getDefaultConfig = function getDefaultConfig() {
var colors = fromTheme('colors');
var spacing = fromTheme('spacing');
var blur = fromTheme('blur');
var brightness = fromTheme('brightness');
var borderColor = fromTheme('borderColor');
var borderRadius = fromTheme('borderRadius');
var borderSpacing = fromTheme('borderSpacing');
var borderWidth = fromTheme('borderWidth');
var contrast = fromTheme('contrast');
var grayscale = fromTheme('grayscale');
var hueRotate = fromTheme('hueRotate');
var invert = fromTheme('invert');
var gap = fromTheme('gap');
var gradientColorStops = fromTheme('gradientColorStops');
var gradientColorStopPositions = fromTheme('gradientColorStopPositions');
var inset = fromTheme('inset');
var margin = fromTheme('margin');
var opacity = fromTheme('opacity');
var padding = fromTheme('padding');
var saturate = fromTheme('saturate');
var scale = fromTheme('scale');
var sepia = fromTheme('sepia');
var skew = fromTheme('skew');
var space = fromTheme('space');
var translate = fromTheme('translate');
var getOverscroll = function getOverscroll() {
return ['auto', 'contain', 'none'];
};
var getOverflow = function getOverflow() {
return ['auto', 'hidden', 'clip', 'visible', 'scroll'];
};
var getSpacingWithAutoAndArbitrary = function getSpacingWithAutoAndArbitrary() {
return ['auto', isArbitraryValue, spacing];
};
var getSpacingWithArbitrary = function getSpacingWithArbitrary() {
return [isArbitraryValue, spacing];
};
var getLengthWithEmptyAndArbitrary = function getLengthWithEmptyAndArbitrary() {
return ['', isLength, isArbitraryLength];
};
var getNumberWithAutoAndArbitrary = function getNumberWithAutoAndArbitrary() {
return ['auto', isNumber, isArbitraryValue];
};
var getPositions = function getPositions() {
return ['bottom', 'center', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top', 'top'];
};
var getLineStyles = function getLineStyles() {
return ['solid', 'dashed', 'dotted', 'double', 'none'];
};
var getBlendModes = function getBlendModes() {
return ['normal', 'multiply', 'screen', 'overlay', 'darken', 'lighten', 'color-dodge', 'color-burn', 'hard-light', 'soft-light', 'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity'];
};
var getAlign = function getAlign() {
return ['start', 'end', 'center', 'between', 'around', 'evenly', 'stretch'];
};
var getZeroAndEmpty = function getZeroAndEmpty() {
return ['', '0', isArbitraryValue];
};
var getBreaks = function getBreaks() {
return ['auto', 'avoid', 'all', 'avoid-page', 'page', 'left', 'right', 'column'];
};
var getNumberAndArbitrary = function getNumberAndArbitrary() {
return [isNumber, isArbitraryValue];
};
return {
cacheSize: 500,
separator: ':',
theme: {
colors: [isAny],
spacing: [isLength, isArbitraryLength],
blur: ['none', '', isTshirtSize, isArbitraryValue],
brightness: getNumberAndArbitrary(),
borderColor: [colors],
borderRadius: ['none', '', 'full', isTshirtSize, isArbitraryValue],
borderSpacing: getSpacingWithArbitrary(),
borderWidth: getLengthWithEmptyAndArbitrary(),
contrast: getNumberAndArbitrary(),
grayscale: getZeroAndEmpty(),
hueRotate: getNumberAndArbitrary(),
invert: getZeroAndEmpty(),
gap: getSpacingWithArbitrary(),
gradientColorStops: [colors],
gradientColorStopPositions: [isPercent, isArbitraryLength],
inset: getSpacingWithAutoAndArbitrary(),
margin: getSpacingWithAutoAndArbitrary(),
opacity: getNumberAndArbitrary(),
padding: getSpacingWithArbitrary(),
saturate: getNumberAndArbitrary(),
scale: getNumberAndArbitrary(),
sepia: getZeroAndEmpty(),
skew: getNumberAndArbitrary(),
space: getSpacingWithArbitrary(),
translate: getSpacingWithArbitrary()
},
classGroups: {
// Layout
/**
* Aspect Ratio
* @see https://tailwindcss.com/docs/aspect-ratio
*/
aspect: [{
aspect: ['auto', 'square', 'video', isArbitraryValue]
}],
/**
* Container
* @see https://tailwindcss.com/docs/container
*/
container: ['container'],
/**
* Columns
* @see https://tailwindcss.com/docs/columns
*/
columns: [{
columns: [isTshirtSize]
}],
/**
* Break After
* @see https://tailwindcss.com/docs/break-after
*/
'break-after': [{
'break-after': getBreaks()
}],
/**
* Break Before
* @see https://tailwindcss.com/docs/break-before
*/
'break-before': [{
'break-before': getBreaks()
}],
/**
* Break Inside
* @see https://tailwindcss.com/docs/break-inside
*/
'break-inside': [{
'break-inside': ['auto', 'avoid', 'avoid-page', 'avoid-column']
}],
/**
* Box Decoration Break
* @see https://tailwindcss.com/docs/box-decoration-break
*/
'box-decoration': [{
'box-decoration': ['slice', 'clone']
}],
/**
* Box Sizing
* @see https://tailwindcss.com/docs/box-sizing
*/
box: [{
box: ['border', 'content']
}],
/**
* Display
* @see https://tailwindcss.com/docs/display
*/
display: ['block', 'inline-block', 'inline', 'flex', 'inline-flex', 'table', 'inline-table', 'table-caption', 'table-cell', 'table-column', 'table-column-group', 'table-footer-group', 'table-header-group', 'table-row-group', 'table-row', 'flow-root', 'grid', 'inline-grid', 'contents', 'list-item', 'hidden'],
/**
* Floats
* @see https://tailwindcss.com/docs/float
*/
"float": [{
"float": ['right', 'left', 'none', 'start', 'end']
}],
/**
* Clear
* @see https://tailwindcss.com/docs/clear
*/
clear: [{
clear: ['left', 'right', 'both', 'none', 'start', 'end']
}],
/**
* Isolation
* @see https://tailwindcss.com/docs/isolation
*/
isolation: ['isolate', 'isolation-auto'],
/**
* Object Fit
* @see https://tailwindcss.com/docs/object-fit
*/
'object-fit': [{
object: ['contain', 'cover', 'fill', 'none', 'scale-down']
}],
/**
* Object Position
* @see https://tailwindcss.com/docs/object-position
*/
'object-position': [{
object: [].concat(getPositions(), [isArbitraryValue])
}],
/**
* Overflow
* @see https://tailwindcss.com/docs/overflow
*/
overflow: [{
overflow: getOverflow()
}],
/**
* Overflow X
* @see https://tailwindcss.com/docs/overflow
*/
'overflow-x': [{
'overflow-x': getOverflow()
}],
/**
* Overflow Y
* @see https://tailwindcss.com/docs/overflow
*/
'overflow-y': [{
'overflow-y': getOverflow()
}],
/**
* Overscroll Behavior
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
overscroll: [{
overscroll: getOverscroll()
}],
/**
* Overscroll Behavior X
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
'overscroll-x': [{
'overscroll-x': getOverscroll()
}],
/**
* Overscroll Behavior Y
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
'overscroll-y': [{
'overscroll-y': getOverscroll()
}],
/**
* Position
* @see https://tailwindcss.com/docs/position
*/
position: ['static', 'fixed', 'absolute', 'relative', 'sticky'],
/**
* Top / Right / Bottom / Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
inset: [{
inset: [inset]
}],
/**
* Right / Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
'inset-x': [{
'inset-x': [inset]
}],
/**
* Top / Bottom
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
'inset-y': [{
'inset-y': [inset]
}],
/**
* Start
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
start: [{
start: [inset]
}],
/**
* End
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
end: [{
end: [inset]
}],
/**
* Top
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
top: [{
top: [inset]
}],
/**
* Right
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
right: [{
right: [inset]
}],
/**
* Bottom
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
bottom: [{
bottom: [inset]
}],
/**
* Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
left: [{
left: [inset]
}],
/**
* Visibility
* @see https://tailwindcss.com/docs/visibility
*/
visibility: ['visible', 'invisible', 'collapse'],
/**
* Z-Index
* @see https://tailwindcss.com/docs/z-index
*/
z: [{
z: ['auto', isInteger, isArbitraryValue]
}],
// Flexbox and Grid
/**
* Flex Basis
* @see https://tailwindcss.com/docs/flex-basis
*/
basis: [{
basis: getSpacingWithAutoAndArbitrary()
}],
/**
* Flex Direction
* @see https://tailwindcss.com/docs/flex-direction
*/
'flex-direction': [{
flex: ['row', 'row-reverse', 'col', 'col-reverse']
}],
/**
* Flex Wrap
* @see https://tailwindcss.com/docs/flex-wrap
*/
'flex-wrap': [{
flex: ['wrap', 'wrap-reverse', 'nowrap']
}],
/**
* Flex
* @see https://tailwindcss.com/docs/flex
*/
flex: [{
flex: ['1', 'auto', 'initial', 'none', isArbitraryValue]
}],
/**
* Flex Grow
* @see https://tailwindcss.com/docs/flex-grow
*/
grow: [{
grow: getZeroAndEmpty()
}],
/**
* Flex Shrink
* @see https://tailwindcss.com/docs/flex-shrink
*/
shrink: [{
shrink: getZeroAndEmpty()
}],
/**
* Order
* @see https://tailwindcss.com/docs/order
*/
order: [{
order: ['first', 'last', 'none', isInteger, isArbitraryValue]
}],
/**
* Grid Template Columns
* @see https://tailwindcss.com/docs/grid-template-columns
*/
'grid-cols': [{
'grid-cols': [isAny]
}],
/**
* Grid Column Start / End
* @see https://tailwindcss.com/docs/grid-column
*/
'col-start-end': [{
col: ['auto', {
span: ['full', isInteger, isArbitraryValue]
}, isArbitraryValue]
}],
/**
* Grid Column Start
* @see https://tailwindcss.com/docs/grid-column
*/
'col-start': [{
'col-start': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Column End
* @see https://tailwindcss.com/docs/grid-column
*/
'col-end': [{
'col-end': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Template Rows
* @see https://tailwindcss.com/docs/grid-template-rows
*/
'grid-rows': [{
'grid-rows': [isAny]
}],
/**
* Grid Row Start / End
* @see https://tailwindcss.com/docs/grid-row
*/
'row-start-end': [{
row: ['auto', {
span: [isInteger, isArbitraryValue]
}, isArbitraryValue]
}],
/**
* Grid Row Start
* @see https://tailwindcss.com/docs/grid-row
*/
'row-start': [{
'row-start': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Row End
* @see https://tailwindcss.com/docs/grid-row
*/
'row-end': [{
'row-end': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Auto Flow
* @see https://tailwindcss.com/docs/grid-auto-flow
*/
'grid-flow': [{
'grid-flow': ['row', 'col', 'dense', 'row-dense', 'col-dense']
}],
/**
* Grid Auto Columns
* @see https://tailwindcss.com/docs/grid-auto-columns
*/
'auto-cols': [{
'auto-cols': ['auto', 'min', 'max', 'fr', isArbitraryValue]
}],
/**
* Grid Auto Rows
* @see https://tailwindcss.com/docs/grid-auto-rows
*/
'auto-rows': [{
'auto-rows': ['auto', 'min', 'max', 'fr', isArbitraryValue]
}],
/**
* Gap
* @see https://tailwindcss.com/docs/gap
*/
gap: [{
gap: [gap]
}],
/**
* Gap X
* @see https://tailwindcss.com/docs/gap
*/
'gap-x': [{
'gap-x': [gap]
}],
/**
* Gap Y
* @see https://tailwindcss.com/docs/gap
*/
'gap-y': [{
'gap-y': [gap]
}],
/**
* Justify Content
* @see https://tailwindcss.com/docs/justify-content
*/
'justify-content': [{
justify: ['normal'].concat(getAlign())
}],
/**
* Justify Items
* @see https://tailwindcss.com/docs/justify-items
*/
'justify-items': [{
'justify-items': ['start', 'end', 'center', 'stretch']
}],
/**
* Justify Self
* @see https://tailwindcss.com/docs/justify-self
*/
'justify-self': [{
'justify-self': ['auto', 'start', 'end', 'center', 'stretch']
}],
/**
* Align Content
* @see https://tailwindcss.com/docs/align-content
*/
'align-content': [{
content: ['normal'].concat(getAlign(), ['baseline'])
}],
/**
* Align Items
* @see https://tailwindcss.com/docs/align-items
*/
'align-items': [{
items: ['start', 'end', 'center', 'baseline', 'stretch']
}],
/**
* Align Self
* @see https://tailwindcss.com/docs/align-self
*/
'align-self': [{
self: ['auto', 'start', 'end', 'center', 'stretch', 'baseline']
}],
/**
* Place Content
* @see https://tailwindcss.com/docs/place-content
*/
'place-content': [{
'place-content': [].concat(getAlign(), ['baseline'])
}],
/**
* Place Items
* @see https://tailwindcss.com/docs/place-items
*/
'place-items': [{
'place-items': ['start', 'end', 'center', 'baseline', 'stretch']
}],
/**
* Place Self
* @see https://tailwindcss.com/docs/place-self
*/
'place-self': [{
'place-self': ['auto', 'start', 'end', 'center', 'stretch']
}],
// Spacing
/**
* Padding
* @see https://tailwindcss.com/docs/padding
*/
p: [{
p: [padding]
}],
/**
* Padding X
* @see https://tailwindcss.com/docs/padding
*/
px: [{
px: [padding]
}],
/**
* Padding Y
* @see https://tailwindcss.com/docs/padding
*/
py: [{
py: [padding]
}],
/**
* Padding Start
* @see https://tailwindcss.com/docs/padding
*/
ps: [{
ps: [padding]
}],
/**
* Padding End
* @see https://tailwindcss.com/docs/padding
*/
pe: [{
pe: [padding]
}],
/**
* Padding Top
* @see https://tailwindcss.com/docs/padding
*/
pt: [{
pt: [padding]
}],
/**
* Padding Right
* @see https://tailwindcss.com/docs/padding
*/
pr: [{
pr: [padding]
}],
/**
* Padding Bottom
* @see https://tailwindcss.com/docs/padding
*/
pb: [{
pb: [padding]
}],
/**
* Padding Left
* @see https://tailwindcss.com/docs/padding
*/
pl: [{
pl: [padding]
}],
/**
* Margin
* @see https://tailwindcss.com/docs/margin
*/
m: [{
m: [margin]
}],
/**
* Margin X
* @see https://tailwindcss.com/docs/margin
*/
mx: [{
mx: [margin]
}],
/**
* Margin Y
* @see https://tailwindcss.com/docs/margin
*/
my: [{
my: [margin]
}],
/**
* Margin Start
* @see https://tailwindcss.com/docs/margin
*/
ms: [{
ms: [margin]
}],
/**
* Margin End
* @see https://tailwindcss.com/docs/margin
*/
me: [{
me: [margin]
}],
/**
* Margin Top
* @see https://tailwindcss.com/docs/margin
*/
mt: [{
mt: [margin]
}],
/**
* Margin Right
* @see https://tailwindcss.com/docs/margin
*/
mr: [{
mr: [margin]
}],
/**
* Margin Bottom
* @see https://tailwindcss.com/docs/margin
*/
mb: [{
mb: [margin]
}],
/**
* Margin Left
* @see https://tailwindcss.com/docs/margin
*/
ml: [{
ml: [margin]
}],
/**
* Space Between X
* @see https://tailwindcss.com/docs/space
*/
'space-x': [{
'space-x': [space]
}],
/**
* Space Between X Reverse
* @see https://tailwindcss.com/docs/space
*/
'space-x-reverse': ['space-x-reverse'],
/**
* Space Between Y
* @see https://tailwindcss.com/docs/space
*/
'space-y': [{
'space-y': [space]
}],
/**
* Space Between Y Reverse
* @see https://tailwindcss.com/docs/space
*/
'space-y-reverse': ['space-y-reverse'],
// Sizing
/**
* Width
* @see https://tailwindcss.com/docs/width
*/
w: [{
w: ['auto', 'min', 'max', 'fit', 'svw', 'lvw', 'dvw', isArbitraryValue, spacing]
}],
/**
* Min-Width
* @see https://tailwindcss.com/docs/min-width
*/
'min-w': [{
'min-w': [isArbitraryValue, spacing, 'min', 'max', 'fit']
}],
/**
* Max-Width
* @see https://tailwindcss.com/docs/max-width
*/
'max-w': [{
'max-w': [isArbitraryValue, spacing, 'none', 'full', 'min', 'max', 'fit', 'prose', {
screen: [isTshirtSize]
}, isTshirtSize]
}],
/**
* Height
* @see https://tailwindcss.com/docs/height
*/
h: [{
h: [isArbitraryValue, spacing, 'auto', 'min', 'max', 'fit', 'svh', 'lvh', 'dvh']
}],
/**
* Min-Height
* @see https://tailwindcss.com/docs/min-height
*/
'min-h': [{
'min-h': [isArbitraryValue, spacing, 'min', 'max', 'fit', 'svh', 'lvh', 'dvh']
}],
/**
* Max-Height
* @see https://tailwindcss.com/docs/max-height
*/
'max-h': [{
'max-h': [isArbitraryValue, spacing, 'min', 'max', 'fit', 'svh', 'lvh', 'dvh']
}],
/**
* Size
* @see https://tailwindcss.com/docs/size
*/
size: [{
size: [isArbitraryValue, spacing, 'auto', 'min', 'max', 'fit']
}],
// Typography
/**
* Font Size
* @see https://tailwindcss.com/docs/font-size
*/
'font-size': [{
text: ['base', isTshirtSize, isArbitraryLength]
}],
/**
* Font Smoothing
* @see https://tailwindcss.com/docs/font-smoothing
*/
'font-smoothing': ['antialiased', 'subpixel-antialiased'],
/**
* Font Style
* @see https://tailwindcss.com/docs/font-style
*/
'font-style': ['italic', 'not-italic'],
/**
* Font Weight
* @see https://tailwindcss.com/docs/font-weight
*/
'font-weight': [{
font: ['thin', 'extralight', 'light', 'normal', 'medium', 'semibold', 'bold', 'extrabold', 'black', isArbitraryNumber]
}],
/**
* Font Family
* @see https://tailwindcss.com/docs/font-family
*/
'font-family': [{
font: [isAny]
}],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-normal': ['normal-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-ordinal': ['ordinal'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-slashed-zero': ['slashed-zero'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-figure': ['lining-nums', 'oldstyle-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-spacing': ['proportional-nums', 'tabular-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-fraction': ['diagonal-fractions', 'stacked-fractions'],
/**
* Letter Spacing
* @see https://tailwindcss.com/docs/letter-spacing
*/
tracking: [{
tracking: ['tighter', 'tight', 'normal', 'wide', 'wider', 'widest', isArbitraryValue]
}],
/**
* Line Clamp
* @see https://tailwindcss.com/docs/line-clamp
*/
'line-clamp': [{
'line-clamp': ['none', isNumber, isArbitraryNumber]
}],
/**
* Line Height
* @see https://tailwindcss.com/docs/line-height
*/
leading: [{
leading: ['none', 'tight', 'snug', 'normal', 'relaxed', 'loose', isLength, isArbitraryValue]
}],
/**
* List Style Image
* @see https://tailwindcss.com/docs/list-style-image
*/
'list-image': [{
'list-image': ['none', isArbitraryValue]
}],
/**
* List Style Type
* @see https://tailwindcss.com/docs/list-style-type
*/
'list-style-type': [{
list: ['none', 'disc', 'decimal', isArbitraryValue]
}],
/**
* List Style Position
* @see https://tailwindcss.com/docs/list-style-position
*/
'list-style-position': [{
list: ['inside', 'outside']
}],
/**
* Placeholder Color
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/placeholder-color
*/
'placeholder-color': [{
placeholder: [colors]
}],
/**
* Placeholder Opacity
* @see https://tailwindcss.com/docs/placeholder-opacity
*/
'placeholder-opacity': [{
'placeholder-opacity': [opacity]
}],
/**
* Text Alignment
* @see https://tailwindcss.com/docs/text-align
*/
'text-alignment': [{
text: ['left', 'center', 'right', 'justify', 'start', 'end']
}],
/**
* Text Color
* @see https://tailwindcss.com/docs/text-color
*/
'text-color': [{
text: [colors]
}],
/**
* Text Opacity
* @see https://tailwindcss.com/docs/text-opacity
*/
'text-opacity': [{
'text-opacity': [opacity]
}],
/**
* Text Decoration
* @see https://tailwindcss.com/docs/text-decoration
*/
'text-decoration': ['underline', 'overline', 'line-through', 'no-underline'],
/**
* Text Decoration Style
* @see https://tailwindcss.com/docs/text-decoration-style
*/
'text-decoration-style': [{
decoration: [].concat(getLineStyles(), ['wavy'])
}],
/**
* Text Decoration Thickness
* @see https://tailwindcss.com/docs/text-decoration-thickness
*/
'text-decoration-thickness': [{
decoration: ['auto', 'from-font', isLength, isArbitraryLength]
}],
/**
* Text Underline Offset
* @see https://tailwindcss.com/docs/text-underline-offset
*/
'underline-offset': [{
'underline-offset': ['auto', isLength, isArbitraryValue]
}],
/**
* Text Decoration Color
* @see https://tailwindcss.com/docs/text-decoration-color
*/
'text-decoration-color': [{
decoration: [colors]
}],
/**
* Text Transform
* @see https://tailwindcss.com/docs/text-transform
*/
'text-transform': ['uppercase', 'lowercase', 'capitalize', 'normal-case'],
/**
* Text Overflow
* @see https://tailwindcss.com/docs/text-overflow
*/
'text-overflow': ['truncate', 'text-ellipsis', 'text-clip'],
/**
* Text Wrap
* @see https://tailwindcss.com/docs/text-wrap
*/
'text-wrap': [{
text: ['wrap', 'nowrap', 'balance', 'pretty']
}],
/**
* Text Indent
* @see https://tailwindcss.com/docs/text-indent
*/
indent: [{
indent: getSpacingWithArbitrary()
}],
/**
* Vertical Alignment
* @see https://tailwindcss.com/docs/vertical-align
*/
'vertical-align': [{
align: ['baseline', 'top', 'middle', 'bottom', 'text-top', 'text-bottom', 'sub', 'super', isArbitraryValue]
}],
/**
* Whitespace
* @see https://tailwindcss.com/docs/whitespace
*/
whitespace: [{
whitespace: ['normal', 'nowrap', 'pre', 'pre-line', 'pre-wrap', 'break-spaces']
}],
/**
* Word Break
* @see https://tailwindcss.com/docs/word-break
*/
"break": [{
"break": ['normal', 'words', 'all', 'keep']
}],
/**
* Hyphens
* @see https://tailwindcss.com/docs/hyphens
*/
hyphens: [{
hyphens: ['none', 'manual', 'auto']
}],
/**
* Content
* @see https://tailwindcss.com/docs/content
*/
content: [{
content: ['none', isArbitraryValue]
}],
// Backgrounds
/**
* Background Attachment
* @see https://tailwindcss.com/docs/background-attachment
*/
'bg-attachment': [{
bg: ['fixed', 'local', 'scroll']
}],
/**
* Background Clip
* @see https://tailwindcss.com/docs/background-clip
*/
'bg-clip': [{
'bg-clip': ['border', 'padding', 'content', 'text']
}],
/**
* Background Opacity
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/background-opacity
*/
'bg-opacity': [{
'bg-opacity': [opacity]
}],
/**
* Background Origin
* @see https://tailwindcss.com/docs/background-origin
*/
'bg-origin': [{
'bg-origin': ['border', 'padding', 'content']
}],
/**
* Background Position
* @see https://tailwindcss.com/docs/background-position
*/
'bg-position': [{
bg: [].concat(getPositions(), [isArbitraryPosition])
}],
/**
* Background Repeat
* @see https://tailwindcss.com/docs/background-repeat
*/
'bg-repeat': [{
bg: ['no-repeat', {
repeat: ['', 'x', 'y', 'round', 'space']
}]
}],
/**
* Background Size
* @see https://tailwindcss.com/docs/background-size
*/
'bg-size': [{
bg: ['auto', 'cover', 'contain', isArbitrarySize]
}],
/**
* Background Image
* @see https://tailwindcss.com/docs/background-image
*/
'bg-image': [{
bg: ['none', {
'gradient-to': ['t', 'tr', 'r', 'br', 'b', 'bl', 'l', 'tl']
}, isArbitraryImage]
}],
/**
* Background Color
* @see https://tailwindcss.com/docs/background-color
*/
'bg-color': [{
bg: [colors]
}],
/**
* Gradient Color Stops From Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-from-pos': [{
from: [gradientColorStopPositions]
}],
/**
* Gradient Color Stops Via Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-via-pos': [{
via: [gradientColorStopPositions]
}],
/**
* Gradient Color Stops To Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-to-pos': [{
to: [gradientColorStopPositions]
}],
/**
* Gradient Color Stops From
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-from': [{
from: [gradientColorStops]
}],
/**
* Gradient Color Stops Via
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-via': [{
via: [gradientColorStops]
}],
/**
* Gradient Color Stops To
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-to': [{
to: [gradientColorStops]
}],
// Borders
/**
* Border Radius
* @see https://tailwindcss.com/docs/border-radius
*/
rounded: [{
rounded: [borderRadius]
}],
/**
* Border Radius Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-s': [{
'rounded-s': [borderRadius]
}],
/**
* Border Radius End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-e': [{
'rounded-e': [borderRadius]
}],
/**
* Border Radius Top
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-t': [{
'rounded-t': [borderRadius]
}],
/**
* Border Radius Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-r': [{
'rounded-r': [borderRadius]
}],
/**
* Border Radius Bottom
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-b': [{
'rounded-b': [borderRadius]
}],
/**
* Border Radius Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-l': [{
'rounded-l': [borderRadius]
}],
/**
* Border Radius Start Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-ss': [{
'rounded-ss': [borderRadius]
}],
/**
* Border Radius Start End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-se': [{
'rounded-se': [borderRadius]
}],
/**
* Border Radius End End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-ee': [{
'rounded-ee': [borderRadius]
}],
/**
* Border Radius End Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-es': [{
'rounded-es': [borderRadius]
}],
/**
* Border Radius Top Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-tl': [{
'rounded-tl': [borderRadius]
}],
/**
* Border Radius Top Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-tr': [{
'rounded-tr': [borderRadius]
}],
/**
* Border Radius Bottom Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-br': [{
'rounded-br': [borderRadius]
}],
/**
* Border Radius Bottom Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-bl': [{
'rounded-bl': [borderRadius]
}],
/**
* Border Width
* @see https://tailwindcss.com/docs/border-width
*/
'border-w': [{
border: [borderWidth]
}],
/**
* Border Width X
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-x': [{
'border-x': [borderWidth]
}],
/**
* Border Width Y
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-y': [{
'border-y': [borderWidth]
}],
/**
* Border Width Start
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-s': [{
'border-s': [borderWidth]
}],
/**
* Border Width End
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-e': [{
'border-e': [borderWidth]
}],
/**
* Border Width Top
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-t': [{
'border-t': [borderWidth]
}],
/**
* Border Width Right
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-r': [{
'border-r': [borderWidth]
}],
/**
* Border Width Bottom
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-b': [{
'border-b': [borderWidth]
}],
/**
* Border Width Left
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-l': [{
'border-l': [borderWidth]
}],
/**
* Border Opacity
* @see https://tailwindcss.com/docs/border-opacity
*/
'border-opacity': [{
'border-opacity': [opacity]
}],
/**
* Border Style
* @see https://tailwindcss.com/docs/border-style
*/
'border-style': [{
border: [].concat(getLineStyles(), ['hidden'])
}],
/**
* Divide Width X
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-x': [{
'divide-x': [borderWidth]
}],
/**
* Divide Width X Reverse
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-x-reverse': ['divide-x-reverse'],
/**
* Divide Width Y
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-y': [{
'divide-y': [borderWidth]
}],
/**
* Divide Width Y Reverse
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-y-reverse': ['divide-y-reverse'],
/**
* Divide Opacity
* @see https://tailwindcss.com/docs/divide-opacity
*/
'divide-opacity': [{
'divide-opacity': [opacity]
}],
/**
* Divide Style
* @see https://tailwindcss.com/docs/divide-style
*/
'divide-style': [{
divide: getLineStyles()
}],
/**
* Border Color
* @see https://tailwindcss.com/docs/border-color
*/
'border-color': [{
border: [borderColor]
}],
/**
* Border Color X
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-x': [{
'border-x': [borderColor]
}],
/**
* Border Color Y
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-y': [{
'border-y': [borderColor]
}],
/**
* Border Color S
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-s': [{
'border-s': [borderColor]
}],
/**
* Border Color E
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-e': [{
'border-e': [borderColor]
}],
/**
* Border Color Top
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-t': [{
'border-t': [borderColor]
}],
/**
* Border Color Right
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-r': [{
'border-r': [borderColor]
}],
/**
* Border Color Bottom
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-b': [{
'border-b': [borderColor]
}],
/**
* Border Color Left
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-l': [{
'border-l': [borderColor]
}],
/**
* Divide Color
* @see https://tailwindcss.com/docs/divide-color
*/
'divide-color': [{
divide: [borderColor]
}],
/**
* Outline Style
* @see https://tailwindcss.com/docs/outline-style
*/
'outline-style': [{
outline: [''].concat(getLineStyles())
}],
/**
* Outline Offset
* @see https://tailwindcss.com/docs/outline-offset
*/
'outline-offset': [{
'outline-offset': [isLength, isArbitraryValue]
}],
/**
* Outline Width
* @see https://tailwindcss.com/docs/outline-width
*/
'outline-w': [{
outline: [isLength, isArbitraryLength]
}],
/**
* Outline Color
* @see https://tailwindcss.com/docs/outline-color
*/
'outline-color': [{
outline: [colors]
}],
/**
* Ring Width
* @see https://tailwindcss.com/docs/ring-width
*/
'ring-w': [{
ring: getLengthWithEmptyAndArbitrary()
}],
/**
* Ring Width Inset
* @see https://tailwindcss.com/docs/ring-width
*/
'ring-w-inset': ['ring-inset'],
/**
* Ring Color
* @see https://tailwindcss.com/docs/ring-color
*/
'ring-color': [{
ring: [colors]
}],
/**
* Ring Opacity
* @see https://tailwindcss.com/docs/ring-opacity
*/
'ring-opacity': [{
'ring-opacity': [opacity]
}],
/**
* Ring Offset Width
* @see https://tailwindcss.com/docs/ring-offset-width
*/
'ring-offset-w': [{
'ring-offset': [isLength, isArbitraryLength]
}],
/**
* Ring Offset Color
* @see https://tailwindcss.com/docs/ring-offset-color
*/
'ring-offset-color': [{
'ring-offset': [colors]
}],
// Effects
/**
* Box Shadow
* @see https://tailwindcss.com/docs/box-shadow
*/
shadow: [{
shadow: ['', 'inner', 'none', isTshirtSize, isArbitraryShadow]
}],
/**
* Box Shadow Color
* @see https://tailwindcss.com/docs/box-shadow-color
*/
'shadow-color': [{
shadow: [isAny]
}],
/**
* Opacity
* @see https://tailwindcss.com/docs/opacity
*/
opacity: [{
opacity: [opacity]
}],
/**
* Mix Blend Mode
* @see https://tailwindcss.com/docs/mix-blend-mode
*/
'mix-blend': [{
'mix-blend': [].concat(getBlendModes(), ['plus-lighter', 'plus-darker'])
}],
/**
* Background Blend Mode
* @see https://tailwindcss.com/docs/background-blend-mode
*/
'bg-blend': [{
'bg-blend': getBlendModes()
}],
// Filters
/**
* Filter
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/filter
*/
filter: [{
filter: ['', 'none']
}],
/**
* Blur
* @see https://tailwindcss.com/docs/blur
*/
blur: [{
blur: [blur]
}],
/**
* Brightness
* @see https://tailwindcss.com/docs/brightness
*/
brightness: [{
brightness: [brightness]
}],
/**
* Contrast
* @see https://tailwindcss.com/docs/contrast
*/
contrast: [{
contrast: [contrast]
}],
/**
* Drop Shadow
* @see https://tailwindcss.com/docs/drop-shadow
*/
'drop-shadow': [{
'drop-shadow': ['', 'none', isTshirtSize, isArbitraryValue]
}],
/**
* Grayscale
* @see https://tailwindcss.com/docs/grayscale
*/
grayscale: [{
grayscale: [grayscale]
}],
/**
* Hue Rotate
* @see https://tailwindcss.com/docs/hue-rotate
*/
'hue-rotate': [{
'hue-rotate': [hueRotate]
}],
/**
* Invert
* @see https://tailwindcss.com/docs/invert
*/
invert: [{
invert: [invert]
}],
/**
* Saturate
* @see https://tailwindcss.com/docs/saturate
*/
saturate: [{
saturate: [saturate]
}],
/**
* Sepia
* @see https://tailwindcss.com/docs/sepia
*/
sepia: [{
sepia: [sepia]
}],
/**
* Backdrop Filter
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/backdrop-filter
*/
'backdrop-filter': [{
'backdrop-filter': ['', 'none']
}],
/**
* Backdrop Blur
* @see https://tailwindcss.com/docs/backdrop-blur
*/
'backdrop-blur': [{
'backdrop-blur': [blur]
}],
/**
* Backdrop Brightness
* @see https://tailwindcss.com/docs/backdrop-brightness
*/
'backdrop-brightness': [{
'backdrop-brightness': [brightness]
}],
/**
* Backdrop Contrast
* @see https://tailwindcss.com/docs/backdrop-contrast
*/
'backdrop-contrast': [{
'backdrop-contrast': [contrast]
}],
/**
* Backdrop Grayscale
* @see https://tailwindcss.com/docs/backdrop-grayscale
*/
'backdrop-grayscale': [{
'backdrop-grayscale': [grayscale]
}],
/**
* Backdrop Hue Rotate
* @see https://tailwindcss.com/docs/backdrop-hue-rotate
*/
'backdrop-hue-rotate': [{
'backdrop-hue-rotate': [hueRotate]
}],
/**
* Backdrop Invert
* @see https://tailwindcss.com/docs/backdrop-invert
*/
'backdrop-invert': [{
'backdrop-invert': [invert]
}],
/**
* Backdrop Opacity
* @see https://tailwindcss.com/docs/backdrop-opacity
*/
'backdrop-opacity': [{
'backdrop-opacity': [opacity]
}],
/**
* Backdrop Saturate
* @see https://tailwindcss.com/docs/backdrop-saturate
*/
'backdrop-saturate': [{
'backdrop-saturate': [saturate]
}],
/**
* Backdrop Sepia
* @see https://tailwindcss.com/docs/backdrop-sepia
*/
'backdrop-sepia': [{
'backdrop-sepia': [sepia]
}],
// Tables
/**
* Border Collapse
* @see https://tailwindcss.com/docs/border-collapse
*/
'border-collapse': [{
border: ['collapse', 'separate']
}],
/**
* Border Spacing
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing': [{
'border-spacing': [borderSpacing]
}],
/**
* Border Spacing X
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing-x': [{
'border-spacing-x': [borderSpacing]
}],
/**
* Border Spacing Y
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing-y': [{
'border-spacing-y': [borderSpacing]
}],
/**
* Table Layout
* @see https://tailwindcss.com/docs/table-layout
*/
'table-layout': [{
table: ['auto', 'fixed']
}],
/**
* Caption Side
* @see https://tailwindcss.com/docs/caption-side
*/
caption: [{
caption: ['top', 'bottom']
}],
// Transitions and Animation
/**
* Tranisition Property
* @see https://tailwindcss.com/docs/transition-property
*/
transition: [{
transition: ['none', 'all', '', 'colors', 'opacity', 'shadow', 'transform', isArbitraryValue]
}],
/**
* Transition Duration
* @see https://tailwindcss.com/docs/transition-duration
*/
duration: [{
duration: getNumberAndArbitrary()
}],
/**
* Transition Timing Function
* @see https://tailwindcss.com/docs/transition-timing-function
*/
ease: [{
ease: ['linear', 'in', 'out', 'in-out', isArbitraryValue]
}],
/**
* Transition Delay
* @see https://tailwindcss.com/docs/transition-delay
*/
delay: [{
delay: getNumberAndArbitrary()
}],
/**
* Animation
* @see https://tailwindcss.com/docs/animation
*/
animate: [{
animate: ['none', 'spin', 'ping', 'pulse', 'bounce', isArbitraryValue]
}],
// Transforms
/**
* Transform
* @see https://tailwindcss.com/docs/transform
*/
transform: [{
transform: ['', 'gpu', 'none']
}],
/**
* Scale
* @see https://tailwindcss.com/docs/scale
*/
scale: [{
scale: [scale]
}],
/**
* Scale X
* @see https://tailwindcss.com/docs/scale
*/
'scale-x': [{
'scale-x': [scale]
}],
/**
* Scale Y
* @see https://tailwindcss.com/docs/scale
*/
'scale-y': [{
'scale-y': [scale]
}],
/**
* Rotate
* @see https://tailwindcss.com/docs/rotate
*/
rotate: [{
rotate: [isInteger, isArbitraryValue]
}],
/**
* Translate X
* @see https://tailwindcss.com/docs/translate
*/
'translate-x': [{
'translate-x': [translate]
}],
/**
* Translate Y
* @see https://tailwindcss.com/docs/translate
*/
'translate-y': [{
'translate-y': [translate]
}],
/**
* Skew X
* @see https://tailwindcss.com/docs/skew
*/
'skew-x': [{
'skew-x': [skew]
}],
/**
* Skew Y
* @see https://tailwindcss.com/docs/skew
*/
'skew-y': [{
'skew-y': [skew]
}],
/**
* Transform Origin
* @see https://tailwindcss.com/docs/transform-origin
*/
'transform-origin': [{
origin: ['center', 'top', 'top-right', 'right', 'bottom-right', 'bottom', 'bottom-left', 'left', 'top-left', isArbitraryValue]
}],
// Interactivity
/**
* Accent Color
* @see https://tailwindcss.com/docs/accent-color
*/
accent: [{
accent: ['auto', colors]
}],
/**
* Appearance
* @see https://tailwindcss.com/docs/appearance
*/
appearance: [{
appearance: ['none', 'auto']
}],
/**
* Cursor
* @see https://tailwindcss.com/docs/cursor
*/
cursor: [{
cursor: ['auto', 'default', 'pointer', 'wait', 'text', 'move', 'help', 'not-allowed', 'none', 'context-menu', 'progress', 'cell', 'crosshair', 'vertical-text', 'alias', 'copy', 'no-drop', 'grab', 'grabbing', 'all-scroll', 'col-resize', 'row-resize', 'n-resize', 'e-resize', 's-resize', 'w-resize', 'ne-resize', 'nw-resize', 'se-resize', 'sw-resize', 'ew-resize', 'ns-resize', 'nesw-resize', 'nwse-resize', 'zoom-in', 'zoom-out', isArbitraryValue]
}],
/**
* Caret Color
* @see https://tailwindcss.com/docs/just-in-time-mode#caret-color-utilities
*/
'caret-color': [{
caret: [colors]
}],
/**
* Pointer Events
* @see https://tailwindcss.com/docs/pointer-events
*/
'pointer-events': [{
'pointer-events': ['none', 'auto']
}],
/**
* Resize
* @see https://tailwindcss.com/docs/resize
*/
resize: [{
resize: ['none', 'y', 'x', '']
}],
/**
* Scroll Behavior
* @see https://tailwindcss.com/docs/scroll-behavior
*/
'scroll-behavior': [{
scroll: ['auto', 'smooth']
}],
/**
* Scroll Margin
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-m': [{
'scroll-m': getSpacingWithArbitrary()
}],
/**
* Scroll Margin X
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mx': [{
'scroll-mx': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Y
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-my': [{
'scroll-my': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Start
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-ms': [{
'scroll-ms': getSpacingWithArbitrary()
}],
/**
* Scroll Margin End
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-me': [{
'scroll-me': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Top
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mt': [{
'scroll-mt': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Right
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mr': [{
'scroll-mr': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Bottom
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mb': [{
'scroll-mb': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Left
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-ml': [{
'scroll-ml': getSpacingWithArbitrary()
}],
/**
* Scroll Padding
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-p': [{
'scroll-p': getSpacingWithArbitrary()
}],
/**
* Scroll Padding X
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-px': [{
'scroll-px': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Y
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-py': [{
'scroll-py': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Start
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-ps': [{
'scroll-ps': getSpacingWithArbitrary()
}],
/**
* Scroll Padding End
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pe': [{
'scroll-pe': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Top
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pt': [{
'scroll-pt': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Right
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pr': [{
'scroll-pr': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Bottom
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pb': [{
'scroll-pb': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Left
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pl': [{
'scroll-pl': getSpacingWithArbitrary()
}],
/**
* Scroll Snap Align
* @see https://tailwindcss.com/docs/scroll-snap-align
*/
'snap-align': [{
snap: ['start', 'end', 'center', 'align-none']
}],
/**
* Scroll Snap Stop
* @see https://tailwindcss.com/docs/scroll-snap-stop
*/
'snap-stop': [{
snap: ['normal', 'always']
}],
/**
* Scroll Snap Type
* @see https://tailwindcss.com/docs/scroll-snap-type
*/
'snap-type': [{
snap: ['none', 'x', 'y', 'both']
}],
/**
* Scroll Snap Type Strictness
* @see https://tailwindcss.com/docs/scroll-snap-type
*/
'snap-strictness': [{
snap: ['mandatory', 'proximity']
}],
/**
* Touch Action
* @see https://tailwindcss.com/docs/touch-action
*/
touch: [{
touch: ['auto', 'none', 'manipulation']
}],
/**
* Touch Action X
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-x': [{
'touch-pan': ['x', 'left', 'right']
}],
/**
* Touch Action Y
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-y': [{
'touch-pan': ['y', 'up', 'down']
}],
/**
* Touch Action Pinch Zoom
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-pz': ['touch-pinch-zoom'],
/**
* User Select
* @see https://tailwindcss.com/docs/user-select
*/
select: [{
select: ['none', 'text', 'all', 'auto']
}],
/**
* Will Change
* @see https://tailwindcss.com/docs/will-change
*/
'will-change': [{
'will-change': ['auto', 'scroll', 'contents', 'transform', isArbitraryValue]
}],
// SVG
/**
* Fill
* @see https://tailwindcss.com/docs/fill
*/
fill: [{
fill: [colors, 'none']
}],
/**
* Stroke Width
* @see https://tailwindcss.com/docs/stroke-width
*/
'stroke-w': [{
stroke: [isLength, isArbitraryLength, isArbitraryNumber]
}],
/**
* Stroke
* @see https://tailwindcss.com/docs/stroke
*/
stroke: [{
stroke: [colors, 'none']
}],
// Accessibility
/**
* Screen Readers
* @see https://tailwindcss.com/docs/screen-readers
*/
sr: ['sr-only', 'not-sr-only'],
/**
* Forced Color Adjust
* @see https://tailwindcss.com/docs/forced-color-adjust
*/
'forced-color-adjust': [{
'forced-color-adjust': ['auto', 'none']
}]
},
conflictingClassGroups: {
overflow: ['overflow-x', 'overflow-y'],
overscroll: ['overscroll-x', 'overscroll-y'],
inset: ['inset-x', 'inset-y', 'start', 'end', 'top', 'right', 'bottom', 'left'],
'inset-x': ['right', 'left'],
'inset-y': ['top', 'bottom'],
flex: ['basis', 'grow', 'shrink'],
gap: ['gap-x', 'gap-y'],
p: ['px', 'py', 'ps', 'pe', 'pt', 'pr', 'pb', 'pl'],
px: ['pr', 'pl'],
py: ['pt', 'pb'],
m: ['mx', 'my', 'ms', 'me', 'mt', 'mr', 'mb', 'ml'],
mx: ['mr', 'ml'],
my: ['mt', 'mb'],
size: ['w', 'h'],
'font-size': ['leading'],
'fvn-normal': ['fvn-ordinal', 'fvn-slashed-zero', 'fvn-figure', 'fvn-spacing', 'fvn-fraction'],
'fvn-ordinal': ['fvn-normal'],
'fvn-slashed-zero': ['fvn-normal'],
'fvn-figure': ['fvn-normal'],
'fvn-spacing': ['fvn-normal'],
'fvn-fraction': ['fvn-normal'],
'line-clamp': ['display', 'overflow'],
rounded: ['rounded-s', 'rounded-e', 'rounded-t', 'rounded-r', 'rounded-b', 'rounded-l', 'rounded-ss', 'rounded-se', 'rounded-ee', 'rounded-es', 'rounded-tl', 'rounded-tr', 'rounded-br', 'rounded-bl'],
'rounded-s': ['rounded-ss', 'rounded-es'],
'rounded-e': ['rounded-se', 'rounded-ee'],
'rounded-t': ['rounded-tl', 'rounded-tr'],
'rounded-r': ['rounded-tr', 'rounded-br'],
'rounded-b': ['rounded-br', 'rounded-bl'],
'rounded-l': ['rounded-tl', 'rounded-bl'],
'border-spacing': ['border-spacing-x', 'border-spacing-y'],
'border-w': ['border-w-s', 'border-w-e', 'border-w-t', 'border-w-r', 'border-w-b', 'border-w-l'],
'border-w-x': ['border-w-r', 'border-w-l'],
'border-w-y': ['border-w-t', 'border-w-b'],
'border-color': ['border-color-s', 'border-color-e', 'border-color-t', 'border-color-r', 'border-color-b', 'border-color-l'],
'border-color-x': ['border-color-r', 'border-color-l'],
'border-color-y': ['border-color-t', 'border-color-b'],
'scroll-m': ['scroll-mx', 'scroll-my', 'scroll-ms', 'scroll-me', 'scroll-mt', 'scroll-mr', 'scroll-mb', 'scroll-ml'],
'scroll-mx': ['scroll-mr', 'scroll-ml'],
'scroll-my': ['scroll-mt', 'scroll-mb'],
'scroll-p': ['scroll-px', 'scroll-py', 'scroll-ps', 'scroll-pe', 'scroll-pt', 'scroll-pr', 'scroll-pb', 'scroll-pl'],
'scroll-px': ['scroll-pr', 'scroll-pl'],
'scroll-py': ['scroll-pt', 'scroll-pb'],
touch: ['touch-x', 'touch-y', 'touch-pz'],
'touch-x': ['touch'],
'touch-y': ['touch'],
'touch-pz': ['touch']
},
conflictingClassGroupModifiers: {
'font-size': ['leading']
}
};
};
/**
* @param baseConfig Config where other config will be merged into. This object will be mutated.
* @param configExtension Partial config to merge into the `baseConfig`.
*/
var mergeConfigs = function mergeConfigs(baseConfig, _ref6) {
var cacheSize = _ref6.cacheSize,
prefix = _ref6.prefix,
separator = _ref6.separator,
experimentalParseClassName = _ref6.experimentalParseClassName,
_ref6$extend = _ref6.extend,
extend = _ref6$extend === void 0 ? {} : _ref6$extend,
_ref6$override = _ref6.override,
override = _ref6$override === void 0 ? {} : _ref6$override;
overrideProperty(baseConfig, 'cacheSize', cacheSize);
overrideProperty(baseConfig, 'prefix', prefix);
overrideProperty(baseConfig, 'separator', separator);
overrideProperty(baseConfig, 'experimentalParseClassName', experimentalParseClassName);
for (var configKey in override) {
overrideConfigProperties(baseConfig[configKey], override[configKey]);
}
for (var key in extend) {
mergeConfigProperties(baseConfig[key], extend[key]);
}
return baseConfig;
};
var overrideProperty = function overrideProperty(baseObject, overrideKey, overrideValue) {
if (overrideValue !== undefined) {
baseObject[overrideKey] = overrideValue;
}
};
var overrideConfigProperties = function overrideConfigProperties(baseObject, overrideObject) {
if (overrideObject) {
for (var key in overrideObject) {
overrideProperty(baseObject, key, overrideObject[key]);
}
}
};
var mergeConfigProperties = function mergeConfigProperties(baseObject, mergeObject) {
if (mergeObject) {
for (var key in mergeObject) {
var mergeValue = mergeObject[key];
if (mergeValue !== undefined) {
baseObject[key] = (baseObject[key] || []).concat(mergeValue);
}
}
}
};
var extendTailwindMerge = function extendTailwindMerge(configExtension) {
for (var _len2 = arguments.length, createConfig = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
createConfig[_key2 - 1] = arguments[_key2];
}
return typeof configExtension === 'function' ? createTailwindMerge.apply(void 0, [getDefaultConfig, configExtension].concat(createConfig)) : createTailwindMerge.apply(void 0, [function () {
return mergeConfigs(getDefaultConfig(), configExtension);
}].concat(createConfig));
};
var twMerge = /*#__PURE__*/createTailwindMerge(getDefaultConfig);
exports.createTailwindMerge = createTailwindMerge;
exports.extendTailwindMerge = extendTailwindMerge;
exports.fromTheme = fromTheme;
exports.getDefaultConfig = getDefaultConfig;
exports.mergeConfigs = mergeConfigs;
exports.twJoin = twJoin;
exports.twMerge = twMerge;
exports.validators = validators;
//# sourceMappingURL=bundle-cjs.js.map
File diff suppressed because one or more lines are too long
+2646
View File
@@ -0,0 +1,2646 @@
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
var CLASS_PART_SEPARATOR = '-';
var createClassGroupUtils = function createClassGroupUtils(config) {
var classMap = createClassMap(config);
var conflictingClassGroups = config.conflictingClassGroups,
conflictingClassGroupModifiers = config.conflictingClassGroupModifiers;
var getClassGroupId = function getClassGroupId(className) {
var classParts = className.split(CLASS_PART_SEPARATOR);
// Classes like `-inset-1` produce an empty string as first classPart. We assume that classes for negative values are used correctly and remove it from classParts.
if (classParts[0] === '' && classParts.length !== 1) {
classParts.shift();
}
return _getGroupRecursive(classParts, classMap) || getGroupIdForArbitraryProperty(className);
};
var getConflictingClassGroupIds = function getConflictingClassGroupIds(classGroupId, hasPostfixModifier) {
var conflicts = conflictingClassGroups[classGroupId] || [];
if (hasPostfixModifier && conflictingClassGroupModifiers[classGroupId]) {
return [].concat(conflicts, conflictingClassGroupModifiers[classGroupId]);
}
return conflicts;
};
return {
getClassGroupId: getClassGroupId,
getConflictingClassGroupIds: getConflictingClassGroupIds
};
};
var _getGroupRecursive = function getGroupRecursive(classParts, classPartObject) {
var _classPartObject$vali;
if (classParts.length === 0) {
return classPartObject.classGroupId;
}
var currentClassPart = classParts[0];
var nextClassPartObject = classPartObject.nextPart.get(currentClassPart);
var classGroupFromNextClassPart = nextClassPartObject ? _getGroupRecursive(classParts.slice(1), nextClassPartObject) : undefined;
if (classGroupFromNextClassPart) {
return classGroupFromNextClassPart;
}
if (classPartObject.validators.length === 0) {
return undefined;
}
var classRest = classParts.join(CLASS_PART_SEPARATOR);
return (_classPartObject$vali = classPartObject.validators.find(function (_ref) {
var validator = _ref.validator;
return validator(classRest);
})) == null ? void 0 : _classPartObject$vali.classGroupId;
};
var arbitraryPropertyRegex = /^\[(.+)\]$/;
var getGroupIdForArbitraryProperty = function getGroupIdForArbitraryProperty(className) {
if (arbitraryPropertyRegex.test(className)) {
var arbitraryPropertyClassName = arbitraryPropertyRegex.exec(className)[1];
var property = arbitraryPropertyClassName == null ? void 0 : arbitraryPropertyClassName.substring(0, arbitraryPropertyClassName.indexOf(':'));
if (property) {
// I use two dots here because one dot is used as prefix for class groups in plugins
return 'arbitrary..' + property;
}
}
};
/**
* Exported for testing only
*/
var createClassMap = function createClassMap(config) {
var theme = config.theme,
prefix = config.prefix;
var classMap = {
nextPart: new Map(),
validators: []
};
var prefixedClassGroupEntries = getPrefixedClassGroupEntries(Object.entries(config.classGroups), prefix);
prefixedClassGroupEntries.forEach(function (_ref2) {
var classGroupId = _ref2[0],
classGroup = _ref2[1];
_processClassesRecursively(classGroup, classMap, classGroupId, theme);
});
return classMap;
};
var _processClassesRecursively = function processClassesRecursively(classGroup, classPartObject, classGroupId, theme) {
classGroup.forEach(function (classDefinition) {
if (typeof classDefinition === 'string') {
var classPartObjectToEdit = classDefinition === '' ? classPartObject : getPart(classPartObject, classDefinition);
classPartObjectToEdit.classGroupId = classGroupId;
return;
}
if (typeof classDefinition === 'function') {
if (isThemeGetter(classDefinition)) {
_processClassesRecursively(classDefinition(theme), classPartObject, classGroupId, theme);
return;
}
classPartObject.validators.push({
validator: classDefinition,
classGroupId: classGroupId
});
return;
}
Object.entries(classDefinition).forEach(function (_ref3) {
var key = _ref3[0],
classGroup = _ref3[1];
_processClassesRecursively(classGroup, getPart(classPartObject, key), classGroupId, theme);
});
});
};
var getPart = function getPart(classPartObject, path) {
var currentClassPartObject = classPartObject;
path.split(CLASS_PART_SEPARATOR).forEach(function (pathPart) {
if (!currentClassPartObject.nextPart.has(pathPart)) {
currentClassPartObject.nextPart.set(pathPart, {
nextPart: new Map(),
validators: []
});
}
currentClassPartObject = currentClassPartObject.nextPart.get(pathPart);
});
return currentClassPartObject;
};
var isThemeGetter = function isThemeGetter(func) {
return func.isThemeGetter;
};
var getPrefixedClassGroupEntries = function getPrefixedClassGroupEntries(classGroupEntries, prefix) {
if (!prefix) {
return classGroupEntries;
}
return classGroupEntries.map(function (_ref4) {
var classGroupId = _ref4[0],
classGroup = _ref4[1];
var prefixedClassGroup = classGroup.map(function (classDefinition) {
if (typeof classDefinition === 'string') {
return prefix + classDefinition;
}
if (typeof classDefinition === 'object') {
return Object.fromEntries(Object.entries(classDefinition).map(function (_ref5) {
var key = _ref5[0],
value = _ref5[1];
return [prefix + key, value];
}));
}
return classDefinition;
});
return [classGroupId, prefixedClassGroup];
});
};
// LRU cache inspired from hashlru (https://github.com/dominictarr/hashlru/blob/v1.0.4/index.js) but object replaced with Map to improve performance
var createLruCache = function createLruCache(maxCacheSize) {
if (maxCacheSize < 1) {
return {
get: function get() {
return undefined;
},
set: function set() {}
};
}
var cacheSize = 0;
var cache = new Map();
var previousCache = new Map();
var update = function update(key, value) {
cache.set(key, value);
cacheSize++;
if (cacheSize > maxCacheSize) {
cacheSize = 0;
previousCache = cache;
cache = new Map();
}
};
return {
get: function get(key) {
var value = cache.get(key);
if (value !== undefined) {
return value;
}
if ((value = previousCache.get(key)) !== undefined) {
update(key, value);
return value;
}
},
set: function set(key, value) {
if (cache.has(key)) {
cache.set(key, value);
} else {
update(key, value);
}
}
};
};
var IMPORTANT_MODIFIER = '!';
var createParseClassName = function createParseClassName(config) {
var separator = config.separator,
experimentalParseClassName = config.experimentalParseClassName;
var isSeparatorSingleCharacter = separator.length === 1;
var firstSeparatorCharacter = separator[0];
var separatorLength = separator.length;
// parseClassName inspired by https://github.com/tailwindlabs/tailwindcss/blob/v3.2.2/src/util/splitAtTopLevelOnly.js
var parseClassName = function parseClassName(className) {
var modifiers = [];
var bracketDepth = 0;
var modifierStart = 0;
var postfixModifierPosition;
for (var index = 0; index < className.length; index++) {
var currentCharacter = className[index];
if (bracketDepth === 0) {
if (currentCharacter === firstSeparatorCharacter && (isSeparatorSingleCharacter || className.slice(index, index + separatorLength) === separator)) {
modifiers.push(className.slice(modifierStart, index));
modifierStart = index + separatorLength;
continue;
}
if (currentCharacter === '/') {
postfixModifierPosition = index;
continue;
}
}
if (currentCharacter === '[') {
bracketDepth++;
} else if (currentCharacter === ']') {
bracketDepth--;
}
}
var baseClassNameWithImportantModifier = modifiers.length === 0 ? className : className.substring(modifierStart);
var hasImportantModifier = baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER);
var baseClassName = hasImportantModifier ? baseClassNameWithImportantModifier.substring(1) : baseClassNameWithImportantModifier;
var maybePostfixModifierPosition = postfixModifierPosition && postfixModifierPosition > modifierStart ? postfixModifierPosition - modifierStart : undefined;
return {
modifiers: modifiers,
hasImportantModifier: hasImportantModifier,
baseClassName: baseClassName,
maybePostfixModifierPosition: maybePostfixModifierPosition
};
};
if (experimentalParseClassName) {
return function (className) {
return experimentalParseClassName({
className: className,
parseClassName: parseClassName
});
};
}
return parseClassName;
};
/**
* Sorts modifiers according to following schema:
* - Predefined modifiers are sorted alphabetically
* - When an arbitrary variant appears, it must be preserved which modifiers are before and after it
*/
var sortModifiers = function sortModifiers(modifiers) {
if (modifiers.length <= 1) {
return modifiers;
}
var sortedModifiers = [];
var unsortedModifiers = [];
modifiers.forEach(function (modifier) {
var isArbitraryVariant = modifier[0] === '[';
if (isArbitraryVariant) {
sortedModifiers.push.apply(sortedModifiers, unsortedModifiers.sort().concat([modifier]));
unsortedModifiers = [];
} else {
unsortedModifiers.push(modifier);
}
});
sortedModifiers.push.apply(sortedModifiers, unsortedModifiers.sort());
return sortedModifiers;
};
var createConfigUtils = function createConfigUtils(config) {
return _extends({
cache: createLruCache(config.cacheSize),
parseClassName: createParseClassName(config)
}, createClassGroupUtils(config));
};
var SPLIT_CLASSES_REGEX = /\s+/;
var mergeClassList = function mergeClassList(classList, configUtils) {
var parseClassName = configUtils.parseClassName,
getClassGroupId = configUtils.getClassGroupId,
getConflictingClassGroupIds = configUtils.getConflictingClassGroupIds;
/**
* Set of classGroupIds in following format:
* `{importantModifier}{variantModifiers}{classGroupId}`
* @example 'float'
* @example 'hover:focus:bg-color'
* @example 'md:!pr'
*/
var classGroupsInConflict = [];
var classNames = classList.trim().split(SPLIT_CLASSES_REGEX);
var result = '';
for (var index = classNames.length - 1; index >= 0; index -= 1) {
var originalClassName = classNames[index];
var _parseClassName = parseClassName(originalClassName),
modifiers = _parseClassName.modifiers,
hasImportantModifier = _parseClassName.hasImportantModifier,
baseClassName = _parseClassName.baseClassName,
maybePostfixModifierPosition = _parseClassName.maybePostfixModifierPosition;
var hasPostfixModifier = Boolean(maybePostfixModifierPosition);
var classGroupId = getClassGroupId(hasPostfixModifier ? baseClassName.substring(0, maybePostfixModifierPosition) : baseClassName);
if (!classGroupId) {
if (!hasPostfixModifier) {
// Not a Tailwind class
result = originalClassName + (result.length > 0 ? ' ' + result : result);
continue;
}
classGroupId = getClassGroupId(baseClassName);
if (!classGroupId) {
// Not a Tailwind class
result = originalClassName + (result.length > 0 ? ' ' + result : result);
continue;
}
hasPostfixModifier = false;
}
var variantModifier = sortModifiers(modifiers).join(':');
var modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier;
var classId = modifierId + classGroupId;
if (classGroupsInConflict.includes(classId)) {
// Tailwind class omitted due to conflict
continue;
}
classGroupsInConflict.push(classId);
var conflictGroups = getConflictingClassGroupIds(classGroupId, hasPostfixModifier);
for (var i = 0; i < conflictGroups.length; ++i) {
var group = conflictGroups[i];
classGroupsInConflict.push(modifierId + group);
}
// Tailwind class not in conflict
result = originalClassName + (result.length > 0 ? ' ' + result : result);
}
return result;
};
/**
* The code in this file is copied from https://github.com/lukeed/clsx and modified to suit the needs of tailwind-merge better.
*
* Specifically:
* - Runtime code from https://github.com/lukeed/clsx/blob/v1.2.1/src/index.js
* - TypeScript types from https://github.com/lukeed/clsx/blob/v1.2.1/clsx.d.ts
*
* Original code has MIT license: Copyright (c) Luke Edwards <luke.edwards05@gmail.com> (lukeed.com)
*/
function twJoin() {
var index = 0;
var argument;
var resolvedValue;
var string = '';
while (index < arguments.length) {
if (argument = arguments[index++]) {
if (resolvedValue = _toValue(argument)) {
string && (string += ' ');
string += resolvedValue;
}
}
}
return string;
}
var _toValue = function toValue(mix) {
if (typeof mix === 'string') {
return mix;
}
var resolvedValue;
var string = '';
for (var k = 0; k < mix.length; k++) {
if (mix[k]) {
if (resolvedValue = _toValue(mix[k])) {
string && (string += ' ');
string += resolvedValue;
}
}
}
return string;
};
function createTailwindMerge(createConfigFirst) {
for (var _len = arguments.length, createConfigRest = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
createConfigRest[_key - 1] = arguments[_key];
}
var configUtils;
var cacheGet;
var cacheSet;
var functionToCall = initTailwindMerge;
function initTailwindMerge(classList) {
var config = createConfigRest.reduce(function (previousConfig, createConfigCurrent) {
return createConfigCurrent(previousConfig);
}, createConfigFirst());
configUtils = createConfigUtils(config);
cacheGet = configUtils.cache.get;
cacheSet = configUtils.cache.set;
functionToCall = tailwindMerge;
return tailwindMerge(classList);
}
function tailwindMerge(classList) {
var cachedResult = cacheGet(classList);
if (cachedResult) {
return cachedResult;
}
var result = mergeClassList(classList, configUtils);
cacheSet(classList, result);
return result;
}
return function callTailwindMerge() {
return functionToCall(twJoin.apply(null, arguments));
};
}
var fromTheme = function fromTheme(key) {
var themeGetter = function themeGetter(theme) {
return theme[key] || [];
};
themeGetter.isThemeGetter = true;
return themeGetter;
};
var arbitraryValueRegex = /^\[(?:([a-z-]+):)?(.+)\]$/i;
var fractionRegex = /^\d+\/\d+$/;
var stringLengths = /*#__PURE__*/new Set(['px', 'full', 'screen']);
var tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/;
var lengthUnitRegex = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/;
var colorFunctionRegex = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/;
// Shadow always begins with x and y offset separated by underscore optionally prepended by inset
var shadowRegex = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/;
var imageRegex = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/;
var isLength = function isLength(value) {
return isNumber(value) || stringLengths.has(value) || fractionRegex.test(value);
};
var isArbitraryLength = function isArbitraryLength(value) {
return getIsArbitraryValue(value, 'length', isLengthOnly);
};
var isNumber = function isNumber(value) {
return Boolean(value) && !Number.isNaN(Number(value));
};
var isArbitraryNumber = function isArbitraryNumber(value) {
return getIsArbitraryValue(value, 'number', isNumber);
};
var isInteger = function isInteger(value) {
return Boolean(value) && Number.isInteger(Number(value));
};
var isPercent = function isPercent(value) {
return value.endsWith('%') && isNumber(value.slice(0, -1));
};
var isArbitraryValue = function isArbitraryValue(value) {
return arbitraryValueRegex.test(value);
};
var isTshirtSize = function isTshirtSize(value) {
return tshirtUnitRegex.test(value);
};
var sizeLabels = /*#__PURE__*/new Set(['length', 'size', 'percentage']);
var isArbitrarySize = function isArbitrarySize(value) {
return getIsArbitraryValue(value, sizeLabels, isNever);
};
var isArbitraryPosition = function isArbitraryPosition(value) {
return getIsArbitraryValue(value, 'position', isNever);
};
var imageLabels = /*#__PURE__*/new Set(['image', 'url']);
var isArbitraryImage = function isArbitraryImage(value) {
return getIsArbitraryValue(value, imageLabels, isImage);
};
var isArbitraryShadow = function isArbitraryShadow(value) {
return getIsArbitraryValue(value, '', isShadow);
};
var isAny = function isAny() {
return true;
};
var getIsArbitraryValue = function getIsArbitraryValue(value, label, testValue) {
var result = arbitraryValueRegex.exec(value);
if (result) {
if (result[1]) {
return typeof label === 'string' ? result[1] === label : label.has(result[1]);
}
return testValue(result[2]);
}
return false;
};
var isLengthOnly = function isLengthOnly(value) {
return (
// `colorFunctionRegex` check is necessary because color functions can have percentages in them which which would be incorrectly classified as lengths.
// For example, `hsl(0 0% 0%)` would be classified as a length without this check.
// I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
lengthUnitRegex.test(value) && !colorFunctionRegex.test(value)
);
};
var isNever = function isNever() {
return false;
};
var isShadow = function isShadow(value) {
return shadowRegex.test(value);
};
var isImage = function isImage(value) {
return imageRegex.test(value);
};
var validators = /*#__PURE__*/Object.defineProperty({
__proto__: null,
isAny: isAny,
isArbitraryImage: isArbitraryImage,
isArbitraryLength: isArbitraryLength,
isArbitraryNumber: isArbitraryNumber,
isArbitraryPosition: isArbitraryPosition,
isArbitraryShadow: isArbitraryShadow,
isArbitrarySize: isArbitrarySize,
isArbitraryValue: isArbitraryValue,
isInteger: isInteger,
isLength: isLength,
isNumber: isNumber,
isPercent: isPercent,
isTshirtSize: isTshirtSize
}, Symbol.toStringTag, {
value: 'Module'
});
var getDefaultConfig = function getDefaultConfig() {
var colors = fromTheme('colors');
var spacing = fromTheme('spacing');
var blur = fromTheme('blur');
var brightness = fromTheme('brightness');
var borderColor = fromTheme('borderColor');
var borderRadius = fromTheme('borderRadius');
var borderSpacing = fromTheme('borderSpacing');
var borderWidth = fromTheme('borderWidth');
var contrast = fromTheme('contrast');
var grayscale = fromTheme('grayscale');
var hueRotate = fromTheme('hueRotate');
var invert = fromTheme('invert');
var gap = fromTheme('gap');
var gradientColorStops = fromTheme('gradientColorStops');
var gradientColorStopPositions = fromTheme('gradientColorStopPositions');
var inset = fromTheme('inset');
var margin = fromTheme('margin');
var opacity = fromTheme('opacity');
var padding = fromTheme('padding');
var saturate = fromTheme('saturate');
var scale = fromTheme('scale');
var sepia = fromTheme('sepia');
var skew = fromTheme('skew');
var space = fromTheme('space');
var translate = fromTheme('translate');
var getOverscroll = function getOverscroll() {
return ['auto', 'contain', 'none'];
};
var getOverflow = function getOverflow() {
return ['auto', 'hidden', 'clip', 'visible', 'scroll'];
};
var getSpacingWithAutoAndArbitrary = function getSpacingWithAutoAndArbitrary() {
return ['auto', isArbitraryValue, spacing];
};
var getSpacingWithArbitrary = function getSpacingWithArbitrary() {
return [isArbitraryValue, spacing];
};
var getLengthWithEmptyAndArbitrary = function getLengthWithEmptyAndArbitrary() {
return ['', isLength, isArbitraryLength];
};
var getNumberWithAutoAndArbitrary = function getNumberWithAutoAndArbitrary() {
return ['auto', isNumber, isArbitraryValue];
};
var getPositions = function getPositions() {
return ['bottom', 'center', 'left', 'left-bottom', 'left-top', 'right', 'right-bottom', 'right-top', 'top'];
};
var getLineStyles = function getLineStyles() {
return ['solid', 'dashed', 'dotted', 'double', 'none'];
};
var getBlendModes = function getBlendModes() {
return ['normal', 'multiply', 'screen', 'overlay', 'darken', 'lighten', 'color-dodge', 'color-burn', 'hard-light', 'soft-light', 'difference', 'exclusion', 'hue', 'saturation', 'color', 'luminosity'];
};
var getAlign = function getAlign() {
return ['start', 'end', 'center', 'between', 'around', 'evenly', 'stretch'];
};
var getZeroAndEmpty = function getZeroAndEmpty() {
return ['', '0', isArbitraryValue];
};
var getBreaks = function getBreaks() {
return ['auto', 'avoid', 'all', 'avoid-page', 'page', 'left', 'right', 'column'];
};
var getNumberAndArbitrary = function getNumberAndArbitrary() {
return [isNumber, isArbitraryValue];
};
return {
cacheSize: 500,
separator: ':',
theme: {
colors: [isAny],
spacing: [isLength, isArbitraryLength],
blur: ['none', '', isTshirtSize, isArbitraryValue],
brightness: getNumberAndArbitrary(),
borderColor: [colors],
borderRadius: ['none', '', 'full', isTshirtSize, isArbitraryValue],
borderSpacing: getSpacingWithArbitrary(),
borderWidth: getLengthWithEmptyAndArbitrary(),
contrast: getNumberAndArbitrary(),
grayscale: getZeroAndEmpty(),
hueRotate: getNumberAndArbitrary(),
invert: getZeroAndEmpty(),
gap: getSpacingWithArbitrary(),
gradientColorStops: [colors],
gradientColorStopPositions: [isPercent, isArbitraryLength],
inset: getSpacingWithAutoAndArbitrary(),
margin: getSpacingWithAutoAndArbitrary(),
opacity: getNumberAndArbitrary(),
padding: getSpacingWithArbitrary(),
saturate: getNumberAndArbitrary(),
scale: getNumberAndArbitrary(),
sepia: getZeroAndEmpty(),
skew: getNumberAndArbitrary(),
space: getSpacingWithArbitrary(),
translate: getSpacingWithArbitrary()
},
classGroups: {
// Layout
/**
* Aspect Ratio
* @see https://tailwindcss.com/docs/aspect-ratio
*/
aspect: [{
aspect: ['auto', 'square', 'video', isArbitraryValue]
}],
/**
* Container
* @see https://tailwindcss.com/docs/container
*/
container: ['container'],
/**
* Columns
* @see https://tailwindcss.com/docs/columns
*/
columns: [{
columns: [isTshirtSize]
}],
/**
* Break After
* @see https://tailwindcss.com/docs/break-after
*/
'break-after': [{
'break-after': getBreaks()
}],
/**
* Break Before
* @see https://tailwindcss.com/docs/break-before
*/
'break-before': [{
'break-before': getBreaks()
}],
/**
* Break Inside
* @see https://tailwindcss.com/docs/break-inside
*/
'break-inside': [{
'break-inside': ['auto', 'avoid', 'avoid-page', 'avoid-column']
}],
/**
* Box Decoration Break
* @see https://tailwindcss.com/docs/box-decoration-break
*/
'box-decoration': [{
'box-decoration': ['slice', 'clone']
}],
/**
* Box Sizing
* @see https://tailwindcss.com/docs/box-sizing
*/
box: [{
box: ['border', 'content']
}],
/**
* Display
* @see https://tailwindcss.com/docs/display
*/
display: ['block', 'inline-block', 'inline', 'flex', 'inline-flex', 'table', 'inline-table', 'table-caption', 'table-cell', 'table-column', 'table-column-group', 'table-footer-group', 'table-header-group', 'table-row-group', 'table-row', 'flow-root', 'grid', 'inline-grid', 'contents', 'list-item', 'hidden'],
/**
* Floats
* @see https://tailwindcss.com/docs/float
*/
"float": [{
"float": ['right', 'left', 'none', 'start', 'end']
}],
/**
* Clear
* @see https://tailwindcss.com/docs/clear
*/
clear: [{
clear: ['left', 'right', 'both', 'none', 'start', 'end']
}],
/**
* Isolation
* @see https://tailwindcss.com/docs/isolation
*/
isolation: ['isolate', 'isolation-auto'],
/**
* Object Fit
* @see https://tailwindcss.com/docs/object-fit
*/
'object-fit': [{
object: ['contain', 'cover', 'fill', 'none', 'scale-down']
}],
/**
* Object Position
* @see https://tailwindcss.com/docs/object-position
*/
'object-position': [{
object: [].concat(getPositions(), [isArbitraryValue])
}],
/**
* Overflow
* @see https://tailwindcss.com/docs/overflow
*/
overflow: [{
overflow: getOverflow()
}],
/**
* Overflow X
* @see https://tailwindcss.com/docs/overflow
*/
'overflow-x': [{
'overflow-x': getOverflow()
}],
/**
* Overflow Y
* @see https://tailwindcss.com/docs/overflow
*/
'overflow-y': [{
'overflow-y': getOverflow()
}],
/**
* Overscroll Behavior
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
overscroll: [{
overscroll: getOverscroll()
}],
/**
* Overscroll Behavior X
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
'overscroll-x': [{
'overscroll-x': getOverscroll()
}],
/**
* Overscroll Behavior Y
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
'overscroll-y': [{
'overscroll-y': getOverscroll()
}],
/**
* Position
* @see https://tailwindcss.com/docs/position
*/
position: ['static', 'fixed', 'absolute', 'relative', 'sticky'],
/**
* Top / Right / Bottom / Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
inset: [{
inset: [inset]
}],
/**
* Right / Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
'inset-x': [{
'inset-x': [inset]
}],
/**
* Top / Bottom
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
'inset-y': [{
'inset-y': [inset]
}],
/**
* Start
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
start: [{
start: [inset]
}],
/**
* End
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
end: [{
end: [inset]
}],
/**
* Top
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
top: [{
top: [inset]
}],
/**
* Right
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
right: [{
right: [inset]
}],
/**
* Bottom
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
bottom: [{
bottom: [inset]
}],
/**
* Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
left: [{
left: [inset]
}],
/**
* Visibility
* @see https://tailwindcss.com/docs/visibility
*/
visibility: ['visible', 'invisible', 'collapse'],
/**
* Z-Index
* @see https://tailwindcss.com/docs/z-index
*/
z: [{
z: ['auto', isInteger, isArbitraryValue]
}],
// Flexbox and Grid
/**
* Flex Basis
* @see https://tailwindcss.com/docs/flex-basis
*/
basis: [{
basis: getSpacingWithAutoAndArbitrary()
}],
/**
* Flex Direction
* @see https://tailwindcss.com/docs/flex-direction
*/
'flex-direction': [{
flex: ['row', 'row-reverse', 'col', 'col-reverse']
}],
/**
* Flex Wrap
* @see https://tailwindcss.com/docs/flex-wrap
*/
'flex-wrap': [{
flex: ['wrap', 'wrap-reverse', 'nowrap']
}],
/**
* Flex
* @see https://tailwindcss.com/docs/flex
*/
flex: [{
flex: ['1', 'auto', 'initial', 'none', isArbitraryValue]
}],
/**
* Flex Grow
* @see https://tailwindcss.com/docs/flex-grow
*/
grow: [{
grow: getZeroAndEmpty()
}],
/**
* Flex Shrink
* @see https://tailwindcss.com/docs/flex-shrink
*/
shrink: [{
shrink: getZeroAndEmpty()
}],
/**
* Order
* @see https://tailwindcss.com/docs/order
*/
order: [{
order: ['first', 'last', 'none', isInteger, isArbitraryValue]
}],
/**
* Grid Template Columns
* @see https://tailwindcss.com/docs/grid-template-columns
*/
'grid-cols': [{
'grid-cols': [isAny]
}],
/**
* Grid Column Start / End
* @see https://tailwindcss.com/docs/grid-column
*/
'col-start-end': [{
col: ['auto', {
span: ['full', isInteger, isArbitraryValue]
}, isArbitraryValue]
}],
/**
* Grid Column Start
* @see https://tailwindcss.com/docs/grid-column
*/
'col-start': [{
'col-start': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Column End
* @see https://tailwindcss.com/docs/grid-column
*/
'col-end': [{
'col-end': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Template Rows
* @see https://tailwindcss.com/docs/grid-template-rows
*/
'grid-rows': [{
'grid-rows': [isAny]
}],
/**
* Grid Row Start / End
* @see https://tailwindcss.com/docs/grid-row
*/
'row-start-end': [{
row: ['auto', {
span: [isInteger, isArbitraryValue]
}, isArbitraryValue]
}],
/**
* Grid Row Start
* @see https://tailwindcss.com/docs/grid-row
*/
'row-start': [{
'row-start': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Row End
* @see https://tailwindcss.com/docs/grid-row
*/
'row-end': [{
'row-end': getNumberWithAutoAndArbitrary()
}],
/**
* Grid Auto Flow
* @see https://tailwindcss.com/docs/grid-auto-flow
*/
'grid-flow': [{
'grid-flow': ['row', 'col', 'dense', 'row-dense', 'col-dense']
}],
/**
* Grid Auto Columns
* @see https://tailwindcss.com/docs/grid-auto-columns
*/
'auto-cols': [{
'auto-cols': ['auto', 'min', 'max', 'fr', isArbitraryValue]
}],
/**
* Grid Auto Rows
* @see https://tailwindcss.com/docs/grid-auto-rows
*/
'auto-rows': [{
'auto-rows': ['auto', 'min', 'max', 'fr', isArbitraryValue]
}],
/**
* Gap
* @see https://tailwindcss.com/docs/gap
*/
gap: [{
gap: [gap]
}],
/**
* Gap X
* @see https://tailwindcss.com/docs/gap
*/
'gap-x': [{
'gap-x': [gap]
}],
/**
* Gap Y
* @see https://tailwindcss.com/docs/gap
*/
'gap-y': [{
'gap-y': [gap]
}],
/**
* Justify Content
* @see https://tailwindcss.com/docs/justify-content
*/
'justify-content': [{
justify: ['normal'].concat(getAlign())
}],
/**
* Justify Items
* @see https://tailwindcss.com/docs/justify-items
*/
'justify-items': [{
'justify-items': ['start', 'end', 'center', 'stretch']
}],
/**
* Justify Self
* @see https://tailwindcss.com/docs/justify-self
*/
'justify-self': [{
'justify-self': ['auto', 'start', 'end', 'center', 'stretch']
}],
/**
* Align Content
* @see https://tailwindcss.com/docs/align-content
*/
'align-content': [{
content: ['normal'].concat(getAlign(), ['baseline'])
}],
/**
* Align Items
* @see https://tailwindcss.com/docs/align-items
*/
'align-items': [{
items: ['start', 'end', 'center', 'baseline', 'stretch']
}],
/**
* Align Self
* @see https://tailwindcss.com/docs/align-self
*/
'align-self': [{
self: ['auto', 'start', 'end', 'center', 'stretch', 'baseline']
}],
/**
* Place Content
* @see https://tailwindcss.com/docs/place-content
*/
'place-content': [{
'place-content': [].concat(getAlign(), ['baseline'])
}],
/**
* Place Items
* @see https://tailwindcss.com/docs/place-items
*/
'place-items': [{
'place-items': ['start', 'end', 'center', 'baseline', 'stretch']
}],
/**
* Place Self
* @see https://tailwindcss.com/docs/place-self
*/
'place-self': [{
'place-self': ['auto', 'start', 'end', 'center', 'stretch']
}],
// Spacing
/**
* Padding
* @see https://tailwindcss.com/docs/padding
*/
p: [{
p: [padding]
}],
/**
* Padding X
* @see https://tailwindcss.com/docs/padding
*/
px: [{
px: [padding]
}],
/**
* Padding Y
* @see https://tailwindcss.com/docs/padding
*/
py: [{
py: [padding]
}],
/**
* Padding Start
* @see https://tailwindcss.com/docs/padding
*/
ps: [{
ps: [padding]
}],
/**
* Padding End
* @see https://tailwindcss.com/docs/padding
*/
pe: [{
pe: [padding]
}],
/**
* Padding Top
* @see https://tailwindcss.com/docs/padding
*/
pt: [{
pt: [padding]
}],
/**
* Padding Right
* @see https://tailwindcss.com/docs/padding
*/
pr: [{
pr: [padding]
}],
/**
* Padding Bottom
* @see https://tailwindcss.com/docs/padding
*/
pb: [{
pb: [padding]
}],
/**
* Padding Left
* @see https://tailwindcss.com/docs/padding
*/
pl: [{
pl: [padding]
}],
/**
* Margin
* @see https://tailwindcss.com/docs/margin
*/
m: [{
m: [margin]
}],
/**
* Margin X
* @see https://tailwindcss.com/docs/margin
*/
mx: [{
mx: [margin]
}],
/**
* Margin Y
* @see https://tailwindcss.com/docs/margin
*/
my: [{
my: [margin]
}],
/**
* Margin Start
* @see https://tailwindcss.com/docs/margin
*/
ms: [{
ms: [margin]
}],
/**
* Margin End
* @see https://tailwindcss.com/docs/margin
*/
me: [{
me: [margin]
}],
/**
* Margin Top
* @see https://tailwindcss.com/docs/margin
*/
mt: [{
mt: [margin]
}],
/**
* Margin Right
* @see https://tailwindcss.com/docs/margin
*/
mr: [{
mr: [margin]
}],
/**
* Margin Bottom
* @see https://tailwindcss.com/docs/margin
*/
mb: [{
mb: [margin]
}],
/**
* Margin Left
* @see https://tailwindcss.com/docs/margin
*/
ml: [{
ml: [margin]
}],
/**
* Space Between X
* @see https://tailwindcss.com/docs/space
*/
'space-x': [{
'space-x': [space]
}],
/**
* Space Between X Reverse
* @see https://tailwindcss.com/docs/space
*/
'space-x-reverse': ['space-x-reverse'],
/**
* Space Between Y
* @see https://tailwindcss.com/docs/space
*/
'space-y': [{
'space-y': [space]
}],
/**
* Space Between Y Reverse
* @see https://tailwindcss.com/docs/space
*/
'space-y-reverse': ['space-y-reverse'],
// Sizing
/**
* Width
* @see https://tailwindcss.com/docs/width
*/
w: [{
w: ['auto', 'min', 'max', 'fit', 'svw', 'lvw', 'dvw', isArbitraryValue, spacing]
}],
/**
* Min-Width
* @see https://tailwindcss.com/docs/min-width
*/
'min-w': [{
'min-w': [isArbitraryValue, spacing, 'min', 'max', 'fit']
}],
/**
* Max-Width
* @see https://tailwindcss.com/docs/max-width
*/
'max-w': [{
'max-w': [isArbitraryValue, spacing, 'none', 'full', 'min', 'max', 'fit', 'prose', {
screen: [isTshirtSize]
}, isTshirtSize]
}],
/**
* Height
* @see https://tailwindcss.com/docs/height
*/
h: [{
h: [isArbitraryValue, spacing, 'auto', 'min', 'max', 'fit', 'svh', 'lvh', 'dvh']
}],
/**
* Min-Height
* @see https://tailwindcss.com/docs/min-height
*/
'min-h': [{
'min-h': [isArbitraryValue, spacing, 'min', 'max', 'fit', 'svh', 'lvh', 'dvh']
}],
/**
* Max-Height
* @see https://tailwindcss.com/docs/max-height
*/
'max-h': [{
'max-h': [isArbitraryValue, spacing, 'min', 'max', 'fit', 'svh', 'lvh', 'dvh']
}],
/**
* Size
* @see https://tailwindcss.com/docs/size
*/
size: [{
size: [isArbitraryValue, spacing, 'auto', 'min', 'max', 'fit']
}],
// Typography
/**
* Font Size
* @see https://tailwindcss.com/docs/font-size
*/
'font-size': [{
text: ['base', isTshirtSize, isArbitraryLength]
}],
/**
* Font Smoothing
* @see https://tailwindcss.com/docs/font-smoothing
*/
'font-smoothing': ['antialiased', 'subpixel-antialiased'],
/**
* Font Style
* @see https://tailwindcss.com/docs/font-style
*/
'font-style': ['italic', 'not-italic'],
/**
* Font Weight
* @see https://tailwindcss.com/docs/font-weight
*/
'font-weight': [{
font: ['thin', 'extralight', 'light', 'normal', 'medium', 'semibold', 'bold', 'extrabold', 'black', isArbitraryNumber]
}],
/**
* Font Family
* @see https://tailwindcss.com/docs/font-family
*/
'font-family': [{
font: [isAny]
}],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-normal': ['normal-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-ordinal': ['ordinal'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-slashed-zero': ['slashed-zero'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-figure': ['lining-nums', 'oldstyle-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-spacing': ['proportional-nums', 'tabular-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-fraction': ['diagonal-fractions', 'stacked-fractions'],
/**
* Letter Spacing
* @see https://tailwindcss.com/docs/letter-spacing
*/
tracking: [{
tracking: ['tighter', 'tight', 'normal', 'wide', 'wider', 'widest', isArbitraryValue]
}],
/**
* Line Clamp
* @see https://tailwindcss.com/docs/line-clamp
*/
'line-clamp': [{
'line-clamp': ['none', isNumber, isArbitraryNumber]
}],
/**
* Line Height
* @see https://tailwindcss.com/docs/line-height
*/
leading: [{
leading: ['none', 'tight', 'snug', 'normal', 'relaxed', 'loose', isLength, isArbitraryValue]
}],
/**
* List Style Image
* @see https://tailwindcss.com/docs/list-style-image
*/
'list-image': [{
'list-image': ['none', isArbitraryValue]
}],
/**
* List Style Type
* @see https://tailwindcss.com/docs/list-style-type
*/
'list-style-type': [{
list: ['none', 'disc', 'decimal', isArbitraryValue]
}],
/**
* List Style Position
* @see https://tailwindcss.com/docs/list-style-position
*/
'list-style-position': [{
list: ['inside', 'outside']
}],
/**
* Placeholder Color
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/placeholder-color
*/
'placeholder-color': [{
placeholder: [colors]
}],
/**
* Placeholder Opacity
* @see https://tailwindcss.com/docs/placeholder-opacity
*/
'placeholder-opacity': [{
'placeholder-opacity': [opacity]
}],
/**
* Text Alignment
* @see https://tailwindcss.com/docs/text-align
*/
'text-alignment': [{
text: ['left', 'center', 'right', 'justify', 'start', 'end']
}],
/**
* Text Color
* @see https://tailwindcss.com/docs/text-color
*/
'text-color': [{
text: [colors]
}],
/**
* Text Opacity
* @see https://tailwindcss.com/docs/text-opacity
*/
'text-opacity': [{
'text-opacity': [opacity]
}],
/**
* Text Decoration
* @see https://tailwindcss.com/docs/text-decoration
*/
'text-decoration': ['underline', 'overline', 'line-through', 'no-underline'],
/**
* Text Decoration Style
* @see https://tailwindcss.com/docs/text-decoration-style
*/
'text-decoration-style': [{
decoration: [].concat(getLineStyles(), ['wavy'])
}],
/**
* Text Decoration Thickness
* @see https://tailwindcss.com/docs/text-decoration-thickness
*/
'text-decoration-thickness': [{
decoration: ['auto', 'from-font', isLength, isArbitraryLength]
}],
/**
* Text Underline Offset
* @see https://tailwindcss.com/docs/text-underline-offset
*/
'underline-offset': [{
'underline-offset': ['auto', isLength, isArbitraryValue]
}],
/**
* Text Decoration Color
* @see https://tailwindcss.com/docs/text-decoration-color
*/
'text-decoration-color': [{
decoration: [colors]
}],
/**
* Text Transform
* @see https://tailwindcss.com/docs/text-transform
*/
'text-transform': ['uppercase', 'lowercase', 'capitalize', 'normal-case'],
/**
* Text Overflow
* @see https://tailwindcss.com/docs/text-overflow
*/
'text-overflow': ['truncate', 'text-ellipsis', 'text-clip'],
/**
* Text Wrap
* @see https://tailwindcss.com/docs/text-wrap
*/
'text-wrap': [{
text: ['wrap', 'nowrap', 'balance', 'pretty']
}],
/**
* Text Indent
* @see https://tailwindcss.com/docs/text-indent
*/
indent: [{
indent: getSpacingWithArbitrary()
}],
/**
* Vertical Alignment
* @see https://tailwindcss.com/docs/vertical-align
*/
'vertical-align': [{
align: ['baseline', 'top', 'middle', 'bottom', 'text-top', 'text-bottom', 'sub', 'super', isArbitraryValue]
}],
/**
* Whitespace
* @see https://tailwindcss.com/docs/whitespace
*/
whitespace: [{
whitespace: ['normal', 'nowrap', 'pre', 'pre-line', 'pre-wrap', 'break-spaces']
}],
/**
* Word Break
* @see https://tailwindcss.com/docs/word-break
*/
"break": [{
"break": ['normal', 'words', 'all', 'keep']
}],
/**
* Hyphens
* @see https://tailwindcss.com/docs/hyphens
*/
hyphens: [{
hyphens: ['none', 'manual', 'auto']
}],
/**
* Content
* @see https://tailwindcss.com/docs/content
*/
content: [{
content: ['none', isArbitraryValue]
}],
// Backgrounds
/**
* Background Attachment
* @see https://tailwindcss.com/docs/background-attachment
*/
'bg-attachment': [{
bg: ['fixed', 'local', 'scroll']
}],
/**
* Background Clip
* @see https://tailwindcss.com/docs/background-clip
*/
'bg-clip': [{
'bg-clip': ['border', 'padding', 'content', 'text']
}],
/**
* Background Opacity
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/background-opacity
*/
'bg-opacity': [{
'bg-opacity': [opacity]
}],
/**
* Background Origin
* @see https://tailwindcss.com/docs/background-origin
*/
'bg-origin': [{
'bg-origin': ['border', 'padding', 'content']
}],
/**
* Background Position
* @see https://tailwindcss.com/docs/background-position
*/
'bg-position': [{
bg: [].concat(getPositions(), [isArbitraryPosition])
}],
/**
* Background Repeat
* @see https://tailwindcss.com/docs/background-repeat
*/
'bg-repeat': [{
bg: ['no-repeat', {
repeat: ['', 'x', 'y', 'round', 'space']
}]
}],
/**
* Background Size
* @see https://tailwindcss.com/docs/background-size
*/
'bg-size': [{
bg: ['auto', 'cover', 'contain', isArbitrarySize]
}],
/**
* Background Image
* @see https://tailwindcss.com/docs/background-image
*/
'bg-image': [{
bg: ['none', {
'gradient-to': ['t', 'tr', 'r', 'br', 'b', 'bl', 'l', 'tl']
}, isArbitraryImage]
}],
/**
* Background Color
* @see https://tailwindcss.com/docs/background-color
*/
'bg-color': [{
bg: [colors]
}],
/**
* Gradient Color Stops From Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-from-pos': [{
from: [gradientColorStopPositions]
}],
/**
* Gradient Color Stops Via Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-via-pos': [{
via: [gradientColorStopPositions]
}],
/**
* Gradient Color Stops To Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-to-pos': [{
to: [gradientColorStopPositions]
}],
/**
* Gradient Color Stops From
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-from': [{
from: [gradientColorStops]
}],
/**
* Gradient Color Stops Via
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-via': [{
via: [gradientColorStops]
}],
/**
* Gradient Color Stops To
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-to': [{
to: [gradientColorStops]
}],
// Borders
/**
* Border Radius
* @see https://tailwindcss.com/docs/border-radius
*/
rounded: [{
rounded: [borderRadius]
}],
/**
* Border Radius Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-s': [{
'rounded-s': [borderRadius]
}],
/**
* Border Radius End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-e': [{
'rounded-e': [borderRadius]
}],
/**
* Border Radius Top
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-t': [{
'rounded-t': [borderRadius]
}],
/**
* Border Radius Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-r': [{
'rounded-r': [borderRadius]
}],
/**
* Border Radius Bottom
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-b': [{
'rounded-b': [borderRadius]
}],
/**
* Border Radius Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-l': [{
'rounded-l': [borderRadius]
}],
/**
* Border Radius Start Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-ss': [{
'rounded-ss': [borderRadius]
}],
/**
* Border Radius Start End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-se': [{
'rounded-se': [borderRadius]
}],
/**
* Border Radius End End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-ee': [{
'rounded-ee': [borderRadius]
}],
/**
* Border Radius End Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-es': [{
'rounded-es': [borderRadius]
}],
/**
* Border Radius Top Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-tl': [{
'rounded-tl': [borderRadius]
}],
/**
* Border Radius Top Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-tr': [{
'rounded-tr': [borderRadius]
}],
/**
* Border Radius Bottom Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-br': [{
'rounded-br': [borderRadius]
}],
/**
* Border Radius Bottom Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-bl': [{
'rounded-bl': [borderRadius]
}],
/**
* Border Width
* @see https://tailwindcss.com/docs/border-width
*/
'border-w': [{
border: [borderWidth]
}],
/**
* Border Width X
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-x': [{
'border-x': [borderWidth]
}],
/**
* Border Width Y
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-y': [{
'border-y': [borderWidth]
}],
/**
* Border Width Start
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-s': [{
'border-s': [borderWidth]
}],
/**
* Border Width End
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-e': [{
'border-e': [borderWidth]
}],
/**
* Border Width Top
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-t': [{
'border-t': [borderWidth]
}],
/**
* Border Width Right
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-r': [{
'border-r': [borderWidth]
}],
/**
* Border Width Bottom
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-b': [{
'border-b': [borderWidth]
}],
/**
* Border Width Left
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-l': [{
'border-l': [borderWidth]
}],
/**
* Border Opacity
* @see https://tailwindcss.com/docs/border-opacity
*/
'border-opacity': [{
'border-opacity': [opacity]
}],
/**
* Border Style
* @see https://tailwindcss.com/docs/border-style
*/
'border-style': [{
border: [].concat(getLineStyles(), ['hidden'])
}],
/**
* Divide Width X
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-x': [{
'divide-x': [borderWidth]
}],
/**
* Divide Width X Reverse
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-x-reverse': ['divide-x-reverse'],
/**
* Divide Width Y
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-y': [{
'divide-y': [borderWidth]
}],
/**
* Divide Width Y Reverse
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-y-reverse': ['divide-y-reverse'],
/**
* Divide Opacity
* @see https://tailwindcss.com/docs/divide-opacity
*/
'divide-opacity': [{
'divide-opacity': [opacity]
}],
/**
* Divide Style
* @see https://tailwindcss.com/docs/divide-style
*/
'divide-style': [{
divide: getLineStyles()
}],
/**
* Border Color
* @see https://tailwindcss.com/docs/border-color
*/
'border-color': [{
border: [borderColor]
}],
/**
* Border Color X
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-x': [{
'border-x': [borderColor]
}],
/**
* Border Color Y
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-y': [{
'border-y': [borderColor]
}],
/**
* Border Color S
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-s': [{
'border-s': [borderColor]
}],
/**
* Border Color E
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-e': [{
'border-e': [borderColor]
}],
/**
* Border Color Top
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-t': [{
'border-t': [borderColor]
}],
/**
* Border Color Right
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-r': [{
'border-r': [borderColor]
}],
/**
* Border Color Bottom
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-b': [{
'border-b': [borderColor]
}],
/**
* Border Color Left
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-l': [{
'border-l': [borderColor]
}],
/**
* Divide Color
* @see https://tailwindcss.com/docs/divide-color
*/
'divide-color': [{
divide: [borderColor]
}],
/**
* Outline Style
* @see https://tailwindcss.com/docs/outline-style
*/
'outline-style': [{
outline: [''].concat(getLineStyles())
}],
/**
* Outline Offset
* @see https://tailwindcss.com/docs/outline-offset
*/
'outline-offset': [{
'outline-offset': [isLength, isArbitraryValue]
}],
/**
* Outline Width
* @see https://tailwindcss.com/docs/outline-width
*/
'outline-w': [{
outline: [isLength, isArbitraryLength]
}],
/**
* Outline Color
* @see https://tailwindcss.com/docs/outline-color
*/
'outline-color': [{
outline: [colors]
}],
/**
* Ring Width
* @see https://tailwindcss.com/docs/ring-width
*/
'ring-w': [{
ring: getLengthWithEmptyAndArbitrary()
}],
/**
* Ring Width Inset
* @see https://tailwindcss.com/docs/ring-width
*/
'ring-w-inset': ['ring-inset'],
/**
* Ring Color
* @see https://tailwindcss.com/docs/ring-color
*/
'ring-color': [{
ring: [colors]
}],
/**
* Ring Opacity
* @see https://tailwindcss.com/docs/ring-opacity
*/
'ring-opacity': [{
'ring-opacity': [opacity]
}],
/**
* Ring Offset Width
* @see https://tailwindcss.com/docs/ring-offset-width
*/
'ring-offset-w': [{
'ring-offset': [isLength, isArbitraryLength]
}],
/**
* Ring Offset Color
* @see https://tailwindcss.com/docs/ring-offset-color
*/
'ring-offset-color': [{
'ring-offset': [colors]
}],
// Effects
/**
* Box Shadow
* @see https://tailwindcss.com/docs/box-shadow
*/
shadow: [{
shadow: ['', 'inner', 'none', isTshirtSize, isArbitraryShadow]
}],
/**
* Box Shadow Color
* @see https://tailwindcss.com/docs/box-shadow-color
*/
'shadow-color': [{
shadow: [isAny]
}],
/**
* Opacity
* @see https://tailwindcss.com/docs/opacity
*/
opacity: [{
opacity: [opacity]
}],
/**
* Mix Blend Mode
* @see https://tailwindcss.com/docs/mix-blend-mode
*/
'mix-blend': [{
'mix-blend': [].concat(getBlendModes(), ['plus-lighter', 'plus-darker'])
}],
/**
* Background Blend Mode
* @see https://tailwindcss.com/docs/background-blend-mode
*/
'bg-blend': [{
'bg-blend': getBlendModes()
}],
// Filters
/**
* Filter
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/filter
*/
filter: [{
filter: ['', 'none']
}],
/**
* Blur
* @see https://tailwindcss.com/docs/blur
*/
blur: [{
blur: [blur]
}],
/**
* Brightness
* @see https://tailwindcss.com/docs/brightness
*/
brightness: [{
brightness: [brightness]
}],
/**
* Contrast
* @see https://tailwindcss.com/docs/contrast
*/
contrast: [{
contrast: [contrast]
}],
/**
* Drop Shadow
* @see https://tailwindcss.com/docs/drop-shadow
*/
'drop-shadow': [{
'drop-shadow': ['', 'none', isTshirtSize, isArbitraryValue]
}],
/**
* Grayscale
* @see https://tailwindcss.com/docs/grayscale
*/
grayscale: [{
grayscale: [grayscale]
}],
/**
* Hue Rotate
* @see https://tailwindcss.com/docs/hue-rotate
*/
'hue-rotate': [{
'hue-rotate': [hueRotate]
}],
/**
* Invert
* @see https://tailwindcss.com/docs/invert
*/
invert: [{
invert: [invert]
}],
/**
* Saturate
* @see https://tailwindcss.com/docs/saturate
*/
saturate: [{
saturate: [saturate]
}],
/**
* Sepia
* @see https://tailwindcss.com/docs/sepia
*/
sepia: [{
sepia: [sepia]
}],
/**
* Backdrop Filter
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/backdrop-filter
*/
'backdrop-filter': [{
'backdrop-filter': ['', 'none']
}],
/**
* Backdrop Blur
* @see https://tailwindcss.com/docs/backdrop-blur
*/
'backdrop-blur': [{
'backdrop-blur': [blur]
}],
/**
* Backdrop Brightness
* @see https://tailwindcss.com/docs/backdrop-brightness
*/
'backdrop-brightness': [{
'backdrop-brightness': [brightness]
}],
/**
* Backdrop Contrast
* @see https://tailwindcss.com/docs/backdrop-contrast
*/
'backdrop-contrast': [{
'backdrop-contrast': [contrast]
}],
/**
* Backdrop Grayscale
* @see https://tailwindcss.com/docs/backdrop-grayscale
*/
'backdrop-grayscale': [{
'backdrop-grayscale': [grayscale]
}],
/**
* Backdrop Hue Rotate
* @see https://tailwindcss.com/docs/backdrop-hue-rotate
*/
'backdrop-hue-rotate': [{
'backdrop-hue-rotate': [hueRotate]
}],
/**
* Backdrop Invert
* @see https://tailwindcss.com/docs/backdrop-invert
*/
'backdrop-invert': [{
'backdrop-invert': [invert]
}],
/**
* Backdrop Opacity
* @see https://tailwindcss.com/docs/backdrop-opacity
*/
'backdrop-opacity': [{
'backdrop-opacity': [opacity]
}],
/**
* Backdrop Saturate
* @see https://tailwindcss.com/docs/backdrop-saturate
*/
'backdrop-saturate': [{
'backdrop-saturate': [saturate]
}],
/**
* Backdrop Sepia
* @see https://tailwindcss.com/docs/backdrop-sepia
*/
'backdrop-sepia': [{
'backdrop-sepia': [sepia]
}],
// Tables
/**
* Border Collapse
* @see https://tailwindcss.com/docs/border-collapse
*/
'border-collapse': [{
border: ['collapse', 'separate']
}],
/**
* Border Spacing
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing': [{
'border-spacing': [borderSpacing]
}],
/**
* Border Spacing X
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing-x': [{
'border-spacing-x': [borderSpacing]
}],
/**
* Border Spacing Y
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing-y': [{
'border-spacing-y': [borderSpacing]
}],
/**
* Table Layout
* @see https://tailwindcss.com/docs/table-layout
*/
'table-layout': [{
table: ['auto', 'fixed']
}],
/**
* Caption Side
* @see https://tailwindcss.com/docs/caption-side
*/
caption: [{
caption: ['top', 'bottom']
}],
// Transitions and Animation
/**
* Tranisition Property
* @see https://tailwindcss.com/docs/transition-property
*/
transition: [{
transition: ['none', 'all', '', 'colors', 'opacity', 'shadow', 'transform', isArbitraryValue]
}],
/**
* Transition Duration
* @see https://tailwindcss.com/docs/transition-duration
*/
duration: [{
duration: getNumberAndArbitrary()
}],
/**
* Transition Timing Function
* @see https://tailwindcss.com/docs/transition-timing-function
*/
ease: [{
ease: ['linear', 'in', 'out', 'in-out', isArbitraryValue]
}],
/**
* Transition Delay
* @see https://tailwindcss.com/docs/transition-delay
*/
delay: [{
delay: getNumberAndArbitrary()
}],
/**
* Animation
* @see https://tailwindcss.com/docs/animation
*/
animate: [{
animate: ['none', 'spin', 'ping', 'pulse', 'bounce', isArbitraryValue]
}],
// Transforms
/**
* Transform
* @see https://tailwindcss.com/docs/transform
*/
transform: [{
transform: ['', 'gpu', 'none']
}],
/**
* Scale
* @see https://tailwindcss.com/docs/scale
*/
scale: [{
scale: [scale]
}],
/**
* Scale X
* @see https://tailwindcss.com/docs/scale
*/
'scale-x': [{
'scale-x': [scale]
}],
/**
* Scale Y
* @see https://tailwindcss.com/docs/scale
*/
'scale-y': [{
'scale-y': [scale]
}],
/**
* Rotate
* @see https://tailwindcss.com/docs/rotate
*/
rotate: [{
rotate: [isInteger, isArbitraryValue]
}],
/**
* Translate X
* @see https://tailwindcss.com/docs/translate
*/
'translate-x': [{
'translate-x': [translate]
}],
/**
* Translate Y
* @see https://tailwindcss.com/docs/translate
*/
'translate-y': [{
'translate-y': [translate]
}],
/**
* Skew X
* @see https://tailwindcss.com/docs/skew
*/
'skew-x': [{
'skew-x': [skew]
}],
/**
* Skew Y
* @see https://tailwindcss.com/docs/skew
*/
'skew-y': [{
'skew-y': [skew]
}],
/**
* Transform Origin
* @see https://tailwindcss.com/docs/transform-origin
*/
'transform-origin': [{
origin: ['center', 'top', 'top-right', 'right', 'bottom-right', 'bottom', 'bottom-left', 'left', 'top-left', isArbitraryValue]
}],
// Interactivity
/**
* Accent Color
* @see https://tailwindcss.com/docs/accent-color
*/
accent: [{
accent: ['auto', colors]
}],
/**
* Appearance
* @see https://tailwindcss.com/docs/appearance
*/
appearance: [{
appearance: ['none', 'auto']
}],
/**
* Cursor
* @see https://tailwindcss.com/docs/cursor
*/
cursor: [{
cursor: ['auto', 'default', 'pointer', 'wait', 'text', 'move', 'help', 'not-allowed', 'none', 'context-menu', 'progress', 'cell', 'crosshair', 'vertical-text', 'alias', 'copy', 'no-drop', 'grab', 'grabbing', 'all-scroll', 'col-resize', 'row-resize', 'n-resize', 'e-resize', 's-resize', 'w-resize', 'ne-resize', 'nw-resize', 'se-resize', 'sw-resize', 'ew-resize', 'ns-resize', 'nesw-resize', 'nwse-resize', 'zoom-in', 'zoom-out', isArbitraryValue]
}],
/**
* Caret Color
* @see https://tailwindcss.com/docs/just-in-time-mode#caret-color-utilities
*/
'caret-color': [{
caret: [colors]
}],
/**
* Pointer Events
* @see https://tailwindcss.com/docs/pointer-events
*/
'pointer-events': [{
'pointer-events': ['none', 'auto']
}],
/**
* Resize
* @see https://tailwindcss.com/docs/resize
*/
resize: [{
resize: ['none', 'y', 'x', '']
}],
/**
* Scroll Behavior
* @see https://tailwindcss.com/docs/scroll-behavior
*/
'scroll-behavior': [{
scroll: ['auto', 'smooth']
}],
/**
* Scroll Margin
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-m': [{
'scroll-m': getSpacingWithArbitrary()
}],
/**
* Scroll Margin X
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mx': [{
'scroll-mx': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Y
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-my': [{
'scroll-my': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Start
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-ms': [{
'scroll-ms': getSpacingWithArbitrary()
}],
/**
* Scroll Margin End
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-me': [{
'scroll-me': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Top
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mt': [{
'scroll-mt': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Right
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mr': [{
'scroll-mr': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Bottom
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mb': [{
'scroll-mb': getSpacingWithArbitrary()
}],
/**
* Scroll Margin Left
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-ml': [{
'scroll-ml': getSpacingWithArbitrary()
}],
/**
* Scroll Padding
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-p': [{
'scroll-p': getSpacingWithArbitrary()
}],
/**
* Scroll Padding X
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-px': [{
'scroll-px': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Y
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-py': [{
'scroll-py': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Start
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-ps': [{
'scroll-ps': getSpacingWithArbitrary()
}],
/**
* Scroll Padding End
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pe': [{
'scroll-pe': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Top
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pt': [{
'scroll-pt': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Right
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pr': [{
'scroll-pr': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Bottom
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pb': [{
'scroll-pb': getSpacingWithArbitrary()
}],
/**
* Scroll Padding Left
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pl': [{
'scroll-pl': getSpacingWithArbitrary()
}],
/**
* Scroll Snap Align
* @see https://tailwindcss.com/docs/scroll-snap-align
*/
'snap-align': [{
snap: ['start', 'end', 'center', 'align-none']
}],
/**
* Scroll Snap Stop
* @see https://tailwindcss.com/docs/scroll-snap-stop
*/
'snap-stop': [{
snap: ['normal', 'always']
}],
/**
* Scroll Snap Type
* @see https://tailwindcss.com/docs/scroll-snap-type
*/
'snap-type': [{
snap: ['none', 'x', 'y', 'both']
}],
/**
* Scroll Snap Type Strictness
* @see https://tailwindcss.com/docs/scroll-snap-type
*/
'snap-strictness': [{
snap: ['mandatory', 'proximity']
}],
/**
* Touch Action
* @see https://tailwindcss.com/docs/touch-action
*/
touch: [{
touch: ['auto', 'none', 'manipulation']
}],
/**
* Touch Action X
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-x': [{
'touch-pan': ['x', 'left', 'right']
}],
/**
* Touch Action Y
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-y': [{
'touch-pan': ['y', 'up', 'down']
}],
/**
* Touch Action Pinch Zoom
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-pz': ['touch-pinch-zoom'],
/**
* User Select
* @see https://tailwindcss.com/docs/user-select
*/
select: [{
select: ['none', 'text', 'all', 'auto']
}],
/**
* Will Change
* @see https://tailwindcss.com/docs/will-change
*/
'will-change': [{
'will-change': ['auto', 'scroll', 'contents', 'transform', isArbitraryValue]
}],
// SVG
/**
* Fill
* @see https://tailwindcss.com/docs/fill
*/
fill: [{
fill: [colors, 'none']
}],
/**
* Stroke Width
* @see https://tailwindcss.com/docs/stroke-width
*/
'stroke-w': [{
stroke: [isLength, isArbitraryLength, isArbitraryNumber]
}],
/**
* Stroke
* @see https://tailwindcss.com/docs/stroke
*/
stroke: [{
stroke: [colors, 'none']
}],
// Accessibility
/**
* Screen Readers
* @see https://tailwindcss.com/docs/screen-readers
*/
sr: ['sr-only', 'not-sr-only'],
/**
* Forced Color Adjust
* @see https://tailwindcss.com/docs/forced-color-adjust
*/
'forced-color-adjust': [{
'forced-color-adjust': ['auto', 'none']
}]
},
conflictingClassGroups: {
overflow: ['overflow-x', 'overflow-y'],
overscroll: ['overscroll-x', 'overscroll-y'],
inset: ['inset-x', 'inset-y', 'start', 'end', 'top', 'right', 'bottom', 'left'],
'inset-x': ['right', 'left'],
'inset-y': ['top', 'bottom'],
flex: ['basis', 'grow', 'shrink'],
gap: ['gap-x', 'gap-y'],
p: ['px', 'py', 'ps', 'pe', 'pt', 'pr', 'pb', 'pl'],
px: ['pr', 'pl'],
py: ['pt', 'pb'],
m: ['mx', 'my', 'ms', 'me', 'mt', 'mr', 'mb', 'ml'],
mx: ['mr', 'ml'],
my: ['mt', 'mb'],
size: ['w', 'h'],
'font-size': ['leading'],
'fvn-normal': ['fvn-ordinal', 'fvn-slashed-zero', 'fvn-figure', 'fvn-spacing', 'fvn-fraction'],
'fvn-ordinal': ['fvn-normal'],
'fvn-slashed-zero': ['fvn-normal'],
'fvn-figure': ['fvn-normal'],
'fvn-spacing': ['fvn-normal'],
'fvn-fraction': ['fvn-normal'],
'line-clamp': ['display', 'overflow'],
rounded: ['rounded-s', 'rounded-e', 'rounded-t', 'rounded-r', 'rounded-b', 'rounded-l', 'rounded-ss', 'rounded-se', 'rounded-ee', 'rounded-es', 'rounded-tl', 'rounded-tr', 'rounded-br', 'rounded-bl'],
'rounded-s': ['rounded-ss', 'rounded-es'],
'rounded-e': ['rounded-se', 'rounded-ee'],
'rounded-t': ['rounded-tl', 'rounded-tr'],
'rounded-r': ['rounded-tr', 'rounded-br'],
'rounded-b': ['rounded-br', 'rounded-bl'],
'rounded-l': ['rounded-tl', 'rounded-bl'],
'border-spacing': ['border-spacing-x', 'border-spacing-y'],
'border-w': ['border-w-s', 'border-w-e', 'border-w-t', 'border-w-r', 'border-w-b', 'border-w-l'],
'border-w-x': ['border-w-r', 'border-w-l'],
'border-w-y': ['border-w-t', 'border-w-b'],
'border-color': ['border-color-s', 'border-color-e', 'border-color-t', 'border-color-r', 'border-color-b', 'border-color-l'],
'border-color-x': ['border-color-r', 'border-color-l'],
'border-color-y': ['border-color-t', 'border-color-b'],
'scroll-m': ['scroll-mx', 'scroll-my', 'scroll-ms', 'scroll-me', 'scroll-mt', 'scroll-mr', 'scroll-mb', 'scroll-ml'],
'scroll-mx': ['scroll-mr', 'scroll-ml'],
'scroll-my': ['scroll-mt', 'scroll-mb'],
'scroll-p': ['scroll-px', 'scroll-py', 'scroll-ps', 'scroll-pe', 'scroll-pt', 'scroll-pr', 'scroll-pb', 'scroll-pl'],
'scroll-px': ['scroll-pr', 'scroll-pl'],
'scroll-py': ['scroll-pt', 'scroll-pb'],
touch: ['touch-x', 'touch-y', 'touch-pz'],
'touch-x': ['touch'],
'touch-y': ['touch'],
'touch-pz': ['touch']
},
conflictingClassGroupModifiers: {
'font-size': ['leading']
}
};
};
/**
* @param baseConfig Config where other config will be merged into. This object will be mutated.
* @param configExtension Partial config to merge into the `baseConfig`.
*/
var mergeConfigs = function mergeConfigs(baseConfig, _ref6) {
var cacheSize = _ref6.cacheSize,
prefix = _ref6.prefix,
separator = _ref6.separator,
experimentalParseClassName = _ref6.experimentalParseClassName,
_ref6$extend = _ref6.extend,
extend = _ref6$extend === void 0 ? {} : _ref6$extend,
_ref6$override = _ref6.override,
override = _ref6$override === void 0 ? {} : _ref6$override;
overrideProperty(baseConfig, 'cacheSize', cacheSize);
overrideProperty(baseConfig, 'prefix', prefix);
overrideProperty(baseConfig, 'separator', separator);
overrideProperty(baseConfig, 'experimentalParseClassName', experimentalParseClassName);
for (var configKey in override) {
overrideConfigProperties(baseConfig[configKey], override[configKey]);
}
for (var key in extend) {
mergeConfigProperties(baseConfig[key], extend[key]);
}
return baseConfig;
};
var overrideProperty = function overrideProperty(baseObject, overrideKey, overrideValue) {
if (overrideValue !== undefined) {
baseObject[overrideKey] = overrideValue;
}
};
var overrideConfigProperties = function overrideConfigProperties(baseObject, overrideObject) {
if (overrideObject) {
for (var key in overrideObject) {
overrideProperty(baseObject, key, overrideObject[key]);
}
}
};
var mergeConfigProperties = function mergeConfigProperties(baseObject, mergeObject) {
if (mergeObject) {
for (var key in mergeObject) {
var mergeValue = mergeObject[key];
if (mergeValue !== undefined) {
baseObject[key] = (baseObject[key] || []).concat(mergeValue);
}
}
}
};
var extendTailwindMerge = function extendTailwindMerge(configExtension) {
for (var _len2 = arguments.length, createConfig = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
createConfig[_key2 - 1] = arguments[_key2];
}
return typeof configExtension === 'function' ? createTailwindMerge.apply(void 0, [getDefaultConfig, configExtension].concat(createConfig)) : createTailwindMerge.apply(void 0, [function () {
return mergeConfigs(getDefaultConfig(), configExtension);
}].concat(createConfig));
};
var twMerge = /*#__PURE__*/createTailwindMerge(getDefaultConfig);
export { createTailwindMerge, extendTailwindMerge, fromTheme, getDefaultConfig, mergeConfigs, twJoin, twMerge, validators };
//# sourceMappingURL=bundle-mjs.mjs.map
File diff suppressed because one or more lines are too long
+2234
View File
@@ -0,0 +1,2234 @@
/**
* The code in this file is copied from https://github.com/lukeed/clsx and modified to suit the needs of tailwind-merge better.
*
* Specifically:
* - Runtime code from https://github.com/lukeed/clsx/blob/v1.2.1/src/index.js
* - TypeScript types from https://github.com/lukeed/clsx/blob/v1.2.1/clsx.d.ts
*
* Original code has MIT license: Copyright (c) Luke Edwards <luke.edwards05@gmail.com> (lukeed.com)
*/
type ClassNameValue = ClassNameArray | string | null | undefined | 0 | 0n | false;
type ClassNameArray = ClassNameValue[];
declare function twJoin(...classLists: ClassNameValue[]): string;
/**
* Type the tailwind-merge configuration adheres to.
*/
interface Config<ClassGroupIds extends string, ThemeGroupIds extends string> extends ConfigStaticPart, ConfigGroupsPart<ClassGroupIds, ThemeGroupIds> {
}
/**
* The static part of the tailwind-merge configuration. When merging multiple configurations, the properties of this interface are always overridden.
*/
interface ConfigStaticPart {
/**
* Integer indicating size of LRU cache used for memoizing results.
* - Cache might be up to twice as big as `cacheSize`
* - No cache is used for values <= 0
*/
cacheSize: number;
/**
* Prefix added to Tailwind-generated classes
* @see https://tailwindcss.com/docs/configuration#prefix
*/
prefix?: string;
/**
* Custom separator for modifiers in Tailwind classes
* @see https://tailwindcss.com/docs/configuration#separator
*/
separator: string;
/**
* Allows to customize parsing of individual classes passed to `twMerge`.
* All classes passed to `twMerge` outside of cache hits are passed to this function before it is determined whether the class is a valid Tailwind CSS class.
*
* This is an experimental feature and may introduce breaking changes in any minor version update.
*/
experimentalParseClassName?(param: ExperimentalParseClassNameParam): ExperimentalParsedClassName;
}
/**
* Type of param passed to the `experimentalParseClassName` function.
*
* This is an experimental feature and may introduce breaking changes in any minor version update.
*/
interface ExperimentalParseClassNameParam {
className: string;
parseClassName(className: string): ExperimentalParsedClassName;
}
/**
* Type of the result returned by the `experimentalParseClassName` function.
*
* This is an experimental feature and may introduce breaking changes in any minor version update.
*/
interface ExperimentalParsedClassName {
/**
* Modifiers of the class in the order they appear in the class.
*
* @example ['hover', 'dark'] // for `hover:dark:bg-gray-100`
*/
modifiers: string[];
/**
* Whether the class has an `!important` modifier.
*
* @example true // for `hover:dark:!bg-gray-100`
*/
hasImportantModifier: boolean;
/**
* Base class without preceding modifiers.
*
* @example 'bg-gray-100' // for `hover:dark:bg-gray-100`
*/
baseClassName: string;
/**
* Index position of a possible postfix modifier in the class.
* If the class has no postfix modifier, this is `undefined`.
*
* This property is prefixed with "maybe" because tailwind-merge does not know whether something is a postfix modifier or part of the base class since it's possible to configure Tailwind CSS classes which include a `/` in the base class name.
*
* If a `maybePostfixModifierPosition` is present, tailwind-merge first tries to match the `baseClassName` without the possible postfix modifier to a class group. If tht fails, it tries again with the possible postfix modifier.
*
* @example 11 // for `bg-gray-100/50`
*/
maybePostfixModifierPosition: number | undefined;
}
/**
* The dynamic part of the tailwind-merge configuration. When merging multiple configurations, the user can choose to either override or extend the properties of this interface.
*/
interface ConfigGroupsPart<ClassGroupIds extends string, ThemeGroupIds extends string> {
/**
* Theme scales used in classGroups.
* The keys are the same as in the Tailwind config but the values are sometimes defined more broadly.
*/
theme: NoInfer<ThemeObject<ThemeGroupIds>>;
/**
* Object with groups of classes.
* @example
* {
* // Creates group of classes `group`, `of` and `classes`
* 'group-id': ['group', 'of', 'classes'],
* // Creates group of classes `look-at-me-other` and `look-at-me-group`.
* 'other-group': [{ 'look-at-me': ['other', 'group']}]
* }
*/
classGroups: NoInfer<Record<ClassGroupIds, ClassGroup<ThemeGroupIds>>>;
/**
* Conflicting classes across groups.
* The key is ID of class group which creates conflict, values are IDs of class groups which receive a conflict.
* A class group ID is the key of a class group in classGroups object.
* @example { gap: ['gap-x', 'gap-y'] }
*/
conflictingClassGroups: NoInfer<Partial<Record<ClassGroupIds, readonly ClassGroupIds[]>>>;
/**
* Postfix modifiers conflicting with other class groups.
* A class group ID is the key of a class group in classGroups object.
* @example { 'font-size': ['leading'] }
*/
conflictingClassGroupModifiers: NoInfer<Partial<Record<ClassGroupIds, readonly ClassGroupIds[]>>>;
}
/**
* Type of the configuration object that can be passed to `extendTailwindMerge`.
*/
interface ConfigExtension<ClassGroupIds extends string, ThemeGroupIds extends string> extends Partial<ConfigStaticPart> {
override?: PartialPartial<ConfigGroupsPart<ClassGroupIds, ThemeGroupIds>>;
extend?: PartialPartial<ConfigGroupsPart<ClassGroupIds, ThemeGroupIds>>;
}
type PartialPartial<T> = {
[P in keyof T]?: Partial<T[P]>;
};
type ThemeObject<ThemeGroupIds extends string> = Record<ThemeGroupIds, ClassGroup<ThemeGroupIds>>;
type ClassGroup<ThemeGroupIds extends string> = readonly ClassDefinition<ThemeGroupIds>[];
type ClassDefinition<ThemeGroupIds extends string> = string | ClassValidator | ThemeGetter | ClassObject<ThemeGroupIds>;
type ClassValidator = (classPart: string) => boolean;
interface ThemeGetter {
(theme: ThemeObject<AnyThemeGroupIds>): ClassGroup<AnyClassGroupIds>;
isThemeGetter: true;
}
type ClassObject<ThemeGroupIds extends string> = Record<string, readonly ClassDefinition<ThemeGroupIds>[]>;
/**
* Hack from https://stackoverflow.com/questions/56687668/a-way-to-disable-type-argument-inference-in-generics/56688073#56688073
*
* Could be replaced with NoInfer utility type from TypeScript (https://www.typescriptlang.org/docs/handbook/utility-types.html#noinfertype), but that is only supported in TypeScript 5.4 or higher, so I should wait some time before using it.
*/
type NoInfer<T> = [T][T extends any ? 0 : never];
/**
* Theme group IDs included in the default configuration of tailwind-merge.
*
* If you want to use a scale that is not supported in the `ThemeObject` type,
* consider using `classGroups` instead of `theme`.
*
* @see https://github.com/dcastil/tailwind-merge/blob/main/docs/configuration.md#theme
* (the list of supported keys may vary between `tailwind-merge` versions)
*/
type DefaultThemeGroupIds = 'blur' | 'borderColor' | 'borderRadius' | 'borderSpacing' | 'borderWidth' | 'brightness' | 'colors' | 'contrast' | 'gap' | 'gradientColorStopPositions' | 'gradientColorStops' | 'grayscale' | 'hueRotate' | 'inset' | 'invert' | 'margin' | 'opacity' | 'padding' | 'saturate' | 'scale' | 'sepia' | 'skew' | 'space' | 'spacing' | 'translate';
/**
* Class group IDs included in the default configuration of tailwind-merge.
*/
type DefaultClassGroupIds = 'accent' | 'align-content' | 'align-items' | 'align-self' | 'animate' | 'appearance' | 'aspect' | 'auto-cols' | 'auto-rows' | 'backdrop-blur' | 'backdrop-brightness' | 'backdrop-contrast' | 'backdrop-filter' | 'backdrop-grayscale' | 'backdrop-hue-rotate' | 'backdrop-invert' | 'backdrop-opacity' | 'backdrop-saturate' | 'backdrop-sepia' | 'basis' | 'bg-attachment' | 'bg-blend' | 'bg-clip' | 'bg-color' | 'bg-image' | 'bg-opacity' | 'bg-origin' | 'bg-position' | 'bg-repeat' | 'bg-size' | 'blur' | 'border-collapse' | 'border-color-b' | 'border-color-e' | 'border-color-l' | 'border-color-r' | 'border-color-s' | 'border-color-t' | 'border-color-x' | 'border-color-y' | 'border-color' | 'border-opacity' | 'border-spacing-x' | 'border-spacing-y' | 'border-spacing' | 'border-style' | 'border-w-b' | 'border-w-e' | 'border-w-l' | 'border-w-r' | 'border-w-s' | 'border-w-t' | 'border-w-x' | 'border-w-y' | 'border-w' | 'bottom' | 'box-decoration' | 'box' | 'break-after' | 'break-before' | 'break-inside' | 'break' | 'brightness' | 'caption' | 'caret-color' | 'clear' | 'col-end' | 'col-start-end' | 'col-start' | 'columns' | 'container' | 'content' | 'contrast' | 'cursor' | 'delay' | 'display' | 'divide-color' | 'divide-opacity' | 'divide-style' | 'divide-x-reverse' | 'divide-x' | 'divide-y-reverse' | 'divide-y' | 'drop-shadow' | 'duration' | 'ease' | 'end' | 'fill' | 'filter' | 'flex-direction' | 'flex-wrap' | 'flex' | 'float' | 'font-family' | 'font-size' | 'font-smoothing' | 'font-style' | 'font-weight' | 'forced-color-adjust' | 'fvn-figure' | 'fvn-fraction' | 'fvn-normal' | 'fvn-ordinal' | 'fvn-slashed-zero' | 'fvn-spacing' | 'gap-x' | 'gap-y' | 'gap' | 'gradient-from-pos' | 'gradient-from' | 'gradient-to-pos' | 'gradient-to' | 'gradient-via-pos' | 'gradient-via' | 'grayscale' | 'grid-cols' | 'grid-flow' | 'grid-rows' | 'grow' | 'h' | 'hue-rotate' | 'hyphens' | 'indent' | 'inset-x' | 'inset-y' | 'inset' | 'invert' | 'isolation' | 'justify-content' | 'justify-items' | 'justify-self' | 'leading' | 'left' | 'line-clamp' | 'list-image' | 'list-style-position' | 'list-style-type' | 'm' | 'max-h' | 'max-w' | 'mb' | 'me' | 'min-h' | 'min-w' | 'mix-blend' | 'ml' | 'mr' | 'ms' | 'mt' | 'mx' | 'my' | 'object-fit' | 'object-position' | 'opacity' | 'order' | 'outline-color' | 'outline-offset' | 'outline-style' | 'outline-w' | 'overflow-x' | 'overflow-y' | 'overflow' | 'overscroll-x' | 'overscroll-y' | 'overscroll' | 'p' | 'pb' | 'pe' | 'pl' | 'place-content' | 'place-items' | 'place-self' | 'placeholder-color' | 'placeholder-opacity' | 'pointer-events' | 'position' | 'pr' | 'ps' | 'pt' | 'px' | 'py' | 'resize' | 'right' | 'ring-color' | 'ring-offset-color' | 'ring-offset-w' | 'ring-opacity' | 'ring-w-inset' | 'ring-w' | 'rotate' | 'rounded-b' | 'rounded-bl' | 'rounded-br' | 'rounded-e' | 'rounded-ee' | 'rounded-es' | 'rounded-l' | 'rounded-r' | 'rounded-s' | 'rounded-se' | 'rounded-ss' | 'rounded-t' | 'rounded-tl' | 'rounded-tr' | 'rounded' | 'row-end' | 'row-start-end' | 'row-start' | 'saturate' | 'scale-x' | 'scale-y' | 'scale' | 'scroll-behavior' | 'scroll-m' | 'scroll-mb' | 'scroll-me' | 'scroll-ml' | 'scroll-mr' | 'scroll-ms' | 'scroll-mt' | 'scroll-mx' | 'scroll-my' | 'scroll-p' | 'scroll-pb' | 'scroll-pe' | 'scroll-pl' | 'scroll-pr' | 'scroll-ps' | 'scroll-pt' | 'scroll-px' | 'scroll-py' | 'select' | 'sepia' | 'shadow-color' | 'shadow' | 'shrink' | 'size' | 'skew-x' | 'skew-y' | 'snap-align' | 'snap-stop' | 'snap-strictness' | 'snap-type' | 'space-x-reverse' | 'space-x' | 'space-y-reverse' | 'space-y' | 'sr' | 'start' | 'stroke-w' | 'stroke' | 'table-layout' | 'text-alignment' | 'text-color' | 'text-decoration-color' | 'text-decoration-style' | 'text-decoration-thickness' | 'text-decoration' | 'text-opacity' | 'text-overflow' | 'text-transform' | 'text-wrap' | 'top' | 'touch-pz' | 'touch-x' | 'touch-y' | 'touch' | 'tracking' | 'transform-origin' | 'transform' | 'transition' | 'translate-x' | 'translate-y' | 'underline-offset' | 'vertical-align' | 'visibility' | 'w' | 'whitespace' | 'will-change' | 'z';
type AnyClassGroupIds = string;
type AnyThemeGroupIds = string;
/**
* type of the tailwind-merge configuration that allows for any possible configuration.
*/
type AnyConfig = Config<AnyClassGroupIds, AnyThemeGroupIds>;
type CreateConfigFirst = () => AnyConfig;
type CreateConfigSubsequent$1 = (config: AnyConfig) => AnyConfig;
type TailwindMerge = (...classLists: ClassNameValue[]) => string;
declare function createTailwindMerge(createConfigFirst: CreateConfigFirst, ...createConfigRest: CreateConfigSubsequent$1[]): TailwindMerge;
declare const getDefaultConfig: () => {
readonly cacheSize: 500;
readonly separator: ":";
readonly theme: {
readonly colors: readonly [() => boolean];
readonly spacing: readonly [(value: string) => boolean, (value: string) => boolean];
readonly blur: readonly ["none", "", (value: string) => boolean, (value: string) => boolean];
readonly brightness: ((value: string) => boolean)[];
readonly borderColor: readonly [ThemeGetter];
readonly borderRadius: readonly ["none", "", "full", (value: string) => boolean, (value: string) => boolean];
readonly borderSpacing: readonly [(value: string) => boolean, ThemeGetter];
readonly borderWidth: readonly ["", (value: string) => boolean, (value: string) => boolean];
readonly contrast: ((value: string) => boolean)[];
readonly grayscale: readonly ["", "0", (value: string) => boolean];
readonly hueRotate: ((value: string) => boolean)[];
readonly invert: readonly ["", "0", (value: string) => boolean];
readonly gap: readonly [(value: string) => boolean, ThemeGetter];
readonly gradientColorStops: readonly [ThemeGetter];
readonly gradientColorStopPositions: readonly [(value: string) => boolean, (value: string) => boolean];
readonly inset: readonly ["auto", (value: string) => boolean, ThemeGetter];
readonly margin: readonly ["auto", (value: string) => boolean, ThemeGetter];
readonly opacity: ((value: string) => boolean)[];
readonly padding: readonly [(value: string) => boolean, ThemeGetter];
readonly saturate: ((value: string) => boolean)[];
readonly scale: ((value: string) => boolean)[];
readonly sepia: readonly ["", "0", (value: string) => boolean];
readonly skew: ((value: string) => boolean)[];
readonly space: readonly [(value: string) => boolean, ThemeGetter];
readonly translate: readonly [(value: string) => boolean, ThemeGetter];
};
readonly classGroups: {
/**
* Aspect Ratio
* @see https://tailwindcss.com/docs/aspect-ratio
*/
readonly aspect: readonly [{
readonly aspect: readonly ["auto", "square", "video", (value: string) => boolean];
}];
/**
* Container
* @see https://tailwindcss.com/docs/container
*/
readonly container: readonly ["container"];
/**
* Columns
* @see https://tailwindcss.com/docs/columns
*/
readonly columns: readonly [{
readonly columns: readonly [(value: string) => boolean];
}];
/**
* Break After
* @see https://tailwindcss.com/docs/break-after
*/
readonly 'break-after': readonly [{
readonly 'break-after': readonly ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"];
}];
/**
* Break Before
* @see https://tailwindcss.com/docs/break-before
*/
readonly 'break-before': readonly [{
readonly 'break-before': readonly ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"];
}];
/**
* Break Inside
* @see https://tailwindcss.com/docs/break-inside
*/
readonly 'break-inside': readonly [{
readonly 'break-inside': readonly ["auto", "avoid", "avoid-page", "avoid-column"];
}];
/**
* Box Decoration Break
* @see https://tailwindcss.com/docs/box-decoration-break
*/
readonly 'box-decoration': readonly [{
readonly 'box-decoration': readonly ["slice", "clone"];
}];
/**
* Box Sizing
* @see https://tailwindcss.com/docs/box-sizing
*/
readonly box: readonly [{
readonly box: readonly ["border", "content"];
}];
/**
* Display
* @see https://tailwindcss.com/docs/display
*/
readonly display: readonly ["block", "inline-block", "inline", "flex", "inline-flex", "table", "inline-table", "table-caption", "table-cell", "table-column", "table-column-group", "table-footer-group", "table-header-group", "table-row-group", "table-row", "flow-root", "grid", "inline-grid", "contents", "list-item", "hidden"];
/**
* Floats
* @see https://tailwindcss.com/docs/float
*/
readonly float: readonly [{
readonly float: readonly ["right", "left", "none", "start", "end"];
}];
/**
* Clear
* @see https://tailwindcss.com/docs/clear
*/
readonly clear: readonly [{
readonly clear: readonly ["left", "right", "both", "none", "start", "end"];
}];
/**
* Isolation
* @see https://tailwindcss.com/docs/isolation
*/
readonly isolation: readonly ["isolate", "isolation-auto"];
/**
* Object Fit
* @see https://tailwindcss.com/docs/object-fit
*/
readonly 'object-fit': readonly [{
readonly object: readonly ["contain", "cover", "fill", "none", "scale-down"];
}];
/**
* Object Position
* @see https://tailwindcss.com/docs/object-position
*/
readonly 'object-position': readonly [{
readonly object: readonly ["bottom", "center", "left", "left-bottom", "left-top", "right", "right-bottom", "right-top", "top", (value: string) => boolean];
}];
/**
* Overflow
* @see https://tailwindcss.com/docs/overflow
*/
readonly overflow: readonly [{
readonly overflow: readonly ["auto", "hidden", "clip", "visible", "scroll"];
}];
/**
* Overflow X
* @see https://tailwindcss.com/docs/overflow
*/
readonly 'overflow-x': readonly [{
readonly 'overflow-x': readonly ["auto", "hidden", "clip", "visible", "scroll"];
}];
/**
* Overflow Y
* @see https://tailwindcss.com/docs/overflow
*/
readonly 'overflow-y': readonly [{
readonly 'overflow-y': readonly ["auto", "hidden", "clip", "visible", "scroll"];
}];
/**
* Overscroll Behavior
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
readonly overscroll: readonly [{
readonly overscroll: readonly ["auto", "contain", "none"];
}];
/**
* Overscroll Behavior X
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
readonly 'overscroll-x': readonly [{
readonly 'overscroll-x': readonly ["auto", "contain", "none"];
}];
/**
* Overscroll Behavior Y
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
readonly 'overscroll-y': readonly [{
readonly 'overscroll-y': readonly ["auto", "contain", "none"];
}];
/**
* Position
* @see https://tailwindcss.com/docs/position
*/
readonly position: readonly ["static", "fixed", "absolute", "relative", "sticky"];
/**
* Top / Right / Bottom / Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
readonly inset: readonly [{
readonly inset: readonly [ThemeGetter];
}];
/**
* Right / Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
readonly 'inset-x': readonly [{
readonly 'inset-x': readonly [ThemeGetter];
}];
/**
* Top / Bottom
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
readonly 'inset-y': readonly [{
readonly 'inset-y': readonly [ThemeGetter];
}];
/**
* Start
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
readonly start: readonly [{
readonly start: readonly [ThemeGetter];
}];
/**
* End
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
readonly end: readonly [{
readonly end: readonly [ThemeGetter];
}];
/**
* Top
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
readonly top: readonly [{
readonly top: readonly [ThemeGetter];
}];
/**
* Right
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
readonly right: readonly [{
readonly right: readonly [ThemeGetter];
}];
/**
* Bottom
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
readonly bottom: readonly [{
readonly bottom: readonly [ThemeGetter];
}];
/**
* Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
readonly left: readonly [{
readonly left: readonly [ThemeGetter];
}];
/**
* Visibility
* @see https://tailwindcss.com/docs/visibility
*/
readonly visibility: readonly ["visible", "invisible", "collapse"];
/**
* Z-Index
* @see https://tailwindcss.com/docs/z-index
*/
readonly z: readonly [{
readonly z: readonly ["auto", (value: string) => boolean, (value: string) => boolean];
}];
/**
* Flex Basis
* @see https://tailwindcss.com/docs/flex-basis
*/
readonly basis: readonly [{
readonly basis: readonly ["auto", (value: string) => boolean, ThemeGetter];
}];
/**
* Flex Direction
* @see https://tailwindcss.com/docs/flex-direction
*/
readonly 'flex-direction': readonly [{
readonly flex: readonly ["row", "row-reverse", "col", "col-reverse"];
}];
/**
* Flex Wrap
* @see https://tailwindcss.com/docs/flex-wrap
*/
readonly 'flex-wrap': readonly [{
readonly flex: readonly ["wrap", "wrap-reverse", "nowrap"];
}];
/**
* Flex
* @see https://tailwindcss.com/docs/flex
*/
readonly flex: readonly [{
readonly flex: readonly ["1", "auto", "initial", "none", (value: string) => boolean];
}];
/**
* Flex Grow
* @see https://tailwindcss.com/docs/flex-grow
*/
readonly grow: readonly [{
readonly grow: readonly ["", "0", (value: string) => boolean];
}];
/**
* Flex Shrink
* @see https://tailwindcss.com/docs/flex-shrink
*/
readonly shrink: readonly [{
readonly shrink: readonly ["", "0", (value: string) => boolean];
}];
/**
* Order
* @see https://tailwindcss.com/docs/order
*/
readonly order: readonly [{
readonly order: readonly ["first", "last", "none", (value: string) => boolean, (value: string) => boolean];
}];
/**
* Grid Template Columns
* @see https://tailwindcss.com/docs/grid-template-columns
*/
readonly 'grid-cols': readonly [{
readonly 'grid-cols': readonly [() => boolean];
}];
/**
* Grid Column Start / End
* @see https://tailwindcss.com/docs/grid-column
*/
readonly 'col-start-end': readonly [{
readonly col: readonly ["auto", {
readonly span: readonly ["full", (value: string) => boolean, (value: string) => boolean];
}, (value: string) => boolean];
}];
/**
* Grid Column Start
* @see https://tailwindcss.com/docs/grid-column
*/
readonly 'col-start': readonly [{
readonly 'col-start': readonly ["auto", (value: string) => boolean, (value: string) => boolean];
}];
/**
* Grid Column End
* @see https://tailwindcss.com/docs/grid-column
*/
readonly 'col-end': readonly [{
readonly 'col-end': readonly ["auto", (value: string) => boolean, (value: string) => boolean];
}];
/**
* Grid Template Rows
* @see https://tailwindcss.com/docs/grid-template-rows
*/
readonly 'grid-rows': readonly [{
readonly 'grid-rows': readonly [() => boolean];
}];
/**
* Grid Row Start / End
* @see https://tailwindcss.com/docs/grid-row
*/
readonly 'row-start-end': readonly [{
readonly row: readonly ["auto", {
readonly span: readonly [(value: string) => boolean, (value: string) => boolean];
}, (value: string) => boolean];
}];
/**
* Grid Row Start
* @see https://tailwindcss.com/docs/grid-row
*/
readonly 'row-start': readonly [{
readonly 'row-start': readonly ["auto", (value: string) => boolean, (value: string) => boolean];
}];
/**
* Grid Row End
* @see https://tailwindcss.com/docs/grid-row
*/
readonly 'row-end': readonly [{
readonly 'row-end': readonly ["auto", (value: string) => boolean, (value: string) => boolean];
}];
/**
* Grid Auto Flow
* @see https://tailwindcss.com/docs/grid-auto-flow
*/
readonly 'grid-flow': readonly [{
readonly 'grid-flow': readonly ["row", "col", "dense", "row-dense", "col-dense"];
}];
/**
* Grid Auto Columns
* @see https://tailwindcss.com/docs/grid-auto-columns
*/
readonly 'auto-cols': readonly [{
readonly 'auto-cols': readonly ["auto", "min", "max", "fr", (value: string) => boolean];
}];
/**
* Grid Auto Rows
* @see https://tailwindcss.com/docs/grid-auto-rows
*/
readonly 'auto-rows': readonly [{
readonly 'auto-rows': readonly ["auto", "min", "max", "fr", (value: string) => boolean];
}];
/**
* Gap
* @see https://tailwindcss.com/docs/gap
*/
readonly gap: readonly [{
readonly gap: readonly [ThemeGetter];
}];
/**
* Gap X
* @see https://tailwindcss.com/docs/gap
*/
readonly 'gap-x': readonly [{
readonly 'gap-x': readonly [ThemeGetter];
}];
/**
* Gap Y
* @see https://tailwindcss.com/docs/gap
*/
readonly 'gap-y': readonly [{
readonly 'gap-y': readonly [ThemeGetter];
}];
/**
* Justify Content
* @see https://tailwindcss.com/docs/justify-content
*/
readonly 'justify-content': readonly [{
readonly justify: readonly ["normal", "start", "end", "center", "between", "around", "evenly", "stretch"];
}];
/**
* Justify Items
* @see https://tailwindcss.com/docs/justify-items
*/
readonly 'justify-items': readonly [{
readonly 'justify-items': readonly ["start", "end", "center", "stretch"];
}];
/**
* Justify Self
* @see https://tailwindcss.com/docs/justify-self
*/
readonly 'justify-self': readonly [{
readonly 'justify-self': readonly ["auto", "start", "end", "center", "stretch"];
}];
/**
* Align Content
* @see https://tailwindcss.com/docs/align-content
*/
readonly 'align-content': readonly [{
readonly content: readonly ["normal", "start", "end", "center", "between", "around", "evenly", "stretch", "baseline"];
}];
/**
* Align Items
* @see https://tailwindcss.com/docs/align-items
*/
readonly 'align-items': readonly [{
readonly items: readonly ["start", "end", "center", "baseline", "stretch"];
}];
/**
* Align Self
* @see https://tailwindcss.com/docs/align-self
*/
readonly 'align-self': readonly [{
readonly self: readonly ["auto", "start", "end", "center", "stretch", "baseline"];
}];
/**
* Place Content
* @see https://tailwindcss.com/docs/place-content
*/
readonly 'place-content': readonly [{
readonly 'place-content': readonly ["start", "end", "center", "between", "around", "evenly", "stretch", "baseline"];
}];
/**
* Place Items
* @see https://tailwindcss.com/docs/place-items
*/
readonly 'place-items': readonly [{
readonly 'place-items': readonly ["start", "end", "center", "baseline", "stretch"];
}];
/**
* Place Self
* @see https://tailwindcss.com/docs/place-self
*/
readonly 'place-self': readonly [{
readonly 'place-self': readonly ["auto", "start", "end", "center", "stretch"];
}];
/**
* Padding
* @see https://tailwindcss.com/docs/padding
*/
readonly p: readonly [{
readonly p: readonly [ThemeGetter];
}];
/**
* Padding X
* @see https://tailwindcss.com/docs/padding
*/
readonly px: readonly [{
readonly px: readonly [ThemeGetter];
}];
/**
* Padding Y
* @see https://tailwindcss.com/docs/padding
*/
readonly py: readonly [{
readonly py: readonly [ThemeGetter];
}];
/**
* Padding Start
* @see https://tailwindcss.com/docs/padding
*/
readonly ps: readonly [{
readonly ps: readonly [ThemeGetter];
}];
/**
* Padding End
* @see https://tailwindcss.com/docs/padding
*/
readonly pe: readonly [{
readonly pe: readonly [ThemeGetter];
}];
/**
* Padding Top
* @see https://tailwindcss.com/docs/padding
*/
readonly pt: readonly [{
readonly pt: readonly [ThemeGetter];
}];
/**
* Padding Right
* @see https://tailwindcss.com/docs/padding
*/
readonly pr: readonly [{
readonly pr: readonly [ThemeGetter];
}];
/**
* Padding Bottom
* @see https://tailwindcss.com/docs/padding
*/
readonly pb: readonly [{
readonly pb: readonly [ThemeGetter];
}];
/**
* Padding Left
* @see https://tailwindcss.com/docs/padding
*/
readonly pl: readonly [{
readonly pl: readonly [ThemeGetter];
}];
/**
* Margin
* @see https://tailwindcss.com/docs/margin
*/
readonly m: readonly [{
readonly m: readonly [ThemeGetter];
}];
/**
* Margin X
* @see https://tailwindcss.com/docs/margin
*/
readonly mx: readonly [{
readonly mx: readonly [ThemeGetter];
}];
/**
* Margin Y
* @see https://tailwindcss.com/docs/margin
*/
readonly my: readonly [{
readonly my: readonly [ThemeGetter];
}];
/**
* Margin Start
* @see https://tailwindcss.com/docs/margin
*/
readonly ms: readonly [{
readonly ms: readonly [ThemeGetter];
}];
/**
* Margin End
* @see https://tailwindcss.com/docs/margin
*/
readonly me: readonly [{
readonly me: readonly [ThemeGetter];
}];
/**
* Margin Top
* @see https://tailwindcss.com/docs/margin
*/
readonly mt: readonly [{
readonly mt: readonly [ThemeGetter];
}];
/**
* Margin Right
* @see https://tailwindcss.com/docs/margin
*/
readonly mr: readonly [{
readonly mr: readonly [ThemeGetter];
}];
/**
* Margin Bottom
* @see https://tailwindcss.com/docs/margin
*/
readonly mb: readonly [{
readonly mb: readonly [ThemeGetter];
}];
/**
* Margin Left
* @see https://tailwindcss.com/docs/margin
*/
readonly ml: readonly [{
readonly ml: readonly [ThemeGetter];
}];
/**
* Space Between X
* @see https://tailwindcss.com/docs/space
*/
readonly 'space-x': readonly [{
readonly 'space-x': readonly [ThemeGetter];
}];
/**
* Space Between X Reverse
* @see https://tailwindcss.com/docs/space
*/
readonly 'space-x-reverse': readonly ["space-x-reverse"];
/**
* Space Between Y
* @see https://tailwindcss.com/docs/space
*/
readonly 'space-y': readonly [{
readonly 'space-y': readonly [ThemeGetter];
}];
/**
* Space Between Y Reverse
* @see https://tailwindcss.com/docs/space
*/
readonly 'space-y-reverse': readonly ["space-y-reverse"];
/**
* Width
* @see https://tailwindcss.com/docs/width
*/
readonly w: readonly [{
readonly w: readonly ["auto", "min", "max", "fit", "svw", "lvw", "dvw", (value: string) => boolean, ThemeGetter];
}];
/**
* Min-Width
* @see https://tailwindcss.com/docs/min-width
*/
readonly 'min-w': readonly [{
readonly 'min-w': readonly [(value: string) => boolean, ThemeGetter, "min", "max", "fit"];
}];
/**
* Max-Width
* @see https://tailwindcss.com/docs/max-width
*/
readonly 'max-w': readonly [{
readonly 'max-w': readonly [(value: string) => boolean, ThemeGetter, "none", "full", "min", "max", "fit", "prose", {
readonly screen: readonly [(value: string) => boolean];
}, (value: string) => boolean];
}];
/**
* Height
* @see https://tailwindcss.com/docs/height
*/
readonly h: readonly [{
readonly h: readonly [(value: string) => boolean, ThemeGetter, "auto", "min", "max", "fit", "svh", "lvh", "dvh"];
}];
/**
* Min-Height
* @see https://tailwindcss.com/docs/min-height
*/
readonly 'min-h': readonly [{
readonly 'min-h': readonly [(value: string) => boolean, ThemeGetter, "min", "max", "fit", "svh", "lvh", "dvh"];
}];
/**
* Max-Height
* @see https://tailwindcss.com/docs/max-height
*/
readonly 'max-h': readonly [{
readonly 'max-h': readonly [(value: string) => boolean, ThemeGetter, "min", "max", "fit", "svh", "lvh", "dvh"];
}];
/**
* Size
* @see https://tailwindcss.com/docs/size
*/
readonly size: readonly [{
readonly size: readonly [(value: string) => boolean, ThemeGetter, "auto", "min", "max", "fit"];
}];
/**
* Font Size
* @see https://tailwindcss.com/docs/font-size
*/
readonly 'font-size': readonly [{
readonly text: readonly ["base", (value: string) => boolean, (value: string) => boolean];
}];
/**
* Font Smoothing
* @see https://tailwindcss.com/docs/font-smoothing
*/
readonly 'font-smoothing': readonly ["antialiased", "subpixel-antialiased"];
/**
* Font Style
* @see https://tailwindcss.com/docs/font-style
*/
readonly 'font-style': readonly ["italic", "not-italic"];
/**
* Font Weight
* @see https://tailwindcss.com/docs/font-weight
*/
readonly 'font-weight': readonly [{
readonly font: readonly ["thin", "extralight", "light", "normal", "medium", "semibold", "bold", "extrabold", "black", (value: string) => boolean];
}];
/**
* Font Family
* @see https://tailwindcss.com/docs/font-family
*/
readonly 'font-family': readonly [{
readonly font: readonly [() => boolean];
}];
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
readonly 'fvn-normal': readonly ["normal-nums"];
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
readonly 'fvn-ordinal': readonly ["ordinal"];
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
readonly 'fvn-slashed-zero': readonly ["slashed-zero"];
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
readonly 'fvn-figure': readonly ["lining-nums", "oldstyle-nums"];
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
readonly 'fvn-spacing': readonly ["proportional-nums", "tabular-nums"];
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
readonly 'fvn-fraction': readonly ["diagonal-fractions", "stacked-fractions"];
/**
* Letter Spacing
* @see https://tailwindcss.com/docs/letter-spacing
*/
readonly tracking: readonly [{
readonly tracking: readonly ["tighter", "tight", "normal", "wide", "wider", "widest", (value: string) => boolean];
}];
/**
* Line Clamp
* @see https://tailwindcss.com/docs/line-clamp
*/
readonly 'line-clamp': readonly [{
readonly 'line-clamp': readonly ["none", (value: string) => boolean, (value: string) => boolean];
}];
/**
* Line Height
* @see https://tailwindcss.com/docs/line-height
*/
readonly leading: readonly [{
readonly leading: readonly ["none", "tight", "snug", "normal", "relaxed", "loose", (value: string) => boolean, (value: string) => boolean];
}];
/**
* List Style Image
* @see https://tailwindcss.com/docs/list-style-image
*/
readonly 'list-image': readonly [{
readonly 'list-image': readonly ["none", (value: string) => boolean];
}];
/**
* List Style Type
* @see https://tailwindcss.com/docs/list-style-type
*/
readonly 'list-style-type': readonly [{
readonly list: readonly ["none", "disc", "decimal", (value: string) => boolean];
}];
/**
* List Style Position
* @see https://tailwindcss.com/docs/list-style-position
*/
readonly 'list-style-position': readonly [{
readonly list: readonly ["inside", "outside"];
}];
/**
* Placeholder Color
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/placeholder-color
*/
readonly 'placeholder-color': readonly [{
readonly placeholder: readonly [ThemeGetter];
}];
/**
* Placeholder Opacity
* @see https://tailwindcss.com/docs/placeholder-opacity
*/
readonly 'placeholder-opacity': readonly [{
readonly 'placeholder-opacity': readonly [ThemeGetter];
}];
/**
* Text Alignment
* @see https://tailwindcss.com/docs/text-align
*/
readonly 'text-alignment': readonly [{
readonly text: readonly ["left", "center", "right", "justify", "start", "end"];
}];
/**
* Text Color
* @see https://tailwindcss.com/docs/text-color
*/
readonly 'text-color': readonly [{
readonly text: readonly [ThemeGetter];
}];
/**
* Text Opacity
* @see https://tailwindcss.com/docs/text-opacity
*/
readonly 'text-opacity': readonly [{
readonly 'text-opacity': readonly [ThemeGetter];
}];
/**
* Text Decoration
* @see https://tailwindcss.com/docs/text-decoration
*/
readonly 'text-decoration': readonly ["underline", "overline", "line-through", "no-underline"];
/**
* Text Decoration Style
* @see https://tailwindcss.com/docs/text-decoration-style
*/
readonly 'text-decoration-style': readonly [{
readonly decoration: readonly ["solid", "dashed", "dotted", "double", "none", "wavy"];
}];
/**
* Text Decoration Thickness
* @see https://tailwindcss.com/docs/text-decoration-thickness
*/
readonly 'text-decoration-thickness': readonly [{
readonly decoration: readonly ["auto", "from-font", (value: string) => boolean, (value: string) => boolean];
}];
/**
* Text Underline Offset
* @see https://tailwindcss.com/docs/text-underline-offset
*/
readonly 'underline-offset': readonly [{
readonly 'underline-offset': readonly ["auto", (value: string) => boolean, (value: string) => boolean];
}];
/**
* Text Decoration Color
* @see https://tailwindcss.com/docs/text-decoration-color
*/
readonly 'text-decoration-color': readonly [{
readonly decoration: readonly [ThemeGetter];
}];
/**
* Text Transform
* @see https://tailwindcss.com/docs/text-transform
*/
readonly 'text-transform': readonly ["uppercase", "lowercase", "capitalize", "normal-case"];
/**
* Text Overflow
* @see https://tailwindcss.com/docs/text-overflow
*/
readonly 'text-overflow': readonly ["truncate", "text-ellipsis", "text-clip"];
/**
* Text Wrap
* @see https://tailwindcss.com/docs/text-wrap
*/
readonly 'text-wrap': readonly [{
readonly text: readonly ["wrap", "nowrap", "balance", "pretty"];
}];
/**
* Text Indent
* @see https://tailwindcss.com/docs/text-indent
*/
readonly indent: readonly [{
readonly indent: readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Vertical Alignment
* @see https://tailwindcss.com/docs/vertical-align
*/
readonly 'vertical-align': readonly [{
readonly align: readonly ["baseline", "top", "middle", "bottom", "text-top", "text-bottom", "sub", "super", (value: string) => boolean];
}];
/**
* Whitespace
* @see https://tailwindcss.com/docs/whitespace
*/
readonly whitespace: readonly [{
readonly whitespace: readonly ["normal", "nowrap", "pre", "pre-line", "pre-wrap", "break-spaces"];
}];
/**
* Word Break
* @see https://tailwindcss.com/docs/word-break
*/
readonly break: readonly [{
readonly break: readonly ["normal", "words", "all", "keep"];
}];
/**
* Hyphens
* @see https://tailwindcss.com/docs/hyphens
*/
readonly hyphens: readonly [{
readonly hyphens: readonly ["none", "manual", "auto"];
}];
/**
* Content
* @see https://tailwindcss.com/docs/content
*/
readonly content: readonly [{
readonly content: readonly ["none", (value: string) => boolean];
}];
/**
* Background Attachment
* @see https://tailwindcss.com/docs/background-attachment
*/
readonly 'bg-attachment': readonly [{
readonly bg: readonly ["fixed", "local", "scroll"];
}];
/**
* Background Clip
* @see https://tailwindcss.com/docs/background-clip
*/
readonly 'bg-clip': readonly [{
readonly 'bg-clip': readonly ["border", "padding", "content", "text"];
}];
/**
* Background Opacity
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/background-opacity
*/
readonly 'bg-opacity': readonly [{
readonly 'bg-opacity': readonly [ThemeGetter];
}];
/**
* Background Origin
* @see https://tailwindcss.com/docs/background-origin
*/
readonly 'bg-origin': readonly [{
readonly 'bg-origin': readonly ["border", "padding", "content"];
}];
/**
* Background Position
* @see https://tailwindcss.com/docs/background-position
*/
readonly 'bg-position': readonly [{
readonly bg: readonly ["bottom", "center", "left", "left-bottom", "left-top", "right", "right-bottom", "right-top", "top", (value: string) => boolean];
}];
/**
* Background Repeat
* @see https://tailwindcss.com/docs/background-repeat
*/
readonly 'bg-repeat': readonly [{
readonly bg: readonly ["no-repeat", {
readonly repeat: readonly ["", "x", "y", "round", "space"];
}];
}];
/**
* Background Size
* @see https://tailwindcss.com/docs/background-size
*/
readonly 'bg-size': readonly [{
readonly bg: readonly ["auto", "cover", "contain", (value: string) => boolean];
}];
/**
* Background Image
* @see https://tailwindcss.com/docs/background-image
*/
readonly 'bg-image': readonly [{
readonly bg: readonly ["none", {
readonly 'gradient-to': readonly ["t", "tr", "r", "br", "b", "bl", "l", "tl"];
}, (value: string) => boolean];
}];
/**
* Background Color
* @see https://tailwindcss.com/docs/background-color
*/
readonly 'bg-color': readonly [{
readonly bg: readonly [ThemeGetter];
}];
/**
* Gradient Color Stops From Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
readonly 'gradient-from-pos': readonly [{
readonly from: readonly [ThemeGetter];
}];
/**
* Gradient Color Stops Via Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
readonly 'gradient-via-pos': readonly [{
readonly via: readonly [ThemeGetter];
}];
/**
* Gradient Color Stops To Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
readonly 'gradient-to-pos': readonly [{
readonly to: readonly [ThemeGetter];
}];
/**
* Gradient Color Stops From
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
readonly 'gradient-from': readonly [{
readonly from: readonly [ThemeGetter];
}];
/**
* Gradient Color Stops Via
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
readonly 'gradient-via': readonly [{
readonly via: readonly [ThemeGetter];
}];
/**
* Gradient Color Stops To
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
readonly 'gradient-to': readonly [{
readonly to: readonly [ThemeGetter];
}];
/**
* Border Radius
* @see https://tailwindcss.com/docs/border-radius
*/
readonly rounded: readonly [{
readonly rounded: readonly [ThemeGetter];
}];
/**
* Border Radius Start
* @see https://tailwindcss.com/docs/border-radius
*/
readonly 'rounded-s': readonly [{
readonly 'rounded-s': readonly [ThemeGetter];
}];
/**
* Border Radius End
* @see https://tailwindcss.com/docs/border-radius
*/
readonly 'rounded-e': readonly [{
readonly 'rounded-e': readonly [ThemeGetter];
}];
/**
* Border Radius Top
* @see https://tailwindcss.com/docs/border-radius
*/
readonly 'rounded-t': readonly [{
readonly 'rounded-t': readonly [ThemeGetter];
}];
/**
* Border Radius Right
* @see https://tailwindcss.com/docs/border-radius
*/
readonly 'rounded-r': readonly [{
readonly 'rounded-r': readonly [ThemeGetter];
}];
/**
* Border Radius Bottom
* @see https://tailwindcss.com/docs/border-radius
*/
readonly 'rounded-b': readonly [{
readonly 'rounded-b': readonly [ThemeGetter];
}];
/**
* Border Radius Left
* @see https://tailwindcss.com/docs/border-radius
*/
readonly 'rounded-l': readonly [{
readonly 'rounded-l': readonly [ThemeGetter];
}];
/**
* Border Radius Start Start
* @see https://tailwindcss.com/docs/border-radius
*/
readonly 'rounded-ss': readonly [{
readonly 'rounded-ss': readonly [ThemeGetter];
}];
/**
* Border Radius Start End
* @see https://tailwindcss.com/docs/border-radius
*/
readonly 'rounded-se': readonly [{
readonly 'rounded-se': readonly [ThemeGetter];
}];
/**
* Border Radius End End
* @see https://tailwindcss.com/docs/border-radius
*/
readonly 'rounded-ee': readonly [{
readonly 'rounded-ee': readonly [ThemeGetter];
}];
/**
* Border Radius End Start
* @see https://tailwindcss.com/docs/border-radius
*/
readonly 'rounded-es': readonly [{
readonly 'rounded-es': readonly [ThemeGetter];
}];
/**
* Border Radius Top Left
* @see https://tailwindcss.com/docs/border-radius
*/
readonly 'rounded-tl': readonly [{
readonly 'rounded-tl': readonly [ThemeGetter];
}];
/**
* Border Radius Top Right
* @see https://tailwindcss.com/docs/border-radius
*/
readonly 'rounded-tr': readonly [{
readonly 'rounded-tr': readonly [ThemeGetter];
}];
/**
* Border Radius Bottom Right
* @see https://tailwindcss.com/docs/border-radius
*/
readonly 'rounded-br': readonly [{
readonly 'rounded-br': readonly [ThemeGetter];
}];
/**
* Border Radius Bottom Left
* @see https://tailwindcss.com/docs/border-radius
*/
readonly 'rounded-bl': readonly [{
readonly 'rounded-bl': readonly [ThemeGetter];
}];
/**
* Border Width
* @see https://tailwindcss.com/docs/border-width
*/
readonly 'border-w': readonly [{
readonly border: readonly [ThemeGetter];
}];
/**
* Border Width X
* @see https://tailwindcss.com/docs/border-width
*/
readonly 'border-w-x': readonly [{
readonly 'border-x': readonly [ThemeGetter];
}];
/**
* Border Width Y
* @see https://tailwindcss.com/docs/border-width
*/
readonly 'border-w-y': readonly [{
readonly 'border-y': readonly [ThemeGetter];
}];
/**
* Border Width Start
* @see https://tailwindcss.com/docs/border-width
*/
readonly 'border-w-s': readonly [{
readonly 'border-s': readonly [ThemeGetter];
}];
/**
* Border Width End
* @see https://tailwindcss.com/docs/border-width
*/
readonly 'border-w-e': readonly [{
readonly 'border-e': readonly [ThemeGetter];
}];
/**
* Border Width Top
* @see https://tailwindcss.com/docs/border-width
*/
readonly 'border-w-t': readonly [{
readonly 'border-t': readonly [ThemeGetter];
}];
/**
* Border Width Right
* @see https://tailwindcss.com/docs/border-width
*/
readonly 'border-w-r': readonly [{
readonly 'border-r': readonly [ThemeGetter];
}];
/**
* Border Width Bottom
* @see https://tailwindcss.com/docs/border-width
*/
readonly 'border-w-b': readonly [{
readonly 'border-b': readonly [ThemeGetter];
}];
/**
* Border Width Left
* @see https://tailwindcss.com/docs/border-width
*/
readonly 'border-w-l': readonly [{
readonly 'border-l': readonly [ThemeGetter];
}];
/**
* Border Opacity
* @see https://tailwindcss.com/docs/border-opacity
*/
readonly 'border-opacity': readonly [{
readonly 'border-opacity': readonly [ThemeGetter];
}];
/**
* Border Style
* @see https://tailwindcss.com/docs/border-style
*/
readonly 'border-style': readonly [{
readonly border: readonly ["solid", "dashed", "dotted", "double", "none", "hidden"];
}];
/**
* Divide Width X
* @see https://tailwindcss.com/docs/divide-width
*/
readonly 'divide-x': readonly [{
readonly 'divide-x': readonly [ThemeGetter];
}];
/**
* Divide Width X Reverse
* @see https://tailwindcss.com/docs/divide-width
*/
readonly 'divide-x-reverse': readonly ["divide-x-reverse"];
/**
* Divide Width Y
* @see https://tailwindcss.com/docs/divide-width
*/
readonly 'divide-y': readonly [{
readonly 'divide-y': readonly [ThemeGetter];
}];
/**
* Divide Width Y Reverse
* @see https://tailwindcss.com/docs/divide-width
*/
readonly 'divide-y-reverse': readonly ["divide-y-reverse"];
/**
* Divide Opacity
* @see https://tailwindcss.com/docs/divide-opacity
*/
readonly 'divide-opacity': readonly [{
readonly 'divide-opacity': readonly [ThemeGetter];
}];
/**
* Divide Style
* @see https://tailwindcss.com/docs/divide-style
*/
readonly 'divide-style': readonly [{
readonly divide: readonly ["solid", "dashed", "dotted", "double", "none"];
}];
/**
* Border Color
* @see https://tailwindcss.com/docs/border-color
*/
readonly 'border-color': readonly [{
readonly border: readonly [ThemeGetter];
}];
/**
* Border Color X
* @see https://tailwindcss.com/docs/border-color
*/
readonly 'border-color-x': readonly [{
readonly 'border-x': readonly [ThemeGetter];
}];
/**
* Border Color Y
* @see https://tailwindcss.com/docs/border-color
*/
readonly 'border-color-y': readonly [{
readonly 'border-y': readonly [ThemeGetter];
}];
/**
* Border Color S
* @see https://tailwindcss.com/docs/border-color
*/
readonly 'border-color-s': readonly [{
readonly 'border-s': readonly [ThemeGetter];
}];
/**
* Border Color E
* @see https://tailwindcss.com/docs/border-color
*/
readonly 'border-color-e': readonly [{
readonly 'border-e': readonly [ThemeGetter];
}];
/**
* Border Color Top
* @see https://tailwindcss.com/docs/border-color
*/
readonly 'border-color-t': readonly [{
readonly 'border-t': readonly [ThemeGetter];
}];
/**
* Border Color Right
* @see https://tailwindcss.com/docs/border-color
*/
readonly 'border-color-r': readonly [{
readonly 'border-r': readonly [ThemeGetter];
}];
/**
* Border Color Bottom
* @see https://tailwindcss.com/docs/border-color
*/
readonly 'border-color-b': readonly [{
readonly 'border-b': readonly [ThemeGetter];
}];
/**
* Border Color Left
* @see https://tailwindcss.com/docs/border-color
*/
readonly 'border-color-l': readonly [{
readonly 'border-l': readonly [ThemeGetter];
}];
/**
* Divide Color
* @see https://tailwindcss.com/docs/divide-color
*/
readonly 'divide-color': readonly [{
readonly divide: readonly [ThemeGetter];
}];
/**
* Outline Style
* @see https://tailwindcss.com/docs/outline-style
*/
readonly 'outline-style': readonly [{
readonly outline: readonly ["", "solid", "dashed", "dotted", "double", "none"];
}];
/**
* Outline Offset
* @see https://tailwindcss.com/docs/outline-offset
*/
readonly 'outline-offset': readonly [{
readonly 'outline-offset': readonly [(value: string) => boolean, (value: string) => boolean];
}];
/**
* Outline Width
* @see https://tailwindcss.com/docs/outline-width
*/
readonly 'outline-w': readonly [{
readonly outline: readonly [(value: string) => boolean, (value: string) => boolean];
}];
/**
* Outline Color
* @see https://tailwindcss.com/docs/outline-color
*/
readonly 'outline-color': readonly [{
readonly outline: readonly [ThemeGetter];
}];
/**
* Ring Width
* @see https://tailwindcss.com/docs/ring-width
*/
readonly 'ring-w': readonly [{
readonly ring: readonly ["", (value: string) => boolean, (value: string) => boolean];
}];
/**
* Ring Width Inset
* @see https://tailwindcss.com/docs/ring-width
*/
readonly 'ring-w-inset': readonly ["ring-inset"];
/**
* Ring Color
* @see https://tailwindcss.com/docs/ring-color
*/
readonly 'ring-color': readonly [{
readonly ring: readonly [ThemeGetter];
}];
/**
* Ring Opacity
* @see https://tailwindcss.com/docs/ring-opacity
*/
readonly 'ring-opacity': readonly [{
readonly 'ring-opacity': readonly [ThemeGetter];
}];
/**
* Ring Offset Width
* @see https://tailwindcss.com/docs/ring-offset-width
*/
readonly 'ring-offset-w': readonly [{
readonly 'ring-offset': readonly [(value: string) => boolean, (value: string) => boolean];
}];
/**
* Ring Offset Color
* @see https://tailwindcss.com/docs/ring-offset-color
*/
readonly 'ring-offset-color': readonly [{
readonly 'ring-offset': readonly [ThemeGetter];
}];
/**
* Box Shadow
* @see https://tailwindcss.com/docs/box-shadow
*/
readonly shadow: readonly [{
readonly shadow: readonly ["", "inner", "none", (value: string) => boolean, (value: string) => boolean];
}];
/**
* Box Shadow Color
* @see https://tailwindcss.com/docs/box-shadow-color
*/
readonly 'shadow-color': readonly [{
readonly shadow: readonly [() => boolean];
}];
/**
* Opacity
* @see https://tailwindcss.com/docs/opacity
*/
readonly opacity: readonly [{
readonly opacity: readonly [ThemeGetter];
}];
/**
* Mix Blend Mode
* @see https://tailwindcss.com/docs/mix-blend-mode
*/
readonly 'mix-blend': readonly [{
readonly 'mix-blend': readonly ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity", "plus-lighter", "plus-darker"];
}];
/**
* Background Blend Mode
* @see https://tailwindcss.com/docs/background-blend-mode
*/
readonly 'bg-blend': readonly [{
readonly 'bg-blend': readonly ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"];
}];
/**
* Filter
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/filter
*/
readonly filter: readonly [{
readonly filter: readonly ["", "none"];
}];
/**
* Blur
* @see https://tailwindcss.com/docs/blur
*/
readonly blur: readonly [{
readonly blur: readonly [ThemeGetter];
}];
/**
* Brightness
* @see https://tailwindcss.com/docs/brightness
*/
readonly brightness: readonly [{
readonly brightness: readonly [ThemeGetter];
}];
/**
* Contrast
* @see https://tailwindcss.com/docs/contrast
*/
readonly contrast: readonly [{
readonly contrast: readonly [ThemeGetter];
}];
/**
* Drop Shadow
* @see https://tailwindcss.com/docs/drop-shadow
*/
readonly 'drop-shadow': readonly [{
readonly 'drop-shadow': readonly ["", "none", (value: string) => boolean, (value: string) => boolean];
}];
/**
* Grayscale
* @see https://tailwindcss.com/docs/grayscale
*/
readonly grayscale: readonly [{
readonly grayscale: readonly [ThemeGetter];
}];
/**
* Hue Rotate
* @see https://tailwindcss.com/docs/hue-rotate
*/
readonly 'hue-rotate': readonly [{
readonly 'hue-rotate': readonly [ThemeGetter];
}];
/**
* Invert
* @see https://tailwindcss.com/docs/invert
*/
readonly invert: readonly [{
readonly invert: readonly [ThemeGetter];
}];
/**
* Saturate
* @see https://tailwindcss.com/docs/saturate
*/
readonly saturate: readonly [{
readonly saturate: readonly [ThemeGetter];
}];
/**
* Sepia
* @see https://tailwindcss.com/docs/sepia
*/
readonly sepia: readonly [{
readonly sepia: readonly [ThemeGetter];
}];
/**
* Backdrop Filter
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/backdrop-filter
*/
readonly 'backdrop-filter': readonly [{
readonly 'backdrop-filter': readonly ["", "none"];
}];
/**
* Backdrop Blur
* @see https://tailwindcss.com/docs/backdrop-blur
*/
readonly 'backdrop-blur': readonly [{
readonly 'backdrop-blur': readonly [ThemeGetter];
}];
/**
* Backdrop Brightness
* @see https://tailwindcss.com/docs/backdrop-brightness
*/
readonly 'backdrop-brightness': readonly [{
readonly 'backdrop-brightness': readonly [ThemeGetter];
}];
/**
* Backdrop Contrast
* @see https://tailwindcss.com/docs/backdrop-contrast
*/
readonly 'backdrop-contrast': readonly [{
readonly 'backdrop-contrast': readonly [ThemeGetter];
}];
/**
* Backdrop Grayscale
* @see https://tailwindcss.com/docs/backdrop-grayscale
*/
readonly 'backdrop-grayscale': readonly [{
readonly 'backdrop-grayscale': readonly [ThemeGetter];
}];
/**
* Backdrop Hue Rotate
* @see https://tailwindcss.com/docs/backdrop-hue-rotate
*/
readonly 'backdrop-hue-rotate': readonly [{
readonly 'backdrop-hue-rotate': readonly [ThemeGetter];
}];
/**
* Backdrop Invert
* @see https://tailwindcss.com/docs/backdrop-invert
*/
readonly 'backdrop-invert': readonly [{
readonly 'backdrop-invert': readonly [ThemeGetter];
}];
/**
* Backdrop Opacity
* @see https://tailwindcss.com/docs/backdrop-opacity
*/
readonly 'backdrop-opacity': readonly [{
readonly 'backdrop-opacity': readonly [ThemeGetter];
}];
/**
* Backdrop Saturate
* @see https://tailwindcss.com/docs/backdrop-saturate
*/
readonly 'backdrop-saturate': readonly [{
readonly 'backdrop-saturate': readonly [ThemeGetter];
}];
/**
* Backdrop Sepia
* @see https://tailwindcss.com/docs/backdrop-sepia
*/
readonly 'backdrop-sepia': readonly [{
readonly 'backdrop-sepia': readonly [ThemeGetter];
}];
/**
* Border Collapse
* @see https://tailwindcss.com/docs/border-collapse
*/
readonly 'border-collapse': readonly [{
readonly border: readonly ["collapse", "separate"];
}];
/**
* Border Spacing
* @see https://tailwindcss.com/docs/border-spacing
*/
readonly 'border-spacing': readonly [{
readonly 'border-spacing': readonly [ThemeGetter];
}];
/**
* Border Spacing X
* @see https://tailwindcss.com/docs/border-spacing
*/
readonly 'border-spacing-x': readonly [{
readonly 'border-spacing-x': readonly [ThemeGetter];
}];
/**
* Border Spacing Y
* @see https://tailwindcss.com/docs/border-spacing
*/
readonly 'border-spacing-y': readonly [{
readonly 'border-spacing-y': readonly [ThemeGetter];
}];
/**
* Table Layout
* @see https://tailwindcss.com/docs/table-layout
*/
readonly 'table-layout': readonly [{
readonly table: readonly ["auto", "fixed"];
}];
/**
* Caption Side
* @see https://tailwindcss.com/docs/caption-side
*/
readonly caption: readonly [{
readonly caption: readonly ["top", "bottom"];
}];
/**
* Tranisition Property
* @see https://tailwindcss.com/docs/transition-property
*/
readonly transition: readonly [{
readonly transition: readonly ["none", "all", "", "colors", "opacity", "shadow", "transform", (value: string) => boolean];
}];
/**
* Transition Duration
* @see https://tailwindcss.com/docs/transition-duration
*/
readonly duration: readonly [{
readonly duration: ((value: string) => boolean)[];
}];
/**
* Transition Timing Function
* @see https://tailwindcss.com/docs/transition-timing-function
*/
readonly ease: readonly [{
readonly ease: readonly ["linear", "in", "out", "in-out", (value: string) => boolean];
}];
/**
* Transition Delay
* @see https://tailwindcss.com/docs/transition-delay
*/
readonly delay: readonly [{
readonly delay: ((value: string) => boolean)[];
}];
/**
* Animation
* @see https://tailwindcss.com/docs/animation
*/
readonly animate: readonly [{
readonly animate: readonly ["none", "spin", "ping", "pulse", "bounce", (value: string) => boolean];
}];
/**
* Transform
* @see https://tailwindcss.com/docs/transform
*/
readonly transform: readonly [{
readonly transform: readonly ["", "gpu", "none"];
}];
/**
* Scale
* @see https://tailwindcss.com/docs/scale
*/
readonly scale: readonly [{
readonly scale: readonly [ThemeGetter];
}];
/**
* Scale X
* @see https://tailwindcss.com/docs/scale
*/
readonly 'scale-x': readonly [{
readonly 'scale-x': readonly [ThemeGetter];
}];
/**
* Scale Y
* @see https://tailwindcss.com/docs/scale
*/
readonly 'scale-y': readonly [{
readonly 'scale-y': readonly [ThemeGetter];
}];
/**
* Rotate
* @see https://tailwindcss.com/docs/rotate
*/
readonly rotate: readonly [{
readonly rotate: readonly [(value: string) => boolean, (value: string) => boolean];
}];
/**
* Translate X
* @see https://tailwindcss.com/docs/translate
*/
readonly 'translate-x': readonly [{
readonly 'translate-x': readonly [ThemeGetter];
}];
/**
* Translate Y
* @see https://tailwindcss.com/docs/translate
*/
readonly 'translate-y': readonly [{
readonly 'translate-y': readonly [ThemeGetter];
}];
/**
* Skew X
* @see https://tailwindcss.com/docs/skew
*/
readonly 'skew-x': readonly [{
readonly 'skew-x': readonly [ThemeGetter];
}];
/**
* Skew Y
* @see https://tailwindcss.com/docs/skew
*/
readonly 'skew-y': readonly [{
readonly 'skew-y': readonly [ThemeGetter];
}];
/**
* Transform Origin
* @see https://tailwindcss.com/docs/transform-origin
*/
readonly 'transform-origin': readonly [{
readonly origin: readonly ["center", "top", "top-right", "right", "bottom-right", "bottom", "bottom-left", "left", "top-left", (value: string) => boolean];
}];
/**
* Accent Color
* @see https://tailwindcss.com/docs/accent-color
*/
readonly accent: readonly [{
readonly accent: readonly ["auto", ThemeGetter];
}];
/**
* Appearance
* @see https://tailwindcss.com/docs/appearance
*/
readonly appearance: readonly [{
readonly appearance: readonly ["none", "auto"];
}];
/**
* Cursor
* @see https://tailwindcss.com/docs/cursor
*/
readonly cursor: readonly [{
readonly cursor: readonly ["auto", "default", "pointer", "wait", "text", "move", "help", "not-allowed", "none", "context-menu", "progress", "cell", "crosshair", "vertical-text", "alias", "copy", "no-drop", "grab", "grabbing", "all-scroll", "col-resize", "row-resize", "n-resize", "e-resize", "s-resize", "w-resize", "ne-resize", "nw-resize", "se-resize", "sw-resize", "ew-resize", "ns-resize", "nesw-resize", "nwse-resize", "zoom-in", "zoom-out", (value: string) => boolean];
}];
/**
* Caret Color
* @see https://tailwindcss.com/docs/just-in-time-mode#caret-color-utilities
*/
readonly 'caret-color': readonly [{
readonly caret: readonly [ThemeGetter];
}];
/**
* Pointer Events
* @see https://tailwindcss.com/docs/pointer-events
*/
readonly 'pointer-events': readonly [{
readonly 'pointer-events': readonly ["none", "auto"];
}];
/**
* Resize
* @see https://tailwindcss.com/docs/resize
*/
readonly resize: readonly [{
readonly resize: readonly ["none", "y", "x", ""];
}];
/**
* Scroll Behavior
* @see https://tailwindcss.com/docs/scroll-behavior
*/
readonly 'scroll-behavior': readonly [{
readonly scroll: readonly ["auto", "smooth"];
}];
/**
* Scroll Margin
* @see https://tailwindcss.com/docs/scroll-margin
*/
readonly 'scroll-m': readonly [{
readonly 'scroll-m': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Margin X
* @see https://tailwindcss.com/docs/scroll-margin
*/
readonly 'scroll-mx': readonly [{
readonly 'scroll-mx': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Margin Y
* @see https://tailwindcss.com/docs/scroll-margin
*/
readonly 'scroll-my': readonly [{
readonly 'scroll-my': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Margin Start
* @see https://tailwindcss.com/docs/scroll-margin
*/
readonly 'scroll-ms': readonly [{
readonly 'scroll-ms': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Margin End
* @see https://tailwindcss.com/docs/scroll-margin
*/
readonly 'scroll-me': readonly [{
readonly 'scroll-me': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Margin Top
* @see https://tailwindcss.com/docs/scroll-margin
*/
readonly 'scroll-mt': readonly [{
readonly 'scroll-mt': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Margin Right
* @see https://tailwindcss.com/docs/scroll-margin
*/
readonly 'scroll-mr': readonly [{
readonly 'scroll-mr': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Margin Bottom
* @see https://tailwindcss.com/docs/scroll-margin
*/
readonly 'scroll-mb': readonly [{
readonly 'scroll-mb': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Margin Left
* @see https://tailwindcss.com/docs/scroll-margin
*/
readonly 'scroll-ml': readonly [{
readonly 'scroll-ml': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Padding
* @see https://tailwindcss.com/docs/scroll-padding
*/
readonly 'scroll-p': readonly [{
readonly 'scroll-p': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Padding X
* @see https://tailwindcss.com/docs/scroll-padding
*/
readonly 'scroll-px': readonly [{
readonly 'scroll-px': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Padding Y
* @see https://tailwindcss.com/docs/scroll-padding
*/
readonly 'scroll-py': readonly [{
readonly 'scroll-py': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Padding Start
* @see https://tailwindcss.com/docs/scroll-padding
*/
readonly 'scroll-ps': readonly [{
readonly 'scroll-ps': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Padding End
* @see https://tailwindcss.com/docs/scroll-padding
*/
readonly 'scroll-pe': readonly [{
readonly 'scroll-pe': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Padding Top
* @see https://tailwindcss.com/docs/scroll-padding
*/
readonly 'scroll-pt': readonly [{
readonly 'scroll-pt': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Padding Right
* @see https://tailwindcss.com/docs/scroll-padding
*/
readonly 'scroll-pr': readonly [{
readonly 'scroll-pr': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Padding Bottom
* @see https://tailwindcss.com/docs/scroll-padding
*/
readonly 'scroll-pb': readonly [{
readonly 'scroll-pb': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Padding Left
* @see https://tailwindcss.com/docs/scroll-padding
*/
readonly 'scroll-pl': readonly [{
readonly 'scroll-pl': readonly [(value: string) => boolean, ThemeGetter];
}];
/**
* Scroll Snap Align
* @see https://tailwindcss.com/docs/scroll-snap-align
*/
readonly 'snap-align': readonly [{
readonly snap: readonly ["start", "end", "center", "align-none"];
}];
/**
* Scroll Snap Stop
* @see https://tailwindcss.com/docs/scroll-snap-stop
*/
readonly 'snap-stop': readonly [{
readonly snap: readonly ["normal", "always"];
}];
/**
* Scroll Snap Type
* @see https://tailwindcss.com/docs/scroll-snap-type
*/
readonly 'snap-type': readonly [{
readonly snap: readonly ["none", "x", "y", "both"];
}];
/**
* Scroll Snap Type Strictness
* @see https://tailwindcss.com/docs/scroll-snap-type
*/
readonly 'snap-strictness': readonly [{
readonly snap: readonly ["mandatory", "proximity"];
}];
/**
* Touch Action
* @see https://tailwindcss.com/docs/touch-action
*/
readonly touch: readonly [{
readonly touch: readonly ["auto", "none", "manipulation"];
}];
/**
* Touch Action X
* @see https://tailwindcss.com/docs/touch-action
*/
readonly 'touch-x': readonly [{
readonly 'touch-pan': readonly ["x", "left", "right"];
}];
/**
* Touch Action Y
* @see https://tailwindcss.com/docs/touch-action
*/
readonly 'touch-y': readonly [{
readonly 'touch-pan': readonly ["y", "up", "down"];
}];
/**
* Touch Action Pinch Zoom
* @see https://tailwindcss.com/docs/touch-action
*/
readonly 'touch-pz': readonly ["touch-pinch-zoom"];
/**
* User Select
* @see https://tailwindcss.com/docs/user-select
*/
readonly select: readonly [{
readonly select: readonly ["none", "text", "all", "auto"];
}];
/**
* Will Change
* @see https://tailwindcss.com/docs/will-change
*/
readonly 'will-change': readonly [{
readonly 'will-change': readonly ["auto", "scroll", "contents", "transform", (value: string) => boolean];
}];
/**
* Fill
* @see https://tailwindcss.com/docs/fill
*/
readonly fill: readonly [{
readonly fill: readonly [ThemeGetter, "none"];
}];
/**
* Stroke Width
* @see https://tailwindcss.com/docs/stroke-width
*/
readonly 'stroke-w': readonly [{
readonly stroke: readonly [(value: string) => boolean, (value: string) => boolean, (value: string) => boolean];
}];
/**
* Stroke
* @see https://tailwindcss.com/docs/stroke
*/
readonly stroke: readonly [{
readonly stroke: readonly [ThemeGetter, "none"];
}];
/**
* Screen Readers
* @see https://tailwindcss.com/docs/screen-readers
*/
readonly sr: readonly ["sr-only", "not-sr-only"];
/**
* Forced Color Adjust
* @see https://tailwindcss.com/docs/forced-color-adjust
*/
readonly 'forced-color-adjust': readonly [{
readonly 'forced-color-adjust': readonly ["auto", "none"];
}];
};
readonly conflictingClassGroups: {
readonly overflow: readonly ["overflow-x", "overflow-y"];
readonly overscroll: readonly ["overscroll-x", "overscroll-y"];
readonly inset: readonly ["inset-x", "inset-y", "start", "end", "top", "right", "bottom", "left"];
readonly 'inset-x': readonly ["right", "left"];
readonly 'inset-y': readonly ["top", "bottom"];
readonly flex: readonly ["basis", "grow", "shrink"];
readonly gap: readonly ["gap-x", "gap-y"];
readonly p: readonly ["px", "py", "ps", "pe", "pt", "pr", "pb", "pl"];
readonly px: readonly ["pr", "pl"];
readonly py: readonly ["pt", "pb"];
readonly m: readonly ["mx", "my", "ms", "me", "mt", "mr", "mb", "ml"];
readonly mx: readonly ["mr", "ml"];
readonly my: readonly ["mt", "mb"];
readonly size: readonly ["w", "h"];
readonly 'font-size': readonly ["leading"];
readonly 'fvn-normal': readonly ["fvn-ordinal", "fvn-slashed-zero", "fvn-figure", "fvn-spacing", "fvn-fraction"];
readonly 'fvn-ordinal': readonly ["fvn-normal"];
readonly 'fvn-slashed-zero': readonly ["fvn-normal"];
readonly 'fvn-figure': readonly ["fvn-normal"];
readonly 'fvn-spacing': readonly ["fvn-normal"];
readonly 'fvn-fraction': readonly ["fvn-normal"];
readonly 'line-clamp': readonly ["display", "overflow"];
readonly rounded: readonly ["rounded-s", "rounded-e", "rounded-t", "rounded-r", "rounded-b", "rounded-l", "rounded-ss", "rounded-se", "rounded-ee", "rounded-es", "rounded-tl", "rounded-tr", "rounded-br", "rounded-bl"];
readonly 'rounded-s': readonly ["rounded-ss", "rounded-es"];
readonly 'rounded-e': readonly ["rounded-se", "rounded-ee"];
readonly 'rounded-t': readonly ["rounded-tl", "rounded-tr"];
readonly 'rounded-r': readonly ["rounded-tr", "rounded-br"];
readonly 'rounded-b': readonly ["rounded-br", "rounded-bl"];
readonly 'rounded-l': readonly ["rounded-tl", "rounded-bl"];
readonly 'border-spacing': readonly ["border-spacing-x", "border-spacing-y"];
readonly 'border-w': readonly ["border-w-s", "border-w-e", "border-w-t", "border-w-r", "border-w-b", "border-w-l"];
readonly 'border-w-x': readonly ["border-w-r", "border-w-l"];
readonly 'border-w-y': readonly ["border-w-t", "border-w-b"];
readonly 'border-color': readonly ["border-color-s", "border-color-e", "border-color-t", "border-color-r", "border-color-b", "border-color-l"];
readonly 'border-color-x': readonly ["border-color-r", "border-color-l"];
readonly 'border-color-y': readonly ["border-color-t", "border-color-b"];
readonly 'scroll-m': readonly ["scroll-mx", "scroll-my", "scroll-ms", "scroll-me", "scroll-mt", "scroll-mr", "scroll-mb", "scroll-ml"];
readonly 'scroll-mx': readonly ["scroll-mr", "scroll-ml"];
readonly 'scroll-my': readonly ["scroll-mt", "scroll-mb"];
readonly 'scroll-p': readonly ["scroll-px", "scroll-py", "scroll-ps", "scroll-pe", "scroll-pt", "scroll-pr", "scroll-pb", "scroll-pl"];
readonly 'scroll-px': readonly ["scroll-pr", "scroll-pl"];
readonly 'scroll-py': readonly ["scroll-pt", "scroll-pb"];
readonly touch: readonly ["touch-x", "touch-y", "touch-pz"];
readonly 'touch-x': readonly ["touch"];
readonly 'touch-y': readonly ["touch"];
readonly 'touch-pz': readonly ["touch"];
};
readonly conflictingClassGroupModifiers: {
readonly 'font-size': readonly ["leading"];
};
};
type CreateConfigSubsequent = (config: AnyConfig) => AnyConfig;
declare const extendTailwindMerge: <AdditionalClassGroupIds extends string = never, AdditionalThemeGroupIds extends string = never>(configExtension: ConfigExtension<DefaultClassGroupIds | AdditionalClassGroupIds, DefaultThemeGroupIds | AdditionalThemeGroupIds> | CreateConfigSubsequent, ...createConfig: CreateConfigSubsequent[]) => (...classLists: ClassNameValue[]) => string;
declare const fromTheme: <AdditionalThemeGroupIds extends string = never, DefaultThemeGroupIdsInner extends string = DefaultThemeGroupIds>(key: NoInfer<DefaultThemeGroupIdsInner | AdditionalThemeGroupIds>) => ThemeGetter;
/**
* @param baseConfig Config where other config will be merged into. This object will be mutated.
* @param configExtension Partial config to merge into the `baseConfig`.
*/
declare const mergeConfigs: <ClassGroupIds extends string, ThemeGroupIds extends string = never>(baseConfig: AnyConfig, { cacheSize, prefix, separator, experimentalParseClassName, extend, override, }: ConfigExtension<ClassGroupIds, ThemeGroupIds>) => AnyConfig;
declare const twMerge: (...classLists: ClassNameValue[]) => string;
declare const isLength: (value: string) => boolean;
declare const isArbitraryLength: (value: string) => boolean;
declare const isNumber: (value: string) => boolean;
declare const isArbitraryNumber: (value: string) => boolean;
declare const isInteger: (value: string) => boolean;
declare const isPercent: (value: string) => boolean;
declare const isArbitraryValue: (value: string) => boolean;
declare const isTshirtSize: (value: string) => boolean;
declare const isArbitrarySize: (value: string) => boolean;
declare const isArbitraryPosition: (value: string) => boolean;
declare const isArbitraryImage: (value: string) => boolean;
declare const isArbitraryShadow: (value: string) => boolean;
declare const isAny: () => boolean;
declare const validators_d_isAny: typeof isAny;
declare const validators_d_isArbitraryImage: typeof isArbitraryImage;
declare const validators_d_isArbitraryLength: typeof isArbitraryLength;
declare const validators_d_isArbitraryNumber: typeof isArbitraryNumber;
declare const validators_d_isArbitraryPosition: typeof isArbitraryPosition;
declare const validators_d_isArbitraryShadow: typeof isArbitraryShadow;
declare const validators_d_isArbitrarySize: typeof isArbitrarySize;
declare const validators_d_isArbitraryValue: typeof isArbitraryValue;
declare const validators_d_isInteger: typeof isInteger;
declare const validators_d_isLength: typeof isLength;
declare const validators_d_isNumber: typeof isNumber;
declare const validators_d_isPercent: typeof isPercent;
declare const validators_d_isTshirtSize: typeof isTshirtSize;
declare namespace validators_d {
export { validators_d_isAny as isAny, validators_d_isArbitraryImage as isArbitraryImage, validators_d_isArbitraryLength as isArbitraryLength, validators_d_isArbitraryNumber as isArbitraryNumber, validators_d_isArbitraryPosition as isArbitraryPosition, validators_d_isArbitraryShadow as isArbitraryShadow, validators_d_isArbitrarySize as isArbitrarySize, validators_d_isArbitraryValue as isArbitraryValue, validators_d_isInteger as isInteger, validators_d_isLength as isLength, validators_d_isNumber as isNumber, validators_d_isPercent as isPercent, validators_d_isTshirtSize as isTshirtSize };
}
export { type ClassNameValue, type ClassValidator, type Config, type ConfigExtension, type DefaultClassGroupIds, type DefaultThemeGroupIds, type ExperimentalParseClassNameParam, type ExperimentalParsedClassName, createTailwindMerge, extendTailwindMerge, fromTheme, getDefaultConfig, mergeConfigs, twJoin, twMerge, validators_d as validators };
+91
View File
@@ -0,0 +1,91 @@
{
"name": "tailwind-merge",
"version": "2.6.1",
"description": "Merge Tailwind CSS classes without style conflicts",
"keywords": [
"tailwindcss",
"tailwind",
"css",
"classes",
"className",
"classList",
"merge",
"conflict",
"override"
],
"homepage": "https://github.com/dcastil/tailwind-merge",
"bugs": {
"url": "https://github.com/dcastil/tailwind-merge/issues"
},
"funding": {
"type": "github",
"url": "https://github.com/sponsors/dcastil"
},
"license": "MIT",
"author": "Dany Castillo",
"files": [
"dist",
"src"
],
"source": "src/index.ts",
"exports": {
".": {
"types": "./dist/types.d.ts",
"require": "./dist/bundle-cjs.js",
"import": "./dist/bundle-mjs.mjs",
"default": "./dist/bundle-mjs.mjs"
},
"./es5": {
"types": "./dist/types.d.ts",
"require": "./dist/es5/bundle-cjs.js",
"import": "./dist/es5/bundle-mjs.mjs",
"default": "./dist/es5/bundle-mjs.mjs"
}
},
"main": "./dist/bundle-cjs.js",
"types": "./dist/types.d.ts",
"repository": {
"type": "git",
"url": "https://github.com/dcastil/tailwind-merge.git"
},
"sideEffects": false,
"scripts": {
"build": "rollup --config scripts/rollup.config.mjs",
"bench": "vitest bench --config scripts/vitest.config.mts",
"test": "vitest --config scripts/vitest.config.mts --coverage",
"test:watch": "vitest --config scripts/vitest.config.mts",
"test:exports": "node scripts/test-built-package-exports.cjs && node scripts/test-built-package-exports.mjs",
"lint": "eslint --max-warnings 0 '**'",
"preversion": "if [ -n \"$DANYS_MACHINE\" ]; then git checkout main && git pull; fi",
"version": "zx scripts/update-readme.mjs",
"postversion": "if [ -n \"$DANYS_MACHINE\" ]; then git push --follow-tags && open https://github.com/dcastil/tailwind-merge/releases; fi"
},
"dependencies": {},
"devDependencies": {
"@babel/core": "^7.26.0",
"@babel/preset-env": "^7.26.0",
"@codspeed/vitest-plugin": "^4.0.0",
"@rollup/plugin-babel": "^6.0.4",
"@rollup/plugin-node-resolve": "^16.0.0",
"@rollup/plugin-typescript": "^12.1.2",
"@vitest/coverage-v8": "^2.1.8",
"@vitest/eslint-plugin": "^1.1.22",
"babel-plugin-annotate-pure-calls": "^0.4.0",
"babel-plugin-polyfill-regenerator": "^0.6.3",
"eslint": "^9.17.0",
"eslint-plugin-import": "^2.31.0",
"globby": "^11.1.0",
"prettier": "^3.4.2",
"rollup": "^4.29.1",
"rollup-plugin-delete": "^2.1.0",
"rollup-plugin-dts": "^6.1.1",
"tslib": "^2.8.1",
"typescript": "^5.7.2",
"typescript-eslint": "^8.19.0",
"vitest": "^2.1.8",
"zx": "^8.3.0"
},
"publishConfig": {
"provenance": true
}
}
+17
View File
@@ -0,0 +1,17 @@
export { createTailwindMerge } from './lib/create-tailwind-merge'
export { getDefaultConfig } from './lib/default-config'
export { extendTailwindMerge } from './lib/extend-tailwind-merge'
export { fromTheme } from './lib/from-theme'
export { mergeConfigs } from './lib/merge-configs'
export { twJoin, type ClassNameValue } from './lib/tw-join'
export { twMerge } from './lib/tw-merge'
export {
type ClassValidator,
type Config,
type ConfigExtension,
type DefaultClassGroupIds,
type DefaultThemeGroupIds,
type ExperimentalParseClassNameParam,
type ExperimentalParsedClassName,
} from './lib/types'
export * as validators from './lib/validators'
+214
View File
@@ -0,0 +1,214 @@
import {
AnyClassGroupIds,
AnyConfig,
AnyThemeGroupIds,
ClassGroup,
ClassValidator,
Config,
ThemeGetter,
ThemeObject,
} from './types'
export interface ClassPartObject {
nextPart: Map<string, ClassPartObject>
validators: ClassValidatorObject[]
classGroupId?: AnyClassGroupIds
}
interface ClassValidatorObject {
classGroupId: AnyClassGroupIds
validator: ClassValidator
}
const CLASS_PART_SEPARATOR = '-'
export const createClassGroupUtils = (config: AnyConfig) => {
const classMap = createClassMap(config)
const { conflictingClassGroups, conflictingClassGroupModifiers } = config
const getClassGroupId = (className: string) => {
const classParts = className.split(CLASS_PART_SEPARATOR)
// Classes like `-inset-1` produce an empty string as first classPart. We assume that classes for negative values are used correctly and remove it from classParts.
if (classParts[0] === '' && classParts.length !== 1) {
classParts.shift()
}
return getGroupRecursive(classParts, classMap) || getGroupIdForArbitraryProperty(className)
}
const getConflictingClassGroupIds = (
classGroupId: AnyClassGroupIds,
hasPostfixModifier: boolean,
) => {
const conflicts = conflictingClassGroups[classGroupId] || []
if (hasPostfixModifier && conflictingClassGroupModifiers[classGroupId]) {
return [...conflicts, ...conflictingClassGroupModifiers[classGroupId]!]
}
return conflicts
}
return {
getClassGroupId,
getConflictingClassGroupIds,
}
}
const getGroupRecursive = (
classParts: string[],
classPartObject: ClassPartObject,
): AnyClassGroupIds | undefined => {
if (classParts.length === 0) {
return classPartObject.classGroupId
}
const currentClassPart = classParts[0]!
const nextClassPartObject = classPartObject.nextPart.get(currentClassPart)
const classGroupFromNextClassPart = nextClassPartObject
? getGroupRecursive(classParts.slice(1), nextClassPartObject)
: undefined
if (classGroupFromNextClassPart) {
return classGroupFromNextClassPart
}
if (classPartObject.validators.length === 0) {
return undefined
}
const classRest = classParts.join(CLASS_PART_SEPARATOR)
return classPartObject.validators.find(({ validator }) => validator(classRest))?.classGroupId
}
const arbitraryPropertyRegex = /^\[(.+)\]$/
const getGroupIdForArbitraryProperty = (className: string) => {
if (arbitraryPropertyRegex.test(className)) {
const arbitraryPropertyClassName = arbitraryPropertyRegex.exec(className)![1]
const property = arbitraryPropertyClassName?.substring(
0,
arbitraryPropertyClassName.indexOf(':'),
)
if (property) {
// I use two dots here because one dot is used as prefix for class groups in plugins
return 'arbitrary..' + property
}
}
}
/**
* Exported for testing only
*/
export const createClassMap = (config: Config<AnyClassGroupIds, AnyThemeGroupIds>) => {
const { theme, prefix } = config
const classMap: ClassPartObject = {
nextPart: new Map<string, ClassPartObject>(),
validators: [],
}
const prefixedClassGroupEntries = getPrefixedClassGroupEntries(
Object.entries(config.classGroups),
prefix,
)
prefixedClassGroupEntries.forEach(([classGroupId, classGroup]) => {
processClassesRecursively(classGroup, classMap, classGroupId, theme)
})
return classMap
}
const processClassesRecursively = (
classGroup: ClassGroup<AnyThemeGroupIds>,
classPartObject: ClassPartObject,
classGroupId: AnyClassGroupIds,
theme: ThemeObject<AnyThemeGroupIds>,
) => {
classGroup.forEach((classDefinition) => {
if (typeof classDefinition === 'string') {
const classPartObjectToEdit =
classDefinition === '' ? classPartObject : getPart(classPartObject, classDefinition)
classPartObjectToEdit.classGroupId = classGroupId
return
}
if (typeof classDefinition === 'function') {
if (isThemeGetter(classDefinition)) {
processClassesRecursively(
classDefinition(theme),
classPartObject,
classGroupId,
theme,
)
return
}
classPartObject.validators.push({
validator: classDefinition,
classGroupId,
})
return
}
Object.entries(classDefinition).forEach(([key, classGroup]) => {
processClassesRecursively(
classGroup,
getPart(classPartObject, key),
classGroupId,
theme,
)
})
})
}
const getPart = (classPartObject: ClassPartObject, path: string) => {
let currentClassPartObject = classPartObject
path.split(CLASS_PART_SEPARATOR).forEach((pathPart) => {
if (!currentClassPartObject.nextPart.has(pathPart)) {
currentClassPartObject.nextPart.set(pathPart, {
nextPart: new Map(),
validators: [],
})
}
currentClassPartObject = currentClassPartObject.nextPart.get(pathPart)!
})
return currentClassPartObject
}
const isThemeGetter = (func: ClassValidator | ThemeGetter): func is ThemeGetter =>
(func as ThemeGetter).isThemeGetter
const getPrefixedClassGroupEntries = (
classGroupEntries: Array<[classGroupId: string, classGroup: ClassGroup<AnyThemeGroupIds>]>,
prefix: string | undefined,
): Array<[classGroupId: string, classGroup: ClassGroup<AnyThemeGroupIds>]> => {
if (!prefix) {
return classGroupEntries
}
return classGroupEntries.map(([classGroupId, classGroup]) => {
const prefixedClassGroup = classGroup.map((classDefinition) => {
if (typeof classDefinition === 'string') {
return prefix + classDefinition
}
if (typeof classDefinition === 'object') {
return Object.fromEntries(
Object.entries(classDefinition).map(([key, value]) => [prefix + key, value]),
)
}
return classDefinition
})
return [classGroupId, prefixedClassGroup]
})
}
+12
View File
@@ -0,0 +1,12 @@
import { createClassGroupUtils } from './class-group-utils'
import { createLruCache } from './lru-cache'
import { createParseClassName } from './parse-class-name'
import { AnyConfig } from './types'
export type ConfigUtils = ReturnType<typeof createConfigUtils>
export const createConfigUtils = (config: AnyConfig) => ({
cache: createLruCache<string, string>(config.cacheSize),
parseClassName: createParseClassName(config),
...createClassGroupUtils(config),
})
+50
View File
@@ -0,0 +1,50 @@
import { createConfigUtils } from './config-utils'
import { mergeClassList } from './merge-classlist'
import { ClassNameValue, twJoin } from './tw-join'
import { AnyConfig } from './types'
type CreateConfigFirst = () => AnyConfig
type CreateConfigSubsequent = (config: AnyConfig) => AnyConfig
type TailwindMerge = (...classLists: ClassNameValue[]) => string
type ConfigUtils = ReturnType<typeof createConfigUtils>
export function createTailwindMerge(
createConfigFirst: CreateConfigFirst,
...createConfigRest: CreateConfigSubsequent[]
): TailwindMerge {
let configUtils: ConfigUtils
let cacheGet: ConfigUtils['cache']['get']
let cacheSet: ConfigUtils['cache']['set']
let functionToCall = initTailwindMerge
function initTailwindMerge(classList: string) {
const config = createConfigRest.reduce(
(previousConfig, createConfigCurrent) => createConfigCurrent(previousConfig),
createConfigFirst() as AnyConfig,
)
configUtils = createConfigUtils(config)
cacheGet = configUtils.cache.get
cacheSet = configUtils.cache.set
functionToCall = tailwindMerge
return tailwindMerge(classList)
}
function tailwindMerge(classList: string) {
const cachedResult = cacheGet(classList)
if (cachedResult) {
return cachedResult
}
const result = mergeClassList(classList, configUtils)
cacheSet(classList, result)
return result
}
return function callTailwindMerge() {
return functionToCall(twJoin.apply(null, arguments as any))
}
}
+1876
View File
@@ -0,0 +1,1876 @@
import { fromTheme } from './from-theme'
import { Config, DefaultClassGroupIds, DefaultThemeGroupIds } from './types'
import {
isAny,
isArbitraryImage,
isArbitraryLength,
isArbitraryNumber,
isArbitraryPosition,
isArbitraryShadow,
isArbitrarySize,
isArbitraryValue,
isInteger,
isLength,
isNumber,
isPercent,
isTshirtSize,
} from './validators'
export const getDefaultConfig = () => {
const colors = fromTheme('colors')
const spacing = fromTheme('spacing')
const blur = fromTheme('blur')
const brightness = fromTheme('brightness')
const borderColor = fromTheme('borderColor')
const borderRadius = fromTheme('borderRadius')
const borderSpacing = fromTheme('borderSpacing')
const borderWidth = fromTheme('borderWidth')
const contrast = fromTheme('contrast')
const grayscale = fromTheme('grayscale')
const hueRotate = fromTheme('hueRotate')
const invert = fromTheme('invert')
const gap = fromTheme('gap')
const gradientColorStops = fromTheme('gradientColorStops')
const gradientColorStopPositions = fromTheme('gradientColorStopPositions')
const inset = fromTheme('inset')
const margin = fromTheme('margin')
const opacity = fromTheme('opacity')
const padding = fromTheme('padding')
const saturate = fromTheme('saturate')
const scale = fromTheme('scale')
const sepia = fromTheme('sepia')
const skew = fromTheme('skew')
const space = fromTheme('space')
const translate = fromTheme('translate')
const getOverscroll = () => ['auto', 'contain', 'none'] as const
const getOverflow = () => ['auto', 'hidden', 'clip', 'visible', 'scroll'] as const
const getSpacingWithAutoAndArbitrary = () => ['auto', isArbitraryValue, spacing] as const
const getSpacingWithArbitrary = () => [isArbitraryValue, spacing] as const
const getLengthWithEmptyAndArbitrary = () => ['', isLength, isArbitraryLength] as const
const getNumberWithAutoAndArbitrary = () => ['auto', isNumber, isArbitraryValue] as const
const getPositions = () =>
[
'bottom',
'center',
'left',
'left-bottom',
'left-top',
'right',
'right-bottom',
'right-top',
'top',
] as const
const getLineStyles = () => ['solid', 'dashed', 'dotted', 'double', 'none'] as const
const getBlendModes = () =>
[
'normal',
'multiply',
'screen',
'overlay',
'darken',
'lighten',
'color-dodge',
'color-burn',
'hard-light',
'soft-light',
'difference',
'exclusion',
'hue',
'saturation',
'color',
'luminosity',
] as const
const getAlign = () =>
['start', 'end', 'center', 'between', 'around', 'evenly', 'stretch'] as const
const getZeroAndEmpty = () => ['', '0', isArbitraryValue] as const
const getBreaks = () =>
['auto', 'avoid', 'all', 'avoid-page', 'page', 'left', 'right', 'column'] as const
const getNumberAndArbitrary = () => [isNumber, isArbitraryValue]
return {
cacheSize: 500,
separator: ':',
theme: {
colors: [isAny],
spacing: [isLength, isArbitraryLength],
blur: ['none', '', isTshirtSize, isArbitraryValue],
brightness: getNumberAndArbitrary(),
borderColor: [colors],
borderRadius: ['none', '', 'full', isTshirtSize, isArbitraryValue],
borderSpacing: getSpacingWithArbitrary(),
borderWidth: getLengthWithEmptyAndArbitrary(),
contrast: getNumberAndArbitrary(),
grayscale: getZeroAndEmpty(),
hueRotate: getNumberAndArbitrary(),
invert: getZeroAndEmpty(),
gap: getSpacingWithArbitrary(),
gradientColorStops: [colors],
gradientColorStopPositions: [isPercent, isArbitraryLength],
inset: getSpacingWithAutoAndArbitrary(),
margin: getSpacingWithAutoAndArbitrary(),
opacity: getNumberAndArbitrary(),
padding: getSpacingWithArbitrary(),
saturate: getNumberAndArbitrary(),
scale: getNumberAndArbitrary(),
sepia: getZeroAndEmpty(),
skew: getNumberAndArbitrary(),
space: getSpacingWithArbitrary(),
translate: getSpacingWithArbitrary(),
},
classGroups: {
// Layout
/**
* Aspect Ratio
* @see https://tailwindcss.com/docs/aspect-ratio
*/
aspect: [{ aspect: ['auto', 'square', 'video', isArbitraryValue] }],
/**
* Container
* @see https://tailwindcss.com/docs/container
*/
container: ['container'],
/**
* Columns
* @see https://tailwindcss.com/docs/columns
*/
columns: [{ columns: [isTshirtSize] }],
/**
* Break After
* @see https://tailwindcss.com/docs/break-after
*/
'break-after': [{ 'break-after': getBreaks() }],
/**
* Break Before
* @see https://tailwindcss.com/docs/break-before
*/
'break-before': [{ 'break-before': getBreaks() }],
/**
* Break Inside
* @see https://tailwindcss.com/docs/break-inside
*/
'break-inside': [{ 'break-inside': ['auto', 'avoid', 'avoid-page', 'avoid-column'] }],
/**
* Box Decoration Break
* @see https://tailwindcss.com/docs/box-decoration-break
*/
'box-decoration': [{ 'box-decoration': ['slice', 'clone'] }],
/**
* Box Sizing
* @see https://tailwindcss.com/docs/box-sizing
*/
box: [{ box: ['border', 'content'] }],
/**
* Display
* @see https://tailwindcss.com/docs/display
*/
display: [
'block',
'inline-block',
'inline',
'flex',
'inline-flex',
'table',
'inline-table',
'table-caption',
'table-cell',
'table-column',
'table-column-group',
'table-footer-group',
'table-header-group',
'table-row-group',
'table-row',
'flow-root',
'grid',
'inline-grid',
'contents',
'list-item',
'hidden',
],
/**
* Floats
* @see https://tailwindcss.com/docs/float
*/
float: [{ float: ['right', 'left', 'none', 'start', 'end'] }],
/**
* Clear
* @see https://tailwindcss.com/docs/clear
*/
clear: [{ clear: ['left', 'right', 'both', 'none', 'start', 'end'] }],
/**
* Isolation
* @see https://tailwindcss.com/docs/isolation
*/
isolation: ['isolate', 'isolation-auto'],
/**
* Object Fit
* @see https://tailwindcss.com/docs/object-fit
*/
'object-fit': [{ object: ['contain', 'cover', 'fill', 'none', 'scale-down'] }],
/**
* Object Position
* @see https://tailwindcss.com/docs/object-position
*/
'object-position': [{ object: [...getPositions(), isArbitraryValue] }],
/**
* Overflow
* @see https://tailwindcss.com/docs/overflow
*/
overflow: [{ overflow: getOverflow() }],
/**
* Overflow X
* @see https://tailwindcss.com/docs/overflow
*/
'overflow-x': [{ 'overflow-x': getOverflow() }],
/**
* Overflow Y
* @see https://tailwindcss.com/docs/overflow
*/
'overflow-y': [{ 'overflow-y': getOverflow() }],
/**
* Overscroll Behavior
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
overscroll: [{ overscroll: getOverscroll() }],
/**
* Overscroll Behavior X
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
'overscroll-x': [{ 'overscroll-x': getOverscroll() }],
/**
* Overscroll Behavior Y
* @see https://tailwindcss.com/docs/overscroll-behavior
*/
'overscroll-y': [{ 'overscroll-y': getOverscroll() }],
/**
* Position
* @see https://tailwindcss.com/docs/position
*/
position: ['static', 'fixed', 'absolute', 'relative', 'sticky'],
/**
* Top / Right / Bottom / Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
inset: [{ inset: [inset] }],
/**
* Right / Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
'inset-x': [{ 'inset-x': [inset] }],
/**
* Top / Bottom
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
'inset-y': [{ 'inset-y': [inset] }],
/**
* Start
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
start: [{ start: [inset] }],
/**
* End
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
end: [{ end: [inset] }],
/**
* Top
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
top: [{ top: [inset] }],
/**
* Right
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
right: [{ right: [inset] }],
/**
* Bottom
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
bottom: [{ bottom: [inset] }],
/**
* Left
* @see https://tailwindcss.com/docs/top-right-bottom-left
*/
left: [{ left: [inset] }],
/**
* Visibility
* @see https://tailwindcss.com/docs/visibility
*/
visibility: ['visible', 'invisible', 'collapse'],
/**
* Z-Index
* @see https://tailwindcss.com/docs/z-index
*/
z: [{ z: ['auto', isInteger, isArbitraryValue] }],
// Flexbox and Grid
/**
* Flex Basis
* @see https://tailwindcss.com/docs/flex-basis
*/
basis: [{ basis: getSpacingWithAutoAndArbitrary() }],
/**
* Flex Direction
* @see https://tailwindcss.com/docs/flex-direction
*/
'flex-direction': [{ flex: ['row', 'row-reverse', 'col', 'col-reverse'] }],
/**
* Flex Wrap
* @see https://tailwindcss.com/docs/flex-wrap
*/
'flex-wrap': [{ flex: ['wrap', 'wrap-reverse', 'nowrap'] }],
/**
* Flex
* @see https://tailwindcss.com/docs/flex
*/
flex: [{ flex: ['1', 'auto', 'initial', 'none', isArbitraryValue] }],
/**
* Flex Grow
* @see https://tailwindcss.com/docs/flex-grow
*/
grow: [{ grow: getZeroAndEmpty() }],
/**
* Flex Shrink
* @see https://tailwindcss.com/docs/flex-shrink
*/
shrink: [{ shrink: getZeroAndEmpty() }],
/**
* Order
* @see https://tailwindcss.com/docs/order
*/
order: [{ order: ['first', 'last', 'none', isInteger, isArbitraryValue] }],
/**
* Grid Template Columns
* @see https://tailwindcss.com/docs/grid-template-columns
*/
'grid-cols': [{ 'grid-cols': [isAny] }],
/**
* Grid Column Start / End
* @see https://tailwindcss.com/docs/grid-column
*/
'col-start-end': [
{
col: [
'auto',
{ span: ['full', isInteger, isArbitraryValue] },
isArbitraryValue,
],
},
],
/**
* Grid Column Start
* @see https://tailwindcss.com/docs/grid-column
*/
'col-start': [{ 'col-start': getNumberWithAutoAndArbitrary() }],
/**
* Grid Column End
* @see https://tailwindcss.com/docs/grid-column
*/
'col-end': [{ 'col-end': getNumberWithAutoAndArbitrary() }],
/**
* Grid Template Rows
* @see https://tailwindcss.com/docs/grid-template-rows
*/
'grid-rows': [{ 'grid-rows': [isAny] }],
/**
* Grid Row Start / End
* @see https://tailwindcss.com/docs/grid-row
*/
'row-start-end': [
{ row: ['auto', { span: [isInteger, isArbitraryValue] }, isArbitraryValue] },
],
/**
* Grid Row Start
* @see https://tailwindcss.com/docs/grid-row
*/
'row-start': [{ 'row-start': getNumberWithAutoAndArbitrary() }],
/**
* Grid Row End
* @see https://tailwindcss.com/docs/grid-row
*/
'row-end': [{ 'row-end': getNumberWithAutoAndArbitrary() }],
/**
* Grid Auto Flow
* @see https://tailwindcss.com/docs/grid-auto-flow
*/
'grid-flow': [{ 'grid-flow': ['row', 'col', 'dense', 'row-dense', 'col-dense'] }],
/**
* Grid Auto Columns
* @see https://tailwindcss.com/docs/grid-auto-columns
*/
'auto-cols': [{ 'auto-cols': ['auto', 'min', 'max', 'fr', isArbitraryValue] }],
/**
* Grid Auto Rows
* @see https://tailwindcss.com/docs/grid-auto-rows
*/
'auto-rows': [{ 'auto-rows': ['auto', 'min', 'max', 'fr', isArbitraryValue] }],
/**
* Gap
* @see https://tailwindcss.com/docs/gap
*/
gap: [{ gap: [gap] }],
/**
* Gap X
* @see https://tailwindcss.com/docs/gap
*/
'gap-x': [{ 'gap-x': [gap] }],
/**
* Gap Y
* @see https://tailwindcss.com/docs/gap
*/
'gap-y': [{ 'gap-y': [gap] }],
/**
* Justify Content
* @see https://tailwindcss.com/docs/justify-content
*/
'justify-content': [{ justify: ['normal', ...getAlign()] }],
/**
* Justify Items
* @see https://tailwindcss.com/docs/justify-items
*/
'justify-items': [{ 'justify-items': ['start', 'end', 'center', 'stretch'] }],
/**
* Justify Self
* @see https://tailwindcss.com/docs/justify-self
*/
'justify-self': [{ 'justify-self': ['auto', 'start', 'end', 'center', 'stretch'] }],
/**
* Align Content
* @see https://tailwindcss.com/docs/align-content
*/
'align-content': [{ content: ['normal', ...getAlign(), 'baseline'] }],
/**
* Align Items
* @see https://tailwindcss.com/docs/align-items
*/
'align-items': [{ items: ['start', 'end', 'center', 'baseline', 'stretch'] }],
/**
* Align Self
* @see https://tailwindcss.com/docs/align-self
*/
'align-self': [{ self: ['auto', 'start', 'end', 'center', 'stretch', 'baseline'] }],
/**
* Place Content
* @see https://tailwindcss.com/docs/place-content
*/
'place-content': [{ 'place-content': [...getAlign(), 'baseline'] }],
/**
* Place Items
* @see https://tailwindcss.com/docs/place-items
*/
'place-items': [{ 'place-items': ['start', 'end', 'center', 'baseline', 'stretch'] }],
/**
* Place Self
* @see https://tailwindcss.com/docs/place-self
*/
'place-self': [{ 'place-self': ['auto', 'start', 'end', 'center', 'stretch'] }],
// Spacing
/**
* Padding
* @see https://tailwindcss.com/docs/padding
*/
p: [{ p: [padding] }],
/**
* Padding X
* @see https://tailwindcss.com/docs/padding
*/
px: [{ px: [padding] }],
/**
* Padding Y
* @see https://tailwindcss.com/docs/padding
*/
py: [{ py: [padding] }],
/**
* Padding Start
* @see https://tailwindcss.com/docs/padding
*/
ps: [{ ps: [padding] }],
/**
* Padding End
* @see https://tailwindcss.com/docs/padding
*/
pe: [{ pe: [padding] }],
/**
* Padding Top
* @see https://tailwindcss.com/docs/padding
*/
pt: [{ pt: [padding] }],
/**
* Padding Right
* @see https://tailwindcss.com/docs/padding
*/
pr: [{ pr: [padding] }],
/**
* Padding Bottom
* @see https://tailwindcss.com/docs/padding
*/
pb: [{ pb: [padding] }],
/**
* Padding Left
* @see https://tailwindcss.com/docs/padding
*/
pl: [{ pl: [padding] }],
/**
* Margin
* @see https://tailwindcss.com/docs/margin
*/
m: [{ m: [margin] }],
/**
* Margin X
* @see https://tailwindcss.com/docs/margin
*/
mx: [{ mx: [margin] }],
/**
* Margin Y
* @see https://tailwindcss.com/docs/margin
*/
my: [{ my: [margin] }],
/**
* Margin Start
* @see https://tailwindcss.com/docs/margin
*/
ms: [{ ms: [margin] }],
/**
* Margin End
* @see https://tailwindcss.com/docs/margin
*/
me: [{ me: [margin] }],
/**
* Margin Top
* @see https://tailwindcss.com/docs/margin
*/
mt: [{ mt: [margin] }],
/**
* Margin Right
* @see https://tailwindcss.com/docs/margin
*/
mr: [{ mr: [margin] }],
/**
* Margin Bottom
* @see https://tailwindcss.com/docs/margin
*/
mb: [{ mb: [margin] }],
/**
* Margin Left
* @see https://tailwindcss.com/docs/margin
*/
ml: [{ ml: [margin] }],
/**
* Space Between X
* @see https://tailwindcss.com/docs/space
*/
'space-x': [{ 'space-x': [space] }],
/**
* Space Between X Reverse
* @see https://tailwindcss.com/docs/space
*/
'space-x-reverse': ['space-x-reverse'],
/**
* Space Between Y
* @see https://tailwindcss.com/docs/space
*/
'space-y': [{ 'space-y': [space] }],
/**
* Space Between Y Reverse
* @see https://tailwindcss.com/docs/space
*/
'space-y-reverse': ['space-y-reverse'],
// Sizing
/**
* Width
* @see https://tailwindcss.com/docs/width
*/
w: [
{
w: [
'auto',
'min',
'max',
'fit',
'svw',
'lvw',
'dvw',
isArbitraryValue,
spacing,
],
},
],
/**
* Min-Width
* @see https://tailwindcss.com/docs/min-width
*/
'min-w': [{ 'min-w': [isArbitraryValue, spacing, 'min', 'max', 'fit'] }],
/**
* Max-Width
* @see https://tailwindcss.com/docs/max-width
*/
'max-w': [
{
'max-w': [
isArbitraryValue,
spacing,
'none',
'full',
'min',
'max',
'fit',
'prose',
{ screen: [isTshirtSize] },
isTshirtSize,
],
},
],
/**
* Height
* @see https://tailwindcss.com/docs/height
*/
h: [
{
h: [
isArbitraryValue,
spacing,
'auto',
'min',
'max',
'fit',
'svh',
'lvh',
'dvh',
],
},
],
/**
* Min-Height
* @see https://tailwindcss.com/docs/min-height
*/
'min-h': [
{ 'min-h': [isArbitraryValue, spacing, 'min', 'max', 'fit', 'svh', 'lvh', 'dvh'] },
],
/**
* Max-Height
* @see https://tailwindcss.com/docs/max-height
*/
'max-h': [
{ 'max-h': [isArbitraryValue, spacing, 'min', 'max', 'fit', 'svh', 'lvh', 'dvh'] },
],
/**
* Size
* @see https://tailwindcss.com/docs/size
*/
size: [{ size: [isArbitraryValue, spacing, 'auto', 'min', 'max', 'fit'] }],
// Typography
/**
* Font Size
* @see https://tailwindcss.com/docs/font-size
*/
'font-size': [{ text: ['base', isTshirtSize, isArbitraryLength] }],
/**
* Font Smoothing
* @see https://tailwindcss.com/docs/font-smoothing
*/
'font-smoothing': ['antialiased', 'subpixel-antialiased'],
/**
* Font Style
* @see https://tailwindcss.com/docs/font-style
*/
'font-style': ['italic', 'not-italic'],
/**
* Font Weight
* @see https://tailwindcss.com/docs/font-weight
*/
'font-weight': [
{
font: [
'thin',
'extralight',
'light',
'normal',
'medium',
'semibold',
'bold',
'extrabold',
'black',
isArbitraryNumber,
],
},
],
/**
* Font Family
* @see https://tailwindcss.com/docs/font-family
*/
'font-family': [{ font: [isAny] }],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-normal': ['normal-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-ordinal': ['ordinal'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-slashed-zero': ['slashed-zero'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-figure': ['lining-nums', 'oldstyle-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-spacing': ['proportional-nums', 'tabular-nums'],
/**
* Font Variant Numeric
* @see https://tailwindcss.com/docs/font-variant-numeric
*/
'fvn-fraction': ['diagonal-fractions', 'stacked-fractions'],
/**
* Letter Spacing
* @see https://tailwindcss.com/docs/letter-spacing
*/
tracking: [
{
tracking: [
'tighter',
'tight',
'normal',
'wide',
'wider',
'widest',
isArbitraryValue,
],
},
],
/**
* Line Clamp
* @see https://tailwindcss.com/docs/line-clamp
*/
'line-clamp': [{ 'line-clamp': ['none', isNumber, isArbitraryNumber] }],
/**
* Line Height
* @see https://tailwindcss.com/docs/line-height
*/
leading: [
{
leading: [
'none',
'tight',
'snug',
'normal',
'relaxed',
'loose',
isLength,
isArbitraryValue,
],
},
],
/**
* List Style Image
* @see https://tailwindcss.com/docs/list-style-image
*/
'list-image': [{ 'list-image': ['none', isArbitraryValue] }],
/**
* List Style Type
* @see https://tailwindcss.com/docs/list-style-type
*/
'list-style-type': [{ list: ['none', 'disc', 'decimal', isArbitraryValue] }],
/**
* List Style Position
* @see https://tailwindcss.com/docs/list-style-position
*/
'list-style-position': [{ list: ['inside', 'outside'] }],
/**
* Placeholder Color
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/placeholder-color
*/
'placeholder-color': [{ placeholder: [colors] }],
/**
* Placeholder Opacity
* @see https://tailwindcss.com/docs/placeholder-opacity
*/
'placeholder-opacity': [{ 'placeholder-opacity': [opacity] }],
/**
* Text Alignment
* @see https://tailwindcss.com/docs/text-align
*/
'text-alignment': [{ text: ['left', 'center', 'right', 'justify', 'start', 'end'] }],
/**
* Text Color
* @see https://tailwindcss.com/docs/text-color
*/
'text-color': [{ text: [colors] }],
/**
* Text Opacity
* @see https://tailwindcss.com/docs/text-opacity
*/
'text-opacity': [{ 'text-opacity': [opacity] }],
/**
* Text Decoration
* @see https://tailwindcss.com/docs/text-decoration
*/
'text-decoration': ['underline', 'overline', 'line-through', 'no-underline'],
/**
* Text Decoration Style
* @see https://tailwindcss.com/docs/text-decoration-style
*/
'text-decoration-style': [{ decoration: [...getLineStyles(), 'wavy'] }],
/**
* Text Decoration Thickness
* @see https://tailwindcss.com/docs/text-decoration-thickness
*/
'text-decoration-thickness': [
{ decoration: ['auto', 'from-font', isLength, isArbitraryLength] },
],
/**
* Text Underline Offset
* @see https://tailwindcss.com/docs/text-underline-offset
*/
'underline-offset': [{ 'underline-offset': ['auto', isLength, isArbitraryValue] }],
/**
* Text Decoration Color
* @see https://tailwindcss.com/docs/text-decoration-color
*/
'text-decoration-color': [{ decoration: [colors] }],
/**
* Text Transform
* @see https://tailwindcss.com/docs/text-transform
*/
'text-transform': ['uppercase', 'lowercase', 'capitalize', 'normal-case'],
/**
* Text Overflow
* @see https://tailwindcss.com/docs/text-overflow
*/
'text-overflow': ['truncate', 'text-ellipsis', 'text-clip'],
/**
* Text Wrap
* @see https://tailwindcss.com/docs/text-wrap
*/
'text-wrap': [{ text: ['wrap', 'nowrap', 'balance', 'pretty'] }],
/**
* Text Indent
* @see https://tailwindcss.com/docs/text-indent
*/
indent: [{ indent: getSpacingWithArbitrary() }],
/**
* Vertical Alignment
* @see https://tailwindcss.com/docs/vertical-align
*/
'vertical-align': [
{
align: [
'baseline',
'top',
'middle',
'bottom',
'text-top',
'text-bottom',
'sub',
'super',
isArbitraryValue,
],
},
],
/**
* Whitespace
* @see https://tailwindcss.com/docs/whitespace
*/
whitespace: [
{ whitespace: ['normal', 'nowrap', 'pre', 'pre-line', 'pre-wrap', 'break-spaces'] },
],
/**
* Word Break
* @see https://tailwindcss.com/docs/word-break
*/
break: [{ break: ['normal', 'words', 'all', 'keep'] }],
/**
* Hyphens
* @see https://tailwindcss.com/docs/hyphens
*/
hyphens: [{ hyphens: ['none', 'manual', 'auto'] }],
/**
* Content
* @see https://tailwindcss.com/docs/content
*/
content: [{ content: ['none', isArbitraryValue] }],
// Backgrounds
/**
* Background Attachment
* @see https://tailwindcss.com/docs/background-attachment
*/
'bg-attachment': [{ bg: ['fixed', 'local', 'scroll'] }],
/**
* Background Clip
* @see https://tailwindcss.com/docs/background-clip
*/
'bg-clip': [{ 'bg-clip': ['border', 'padding', 'content', 'text'] }],
/**
* Background Opacity
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/background-opacity
*/
'bg-opacity': [{ 'bg-opacity': [opacity] }],
/**
* Background Origin
* @see https://tailwindcss.com/docs/background-origin
*/
'bg-origin': [{ 'bg-origin': ['border', 'padding', 'content'] }],
/**
* Background Position
* @see https://tailwindcss.com/docs/background-position
*/
'bg-position': [{ bg: [...getPositions(), isArbitraryPosition] }],
/**
* Background Repeat
* @see https://tailwindcss.com/docs/background-repeat
*/
'bg-repeat': [{ bg: ['no-repeat', { repeat: ['', 'x', 'y', 'round', 'space'] }] }],
/**
* Background Size
* @see https://tailwindcss.com/docs/background-size
*/
'bg-size': [{ bg: ['auto', 'cover', 'contain', isArbitrarySize] }],
/**
* Background Image
* @see https://tailwindcss.com/docs/background-image
*/
'bg-image': [
{
bg: [
'none',
{ 'gradient-to': ['t', 'tr', 'r', 'br', 'b', 'bl', 'l', 'tl'] },
isArbitraryImage,
],
},
],
/**
* Background Color
* @see https://tailwindcss.com/docs/background-color
*/
'bg-color': [{ bg: [colors] }],
/**
* Gradient Color Stops From Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-from-pos': [{ from: [gradientColorStopPositions] }],
/**
* Gradient Color Stops Via Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-via-pos': [{ via: [gradientColorStopPositions] }],
/**
* Gradient Color Stops To Position
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-to-pos': [{ to: [gradientColorStopPositions] }],
/**
* Gradient Color Stops From
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-from': [{ from: [gradientColorStops] }],
/**
* Gradient Color Stops Via
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-via': [{ via: [gradientColorStops] }],
/**
* Gradient Color Stops To
* @see https://tailwindcss.com/docs/gradient-color-stops
*/
'gradient-to': [{ to: [gradientColorStops] }],
// Borders
/**
* Border Radius
* @see https://tailwindcss.com/docs/border-radius
*/
rounded: [{ rounded: [borderRadius] }],
/**
* Border Radius Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-s': [{ 'rounded-s': [borderRadius] }],
/**
* Border Radius End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-e': [{ 'rounded-e': [borderRadius] }],
/**
* Border Radius Top
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-t': [{ 'rounded-t': [borderRadius] }],
/**
* Border Radius Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-r': [{ 'rounded-r': [borderRadius] }],
/**
* Border Radius Bottom
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-b': [{ 'rounded-b': [borderRadius] }],
/**
* Border Radius Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-l': [{ 'rounded-l': [borderRadius] }],
/**
* Border Radius Start Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-ss': [{ 'rounded-ss': [borderRadius] }],
/**
* Border Radius Start End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-se': [{ 'rounded-se': [borderRadius] }],
/**
* Border Radius End End
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-ee': [{ 'rounded-ee': [borderRadius] }],
/**
* Border Radius End Start
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-es': [{ 'rounded-es': [borderRadius] }],
/**
* Border Radius Top Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-tl': [{ 'rounded-tl': [borderRadius] }],
/**
* Border Radius Top Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-tr': [{ 'rounded-tr': [borderRadius] }],
/**
* Border Radius Bottom Right
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-br': [{ 'rounded-br': [borderRadius] }],
/**
* Border Radius Bottom Left
* @see https://tailwindcss.com/docs/border-radius
*/
'rounded-bl': [{ 'rounded-bl': [borderRadius] }],
/**
* Border Width
* @see https://tailwindcss.com/docs/border-width
*/
'border-w': [{ border: [borderWidth] }],
/**
* Border Width X
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-x': [{ 'border-x': [borderWidth] }],
/**
* Border Width Y
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-y': [{ 'border-y': [borderWidth] }],
/**
* Border Width Start
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-s': [{ 'border-s': [borderWidth] }],
/**
* Border Width End
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-e': [{ 'border-e': [borderWidth] }],
/**
* Border Width Top
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-t': [{ 'border-t': [borderWidth] }],
/**
* Border Width Right
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-r': [{ 'border-r': [borderWidth] }],
/**
* Border Width Bottom
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-b': [{ 'border-b': [borderWidth] }],
/**
* Border Width Left
* @see https://tailwindcss.com/docs/border-width
*/
'border-w-l': [{ 'border-l': [borderWidth] }],
/**
* Border Opacity
* @see https://tailwindcss.com/docs/border-opacity
*/
'border-opacity': [{ 'border-opacity': [opacity] }],
/**
* Border Style
* @see https://tailwindcss.com/docs/border-style
*/
'border-style': [{ border: [...getLineStyles(), 'hidden'] }],
/**
* Divide Width X
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-x': [{ 'divide-x': [borderWidth] }],
/**
* Divide Width X Reverse
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-x-reverse': ['divide-x-reverse'],
/**
* Divide Width Y
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-y': [{ 'divide-y': [borderWidth] }],
/**
* Divide Width Y Reverse
* @see https://tailwindcss.com/docs/divide-width
*/
'divide-y-reverse': ['divide-y-reverse'],
/**
* Divide Opacity
* @see https://tailwindcss.com/docs/divide-opacity
*/
'divide-opacity': [{ 'divide-opacity': [opacity] }],
/**
* Divide Style
* @see https://tailwindcss.com/docs/divide-style
*/
'divide-style': [{ divide: getLineStyles() }],
/**
* Border Color
* @see https://tailwindcss.com/docs/border-color
*/
'border-color': [{ border: [borderColor] }],
/**
* Border Color X
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-x': [{ 'border-x': [borderColor] }],
/**
* Border Color Y
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-y': [{ 'border-y': [borderColor] }],
/**
* Border Color S
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-s': [{ 'border-s': [borderColor] }],
/**
* Border Color E
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-e': [{ 'border-e': [borderColor] }],
/**
* Border Color Top
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-t': [{ 'border-t': [borderColor] }],
/**
* Border Color Right
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-r': [{ 'border-r': [borderColor] }],
/**
* Border Color Bottom
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-b': [{ 'border-b': [borderColor] }],
/**
* Border Color Left
* @see https://tailwindcss.com/docs/border-color
*/
'border-color-l': [{ 'border-l': [borderColor] }],
/**
* Divide Color
* @see https://tailwindcss.com/docs/divide-color
*/
'divide-color': [{ divide: [borderColor] }],
/**
* Outline Style
* @see https://tailwindcss.com/docs/outline-style
*/
'outline-style': [{ outline: ['', ...getLineStyles()] }],
/**
* Outline Offset
* @see https://tailwindcss.com/docs/outline-offset
*/
'outline-offset': [{ 'outline-offset': [isLength, isArbitraryValue] }],
/**
* Outline Width
* @see https://tailwindcss.com/docs/outline-width
*/
'outline-w': [{ outline: [isLength, isArbitraryLength] }],
/**
* Outline Color
* @see https://tailwindcss.com/docs/outline-color
*/
'outline-color': [{ outline: [colors] }],
/**
* Ring Width
* @see https://tailwindcss.com/docs/ring-width
*/
'ring-w': [{ ring: getLengthWithEmptyAndArbitrary() }],
/**
* Ring Width Inset
* @see https://tailwindcss.com/docs/ring-width
*/
'ring-w-inset': ['ring-inset'],
/**
* Ring Color
* @see https://tailwindcss.com/docs/ring-color
*/
'ring-color': [{ ring: [colors] }],
/**
* Ring Opacity
* @see https://tailwindcss.com/docs/ring-opacity
*/
'ring-opacity': [{ 'ring-opacity': [opacity] }],
/**
* Ring Offset Width
* @see https://tailwindcss.com/docs/ring-offset-width
*/
'ring-offset-w': [{ 'ring-offset': [isLength, isArbitraryLength] }],
/**
* Ring Offset Color
* @see https://tailwindcss.com/docs/ring-offset-color
*/
'ring-offset-color': [{ 'ring-offset': [colors] }],
// Effects
/**
* Box Shadow
* @see https://tailwindcss.com/docs/box-shadow
*/
shadow: [{ shadow: ['', 'inner', 'none', isTshirtSize, isArbitraryShadow] }],
/**
* Box Shadow Color
* @see https://tailwindcss.com/docs/box-shadow-color
*/
'shadow-color': [{ shadow: [isAny] }],
/**
* Opacity
* @see https://tailwindcss.com/docs/opacity
*/
opacity: [{ opacity: [opacity] }],
/**
* Mix Blend Mode
* @see https://tailwindcss.com/docs/mix-blend-mode
*/
'mix-blend': [{ 'mix-blend': [...getBlendModes(), 'plus-lighter', 'plus-darker'] }],
/**
* Background Blend Mode
* @see https://tailwindcss.com/docs/background-blend-mode
*/
'bg-blend': [{ 'bg-blend': getBlendModes() }],
// Filters
/**
* Filter
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/filter
*/
filter: [{ filter: ['', 'none'] }],
/**
* Blur
* @see https://tailwindcss.com/docs/blur
*/
blur: [{ blur: [blur] }],
/**
* Brightness
* @see https://tailwindcss.com/docs/brightness
*/
brightness: [{ brightness: [brightness] }],
/**
* Contrast
* @see https://tailwindcss.com/docs/contrast
*/
contrast: [{ contrast: [contrast] }],
/**
* Drop Shadow
* @see https://tailwindcss.com/docs/drop-shadow
*/
'drop-shadow': [{ 'drop-shadow': ['', 'none', isTshirtSize, isArbitraryValue] }],
/**
* Grayscale
* @see https://tailwindcss.com/docs/grayscale
*/
grayscale: [{ grayscale: [grayscale] }],
/**
* Hue Rotate
* @see https://tailwindcss.com/docs/hue-rotate
*/
'hue-rotate': [{ 'hue-rotate': [hueRotate] }],
/**
* Invert
* @see https://tailwindcss.com/docs/invert
*/
invert: [{ invert: [invert] }],
/**
* Saturate
* @see https://tailwindcss.com/docs/saturate
*/
saturate: [{ saturate: [saturate] }],
/**
* Sepia
* @see https://tailwindcss.com/docs/sepia
*/
sepia: [{ sepia: [sepia] }],
/**
* Backdrop Filter
* @deprecated since Tailwind CSS v3.0.0
* @see https://tailwindcss.com/docs/backdrop-filter
*/
'backdrop-filter': [{ 'backdrop-filter': ['', 'none'] }],
/**
* Backdrop Blur
* @see https://tailwindcss.com/docs/backdrop-blur
*/
'backdrop-blur': [{ 'backdrop-blur': [blur] }],
/**
* Backdrop Brightness
* @see https://tailwindcss.com/docs/backdrop-brightness
*/
'backdrop-brightness': [{ 'backdrop-brightness': [brightness] }],
/**
* Backdrop Contrast
* @see https://tailwindcss.com/docs/backdrop-contrast
*/
'backdrop-contrast': [{ 'backdrop-contrast': [contrast] }],
/**
* Backdrop Grayscale
* @see https://tailwindcss.com/docs/backdrop-grayscale
*/
'backdrop-grayscale': [{ 'backdrop-grayscale': [grayscale] }],
/**
* Backdrop Hue Rotate
* @see https://tailwindcss.com/docs/backdrop-hue-rotate
*/
'backdrop-hue-rotate': [{ 'backdrop-hue-rotate': [hueRotate] }],
/**
* Backdrop Invert
* @see https://tailwindcss.com/docs/backdrop-invert
*/
'backdrop-invert': [{ 'backdrop-invert': [invert] }],
/**
* Backdrop Opacity
* @see https://tailwindcss.com/docs/backdrop-opacity
*/
'backdrop-opacity': [{ 'backdrop-opacity': [opacity] }],
/**
* Backdrop Saturate
* @see https://tailwindcss.com/docs/backdrop-saturate
*/
'backdrop-saturate': [{ 'backdrop-saturate': [saturate] }],
/**
* Backdrop Sepia
* @see https://tailwindcss.com/docs/backdrop-sepia
*/
'backdrop-sepia': [{ 'backdrop-sepia': [sepia] }],
// Tables
/**
* Border Collapse
* @see https://tailwindcss.com/docs/border-collapse
*/
'border-collapse': [{ border: ['collapse', 'separate'] }],
/**
* Border Spacing
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing': [{ 'border-spacing': [borderSpacing] }],
/**
* Border Spacing X
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing-x': [{ 'border-spacing-x': [borderSpacing] }],
/**
* Border Spacing Y
* @see https://tailwindcss.com/docs/border-spacing
*/
'border-spacing-y': [{ 'border-spacing-y': [borderSpacing] }],
/**
* Table Layout
* @see https://tailwindcss.com/docs/table-layout
*/
'table-layout': [{ table: ['auto', 'fixed'] }],
/**
* Caption Side
* @see https://tailwindcss.com/docs/caption-side
*/
caption: [{ caption: ['top', 'bottom'] }],
// Transitions and Animation
/**
* Tranisition Property
* @see https://tailwindcss.com/docs/transition-property
*/
transition: [
{
transition: [
'none',
'all',
'',
'colors',
'opacity',
'shadow',
'transform',
isArbitraryValue,
],
},
],
/**
* Transition Duration
* @see https://tailwindcss.com/docs/transition-duration
*/
duration: [{ duration: getNumberAndArbitrary() }],
/**
* Transition Timing Function
* @see https://tailwindcss.com/docs/transition-timing-function
*/
ease: [{ ease: ['linear', 'in', 'out', 'in-out', isArbitraryValue] }],
/**
* Transition Delay
* @see https://tailwindcss.com/docs/transition-delay
*/
delay: [{ delay: getNumberAndArbitrary() }],
/**
* Animation
* @see https://tailwindcss.com/docs/animation
*/
animate: [{ animate: ['none', 'spin', 'ping', 'pulse', 'bounce', isArbitraryValue] }],
// Transforms
/**
* Transform
* @see https://tailwindcss.com/docs/transform
*/
transform: [{ transform: ['', 'gpu', 'none'] }],
/**
* Scale
* @see https://tailwindcss.com/docs/scale
*/
scale: [{ scale: [scale] }],
/**
* Scale X
* @see https://tailwindcss.com/docs/scale
*/
'scale-x': [{ 'scale-x': [scale] }],
/**
* Scale Y
* @see https://tailwindcss.com/docs/scale
*/
'scale-y': [{ 'scale-y': [scale] }],
/**
* Rotate
* @see https://tailwindcss.com/docs/rotate
*/
rotate: [{ rotate: [isInteger, isArbitraryValue] }],
/**
* Translate X
* @see https://tailwindcss.com/docs/translate
*/
'translate-x': [{ 'translate-x': [translate] }],
/**
* Translate Y
* @see https://tailwindcss.com/docs/translate
*/
'translate-y': [{ 'translate-y': [translate] }],
/**
* Skew X
* @see https://tailwindcss.com/docs/skew
*/
'skew-x': [{ 'skew-x': [skew] }],
/**
* Skew Y
* @see https://tailwindcss.com/docs/skew
*/
'skew-y': [{ 'skew-y': [skew] }],
/**
* Transform Origin
* @see https://tailwindcss.com/docs/transform-origin
*/
'transform-origin': [
{
origin: [
'center',
'top',
'top-right',
'right',
'bottom-right',
'bottom',
'bottom-left',
'left',
'top-left',
isArbitraryValue,
],
},
],
// Interactivity
/**
* Accent Color
* @see https://tailwindcss.com/docs/accent-color
*/
accent: [{ accent: ['auto', colors] }],
/**
* Appearance
* @see https://tailwindcss.com/docs/appearance
*/
appearance: [{ appearance: ['none', 'auto'] }],
/**
* Cursor
* @see https://tailwindcss.com/docs/cursor
*/
cursor: [
{
cursor: [
'auto',
'default',
'pointer',
'wait',
'text',
'move',
'help',
'not-allowed',
'none',
'context-menu',
'progress',
'cell',
'crosshair',
'vertical-text',
'alias',
'copy',
'no-drop',
'grab',
'grabbing',
'all-scroll',
'col-resize',
'row-resize',
'n-resize',
'e-resize',
's-resize',
'w-resize',
'ne-resize',
'nw-resize',
'se-resize',
'sw-resize',
'ew-resize',
'ns-resize',
'nesw-resize',
'nwse-resize',
'zoom-in',
'zoom-out',
isArbitraryValue,
],
},
],
/**
* Caret Color
* @see https://tailwindcss.com/docs/just-in-time-mode#caret-color-utilities
*/
'caret-color': [{ caret: [colors] }],
/**
* Pointer Events
* @see https://tailwindcss.com/docs/pointer-events
*/
'pointer-events': [{ 'pointer-events': ['none', 'auto'] }],
/**
* Resize
* @see https://tailwindcss.com/docs/resize
*/
resize: [{ resize: ['none', 'y', 'x', ''] }],
/**
* Scroll Behavior
* @see https://tailwindcss.com/docs/scroll-behavior
*/
'scroll-behavior': [{ scroll: ['auto', 'smooth'] }],
/**
* Scroll Margin
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-m': [{ 'scroll-m': getSpacingWithArbitrary() }],
/**
* Scroll Margin X
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mx': [{ 'scroll-mx': getSpacingWithArbitrary() }],
/**
* Scroll Margin Y
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-my': [{ 'scroll-my': getSpacingWithArbitrary() }],
/**
* Scroll Margin Start
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-ms': [{ 'scroll-ms': getSpacingWithArbitrary() }],
/**
* Scroll Margin End
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-me': [{ 'scroll-me': getSpacingWithArbitrary() }],
/**
* Scroll Margin Top
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mt': [{ 'scroll-mt': getSpacingWithArbitrary() }],
/**
* Scroll Margin Right
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mr': [{ 'scroll-mr': getSpacingWithArbitrary() }],
/**
* Scroll Margin Bottom
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-mb': [{ 'scroll-mb': getSpacingWithArbitrary() }],
/**
* Scroll Margin Left
* @see https://tailwindcss.com/docs/scroll-margin
*/
'scroll-ml': [{ 'scroll-ml': getSpacingWithArbitrary() }],
/**
* Scroll Padding
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-p': [{ 'scroll-p': getSpacingWithArbitrary() }],
/**
* Scroll Padding X
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-px': [{ 'scroll-px': getSpacingWithArbitrary() }],
/**
* Scroll Padding Y
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-py': [{ 'scroll-py': getSpacingWithArbitrary() }],
/**
* Scroll Padding Start
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-ps': [{ 'scroll-ps': getSpacingWithArbitrary() }],
/**
* Scroll Padding End
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pe': [{ 'scroll-pe': getSpacingWithArbitrary() }],
/**
* Scroll Padding Top
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pt': [{ 'scroll-pt': getSpacingWithArbitrary() }],
/**
* Scroll Padding Right
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pr': [{ 'scroll-pr': getSpacingWithArbitrary() }],
/**
* Scroll Padding Bottom
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pb': [{ 'scroll-pb': getSpacingWithArbitrary() }],
/**
* Scroll Padding Left
* @see https://tailwindcss.com/docs/scroll-padding
*/
'scroll-pl': [{ 'scroll-pl': getSpacingWithArbitrary() }],
/**
* Scroll Snap Align
* @see https://tailwindcss.com/docs/scroll-snap-align
*/
'snap-align': [{ snap: ['start', 'end', 'center', 'align-none'] }],
/**
* Scroll Snap Stop
* @see https://tailwindcss.com/docs/scroll-snap-stop
*/
'snap-stop': [{ snap: ['normal', 'always'] }],
/**
* Scroll Snap Type
* @see https://tailwindcss.com/docs/scroll-snap-type
*/
'snap-type': [{ snap: ['none', 'x', 'y', 'both'] }],
/**
* Scroll Snap Type Strictness
* @see https://tailwindcss.com/docs/scroll-snap-type
*/
'snap-strictness': [{ snap: ['mandatory', 'proximity'] }],
/**
* Touch Action
* @see https://tailwindcss.com/docs/touch-action
*/
touch: [
{
touch: ['auto', 'none', 'manipulation'],
},
],
/**
* Touch Action X
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-x': [
{
'touch-pan': ['x', 'left', 'right'],
},
],
/**
* Touch Action Y
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-y': [
{
'touch-pan': ['y', 'up', 'down'],
},
],
/**
* Touch Action Pinch Zoom
* @see https://tailwindcss.com/docs/touch-action
*/
'touch-pz': ['touch-pinch-zoom'],
/**
* User Select
* @see https://tailwindcss.com/docs/user-select
*/
select: [{ select: ['none', 'text', 'all', 'auto'] }],
/**
* Will Change
* @see https://tailwindcss.com/docs/will-change
*/
'will-change': [
{ 'will-change': ['auto', 'scroll', 'contents', 'transform', isArbitraryValue] },
],
// SVG
/**
* Fill
* @see https://tailwindcss.com/docs/fill
*/
fill: [{ fill: [colors, 'none'] }],
/**
* Stroke Width
* @see https://tailwindcss.com/docs/stroke-width
*/
'stroke-w': [{ stroke: [isLength, isArbitraryLength, isArbitraryNumber] }],
/**
* Stroke
* @see https://tailwindcss.com/docs/stroke
*/
stroke: [{ stroke: [colors, 'none'] }],
// Accessibility
/**
* Screen Readers
* @see https://tailwindcss.com/docs/screen-readers
*/
sr: ['sr-only', 'not-sr-only'],
/**
* Forced Color Adjust
* @see https://tailwindcss.com/docs/forced-color-adjust
*/
'forced-color-adjust': [{ 'forced-color-adjust': ['auto', 'none'] }],
},
conflictingClassGroups: {
overflow: ['overflow-x', 'overflow-y'],
overscroll: ['overscroll-x', 'overscroll-y'],
inset: ['inset-x', 'inset-y', 'start', 'end', 'top', 'right', 'bottom', 'left'],
'inset-x': ['right', 'left'],
'inset-y': ['top', 'bottom'],
flex: ['basis', 'grow', 'shrink'],
gap: ['gap-x', 'gap-y'],
p: ['px', 'py', 'ps', 'pe', 'pt', 'pr', 'pb', 'pl'],
px: ['pr', 'pl'],
py: ['pt', 'pb'],
m: ['mx', 'my', 'ms', 'me', 'mt', 'mr', 'mb', 'ml'],
mx: ['mr', 'ml'],
my: ['mt', 'mb'],
size: ['w', 'h'],
'font-size': ['leading'],
'fvn-normal': [
'fvn-ordinal',
'fvn-slashed-zero',
'fvn-figure',
'fvn-spacing',
'fvn-fraction',
],
'fvn-ordinal': ['fvn-normal'],
'fvn-slashed-zero': ['fvn-normal'],
'fvn-figure': ['fvn-normal'],
'fvn-spacing': ['fvn-normal'],
'fvn-fraction': ['fvn-normal'],
'line-clamp': ['display', 'overflow'],
rounded: [
'rounded-s',
'rounded-e',
'rounded-t',
'rounded-r',
'rounded-b',
'rounded-l',
'rounded-ss',
'rounded-se',
'rounded-ee',
'rounded-es',
'rounded-tl',
'rounded-tr',
'rounded-br',
'rounded-bl',
],
'rounded-s': ['rounded-ss', 'rounded-es'],
'rounded-e': ['rounded-se', 'rounded-ee'],
'rounded-t': ['rounded-tl', 'rounded-tr'],
'rounded-r': ['rounded-tr', 'rounded-br'],
'rounded-b': ['rounded-br', 'rounded-bl'],
'rounded-l': ['rounded-tl', 'rounded-bl'],
'border-spacing': ['border-spacing-x', 'border-spacing-y'],
'border-w': [
'border-w-s',
'border-w-e',
'border-w-t',
'border-w-r',
'border-w-b',
'border-w-l',
],
'border-w-x': ['border-w-r', 'border-w-l'],
'border-w-y': ['border-w-t', 'border-w-b'],
'border-color': [
'border-color-s',
'border-color-e',
'border-color-t',
'border-color-r',
'border-color-b',
'border-color-l',
],
'border-color-x': ['border-color-r', 'border-color-l'],
'border-color-y': ['border-color-t', 'border-color-b'],
'scroll-m': [
'scroll-mx',
'scroll-my',
'scroll-ms',
'scroll-me',
'scroll-mt',
'scroll-mr',
'scroll-mb',
'scroll-ml',
],
'scroll-mx': ['scroll-mr', 'scroll-ml'],
'scroll-my': ['scroll-mt', 'scroll-mb'],
'scroll-p': [
'scroll-px',
'scroll-py',
'scroll-ps',
'scroll-pe',
'scroll-pt',
'scroll-pr',
'scroll-pb',
'scroll-pl',
],
'scroll-px': ['scroll-pr', 'scroll-pl'],
'scroll-py': ['scroll-pt', 'scroll-pb'],
touch: ['touch-x', 'touch-y', 'touch-pz'],
'touch-x': ['touch'],
'touch-y': ['touch'],
'touch-pz': ['touch'],
},
conflictingClassGroupModifiers: {
'font-size': ['leading'],
},
} as const satisfies Config<DefaultClassGroupIds, DefaultThemeGroupIds>
}
+25
View File
@@ -0,0 +1,25 @@
import { createTailwindMerge } from './create-tailwind-merge'
import { getDefaultConfig } from './default-config'
import { mergeConfigs } from './merge-configs'
import { AnyConfig, ConfigExtension, DefaultClassGroupIds, DefaultThemeGroupIds } from './types'
type CreateConfigSubsequent = (config: AnyConfig) => AnyConfig
export const extendTailwindMerge = <
AdditionalClassGroupIds extends string = never,
AdditionalThemeGroupIds extends string = never,
>(
configExtension:
| ConfigExtension<
DefaultClassGroupIds | AdditionalClassGroupIds,
DefaultThemeGroupIds | AdditionalThemeGroupIds
>
| CreateConfigSubsequent,
...createConfig: CreateConfigSubsequent[]
) =>
typeof configExtension === 'function'
? createTailwindMerge(getDefaultConfig, configExtension, ...createConfig)
: createTailwindMerge(
() => mergeConfigs(getDefaultConfig(), configExtension),
...createConfig,
)
+13
View File
@@ -0,0 +1,13 @@
import { DefaultThemeGroupIds, NoInfer, ThemeGetter, ThemeObject } from './types'
export const fromTheme = <
AdditionalThemeGroupIds extends string = never,
DefaultThemeGroupIdsInner extends string = DefaultThemeGroupIds,
>(key: NoInfer<DefaultThemeGroupIdsInner | AdditionalThemeGroupIds>): ThemeGetter => {
const themeGetter = (theme: ThemeObject<DefaultThemeGroupIdsInner | AdditionalThemeGroupIds>) =>
theme[key] || []
themeGetter.isThemeGetter = true as const
return themeGetter
}
+52
View File
@@ -0,0 +1,52 @@
// Export is needed because TypeScript complains about an error otherwise:
// Error: …/tailwind-merge/src/config-utils.ts(8,17): semantic error TS4058: Return type of exported function has or is using name 'LruCache' from external module "…/tailwind-merge/src/lru-cache" but cannot be named.
export interface LruCache<Key, Value> {
get(key: Key): Value | undefined
set(key: Key, value: Value): void
}
// LRU cache inspired from hashlru (https://github.com/dominictarr/hashlru/blob/v1.0.4/index.js) but object replaced with Map to improve performance
export const createLruCache = <Key, Value>(maxCacheSize: number): LruCache<Key, Value> => {
if (maxCacheSize < 1) {
return {
get: () => undefined,
set: () => {},
}
}
let cacheSize = 0
let cache = new Map<Key, Value>()
let previousCache = new Map<Key, Value>()
const update = (key: Key, value: Value) => {
cache.set(key, value)
cacheSize++
if (cacheSize > maxCacheSize) {
cacheSize = 0
previousCache = cache
cache = new Map()
}
}
return {
get(key) {
let value = cache.get(key)
if (value !== undefined) {
return value
}
if ((value = previousCache.get(key)) !== undefined) {
update(key, value)
return value
}
},
set(key, value) {
if (cache.has(key)) {
cache.set(key, value)
} else {
update(key, value)
}
},
}
}
+78
View File
@@ -0,0 +1,78 @@
import { ConfigUtils } from './config-utils'
import { IMPORTANT_MODIFIER, sortModifiers } from './parse-class-name'
const SPLIT_CLASSES_REGEX = /\s+/
export const mergeClassList = (classList: string, configUtils: ConfigUtils) => {
const { parseClassName, getClassGroupId, getConflictingClassGroupIds } = configUtils
/**
* Set of classGroupIds in following format:
* `{importantModifier}{variantModifiers}{classGroupId}`
* @example 'float'
* @example 'hover:focus:bg-color'
* @example 'md:!pr'
*/
const classGroupsInConflict: string[] = []
const classNames = classList.trim().split(SPLIT_CLASSES_REGEX)
let result = ''
for (let index = classNames.length - 1; index >= 0; index -= 1) {
const originalClassName = classNames[index]!
const { modifiers, hasImportantModifier, baseClassName, maybePostfixModifierPosition } =
parseClassName(originalClassName)
let hasPostfixModifier = Boolean(maybePostfixModifierPosition)
let classGroupId = getClassGroupId(
hasPostfixModifier
? baseClassName.substring(0, maybePostfixModifierPosition)
: baseClassName,
)
if (!classGroupId) {
if (!hasPostfixModifier) {
// Not a Tailwind class
result = originalClassName + (result.length > 0 ? ' ' + result : result)
continue
}
classGroupId = getClassGroupId(baseClassName)
if (!classGroupId) {
// Not a Tailwind class
result = originalClassName + (result.length > 0 ? ' ' + result : result)
continue
}
hasPostfixModifier = false
}
const variantModifier = sortModifiers(modifiers).join(':')
const modifierId = hasImportantModifier
? variantModifier + IMPORTANT_MODIFIER
: variantModifier
const classId = modifierId + classGroupId
if (classGroupsInConflict.includes(classId)) {
// Tailwind class omitted due to conflict
continue
}
classGroupsInConflict.push(classId)
const conflictGroups = getConflictingClassGroupIds(classGroupId, hasPostfixModifier)
for (let i = 0; i < conflictGroups.length; ++i) {
const group = conflictGroups[i]!
classGroupsInConflict.push(modifierId + group)
}
// Tailwind class not in conflict
result = originalClassName + (result.length > 0 ? ' ' + result : result)
}
return result
}
+74
View File
@@ -0,0 +1,74 @@
import { AnyConfig, ConfigExtension } from './types'
/**
* @param baseConfig Config where other config will be merged into. This object will be mutated.
* @param configExtension Partial config to merge into the `baseConfig`.
*/
export const mergeConfigs = <ClassGroupIds extends string, ThemeGroupIds extends string = never>(
baseConfig: AnyConfig,
{
cacheSize,
prefix,
separator,
experimentalParseClassName,
extend = {},
override = {},
}: ConfigExtension<ClassGroupIds, ThemeGroupIds>,
) => {
overrideProperty(baseConfig, 'cacheSize', cacheSize)
overrideProperty(baseConfig, 'prefix', prefix)
overrideProperty(baseConfig, 'separator', separator)
overrideProperty(baseConfig, 'experimentalParseClassName', experimentalParseClassName)
for (const configKey in override) {
overrideConfigProperties(
baseConfig[configKey as keyof typeof override],
override[configKey as keyof typeof override],
)
}
for (const key in extend) {
mergeConfigProperties(
baseConfig[key as keyof typeof extend],
extend[key as keyof typeof extend],
)
}
return baseConfig
}
const overrideProperty = <T extends object, K extends keyof T>(
baseObject: T,
overrideKey: K,
overrideValue: T[K] | undefined,
) => {
if (overrideValue !== undefined) {
baseObject[overrideKey] = overrideValue
}
}
const overrideConfigProperties = (
baseObject: Partial<Record<string, readonly unknown[]>>,
overrideObject: Partial<Record<string, readonly unknown[]>> | undefined,
) => {
if (overrideObject) {
for (const key in overrideObject) {
overrideProperty(baseObject, key, overrideObject[key])
}
}
}
const mergeConfigProperties = (
baseObject: Partial<Record<string, readonly unknown[]>>,
mergeObject: Partial<Record<string, readonly unknown[]>> | undefined,
) => {
if (mergeObject) {
for (const key in mergeObject) {
const mergeValue = mergeObject[key]
if (mergeValue !== undefined) {
baseObject[key] = (baseObject[key] || []).concat(mergeValue)
}
}
}
}
+101
View File
@@ -0,0 +1,101 @@
import { AnyConfig } from './types'
export const IMPORTANT_MODIFIER = '!'
export const createParseClassName = (config: AnyConfig) => {
const { separator, experimentalParseClassName } = config
const isSeparatorSingleCharacter = separator.length === 1
const firstSeparatorCharacter = separator[0]
const separatorLength = separator.length
// parseClassName inspired by https://github.com/tailwindlabs/tailwindcss/blob/v3.2.2/src/util/splitAtTopLevelOnly.js
const parseClassName = (className: string) => {
const modifiers = []
let bracketDepth = 0
let modifierStart = 0
let postfixModifierPosition: number | undefined
for (let index = 0; index < className.length; index++) {
let currentCharacter = className[index]
if (bracketDepth === 0) {
if (
currentCharacter === firstSeparatorCharacter &&
(isSeparatorSingleCharacter ||
className.slice(index, index + separatorLength) === separator)
) {
modifiers.push(className.slice(modifierStart, index))
modifierStart = index + separatorLength
continue
}
if (currentCharacter === '/') {
postfixModifierPosition = index
continue
}
}
if (currentCharacter === '[') {
bracketDepth++
} else if (currentCharacter === ']') {
bracketDepth--
}
}
const baseClassNameWithImportantModifier =
modifiers.length === 0 ? className : className.substring(modifierStart)
const hasImportantModifier =
baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER)
const baseClassName = hasImportantModifier
? baseClassNameWithImportantModifier.substring(1)
: baseClassNameWithImportantModifier
const maybePostfixModifierPosition =
postfixModifierPosition && postfixModifierPosition > modifierStart
? postfixModifierPosition - modifierStart
: undefined
return {
modifiers,
hasImportantModifier,
baseClassName,
maybePostfixModifierPosition,
}
}
if (experimentalParseClassName) {
return (className: string) => experimentalParseClassName({ className, parseClassName })
}
return parseClassName
}
/**
* Sorts modifiers according to following schema:
* - Predefined modifiers are sorted alphabetically
* - When an arbitrary variant appears, it must be preserved which modifiers are before and after it
*/
export const sortModifiers = (modifiers: string[]) => {
if (modifiers.length <= 1) {
return modifiers
}
const sortedModifiers: string[] = []
let unsortedModifiers: string[] = []
modifiers.forEach((modifier) => {
const isArbitraryVariant = modifier[0] === '['
if (isArbitraryVariant) {
sortedModifiers.push(...unsortedModifiers.sort(), modifier)
unsortedModifiers = []
} else {
unsortedModifiers.push(modifier)
}
})
sortedModifiers.push(...unsortedModifiers.sort())
return sortedModifiers
}
+50
View File
@@ -0,0 +1,50 @@
/**
* The code in this file is copied from https://github.com/lukeed/clsx and modified to suit the needs of tailwind-merge better.
*
* Specifically:
* - Runtime code from https://github.com/lukeed/clsx/blob/v1.2.1/src/index.js
* - TypeScript types from https://github.com/lukeed/clsx/blob/v1.2.1/clsx.d.ts
*
* Original code has MIT license: Copyright (c) Luke Edwards <luke.edwards05@gmail.com> (lukeed.com)
*/
export type ClassNameValue = ClassNameArray | string | null | undefined | 0 | 0n | false
type ClassNameArray = ClassNameValue[]
export function twJoin(...classLists: ClassNameValue[]): string
export function twJoin() {
let index = 0
let argument: ClassNameValue
let resolvedValue: string
let string = ''
while (index < arguments.length) {
if ((argument = arguments[index++])) {
if ((resolvedValue = toValue(argument))) {
string && (string += ' ')
string += resolvedValue
}
}
}
return string
}
const toValue = (mix: ClassNameArray | string) => {
if (typeof mix === 'string') {
return mix
}
let resolvedValue: string
let string = ''
for (let k = 0; k < mix.length; k++) {
if (mix[k]) {
if ((resolvedValue = toValue(mix[k] as ClassNameArray | string))) {
string && (string += ' ')
string += resolvedValue
}
}
}
return string
}
+4
View File
@@ -0,0 +1,4 @@
import { createTailwindMerge } from './create-tailwind-merge'
import { getDefaultConfig } from './default-config'
export const twMerge = createTailwindMerge(getDefaultConfig)
+488
View File
@@ -0,0 +1,488 @@
/**
* Type the tailwind-merge configuration adheres to.
*/
export interface Config<ClassGroupIds extends string, ThemeGroupIds extends string>
extends ConfigStaticPart,
ConfigGroupsPart<ClassGroupIds, ThemeGroupIds> {}
/**
* The static part of the tailwind-merge configuration. When merging multiple configurations, the properties of this interface are always overridden.
*/
interface ConfigStaticPart {
/**
* Integer indicating size of LRU cache used for memoizing results.
* - Cache might be up to twice as big as `cacheSize`
* - No cache is used for values <= 0
*/
cacheSize: number
/**
* Prefix added to Tailwind-generated classes
* @see https://tailwindcss.com/docs/configuration#prefix
*/
prefix?: string
/**
* Custom separator for modifiers in Tailwind classes
* @see https://tailwindcss.com/docs/configuration#separator
*/
separator: string
/**
* Allows to customize parsing of individual classes passed to `twMerge`.
* All classes passed to `twMerge` outside of cache hits are passed to this function before it is determined whether the class is a valid Tailwind CSS class.
*
* This is an experimental feature and may introduce breaking changes in any minor version update.
*/
experimentalParseClassName?(param: ExperimentalParseClassNameParam): ExperimentalParsedClassName
}
/**
* Type of param passed to the `experimentalParseClassName` function.
*
* This is an experimental feature and may introduce breaking changes in any minor version update.
*/
export interface ExperimentalParseClassNameParam {
className: string
parseClassName(className: string): ExperimentalParsedClassName
}
/**
* Type of the result returned by the `experimentalParseClassName` function.
*
* This is an experimental feature and may introduce breaking changes in any minor version update.
*/
export interface ExperimentalParsedClassName {
/**
* Modifiers of the class in the order they appear in the class.
*
* @example ['hover', 'dark'] // for `hover:dark:bg-gray-100`
*/
modifiers: string[]
/**
* Whether the class has an `!important` modifier.
*
* @example true // for `hover:dark:!bg-gray-100`
*/
hasImportantModifier: boolean
/**
* Base class without preceding modifiers.
*
* @example 'bg-gray-100' // for `hover:dark:bg-gray-100`
*/
baseClassName: string
/**
* Index position of a possible postfix modifier in the class.
* If the class has no postfix modifier, this is `undefined`.
*
* This property is prefixed with "maybe" because tailwind-merge does not know whether something is a postfix modifier or part of the base class since it's possible to configure Tailwind CSS classes which include a `/` in the base class name.
*
* If a `maybePostfixModifierPosition` is present, tailwind-merge first tries to match the `baseClassName` without the possible postfix modifier to a class group. If tht fails, it tries again with the possible postfix modifier.
*
* @example 11 // for `bg-gray-100/50`
*/
maybePostfixModifierPosition: number | undefined
}
/**
* The dynamic part of the tailwind-merge configuration. When merging multiple configurations, the user can choose to either override or extend the properties of this interface.
*/
interface ConfigGroupsPart<ClassGroupIds extends string, ThemeGroupIds extends string> {
/**
* Theme scales used in classGroups.
* The keys are the same as in the Tailwind config but the values are sometimes defined more broadly.
*/
theme: NoInfer<ThemeObject<ThemeGroupIds>>
/**
* Object with groups of classes.
* @example
* {
* // Creates group of classes `group`, `of` and `classes`
* 'group-id': ['group', 'of', 'classes'],
* // Creates group of classes `look-at-me-other` and `look-at-me-group`.
* 'other-group': [{ 'look-at-me': ['other', 'group']}]
* }
*/
classGroups: NoInfer<Record<ClassGroupIds, ClassGroup<ThemeGroupIds>>>
/**
* Conflicting classes across groups.
* The key is ID of class group which creates conflict, values are IDs of class groups which receive a conflict.
* A class group ID is the key of a class group in classGroups object.
* @example { gap: ['gap-x', 'gap-y'] }
*/
conflictingClassGroups: NoInfer<Partial<Record<ClassGroupIds, readonly ClassGroupIds[]>>>
/**
* Postfix modifiers conflicting with other class groups.
* A class group ID is the key of a class group in classGroups object.
* @example { 'font-size': ['leading'] }
*/
conflictingClassGroupModifiers: NoInfer<
Partial<Record<ClassGroupIds, readonly ClassGroupIds[]>>
>
}
/**
* Type of the configuration object that can be passed to `extendTailwindMerge`.
*/
export interface ConfigExtension<ClassGroupIds extends string, ThemeGroupIds extends string>
extends Partial<ConfigStaticPart> {
override?: PartialPartial<ConfigGroupsPart<ClassGroupIds, ThemeGroupIds>>
extend?: PartialPartial<ConfigGroupsPart<ClassGroupIds, ThemeGroupIds>>
}
type PartialPartial<T> = {
[P in keyof T]?: Partial<T[P]>
}
export type ThemeObject<ThemeGroupIds extends string> = Record<
ThemeGroupIds,
ClassGroup<ThemeGroupIds>
>
export type ClassGroup<ThemeGroupIds extends string> = readonly ClassDefinition<ThemeGroupIds>[]
type ClassDefinition<ThemeGroupIds extends string> =
| string
| ClassValidator
| ThemeGetter
| ClassObject<ThemeGroupIds>
export type ClassValidator = (classPart: string) => boolean
export interface ThemeGetter {
(theme: ThemeObject<AnyThemeGroupIds>): ClassGroup<AnyClassGroupIds>
isThemeGetter: true
}
type ClassObject<ThemeGroupIds extends string> = Record<
string,
readonly ClassDefinition<ThemeGroupIds>[]
>
/**
* Hack from https://stackoverflow.com/questions/56687668/a-way-to-disable-type-argument-inference-in-generics/56688073#56688073
*
* Could be replaced with NoInfer utility type from TypeScript (https://www.typescriptlang.org/docs/handbook/utility-types.html#noinfertype), but that is only supported in TypeScript 5.4 or higher, so I should wait some time before using it.
*/
export type NoInfer<T> = [T][T extends any ? 0 : never]
/**
* Theme group IDs included in the default configuration of tailwind-merge.
*
* If you want to use a scale that is not supported in the `ThemeObject` type,
* consider using `classGroups` instead of `theme`.
*
* @see https://github.com/dcastil/tailwind-merge/blob/main/docs/configuration.md#theme
* (the list of supported keys may vary between `tailwind-merge` versions)
*/
export type DefaultThemeGroupIds =
| 'blur'
| 'borderColor'
| 'borderRadius'
| 'borderSpacing'
| 'borderWidth'
| 'brightness'
| 'colors'
| 'contrast'
| 'gap'
| 'gradientColorStopPositions'
| 'gradientColorStops'
| 'grayscale'
| 'hueRotate'
| 'inset'
| 'invert'
| 'margin'
| 'opacity'
| 'padding'
| 'saturate'
| 'scale'
| 'sepia'
| 'skew'
| 'space'
| 'spacing'
| 'translate'
/**
* Class group IDs included in the default configuration of tailwind-merge.
*/
export type DefaultClassGroupIds =
| 'accent'
| 'align-content'
| 'align-items'
| 'align-self'
| 'animate'
| 'appearance'
| 'aspect'
| 'auto-cols'
| 'auto-rows'
| 'backdrop-blur'
| 'backdrop-brightness'
| 'backdrop-contrast'
| 'backdrop-filter'
| 'backdrop-grayscale'
| 'backdrop-hue-rotate'
| 'backdrop-invert'
| 'backdrop-opacity'
| 'backdrop-saturate'
| 'backdrop-sepia'
| 'basis'
| 'bg-attachment'
| 'bg-blend'
| 'bg-clip'
| 'bg-color'
| 'bg-image'
| 'bg-opacity'
| 'bg-origin'
| 'bg-position'
| 'bg-repeat'
| 'bg-size'
| 'blur'
| 'border-collapse'
| 'border-color-b'
| 'border-color-e'
| 'border-color-l'
| 'border-color-r'
| 'border-color-s'
| 'border-color-t'
| 'border-color-x'
| 'border-color-y'
| 'border-color'
| 'border-opacity'
| 'border-spacing-x'
| 'border-spacing-y'
| 'border-spacing'
| 'border-style'
| 'border-w-b'
| 'border-w-e'
| 'border-w-l'
| 'border-w-r'
| 'border-w-s'
| 'border-w-t'
| 'border-w-x'
| 'border-w-y'
| 'border-w'
| 'bottom'
| 'box-decoration'
| 'box'
| 'break-after'
| 'break-before'
| 'break-inside'
| 'break'
| 'brightness'
| 'caption'
| 'caret-color'
| 'clear'
| 'col-end'
| 'col-start-end'
| 'col-start'
| 'columns'
| 'container'
| 'content'
| 'contrast'
| 'cursor'
| 'delay'
| 'display'
| 'divide-color'
| 'divide-opacity'
| 'divide-style'
| 'divide-x-reverse'
| 'divide-x'
| 'divide-y-reverse'
| 'divide-y'
| 'drop-shadow'
| 'duration'
| 'ease'
| 'end'
| 'fill'
| 'filter'
| 'flex-direction'
| 'flex-wrap'
| 'flex'
| 'float'
| 'font-family'
| 'font-size'
| 'font-smoothing'
| 'font-style'
| 'font-weight'
| 'forced-color-adjust'
| 'fvn-figure'
| 'fvn-fraction'
| 'fvn-normal'
| 'fvn-ordinal'
| 'fvn-slashed-zero'
| 'fvn-spacing'
| 'gap-x'
| 'gap-y'
| 'gap'
| 'gradient-from-pos'
| 'gradient-from'
| 'gradient-to-pos'
| 'gradient-to'
| 'gradient-via-pos'
| 'gradient-via'
| 'grayscale'
| 'grid-cols'
| 'grid-flow'
| 'grid-rows'
| 'grow'
| 'h'
| 'hue-rotate'
| 'hyphens'
| 'indent'
| 'inset-x'
| 'inset-y'
| 'inset'
| 'invert'
| 'isolation'
| 'justify-content'
| 'justify-items'
| 'justify-self'
| 'leading'
| 'left'
| 'line-clamp'
| 'list-image'
| 'list-style-position'
| 'list-style-type'
| 'm'
| 'max-h'
| 'max-w'
| 'mb'
| 'me'
| 'min-h'
| 'min-w'
| 'mix-blend'
| 'ml'
| 'mr'
| 'ms'
| 'mt'
| 'mx'
| 'my'
| 'object-fit'
| 'object-position'
| 'opacity'
| 'order'
| 'outline-color'
| 'outline-offset'
| 'outline-style'
| 'outline-w'
| 'overflow-x'
| 'overflow-y'
| 'overflow'
| 'overscroll-x'
| 'overscroll-y'
| 'overscroll'
| 'p'
| 'pb'
| 'pe'
| 'pl'
| 'place-content'
| 'place-items'
| 'place-self'
| 'placeholder-color'
| 'placeholder-opacity'
| 'pointer-events'
| 'position'
| 'pr'
| 'ps'
| 'pt'
| 'px'
| 'py'
| 'resize'
| 'right'
| 'ring-color'
| 'ring-offset-color'
| 'ring-offset-w'
| 'ring-opacity'
| 'ring-w-inset'
| 'ring-w'
| 'rotate'
| 'rounded-b'
| 'rounded-bl'
| 'rounded-br'
| 'rounded-e'
| 'rounded-ee'
| 'rounded-es'
| 'rounded-l'
| 'rounded-r'
| 'rounded-s'
| 'rounded-se'
| 'rounded-ss'
| 'rounded-t'
| 'rounded-tl'
| 'rounded-tr'
| 'rounded'
| 'row-end'
| 'row-start-end'
| 'row-start'
| 'saturate'
| 'scale-x'
| 'scale-y'
| 'scale'
| 'scroll-behavior'
| 'scroll-m'
| 'scroll-mb'
| 'scroll-me'
| 'scroll-ml'
| 'scroll-mr'
| 'scroll-ms'
| 'scroll-mt'
| 'scroll-mx'
| 'scroll-my'
| 'scroll-p'
| 'scroll-pb'
| 'scroll-pe'
| 'scroll-pl'
| 'scroll-pr'
| 'scroll-ps'
| 'scroll-pt'
| 'scroll-px'
| 'scroll-py'
| 'select'
| 'sepia'
| 'shadow-color'
| 'shadow'
| 'shrink'
| 'size'
| 'skew-x'
| 'skew-y'
| 'snap-align'
| 'snap-stop'
| 'snap-strictness'
| 'snap-type'
| 'space-x-reverse'
| 'space-x'
| 'space-y-reverse'
| 'space-y'
| 'sr'
| 'start'
| 'stroke-w'
| 'stroke'
| 'table-layout'
| 'text-alignment'
| 'text-color'
| 'text-decoration-color'
| 'text-decoration-style'
| 'text-decoration-thickness'
| 'text-decoration'
| 'text-opacity'
| 'text-overflow'
| 'text-transform'
| 'text-wrap'
| 'top'
| 'touch-pz'
| 'touch-x'
| 'touch-y'
| 'touch'
| 'tracking'
| 'transform-origin'
| 'transform'
| 'transition'
| 'translate-x'
| 'translate-y'
| 'underline-offset'
| 'vertical-align'
| 'visibility'
| 'w'
| 'whitespace'
| 'will-change'
| 'z'
export type AnyClassGroupIds = string
export type AnyThemeGroupIds = string
/**
* type of the tailwind-merge configuration that allows for any possible configuration.
*/
export type AnyConfig = Config<AnyClassGroupIds, AnyThemeGroupIds>
+74
View File
@@ -0,0 +1,74 @@
const arbitraryValueRegex = /^\[(?:([a-z-]+):)?(.+)\]$/i
const fractionRegex = /^\d+\/\d+$/
const stringLengths = new Set(['px', 'full', 'screen'])
const tshirtUnitRegex = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/
const lengthUnitRegex =
/\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/
const colorFunctionRegex = /^(rgba?|hsla?|hwb|(ok)?(lab|lch)|color-mix)\(.+\)$/
// Shadow always begins with x and y offset separated by underscore optionally prepended by inset
const shadowRegex = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/
const imageRegex =
/^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/
export const isLength = (value: string) =>
isNumber(value) || stringLengths.has(value) || fractionRegex.test(value)
export const isArbitraryLength = (value: string) =>
getIsArbitraryValue(value, 'length', isLengthOnly)
export const isNumber = (value: string) => Boolean(value) && !Number.isNaN(Number(value))
export const isArbitraryNumber = (value: string) => getIsArbitraryValue(value, 'number', isNumber)
export const isInteger = (value: string) => Boolean(value) && Number.isInteger(Number(value))
export const isPercent = (value: string) => value.endsWith('%') && isNumber(value.slice(0, -1))
export const isArbitraryValue = (value: string) => arbitraryValueRegex.test(value)
export const isTshirtSize = (value: string) => tshirtUnitRegex.test(value)
const sizeLabels = new Set(['length', 'size', 'percentage'])
export const isArbitrarySize = (value: string) => getIsArbitraryValue(value, sizeLabels, isNever)
export const isArbitraryPosition = (value: string) =>
getIsArbitraryValue(value, 'position', isNever)
const imageLabels = new Set(['image', 'url'])
export const isArbitraryImage = (value: string) => getIsArbitraryValue(value, imageLabels, isImage)
export const isArbitraryShadow = (value: string) => getIsArbitraryValue(value, '', isShadow)
export const isAny = () => true
const getIsArbitraryValue = (
value: string,
label: string | Set<string>,
testValue: (value: string) => boolean,
) => {
const result = arbitraryValueRegex.exec(value)
if (result) {
if (result[1]) {
return typeof label === 'string' ? result[1] === label : label.has(result[1])
}
return testValue(result[2]!)
}
return false
}
const isLengthOnly = (value: string) =>
// `colorFunctionRegex` check is necessary because color functions can have percentages in them which which would be incorrectly classified as lengths.
// For example, `hsl(0 0% 0%)` would be classified as a length without this check.
// I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
lengthUnitRegex.test(value) && !colorFunctionRegex.test(value)
const isNever = () => false
const isShadow = (value: string) => shadowRegex.test(value)
const isImage = (value: string) => imageRegex.test(value)