UNPKG

@maizzle/framework

Version:

Maizzle is a framework that helps you quickly build HTML emails with Tailwind CSS.

1,761 lines (1,760 loc) 95.3 kB
import { t as __commonJSMin } from "./chunk-EAsCxrDo.js"; //#region ../../home/cosmin/Work/maizzle/framework/node_modules/tailwind-merge/dist/bundle-cjs.js var require_bundle_cjs = /* @__PURE__ */ __commonJSMin(((exports) => { Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" }); /** * Concatenates two arrays faster than the array spread operator. */ var concatArrays = (array1, array2) => { const combinedArray = new Array(array1.length + array2.length); for (let i = 0; i < array1.length; i++) combinedArray[i] = array1[i]; for (let i = 0; i < array2.length; i++) combinedArray[array1.length + i] = array2[i]; return combinedArray; }; var createClassValidatorObject = (classGroupId, validator) => ({ classGroupId, validator }); var createClassPartObject = (nextPart = /* @__PURE__ */ new Map(), validators = null, classGroupId) => ({ nextPart, validators, classGroupId }); var CLASS_PART_SEPARATOR = "-"; var EMPTY_CONFLICTS = []; var ARBITRARY_PROPERTY_PREFIX = "arbitrary.."; var createClassGroupUtils = (config) => { const classMap = createClassMap(config); const { conflictingClassGroups, conflictingClassGroupModifiers } = config; const getClassGroupId = (className) => { if (className.startsWith("[") && className.endsWith("]")) return getGroupIdForArbitraryProperty(className); const classParts = className.split(CLASS_PART_SEPARATOR); return getGroupRecursive(classParts, classParts[0] === "" && classParts.length > 1 ? 1 : 0, classMap); }; const getConflictingClassGroupIds = (classGroupId, hasPostfixModifier) => { if (hasPostfixModifier) { const modifierConflicts = conflictingClassGroupModifiers[classGroupId]; const baseConflicts = conflictingClassGroups[classGroupId]; if (modifierConflicts) { if (baseConflicts) return concatArrays(baseConflicts, modifierConflicts); return modifierConflicts; } return baseConflicts || EMPTY_CONFLICTS; } return conflictingClassGroups[classGroupId] || EMPTY_CONFLICTS; }; return { getClassGroupId, getConflictingClassGroupIds }; }; var getGroupRecursive = (classParts, startIndex, classPartObject) => { if (classParts.length - startIndex === 0) return classPartObject.classGroupId; const currentClassPart = classParts[startIndex]; const nextClassPartObject = classPartObject.nextPart.get(currentClassPart); if (nextClassPartObject) { const result = getGroupRecursive(classParts, startIndex + 1, nextClassPartObject); if (result) return result; } const validators = classPartObject.validators; if (validators === null) return; const classRest = startIndex === 0 ? classParts.join(CLASS_PART_SEPARATOR) : classParts.slice(startIndex).join(CLASS_PART_SEPARATOR); const validatorsLength = validators.length; for (let i = 0; i < validatorsLength; i++) { const validatorObj = validators[i]; if (validatorObj.validator(classRest)) return validatorObj.classGroupId; } }; /** * Get the class group ID for an arbitrary property. * * @param className - The class name to get the group ID for. Is expected to be string starting with `[` and ending with `]`. */ var getGroupIdForArbitraryProperty = (className) => className.slice(1, -1).indexOf(":") === -1 ? void 0 : (() => { const content = className.slice(1, -1); const colonIndex = content.indexOf(":"); const property = content.slice(0, colonIndex); return property ? ARBITRARY_PROPERTY_PREFIX + property : void 0; })(); /** * Exported for testing only */ var createClassMap = (config) => { const { theme, classGroups } = config; return processClassGroups(classGroups, theme); }; var processClassGroups = (classGroups, theme) => { const classMap = createClassPartObject(); for (const classGroupId in classGroups) { const group = classGroups[classGroupId]; processClassesRecursively(group, classMap, classGroupId, theme); } return classMap; }; var processClassesRecursively = (classGroup, classPartObject, classGroupId, theme) => { const len = classGroup.length; for (let i = 0; i < len; i++) { const classDefinition = classGroup[i]; processClassDefinition(classDefinition, classPartObject, classGroupId, theme); } }; var processClassDefinition = (classDefinition, classPartObject, classGroupId, theme) => { if (typeof classDefinition === "string") { processStringDefinition(classDefinition, classPartObject, classGroupId); return; } if (typeof classDefinition === "function") { processFunctionDefinition(classDefinition, classPartObject, classGroupId, theme); return; } processObjectDefinition(classDefinition, classPartObject, classGroupId, theme); }; var processStringDefinition = (classDefinition, classPartObject, classGroupId) => { const classPartObjectToEdit = classDefinition === "" ? classPartObject : getPart(classPartObject, classDefinition); classPartObjectToEdit.classGroupId = classGroupId; }; var processFunctionDefinition = (classDefinition, classPartObject, classGroupId, theme) => { if (isThemeGetter(classDefinition)) { processClassesRecursively(classDefinition(theme), classPartObject, classGroupId, theme); return; } if (classPartObject.validators === null) classPartObject.validators = []; classPartObject.validators.push(createClassValidatorObject(classGroupId, classDefinition)); }; var processObjectDefinition = (classDefinition, classPartObject, classGroupId, theme) => { const entries = Object.entries(classDefinition); const len = entries.length; for (let i = 0; i < len; i++) { const [key, value] = entries[i]; processClassesRecursively(value, getPart(classPartObject, key), classGroupId, theme); } }; var getPart = (classPartObject, path) => { let current = classPartObject; const parts = path.split(CLASS_PART_SEPARATOR); const len = parts.length; for (let i = 0; i < len; i++) { const part = parts[i]; let next = current.nextPart.get(part); if (!next) { next = createClassPartObject(); current.nextPart.set(part, next); } current = next; } return current; }; var isThemeGetter = (func) => "isThemeGetter" in func && func.isThemeGetter === true; var createLruCache = (maxCacheSize) => { if (maxCacheSize < 1) return { get: () => void 0, set: () => {} }; let cacheSize = 0; let cache = Object.create(null); let previousCache = Object.create(null); const update = (key, value) => { cache[key] = value; cacheSize++; if (cacheSize > maxCacheSize) { cacheSize = 0; previousCache = cache; cache = Object.create(null); } }; return { get(key) { let value = cache[key]; if (value !== void 0) return value; if ((value = previousCache[key]) !== void 0) { update(key, value); return value; } }, set(key, value) { if (key in cache) cache[key] = value; else update(key, value); } }; }; var IMPORTANT_MODIFIER = "!"; var MODIFIER_SEPARATOR = ":"; var EMPTY_MODIFIERS = []; var createResultObject = (modifiers, hasImportantModifier, baseClassName, maybePostfixModifierPosition, isExternal) => ({ modifiers, hasImportantModifier, baseClassName, maybePostfixModifierPosition, isExternal }); var createParseClassName = (config) => { const { prefix, experimentalParseClassName } = config; /** * Parse class name into parts. * * Inspired by `splitAtTopLevelOnly` used in Tailwind CSS * @see https://github.com/tailwindlabs/tailwindcss/blob/v3.2.2/src/util/splitAtTopLevelOnly.js */ let parseClassName = (className) => { const modifiers = []; let bracketDepth = 0; let parenDepth = 0; let modifierStart = 0; let postfixModifierPosition; const len = className.length; for (let index = 0; index < len; index++) { const currentCharacter = className[index]; if (bracketDepth === 0 && parenDepth === 0) { if (currentCharacter === MODIFIER_SEPARATOR) { modifiers.push(className.slice(modifierStart, index)); modifierStart = index + 1; continue; } if (currentCharacter === "/") { postfixModifierPosition = index; continue; } } if (currentCharacter === "[") bracketDepth++; else if (currentCharacter === "]") bracketDepth--; else if (currentCharacter === "(") parenDepth++; else if (currentCharacter === ")") parenDepth--; } const baseClassNameWithImportantModifier = modifiers.length === 0 ? className : className.slice(modifierStart); let baseClassName = baseClassNameWithImportantModifier; let hasImportantModifier = false; if (baseClassNameWithImportantModifier.endsWith(IMPORTANT_MODIFIER)) { baseClassName = baseClassNameWithImportantModifier.slice(0, -1); hasImportantModifier = true; } else if (baseClassNameWithImportantModifier.startsWith(IMPORTANT_MODIFIER)) { baseClassName = baseClassNameWithImportantModifier.slice(1); hasImportantModifier = true; } const maybePostfixModifierPosition = postfixModifierPosition && postfixModifierPosition > modifierStart ? postfixModifierPosition - modifierStart : void 0; return createResultObject(modifiers, hasImportantModifier, baseClassName, maybePostfixModifierPosition); }; if (prefix) { const fullPrefix = prefix + MODIFIER_SEPARATOR; const parseClassNameOriginal = parseClassName; parseClassName = (className) => className.startsWith(fullPrefix) ? parseClassNameOriginal(className.slice(fullPrefix.length)) : createResultObject(EMPTY_MODIFIERS, false, className, void 0, true); } if (experimentalParseClassName) { const parseClassNameOriginal = parseClassName; parseClassName = (className) => experimentalParseClassName({ className, parseClassName: parseClassNameOriginal }); } 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 createSortModifiers = (config) => { const modifierWeights = /* @__PURE__ */ new Map(); config.orderSensitiveModifiers.forEach((mod, index) => { modifierWeights.set(mod, 1e6 + index); }); return (modifiers) => { const result = []; let currentSegment = []; for (let i = 0; i < modifiers.length; i++) { const modifier = modifiers[i]; const isArbitrary = modifier[0] === "["; const isOrderSensitive = modifierWeights.has(modifier); if (isArbitrary || isOrderSensitive) { if (currentSegment.length > 0) { currentSegment.sort(); result.push(...currentSegment); currentSegment = []; } result.push(modifier); } else currentSegment.push(modifier); } if (currentSegment.length > 0) { currentSegment.sort(); result.push(...currentSegment); } return result; }; }; var createConfigUtils = (config) => ({ cache: createLruCache(config.cacheSize), parseClassName: createParseClassName(config), sortModifiers: createSortModifiers(config), postfixLookupClassGroupIds: createPostfixLookupClassGroupIds(config), ...createClassGroupUtils(config) }); var createPostfixLookupClassGroupIds = (config) => { const lookup = Object.create(null); const classGroupIds = config.postfixLookupClassGroups; if (classGroupIds) for (let i = 0; i < classGroupIds.length; i++) lookup[classGroupIds[i]] = true; return lookup; }; var SPLIT_CLASSES_REGEX = /\s+/; var mergeClassList = (classList, configUtils) => { const { parseClassName, getClassGroupId, getConflictingClassGroupIds, sortModifiers, postfixLookupClassGroupIds } = 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 { isExternal, modifiers, hasImportantModifier, baseClassName, maybePostfixModifierPosition } = parseClassName(originalClassName); if (isExternal) { result = originalClassName + (result.length > 0 ? " " + result : result); continue; } let hasPostfixModifier = !!maybePostfixModifierPosition; let classGroupId; if (hasPostfixModifier) { classGroupId = getClassGroupId(baseClassName.substring(0, maybePostfixModifierPosition)); const classGroupIdWithPostfix = classGroupId && postfixLookupClassGroupIds[classGroupId] ? getClassGroupId(baseClassName) : void 0; if (classGroupIdWithPostfix && classGroupIdWithPostfix !== classGroupId) { classGroupId = classGroupIdWithPostfix; hasPostfixModifier = false; } } else classGroupId = getClassGroupId(baseClassName); if (!classGroupId) { if (!hasPostfixModifier) { result = originalClassName + (result.length > 0 ? " " + result : result); continue; } classGroupId = getClassGroupId(baseClassName); if (!classGroupId) { result = originalClassName + (result.length > 0 ? " " + result : result); continue; } hasPostfixModifier = false; } const variantModifier = modifiers.length === 0 ? "" : modifiers.length === 1 ? modifiers[0] : sortModifiers(modifiers).join(":"); const modifierId = hasImportantModifier ? variantModifier + IMPORTANT_MODIFIER : variantModifier; const classId = modifierId + classGroupId; if (classGroupsInConflict.indexOf(classId) > -1) 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); } 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) */ var twJoin = (...classLists) => { let index = 0; let argument; let resolvedValue; let string = ""; while (index < classLists.length) if (argument = classLists[index++]) { if (resolvedValue = toValue(argument)) { string && (string += " "); string += resolvedValue; } } return string; }; var 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; }; var createTailwindMerge = (createConfigFirst, ...createConfigRest) => { let configUtils; let cacheGet; let cacheSet; let functionToCall; const initTailwindMerge = (classList) => { configUtils = createConfigUtils(createConfigRest.reduce((previousConfig, createConfigCurrent) => createConfigCurrent(previousConfig), createConfigFirst())); cacheGet = configUtils.cache.get; cacheSet = configUtils.cache.set; functionToCall = tailwindMerge; return tailwindMerge(classList); }; const tailwindMerge = (classList) => { const cachedResult = cacheGet(classList); if (cachedResult) return cachedResult; const result = mergeClassList(classList, configUtils); cacheSet(classList, result); return result; }; functionToCall = initTailwindMerge; return (...args) => functionToCall(twJoin(...args)); }; var fallbackThemeArr = []; var fromTheme = (key) => { const themeGetter = (theme) => theme[key] || fallbackThemeArr; themeGetter.isThemeGetter = true; return themeGetter; }; var arbitraryValueRegex = /^\[(?:(\w[\w-]*):)?(.+)\]$/i; var arbitraryVariableRegex = /^\((?:(\w[\w-]*):)?(.+)\)$/i; var fractionRegex = /^\d+(?:\.\d+)?\/\d+(?:\.\d+)?$/; 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)\(.+\)$/; 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 isFraction = (value) => fractionRegex.test(value); var isNumber = (value) => !!value && !Number.isNaN(Number(value)); var isInteger = (value) => !!value && Number.isInteger(Number(value)); var isPercent = (value) => value.endsWith("%") && isNumber(value.slice(0, -1)); var isTshirtSize = (value) => tshirtUnitRegex.test(value); var isAny = () => true; var isLengthOnly = (value) => lengthUnitRegex.test(value) && !colorFunctionRegex.test(value); var isNever = () => false; var isShadow = (value) => shadowRegex.test(value); var isImage = (value) => imageRegex.test(value); var isAnyNonArbitrary = (value) => !isArbitraryValue(value) && !isArbitraryVariable(value); var isNamedContainerQuery = (value) => value.startsWith("@container") && (value[10] === "/" && value[11] !== void 0 || value[11] === "s" && value[16] !== void 0 && value.startsWith("-size/", 10) || value[11] === "n" && value[18] !== void 0 && value.startsWith("-normal/", 10)); var isArbitrarySize = (value) => getIsArbitraryValue(value, isLabelSize, isNever); var isArbitraryValue = (value) => arbitraryValueRegex.test(value); var isArbitraryLength = (value) => getIsArbitraryValue(value, isLabelLength, isLengthOnly); var isArbitraryNumber = (value) => getIsArbitraryValue(value, isLabelNumber, isNumber); var isArbitraryWeight = (value) => getIsArbitraryValue(value, isLabelWeight, isAny); var isArbitraryFamilyName = (value) => getIsArbitraryValue(value, isLabelFamilyName, isNever); var isArbitraryPosition = (value) => getIsArbitraryValue(value, isLabelPosition, isNever); var isArbitraryImage = (value) => getIsArbitraryValue(value, isLabelImage, isImage); var isArbitraryShadow = (value) => getIsArbitraryValue(value, isLabelShadow, isShadow); var isArbitraryVariable = (value) => arbitraryVariableRegex.test(value); var isArbitraryVariableLength = (value) => getIsArbitraryVariable(value, isLabelLength); var isArbitraryVariableFamilyName = (value) => getIsArbitraryVariable(value, isLabelFamilyName); var isArbitraryVariablePosition = (value) => getIsArbitraryVariable(value, isLabelPosition); var isArbitraryVariableSize = (value) => getIsArbitraryVariable(value, isLabelSize); var isArbitraryVariableImage = (value) => getIsArbitraryVariable(value, isLabelImage); var isArbitraryVariableShadow = (value) => getIsArbitraryVariable(value, isLabelShadow, true); var isArbitraryVariableWeight = (value) => getIsArbitraryVariable(value, isLabelWeight, true); var getIsArbitraryValue = (value, testLabel, testValue) => { const result = arbitraryValueRegex.exec(value); if (result) { if (result[1]) return testLabel(result[1]); return testValue(result[2]); } return false; }; var getIsArbitraryVariable = (value, testLabel, shouldMatchNoLabel = false) => { const result = arbitraryVariableRegex.exec(value); if (result) { if (result[1]) return testLabel(result[1]); return shouldMatchNoLabel; } return false; }; var isLabelPosition = (label) => label === "position" || label === "percentage"; var isLabelImage = (label) => label === "image" || label === "url"; var isLabelSize = (label) => label === "length" || label === "size" || label === "bg-size"; var isLabelLength = (label) => label === "length"; var isLabelNumber = (label) => label === "number"; var isLabelFamilyName = (label) => label === "family-name"; var isLabelWeight = (label) => label === "number" || label === "weight"; var isLabelShadow = (label) => label === "shadow"; var validators = /*#__PURE__*/ Object.defineProperty({ __proto__: null, isAny, isAnyNonArbitrary, isArbitraryFamilyName, isArbitraryImage, isArbitraryLength, isArbitraryNumber, isArbitraryPosition, isArbitraryShadow, isArbitrarySize, isArbitraryValue, isArbitraryVariable, isArbitraryVariableFamilyName, isArbitraryVariableImage, isArbitraryVariableLength, isArbitraryVariablePosition, isArbitraryVariableShadow, isArbitraryVariableSize, isArbitraryVariableWeight, isArbitraryWeight, isFraction, isInteger, isNamedContainerQuery, isNumber, isPercent, isTshirtSize }, Symbol.toStringTag, { value: "Module" }); var getDefaultConfig = () => { /** * Theme getters for theme variable namespaces * @see https://tailwindcss.com/docs/theme#theme-variable-namespaces */ const themeColor = fromTheme("color"); const themeFont = fromTheme("font"); const themeText = fromTheme("text"); const themeFontWeight = fromTheme("font-weight"); const themeTracking = fromTheme("tracking"); const themeLeading = fromTheme("leading"); const themeBreakpoint = fromTheme("breakpoint"); const themeContainer = fromTheme("container"); const themeSpacing = fromTheme("spacing"); const themeRadius = fromTheme("radius"); const themeShadow = fromTheme("shadow"); const themeInsetShadow = fromTheme("inset-shadow"); const themeTextShadow = fromTheme("text-shadow"); const themeDropShadow = fromTheme("drop-shadow"); const themeBlur = fromTheme("blur"); const themePerspective = fromTheme("perspective"); const themeAspect = fromTheme("aspect"); const themeEase = fromTheme("ease"); const themeAnimate = fromTheme("animate"); /** * Helpers to avoid repeating the same scales * * We use functions that create a new array every time they're called instead of static arrays. * This ensures that users who modify any scale by mutating the array (e.g. with `array.push(element)`) don't accidentally mutate arrays in other parts of the config. */ const scaleBreak = () => [ "auto", "avoid", "all", "avoid-page", "page", "left", "right", "column" ]; const scalePosition = () => [ "center", "top", "bottom", "left", "right", "top-left", "left-top", "top-right", "right-top", "bottom-right", "right-bottom", "bottom-left", "left-bottom" ]; const scalePositionWithArbitrary = () => [ ...scalePosition(), isArbitraryVariable, isArbitraryValue ]; const scaleOverflow = () => [ "auto", "hidden", "clip", "visible", "scroll" ]; const scaleOverscroll = () => [ "auto", "contain", "none" ]; const scaleUnambiguousSpacing = () => [ isArbitraryVariable, isArbitraryValue, themeSpacing ]; const scaleInset = () => [ isFraction, "full", "auto", ...scaleUnambiguousSpacing() ]; const scaleGridTemplateColsRows = () => [ isInteger, "none", "subgrid", isArbitraryVariable, isArbitraryValue ]; const scaleGridColRowStartAndEnd = () => [ "auto", { span: [ "full", isInteger, isArbitraryVariable, isArbitraryValue ] }, isInteger, isArbitraryVariable, isArbitraryValue ]; const scaleGridColRowStartOrEnd = () => [ isInteger, "auto", isArbitraryVariable, isArbitraryValue ]; const scaleGridAutoColsRows = () => [ "auto", "min", "max", "fr", isArbitraryVariable, isArbitraryValue ]; const scaleAlignPrimaryAxis = () => [ "start", "end", "center", "between", "around", "evenly", "stretch", "baseline", "center-safe", "end-safe" ]; const scaleAlignSecondaryAxis = () => [ "start", "end", "center", "stretch", "center-safe", "end-safe" ]; const scaleMargin = () => ["auto", ...scaleUnambiguousSpacing()]; const scaleSizing = () => [ isFraction, "auto", "full", "dvw", "dvh", "lvw", "lvh", "svw", "svh", "min", "max", "fit", ...scaleUnambiguousSpacing() ]; const scaleSizingInline = () => [ isFraction, "screen", "full", "dvw", "lvw", "svw", "min", "max", "fit", ...scaleUnambiguousSpacing() ]; const scaleSizingBlock = () => [ isFraction, "screen", "full", "lh", "dvh", "lvh", "svh", "min", "max", "fit", ...scaleUnambiguousSpacing() ]; const scaleColor = () => [ themeColor, isArbitraryVariable, isArbitraryValue ]; const scaleBgPosition = () => [ ...scalePosition(), isArbitraryVariablePosition, isArbitraryPosition, { position: [isArbitraryVariable, isArbitraryValue] } ]; const scaleBgRepeat = () => ["no-repeat", { repeat: [ "", "x", "y", "space", "round" ] }]; const scaleBgSize = () => [ "auto", "cover", "contain", isArbitraryVariableSize, isArbitrarySize, { size: [isArbitraryVariable, isArbitraryValue] } ]; const scaleGradientStopPosition = () => [ isPercent, isArbitraryVariableLength, isArbitraryLength ]; const scaleRadius = () => [ "", "none", "full", themeRadius, isArbitraryVariable, isArbitraryValue ]; const scaleBorderWidth = () => [ "", isNumber, isArbitraryVariableLength, isArbitraryLength ]; const scaleLineStyle = () => [ "solid", "dashed", "dotted", "double" ]; const scaleBlendMode = () => [ "normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity" ]; const scaleMaskImagePosition = () => [ isNumber, isPercent, isArbitraryVariablePosition, isArbitraryPosition ]; const scaleBlur = () => [ "", "none", themeBlur, isArbitraryVariable, isArbitraryValue ]; const scaleRotate = () => [ "none", isNumber, isArbitraryVariable, isArbitraryValue ]; const scaleScale = () => [ "none", isNumber, isArbitraryVariable, isArbitraryValue ]; const scaleSkew = () => [ isNumber, isArbitraryVariable, isArbitraryValue ]; const scaleTranslate = () => [ isFraction, "full", ...scaleUnambiguousSpacing() ]; return { cacheSize: 500, theme: { animate: [ "spin", "ping", "pulse", "bounce" ], aspect: ["video"], blur: [isTshirtSize], breakpoint: [isTshirtSize], color: [isAny], container: [isTshirtSize], "drop-shadow": [isTshirtSize], ease: [ "in", "out", "in-out" ], font: [isAnyNonArbitrary], "font-weight": [ "thin", "extralight", "light", "normal", "medium", "semibold", "bold", "extrabold", "black" ], "inset-shadow": [isTshirtSize], leading: [ "none", "tight", "snug", "normal", "relaxed", "loose" ], perspective: [ "dramatic", "near", "normal", "midrange", "distant", "none" ], radius: [isTshirtSize], shadow: [isTshirtSize], spacing: ["px", isNumber], text: [isTshirtSize], "text-shadow": [isTshirtSize], tracking: [ "tighter", "tight", "normal", "wide", "wider", "widest" ] }, classGroups: { /** * Aspect Ratio * @see https://tailwindcss.com/docs/aspect-ratio */ aspect: [{ aspect: [ "auto", "square", isFraction, isArbitraryValue, isArbitraryVariable, themeAspect ] }], /** * Container * @see https://tailwindcss.com/docs/container * @deprecated since Tailwind CSS v4.0.0 */ container: ["container"], /** * Container Type * @see https://tailwindcss.com/docs/responsive-design#container-queries */ "container-type": [{ "@container": [ "", "normal", "size", isArbitraryVariable, isArbitraryValue ] }], /** * Container Name * @see https://tailwindcss.com/docs/responsive-design#named-containers */ "container-named": [isNamedContainerQuery], /** * Columns * @see https://tailwindcss.com/docs/columns */ columns: [{ columns: [ isNumber, isArbitraryValue, isArbitraryVariable, themeContainer ] }], /** * Break After * @see https://tailwindcss.com/docs/break-after */ "break-after": [{ "break-after": scaleBreak() }], /** * Break Before * @see https://tailwindcss.com/docs/break-before */ "break-before": [{ "break-before": scaleBreak() }], /** * 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" ], /** * Screen Reader Only * @see https://tailwindcss.com/docs/display#screen-reader-only */ sr: ["sr-only", "not-sr-only"], /** * 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: scalePositionWithArbitrary() }], /** * Overflow * @see https://tailwindcss.com/docs/overflow */ overflow: [{ overflow: scaleOverflow() }], /** * Overflow X * @see https://tailwindcss.com/docs/overflow */ "overflow-x": [{ "overflow-x": scaleOverflow() }], /** * Overflow Y * @see https://tailwindcss.com/docs/overflow */ "overflow-y": [{ "overflow-y": scaleOverflow() }], /** * Overscroll Behavior * @see https://tailwindcss.com/docs/overscroll-behavior */ overscroll: [{ overscroll: scaleOverscroll() }], /** * Overscroll Behavior X * @see https://tailwindcss.com/docs/overscroll-behavior */ "overscroll-x": [{ "overscroll-x": scaleOverscroll() }], /** * Overscroll Behavior Y * @see https://tailwindcss.com/docs/overscroll-behavior */ "overscroll-y": [{ "overscroll-y": scaleOverscroll() }], /** * Position * @see https://tailwindcss.com/docs/position */ position: [ "static", "fixed", "absolute", "relative", "sticky" ], /** * Inset * @see https://tailwindcss.com/docs/top-right-bottom-left */ inset: [{ inset: scaleInset() }], /** * Inset Inline * @see https://tailwindcss.com/docs/top-right-bottom-left */ "inset-x": [{ "inset-x": scaleInset() }], /** * Inset Block * @see https://tailwindcss.com/docs/top-right-bottom-left */ "inset-y": [{ "inset-y": scaleInset() }], /** * Inset Inline Start * @see https://tailwindcss.com/docs/top-right-bottom-left * @todo class group will be renamed to `inset-s` in next major release */ start: [{ "inset-s": scaleInset(), /** * @deprecated since Tailwind CSS v4.2.0 in favor of `inset-s-*` utilities. * @see https://github.com/tailwindlabs/tailwindcss/pull/19613 */ start: scaleInset() }], /** * Inset Inline End * @see https://tailwindcss.com/docs/top-right-bottom-left * @todo class group will be renamed to `inset-e` in next major release */ end: [{ "inset-e": scaleInset(), /** * @deprecated since Tailwind CSS v4.2.0 in favor of `inset-e-*` utilities. * @see https://github.com/tailwindlabs/tailwindcss/pull/19613 */ end: scaleInset() }], /** * Inset Block Start * @see https://tailwindcss.com/docs/top-right-bottom-left */ "inset-bs": [{ "inset-bs": scaleInset() }], /** * Inset Block End * @see https://tailwindcss.com/docs/top-right-bottom-left */ "inset-be": [{ "inset-be": scaleInset() }], /** * Top * @see https://tailwindcss.com/docs/top-right-bottom-left */ top: [{ top: scaleInset() }], /** * Right * @see https://tailwindcss.com/docs/top-right-bottom-left */ right: [{ right: scaleInset() }], /** * Bottom * @see https://tailwindcss.com/docs/top-right-bottom-left */ bottom: [{ bottom: scaleInset() }], /** * Left * @see https://tailwindcss.com/docs/top-right-bottom-left */ left: [{ left: scaleInset() }], /** * Visibility * @see https://tailwindcss.com/docs/visibility */ visibility: [ "visible", "invisible", "collapse" ], /** * Z-Index * @see https://tailwindcss.com/docs/z-index */ z: [{ z: [ isInteger, "auto", isArbitraryVariable, isArbitraryValue ] }], /** * Flex Basis * @see https://tailwindcss.com/docs/flex-basis */ basis: [{ basis: [ isFraction, "full", "auto", themeContainer, ...scaleUnambiguousSpacing() ] }], /** * 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: [ "nowrap", "wrap", "wrap-reverse" ] }], /** * Flex * @see https://tailwindcss.com/docs/flex */ flex: [{ flex: [ isNumber, isFraction, "auto", "initial", "none", isArbitraryValue ] }], /** * Flex Grow * @see https://tailwindcss.com/docs/flex-grow */ grow: [{ grow: [ "", isNumber, isArbitraryVariable, isArbitraryValue ] }], /** * Flex Shrink * @see https://tailwindcss.com/docs/flex-shrink */ shrink: [{ shrink: [ "", isNumber, isArbitraryVariable, isArbitraryValue ] }], /** * Order * @see https://tailwindcss.com/docs/order */ order: [{ order: [ isInteger, "first", "last", "none", isArbitraryVariable, isArbitraryValue ] }], /** * Grid Template Columns * @see https://tailwindcss.com/docs/grid-template-columns */ "grid-cols": [{ "grid-cols": scaleGridTemplateColsRows() }], /** * Grid Column Start / End * @see https://tailwindcss.com/docs/grid-column */ "col-start-end": [{ col: scaleGridColRowStartAndEnd() }], /** * Grid Column Start * @see https://tailwindcss.com/docs/grid-column */ "col-start": [{ "col-start": scaleGridColRowStartOrEnd() }], /** * Grid Column End * @see https://tailwindcss.com/docs/grid-column */ "col-end": [{ "col-end": scaleGridColRowStartOrEnd() }], /** * Grid Template Rows * @see https://tailwindcss.com/docs/grid-template-rows */ "grid-rows": [{ "grid-rows": scaleGridTemplateColsRows() }], /** * Grid Row Start / End * @see https://tailwindcss.com/docs/grid-row */ "row-start-end": [{ row: scaleGridColRowStartAndEnd() }], /** * Grid Row Start * @see https://tailwindcss.com/docs/grid-row */ "row-start": [{ "row-start": scaleGridColRowStartOrEnd() }], /** * Grid Row End * @see https://tailwindcss.com/docs/grid-row */ "row-end": [{ "row-end": scaleGridColRowStartOrEnd() }], /** * 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": scaleGridAutoColsRows() }], /** * Grid Auto Rows * @see https://tailwindcss.com/docs/grid-auto-rows */ "auto-rows": [{ "auto-rows": scaleGridAutoColsRows() }], /** * Gap * @see https://tailwindcss.com/docs/gap */ gap: [{ gap: scaleUnambiguousSpacing() }], /** * Gap X * @see https://tailwindcss.com/docs/gap */ "gap-x": [{ "gap-x": scaleUnambiguousSpacing() }], /** * Gap Y * @see https://tailwindcss.com/docs/gap */ "gap-y": [{ "gap-y": scaleUnambiguousSpacing() }], /** * Justify Content * @see https://tailwindcss.com/docs/justify-content */ "justify-content": [{ justify: [...scaleAlignPrimaryAxis(), "normal"] }], /** * Justify Items * @see https://tailwindcss.com/docs/justify-items */ "justify-items": [{ "justify-items": [...scaleAlignSecondaryAxis(), "normal"] }], /** * Justify Self * @see https://tailwindcss.com/docs/justify-self */ "justify-self": [{ "justify-self": ["auto", ...scaleAlignSecondaryAxis()] }], /** * Align Content * @see https://tailwindcss.com/docs/align-content */ "align-content": [{ content: ["normal", ...scaleAlignPrimaryAxis()] }], /** * Align Items * @see https://tailwindcss.com/docs/align-items */ "align-items": [{ items: [...scaleAlignSecondaryAxis(), { baseline: ["", "last"] }] }], /** * Align Self * @see https://tailwindcss.com/docs/align-self */ "align-self": [{ self: [ "auto", ...scaleAlignSecondaryAxis(), { baseline: ["", "last"] } ] }], /** * Place Content * @see https://tailwindcss.com/docs/place-content */ "place-content": [{ "place-content": scaleAlignPrimaryAxis() }], /** * Place Items * @see https://tailwindcss.com/docs/place-items */ "place-items": [{ "place-items": [...scaleAlignSecondaryAxis(), "baseline"] }], /** * Place Self * @see https://tailwindcss.com/docs/place-self */ "place-self": [{ "place-self": ["auto", ...scaleAlignSecondaryAxis()] }], /** * Padding * @see https://tailwindcss.com/docs/padding */ p: [{ p: scaleUnambiguousSpacing() }], /** * Padding Inline * @see https://tailwindcss.com/docs/padding */ px: [{ px: scaleUnambiguousSpacing() }], /** * Padding Block * @see https://tailwindcss.com/docs/padding */ py: [{ py: scaleUnambiguousSpacing() }], /** * Padding Inline Start * @see https://tailwindcss.com/docs/padding */ ps: [{ ps: scaleUnambiguousSpacing() }], /** * Padding Inline End * @see https://tailwindcss.com/docs/padding */ pe: [{ pe: scaleUnambiguousSpacing() }], /** * Padding Block Start * @see https://tailwindcss.com/docs/padding */ pbs: [{ pbs: scaleUnambiguousSpacing() }], /** * Padding Block End * @see https://tailwindcss.com/docs/padding */ pbe: [{ pbe: scaleUnambiguousSpacing() }], /** * Padding Top * @see https://tailwindcss.com/docs/padding */ pt: [{ pt: scaleUnambiguousSpacing() }], /** * Padding Right * @see https://tailwindcss.com/docs/padding */ pr: [{ pr: scaleUnambiguousSpacing() }], /** * Padding Bottom * @see https://tailwindcss.com/docs/padding */ pb: [{ pb: scaleUnambiguousSpacing() }], /** * Padding Left * @see https://tailwindcss.com/docs/padding */ pl: [{ pl: scaleUnambiguousSpacing() }], /** * Margin * @see https://tailwindcss.com/docs/margin */ m: [{ m: scaleMargin() }], /** * Margin Inline * @see https://tailwindcss.com/docs/margin */ mx: [{ mx: scaleMargin() }], /** * Margin Block * @see https://tailwindcss.com/docs/margin */ my: [{ my: scaleMargin() }], /** * Margin Inline Start * @see https://tailwindcss.com/docs/margin */ ms: [{ ms: scaleMargin() }], /** * Margin Inline End * @see https://tailwindcss.com/docs/margin */ me: [{ me: scaleMargin() }], /** * Margin Block Start * @see https://tailwindcss.com/docs/margin */ mbs: [{ mbs: scaleMargin() }], /** * Margin Block End * @see https://tailwindcss.com/docs/margin */ mbe: [{ mbe: scaleMargin() }], /** * Margin Top * @see https://tailwindcss.com/docs/margin */ mt: [{ mt: scaleMargin() }], /** * Margin Right * @see https://tailwindcss.com/docs/margin */ mr: [{ mr: scaleMargin() }], /** * Margin Bottom * @see https://tailwindcss.com/docs/margin */ mb: [{ mb: scaleMargin() }], /** * Margin Left * @see https://tailwindcss.com/docs/margin */ ml: [{ ml: scaleMargin() }], /** * Space Between X * @see https://tailwindcss.com/docs/margin#adding-space-between-children */ "space-x": [{ "space-x": scaleUnambiguousSpacing() }], /** * Space Between X Reverse * @see https://tailwindcss.com/docs/margin#adding-space-between-children */ "space-x-reverse": ["space-x-reverse"], /** * Space Between Y * @see https://tailwindcss.com/docs/margin#adding-space-between-children */ "space-y": [{ "space-y": scaleUnambiguousSpacing() }], /** * Space Between Y Reverse * @see https://tailwindcss.com/docs/margin#adding-space-between-children */ "space-y-reverse": ["space-y-reverse"], /** * Size * @see https://tailwindcss.com/docs/width#setting-both-width-and-height */ size: [{ size: scaleSizing() }], /** * Inline Size * @see https://tailwindcss.com/docs/width */ "inline-size": [{ inline: ["auto", ...scaleSizingInline()] }], /** * Min-Inline Size * @see https://tailwindcss.com/docs/min-width */ "min-inline-size": [{ "min-inline": ["auto", ...scaleSizingInline()] }], /** * Max-Inline Size * @see https://tailwindcss.com/docs/max-width */ "max-inline-size": [{ "max-inline": ["none", ...scaleSizingInline()] }], /** * Block Size * @see https://tailwindcss.com/docs/height */ "block-size": [{ block: ["auto", ...scaleSizingBlock()] }], /** * Min-Block Size * @see https://tailwindcss.com/docs/min-height */ "min-block-size": [{ "min-block": ["auto", ...scaleSizingBlock()] }], /** * Max-Block Size * @see https://tailwindcss.com/docs/max-height */ "max-block-size": [{ "max-block": ["none", ...scaleSizingBlock()] }], /** * Width * @see https://tailwindcss.com/docs/width */ w: [{ w: [ themeContainer, "screen", ...scaleSizing() ] }], /** * Min-Width * @see https://tailwindcss.com/docs/min-width */ "min-w": [{ "min-w": [ themeContainer, "screen", "none", ...scaleSizing() ] }], /** * Max-Width * @see https://tailwindcss.com/docs/max-width */ "max-w": [{ "max-w": [ themeContainer, "screen", "none", "prose", { screen: [themeBreakpoint] }, ...scaleSizing() ] }], /** * Height * @see https://tailwindcss.com/docs/height */ h: [{ h: [ "screen", "lh", ...scaleSizing() ] }], /** * Min-Height * @see https://tailwindcss.com/docs/min-height */ "min-h": [{ "min-h": [ "screen", "lh", "none", ...scaleSizing() ] }], /** * Max-Height * @see https://tailwindcss.com/docs/max-height */ "max-h": [{ "max-h": [ "screen", "lh", ...scaleSizing() ] }], /** * Font Size * @see https://tailwindcss.com/docs/font-size */ "font-size": [{ text: [ "base", themeText, isArbitraryVariableLength, 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: [ themeFontWeight, isArbitraryVariableWeight, isArbitraryWeight ] }], /** * Font Stretch * @see https://tailwindcss.com/docs/font-stretch */ "font-stretch": [{ "font-stretch": [ "ultra-condensed", "extra-condensed", "condensed", "semi-condensed", "normal", "semi-expanded", "expanded", "extra-expanded", "ultra-expanded", isPercent, isArbitraryValue ] }], /** * Font Family * @see https://tailwindcss.com/docs/font-family */ "font-family": [{ font: [ isArbitraryVariableFamilyName, isArbitraryFamilyName, themeFont ] }], /** * Font Feature Settings * @see https://tailwindcss.com/docs/font-feature-settings */ "font-features": [{ "font-features": [isArbitraryValue] }], /** * 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: [ themeTracking, isArbitraryVariable, isArbitraryValue ] }], /** * Line Clamp * @see https://tailwindcss.com/docs/line-clamp */ "line-clamp": [{ "line-clamp": [ isNumber, "none", isArbitraryVariable, isArbitraryNumber ] }], /** * Line Height * @see https://tailwindcss.com/docs/line-height */ leading: [{ leading: [themeLeading, ...scaleUnambiguousSpacing()] }], /** * List Style Image * @see https://tailwindcss.com/docs/list-style-image */ "list-image": [{ "list-image": [ "none", isArbitraryVariable, isArbitraryValue ] }], /** * List Style Position * @see https://tailwindcss.com/docs/list-style-position */ "list-style-position": [{ list: ["inside", "outside"] }], /** * List Style Type * @see https://tailwindcss.com/docs/list-style-type */ "list-style-type": [{ list: [ "disc", "decimal", "none", isArbitraryVariable, isArbitraryValue ] }], /** * Text Alignment * @see https://tailwindcss.com/docs/text-align */ "text-alignment": [{ text: [ "left", "center", "right", "justify", "start", "end" ] }], /** * Placeholder Color * @deprecated since Tailwind CSS v3.0.0 * @see https://v3.tailwindcss.com/docs/placeholder-color */ "placeholder-color": [{ placeholder: scaleColor() }], /** * Text Color * @see https://tailwindcss.com/docs/text-color */ "text-color": [{ text: scaleColor() }], /** * 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: [...scaleLineStyle(), "wavy"] }], /** * Text Decoration Thickness * @see https://tailwindcss.com/docs/text-decoration-thickness */ "text-decoration-thickness": [{ decoration: [ isNumber, "from-font", "auto", isArbitraryVariable, isArbitraryLength ] }], /** * Text Decoration Color * @see https://tailwindcss.com/docs/text-decoration-color */ "text-decoration-color": [{ decoration: scaleColor() }], /** * Text Underline Offset * @see https://tailwindcss.com/docs/text-underline-offset */ "underline-offset": [{ "underline-offset": [ isNumber, "auto", isArbitraryVariable, isArbitraryValue ] }], /** * Text Transform * @see https://tailwindcss.com/docs/text-transform */ "text-transform": [ "uppercase",